/* ==========================================================================
   apple.css (1 oct 2026, 5ta ronda). Luis: "desde Social Media en adelante
   todo se ve raro, muy fuerte, colores raros; el inicio se ve más Apple,
   más limpio". Esta hoja lleva el lenguaje del inicio a las páginas de
   servicio y a consulta, sin tocar sus heros: secciones
   como paneles suaves sin líneas divisorias, acento lima más claro y
   tarjetas sin bordes. Se carga DESPUÉS del <style> de cada página para
   ganarle a sus reglas. El inicio (index.html) no la usa.
   ========================================================================== */

/* -- acento de los títulos: lima claro, sin el verde oliva oscuro -- */
.grad-anim { background-image: linear-gradient(100deg, #7DAA1F, #98C834, #AEDB45, #98C834, #7DAA1F); }


/* -- secciones: paneles redondeados como el inicio, sin líneas -- */
.sv { border-top: 0; }
.sv.alt { margin: 0 64px; border-radius: 44px; background: #F5F5F7; }
.sv + .sv, .sv + section, section + .sv { margin-top: 0; }
.sv.alt + .sv.alt { margin-top: 16px; }
@media (max-width: 760px) { .sv.alt { margin: 0 16px; border-radius: 28px; } }

/* -- títulos de sección: peso más liviano, como el inicio -- */
.sv-head h2 { font-weight: 500; letter-spacing: -.035em; }
.sv-head p { color: var(--text-dim); }

/* -- tarjetas: sin bordes, esquinas más grandes y sombra suave -- */
.sv-card { border-color: transparent; border-radius: 28px; }
.sv:not(.alt) .sv-card { background: #F5F5F7; }
.sv.alt .sv-card { background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.sv-card:hover { box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -36px rgba(17,17,17,.3); }
.sv-canvas { border-color: transparent; border-radius: 20px; }
.sv.alt .sv-canvas { background: #F5F5F7; }
.sv:not(.alt) .sv-canvas { background: #fff; }

/* -- "Diseño que se mueve": negro de lado a lado (7ma ronda, pedido de Luis) -- */
#social-content.sv.alt { margin: 0; border-radius: 0; background: var(--brand-black); padding: 0; }
.sv-island { margin: 0; border-radius: 0; background: var(--brand-black); padding: 104px 32px; }
@media (max-width: 760px) { .sv-island { margin: 0; border-radius: 0; padding: 72px 20px; } }

/* -- mini apps: insignias de color más suaves -- */
.ax-pill.green { background: rgba(52,199,89,.12); }
.ax-pill.red { background: rgba(255,59,48,.1); }

/* -- footer: blanco y limpio como el inicio -- */
.footer { border-top: 0; }

/* -- tarjetas propias de Social Media y Web en el mismo molde -- */
.sv-dg-card { background: #F5F5F7; border-color: transparent; border-radius: 32px; box-shadow: none; }
.sv-dg-card .sv-mfig { background: transparent; }
.sv-flow-row { background: #F5F5F7; border-color: transparent; box-shadow: none; border-radius: 28px; }
.fcol { border-color: transparent; border-radius: 32px; background: #F5F5F7; box-shadow: none; }
.fcol .fstage { background-color: #fff; }
.sv.alt .sv-dg-card, .sv.alt .sv-flow-row { background: #fff; }
.sv.alt .sv-dg-card .sv-mfig { background: transparent; }

/* -- Web: la escena de cielo va de lado a lado, fuera del panel -- */
#responsive.sv.alt { margin: 0; border-radius: 0; background: none; }

/* -- consulta: el costado en claro, sin bloque negro -- */
.cs-aside { background: #F5F5F7; color: var(--text); }
.cs-aside li > span { background: var(--brand-black); color: var(--accent-lime); }
.cs-aside li p { color: var(--text-dim); }
.cs-facts { border-top-color: var(--border); }
.cs-facts span { background: #fff; color: var(--text); }
.form-card { background: #fff; border-color: transparent; border-radius: 32px; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -40px rgba(17,17,17,.3); }
.sv.alt .sv-orders .ord .bubble { background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 14px 30px -22px rgba(17,17,17,.3); }

/* -- 6ta ronda: menos negro, como las tarjetas del inicio -- */
.fhead .ic, .ax-app.dark { background: #EEF0F3; color: var(--text); }
.fhead b em { background: #EEF0F3; color: var(--text-dim); }
.wo-col.one { background: #fff; color: var(--text); box-shadow: 0 0 0 2px var(--accent-lime), 0 24px 50px -36px rgba(17,17,17,.35); }
.wo-col.one li i { background: var(--accent-lime); color: var(--brand-black); }
.wo-col.sep { background: #F5F5F7; border-color: transparent; }

/* ==========================================================================
   7ma ronda (1 oct 2026): Luis pidió simplicidad en todos los gráficos,
   "que parezca del mismísimo Apple", con poco texto.
   ========================================================================== */

/* -- Social Media: una sola tarjeta para crear y adaptar -- */
.sv-dg-one { max-width: 860px; margin: 56px auto 0; border-radius: 32px; background: #fff; overflow: hidden;
  box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.sv-dg-one .sv-mfig { display: flex; align-items: center; justify-content: center; min-height: 300px; padding: 56px 32px 36px; background: #F5F5F7; margin: 10px 10px 0; border-radius: 24px; }
.sv-dg-one .sv-mtext { padding: 28px 36px 34px; text-align: center; }
.sv-dg-one .sv-mtext h3 { font-size: 24px; font-weight: 500; letter-spacing: -.02em; }
.sv-dg-one .sv-mtext p { margin-top: 8px; font-size: 16px; color: var(--text-dim); }
.dz-formats .post { box-shadow: 0 0 0 1px var(--border), 0 22px 40px -16px rgba(17,17,17,.4); }
.dz-sel { position: absolute; left: 6px; right: 14px; bottom: 33px; height: 14px; border: 1.5px solid #3A82DE; border-radius: 2px; pointer-events: none; }
.dz-sel b { position: absolute; width: 5px; height: 5px; background: #fff; border: 1.5px solid #3A82DE; }
.dz-sel b:nth-child(1) { top: -3.5px; left: -3.5px; } .dz-sel b:nth-child(2) { top: -3.5px; right: -3.5px; }
.dz-sel b:nth-child(3) { bottom: -3.5px; left: -3.5px; } .dz-sel b:nth-child(4) { bottom: -3.5px; right: -3.5px; }

/* -- Social Media: chat en vez del calendario -- */
.pub-chat { width: 100%; max-width: 400px; margin: 44px auto 0; padding: 22px 18px 16px; border-radius: 28px; background: #fff; text-align: left;
  display: flex; flex-direction: column; gap: 8px; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -40px rgba(17,17,17,.35); }
.pub-chat .msg { max-width: 78%; padding: 10px 14px; border-radius: 20px; font-size: 15px; line-height: 1.35; }
.pub-chat .me { align-self: flex-end; background: #0A84FF; color: #fff; border-bottom-right-radius: 6px; }
.pub-chat .them { align-self: flex-start; background: #E9E9EB; color: var(--text); border-bottom-left-radius: 6px; }
.pub-post { position: relative; margin-top: 9px; width: 190px; height: 140px; border-radius: 14px; overflow: hidden; }
.pub-post svg.ph { display: block; width: 100%; height: 100%; }
.pub-post .ok { position: absolute; left: 8px; top: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px 4px 6px; border-radius: 99px; background: #fff; font-size: 11px; font-weight: 600; color: #1F7A45; }
.pub-post .ok svg { width: 13px; height: 13px; padding: 2.5px; border-radius: 50%; background: #34C759; color: #fff; }
.pub-post .lk { position: absolute; right: 8px; bottom: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 99px; background: rgba(0,0,0,.45); color: #fff; font-size: 11px; font-weight: 600; }
.pub-post .lk svg { width: 11px; height: 11px; color: #FF375F; }
.pub-chat .seen { align-self: flex-end; font-size: 11px; color: var(--text-faint); margin-top: -2px; padding-right: 4px; }
@media (min-width: 900px) { .sv-dg-one .dz-formats { zoom: 1.3; } }

/* -- Web: formatos en un solo gráfico -- */
.fmt-one { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 12px; border-radius: 32px; background: #fff;
  box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.fo-col { display: flex; flex-direction: column; align-items: center; text-align: center; padding-bottom: 22px; }
.fo-art { width: 100%; height: 220px; border-radius: 22px; background: #F5F5F7; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.fo-col b { font-size: 19px; font-weight: 500; letter-spacing: -.02em; }
.fo-col span { margin-top: 3px; font-size: 14px; color: var(--text-dim); }
@media (max-width: 760px) { .fmt-one { grid-template-columns: 1fr; max-width: 420px; } }

/* -- Web: Diseño & UX, un celular y la aprobación -- */
.ux-one { position: relative; width: 100%; max-width: 620px; height: 520px; margin: 8px auto 0; display: flex; justify-content: center; }
.ux-phone { position: relative; zoom: 1.5; padding: 3px; border-radius: 22px; background: var(--brand-black); box-shadow: 0 30px 60px -20px rgba(17,17,17,.35); height: max-content; width: 178px; }
.ux-phone .pp-ph { border-radius: 19px; box-shadow: none; }
.ux-tap { display: none; }
.ux-note { position: absolute; right: 0; top: 70px; display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px 12px 12px; border-radius: 20px; background: #fff; text-align: left;
  font-size: 14.5px; line-height: 1.35; color: var(--text); box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 20px 40px -20px rgba(17,17,17,.35); }
.ux-note .av { width: 30px; height: 30px; border-radius: 50%; background: #E67A35; color: #fff; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex: none; }
.ux-note small { display: block; font-size: 11.5px; color: var(--text-faint); margin-bottom: 2px; }
.ux-ok { position: absolute; left: 30px; bottom: 90px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 10px 10px; border-radius: 99px; background: #fff; font-size: 14.5px; font-weight: 600; color: #1F7A45;
  box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 20px 40px -20px rgba(17,17,17,.35); }
.ux-ok svg { width: 22px; height: 22px; padding: 5px; border-radius: 50%; background: #34C759; color: #fff; }
@media (max-width: 760px) {
  .ux-one { height: auto; flex-direction: column; align-items: center; gap: 14px; }
  .ux-phone { zoom: 1.3; }
  .ux-note, .ux-ok { position: static; }
}

/* -- Web: mantenimiento, solo cuatro tarjetas -- */
.mt-four { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.mt-c { padding: 30px 26px; border-radius: 28px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.mt-c .ic { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--c);
  background: color-mix(in srgb, var(--c) 12%, white); }
.mt-c .ic svg { width: 22px; height: 22px; }
.mt-c b { display: block; margin-top: 22px; font-size: 21px; font-weight: 500; letter-spacing: -.02em; }
.mt-c p { margin-top: 6px; font-size: 14.5px; line-height: 1.5; color: var(--text-dim); }
@media (max-width: 900px) { .mt-four { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .mt-four { grid-template-columns: 1fr; } }

/* -- Ads & SEO: gráficos mínimos -- */
.ax.mini { max-width: 280px; min-height: 196px; padding: 26px 22px; border-radius: 24px; background: #fff; border: 0; align-items: center; justify-content: center; text-align: center; gap: 10px;
  box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 18px 40px -30px rgba(17,17,17,.35); }
.sv-cards.two .ax.mini, .sv-cards.three .ax.mini { max-width: 300px; }
.mi-ic { width: 52px; height: 52px; border-radius: 16px; color: #fff; display: flex; align-items: center; justify-content: center; }
.mi-ic svg { width: 26px; height: 26px; }
.mi-row { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.mi-row b { font-size: 18px; font-weight: 500; letter-spacing: -.01em; }
.mi-tg { width: 44px; height: 26px; border-radius: 99px; background: #34C759; position: relative; }
.mi-tg::after { content: ""; position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.mi-sub { font-size: 13.5px; color: var(--text-dim); }
.mi-big { font-size: 34px; font-weight: 600; letter-spacing: -.035em; line-height: 1; }
.mi-gauge { width: 180px; height: auto; }
.mi-pill { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 99px; background: rgba(52,199,89,.14); color: #1F7A45; font-size: 14px; font-weight: 600; }
.mi-pill svg { width: 14px; height: 14px; }
.mi-perf { justify-content: space-between; }
.mi-perf .mi-pill { align-self: flex-end; }
.mi-line { width: 100%; height: auto; }
.mi-ring { position: relative; width: 120px; height: 120px; }
.mi-ring svg { width: 100%; height: 100%; }
.mi-ring b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 34px; font-weight: 600; letter-spacing: -.03em; }
.ax.flush.mi-map { max-width: 320px; }
.mi-map .card { padding: 14px 16px; }
.ax.kw-one { max-width: 760px; margin: 36px auto 0; padding: 30px 32px 22px; border-radius: 32px; background: #fff; border: 0; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.kw-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.kw-top .mi-sub { font-size: 15px; }
.kw-line { width: 100%; height: auto; }
.sv-canvas:has(> .ax.mini) { padding: 10px; }
.ax.mini { background: transparent; box-shadow: none; }
.sv-canvas:has(> .ax.mini) { background: #F5F5F7; }
.sv:not(.alt) .sv-card:has(.ax.mini) { background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }

/* -- celular aprobado (marco negro, tres botones sutiles) para Eventos -- */
.mk-phone { width: 260px; height: 530px; border-radius: 36px; background: var(--brand-black); padding: 3px; flex: none; position: relative; box-shadow: 0 30px 70px rgba(17,17,17,.16); }
.mk-phone .scr { width: 100%; height: 100%; border-radius: 33px; background: #fff; position: relative; overflow: hidden; display: flex; flex-direction: column; -webkit-mask-image: -webkit-radial-gradient(white, black); }
.mk-phone i.btn { position: absolute; border-radius: 2px; background: #2A2A2A; }
.mk-phone i.btn.vol1 { left: -1.5px; top: 120px; width: 2px; height: 26px; }
.mk-phone i.btn.vol2 { left: -1.5px; top: 160px; width: 2px; height: 26px; }
.mk-phone i.btn.pwr { right: -1.5px; top: 152px; width: 2px; height: 40px; }

/* -- Eventos: pasarela en dos celulares, amplia y blanca -- */
.pay-phones { max-width: 980px; margin: 44px auto 0; padding: 56px 40px; border-radius: 36px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 56px;
  box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -44px rgba(17,17,17,.3); }
.pay-scr { background: #F5F5F7; justify-content: flex-end; }
.pay-bg { position: absolute; inset: 0 0 auto 0; height: 46%; display: flex; align-items: flex-end; padding: 18px; color: #fff; }
.pay-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.6); }
.pay-bg b { position: relative; font-size: 22px; font-weight: 700; letter-spacing: .01em; }
.pay-scr .ap-sheet { position: relative; width: 100%; border-radius: 26px 26px 0 0; padding: 10px 14px 22px; background: #fff; box-shadow: 0 -10px 30px -10px rgba(0,0,0,.25); }
.pay-scr .ap-sum b { font-size: 34px; }
.pay-scr .ap-list { background: #F5F5F7; }
.done-scr { justify-content: center; align-items: center; padding: 0 18px; }
.done-scr .ap-done { width: 100%; }
.done-scr .ap-rows { background: #F5F5F7; }
.pay-mid { display: flex; gap: 7px; }
.pay-mid i { width: 7px; height: 7px; border-radius: 50%; background: #34C759; opacity: .3; animation: apDot 1.6s ease-in-out infinite; }
.pay-mid i:nth-child(2) { animation-delay: .2s; } .pay-mid i:nth-child(3) { animation-delay: .4s; }
@media (max-width: 760px) { .pay-phones { flex-direction: column; gap: 22px; padding: 30px 14px; } .pay-mid { flex-direction: column; } }

/* -- Eventos: escáner en el celular -- */
.scan-phones { display: flex; justify-content: center; gap: 48px; margin-top: 8px; }
.scan-scr { background: #111318; }
.scan-scr .cam { flex: 1; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(70% 60% at 25% 20%, rgba(58,130,222,.4), transparent 60%), radial-gradient(60% 60% at 85% 85%, rgba(52,199,89,.25), transparent 60%), #111318; }
.scan-scr .frame { width: 150px; height: 150px; }
.scan-scr .corner { width: 28px; height: 28px; }
.scan-scr .res { flex: none; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 26px 18px 34px; background: #fff; border-radius: 26px 26px 0 0; }
.scan-scr .res .st { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }
.scan-scr .res .st svg { width: 24px; height: 24px; }
.scan-scr .res.ok .st { background: #34C759; } .scan-scr .res.bad .st { background: #FF3B30; }
.scan-scr .res b { font-size: 18px; font-weight: 600; letter-spacing: -.01em; }
.scan-scr .res .tk { height: 28px; padding: 0 14px; font-size: 12.5px; }
.scan-scr .res.bad .corner { border-color: #FF3B30; }
@media (max-width: 760px) { .scan-phones { flex-direction: column; align-items: center; gap: 24px; } }

/* -- Eventos: tiempo real con el verde de Apple -- */
.lv-tile .ax-ring circle[stroke="#A9D633"] { stroke: #00C7BE; }
.lv-tile .ax-ring circle[stroke="rgba(193,234,80,.25)"] { stroke: rgba(0,199,190,.18); }
.lv-tile .lb i[style*="#A9D633"] { background: #00C7BE !important; }
.lv-chart .col i { background: rgba(52,199,89,.2); }
.lv-chart .col.now i { background: #34C759; }
.lv-ev { background: rgba(52,199,89,.14); color: #1F7A45; }
.scan-scr .frame.bad .corner { border-color: #FF3B30; }

/* -- Todo en Uno: tres círculos alrededor de tu marca -- */
.venn { position: relative; width: 460px; height: 400px; margin: 10px auto 0; }
.venn .c { position: absolute; width: 250px; height: 250px; border-radius: 50%; display: flex; padding: 46px; mix-blend-mode: multiply; }
.venn .c b { font-size: 17px; font-weight: 500; letter-spacing: -.01em; color: var(--text); }
.venn .c1 { left: 0; top: 0; background: rgba(255,149,0,.16); align-items: flex-start; justify-content: flex-start; padding-top: 70px; }
.venn .c2 { right: 0; top: 0; background: rgba(10,132,255,.14); align-items: flex-start; justify-content: flex-end; padding-top: 70px; }
.venn .c3 { left: 105px; bottom: 0; background: rgba(52,199,89,.16); align-items: flex-end; justify-content: center; padding-bottom: 56px; }
.venn .core { position: absolute; left: 50%; top: 52%; transform: translate(-50%, -50%); padding: 10px 18px; border-radius: 99px; background: #fff; font-size: 15px; font-weight: 600;
  box-shadow: 0 0 0 2px var(--accent-lime), 0 14px 30px -14px rgba(17,17,17,.35); white-space: nowrap; }
@media (max-width: 520px) { .venn { zoom: .72; } }

/* -- Todo en Uno: mini web y mini búsqueda -- */
.mini-web { width: 220px; border-radius: 14px; background: #fff; overflow: hidden; padding-bottom: 14px; box-shadow: 0 0 0 1px rgba(14,23,38,.06), 0 16px 30px -18px rgba(14,23,38,.35); display: flex; flex-direction: column; gap: 7px; }
.mini-web .dots { display: flex; gap: 4px; padding: 8px 10px; } .mini-web .dots i { width: 6px; height: 6px; border-radius: 50%; background: #D9DDE3; }
.mini-web .img { height: 78px; margin: 0 10px 4px; border-radius: 9px; background: url('../assets/hero-final.jpg') center 30% / cover; }
.mini-web .ln { height: 6px; margin: 0 12px; border-radius: 3px; background: #E3E7ED; } .mini-web .ln.s { width: 50%; }
.mini-web em { width: 70px; height: 16px; margin: 4px 12px 0; border-radius: 99px; background: var(--accent-lime); }
.mini-search { display: flex; align-items: center; gap: 10px; width: 240px; padding: 14px 16px; border-radius: 99px; background: #fff; box-shadow: 0 0 0 1px rgba(14,23,38,.06), 0 16px 30px -18px rgba(14,23,38,.35); }
.mini-search svg { width: 18px; height: 18px; color: var(--text-faint); flex: none; }
.mini-search span { flex: 1; text-align: left; font-size: 15px; font-weight: 500; }
.mini-search em { font-style: normal; padding: 4px 10px; border-radius: 99px; background: rgba(52,199,89,.14); color: #1F7A45; font-size: 13px; font-weight: 700; }

/* -- Todo en Uno: tu mes en mensajes -- */
.pub-chat.month { max-width: 420px; margin-top: 8px; }

/* -- Mejor todo en uno: sin cuadros -- */
.wo-grid { gap: 0; max-width: 820px; margin-left: auto; margin-right: auto; }
.wo-col, .wo-col.sep, .wo-col.one { background: none; box-shadow: none; border: 0; border-radius: 0; padding: 8px 36px; color: var(--text); }
.wo-col.sep { border-right: 1px solid var(--border); }
.wo-col.sep li { color: var(--text-faint); }
.wo-t { font-size: 18px; font-weight: 500; }
@media (max-width: 760px) { .wo-col.sep { border-right: 0; border-bottom: 1px solid var(--border); padding-bottom: 24px; margin-bottom: 16px; } .wo-col, .wo-col.sep, .wo-col.one { padding: 8px 4px; } }

/* -- Social Media: seguimiento como pantalla de bloqueo con notificaciones -- */
.lock { width: 100%; max-width: 420px; margin: 44px auto 0; padding: 30px 16px 22px; border-radius: 36px; text-align: left;
  background: linear-gradient(180deg, #6FA9DA 0%, #9CC7EA 45%, #D7E8F5 100%); display: flex; flex-direction: column; gap: 10px;
  box-shadow: 0 30px 60px -38px rgba(12,40,70,.45); }
.lock .lk-time { text-align: center; color: #fff; margin-bottom: 14px; text-shadow: 0 1px 12px rgba(12,40,70,.18); }
.lock .lk-time small { display: block; font-size: 15px; font-weight: 500; opacity: .92; }
.lock .lk-n { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 22px;
  background: rgba(255,255,255,.62); border: 1px solid rgba(255,255,255,.7);
  -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); }
.lock .lk-n > div { flex: 1; min-width: 0; }
.lock .lk-n b { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--text); }
.lock .lk-n b span { font-weight: 400; color: rgba(17,17,17,.5); }
.lock .lk-n p { margin: 2px 0 0; font-size: 14px; line-height: 1.3; color: var(--text); }
.lock .lk-ic { flex: none; width: 36px; height: 36px; border-radius: 9px; background: #111; padding: 7px; object-fit: contain; }
.lock .lk-ic.heart { display: grid; place-items: center; background: #FF375F; color: #fff; padding: 0; }
.lock .lk-ic.heart svg { width: 18px; height: 18px; }
.lock .lk-th { flex: none; width: 38px; height: 38px; border-radius: 8px; overflow: hidden; }
.ax-js .lock.ax .lk-n { opacity: 0; transform: translateY(14px) scale(.97); transition: opacity .6s ease var(--d), transform .7s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .lock.ax.ax-on .lk-n { opacity: 1; transform: none; }
@media (max-width: 600px) { .lock { padding: 26px 12px 18px; border-radius: 30px; } .lock .lk-n p { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .ax-js .lock.ax .lk-n { opacity: 1; transform: none; transition: none; } }
.lock .lk-time strong { display: block; font-size: 64px; font-weight: 600; line-height: 1; letter-spacing: -.02em; margin-top: 4px; }
@media (max-width: 600px) { .lock .lk-time strong { font-size: 54px; } }

/* -- Web 8va: formatos con selector y navegador -- */
.fsz { --k: 0; max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.fsz-seg { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); padding: 4px; border-radius: 99px; background: #E6E6EA; margin-bottom: 28px; }
.fsz-seg button { position: relative; z-index: 1; border: 0; background: none; padding: 10px 26px; font: inherit; font-size: 15px; font-weight: 500; color: var(--text-dim); cursor: pointer; transition: color .3s ease; }
.fsz-seg button.on { color: var(--text); }
.fsz-knob { position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 8px) / 3); border-radius: 99px; background: #fff; box-shadow: 0 2px 8px rgba(17,17,17,.1);
  transform: translateX(calc(var(--k) * 100%)); transition: transform .5s cubic-bezier(.3,.9,.3,1); }
.fsz-win { container-type: inline-size; width: 100%; border-radius: 20px; background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 40px 80px -50px rgba(17,17,17,.45); text-align: left; }
.fsz-bar { display: flex; align-items: center; gap: 2cqw; padding: 1.6cqw 2cqw; background: #F5F5F7; }
.fsz-bar .dots { display: flex; gap: .8cqw; } .fsz-bar .dots i { width: 1.3cqw; height: 1.3cqw; border-radius: 50%; background: #D9D9DE; }
.fsz-bar .url { position: relative; flex: 1; max-width: 40cqw; margin: 0 auto; height: 3.4cqw; border-radius: 99px; background: #fff; }
.fsz-bar .url em { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 1.6cqw; color: var(--text-dim); opacity: 0; transition: opacity .4s ease; }
.fsz-nav { position: relative; display: flex; align-items: center; height: 7cqw; padding: 0 3.4cqw; border-bottom: 1px solid #F0F0F2; }
.fsz-nav > b { display: flex; align-items: center; gap: 1cqw; font-size: 1.9cqw; font-weight: 600; }
.fsz-nav > b i { width: 2.4cqw; height: 2.4cqw; border-radius: .7cqw; background: var(--text); }
.fsz-nav .l { position: absolute; right: 3.4cqw; top: 0; bottom: 0; display: flex; align-items: center; gap: 2.6cqw; opacity: 0; transform: translateY(6px); transition: opacity .45s ease, transform .45s ease; }
.fsz-nav s { text-decoration: none; font-size: 1.6cqw; color: var(--text-dim); } .fsz-nav s.a { color: var(--text); font-weight: 600; }
.fsz-nav u { text-decoration: none; font-size: 1.5cqw; font-weight: 600; padding: 1cqw 2cqw; border-radius: 99px; background: var(--text); color: #fff; }
.fsz-body { position: relative; height: 40cqw; }
.fsz-body .v { position: absolute; inset: 0; padding: 3.4cqw; opacity: 0; transform: scale(.985); transition: opacity .5s ease, transform .6s cubic-bezier(.3,.9,.3,1); }
.fsz-body .v0 { padding: 0; display: grid; grid-template-columns: 1fr 1fr; }
.fsz-body .v0 .hero { padding: 6cqw 4cqw; display: flex; flex-direction: column; align-items: flex-start; }
.fsz-body .v0 small { font-size: 1.5cqw; color: var(--text-faint); }
.fsz-body .v0 .hero b { margin-top: 1cqw; font-size: 4.2cqw; line-height: 1.05; font-weight: 600; letter-spacing: -.03em; }
.fsz-body .v0 u { margin-top: 3cqw; text-decoration: none; font-size: 1.6cqw; font-weight: 600; padding: 1.3cqw 2.6cqw; border-radius: 99px; background: var(--text); color: #fff; }
.fsz-body .v0 .sky { background: url('../assets/web-demo/sky-hero.jpg') center / cover; }
.fsz-body .t { display: block; font-size: 2.8cqw; font-weight: 600; letter-spacing: -.02em; margin-bottom: 2.4cqw; }
.fsz-body .row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2cqw; } .fsz-body .row.four { grid-template-columns: repeat(4, 1fr); }
.fsz-body .c i { display: block; aspect-ratio: 4 / 3; border-radius: 1.6cqw; background: center / cover; }
.fsz-body .row.four .c i { aspect-ratio: 1; }
.fsz-body .c b { display: block; margin-top: 1.2cqw; font-size: 1.7cqw; font-weight: 600; } .fsz-body .c small { font-size: 1.5cqw; color: var(--text-dim); }
.fsz[data-k="0"] .url em:nth-child(1), .fsz[data-k="1"] .url em:nth-child(2), .fsz[data-k="2"] .url em:nth-child(3),
.fsz[data-k="0"] .l0, .fsz[data-k="1"] .l1, .fsz[data-k="2"] .l2,
.fsz[data-k="0"] .v0, .fsz[data-k="1"] .v1, .fsz[data-k="2"] .v2 { opacity: 1; transform: none; }
.fsz-cap { position: relative; width: 100%; max-width: 560px; height: 54px; margin-top: 24px; text-align: center; }
.fsz-cap p { position: absolute; inset: 0; margin: 0; font-size: 16px; line-height: 1.5; color: var(--text-dim); opacity: 0; transition: opacity .4s ease; }
.fsz-cap p b { color: var(--text); font-weight: 600; } .fsz-cap p.on { opacity: 1; }
@media (max-width: 600px) { .fsz-seg button { padding: 9px 16px; font-size: 14px; } .fsz-win { border-radius: 14px; } .fsz-cap { height: 72px; } .fsz-cap p { font-size: 15px; } }

/* -- Web 8va: Diseño & UX, del boceto al diseño final -- */
@property --sx { syntax: '<percentage>'; inherits: true; initial-value: 50%; }
.ba { --sx: 50%; container-type: inline-size; position: relative; width: 100%; max-width: 860px; aspect-ratio: 16 / 9.6; margin: 8px auto 0; border-radius: 22px; overflow: hidden; background: #fff;
  box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 40px 80px -50px rgba(17,17,17,.45); animation: baSlide 7s ease-in-out infinite; }
@keyframes baSlide { 0%, 100% { --sx: 30%; } 50% { --sx: 70%; } }
.ba-l { position: absolute; inset: 0; padding: 0 4cqw; text-align: left; }
.ba-l.final { clip-path: inset(0 0 0 var(--sx)); }
.ba-nav { display: flex; align-items: center; gap: 3cqw; height: 9cqw; }
.ba-nav b { display: flex; align-items: center; gap: 1cqw; font-size: 2cqw; font-weight: 600; margin-right: auto; } .ba-nav b span { width: 2.6cqw; height: 2.6cqw; border-radius: 50%; background: linear-gradient(135deg, #7DB7E8, #2F6FB5); }
.ba-nav s { text-decoration: none; font-size: 1.7cqw; color: var(--text-dim); }
.ba-nav u { text-decoration: none; font-size: 1.6cqw; font-weight: 600; padding: 1.2cqw 2.4cqw; border-radius: 99px; background: var(--text); color: #fff; }
.ba-hero { display: grid; grid-template-columns: 1fr 1.1fr; gap: 4cqw; align-items: center; height: 30cqw; }
.ba-hero .tx { display: flex; flex-direction: column; align-items: flex-start; gap: 1.4cqw; }
.ba-hero small { font-size: 1.6cqw; color: var(--text-faint); }
.ba-hero h4 { margin: 0; font-size: 4.6cqw; line-height: 1.04; font-weight: 600; letter-spacing: -.035em; }
.ba-hero u { margin-top: 1.4cqw; text-decoration: none; font-size: 1.7cqw; font-weight: 600; padding: 1.4cqw 2.8cqw; border-radius: 99px; background: #2F6FB5; color: #fff; }
.ba-hero .img { height: 26cqw; border-radius: 2.4cqw; background: center / cover; }
.ba-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4cqw; margin-top: 3cqw; }
.ba-row i { height: 11cqw; border-radius: 2cqw; background: center / cover; }
.ba-l.wire { background: #F7F7F9; }
.wire i { display: block; background: #E3E4E8; border-radius: 1cqw; }
.wire .ba-nav i { width: 8cqw; height: 1.6cqw; } .wire .ba-nav i.lg { width: 12cqw; height: 2.6cqw; margin-right: auto; } .wire .ba-nav i.bt { width: 10cqw; height: 3.8cqw; border-radius: 99px; }
.wire .ba-hero .s { width: 12cqw; height: 1.6cqw; } .wire .ba-hero .h { width: 34cqw; height: 4.2cqw; } .wire .ba-hero .h2 { width: 24cqw; height: 4.2cqw; } .wire .ba-hero .bt { width: 14cqw; height: 4.4cqw; border-radius: 99px; margin-top: 1.4cqw; }
.wire .ba-hero .img { background: #E3E4E8 linear-gradient(to top right, transparent calc(50% - 1px), #D2D3D8, transparent calc(50% + 1px)); }
.wire .ba-row i { background: #E3E4E8; }
.ba-tag { position: absolute; bottom: 2.6cqw; z-index: 2; font-size: max(11px, 1.5cqw); font-weight: 600; padding: .8cqw 1.8cqw; border-radius: 99px; background: rgba(255,255,255,.9); color: var(--text-dim); box-shadow: 0 2px 10px rgba(17,17,17,.08); }
.ba-tag.l { left: 2.6cqw; } .ba-tag.r { right: 2.6cqw; color: var(--text); }
.ba-h { position: absolute; top: 0; bottom: 0; left: var(--sx); z-index: 3; width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 0 1px rgba(17,17,17,.06); }
.ba-h i { position: absolute; top: 50%; left: 50%; width: 38px; height: 38px; margin: -19px 0 0 -19px; border-radius: 50%; background: #fff; box-shadow: 0 4px 16px rgba(17,17,17,.2); }
.ba-h i::before, .ba-h i::after { content: ""; position: absolute; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border: solid var(--text); border-width: 0 0 2px 2px; }
.ba-h i::before { left: 11px; transform: rotate(45deg); } .ba-h i::after { right: 11px; transform: rotate(-135deg); }
@media (prefers-reduced-motion: reduce) { .ba { animation: none; } }
@media (max-width: 600px) { .ba { border-radius: 16px; } .ba-h i { width: 30px; height: 30px; margin: -15px 0 0 -15px; } .ba-h i::before { left: 8px; } .ba-h i::after { right: 8px; } }
.ba-l.final { background: #fff; }
.ba-hero h4 { color: var(--text); }

/* -- Ads & SEO 8va: auditoría como lista y búsqueda en Google -- */
.ax.mini.mi-check { align-items: stretch; gap: 8px; text-align: left; }
.mi-check .ck { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 14px 13px 16px; border-radius: 16px; background: #fff; font-size: 14.5px; font-weight: 500; }
.mi-check .ck i { width: 22px; height: 22px; border-radius: 50%; background: #34C759; color: #fff; display: grid; place-items: center; flex: none; }
.mi-check .ck i svg { width: 12px; height: 12px; }
.mi-check .ck em { font-style: normal; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 99px; background: rgba(255,149,0,.14); color: #B25E00; }
.ax-js .mi-check .ck { opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.ax-js .mi-check.ax-on .ck { opacity: 1; transform: none; }
.mi-check.ax-on .ck:nth-child(2) { transition-delay: .15s; } .mi-check.ax-on .ck:nth-child(3) { transition-delay: .3s; }
.gs { max-width: 640px; margin: 36px auto 0; padding: 22px; border-radius: 30px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.gs-q { display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 20px; border-radius: 99px; background: #F2F3F5; font-size: 16px; }
.gs-q svg { width: 18px; height: 18px; color: var(--text-faint); flex: none; }
.gs-r { display: flex; gap: 14px; align-items: flex-start; padding: 16px 12px; }
.gs-r + .gs-r { border-top: 1px solid #F0F0F2; }
.gs-r .n { width: 26px; height: 26px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: 12.5px; font-weight: 600; background: #F2F3F5; color: var(--text-faint); }
.gs-r.top { margin-top: 10px; border-radius: 18px; background: rgba(193,234,80,.14); }
.gs-r.top .n { background: var(--accent-lime); color: var(--brand-black); }
.gs-r > div { flex: 1; min-width: 0; }
.gs-r small { font-size: 12.5px; color: var(--text-faint); }
.gs-r b { display: block; margin-top: 2px; font-size: 17px; font-weight: 500; color: #1A55C4; }
.gs-r p { margin-top: 3px; font-size: 14px; color: var(--text-dim); }
.gs-r i { display: block; height: 10px; border-radius: 99px; background: #ECEDF0; } .gs-r i.a { width: 60%; margin-top: 4px; } .gs-r i.b { width: 85%; margin-top: 9px; }
@media (max-width: 600px) { .gs { padding: 14px; border-radius: 24px; } .gs-q { font-size: 14.5px; } .gs-r b { font-size: 15.5px; } }

/* -- Web 8va: mantenimiento más delgado -- */
.mt-four { max-width: 980px; gap: 12px; }
.mt-c { padding: 22px 20px; border-radius: 24px; }
.mt-c .ic { width: 40px; height: 40px; } .mt-c .ic svg { width: 19px; height: 19px; }
.mt-c b { margin-top: 16px; font-size: 19px; }
.mt-c p { font-size: 14px; }
.sv:not(.alt) .sv-card:has(.mi-map) { background: #fff; border-color: transparent; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }

/* -- Eventos 8va -- */
.evt-notif { align-items: center; }
.evt-notif .ax-app.tkt { background: var(--brand-black); color: var(--accent-lime); border-radius: 9px; }
.evt-notif .qr-th { flex: none; width: 34px; height: 34px; padding: 5px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #ECEDF0; }
.evt-notif .qr-th svg { display: block; width: 100%; height: 100%; }
.pay-scr { background: #0B0B0D; }
.pay-bg { height: 52%; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 4px; padding: 22px 20px;
  background: radial-gradient(80% 60% at 20% 30%, rgba(193,234,80,.16), transparent 70%), #0B0B0D; }
.pay-bg small { font-size: 12px; font-weight: 500; color: rgba(255,255,255,.55); }
.pay-bg b { font-size: 30px; font-weight: 700; letter-spacing: -.02em; line-height: 1; }
.done-scr .ap-ok { width: 76px; height: 76px; background: none; box-shadow: inset 0 0 0 3px var(--brand-black); color: var(--brand-black); }
.done-scr .ap-ok svg { width: 34px; height: 34px; }
.done-scr .ap-done .ttl { margin-top: 20px; font-size: 15px; color: var(--text); }
.done-scr .ap-done .amt { font-weight: 600; }
.done-scr .ap-rows { background: none; padding: 0; margin-top: 22px; border-top: 1px solid #ECEDF0; }
.done-scr .ap-rows div { padding: 12px 0; }
.done-scr .ap-rows div + div { border-top-color: #ECEDF0; }
.pay-mid i { background: var(--text-faint); animation: none; opacity: .5; }
.scan-phones { gap: 36px; }
.scan-scr .res.grp { gap: 6px; }
.scan-scr .res.grp .ppl { font-size: 22px; margin-top: 4px; }
.scan-scr .res.grp .nm { font-size: 13px; color: var(--text-dim); }
.scan-scr .res.grp .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; margin-top: 12px; }
.scan-scr .res.grp .acts span { height: 40px; border-radius: 99px; display: grid; place-items: center; font-size: 14px; font-weight: 600; }
.scan-scr .res.grp .no { background: rgba(255,59,48,.1); color: #D70015; }
.scan-scr .res.grp .yes { background: #34C759; color: #fff; }
.lv-tile .ax-ring circle[stroke="#111111"] { stroke: #111; }
.lv-tile .ax-ring circle[stroke="rgba(17,17,17,.08)"] { stroke: rgba(17,17,17,.08); }
.lv-chart .col i { background: rgba(193,234,80,.35); }
.lv-chart .col.now i { background: var(--accent-lime); }
.lv-ev { background: var(--brand-black); color: var(--accent-lime); }
.live-txt p { font-size: 17px; }
@media (max-width: 1100px) and (min-width: 761px) { .scan-phones { zoom: .85; } }
.pay-bg { height: auto; top: 0; bottom: auto; padding: 64px 22px 0; justify-content: flex-start; }
.done-scr .ap-rows { border-radius: 0; }
.mk-phone .scr.pay-scr { background: #0B0B0D; }
.pay-bg { bottom: 0; }

/* -- Todo en Uno 8va: centro conectado, mes en puntos, tres "1" -- */
.hub { position: relative; width: 100%; max-width: 600px; height: 380px; margin: 10px auto 0; }
.hub-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.hub-lines path { stroke: #D9DBE0; stroke-width: 1.5; }
.hub-lines path.flow { stroke: var(--accent-lime); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 18 400; animation: hubFlow 2.6s linear infinite; }
.hub-lines path.flow:nth-of-type(5) { animation-delay: .8s; } .hub-lines path.flow:nth-of-type(6) { animation-delay: 1.6s; }
@keyframes hubFlow { from { stroke-dashoffset: 18; } to { stroke-dashoffset: -240; } }
.hub-core { position: absolute; left: 50%; top: 50%; width: 132px; height: 132px; margin: -66px 0 0 -66px; border-radius: 38px; background: var(--brand-black);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff; box-shadow: 0 0 0 8px rgba(193,234,80,.18), 0 30px 60px -24px rgba(17,17,17,.5); }
.hub-core img { width: 42px; height: 42px; object-fit: contain; }
.hub-core span { font-size: 14px; font-weight: 500; }
.hub-n { position: absolute; display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 10px; border-radius: 99px; background: #fff; text-align: left; white-space: nowrap;
  box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 18px 40px -22px rgba(17,17,17,.35); transform: translate(-50%, -50%); }
.hub-n i { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; color: var(--c); background: color-mix(in srgb, var(--c) 13%, white); }
.hub-n i svg { width: 20px; height: 20px; }
.hub-n b { display: block; font-size: 15.5px; font-weight: 600; letter-spacing: -.01em; }
.hub-n small { display: block; font-size: 12.5px; color: var(--text-dim); }
.hub-n.n1 { left: calc(110 / 600 * 100%); top: calc(70 / 380 * 100%); }
.hub-n.n2 { left: calc(490 / 600 * 100%); top: calc(70 / 380 * 100%); }
.hub-n.n3 { left: 50%; top: calc(330 / 380 * 100%); }
@media (max-width: 600px) { .hub { height: 340px; } .hub-core { width: 108px; height: 108px; margin: -54px 0 0 -54px; border-radius: 30px; } .hub-core img { width: 34px; height: 34px; }
  .hub-n { padding: 7px 12px 7px 7px; gap: 8px; } .hub-n i { width: 32px; height: 32px; } .hub-n i svg { width: 16px; height: 16px; } .hub-n b { font-size: 13.5px; } .hub-n small { font-size: 11px; }
  .hub-n.n1 { left: 27%; } .hub-n.n2 { left: 73%; } }
@media (prefers-reduced-motion: reduce) { .hub-lines path.flow { animation: none; display: none; } }

.month-line { position: relative; max-width: 980px; margin: 20px auto 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.month-line::before, .month-line::after { content: ""; position: absolute; top: 28px; left: 12.5%; right: 12.5%; height: 2px; border-radius: 2px; background: #E6E7EB; }
.month-line::after { background: var(--accent-lime); transform-origin: left; transform: scaleX(1); }
.ax-js .month-line::after { transform: scaleX(0); transition: transform 1.4s cubic-bezier(.4,.1,.2,1) .2s; }
.ax-js .month-line.ax-on::after { transform: scaleX(1); }
.ml-i { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ml-i .dot { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--text); box-shadow: 0 0 0 6px var(--bg, #fff), 0 1px 2px rgba(17,17,17,.06), 0 12px 26px -14px rgba(17,17,17,.35); }
.ml-i .dot svg { width: 22px; height: 22px; }
.ax-js .month-line .dot { transition: background .4s ease var(--d), color .4s ease var(--d); }
.ax-js .month-line.ax-on .dot { background: var(--brand-black); color: var(--accent-lime); transition-delay: calc(var(--d) + .3s); }
.month-line:not(.ax) .dot, html:not(.ax-js) .month-line .dot { background: var(--brand-black); color: var(--accent-lime); }
.ml-i b { margin-top: 18px; font-size: 19px; font-weight: 500; letter-spacing: -.02em; }
.ml-i p { margin-top: 4px; font-size: 14.5px; line-height: 1.45; color: var(--text-dim); max-width: 200px; }
@media (max-width: 760px) {
  .month-line { grid-template-columns: 1fr; gap: 26px; max-width: 340px; }
  .month-line::before, .month-line::after { top: 28px; bottom: 28px; left: 27px; right: auto; width: 2px; height: auto; transform-origin: top; }
  .ax-js .month-line::after { transform: scaleY(0); } .ax-js .month-line.ax-on::after { transform: scaleY(1); }
  .ml-i { display: grid; grid-template-columns: 56px 1fr; column-gap: 18px; text-align: left; align-items: center; }
  .ml-i .dot { grid-row: span 2; } .ml-i b { margin-top: 0; align-self: end; } .ml-i p { margin-top: 2px; align-self: start; max-width: none; }
}

.why-one .wo-head p { white-space: normal; }
.ones { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; margin: 48px auto 0; }
.ones > div { display: flex; flex-direction: column; align-items: center; }
.ones > div + div { border-left: 1px solid #E6E7EB; }
.ones b { font-size: clamp(88px, 11vw, 140px); font-weight: 600; line-height: .9; letter-spacing: -.05em; }
.ones span { margin-top: 12px; font-size: 19px; font-weight: 500; letter-spacing: -.015em; }
.ones-foot { margin-top: 40px; text-align: center; font-size: 15.5px; color: var(--text-dim); }
@media (max-width: 600px) { .ones b { font-size: 72px; } .ones span { font-size: 14.5px; text-align: center; } }
.ax.month-line { max-width: 980px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; display: grid; text-align: center; }
@media (max-width: 760px) { .ax.month-line { max-width: 340px; } }

/* -- Web 8va f: antes y después manual; íconos de mantenimiento tipo app -- */
.ba { animation: none; cursor: ew-resize; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.ba:focus-visible { outline: 2px solid var(--accent-lime); outline-offset: 4px; }
.ba-h i { transition: transform .2s ease; } .ba:hover .ba-h i, .ba.drag .ba-h i { transform: scale(1.12); }
.mt-c .ic { width: 46px; height: 46px; border-radius: 13px; color: #fff;
  background: linear-gradient(160deg, color-mix(in srgb, var(--c) 72%, white), var(--c)); box-shadow: 0 8px 18px -10px var(--c); }
.mt-c .ic svg { width: 22px; height: 22px; stroke-width: 2.2; }

/* -- Web 8va g: Completa como muchas páginas; mantenimiento solo símbolo -- */
.fsz-nav .l2 { gap: 2cqw; }
.fsz-body .pgs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.8cqw; }
.fsz-body .fpg { border-radius: 1.6cqw; background: #F5F5F7; padding: .9cqw; }
.fsz-body .fpg i { display: block; height: 7.5cqw; border-radius: 1cqw; background: center / cover; }
.fsz-body .fpg b { display: block; margin: 1cqw .4cqw .2cqw; font-size: 1.6cqw; font-weight: 600; }
.mt-c .ic { width: auto; height: auto; justify-content: flex-start; border-radius: 0; background: none; box-shadow: none; color: var(--c); }
.mt-c .ic svg { width: 30px; height: 30px; stroke-width: 2; }
.mt-c b { margin-top: 18px; }

/* -- Branding: los tres gráficos con la misma altura para que los títulos
   queden a la misma línea (el de paleta era más bajo y subía el texto). -- */
#branding .sv-canvas { min-height: 200px; display: flex; align-items: center; justify-content: center; }

/* ===== 12 oct 2026 ===== */
/* Web: "Completa" como mapa del sitio */
.fsz-body .smap { display: flex; flex-direction: column; align-items: center; }
.smap .nd { position: relative; display: block; padding: 1.1cqw 1.4cqw; border-radius: 1.2cqw; background: #fff; box-shadow: inset 0 0 0 1px #E3E4E8;
  font-size: 1.55cqw; font-weight: 600; text-align: center; white-space: nowrap; }
.smap .root { width: 16cqw; background: var(--brand-black); color: #fff; box-shadow: none; }
.smap .root::after { content: ""; position: absolute; left: 50%; top: 100%; width: 2px; height: 1.8cqw; margin-left: -1px; background: #D5D7DC; }
.smap .kids { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.8cqw; width: 100%; margin-top: 3.6cqw; }
.smap .kids::before { content: ""; position: absolute; top: -1.8cqw; left: 10%; right: 10%; height: 2px; background: #D5D7DC; }
.smap .col { display: flex; flex-direction: column; align-items: center; gap: 1cqw; }
.smap .col .nd { width: 100%; }
.smap .col .nd::before { content: ""; position: absolute; left: 50%; bottom: 100%; width: 2px; height: 1.8cqw; margin-left: -1px; background: #D5D7DC; }
.smap .sub { width: 82%; height: 3cqw; border-radius: .9cqw; background: #F2F3F5; }

/* Web: Diseño & UX en tres pasos */
.ux3 { max-width: 1120px; margin: 8px auto 0; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 56px; align-items: center; text-align: left; }
.ux3-tabs { display: flex; flex-direction: column; gap: 6px; }
.ux3-tabs button { position: relative; display: block; text-align: left; border: 0; background: none; font: inherit; cursor: pointer; padding: 14px 0 14px 24px; color: var(--text-faint); }
.ux3-tabs .bar { position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 3px; background: #E6E7EB; overflow: hidden; }
.ux3-tabs .bar b { position: absolute; left: 0; right: 0; top: 0; height: 0; background: var(--brand-black); }
.ux3-tabs button.on .bar b { height: 100%; }
.ux3.run:not(.still) .ux3-tabs button.on .bar b { animation: ux3Fill 4.2s linear forwards; }
@keyframes ux3Fill { from { height: 0; } to { height: 100%; } }
.ux3-tabs span { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.025em; transition: color .3s ease; }
.ux3-tabs small { display: block; max-height: 0; opacity: 0; overflow: hidden; font-size: 15.5px; line-height: 1.5; color: var(--text-dim); transition: max-height .5s ease, opacity .4s ease, margin .4s ease; }
.ux3-tabs button.on { color: var(--text); }
.ux3-tabs button.on small { max-height: 80px; opacity: 1; margin-top: 6px; }
.ux3-tabs .sv-ai-note { margin: 18px 0 0 24px; padding: 0; border: 0; }
.ux3-win { border-radius: 22px; background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 40px 80px -50px rgba(17,17,17,.45); }
.ux3-bar { display: flex; align-items: center; height: 36px; padding: 0 16px; background: #F5F5F7; }
.ux3-bar .dots { display: flex; gap: 6px; } .ux3-bar .dots i { width: 9px; height: 9px; border-radius: 50%; background: #D9D9DE; }
.ux3-body { container-type: inline-size; position: relative; aspect-ratio: 16 / 9.6; }
.ux3-body .v { opacity: 0; transition: opacity .55s ease; }
.ux3[data-k="0"] .wire.v, .ux3[data-k="1"] .final.v:not(.proto), .ux3[data-k="2"] .proto.v { opacity: 1; }
.ux3-body .ba-l.final { clip-path: none; }
.ux3-cur { position: absolute; z-index: 3; left: 62%; top: 78%; width: 26px; height: 26px; opacity: 0; pointer-events: none; }
.ux3-cur svg { width: 100%; height: 100%; filter: drop-shadow(0 3px 6px rgba(0,0,0,.25)); }
.ux3-ok { position: absolute; z-index: 3; right: 3cqw; top: 3cqw; display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 8px; border-radius: 99px; background: #fff;
  font-size: max(12px, 1.6cqw); font-weight: 600; color: #1F7A45; box-shadow: 0 10px 30px -10px rgba(0,0,0,.3); opacity: 0; transform: translateY(-8px) scale(.96); }
.ux3-ok svg { width: 22px; height: 22px; padding: 5px; border-radius: 50%; background: #34C759; color: #fff; }
.ux3[data-k="2"].run .ux3-cur { animation: ux3Cur 2.6s cubic-bezier(.4,.1,.2,1) .3s forwards; }
.ux3[data-k="2"].run .proto .hot { animation: ux3Tap .5s ease 1.9s; }
.ux3[data-k="2"].run .ux3-ok { animation: ux3Ok .5s cubic-bezier(.2,.8,.2,1) 2.3s forwards; }
.ux3.still[data-k="2"] .ux3-ok { opacity: 1; transform: none; }
@keyframes ux3Cur { 0% { opacity: 0; left: 62%; top: 78%; } 15% { opacity: 1; } 70%, 100% { opacity: 1; left: calc(4cqw + 9cqw); top: calc(9cqw + 21.5cqw); } }
@keyframes ux3Tap { 50% { transform: scale(.92); } }
@keyframes ux3Ok { to { opacity: 1; transform: none; } }
.ux3 .hot { display: inline-block; }
@media (max-width: 900px) {
  .ux3 { grid-template-columns: 1fr; gap: 28px; }
  .ux3-tabs { order: 2; }
  .ux3-tabs span { font-size: 20px; }
  .ux3-win { border-radius: 16px; }
}

/* Web: 100% responsive con bordes, como el hero del inicio */
#responsive.sv { padding-top: 48px; }
#responsive .rs-wrap { width: calc(100vw - 128px); margin-left: calc(50% - 50vw + 64px); border-radius: 44px; }
#responsive .rs-wrap::after { height: 28%; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(246,250,255,.55)); }
@media (max-width: 640px) { #responsive .rs-wrap { width: calc(100vw - 32px); margin-left: calc(50% - 50vw + 16px); border-radius: 28px; } }

/* Web: Rápido y conectado, más simple */
.rc-two { max-width: 920px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.rc { padding: 14px 14px 30px; border-radius: 32px; background: #F5F5F7; text-align: left; }
.rc-art { height: 260px; border-radius: 22px; background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.rc h3 { margin: 22px 16px 0; font-size: 21px; font-weight: 500; letter-spacing: -.02em; }
.rc p { margin: 4px 16px 0; font-size: 15px; color: var(--text-dim); }
.rc-phone { position: relative; width: 150px; height: 300px; margin-top: 90px; padding: 12px 12px 0; border-radius: 30px; background: #fff; box-shadow: 0 0 0 4px var(--brand-black), 0 30px 50px -20px rgba(17,17,17,.4); display: flex; flex-direction: column; gap: 8px; }
.rc-phone .sb { display: flex; justify-content: space-between; align-items: center; padding: 2px 6px 6px; font-size: 10.5px; font-weight: 600; }
.rc-phone .sig { display: flex; align-items: flex-end; gap: 2px; height: 9px; }
.rc-phone .sig i { width: 3px; border-radius: 1px; background: #D5D7DC; } .rc-phone .sig i:nth-child(1) { height: 3px; } .rc-phone .sig i:nth-child(2) { height: 5px; } .rc-phone .sig i:nth-child(3) { height: 7px; } .rc-phone .sig i:nth-child(4) { height: 9px; }
.rc-phone .sig i.on { background: var(--text); }
.rc-phone .img { height: 74px; border-radius: 12px; background: url('../assets/web-demo/sky-1.jpg') center / cover; }
.rc-phone .ln { display: block; height: 8px; border-radius: 99px; background: #ECEDF0; } .rc-phone .ln.s { width: 60%; }
.rc-phone .ok { position: absolute; left: 50%; top: 104px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 6px; border-radius: 99px;
  background: var(--brand-black); color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; box-shadow: 0 10px 24px -8px rgba(0,0,0,.4); }
.rc-phone .ok svg { width: 18px; height: 18px; padding: 4px; border-radius: 50%; background: var(--accent-lime); color: var(--brand-black); }
.rc-hub { width: 300px; display: flex; flex-direction: column; align-items: center; }
.rc-hub .core { width: 58px; height: 58px; border-radius: 17px; background: var(--brand-black); display: grid; place-items: center; box-shadow: 0 0 0 6px rgba(193,234,80,.2); }
.rc-hub .core img { width: 28px; height: 28px; object-fit: contain; }
.rc-hub .ln { display: block; width: 100%; height: 40px; } .rc-hub .ln path { stroke: #D5D7DC; stroke-width: 2; vector-effect: non-scaling-stroke; }
.rc-hub .apps { display: grid; grid-template-columns: repeat(4, 1fr); width: 100%; }
.rc-hub .apps span { display: flex; flex-direction: column; align-items: center; gap: 7px; }
.rc-hub .apps i { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; color: var(--c); background: color-mix(in srgb, var(--c) 13%, white); }
.rc-hub .apps i svg { width: 22px; height: 22px; }
.rc-hub .apps small { font-size: 11.5px; font-weight: 500; color: var(--text-dim); }
@media (max-width: 760px) { .rc-two { grid-template-columns: 1fr; max-width: 440px; } .rc-hub { width: 280px; } }

/* Web: mantenimiento, un toque más */
.mt-c { transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.mt-c:hover { transform: translateY(-4px); box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 50px -34px rgba(17,17,17,.35); }
.mt-c .ic svg { width: 32px; height: 32px; }
.mt-c b { font-size: 20px; }

/* Ads: Facebook Ads */
.mi-ic.fb { background: #1877F2; }
.mi-ic.fb svg { width: 30px; height: 30px; }
.smap .kids::before { display: none; }
.smap .col { position: relative; }
.smap .col::after { content: ""; position: absolute; top: -1.8cqw; left: -.9cqw; right: -.9cqw; height: 2px; background: #D5D7DC; }
.smap .col:first-child::after { left: 50%; } .smap .col:last-child::after { right: 50%; }
.ux3-tabs .sv-ai-note { font-size: 14.5px; line-height: 1.4; white-space: nowrap; }
.ux3-tabs .sv-ai-note svg { width: 16px; height: 16px; }
.ux3-ok { top: auto; bottom: 3cqw; }
.rc-phone .ok { top: auto; bottom: 120px; }
.ux3-tabs .sv-ai-note span { display: inline; font-size: inherit; letter-spacing: inherit; }

/* Web: formatos, mismo sitio con panel de páginas que crece (12 oct, b) */
.fsz-body.two { display: grid; grid-template-columns: 22cqw 1fr; height: 40cqw; }
.fsz-side { padding: 2.4cqw 1.6cqw; background: #FAFAFB; border-right: 1px solid #F0F0F2; text-align: left; }
.fsz-side > b { display: flex; align-items: center; justify-content: space-between; padding: 0 .8cqw 1.4cqw; font-size: 1.5cqw; font-weight: 600; color: var(--text-dim); }
.fsz-side > b em { display: none; font-style: normal; min-width: 2.6cqw; padding: .2cqw .8cqw; border-radius: 99px; background: var(--brand-black); color: var(--accent-lime); text-align: center; font-size: 1.3cqw; }
.fsz[data-k="0"] .fsz-side .c0, .fsz[data-k="1"] .fsz-side .c1, .fsz[data-k="2"] .fsz-side .c2 { display: inline-block; }
.fsz-side ul { list-style: none; margin: 0; padding: 0; }
.fsz-side li { display: flex; align-items: center; gap: 1cqw; height: 3.7cqw; padding: 0 .8cqw; border-radius: .9cqw; font-size: 1.5cqw; font-weight: 500; color: var(--text);
  overflow: hidden; transition: height .45s cubic-bezier(.3,.9,.3,1), opacity .35s ease, margin .45s ease; }
.fsz-side li + li { margin-top: .5cqw; }
.fsz-side li i { width: 2.4cqw; height: 1.7cqw; border-radius: .4cqw; background: url('../assets/web-demo/sky-1.jpg') center / cover; flex: none; }
.fsz-side li.r0 { background: #fff; box-shadow: 0 1px 3px rgba(17,17,17,.08); }
.fsz-side li.r1, .fsz-side li.r2 { height: 0; opacity: 0; margin-top: 0; }
.fsz[data-k="1"] .fsz-side li.r1, .fsz[data-k="2"] .fsz-side li.r1, .fsz[data-k="2"] .fsz-side li.r2 { height: 3.7cqw; opacity: 1; margin-top: .5cqw; }
.fsz-main { display: grid; grid-template-columns: 1fr 1fr; }
.fsz-main .hero { padding: 5cqw 3.4cqw; display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.fsz-main .hero small { font-size: 1.4cqw; color: var(--text-faint); }
.fsz-main .hero b { margin-top: 1cqw; font-size: 3.6cqw; line-height: 1.05; font-weight: 600; letter-spacing: -.03em; }
.fsz-main .hero u { margin-top: 2.6cqw; text-decoration: none; font-size: 1.5cqw; font-weight: 600; padding: 1.2cqw 2.4cqw; border-radius: 99px; background: var(--text); color: #fff; }
.fsz-main .sky { background: url('../assets/web-demo/sky-hero.jpg') center / cover; }

/* Web: Diseño & UX como Propuesta, Ajustes, Aprobación (12 oct, b) */
.ux3[data-k="0"] .final.v:not(.proto), .ux3[data-k="1"] .final.v:not(.proto), .ux3[data-k="1"] .ux3-pins { opacity: 1; }
.ux3[data-k="1"] .final.v:not(.proto) { opacity: 1; }
.ux3-pins { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.ux3-pins .pin { position: absolute; display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 99px; background: #fff;
  box-shadow: 0 10px 28px -10px rgba(0,0,0,.35); font-size: max(11px, 1.5cqw); white-space: nowrap; opacity: 0; transform: translateY(8px) scale(.95); transition: opacity .4s ease, transform .5s cubic-bezier(.2,.8,.2,1); }
.ux3-pins .pin i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 700; background: #FF9500; color: #fff; }
.ux3-pins .pin b { font-weight: 600; }
.ux3-pins .p1 { left: 64%; top: 30%; } .ux3-pins .p2 { left: 16%; top: 62%; }
.ux3[data-k="1"] .ux3-pins .pin { opacity: 1; transform: none; }
.ux3[data-k="1"] .ux3-pins .p1 { transition-delay: .3s; } .ux3[data-k="1"] .ux3-pins .p2 { transition-delay: .7s; }
.ux3-body .proto .hot { padding: 1.7cqw 3.4cqw; }
.ux3-pins .p2 { left: 22%; top: 49%; }

/* Web: responsive, solo el marco negro (sin aro gris) y sin notch (12 oct, b) */
.rs-stage .mbp .lid, .rs-stage .ipad { background: #0B0B0D; }
.rs-stage .mbp .notch { display: none; }
.rs-stage .ipad i.kb { background: #1A1A1C; }
.rs-stage .iph .sv-phone { background: #0B0B0D; border: 0; }

/* Secciones en negro de lado a lado, como "Diseño que se mueve" (12 oct, b) */
.sv.sv-dark { background: var(--brand-black); margin: 0; border-radius: 0; padding-top: 110px; padding-bottom: 110px; }
.sv-dark .sv-head h2, .sv-dark h2, .sv-dark h3 { color: #fff; }
.sv-dark .sv-head p, .sv-dark p { color: rgba(255,255,255,.66); }
.sv-dark .grad-anim { background-image: linear-gradient(100deg, #A6D133, #C1EA50, #DDF59A, #C1EA50, #A6D133); }
.int-one { max-width: 520px; margin: 0 auto; }
.int-one .ax.web-int { max-width: none; width: 100%; padding: 26px 26px 20px; border-radius: 30px; background: #fff; border: 0; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); }
.int-one .ax.web-int b, .int-one .ax.web-int h3 { color: var(--text); }
.int-one .ax.web-int p, .int-one .ax.web-int small { color: var(--text-dim); }
@media (min-width: 900px) { .sv-head p.one-line { max-width: none; white-space: nowrap; } }
#todo-uno .why-one { margin-top: 0; }
#todo-uno .ones > div + div { border-left-color: rgba(255,255,255,.14); }
#todo-uno .ones span { color: #fff; }
#todo-uno .ones-foot { color: rgba(255,255,255,.55); }
#todo-uno .wo-head h3 { font-size: clamp(34px, 4.2vw, 52px); font-weight: 500; letter-spacing: -.035em; } #todo-uno .wo-head p { font-size: 18px; margin-top: 10px; }

/* Ads: Facebook e Instagram Ads, sección aparte en negro (12 oct, b) */
.meta-stage { display: flex; align-items: center; justify-content: center; gap: 40px; margin-top: 8px; }
.meta-chip { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px 10px 10px; border-radius: 99px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: #fff; font-size: 16px; font-weight: 500; }
.meta-chip i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; }
.meta-chip i svg { width: 20px; height: 20px; }
.meta-chip i.fb { background: #1877F2; } .meta-chip i.ig { background: linear-gradient(45deg, #F9A23A, #E1306C 50%, #833AB4); }
.mk-phone .scr.meta-scr { background: #fff; }
.meta-scr .mt-top { padding: 14px 22px 8px; font-size: 13px; font-weight: 600; color: var(--text); }
.meta-scr .mt-post { text-align: left; color: var(--text); }
.mt-h { display: flex; align-items: center; gap: 9px; padding: 8px 14px; }
.mt-h .av { width: 32px; height: 32px; border-radius: 50%; background: var(--brand-black); display: grid; place-items: center; }
.mt-h .av img { width: 16px; height: 16px; object-fit: contain; }
.mt-h b { display: block; font-size: 13.5px; font-weight: 600; } .mt-h small { font-size: 11.5px; color: var(--text-faint); }
.mt-h em { margin-left: auto; font-style: normal; color: var(--text-faint); }
.mt-img img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.mt-cta { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: #F2F3F5; }
.mt-cta small { display: block; font-size: 10.5px; color: var(--text-faint); } .mt-cta b { font-size: 13.5px; font-weight: 600; }
.mt-cta span { padding: 7px 14px; border-radius: 8px; background: #1877F2; color: #fff; font-size: 12.5px; font-weight: 600; }
.mt-act { display: flex; justify-content: space-between; padding: 10px 14px; font-size: 12px; color: var(--text-dim); }
.mt-act .lk { display: inline-flex; align-items: center; gap: 5px; } .mt-act .lk svg { width: 14px; height: 14px; color: #FF375F; }
@media (max-width: 760px) { .meta-stage { flex-wrap: wrap; gap: 14px; } .meta-stage .mk-phone { order: -1; width: 100%; display: flex; justify-content: center; } .meta-stage .mk-phone { flex-basis: 100%; } }
.mt-img img { aspect-ratio: 4 / 5; object-position: center 50%; }
#meta-ads .mk-phone { box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 40px 90px -30px rgba(193,234,80,.18); }
@media (max-width: 760px) {
  .meta-stage { display: grid; grid-template-columns: auto auto; justify-content: center; gap: 18px 12px; }
  .meta-stage .mk-phone { order: 0; grid-column: 1 / -1; grid-row: 1; width: 260px; display: block; flex-basis: auto; justify-self: center; }
  .meta-chip { font-size: 15px; }
}

/* ===== 12 oct 2026, c ===== */
/* Web: formatos como tarjetas simples */
.mi-pages .pgs { display: flex; gap: 5px; margin-bottom: 6px; }
.mi-pages .pgi { width: 18px; height: 24px; border-radius: 4px; background: #fff; box-shadow: inset 0 0 0 1.5px #C9CCD2; position: relative; }
.mi-pages .pgi::before { content: ""; position: absolute; left: 3px; right: 3px; top: 4px; height: 6px; border-radius: 2px; background: #7DB7E8; }
.mi-pages .pgi::after { content: ""; position: absolute; left: 3px; right: 6px; top: 13px; height: 2px; border-radius: 2px; background: #D5D7DC; box-shadow: 0 4px 0 #D5D7DC; }
/* Ads: objetivo de la campaña */
.ax.mini.mi-goal { gap: 8px; }
.mi-goal .mi-sub { margin-bottom: 4px; }
.mi-goal .g { display: flex; align-items: center; gap: 8px; width: 180px; padding: 10px 14px; border-radius: 14px; background: #fff; font-size: 14.5px; font-weight: 500; color: var(--text-dim); box-shadow: inset 0 0 0 1px #E6E7EB; }
.mi-goal .g i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-lime); color: var(--brand-black); }
.mi-goal .g i svg { width: 11px; height: 11px; }
.mi-goal .g.on { background: var(--brand-black); color: #fff; box-shadow: none; }
/* Ads: post de Facebook */
.fbk .fb-bar { display: flex; align-items: center; justify-content: space-between; padding: 30px 14px 8px; border-bottom: 1px solid #ECEDF0; }
.fbk .fb-bar b { font-size: 22px; font-weight: 700; letter-spacing: -.04em; color: #1877F2; }
.fbk .fb-bar span { display: flex; gap: 6px; } .fbk .fb-bar span i { width: 26px; height: 26px; border-radius: 50%; background: #ECEDF0; }
.fbk .mt-h small { display: inline-flex; align-items: center; gap: 4px; } .fbk .mt-h small svg { width: 10px; height: 10px; }
.fbk .fb-txt { margin: 0; padding: 0 14px 8px; font-size: 12.5px; line-height: 1.4; color: var(--text); }
.fbk .mt-img img { aspect-ratio: 1; }
.fbk .mt-cta span { background: #E4E6EB; color: var(--text); }
.fb-rx { display: flex; justify-content: space-between; align-items: center; padding: 8px 14px; font-size: 11.5px; color: var(--text-dim); }
.fb-rx .em { display: inline-flex; align-items: center; gap: 4px; }
.fb-rx .em i { width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; color: #fff; box-shadow: 0 0 0 2px #fff; }
.fb-rx .em i svg { width: 9px; height: 9px; } .fb-rx .em i.l { background: #1877F2; } .fb-rx .em i.h { background: #F33E58; margin-left: -6px; margin-right: 2px; }
.fb-act { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 10px; padding: 6px 0; border-top: 1px solid #ECEDF0; }
.fb-act span { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--text-dim); }
.fb-act svg { width: 15px; height: 15px; }
/* Eventos: ventas por tipo */
.ev-types { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.ev-types > div { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px; border-radius: 14px; background: #F5F5F7; text-align: left; }
.ev-types b { font-size: 22px; font-weight: 700; letter-spacing: -.03em; line-height: 1; } .ev-types small { font-size: 11px; color: var(--text-faint); margin-top: -4px; }
/* Todo en Uno: Social + Web + Ads = una sola estrategia */
.eq { display: flex; align-items: center; justify-content: center; gap: 14px; max-width: 1060px; margin: 10px auto 0; }
.eq-c { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 170px; padding: 28px 14px 24px; border-radius: 28px; background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.eq-c i { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; color: var(--c); background: color-mix(in srgb, var(--c) 13%, white); }
.eq-c i svg { width: 26px; height: 26px; } .eq-c b { font-size: 16px; font-weight: 500; letter-spacing: -.01em; }
.eq-c.res { width: 210px; background: var(--brand-black); color: #fff; box-shadow: 0 0 0 2px var(--accent-lime), 0 30px 60px -30px rgba(17,17,17,.5); }
.eq-c.res i { background: rgba(255,255,255,.08); } .eq-c.res i img { width: 26px; height: 26px; object-fit: contain; }
.eq-op { font-size: 30px; font-weight: 400; color: var(--text-faint); }
@media (max-width: 900px) { .eq { flex-wrap: wrap; gap: 10px; } .eq-c { width: 140px; padding: 20px 10px; } .eq-c.res { width: 100%; max-width: 300px; flex-direction: row; justify-content: center; } .eq-op { width: 24px; text-align: center; } }
/* Todo en Uno: tu mes en cuatro tarjetas */
.sv-cards.four { grid-template-columns: repeat(4, 1fr); max-width: 1120px; gap: 16px; }
.sv-cards.four .sv-card { padding: 18px; }
.sv-cards.four .ax.mini { min-height: 176px; }
@media (max-width: 1000px) { .sv-cards.four { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sv-cards.four { grid-template-columns: 1fr; max-width: 420px; } }
.mo-cal { width: 78px; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: 0 6px 18px -10px rgba(17,17,17,.3); text-align: center; }
.mo-cal span { display: block; padding: 4px 0; background: #FF3B30; color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.mo-cal b { display: block; padding: 4px 0 8px; font-size: 38px; font-weight: 600; line-height: 1; }
.mo-tiles { display: flex; gap: 6px; align-items: flex-end; }
.mo-tiles i { display: block; border-radius: 9px; background: center / cover; }
.mo-tiles .t1 { width: 46px; height: 46px; background-image: url('../assets/work/rhz-flyer.jpg'); } .mo-tiles .t2 { width: 38px; height: 66px; background-image: url('../assets/work/mystic.jpg'); } .mo-tiles .t3 { width: 58px; height: 40px; background-image: url('../assets/web-demo/sky-1.jpg'); }
.mo-ok { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px 9px 9px; border-radius: 99px; background: #fff; font-size: 15px; font-weight: 600; color: #1F7A45; box-shadow: 0 6px 18px -10px rgba(17,17,17,.3); }
.mo-ok i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #34C759; color: #fff; } .mo-ok i svg { width: 13px; height: 13px; }
.mo-bars { display: flex; align-items: flex-end; gap: 8px; height: 70px; }
.mo-bars i { width: 20px; border-radius: 6px; background: rgba(193,234,80,.4); } .mo-bars i.on { background: var(--accent-lime); }
/* Todo en Uno: intro en negro */
#todo-intro .one-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 1000px; margin: 8px auto 0; }
#todo-intro .one-tiles > div { display: flex; flex-direction: column; align-items: flex-start; padding: 30px 28px; border-radius: 30px; text-align: left;
  background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.1); }
#todo-intro .one-tiles b { font-size: 112px; font-weight: 600; line-height: .85; letter-spacing: -.06em; }
#todo-intro .one-tiles span { margin-top: 18px; font-size: 24px; font-weight: 500; letter-spacing: -.02em; color: #fff; }
#todo-intro .one-tiles small { margin-top: 6px; font-size: 15px; line-height: 1.5; color: rgba(255,255,255,.6); }
#todo-intro .ones-foot { margin-top: 32px; text-align: center; font-size: 15.5px; color: rgba(255,255,255,.55); }
@media (max-width: 760px) { #todo-intro .one-tiles { grid-template-columns: 1fr; max-width: 420px; } #todo-intro .one-tiles b { font-size: 88px; } }
#formatos .ax.mini.mi-pages { width: 100%; max-width: none; align-self: stretch; }
.mi-pages .pgs { gap: 7px; margin-bottom: 10px; }
.mi-pages .pgi { width: 26px; height: 34px; border-radius: 5px; }
.mi-pages .pgi::before { left: 4px; right: 4px; top: 5px; height: 9px; }
.mi-pages .pgi::after { left: 4px; right: 8px; top: 19px; }
.fbk .fb-bar { padding-top: 26px; padding-bottom: 6px; }
.fbk .mt-img { background: #0E1A12; }
.fbk .mt-img img { aspect-ratio: 1; object-fit: contain; }
.fbk .fb-txt { padding-bottom: 6px; }
#formatos .sv-canvas { align-self: stretch; width: 100%; display: flex; justify-content: center; }
@media (max-width: 900px) {
  .eq { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 6px; align-items: center; max-width: 440px; }
  .eq-c { width: auto; padding: 16px 6px 14px; gap: 8px; border-radius: 20px; }
  .eq-c i { width: 40px; height: 40px; border-radius: 12px; } .eq-c i svg { width: 20px; height: 20px; }
  .eq-c b { font-size: 12.5px; text-align: center; }
  .eq-op { width: auto; font-size: 20px; }
  .eq-op:nth-of-type(3) { grid-column: 1 / -1; line-height: 1; }
  .eq-c.res { grid-column: 1 / -1; width: 100%; max-width: none; flex-direction: row; justify-content: center; padding: 16px; }
  .eq-c.res b { font-size: 16px; }
}

/* ===== 12 oct 2026, d ===== */
/* Secciones claras que vienen después de una negra: separadas, no pegadas */
.sv-dark + .sv.alt { margin-top: 96px; }
@media (max-width: 760px) { .sv-dark + .sv.alt { margin-top: 56px; } }
/* Ads: palabras clave con cuadrícula sutil, como diseño gráfico */
.sv-grid { position: relative; overflow: hidden; }
.sv-grid::before { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: linear-gradient(to right, rgba(16,16,19,.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(16,16,19,.05) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 45%, #000 0%, transparent 85%); mask-image: radial-gradient(ellipse 80% 70% at 50% 45%, #000 0%, transparent 85%); }
#palabras-clave .gs { margin-top: 8px; }
/* Todo en Uno: las tres tarjetas alineadas */
.to-three { margin-top: 8px; }
.to-three .sv-canvas { height: 280px; display: flex; align-items: center; justify-content: center; }
.to-three .sv-card h3 { margin-top: 22px; }
/* Todo en Uno: tu mes en cinco */
.sv-cards.five { grid-template-columns: repeat(5, 1fr); max-width: 1200px; gap: 14px; }
.sv-cards.five .sv-card { padding: 16px; }
.sv-cards.five .ax.mini { min-height: 170px; }
.sv-cards.five .sv-card h3 { font-size: 19px; }
.sv-cards.five .sv-card p { font-size: 14px; }
@media (max-width: 1100px) { .sv-cards.five { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .sv-cards.five { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .sv-cards.five { grid-template-columns: 1fr; max-width: 420px; } }
.mo-rev { display: flex; flex-direction: column; gap: 6px; width: 150px; }
.mo-rev span { display: flex; align-items: center; justify-content: space-between; padding: 8px 10px 8px 12px; border-radius: 12px; background: #fff; font-size: 13px; font-weight: 500; box-shadow: inset 0 0 0 1px #E6E7EB; }
.mo-rev em { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 13px; font-weight: 700; }
.mo-rev em.up { background: rgba(52,199,89,.15); color: #1F7A45; } .mo-rev em.up svg { width: 11px; height: 11px; }
.mo-rev em.same { background: #F2F3F5; color: var(--text-faint); }
/* Todo en Uno: 1:1 */
.oo { display: flex; align-items: center; justify-content: center; gap: 28px; max-width: 900px; margin: 12px auto 0; padding: 44px 40px; border-radius: 36px;
  background: radial-gradient(60% 90% at 50% 50%, rgba(193,234,80,.12), transparent 70%), linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); border: 1px solid rgba(255,255,255,.1); }
.oo-side { display: flex; flex-direction: column; align-items: center; gap: 10px; flex: none; }
.oo-side small { font-size: 14px; color: rgba(255,255,255,.6); }
.oo-av { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; font-size: 22px; font-weight: 600; }
.oo-av.you { background: #fff; color: var(--brand-black); }
.oo-av.crevo { background: var(--brand-black); box-shadow: inset 0 0 0 2px var(--accent-lime); } .oo-av.crevo img { width: 36px; height: 36px; object-fit: contain; }
.oo-mid { flex: 1; display: flex; align-items: center; gap: 20px; min-width: 0; }
.oo-mid .ln { flex: 1; height: 2px; border-radius: 2px; background: linear-gradient(90deg, rgba(193,234,80,0), rgba(193,234,80,.7)); }
.oo-mid .ln:last-child { background: linear-gradient(90deg, rgba(193,234,80,.7), rgba(193,234,80,0)); }
.oo-mid b { font-size: clamp(96px, 12vw, 168px); font-weight: 600; line-height: .9; letter-spacing: -.05em; }
.oo-cap { margin-top: 28px; text-align: center; font-size: 20px; color: #fff !important; font-weight: 500; letter-spacing: -.01em; }
#todo-intro .ones-foot { margin-top: 10px; }
@media (max-width: 640px) { .oo { gap: 12px; padding: 28px 16px; } .oo-av { width: 56px; height: 56px; font-size: 16px; } .oo-av.crevo img { width: 24px; height: 24px; } .oo-mid { gap: 8px; } .oo-mid b { font-size: 64px; } .oo-cap { font-size: 17px; } }
/* Web: Diseño & UX en tarjetas */
.ux-cards { margin-top: 8px; }
.ux-notes { display: flex; flex-direction: column; gap: 8px; }
.ux-notes span { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 7px; border-radius: 99px; background: #fff; font-size: 13.5px; font-weight: 600; box-shadow: 0 6px 18px -10px rgba(17,17,17,.3); }
.ux-notes span:nth-child(2) { margin-left: 26px; }
.ux-notes i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 700; background: #FF9500; color: #fff; }
.ux-ai { display: flex; justify-content: center; margin-top: 28px; }
.ux-ai .sv-ai-note { margin: 0; padding: 0; border: 0; }
/* Web: bordes finos en la Mac y el iPad */
.rs-stage .mbp .bezel { padding: 5px 5px 6px; }
.rs-stage .mbp .bezel::after { inset: 5px 5px 6px; }
.rs-stage .ipad .bezel { padding: 5px; }
.rs-stage .ipad .bezel::after { inset: 5px; }
.rs-stage .ipad .disp { border-radius: 22px; }
.sv-cards.five .sv-canvas { height: 190px; display: flex; align-items: center; justify-content: center; }
.sv-cards.five .ax.mini { min-height: 0; padding: 12px; }
.mo-rev { width: 140px; gap: 5px; }
.mo-rev span { padding: 6px 8px 6px 11px; font-size: 12.5px; }
.mo-rev em { width: 18px; height: 18px; font-size: 12px; line-height: 1; }
.ux-cards .sv-canvas { height: 250px; align-self: stretch; width: 100%; display: flex; align-items: center; justify-content: center; }
.ux-cards .ax.mini { width: 100%; max-width: none; min-height: 0; background: transparent; }
.ux-cards .sv-card h3 { margin-top: 22px; }

/* ===== 12 oct 2026, e ===== */
/* Web: escena responsive más simple (sin precios, estrellas, corazones ni reserva) */
.rs-stage .room small, .rs-stage .room .stars, .rs-stage .dock, .rs-stage .book, .rs-stage .sey, .rs-stage .btn-g, .rs-stage .mbar span { display: none !important; }
.rs-stage .room .ph::after, .rs-stage .room .ph::before { display: none !important; }
.rs-stage .mbar b { visibility: hidden; }
/* Web: Diseño & UX como una sola pieza grande */
.uxb { max-width: 920px; margin: 8px auto 0; border-radius: 24px; background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 50px 90px -50px rgba(17,17,17,.45); }
.uxb .ux3-bar { position: relative; }
.uxb-url { position: absolute; left: 50%; transform: translateX(-50%); padding: 3px 40px; border-radius: 99px; background: #fff; font-size: 11.5px; color: var(--text-faint); }
.uxb .ux3-body { aspect-ratio: 16 / 9.4; }
.uxb-com { position: absolute; z-index: 3; right: 4cqw; top: 46%; display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px 12px 12px; border-radius: 18px 18px 18px 6px; background: #fff; text-align: left;
  font-size: max(12px, 1.6cqw); font-weight: 500; color: var(--text); box-shadow: 0 20px 40px -16px rgba(17,17,17,.35); }
.uxb-com .av { width: 30px; height: 30px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #E67A35; color: #fff; font-size: 13px; font-weight: 700; }
.uxb-com small { display: block; font-size: max(10.5px, 1.2cqw); color: var(--text-faint); font-weight: 400; margin-bottom: 1px; }
.uxb-ok { position: absolute; z-index: 3; left: 4cqw; bottom: 4cqw; display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 8px; border-radius: 99px; background: var(--brand-black); color: #fff;
  font-size: max(12px, 1.6cqw); font-weight: 600; box-shadow: 0 16px 30px -12px rgba(17,17,17,.5); }
.uxb-ok i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-lime); color: var(--brand-black); } .uxb-ok i svg { width: 12px; height: 12px; }
.uxb .ba-row { display: none; }
.uxb-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 920px; margin: 32px auto 0; text-align: left; }
.uxb-steps > div { display: grid; grid-template-columns: 34px 1fr; column-gap: 12px; align-items: center; }
.uxb-steps span { grid-row: span 2; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); font-size: 14px; font-weight: 700; }
.uxb-steps b { font-size: 18px; font-weight: 500; letter-spacing: -.02em; } .uxb-steps small { font-size: 14px; color: var(--text-dim); }
@media (max-width: 760px) { .uxb { border-radius: 16px; } .uxb-com { right: 3cqw; top: 40%; padding: 8px 10px 8px 8px; } .uxb-com .av { width: 22px; height: 22px; font-size: 10px; } .uxb-ok { padding: 5px 10px 5px 5px; } .uxb-ok i { width: 18px; height: 18px; } .uxb-steps { grid-template-columns: 1fr; max-width: 340px; } .uxb-url { display: none; } }
.uxb .ba-row { display: grid; }
.uxb .ux3-body { aspect-ratio: 16 / 9.6; }
.uxb-ok { left: auto; right: 4cqw; bottom: auto; top: 12cqw; }
.uxb-com { top: auto; bottom: 18cqw; right: auto; left: 46%; }
@media (max-width: 760px) { .uxb-com { bottom: 16cqw; left: 40%; } }
@media (max-width: 760px) {
  .uxb-com { font-size: 10px; padding: 6px 9px 6px 6px; gap: 6px; border-radius: 12px 12px 12px 4px; } .uxb-com small { font-size: 8.5px; } .uxb-com .av { width: 18px; height: 18px; font-size: 9px; }
  .uxb-ok { font-size: 10px; padding: 4px 9px 4px 4px; gap: 5px; } .uxb-ok i { width: 16px; height: 16px; } .uxb-ok i svg { width: 9px; height: 9px; }
}
/* Todo en Uno: tu mes, más grande */
.sv-cards.five { max-width: 1320px; gap: 16px; }
.sv-cards.five .sv-card { padding: 18px 18px 26px; }
.sv-cards.five .sv-canvas { height: 240px; }
.sv-cards.five .ax.mini { zoom: 1.2; }
.sv-cards.five .sv-card h3 { font-size: 21px; margin-top: 20px; }
.sv-cards.five .sv-card p { font-size: 15px; }
@media (max-width: 1100px) { .sv-cards.five .ax.mini { zoom: 1; } .sv-cards.five .sv-canvas { height: 210px; } }
#tu-mes > .wrap { max-width: 1400px; }
.sv-cards.five .ax.mini { zoom: 1.12; }
@media (max-width: 1100px) { .sv-cards.five .ax.mini { zoom: 1; } }
/* Web: formatos explicativos */
.fm-card .fm-ideal { margin-top: 6px; min-height: 44px; }
.fm-list { list-style: none; margin: 18px 0 0; padding: 16px 4px 0; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; text-align: left; }
.fm-list li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: var(--text); }
.fm-list svg { width: 18px; height: 18px; flex: none; padding: 4px; border-radius: 50%; background: rgba(193,234,80,.35); color: #3A4D12; }
.fm-card .fm-ideal { min-height: 0; }
.fm-list { align-self: stretch; padding: 16px 14px 0; }
#formatos .sv-canvas { height: 190px; }
/* Todo en Uno: 1:1 sin recuadro, tipográfico */
.oo2 { position: relative; display: flex; flex-direction: column; align-items: center; margin: 4px auto 0; }
.oo2::before { content: ""; position: absolute; left: 50%; top: 52%; width: 620px; max-width: 90vw; height: 320px; transform: translate(-50%, -50%); border-radius: 50%;
  background: radial-gradient(closest-side, rgba(193,234,80,.18), transparent); pointer-events: none; }
.oo2 .pair { position: relative; display: flex; }
.oo2 .pair span { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; box-shadow: 0 0 0 4px var(--brand-black); }
.oo2 .you { background: #fff; color: var(--brand-black); font-size: 18px; font-weight: 600; }
.oo2 .crevo { margin-left: -14px; background: #1A1A1C; border: 2px solid var(--accent-lime); } .oo2 .crevo img { width: 26px; height: 26px; object-fit: contain; }
.oo2 .pair .on { position: absolute; right: -2px; bottom: 2px; width: 16px; height: 16px; border-radius: 50%; background: #34C759; box-shadow: 0 0 0 3px var(--brand-black); }
.oo2 .lbl { position: relative; margin-top: 22px; font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.oo2 .big { position: relative; margin-top: 6px; font-size: clamp(120px, 17vw, 240px); font-weight: 600; line-height: .9; letter-spacing: -.06em; }
.oo2 .svcs { position: relative; display: inline-flex; align-items: center; gap: 14px; margin-top: 26px; padding: 12px 22px; border-radius: 99px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.oo2 .svcs span { font-size: 15px; font-weight: 500; color: #fff; } .oo2 .svcs i { width: 4px; height: 4px; border-radius: 50%; background: var(--accent-lime); }
@media (max-width: 640px) { .oo2 .big { font-size: 112px; } .oo2 .svcs { gap: 9px; padding: 10px 14px; } .oo2 .svcs span { font-size: 13px; } .oo2 .pair span { width: 52px; height: 52px; } }

/* ===== 12 oct 2026, f: Diseño & UX como lienzo de diseño en negro ===== */
.dcv { max-width: 1040px; margin: 8px auto 0; border-radius: 26px; overflow: hidden; background: #18181A; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 50px 100px -40px rgba(0,0,0,.8); text-align: left; }
.dcv-top { display: flex; align-items: center; gap: 14px; height: 46px; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.08); }
.dcv-top .dots { display: flex; gap: 7px; } .dcv-top .dots i { width: 11px; height: 11px; border-radius: 50%; background: #3A3A3E; }
.dcv-top b { flex: 1; text-align: center; font-size: 13px; font-weight: 500; color: rgba(255,255,255,.7); }
.dcv-top .ppl { display: flex; } .dcv-top .ppl i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 700; box-shadow: 0 0 0 2px #18181A; }
.dcv-top .ppl .c { background: var(--accent-lime); color: var(--brand-black); } .dcv-top .ppl .t { background: #FF8A3D; color: #fff; margin-left: -6px; }
.dcv-stage { container-type: inline-size; position: relative; aspect-ratio: 16 / 9.2;
  background-color: #141416; background-image: radial-gradient(rgba(255,255,255,.09) 1px, transparent 1.2px); background-size: 22px 22px; }
.dcv-stage .ab-lbl { position: absolute; left: 17%; top: 5.2cqw; font-size: max(10px, 1.15cqw); color: rgba(255,255,255,.45); }
.dab { container-type: inline-size; position: absolute; left: 17%; top: 7.6cqw; width: 66%; aspect-ratio: 16 / 9.6; border-radius: 1.2cqw; overflow: hidden; background: #fff;
  box-shadow: 0 0 0 1.5px rgba(193,234,80,.0), 0 30px 60px -20px rgba(0,0,0,.6); }
.dab .ba-l { position: absolute; inset: 0; }
.cur { position: absolute; z-index: 3; display: flex; align-items: flex-start; color: var(--c); }
.cur svg { width: max(16px, 2cqw); height: max(16px, 2cqw); filter: drop-shadow(0 2px 4px rgba(0,0,0,.4)); }
.cur b { margin: max(12px, 1.6cqw) 0 0 -2px; padding: 3px 9px; border-radius: 6px; background: var(--c); font-size: max(10px, 1.15cqw); font-weight: 700; color: var(--brand-black); white-space: nowrap; }
.cur.you b { color: #fff; }
.cur.crevo { left: 44%; top: 25%; animation: curA 6s ease-in-out infinite; }
.cur.you { left: 27%; top: 62%; animation: curB 7s ease-in-out infinite; }
@keyframes curA { 0%,100% { transform: translate(0,0); } 50% { transform: translate(3cqw, 2cqw); } }
@keyframes curB { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-2cqw, -1.5cqw); } }
.dcv-com { position: absolute; z-index: 2; left: 33%; top: 70%; display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px 12px 12px; border-radius: 6px 18px 18px 18px; background: #fff;
  font-size: max(11px, 1.45cqw); font-weight: 500; color: var(--text); box-shadow: 0 20px 40px -14px rgba(0,0,0,.6); }
.dcv-com .av { width: max(20px, 2.6cqw); height: max(20px, 2.6cqw); border-radius: 50%; flex: none; display: grid; place-items: center; background: #FF8A3D; color: #fff; font-size: max(9px, 1.1cqw); font-weight: 700; }
.dcv-com small { display: block; font-size: max(9px, 1.05cqw); color: var(--text-faint); font-weight: 400; }
.dcv-ok { position: absolute; z-index: 2; right: 4%; top: 7cqw; display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 8px; border-radius: 99px; background: var(--accent-lime); color: var(--brand-black);
  font-size: max(11px, 1.45cqw); font-weight: 700; box-shadow: 0 16px 30px -12px rgba(193,234,80,.45); }
.dcv-ok i { width: max(18px, 2.3cqw); height: max(18px, 2.3cqw); border-radius: 50%; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); } .dcv-ok i svg { width: 55%; height: 55%; }
#diseno-ux .uxb-steps b { color: #fff; } #diseno-ux .uxb-steps small { color: rgba(255,255,255,.6); }
#diseno-ux .uxb-steps span { background: var(--accent-lime); color: var(--brand-black); }
#diseno-ux .ux-lead strong { color: #fff; }
#diseno-ux .sv-ai-note.ai-blue { color: #8FC1FF; }
@media (max-width: 760px) { .dcv { border-radius: 18px; } .dcv-top { height: 38px; } .dab { left: 6%; width: 88%; top: 7cqw; } .dcv-stage { aspect-ratio: 4 / 3.3; } .dcv-stage .ab-lbl { left: 6%; top: 2.6cqw; }
  .cur.crevo { left: 50%; top: 20%; } .cur.you { left: 20%; top: 66%; } .dcv-com { left: 28%; top: 74%; } .dcv-ok { right: 4%; top: auto; bottom: 4%; } }
@media (prefers-reduced-motion: reduce) { .cur { animation: none !important; } }
.dab .ba-l.final { clip-path: none; }
@media (max-width: 760px) { .dcv-ok { top: 2.6cqw; bottom: auto; right: 4%; } .dcv-com { left: 22%; top: 70%; } .cur.you { left: 12%; top: 60%; } }
/* Todo en Uno: 1:1 como videollamada */
.call { position: relative; max-width: 820px; margin: 8px auto 0; padding: 16px; border-radius: 32px; background: linear-gradient(160deg, #222225, #161618); border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 60px 120px -50px rgba(193,234,80,.25), 0 40px 80px -40px rgba(0,0,0,.8); }
.call-top { display: flex; align-items: center; gap: 12px; padding: 4px 8px 14px; }
.call-top b { font-size: 34px; font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.call-top span { font-size: 15px; font-weight: 500; color: rgba(255,255,255,.75); }
.call-top em { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-style: normal; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.8); }
.call-top em i { width: 8px; height: 8px; border-radius: 50%; background: #FF3B30; box-shadow: 0 0 0 4px rgba(255,59,48,.18); }
.call-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tile { position: relative; aspect-ratio: 4 / 3.2; border-radius: 22px; display: grid; place-items: center; overflow: hidden; }
.tile.crevo { background: radial-gradient(70% 70% at 50% 40%, rgba(193,234,80,.22), transparent 70%), #0E0F0C; box-shadow: inset 0 0 0 2px var(--accent-lime); }
.tile.you { background: radial-gradient(70% 70% at 50% 40%, rgba(255,138,61,.35), transparent 70%), linear-gradient(160deg, #3A2A22, #1E1A18); }
.tile .face { width: 92px; height: 92px; border-radius: 50%; display: grid; place-items: center; font-size: 26px; font-weight: 600; }
.tile.crevo .face { background: #000; box-shadow: 0 0 0 3px rgba(193,234,80,.5), 0 0 0 12px rgba(193,234,80,.08); } .tile.crevo .face img { width: 40px; height: 40px; object-fit: contain; }
.tile.you .face { background: #fff; color: var(--brand-black); }
.tile .tag { position: absolute; left: 12px; bottom: 12px; padding: 5px 11px; border-radius: 99px; background: rgba(0,0,0,.45); color: #fff; font-size: 13px; font-weight: 600; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.tile .wave { position: absolute; right: 14px; bottom: 15px; display: flex; align-items: flex-end; gap: 3px; height: 16px; }
.tile .wave i { width: 3px; border-radius: 2px; background: var(--accent-lime); animation: callWave 1s ease-in-out infinite; }
.tile .wave i:nth-child(1) { height: 7px; } .tile .wave i:nth-child(2) { height: 15px; animation-delay: .15s; } .tile .wave i:nth-child(3) { height: 10px; animation-delay: .3s; }
@keyframes callWave { 50% { transform: scaleY(.45); } }
.call-ctrl { display: flex; justify-content: center; gap: 12px; padding-top: 16px; }
.call-ctrl span { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.1); color: #fff; }
.call-ctrl span svg { width: 22px; height: 22px; } .call-ctrl .end { background: #FF3B30; }
.call-svcs { display: flex; justify-content: center; align-items: center; gap: 14px; width: max-content; margin: 26px auto 0; padding: 12px 22px; border-radius: 99px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.call-svcs span { font-size: 15px; font-weight: 500; color: #fff; } .call-svcs i { width: 4px; height: 4px; border-radius: 50%; background: var(--accent-lime); }
@media (max-width: 640px) { .call { padding: 10px; border-radius: 22px; } .call-top b { font-size: 26px; } .call-top span { font-size: 12.5px; } .call-top em { font-size: 11px; }
  .call-tiles { gap: 8px; } .tile { border-radius: 14px; } .tile .face { width: 54px; height: 54px; font-size: 16px; } .tile.crevo .face img { width: 24px; height: 24px; } .tile .tag { font-size: 10.5px; left: 7px; bottom: 7px; padding: 3px 8px; }
  .call-ctrl span { width: 38px; height: 38px; } .call-ctrl span svg { width: 18px; height: 18px; } .call-svcs { gap: 9px; padding: 10px 14px; } .call-svcs span { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .tile .wave i { animation: none; } }

/* ==========================================================================
   13 oct 2026, a: Social Media
   ========================================================================== */
/* Lo creamos y lo adaptamos: formatos más grandes y espacios parejos */
.sv-dg-one { max-width: 920px; }
.sv-dg-one .sv-mfig { min-height: 380px; padding: 48px 32px; }
.sv-dg-one .dz-formats { gap: 24px; }
.sv-dg-one .dz-formats .fm { gap: 12px; }
.sv-dg-one .sv-mtext { padding: 30px 40px 38px; }
@media (min-width: 900px) { .sv-dg-one .dz-formats { zoom: 1.5; } }

/* Organizamos + publicamos en una sola pieza */
.pub-mix { max-width: 1000px; margin: 72px auto 0; display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 80px; align-items: center; }
.pub-mix .lock { margin: 0; }
.pm-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pm-steps li { display: flex; align-items: flex-start; gap: 18px; padding: 26px 0; border-top: 1px solid var(--border); text-align: left; }
.pm-steps li:first-child { border-top: 0; padding-top: 0; }
.pm-steps li:last-child { padding-bottom: 0; }
.pm-steps h3 { font-size: 21px; font-weight: 500; letter-spacing: -.02em; line-height: 1.25; }
.pm-steps p { margin-top: 6px; font-size: 16px; line-height: 1.5; color: var(--text-dim); }
.pm-ic { flex: none; width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: #fff; box-shadow: 0 10px 20px -12px rgba(17,17,17,.4); }
.pm-ic svg { width: 22px; height: 22px; }
.pm-ic.s1 { background: linear-gradient(160deg, #6AAEF5, #2F74D6); }
.pm-ic.s2 { background: linear-gradient(160deg, #D3F27A, var(--accent-lime) 60%, #ADD93C); color: var(--brand-black); }
.pm-ic.s3 { background: var(--brand-black); color: var(--accent-lime); }
@media (max-width: 900px) {
  .pub-mix { grid-template-columns: 1fr; gap: 48px; max-width: 440px; margin-top: 56px; }
  .pm-steps li { padding: 20px 0; }
  .pm-steps h3 { font-size: 19px; }
  .pm-steps p { font-size: 15px; }
}

/* Diseño que se mueve: celulares un poco más grandes */
#social-content .sv-motion-head { margin-bottom: 64px; }
.sv-phone.mo-ph { transform: scale(.94); margin: -15px -7px; }
@media (max-width: 760px) { .sv-phone.mo-ph { transform: scale(.82); margin: -44px -22px; } }

/* ==========================================================================
   13 oct 2026, b: Web
   ========================================================================== */
/* Formatos: mapa de páginas en vez de íconos sueltos */
#formatos .sv-canvas { min-height: 220px; align-items: center; padding: 22px 14px 18px; }
.fm-map { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.fm-map .smap { width: 100%; max-width: 250px; height: auto; display: block; overflow: visible; filter: drop-shadow(0 10px 14px rgba(17,17,17,.07)); }
.fm-map .fm-n { display: inline-flex; padding: 6px 14px; border-radius: 99px; background: #fff; font-size: 13px; font-weight: 600; color: var(--text); box-shadow: 0 0 0 1px var(--border); }
.ax-js .fm-map .t { opacity: 0; transform: translateY(6px); transform-box: fill-box; transition: opacity .5s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.ax-js .fm-map.ax-on .t { opacity: 1; transform: none; }
.fm-map .d1 { transition-delay: .12s !important; } .fm-map .d2 { transition-delay: .2s !important; } .fm-map .d3 { transition-delay: .28s !important; }
.fm-map .d4 { transition-delay: .36s !important; } .fm-map .d5 { transition-delay: .44s !important; } .fm-map .d6 { transition-delay: .52s !important; }
@media (prefers-reduced-motion: reduce) { .ax-js .fm-map .t { opacity: 1; transform: none; transition: none; } }

/* Diseño & UX: solo el diseño, aprobado, y los pasos en una línea */
.uxs { position: relative; max-width: 880px; margin: 8px auto 0; }
.uxs-shot { container-type: inline-size; position: relative; aspect-ratio: 16 / 9.6; border-radius: 20px; overflow: hidden; background: #fff;
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 60px 120px -50px rgba(193,234,80,.35), 0 40px 80px -40px rgba(0,0,0,.9); }
.uxs-shot .ba-l { position: absolute; inset: 0; }
.uxs-shot .ba-l.final { clip-path: none; }
.uxs-ok { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); display: inline-flex; align-items: center; gap: 9px; padding: 9px 20px 9px 9px; border-radius: 99px;
  background: var(--accent-lime); color: var(--brand-black); font-size: 16px; font-weight: 600; white-space: nowrap; box-shadow: 0 16px 34px -12px rgba(193,234,80,.55); }
.uxs-ok i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.uxs-ok i svg { width: 14px; height: 14px; }
.uxs-flow { list-style: none; margin: 64px auto 0; padding: 0; display: flex; justify-content: center; align-items: center; gap: 10px; flex-wrap: wrap; }
.uxs-flow li { display: inline-flex; align-items: center; gap: 7px; font-size: 16px; font-weight: 500; color: rgba(255,255,255,.55); }
.uxs-flow li + li::before { content: ""; width: 28px; height: 1px; margin-right: 3px; background: rgba(255,255,255,.22); }
.uxs-flow li.on { color: #fff; }
.uxs-flow li.on i { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-lime); color: var(--brand-black); }
.uxs-flow li.on i svg { width: 10px; height: 10px; }
#diseno-ux .ux-ai { margin-top: 22px; }
@media (max-width: 760px) {
  .uxs-shot { border-radius: 12px; }
  .uxs-ok { font-size: 14px; padding: 7px 16px 7px 7px; } .uxs-ok i { width: 22px; height: 22px; }
  .uxs-flow { margin-top: 48px; gap: 8px; } .uxs-flow li { font-size: 14px; } .uxs-flow li + li::before { width: 14px; }
}

/* Conectado con tus canales: íconos tipo app */
.web-int .item .ax-app.ig { width: 34px; height: 34px; border-radius: 10px; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.08), 0 6px 12px -8px rgba(17,17,17,.5); }
.web-int .item .ax-app.ig svg { width: 18px; height: 18px; }
.web-int .item .ax-app.g { background: #fff; box-shadow: inset 0 0 0 1px #E6E8EC, 0 6px 12px -8px rgba(17,17,17,.3); }
.web-int .item .ax-app.wa { background: linear-gradient(180deg, #5FFC7B, #28C840); }
.web-int .item .ax-app.wa svg { width: 20px; height: 20px; }
.web-int .item .ax-app.fo { background: linear-gradient(180deg, #FFB25B, #F27A1F); }
.web-int .item .ax-app.an { background: linear-gradient(180deg, #B49CFF, #7B5BE6); }
.int-one .web-int .item { padding: 11px 0; gap: 13px; }
.int-one .web-int .item b { font-size: 14px; } .int-one .web-int .item small { font-size: 12px; }

/* ==========================================================================
   13 oct 2026, c: Ads, el anuncio en Facebook e Instagram
   ========================================================================== */
.meta-stage.two { display: flex; align-items: flex-start; justify-content: center; gap: 72px; }
.meta-col { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 26px; }
.meta-col .meta-chip { padding: 8px 16px 8px 8px; font-size: 15px; }
.meta-col .meta-chip i { width: 30px; height: 30px; border-radius: 9px; } .meta-col .meta-chip i svg { width: 18px; height: 18px; }
.meta-foot { margin: 40px auto 0; text-align: center; font-size: 16px; color: rgba(255,255,255,.55); }
.igs { background: #0E1A12 !important; }
.igs .ig-bars { position: absolute; z-index: 2; top: 30px; left: 12px; right: 12px; display: flex; gap: 4px; }
.igs .ig-bars i { flex: 1; height: 2.5px; border-radius: 2px; background: rgba(255,255,255,.35); }
.igs .ig-bars i.on { background: #fff; }
.igs .ig-h { position: absolute; z-index: 2; top: 42px; left: 12px; right: 14px; display: flex; align-items: center; gap: 8px; color: #fff; text-align: left; }
.igs .ig-h .av { width: 30px; height: 30px; border-radius: 50%; background: var(--brand-black); display: grid; place-items: center; box-shadow: 0 0 0 1.5px rgba(255,255,255,.7); }
.igs .ig-h .av img { width: 15px; height: 15px; object-fit: contain; }
.igs .ig-h b { display: block; font-size: 13px; font-weight: 600; color: #fff; } .igs .ig-h small { display: block; font-size: 11px; color: rgba(255,255,255,.75); }
.igs .ig-h em { margin-left: auto; font-style: normal; font-size: 15px; color: #fff; }
.igs .ig-img { position: absolute; inset: 0; display: grid; place-items: center; }
.igs .ig-img img { width: 100%; aspect-ratio: 1; object-fit: contain; display: block; }
.igs .ig-cta { position: absolute; z-index: 2; left: 0; right: 0; bottom: 30px; display: flex; flex-direction: column; align-items: center; gap: 4px; color: #fff; }
.igs .ig-cta svg { width: 18px; height: 18px; }
.igs .ig-cta span { padding: 9px 22px; border-radius: 99px; background: #fff; color: var(--text); font-size: 13.5px; font-weight: 600; }
@media (max-width: 760px) {
  .meta-stage.two { display: flex; flex-wrap: nowrap; gap: 12px; }
  .meta-stage.two .mk-phone { zoom: .54; width: 260px; display: block; order: 0; flex-basis: auto; }
  .meta-col { gap: 16px; }
  .meta-col .meta-chip { font-size: 13px; padding: 6px 12px 6px 6px; } .meta-col .meta-chip i { width: 24px; height: 24px; border-radius: 7px; } .meta-col .meta-chip i svg { width: 14px; height: 14px; }
  .meta-foot { margin-top: 28px; font-size: 15px; }
}

/* ==========================================================================
   13 oct 2026, d: Eventos
   ========================================================================== */
/* Venta online: las dos tarjetas con el gráfico a la misma altura */
#venta-online .sv-cards.two .sv-canvas { height: 340px; padding: 16px; display: flex; align-items: center; justify-content: center; overflow: visible; }
/* Confirmación: el correo que recibe quien compra */
.ev-mail { width: 100%; max-width: 330px; padding: 16px; border-radius: 22px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 24px 44px -26px rgba(17,17,17,.3); }
.em-h { display: flex; align-items: center; gap: 10px; }
.em-av { width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.em-av svg { width: 17px; height: 17px; }
.em-h b { display: block; font-size: 13.5px; font-weight: 600; color: var(--text); } .em-h small { display: block; font-size: 11.5px; color: var(--text-faint); }
.em-h .em-t { margin-left: auto; align-self: flex-start; font-size: 11.5px; color: var(--text-faint); }
.em-sub { display: block; margin: 12px 0 12px; font-size: 17px; font-weight: 600; letter-spacing: -.02em; color: var(--text); }
.em-tk { display: grid; grid-template-columns: 1fr auto; border-radius: 16px; background: var(--brand-black); color: #fff; overflow: hidden; }
.em-tk .tk-l { padding: 14px 14px 14px 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.em-tk .tk-l small { font-size: 9.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.em-tk .tk-l b { font-size: 19px; font-weight: 700; letter-spacing: .01em; }
.em-tk .tk-l .tk { margin-top: 6px; background: var(--accent-lime); color: var(--brand-black); }
.em-tk .tk-l em { font-style: normal; font-size: 11.5px; color: rgba(255,255,255,.6); }
.em-tk .tk-r { position: relative; padding: 12px 14px 10px; display: flex; flex-direction: column; align-items: center; gap: 6px; border-left: 1.5px dashed rgba(255,255,255,.25); }
.em-tk .tk-r::before, .em-tk .tk-r::after { content: ""; position: absolute; left: -8px; width: 14px; height: 14px; border-radius: 50%; background: #fff; }
.em-tk .tk-r::before { top: -7px; } .em-tk .tk-r::after { bottom: -7px; }
.em-tk .em-qr { display: block; width: 74px; height: 74px; padding: 6px; border-radius: 9px; background: #fff; }
.em-tk .em-qr svg { display: block; width: 100%; height: 100%; }
.em-tk .tk-r small { font-size: 9px; color: rgba(255,255,255,.6); white-space: nowrap; }
/* Tiempo real: sin etiqueta del evento, "En vivo" sutil, gráfico más alto */
.lv-head b { font-size: 13px; font-weight: 600; color: var(--text-dim); }
.lv-dot { width: 7px; height: 7px; box-shadow: 0 0 0 3px rgba(255,59,48,.14); }
.lv-chart .cols { height: 150px; }
@media (max-width: 760px) {
  #venta-online .sv-cards.two .sv-canvas { height: auto; min-height: 300px; }
  .lv-chart .cols { height: 130px; }
}
@media (max-width: 760px) {
  .em-tk .tk-l { padding: 12px; } .em-tk .tk-l b { font-size: 16px; white-space: nowrap; } .em-tk .tk-l small { font-size: 8.5px; white-space: nowrap; }
  .em-tk .tk-r { padding: 12px; justify-content: center; } .em-tk .tk-r small { display: none; } .em-tk .em-qr { width: 64px; height: 64px; }
}

/* ==========================================================================
   13 oct 2026, e: Todo en Uno
   ========================================================================== */
/* Mejor todo en uno: una sola conversación */
.tchat { max-width: 520px; margin: 8px auto 0; border-radius: 30px; overflow: hidden; text-align: left; background: #1C1C1E; border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 60px 120px -50px rgba(193,234,80,.25), 0 40px 80px -40px rgba(0,0,0,.9); }
.tc-h { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,.07); }
.tc-h .av { width: 40px; height: 40px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #000; box-shadow: 0 0 0 1.5px var(--accent-lime); }
.tc-h .av img { width: 19px; height: 19px; object-fit: contain; }
.tc-h b { display: block; font-size: 15.5px; font-weight: 600; color: #fff; }
.tc-h small { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: rgba(255,255,255,.55); }
.tc-h small i { width: 7px; height: 7px; border-radius: 50%; background: #34C759; }
.tc-body { display: flex; flex-direction: column; gap: 14px; padding: 22px 20px 24px; }
.tchat .m { display: flex; flex-direction: column; gap: 6px; max-width: 82%; }
.tchat .m p { margin: 0; padding: 11px 15px; border-radius: 20px; font-size: 15px; line-height: 1.38; }
.tchat .m.in { align-self: flex-start; align-items: flex-start; }
.tchat .m.in p { background: #2C2C2E; color: #fff; border-bottom-left-radius: 6px; }
.tchat .m.out { align-self: flex-end; align-items: flex-end; }
.tchat .m.out p { background: var(--accent-lime); color: var(--brand-black); border-bottom-right-radius: 6px; font-weight: 500; }
.tchat .tg { display: inline-flex; align-items: center; gap: 6px; padding: 0 4px; font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.6); }
.tchat .tg::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
.tchat .tg.sm { --c: #FF6B8A; } .tchat .tg.wb { --c: #5AA2F0; } .tchat .tg.ad { --c: var(--accent-lime); }
.ax-js .tchat.ax .m { opacity: 0; transform: translateY(12px) scale(.98); transition: opacity .55s ease var(--d), transform .65s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .tchat.ax.ax-on .m { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .tchat.ax .m { opacity: 1; transform: none; transition: none; } }
#todo-intro .oo-cap { margin-top: 36px; }
@media (max-width: 600px) { .tchat { border-radius: 24px; } .tc-body { padding: 18px 14px 20px; } .tchat .m { max-width: 88%; } .tchat .m p { font-size: 14px; } }

/* Por qué funciona mejor: tres ideas cortas */
.why3 { max-width: 1040px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px; text-align: left; }
.why3 > div { padding-top: 22px; border-top: 1px solid var(--border); }
.why3 .wn { display: block; font-size: 14px; font-weight: 600; color: var(--accent-lime-dark, #7FA51F); letter-spacing: .02em; }
.why3 h3 { margin-top: 14px; font-size: clamp(24px, 2.4vw, 30px); font-weight: 500; letter-spacing: -.03em; line-height: 1.15; }
.why3 p { margin-top: 10px; font-size: 16.5px; line-height: 1.55; color: var(--text-dim); }
@media (max-width: 860px) { .why3 { grid-template-columns: 1fr; gap: 32px; max-width: 440px; } }

/* Todo en Uno, 13 oct 2026 (2da): tarjeta de plan en vez del chat */
.bundle { max-width: 540px; margin: 8px auto 0; padding: 26px 26px 22px; border-radius: 32px; background: #fff; text-align: left;
  box-shadow: 0 60px 120px -50px rgba(193,234,80,.3), 0 40px 80px -40px rgba(0,0,0,.6); }
.bd-h { display: flex; align-items: center; gap: 14px; padding-bottom: 18px; }
.bd-logo { width: 48px; height: 48px; border-radius: 14px; flex: none; display: grid; place-items: center; background: var(--brand-black); }
.bd-logo img { width: 24px; height: 24px; object-fit: contain; }
.bd-h b { display: block; font-size: 19px; font-weight: 600; letter-spacing: -.02em; color: var(--text); }
.bd-h small { display: block; margin-top: 1px; font-size: 13.5px; color: var(--text-dim); }
.bd-pill { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 99px; background: var(--brand-black); color: var(--accent-lime); font-size: 12.5px; font-weight: 600; }
.bd-pill i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-lime); }
.bd-row { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid var(--border); }
.bd-row > div { flex: 1; min-width: 0; }
.bd-row b { display: block; font-size: 15.5px; font-weight: 600; color: var(--text); }
.bd-row small { display: block; margin-top: 1px; font-size: 13px; color: var(--text-dim); }
.bd-ic { width: 40px; height: 40px; border-radius: 12px; flex: none; display: grid; place-items: center; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.08), 0 6px 12px -8px rgba(17,17,17,.5); }
.bd-ic svg { width: 21px; height: 21px; }
.bd-ic.sm { background: linear-gradient(45deg, #F9A23A, #E1306C 50%, #833AB4); }
.bd-ic.wb { background: linear-gradient(180deg, #6AAEF5, #2F74D6); }
.bd-ic.ad { background: linear-gradient(160deg, #D3F27A, var(--accent-lime) 60%, #ADD93C); color: var(--brand-black); }
.bd-ck { width: 24px; height: 24px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #34C759; color: #fff; }
.bd-ck svg { width: 12px; height: 12px; }
.bd-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 8px; }
.bd-stats div { padding: 14px 10px 12px; border-radius: 18px; background: #F5F5F7; text-align: center; }
.bd-stats b { display: block; font-size: 30px; font-weight: 700; letter-spacing: -.04em; line-height: 1; color: var(--text); }
.bd-stats small { display: block; margin-top: 5px; font-size: 13px; color: var(--text-dim); }
.ax-js .bundle.ax .bd-row { opacity: 0; transform: translateY(10px); transition: opacity .55s ease var(--d), transform .65s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .bundle.ax.ax-on .bd-row { opacity: 1; transform: none; }
.ax-js .bundle.ax .bd-ck { transform: scale(0); transition: transform .45s cubic-bezier(.3,1.6,.5,1) calc(var(--d) + .35s); }
.ax-js .bundle.ax.ax-on .bd-ck { transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .bundle.ax .bd-row, .ax-js .bundle.ax .bd-ck { opacity: 1; transform: none; transition: none; } }
@media (max-width: 600px) { .bundle { padding: 20px 18px 18px; border-radius: 26px; } .bd-h b { font-size: 17px; } .bd-stats b { font-size: 26px; } }
@media (max-width: 600px) { .bd-row { gap: 12px; } .bd-ic { width: 36px; height: 36px; border-radius: 11px; } .bd-row small, .bd-h small { font-size: 12px; white-space: nowrap; } .bd-pill { padding: 5px 10px; font-size: 11.5px; } }

/* ==========================================================================
   13 oct 2026, f
   ========================================================================== */
/* Social Media: sombras de formatos que no tapan las etiquetas */
.sv-dg-one .dz-formats .fr { box-shadow: 0 0 0 1px var(--border), 0 8px 18px -10px rgba(17,17,17,.22); }
.sv-dg-one .dz-formats .post { box-shadow: 0 0 0 1px var(--border), 0 10px 20px -10px rgba(17,17,17,.26); }
.sv-dg-one .dz-formats .fm { gap: 14px; }
.sv-dg-one { box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 20px 40px -30px rgba(17,17,17,.22); }

/* Social Media: pasos como línea de tiempo con su estado */
.pm-tl { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 30px; position: relative; text-align: left; }
.pm-tl::before { content: ""; position: absolute; left: 17px; top: 20px; bottom: 60px; width: 2px; border-radius: 2px; background: linear-gradient(180deg, var(--accent-lime), rgba(193,234,80,.25)); }
.pm-tl li { position: relative; display: flex; gap: 20px; align-items: flex-start; }
.pm-tl .n { position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); font-size: 15px; font-weight: 700; box-shadow: 0 0 0 6px #fff; }
.pm-tl h3 { font-size: 21px; font-weight: 500; letter-spacing: -.02em; line-height: 1.25; margin-top: 4px; }
.pm-tl p { margin-top: 6px; font-size: 16px; line-height: 1.5; color: var(--text-dim); }
.pm-chip { display: inline-flex; align-items: center; gap: 9px; margin-top: 12px; padding: 6px 14px 6px 6px; border-radius: 99px; background: #F5F5F7; font-size: 13.5px; font-weight: 600; color: var(--text); }
.pm-chip.cal b { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: #fff; font-size: 14px; font-weight: 600; line-height: 1; box-shadow: 0 0 0 1px var(--border); }
.pm-chip.cal b small { font-size: 7.5px; font-weight: 700; color: #EC4A3E; letter-spacing: .06em; margin-bottom: 2px; }
.pm-chip.ok { padding-left: 6px; background: var(--accent-lime); color: var(--brand-black); }
.pm-chip.ok i { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.pm-chip.ok i svg { width: 11px; height: 11px; }
.pm-chip.pub { padding-left: 14px; background: var(--brand-black); color: #fff; }
.pm-chip.pub i { width: 7px; height: 7px; border-radius: 50%; background: #34C759; box-shadow: 0 0 0 3px rgba(52,199,89,.25); }
@media (max-width: 900px) { .pm-tl { gap: 26px; } .pm-tl h3 { font-size: 19px; } .pm-tl p { font-size: 15px; } .pm-tl li { gap: 16px; } }

/* Web, Diseño & UX (13 oct, f): widget pequeño como el de integraciones */
.uxw { max-width: 520px; margin: 8px auto 0; padding: 22px 24px 14px; border-radius: 30px; background: #fff; text-align: left; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); }
.uxw-h { display: flex; align-items: center; gap: 14px; padding-bottom: 16px; }
.uxw-th { position: relative; width: 74px; height: 50px; border-radius: 10px; flex: none; background-size: cover; background-position: center; box-shadow: 0 0 0 1px rgba(17,17,17,.06); overflow: hidden; }
.uxw-th i { position: absolute; left: 8px; height: 4px; border-radius: 2px; background: #fff; }
.uxw-th i:first-child { top: 22px; width: 32px; } .uxw-th i:last-child { top: 30px; width: 20px; opacity: .8; }
.uxw-h b { display: block; font-size: 17px; font-weight: 600; letter-spacing: -.02em; color: var(--text); }
.uxw-h small { display: block; margin-top: 2px; font-size: 13px; color: var(--text-dim); }
.uxw-r { display: flex; align-items: center; gap: 13px; padding: 12px 0; border-top: 1px solid var(--border); }
.uxw-r > div { flex: 1; min-width: 0; }
.uxw-r b { display: block; font-size: 14.5px; font-weight: 600; color: var(--text); }
.uxw-r small { display: block; margin-top: 1px; font-size: 12.5px; color: var(--text-dim); }
.uxw-r .ax-app.ig { width: 34px; height: 34px; border-radius: 10px; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.08), 0 6px 12px -8px rgba(17,17,17,.5); }
.uxw-r .ax-app.ig svg { width: 18px; height: 18px; }
.uxw-ck { width: 24px; height: 24px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #34C759; color: #fff; }
.uxw-ck svg { width: 12px; height: 12px; }
.uxw-ok { flex: none; padding: 6px 12px; border-radius: 99px; background: var(--brand-black); color: var(--accent-lime); font-size: 12.5px; font-weight: 600; }
.ax-js .uxw.ax .uxw-r { opacity: 0; transform: translateY(10px); transition: opacity .55s ease var(--d), transform .65s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .uxw.ax.ax-on .uxw-r { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .uxw.ax .uxw-r { opacity: 1; transform: none; transition: none; } }
@media (max-width: 600px) { .uxw { padding: 18px 16px 10px; border-radius: 24px; } .uxw-th { width: 60px; height: 42px; } .uxw-r small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }
#diseno-ux .ux-ai { margin-top: 28px; }

/* Todo en Uno (13 oct, f): carpeta de apps CREVO */
.cfold { position: relative; max-width: 560px; margin: 0 auto; padding: 40px 0 10px; display: flex; flex-direction: column; align-items: center; }
.fd-glow { position: absolute; border-radius: 50%; filter: blur(60px); pointer-events: none; }
.fd-glow.g1 { width: 300px; height: 220px; left: 6%; top: 34%; background: rgba(193,234,80,.35); }
.fd-glow.g2 { width: 280px; height: 220px; right: 4%; top: 46%; background: rgba(58,130,222,.35); }
.fd-name { position: relative; font-size: clamp(30px, 4vw, 40px); font-weight: 600; letter-spacing: -.03em; color: #fff; margin-bottom: 22px; }
.fd-panel { position: relative; width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 40px 34px 34px; border-radius: 48px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); -webkit-backdrop-filter: blur(30px) saturate(1.4); backdrop-filter: blur(30px) saturate(1.4);
  box-shadow: 0 40px 80px -40px rgba(0,0,0,.8); }
.fd-app { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.fd-app .ic { width: 96px; height: 96px; border-radius: 24px; display: grid; place-items: center; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.25), 0 16px 30px -14px rgba(0,0,0,.7); }
.fd-app .ic svg { width: 48px; height: 48px; }
.fd-app .ic.sm { background: linear-gradient(45deg, #F9A23A, #E1306C 50%, #833AB4); }
.fd-app .ic.wb { background: linear-gradient(180deg, #6AAEF5, #2F74D6); }
.fd-app .ic.ad { background: linear-gradient(160deg, #D3F27A, var(--accent-lime) 60%, #ADD93C); color: var(--brand-black); }
.fd-app small { font-size: 15px; font-weight: 500; color: #fff; white-space: nowrap; }
.ax-js .cfold.ax .fd-app { opacity: 0; transform: scale(.6); transition: opacity .5s ease var(--d), transform .7s cubic-bezier(.3,1.5,.5,1) var(--d); }
.ax-js .cfold.ax.ax-on .fd-app { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .cfold.ax .fd-app { opacity: 1; transform: none; transition: none; } }
#todo-intro .oo-cap { margin-top: 40px; }
@media (max-width: 600px) {
  .fd-panel { gap: 10px; padding: 28px 14px 24px; border-radius: 36px; }
  .fd-app .ic { width: 70px; height: 70px; border-radius: 18px; } .fd-app .ic svg { width: 34px; height: 34px; }
  .fd-app small { font-size: 12.5px; }
  .fd-glow { filter: blur(44px); } .fd-glow.g1 { width: 180px; height: 160px; } .fd-glow.g2 { width: 170px; height: 160px; }
}
/* Por qué funciona mejor: cuatro puntos */
.why3.four { max-width: 1160px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
@media (max-width: 1100px) { .why3.four { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; gap: 40px 48px; } }
@media (max-width: 640px) { .why3.four { grid-template-columns: 1fr; max-width: 440px; gap: 30px; } }
.cfold.ax { background: none; border: 0; box-shadow: none; border-radius: 0; max-width: 560px; width: 100%; padding: 40px 0 10px; overflow: visible; -webkit-backdrop-filter: none; backdrop-filter: none; }

/* ==========================================================================
   13 oct 2026, g
   ========================================================================== */
/* Web, formatos: páginas en abanico */
.fmt3 .sv-canvas { height: 230px !important; min-height: 0 !important; padding: 0 !important; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.pk-stack.ax { position: relative; width: 100%; height: 100%; max-width: none; padding: 0; background: none; border: 0; box-shadow: none; border-radius: 0; }
.pk { position: absolute; left: 50%; top: 50%; width: 96px; height: 128px; margin: -60px 0 0 -48px; border-radius: 12px; background: #fff; overflow: hidden; display: flex; flex-direction: column; gap: 6px; padding: 6px 6px 10px;
  box-shadow: 0 0 0 1px rgba(17,17,17,.06), 0 12px 22px -14px rgba(17,17,17,.35); transform-origin: 50% 120%;
  transform: rotate(var(--r)); transition: transform .8s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 60ms); }
.pk s { display: block; height: 58%; border-radius: 8px; background-size: cover; background-position: center; text-decoration: none; }
.pk b { display: block; height: 5px; width: 80%; border-radius: 3px; background: #E3E6EA; margin-left: 2px; }
.pk b.t { width: 52%; background: #EEF0F3; }
.pk u { display: block; width: 40%; height: 11px; margin: auto 0 0 2px; border-radius: 99px; background: var(--accent-lime); }
.n3 .pk:nth-child(2), .n6 .pk:nth-child(3) { z-index: 3; }
.n6 .pk:nth-child(2), .n6 .pk:nth-child(4) { z-index: 2; }
.n1 .pk { width: 112px; height: 150px; margin: -75px 0 0 -56px; }
.ax-js .pk-stack.ax:not(.ax-on) .pk { transform: rotate(0deg); }
.fmt3 .sv-card:hover .pk { transform: rotate(calc(var(--r) * 1.25)) translateY(-4px); }
.fmt3 h3 { margin-top: 4px; }
@media (prefers-reduced-motion: reduce) { .pk { transition: none; } }
/* Web, Diseño & UX: iconos rellenos y "Aprobado" más claro */
.uxw-ic { width: 38px; height: 38px; border-radius: 11px; flex: none; display: grid; place-items: center; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.08), 0 8px 14px -9px rgba(17,17,17,.55); }
.uxw-ic svg { width: 21px; height: 21px; }
.uxw-ic.p { background: linear-gradient(180deg, #6AAEF5, #2F74D6); }
.uxw-ic.a { background: linear-gradient(180deg, #FFB25B, #F27A1F); }
.uxw-ic.o { background: linear-gradient(160deg, #DDF58E, var(--accent-lime) 60%, #ADD93C); }
.uxw-ic.o svg { width: 25px; height: 25px; }
.uxw-ok { display: inline-flex; align-items: center; gap: 7px; padding: 5px 13px 5px 5px; background: var(--accent-lime); color: var(--brand-black); font-size: 13px; }
.uxw-ok i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.uxw-ok i svg { width: 10px; height: 10px; }
.uxw-r { padding: 13px 0; }
.uxw-r:last-child { margin: 4px -12px 0; padding: 12px; border-top: 0; border-radius: 16px; background: rgba(193,234,80,.14); }
.uxw { padding-bottom: 20px; }
/* Todo en Uno (13 oct, g): un solo panel */
.one-dash.ax { max-width: 820px; width: 100%; margin: 8px auto 0; padding: 24px; border-radius: 32px; background: #fff; border: 0; text-align: left;
  box-shadow: 0 60px 120px -50px rgba(193,234,80,.28), 0 40px 80px -40px rgba(0,0,0,.6); }
.od-h { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.od-logo { width: 40px; height: 40px; border-radius: 12px; flex: none; display: grid; place-items: center; background: var(--brand-black); }
.od-logo img { width: 20px; height: 20px; object-fit: contain; }
.od-h b { display: block; font-size: 17px; font-weight: 600; letter-spacing: -.02em; color: var(--text); } .od-h small { display: block; font-size: 13px; color: var(--text-dim); }
.od-pill { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 99px; background: var(--brand-black); color: var(--accent-lime); font-size: 12.5px; font-weight: 600; }
.od-pill i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-lime); }
.od-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.od-t { display: flex; flex-direction: column; min-height: 196px; padding: 18px; border-radius: 22px; background: #F5F5F7; }
.od-lb { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--text-dim); }
.od-lb i { width: 8px; height: 8px; border-radius: 50%; }
.od-big { display: block; margin-top: 10px; font-size: 36px; font-weight: 700; letter-spacing: -.04em; line-height: 1; color: var(--text); }
.od-t > small { margin-top: 4px; font-size: 13px; color: var(--text-faint); }
.od-bars { margin-top: auto; height: 54px; display: flex; align-items: flex-end; gap: 6px; }
.od-bars i { flex: 1; height: var(--h); border-radius: 5px; background: rgba(225,48,108,.18); }
.od-bars i.on { background: linear-gradient(180deg, #F9A23A, #E1306C); }
.od-line { margin-top: auto; width: 100%; height: 54px; }
.od-up { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border-radius: 99px; background: var(--accent-lime); color: var(--brand-black); font-size: 12.5px; font-weight: 600; }
.od-up svg { width: 14px; height: 14px; }
.od-foot { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 18px; font-size: 14px; font-weight: 500; color: var(--text-dim); }
.od-foot i { width: 4px; height: 4px; border-radius: 50%; background: #C9CDD3; }
.ax-js .one-dash.ax .od-t { opacity: 0; transform: translateY(12px); transition: opacity .55s ease var(--d), transform .65s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .one-dash.ax.ax-on .od-t { opacity: 1; transform: none; }
.ax-js .one-dash.ax .od-bars i { transform: scaleY(0); transform-origin: bottom; transition: transform .7s cubic-bezier(.2,.8,.2,1) .5s; }
.ax-js .one-dash.ax.ax-on .od-bars i { transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .one-dash.ax .od-t, .ax-js .one-dash.ax .od-bars i { opacity: 1; transform: none; transition: none; } }
@media (max-width: 760px) {
  .one-dash.ax { padding: 18px; border-radius: 26px; }
  .od-grid { grid-template-columns: 1fr; }
  .od-t { min-height: 0; display: grid; grid-template-columns: 1fr auto; grid-template-areas: "lb vis" "big vis" "sm vis"; column-gap: 14px; padding: 16px; }
  .od-lb { grid-area: lb; } .od-big { grid-area: big; font-size: 30px; margin-top: 6px; } .od-t > small { grid-area: sm; }
  .od-bars, .od-line, .od-up { grid-area: vis; align-self: end; margin: 0; }
  .od-bars, .od-line { width: 110px; height: 48px; }
  .od-up { font-size: 0; gap: 0; padding: 8px; } .od-up svg { width: 16px; height: 16px; }
  .od-foot { flex-wrap: wrap; gap: 8px; font-size: 13px; }
}
/* Por qué funciona mejor: tarjetas como las de mantenimiento */
.why4 { max-width: 1080px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.wc { padding: 30px 26px; border-radius: 28px; background: #F5F5F7; text-align: left; transition: transform .4s var(--ease); }
.wc:hover { transform: translateY(-4px); }
.wc .wi { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.wc .wi svg { width: 22px; height: 22px; }
.wc b { display: block; margin-top: 22px; font-size: 21px; font-weight: 500; letter-spacing: -.02em; }
.wc p { margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--text-dim); }
@media (max-width: 900px) { .why4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .why4 { grid-template-columns: 1fr; max-width: 400px; } }

/* ==========================================================================
   13 oct 2026, socio a: Inicio (giro a socio CREVO)
   ========================================================================== */
#perdidas .sv-head, #metodo .sv-head { max-width: 860px; margin: 0 auto 48px; text-align: center; }
#perdidas .sv-head h2, #metodo .sv-head h2 { font-size: clamp(28px, 3.6vw, 44px); line-height: 1.12; color: var(--text); }
#perdidas .sv-head p, #metodo .sv-head p { margin-top: 16px; font-size: 18px; line-height: 1.55; }
#perdidas, #metodo, #promesa { padding: 88px 0; }
.lc-sheet, .pm-sheet { background: var(--brand-black) !important; }
.lc-sheet .sv-head h2, .pm-sheet h2 { color: #fff !important; }
.lc-sheet .sv-head p { color: rgba(255,255,255,.66); }
.lc-sheet .grad-anim, .pm-sheet .grad-anim { background-image: linear-gradient(100deg, #A9D633, var(--accent-lime), #E2F6A6, var(--accent-lime), #A9D633); }

/* Dónde se te van los clientes */
.lc { max-width: 1040px; margin: 0 auto; }
.lc-tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-bottom: 40px; }
.lc-tabs button { appearance: none; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.06); color: rgba(255,255,255,.75); font: inherit; font-size: 15px; font-weight: 500;
  padding: 10px 18px; border-radius: 99px; cursor: pointer; transition: background .25s, color .25s, border-color .25s; }
.lc-tabs button:hover { color: #fff; border-color: rgba(255,255,255,.3); }
.lc-tabs button[aria-selected="true"] { background: var(--accent-lime); border-color: var(--accent-lime); color: var(--brand-black); font-weight: 600; }
.lc-tabs button:focus-visible { outline: 2px solid var(--accent-lime); outline-offset: 3px; }
.lc-panel { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 72px; align-items: center; animation: lcIn .5s cubic-bezier(.2,.8,.2,1); }
.lc-panel[hidden] { display: none; }
@keyframes lcIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.lc-copy { text-align: left; }
.lc-copy p { margin: 0; }
.lc-copy span { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 600; letter-spacing: .02em; }
.lc-prob { font-size: 19px; line-height: 1.5; color: rgba(255,255,255,.55); }
.lc-prob span { color: rgba(255,255,255,.45); }
.lc-sol { margin-top: 28px !important; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.12); font-size: clamp(22px, 2.3vw, 28px); line-height: 1.3; font-weight: 500; letter-spacing: -.02em; color: #fff; }
.lc-sol span { color: var(--accent-lime); }
.lc-met { margin-top: 28px !important; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 99px; background: rgba(193,234,80,.12); font-size: 14px; color: rgba(255,255,255,.75); }
.lc-met b { color: var(--accent-lime); font-weight: 600; }
.lc-chat { border-radius: 28px; overflow: hidden; background: #fff; text-align: left; box-shadow: 0 50px 100px -50px rgba(193,234,80,.35), 0 30px 60px -30px rgba(0,0,0,.7); }
.lc-top { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--border); }
.lc-app { width: 38px; height: 38px; border-radius: 50%; flex: none; display: grid; place-items: center; }
.lc-app svg { width: 19px; height: 19px; }
.lc-app.ig { background: linear-gradient(45deg, #F9A23A, #E1306C 50%, #833AB4); }
.lc-app.wa { background: #25D366; }
.lc-top div { flex: 1; min-width: 0; }
.lc-top b { display: block; font-size: 15px; font-weight: 600; color: var(--text); }
.lc-top small { display: block; font-size: 12px; color: var(--text-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lc-time { align-self: flex-start; font-size: 12px; color: var(--text-faint); }
.lc-body { display: flex; flex-direction: column; gap: 8px; padding: 18px; background: #F5F5F7; min-height: 300px; }
.lc-m { display: flex; flex-direction: column; max-width: 82%; }
.lc-m p { margin: 0; padding: 10px 14px; border-radius: 18px; font-size: 14.5px; line-height: 1.38; }
.lc-m small { margin-top: 3px; font-size: 11px; color: var(--text-faint); padding: 0 6px; }
.lc-m.in { align-self: flex-start; } .lc-m.in p { background: #fff; color: var(--text); border-bottom-left-radius: 6px; box-shadow: 0 1px 1px rgba(17,17,17,.05); }
.lc-m.out { align-self: flex-end; align-items: flex-end; } .lc-m.out p { background: var(--brand-black); color: #fff; border-bottom-right-radius: 6px; }
.lc-file { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 18px; border-bottom-right-radius: 6px; background: var(--brand-black); color: #fff; }
.lc-file svg { width: 24px; height: 24px; color: var(--accent-lime); }
.lc-file b { display: block; font-size: 14px; font-weight: 600; } .lc-file small { display: block; font-size: 11px; color: rgba(255,255,255,.55); }
.lc-day { align-self: center; margin: 4px 0; padding: 4px 10px; border-radius: 99px; background: #E9EAEE; font-size: 11.5px; font-weight: 500; color: var(--text-dim); }
.lc-status { display: flex; align-items: center; gap: 10px; padding: 14px 18px; font-size: 14px; font-weight: 600; color: var(--text); border-top: 1px solid var(--border); }
.lc-status i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-lime); color: var(--brand-black); }
.lc-status i svg { width: 12px; height: 12px; }
.lc-panel:not([hidden]) .lc-m, .lc-panel:not([hidden]) .lc-day { animation: lcMsg .5s cubic-bezier(.2,.8,.2,1) both; }
.lc-panel .lc-body > :nth-child(2) { animation-delay: .25s !important; } .lc-panel .lc-body > :nth-child(3) { animation-delay: .5s !important; } .lc-panel .lc-body > :nth-child(4) { animation-delay: .75s !important; }
@keyframes lcMsg { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lc-panel, .lc-panel .lc-m, .lc-panel .lc-day { animation: none !important; } }
@media (max-width: 900px) {
  .lc-panel { grid-template-columns: 1fr; gap: 32px; max-width: 460px; margin: 0 auto; }
  .lc-tabs { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin: 0 -20px 28px; padding: 0 20px; }
  .lc-tabs::-webkit-scrollbar { display: none; }
  .lc-tabs button { flex: none; font-size: 14px; padding: 9px 15px; }
  .lc-prob { font-size: 17px; } .lc-sol { margin-top: 20px !important; padding-top: 20px; }
}

/* Método CREVO */
.mtd { list-style: none; margin: 0 auto; padding: 0; max-width: 1080px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; position: relative; }
.mtd li { position: relative; padding: 28px 24px 30px; border-radius: 28px; background: #F5F5F7; text-align: left; }
.mtd-n { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--brand-black); color: var(--accent-lime); font-size: 16px; font-weight: 600; }
.mtd li:last-child { background: var(--brand-black); }
.mtd li:last-child .mtd-n { background: var(--accent-lime); color: var(--brand-black); }
.mtd li:last-child b { color: #fff; } .mtd li:last-child p { color: rgba(255,255,255,.66); }
.mtd b { display: block; margin-top: 22px; font-size: 21px; font-weight: 500; letter-spacing: -.02em; color: var(--text); }
.mtd p { margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--text-dim); }
.mtd-thread { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 10px; margin: 36px auto 0; font-size: 16px; color: var(--text-dim); }
.mtd-thread b { padding: 6px 14px; border-radius: 99px; background: var(--accent-lime); color: var(--brand-black); font-weight: 600; }
.mtd-thread span { font-weight: 500; color: var(--text); }
.mtd-thread i { width: 18px; height: 1.5px; background: var(--border-strong, #C9CDD3); }
.mtd-thread em { font-style: normal; }
@media (max-width: 900px) { .mtd { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .mtd { grid-template-columns: 1fr; } .mtd-thread { font-size: 14.5px; gap: 8px; } .mtd-thread em { flex-basis: 100%; text-align: center; } }

/* Nuestra promesa */
.pm-card { position: relative; max-width: 980px; margin: 0 auto; text-align: left; color: #fff; }
.pm-card h2 { font-size: clamp(28px, 3.6vw, 44px); font-weight: 500; letter-spacing: -.035em; line-height: 1.12; }
.pm-quote { margin-top: 18px; max-width: 760px; font-size: clamp(24px, 2.8vw, 34px); line-height: 1.25; font-weight: 500; letter-spacing: -.025em; color: rgba(255,255,255,.9); }
.pm-seal { position: absolute; right: 0; top: -8px; width: 132px; height: 132px; animation: pmSpin 22s linear infinite; }
@keyframes pmSpin { to { transform: rotate(360deg); } }
.pm-three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 40px; }
.pm-three > div { padding: 24px; border-radius: 24px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.pm-three small { display: block; font-size: 13px; font-weight: 600; color: var(--accent-lime); }
.pm-three p { margin-top: 10px; font-size: 16.5px; line-height: 1.5; color: rgba(255,255,255,.8); }
.pm-three p b { color: #fff; font-weight: 600; }
.pm-guarantee { margin-top: 18px; display: flex; align-items: center; gap: 12px; padding: 18px 22px; border-radius: 20px; background: var(--accent-lime); color: var(--brand-black); font-size: 17px; font-weight: 600; letter-spacing: -.01em; }
.pm-sign { margin-top: 30px; display: flex; align-items: baseline; gap: 12px; }
.pm-sig { font-size: 30px; font-weight: 300; font-style: italic; letter-spacing: -.02em; color: #fff; }
.pm-sign small { font-size: 14px; color: rgba(255,255,255,.55); }
@media (prefers-reduced-motion: reduce) { .pm-seal { animation: none; } }
@media (max-width: 900px) { .pm-three { grid-template-columns: 1fr; } .pm-seal { width: 96px; height: 96px; top: -4px; } .pm-quote { max-width: calc(100% - 90px); } }
@media (max-width: 520px) { .pm-seal { position: static; display: block; margin-bottom: 18px; width: 84px; height: 84px; } .pm-quote { max-width: none; } .pm-guarantee { font-size: 15.5px; } #perdidas, #metodo, #promesa { padding: 64px 0; } }

.pm-seal { animation: none; display: block; }
.pm-seal svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.pm-ring { animation: pmSpin 22s linear infinite; }
@media (prefers-reduced-motion: reduce) { .pm-ring { animation: none; } }
@media (max-width: 520px) { .pm-seal { position: relative; } }
@media (max-width: 640px) { .hero-top-content h1 .hero-h1-line1 { text-wrap: balance; } }

/* ==========================================================================
   13 oct 2026, socio b: Socio CREVO (paquetes.html)
   ========================================================================== */
.od-bars i { background: rgba(193,234,80,.35); }
.od-bars i.on { background: var(--accent-lime); }
/* Informe: así estábamos / así estamos ahora */
.rep.ax { max-width: 760px; width: 100%; margin: 8px auto 0; padding: 24px 26px 20px; border-radius: 32px; background: #fff; border: 0; text-align: left;
  box-shadow: 0 60px 120px -50px rgba(193,234,80,.28), 0 40px 80px -40px rgba(0,0,0,.6); }
.rep-h { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.rep-h b { display: block; font-size: 17px; font-weight: 600; letter-spacing: -.02em; color: var(--text); } .rep-h small { display: block; font-size: 13px; color: var(--text-dim); }
.rep-day { margin-left: auto; padding: 6px 12px; border-radius: 99px; background: var(--brand-black); color: var(--accent-lime); font-size: 12.5px; font-weight: 600; }
.rep-cols, .rep-r { display: grid; grid-template-columns: minmax(0, 1.4fr) 1fr 1fr; gap: 12px; align-items: center; }
.rep-cols { padding: 0 4px 10px; font-size: 12.5px; font-weight: 600; color: var(--text-faint); }
.rep-cols span:last-child { color: var(--text); }
.rep-r { padding: 15px 4px; border-top: 1px solid var(--border); }
.rep-r b { font-size: 15px; font-weight: 500; color: var(--text); }
.rep-r .was { font-size: 20px; font-weight: 600; color: var(--text-faint); text-decoration: line-through; text-decoration-thickness: 1.5px; text-decoration-color: rgba(17,17,17,.25); }
.rep-r .now { justify-self: start; font-size: 22px; font-weight: 600; letter-spacing: -.02em; color: var(--brand-black); background: var(--accent-lime); padding: 2px 10px; border-radius: 10px; }
.rep-foot { display: flex; align-items: center; gap: 10px; margin: 8px 0 0; padding: 14px 16px; border-radius: 16px; background: #F5F5F7; font-size: 14.5px; font-weight: 500; color: var(--text); }
.rep-foot i { width: 24px; height: 24px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #34C759; color: #fff; } .rep-foot i svg { width: 12px; height: 12px; }
.rep-note { margin: 20px auto 0; text-align: center; font-size: 14px; color: rgba(255,255,255,.5) !important; }
.ax-js .rep.ax .rep-r { opacity: 0; transform: translateY(8px); transition: opacity .5s ease var(--d), transform .6s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .rep.ax.ax-on .rep-r { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .rep.ax .rep-r { opacity: 1; transform: none; transition: none; } }
@media (max-width: 600px) {
  .rep.ax { padding: 18px 16px 16px; border-radius: 24px; }
  .rep-cols, .rep-r { grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; }
  .rep-cols { font-size: 11px; } .rep-r b { font-size: 13.5px; } .rep-r .was { font-size: 15px; } .rep-r .now { font-size: 16px; }
  .rep-cols span:nth-child(2), .rep-cols span:nth-child(3) { text-align: right; }
}
/* Modelo: cuota, bono y garantía */
.mdl { max-width: 1040px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mdl-c { padding: 28px 26px 30px; border-radius: 28px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); text-align: left; }
.mdl-c small { display: block; font-size: 13px; font-weight: 600; color: var(--accent-lime); }
.mdl-c b { display: block; margin-top: 14px; font-size: 26px; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; color: #fff; }
.mdl-c b em { font-style: normal; font-size: 15px; font-weight: 400; color: rgba(255,255,255,.55); letter-spacing: 0; }
.mdl-c p { margin-top: 10px; font-size: 15.5px; line-height: 1.5; color: rgba(255,255,255,.66) !important; }
.mdl-c.on { background: var(--accent-lime); border-color: var(--accent-lime); }
.mdl-c.on small { color: var(--brand-black); } .mdl-c.on b { color: var(--brand-black) !important; } .mdl-c.on p { color: rgba(17,17,17,.72) !important; }
@media (max-width: 860px) { .mdl { grid-template-columns: 1fr; max-width: 460px; } }
#metodo .mtd { margin-top: 0; }
#informe .rep .rep-foot { color: var(--text) !important; }

/* ==========================================================================
   13 oct 2026, socio c: páginas de servicio
   ========================================================================== */
/* Qué medimos */
.qm { max-width: 1040px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.qm-i { padding: 28px 26px 30px; border-radius: 28px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.qm-ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); }
.qm-ic svg { width: 22px; height: 22px; }
.qm-i b { display: block; margin-top: 20px; font-size: 20px; font-weight: 500; letter-spacing: -.02em; color: var(--text); }
.qm-i p { margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--text-dim); }
.qm-cta { display: flex; justify-content: center; margin-top: 36px; }
@media (max-width: 860px) { .qm { grid-template-columns: 1fr; max-width: 460px; } }

/* Web: una web que trabaja */
.wt4 .sv-canvas { height: 210px !important; min-height: 0 !important; display: flex; align-items: center; justify-content: center; padding: 16px !important; }
.wt { width: 100%; max-width: 220px; padding: 14px; border-radius: 18px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 18px 34px -22px rgba(17,17,17,.35); }
.wt-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.wt-h b { font-size: 14px; font-weight: 600; color: var(--text); } .wt-h small { font-size: 11px; color: var(--text-faint); }
.wt-cal .slot { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; padding: 8px 10px; border-radius: 10px; background: #F5F5F7; font-size: 13px; font-weight: 500; color: var(--text-dim); }
.wt-cal .slot.on { background: var(--brand-black); color: #fff; }
.wt-cal .slot i { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-lime); color: var(--brand-black); } .wt-cal .slot i svg { width: 10px; height: 10px; }
.wt-bot { display: flex; flex-direction: column; gap: 6px; }
.wt-bot p { margin: 0; padding: 8px 12px; border-radius: 14px; font-size: 13px; line-height: 1.35; max-width: 88%; }
.wt-bot .q { align-self: flex-start; background: #F1F2F4; color: var(--text); border-bottom-left-radius: 5px; }
.wt-bot .a { align-self: flex-end; background: var(--brand-black); color: #fff; border-bottom-right-radius: 5px; }
.wt-bot small { align-self: flex-end; font-size: 10.5px; color: var(--text-faint); }
.wt-lead .nw-tag { display: inline-flex; padding: 3px 9px; border-radius: 99px; background: var(--accent-lime); color: var(--brand-black); font-size: 11px; font-weight: 600; }
.wt-lead b { display: block; margin-top: 10px; font-size: 16px; font-weight: 600; color: var(--text); }
.wt-lead small { display: block; margin-top: 2px; font-size: 12px; color: var(--text-dim); }
.wt-lead .fu { display: flex; align-items: center; gap: 7px; margin-top: 12px; padding: 8px 10px; border-radius: 10px; background: #F5F5F7; font-size: 12px; font-weight: 500; color: var(--text); }
.wt-lead .fu i { width: 7px; height: 7px; border-radius: 50%; background: #34C759; flex: none; }
.wt-met small { display: block; font-size: 12px; color: var(--text-dim); }
.wt-met b { display: block; margin-top: 4px; font-size: 28px; font-weight: 600; letter-spacing: -.04em; color: var(--text); }
.wt-met .bars { display: flex; align-items: flex-end; gap: 6px; height: 46px; margin-top: 8px; }
.wt-met .bars i { flex: 1; height: var(--h); border-radius: 5px; background: rgba(193,234,80,.35); } .wt-met .bars i.on { background: var(--accent-lime); }
.wt-met em { display: block; margin-top: 8px; font-style: normal; font-size: 10.5px; color: var(--text-faint); }
.wt4 .sv-card h3 { margin-top: 14px; }
@media (max-width: 1000px) { .sv-cards.four.wt4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sv-cards.four.wt4 { grid-template-columns: 1fr; max-width: 400px; margin-inline: auto; } }

/* Eventos: mesas y listas */
.ms { max-width: 940px; margin: 8px auto 0; display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 28px; align-items: center; }
.gl { padding: 22px 22px 18px; border-radius: 28px; background: #fff; text-align: left; box-shadow: 0 50px 100px -50px rgba(193,234,80,.3), 0 30px 60px -30px rgba(0,0,0,.7); }
.gl-h b { display: block; font-size: 17px; font-weight: 600; color: var(--text); } .gl-h small { display: block; font-size: 12.5px; color: var(--text-faint); }
.gl-r { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 0; border-top: 1px solid var(--border); }
.gl-h + .gl-r { margin-top: 12px; }
.gl-r span { font-size: 12.5px; font-weight: 600; color: var(--text-faint); }
.gl-r b { font-size: 14.5px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gl-r em { font-style: normal; padding: 4px 10px; border-radius: 99px; background: #F1F2F4; font-size: 11.5px; font-weight: 600; color: var(--text-dim); white-space: nowrap; }
.gl-r em.ok { background: rgba(52,199,89,.14); color: #1F7A45; }
.gl-r em.in { background: var(--brand-black); color: var(--accent-lime); }
.gl-f { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; padding: 12px 14px; border-radius: 14px; background: var(--accent-lime); font-size: 13.5px; font-weight: 600; color: var(--brand-black); }
.gl-f b { font-size: 16px; }
#mesas .lc-body { min-height: 0; }
@media (max-width: 900px) { .ms { grid-template-columns: 1fr; max-width: 440px; } }
.wt-h { gap: 8px; }
.qm-sec .qm-i { background: #F5F5F7; box-shadow: none; }
@media (max-width: 520px) { .mtd-thread i { width: 8px; } .mtd-thread { gap: 7px; } }

/* ==========================================================================
   13 oct 2026, socio d: ajustes tras la revisión de Luis
   ========================================================================== */
/* Web: "Lo que hace por tu negocio", tres tarjetas con más aire */
.sv-cards.three.wt3 { max-width: 1080px; gap: 20px; }
.wt3 .sv-canvas { height: 250px !important; min-height: 0 !important; display: flex; align-items: center; justify-content: center; padding: 20px !important; }
.wt3 .wt { max-width: 240px; padding: 16px; }
.wt3 .sv-card h3 { margin-top: 18px; font-size: 21px; }
.wt3 .sv-card p { margin-top: 6px; }
@media (max-width: 900px) { .sv-cards.three.wt3 { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; } }
/* Diseño & UX: pasos numerados como el Método */
.uxw-n { width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--brand-black); color: var(--accent-lime); font-size: 15px; font-weight: 600; }
.uxw-r:last-child .uxw-n { background: var(--accent-lime); color: var(--brand-black); }
#palabras-clave .gs p { color: var(--text-dim) !important; }
/* Socio CREVO: panel más limpio */
.one-dash .od-t { min-height: 170px; }
.one-dash .od-big { margin-top: 14px; font-size: 40px; }
.od-up { padding: 8px; } .od-up svg { width: 16px; height: 16px; }
/* Cómo trabajamos juntos: línea de tiempo */
.tl { max-width: 1000px; margin: 8px auto 0; text-align: left; }
.tl-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; position: relative; }
.tl-steps::before { content: ""; position: absolute; left: 8px; right: 8px; top: 8px; height: 2px; background: linear-gradient(90deg, rgba(255,255,255,.18), var(--accent-lime)); }
.tl-steps li { position: relative; padding-top: 34px; }
.tl-dot { position: absolute; left: 0; top: 0; width: 18px; height: 18px; border-radius: 50%; background: #111; border: 2px solid rgba(255,255,255,.5); }
.tl-dot.on { background: var(--accent-lime); border-color: var(--accent-lime); box-shadow: 0 0 0 6px rgba(193,234,80,.18); }
.tl-steps small, .tl-o small { display: block; font-size: 13px; font-weight: 600; color: var(--accent-lime); }
.tl-steps b { display: block; margin-top: 8px; font-size: 22px; font-weight: 500; letter-spacing: -.02em; color: #fff; }
.tl-steps p { margin-top: 6px; font-size: 15.5px; line-height: 1.5; color: rgba(255,255,255,.62) !important; }
.tl-out { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 44px; }
.tl-o { padding: 26px; border-radius: 26px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.tl-o b { display: block; margin-top: 10px; font-size: 24px; font-weight: 600; letter-spacing: -.025em; line-height: 1.2; color: #fff; }
.tl-o p { margin-top: 8px; font-size: 15.5px; line-height: 1.5; color: rgba(255,255,255,.62) !important; }
.tl-o.on { background: var(--accent-lime); border-color: var(--accent-lime); }
.tl-o.on small { color: rgba(17,17,17,.6); } .tl-o.on b { color: var(--brand-black) !important; } .tl-o.on p { color: rgba(17,17,17,.7) !important; }
@media (max-width: 760px) {
  .tl-steps { grid-template-columns: 1fr; gap: 26px; padding-left: 34px; }
  .tl-steps::before { left: 8px; right: auto; top: 8px; bottom: 8px; width: 2px; height: auto; background: linear-gradient(180deg, rgba(255,255,255,.18), var(--accent-lime)); }
  .tl-steps li { padding-top: 0; } .tl-dot { left: -34px; }
  .tl-out { grid-template-columns: 1fr; margin-top: 32px; }
}

/* ==========================================================================
   13 oct 2026, socio e: segunda revisión de Luis
   ========================================================================== */
/* Heroes: la línea grande completa en degradado, como el original */
/* Social Media: íconos de los pasos con terminación tipo app de iPhone */
.pm-ic { position: relative; width: 52px; height: 52px; border-radius: 14px; overflow: hidden;
  box-shadow: inset 0 0 0 .5px rgba(0,0,0,.12), 0 1px 1px rgba(17,17,17,.06), 0 10px 22px -12px rgba(17,17,17,.45); }
.pm-ic::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,.38) 0%, rgba(255,255,255,.08) 42%, rgba(255,255,255,0) 50%); }
.pm-ic.s1.cal { background: linear-gradient(180deg, #FFFFFF, #F2F2F4); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: 6px; color: #111; }
.pm-ic.s1.cal small { font-size: 9px; font-weight: 600; letter-spacing: .06em; color: #FF3B30; line-height: 1; }
.pm-ic.s1.cal b { font-size: 26px; font-weight: 400; line-height: 1; letter-spacing: -.04em; margin-top: 3px; }
.pm-ic.s1.cal::after { background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,0) 40%); }
.pm-ic.s2 { background: linear-gradient(180deg, #D9F58E 0%, #C1EA50 55%, #A9D63A 100%); color: #111; }
.pm-ic.s2 svg { width: 26px; height: 26px; }
.pm-ic.s3 { background: linear-gradient(180deg, #3A3A3F 0%, #1C1C1F 55%, #0E0E10 100%); color: var(--accent-lime); }
.pm-ic.s3 svg { width: 24px; height: 24px; transform: translate(-1px, 1px); }
/* Web: "Lo que hace por ti", el camino de un cliente nuevo */
.wj { width: 100%; max-width: 250px; text-align: left; }
.wj-find { padding: 14px; border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 18px 34px -22px rgba(17,17,17,.35); }
.wj-find .q { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 99px; background: #F2F2F4; font-size: 13px; color: var(--text); }
.wj-find .q svg { width: 14px; height: 14px; color: var(--text-faint); }
.wj-find .r { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 10px; border-radius: 14px; background: rgba(193,234,80,.16); }
.wj-find .r i { width: 30px; height: 30px; border-radius: 9px; flex: none; background: #111; }
.wj-find .r b { display: block; font-size: 13.5px; font-weight: 600; color: var(--text); }
.wj-find .r small { display: block; font-size: 11.5px; color: #3E7A1E; }
.wj-find .r.dim { background: none; } .wj-find .r.dim i { background: #ECEEF1; }
.wj-find .r.dim b { width: 90px; height: 7px; border-radius: 4px; background: #E6E8EC; } .wj-find .r.dim small { width: 60px; height: 6px; margin-top: 6px; border-radius: 4px; background: #EEF0F3; }
.wj-chat { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 18px 34px -22px rgba(17,17,17,.35); }
.wj-chat p { margin: 0; padding: 9px 12px; border-radius: 16px; font-size: 13px; line-height: 1.35; max-width: 86%; }
.wj-chat .q { align-self: flex-start; background: #F1F2F4; color: var(--text); border-bottom-left-radius: 5px; }
.wj-chat .a { align-self: flex-end; background: #111; color: #fff; border-bottom-right-radius: 5px; }
.wj-chat small { align-self: flex-end; font-size: 10.5px; color: var(--text-faint); }
.wj-notif { display: flex; gap: 11px; align-items: flex-start; padding: 13px 14px; border-radius: 20px; background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 18px 34px -22px rgba(17,17,17,.35); }
.wj-notif .ic { width: 34px; height: 34px; border-radius: 9px; flex: none; display: grid; place-items: center; background: linear-gradient(180deg, #5FFC7B, #28C840); }
.wj-notif .ic svg { width: 19px; height: 19px; }
.wj-notif b { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; font-weight: 600; color: var(--text); }
.wj-notif b em { font-style: normal; font-weight: 400; font-size: 11.5px; color: var(--text-faint); }
.wj-notif small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.35; color: var(--text); }
/* Web, Diseño & UX: lista estilo Apple, más grande */
.uxw { max-width: 600px; padding: 28px 30px 18px; }
.uxw-h { padding-bottom: 20px; }
.uxw-th { width: 86px; height: 58px; border-radius: 12px; }
.uxw-h b { font-size: 19px; }
.uxw-r, .uxw-r:last-child { margin: 0; padding: 16px 0; border-top: 1px solid var(--border); border-radius: 0; background: none; gap: 14px; }
.uxw-r b { font-size: 16px; } .uxw-r small { font-size: 13.5px; }
.uxw-g { width: 40px; height: 40px; border-radius: 11px; flex: none; display: grid; place-items: center; background: #F2F2F7; color: #1C1C1E; }
.uxw-g svg { width: 21px; height: 21px; }
.uxw-st { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; color: var(--text-faint); }
.uxw-st i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: #34C759; color: #fff; }
.uxw-st i svg { width: 10px; height: 10px; }
.uxw-st.ok { padding: 6px 12px; border-radius: 99px; background: rgba(52,199,89,.12); color: #248A3D; font-weight: 600; }
@media (max-width: 600px) { .uxw { padding: 20px 18px 10px; } .uxw-st { font-size: 13px; } .uxw-g { width: 36px; height: 36px; } }
/* Web, Conectado con tus canales: íconos con brillo tipo app */
.web-int .item .ax-app.ig { position: relative; overflow: hidden; width: 38px; height: 38px; border-radius: 10.5px; }
.web-int .item .ax-app.ig::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 50%); }
.web-int .item .ax-app.wa { background: linear-gradient(180deg, #5FFC7B 0%, #28C840 60%, #1FAE3A 100%); }
.web-int .item .ax-app.fo { background: linear-gradient(180deg, #3A3A3F, #111); color: #fff; }
.web-int .item .ax-app.an { background: linear-gradient(180deg, #D9F58E, #C1EA50 55%, #A9D63A); }
.web-int .item .ax-app.an svg rect { fill: #111; }
/* Socio CREVO: "Un equipo, un sistema" como widgets tipo iPhone */
.wg3.ax { max-width: 820px; width: 100%; margin: 8px auto 0; padding: 0; background: none; border: 0; box-shadow: none; border-radius: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.wg { aspect-ratio: 1; padding: 22px; border-radius: 34px; background: #fff; display: flex; flex-direction: column; text-align: left;
  box-shadow: 0 50px 90px -50px rgba(193,234,80,.35), 0 30px 60px -36px rgba(0,0,0,.7); }
.wg.dark { background: linear-gradient(180deg, #2A2A2E, #1A1A1D); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 30px 60px -36px rgba(0,0,0,.7); }
.wg-l { font-size: 14px; font-weight: 600; color: var(--text-dim); }
.wg.dark .wg-l { color: rgba(255,255,255,.6); }
.wg-ring { position: relative; margin: auto; width: 62%; aspect-ratio: 1; }
.wg-ring svg { width: 100%; height: 100%; display: block; }
.wg-ring b { position: absolute; inset: 0; display: grid; place-items: center; font-size: clamp(22px, 2.6vw, 30px); font-weight: 600; letter-spacing: -.03em; color: var(--text); }
.wg-big { margin-top: auto; font-size: clamp(40px, 5vw, 58px); font-weight: 600; letter-spacing: -.045em; line-height: 1; color: var(--text); }
.wg-big small { font-size: .42em; font-weight: 500; letter-spacing: -.01em; color: var(--text-dim); }
.wg.dark .wg-big { color: #fff; } .wg.dark .wg-big small { color: rgba(255,255,255,.6); }
.wg-line { width: 100%; height: 40px; margin-top: 14px; }
.wg-bars { display: flex; align-items: flex-end; gap: 7px; height: 52px; margin-top: 14px; }
.wg-bars i { flex: 1; height: var(--h); border-radius: 6px; background: rgba(193,234,80,.35); }
.wg-bars i.on { background: var(--accent-lime); }
.wg-note { margin: 22px auto 0; text-align: center; font-size: 14px; color: rgba(255,255,255,.5) !important; }
.ax-js .wg3.ax .wg { opacity: 0; transform: translateY(14px) scale(.98); transition: opacity .6s ease var(--d), transform .7s cubic-bezier(.2,.8,.2,1) var(--d); }
.ax-js .wg3.ax.ax-on .wg { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ax-js .wg3.ax .wg { opacity: 1; transform: none; transition: none; } }
@media (max-width: 700px) { .wg3.ax { grid-template-columns: 1fr 1fr; gap: 12px; } .wg3 .wg:first-child { grid-column: 1 / -1; aspect-ratio: auto; min-height: 200px; } .wg { padding: 18px; border-radius: 28px; } .wg-ring { width: 120px; } }
/* Socio CREVO: Método + tu mes, en una sola sección */
.mx-start { max-width: 860px; margin: 8px auto 0; display: flex; align-items: stretch; justify-content: center; gap: 14px; flex-wrap: wrap; }
.mx-lbl { display: block; width: 100%; text-align: center; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--text-faint); margin-bottom: 4px; }
.mx-step { flex: 1 1 300px; max-width: 400px; display: flex; gap: 14px; align-items: flex-start; padding: 22px 22px 24px; border-radius: 24px; background: #F5F5F7; text-align: left; }
.mx-step span { width: 32px; height: 32px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #fff; box-shadow: inset 0 0 0 1px var(--border); font-size: 14px; font-weight: 600; color: var(--text); }
.mx-step b { display: block; font-size: 18px; font-weight: 500; letter-spacing: -.02em; color: var(--text); }
.mx-step p { margin-top: 4px; font-size: 14.5px; line-height: 1.5; color: var(--text-dim); }
.mx-arrow { align-self: center; width: 22px; height: 2px; background: var(--border-strong, #C9CDD3); position: relative; }
.mx-arrow::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 2px solid #C9CDD3; border-right: 2px solid #C9CDD3; transform: rotate(45deg); }
.mx-month { margin: 44px auto 18px; }
@media (max-width: 760px) { .mx-arrow { display: none; } }
@media (max-width: 700px) { .wg3.ax { grid-template-columns: repeat(2, minmax(0, 1fr)); } .wg { min-width: 0; } .wg-big { font-size: 38px; } .wg-l { font-size: 13px; } }

/* ==========================================================================
   13 oct 2026, socio f: tercera revisión de Luis
   ========================================================================== */
/* Web: "Así te llegan clientes", tres pasos muy simples */
.flow3 { list-style: none; margin: 8px auto 0; padding: 0; max-width: 1000px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.flow3 li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 8px 12px; }
.flow3 li:not(:last-child)::after { content: ""; position: absolute; top: 54px; right: -26px; width: 28px; height: 28px;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B5BAC2' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
.f-ic { position: relative; width: 112px; height: 112px; border-radius: 28px; display: grid; place-items: center; overflow: hidden;
  box-shadow: inset 0 0 0 .5px rgba(0,0,0,.1), 0 24px 40px -20px rgba(17,17,17,.45); }
.f-ic::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0) 50%); pointer-events: none; }
.f-ic svg { width: 50px; height: 50px; position: relative; z-index: 1; }
.f-ic.s { background: linear-gradient(180deg, #FFFFFF, #ECEDF0); color: #111; }
.f-ic.c { background: linear-gradient(180deg, #3A3A3F, #111); color: var(--accent-lime); }
.f-ic.w { background: linear-gradient(180deg, #5FFC7B 0%, #28C840 60%, #1FAE3A 100%); }
.f-ic.w svg { width: 56px; height: 56px; }
.flow3 b { display: block; margin-top: 26px; font-size: 24px; font-weight: 500; letter-spacing: -.025em; color: var(--text); }
.flow3 p { margin-top: 8px; max-width: 240px; font-size: 16px; line-height: 1.5; color: var(--text-dim); }
@media (max-width: 760px) {
  .flow3 { grid-template-columns: 1fr; gap: 48px; max-width: 340px; }
  .flow3 li:not(:last-child)::after { top: auto; bottom: -38px; right: 50%; transform: translateX(50%) rotate(90deg); }
  .f-ic { width: 96px; height: 96px; border-radius: 24px; } .f-ic svg { width: 42px; height: 42px; }
  .flow3 b { margin-top: 18px; font-size: 22px; }
}
/* Web: Diseño & UX en tres tarjetas */
.ux3c { max-width: 1040px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.u3 { padding: 12px 12px 28px; border-radius: 30px; background: #fff; text-align: center; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); }
.u3-v { height: 210px; border-radius: 22px; background: #F5F5F7; display: flex; align-items: center; justify-content: center; padding: 18px; }
.u3 h3 { margin-top: 22px; font-size: 22px; font-weight: 500; letter-spacing: -.02em; color: var(--text) !important; }
.u3 p { margin: 6px auto 0; max-width: 260px; font-size: 15.5px; line-height: 1.5; color: var(--text-dim) !important; }
.u3-site { width: 190px; border-radius: 14px; background: #fff; overflow: hidden; box-shadow: 0 18px 30px -18px rgba(17,17,17,.4); }
.u3-site .bar { display: flex; gap: 4px; padding: 8px 10px; background: #F1F2F4; }
.u3-site .bar i { width: 6px; height: 6px; border-radius: 50%; background: #D0D4DA; }
.u3-site .hero { display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; height: 84px; margin: 8px; padding: 10px; border-radius: 9px; background-size: cover; background-position: center; }
.u3-site .hero b { width: 70%; height: 7px; border-radius: 4px; background: #fff; } .u3-site .hero b.s { width: 40%; opacity: .8; }
.u3-site .row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 0 8px 10px; }
.u3-site .row i { height: 26px; border-radius: 6px; background: #ECEEF1; }
.u3-list { width: 200px; display: flex; flex-direction: column; gap: 8px; }
.u3-list .it { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: #fff; font-size: 13.5px; font-weight: 500; color: var(--text); text-align: left; box-shadow: 0 10px 20px -16px rgba(17,17,17,.4); }
.u3-list .it i { width: 20px; height: 20px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #34C759; color: #fff; }
.u3-list .it i svg { width: 10px; height: 10px; }
.u3-list .it.now { box-shadow: 0 0 0 1.5px var(--brand-black), 0 10px 20px -16px rgba(17,17,17,.4); }
.u3-list .it i.pen { background: #111; color: var(--accent-lime); } .u3-list .it i.pen svg { width: 11px; height: 11px; }
.u3-ok { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.u3-ok .seal { width: 92px; height: 92px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #6BE38A, #34C759 55%, #239A43); color: #fff; box-shadow: 0 18px 30px -12px rgba(36,140,60,.55), 0 0 0 8px rgba(52,199,89,.14); }
.u3-ok .seal svg { width: 44px; height: 44px; }
.u3-ok b { font-size: 18px; font-weight: 600; color: #248A3D; }
#diseno-ux .ux-ai { margin-top: 32px; }
@media (max-width: 860px) { .ux3c { grid-template-columns: 1fr; max-width: 420px; } }
/* Socio CREVO: "Te reportamos" */
.mrep { gap: 6px !important; width: 100%; max-width: 200px !important; text-align: left; }
.mrep .mr-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.mrep .mr-h b { font-size: 14px; font-weight: 600; color: var(--text); } .mrep .mr-h small { font-size: 11px; color: var(--text-faint); }
.mrep .mr-r { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 10px; background: #fff; font-size: 12px; font-weight: 500; color: var(--text); box-shadow: 0 6px 14px -12px rgba(17,17,17,.4); }
.mrep .mr-r i { width: 16px; height: 16px; border-radius: 50%; flex: none; position: relative; }
.mrep .mr-r i.up { background: var(--accent-lime); }
.mrep .mr-r i.up::after { content: ""; position: absolute; left: 5px; top: 5px; width: 5px; height: 5px; border-left: 1.8px solid #111; border-top: 1.8px solid #111; transform: rotate(45deg); }
.mrep .mr-r i.nx { background: #111; }
.mrep .mr-r i.nx::after { content: ""; position: absolute; left: 4px; top: 5px; width: 5px; height: 5px; border-right: 1.8px solid var(--accent-lime); border-top: 1.8px solid var(--accent-lime); transform: rotate(45deg); }
#sistema .sv-card h3 { color: var(--text) !important; }
#sistema .sv-card p { color: var(--text-dim) !important; }
#tu-mes.alt .mx-step { background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 18px 40px -32px rgba(17,17,17,.3); }
.mrep { align-items: stretch !important; }
.mrep .mr-h { gap: 8px; }
.mrep .mr-r { justify-content: flex-start; text-align: left; white-space: nowrap; font-size: 11.5px; padding: 7px 8px; }
#sistema .sv-card { background: #fff !important; }

/* ==== 13 oct 2026 (5ta): web notificaciones, socio CREVO seis pasos ==== */
.nt-panel { max-width: 560px; margin: 8px auto 0; padding: 22px; border-radius: 28px; background: #fff; box-shadow: 0 1px 0 rgba(0,0,0,.03), 0 30px 60px -36px rgba(20,20,25,.35); display: flex; flex-direction: column; gap: 10px; }
.nt-day { font-size: 13px; font-weight: 600; color: var(--text-dim); padding: 0 4px 4px; }
.nt { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px; border-radius: 20px; background: #F5F5F7; text-align: left; }
.nt > div { flex: 1; min-width: 0; }
.nt-ic { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; }
.nt-ic svg { width: 22px; height: 22px; }
.nt-ic.g { background: #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.06); }
.nt-ic.c { background: linear-gradient(180deg, #3A3A3F, #111); color: var(--accent-lime); }
.nt-ic.w { background: linear-gradient(180deg, #5FFC7B, #28C840 60%, #1FAE3A); }
.nt-ic.w svg { width: 24px; height: 24px; }
.nt-t { display: flex; align-items: baseline; gap: 10px; }
.nt-t b { flex: 1; min-width: 0; font-size: 15.5px; font-weight: 600; color: var(--text); letter-spacing: -.01em; }
.nt-t time { flex: none; font-size: 12.5px; color: var(--text-faint, #8a8a8e); }
.nt p { margin-top: 3px; font-size: 14.5px; line-height: 1.45; color: var(--text-dim); }
@media (max-width: 480px) { .nt-panel { padding: 14px; border-radius: 24px; } .nt { padding: 12px 13px; gap: 12px; } .nt-ic { width: 38px; height: 38px; } .nt-t b { font-size: 14.5px; } .nt p { font-size: 13.5px; } }

.sx-more { max-width: 900px; margin: 56px auto 0; text-align: center; }
.sx-lbl { display: block; font-size: 14px; font-weight: 600; color: var(--accent-lime); letter-spacing: .02em; }
.sx-more ul { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.sx-more li { padding: 10px 18px; border-radius: 99px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); color: #fff; font-size: 16px; font-weight: 500; }
.sx-more li.mas { border-color: transparent; background: var(--accent-lime); color: #111; font-weight: 600; }
@media (max-width: 480px) { .sx-more { margin-top: 40px; } .sx-more li { font-size: 14.5px; padding: 9px 15px; } }

#por-que .why3.four { gap: 56px; }
#por-que .why3 > div { padding-top: 30px; }
#por-que .why3 .wn { font-size: 40px; font-weight: 600; letter-spacing: -.04em; line-height: 1; background: linear-gradient(120deg, #9BCB2C, #C1EA50 55%, #DDF59A); -webkit-background-clip: text; background-clip: text; color: transparent; }
#por-que .why3 h3 { margin-top: 18px; }
#por-que .why3 p { margin-top: 12px; }
@media (max-width: 1100px) { #por-que .why3.four { gap: 56px 64px; } }
@media (max-width: 640px) { #por-que .why3.four { gap: 44px; } #por-que .why3 .wn { font-size: 34px; } }

.sv-cards.sx-six { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; gap: 18px; }
.sx-six .sv-card { position: relative; padding: 18px 18px 26px; }
.sx-six .sv-canvas { height: 220px; display: flex; align-items: center; justify-content: center; }
.sx-six .ax.mini { zoom: 1.1; }
.sx-six .sv-card h3 { font-size: 21px; margin-top: 18px; }
.sx-six .sv-card p { font-size: 15px; }
.sx-n { position: absolute; top: 30px; left: 30px; z-index: 2; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #111; color: var(--accent-lime); font-size: 14px; font-weight: 600; }
.sx-tag { position: absolute; top: 34px; right: 30px; z-index: 2; font-size: 12px; font-weight: 600; color: var(--text-faint, #8a8a8e); }
.sx-diag span { white-space: nowrap; }
.sx-base { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.sx-pill { padding: 4px 12px; border-radius: 99px; background: #111; color: var(--accent-lime); font-size: 12px; font-weight: 600; }
.sx-base .bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; width: 170px; }
.sx-base .bars i { flex: 1; height: var(--h); border-radius: 7px; background: linear-gradient(180deg, #E4E7EB, #D6DAE0); }
.sx-base .bars i.on { background: linear-gradient(180deg, #D6F28A, #C1EA50); }
.sx-goal { width: 200px; display: flex; flex-direction: column; gap: 9px; text-align: left; }
.sx-goal span { display: block; padding: 9px 11px; border-radius: 12px; background: #fff; box-shadow: 0 6px 14px -12px rgba(0,0,0,.4); }
.sx-goal b { display: block; font-size: 12px; font-weight: 600; color: var(--text); }
.sx-goal i { display: block; margin-top: 6px; height: 6px; border-radius: 3px; background: #ECEEF1; overflow: hidden; }
.sx-goal em { display: block; height: 100%; width: var(--w); border-radius: inherit; background: linear-gradient(90deg, #A6D13A, #C1EA50); }
@media (max-width: 1000px) { .sv-cards.sx-six { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 720px; } }
@media (max-width: 600px) { .sv-cards.sx-six { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; } .sx-six .ax.mini { zoom: 1; } }
.sx-six .sv-canvas { padding-top: 34px; height: 240px; }
.sx-diag { min-width: 196px; }
.sx-diag span { gap: 12px; justify-content: space-between; }
.sx-six .ax.mini:has(.sx-goal) { zoom: 1; }
.sx-goal { width: 190px; gap: 8px; }
.sx-goal span { padding: 8px 11px; }
.sx-base .bars { height: 110px; width: 190px; }

/* ==== 13 oct 2026 (6ta): web conversación, azul Apple, partner CREVO ==== */
.nt-chat { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 20px; background: #F5F5F7; }
.nt-chat p { max-width: 78%; padding: 10px 14px; border-radius: 18px; font-size: 15px; line-height: 1.4; text-align: left; }
.nt-chat .q { align-self: flex-start; background: #fff; color: var(--text); border-bottom-left-radius: 6px; }
.nt-chat .a { align-self: flex-end; background: linear-gradient(180deg, #2A2A2E, #111); color: #fff; border-bottom-right-radius: 6px; }
.nt-you { margin-top: 10px; }
.nt p strong { font-weight: 600; color: var(--text); }
@media (max-width: 480px) { .nt-chat { padding: 12px; } .nt-chat p { font-size: 14px; max-width: 86%; } }

/* Diseño & UX: verde a azul Apple */
.u3-list .it i { background: linear-gradient(180deg, #3A9BFF, #0A84FF); }
.u3-ok .seal { background: radial-gradient(circle at 35% 30%, #6CB8FF, #0A84FF 55%, #0066D6); box-shadow: 0 18px 30px -12px rgba(10,132,255,.6), 0 0 0 7px rgba(10,132,255,.12); }
.u3-ok b { color: #0A84FF; }

/* Ads & SEO en azul Apple dentro del sistema */
#sistema .mi-pill { background: rgba(10,132,255,.12); color: #0A6FD6; }

/* Por qué funciona mejor: pesos iguales y más aire */
#por-que .why3.four { gap: 72px; max-width: 1240px; }
#por-que .why3 .wn { font-weight: 500; font-size: 36px; }
#por-que .why3 h3 { font-weight: 500; }
@media (max-width: 1100px) { #por-que .why3.four { gap: 64px 80px; } }
@media (max-width: 640px) { #por-que .why3.four { gap: 52px; } #por-que .why3 .wn { font-size: 32px; } }

/* Seis pasos */
.sx-diag { min-width: 180px; }
.mo-rev em.x { background: #111; color: var(--accent-lime); }
.sx-proc { width: 190px; display: flex; flex-direction: column; gap: 6px; }
.sx-proc span { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 12px; background: #fff; font-size: 12.5px; font-weight: 500; color: var(--text); box-shadow: inset 0 0 0 1px #E6E7EB; text-align: left; }
.sx-proc b { width: 20px; font-size: 14px; font-weight: 600; color: #0A84FF; text-align: center; }
.sx-bl { width: 210px; padding: 12px 14px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px #E6E7EB; text-align: left; }
.sx-bl-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sx-bl-h b { font-size: 12px; font-weight: 600; color: var(--text); }
.sx-bl-h em { font-style: normal; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 99px; background: #111; color: var(--accent-lime); }
.sx-bl svg { display: block; width: 100%; height: 80px; margin-top: 8px; }
.sx-bl-f { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 11px; font-weight: 500; color: var(--text-dim); }
.sx-bl-f i { width: 16px; height: 0; border-top: 3px dashed var(--accent-lime); }
.sx-rep { display: flex; flex-direction: column; gap: 10px; width: 200px; text-align: left; }
.sx-rep .mr-h { display: flex; justify-content: space-between; align-items: baseline; }
.sx-rep .mr-h b { font-size: 14px; font-weight: 600; color: var(--text); } .sx-rep .mr-h small { font-size: 11px; color: var(--text-faint); }
.sx-rep .cmp { display: block; padding: 10px 12px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E6E7EB; }
.sx-rep .cmp small { display: block; font-size: 11.5px; font-weight: 500; color: var(--text-dim); }
.sx-rep .cmp i { display: block; margin-top: 7px; height: 8px; border-radius: 4px; width: var(--w); background: #D6DAE0; }
.sx-rep .cmp.now i { background: linear-gradient(90deg, #A6D13A, #C1EA50); }
.sx-rep .cmp.now small { color: var(--text); font-weight: 600; }

.ax.mini.sx-rep { align-items: stretch !important; width: 210px; max-width: 210px !important; }
.sx-rep .mr-h { gap: 10px; }

/* ==== 13 oct 2026 (7ma): todo más simple, colores Apple, partner CREVO ==== */
/* Social Media: pedidos como burbujas de iMessage */
.sv-orders .ord .bubble, .sv.alt .sv-orders .ord .bubble { position: relative; background: #0A84FF; color: #fff; box-shadow: none; border-radius: 20px 20px 20px 6px; padding: 12px 17px; }
.sv-orders .ord .bubble::before { content: ""; position: absolute; left: -6px; bottom: 0; width: 12px; height: 16px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 16'%3E%3Cpath d='M12 0C12 7 10 12 0 16c6 0 10-1 12-3z' fill='%230A84FF'/%3E%3C/svg%3E") no-repeat bottom / contain; }
/* Social Media: Tú apruebas en verde Apple, Publicamos en azul */
.pm-ic.s2 { background: linear-gradient(180deg, #5EE07F 0%, #34C759 55%, #28A745 100%); color: #fff; }
.pm-ic.s3 { background: linear-gradient(180deg, #4FA8FF 0%, #0A84FF 55%, #0070E0 100%); color: #fff; }

/* Web: Aprobado sin sombra */
.u3-ok .seal { box-shadow: none; }

/* Web: las cuatro preguntas de siempre */
.qa4 { max-width: 1160px; margin: 8px auto 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.qa { display: flex; flex-direction: column; padding: 18px 18px 22px; border-radius: 26px; background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); text-align: left; }
.qa-q { align-self: flex-start; position: relative; padding: 9px 15px; border-radius: 19px 19px 19px 6px; background: #E9E9EB; font-size: 15.5px; line-height: 1.3; color: #111; }
.qa-a { position: relative; margin-top: 14px; height: 150px; border-radius: 18px; background: #F5F5F7; display: grid; place-items: center; overflow: hidden; }
.qa > b { margin-top: 16px; font-size: 18px; font-weight: 500; letter-spacing: -.015em; color: var(--text); }
.qa-cat { display: flex; gap: 8px; }
.qa-cat i { width: 58px; height: 74px; border-radius: 12px; background: center / cover; box-shadow: 0 10px 18px -12px rgba(17,17,17,.4); }
.qa-cat i:nth-child(2) { height: 88px; }
.qa-price { width: 78%; display: flex; flex-direction: column; gap: 8px; }
.qa-price > span { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; background: #fff; }
.qa-price i { flex: 1; height: 7px; border-radius: 4px; background: #DADCE0; }
.qa-price i.m { flex: .75; } .qa-price i.s { flex: .55; }
.qa-price b { margin-left: auto; font-size: 14px; font-weight: 600; color: #111; }
.qa-map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.qa-pin { position: relative; width: 26px; height: 26px; border-radius: 50%; background: #0A84FF; border: 3px solid #fff; box-shadow: 0 6px 14px rgba(17,17,17,.25); }
.qa-pin::after { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; margin: -3px 0 0 -3px; border-radius: 50%; background: #fff; }
.qa-wa { display: inline-flex; align-items: center; gap: 9px; padding: 12px 20px 12px 14px; border-radius: 99px; background: #25D366; color: #fff; font-size: 15px; font-weight: 600; box-shadow: 0 12px 22px -14px rgba(20,140,60,.7); }
.qa-wa svg { width: 20px; height: 20px; }
@media (max-width: 1060px) { .qa4 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; } }
@media (max-width: 480px) { .qa4 { gap: 14px; } .qa { padding: 14px 14px 18px; border-radius: 22px; } .qa-q { font-size: 14px; padding: 8px 12px; } .qa-a { height: 118px; } .qa > b { font-size: 15.5px; margin-top: 12px; } .qa-cat i { width: 40px; height: 54px; } .qa-cat i:nth-child(2) { height: 64px; } .qa-price { width: 88%; gap: 6px; } .qa-price > span { padding: 6px 9px; } .qa-price b { font-size: 12.5px; } .qa-wa { font-size: 13px; padding: 9px 14px 9px 10px; } .qa-wa svg { width: 17px; height: 17px; } }

/* Ads & SEO: auditoría con la misma forma que el mapa */
.sv:not(.alt) .sv-card:has(.mi-audit) { background: #fff; border-color: transparent; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 24px 50px -40px rgba(17,17,17,.3); }
.sv-card:has(.mi-audit) .sv-canvas { background: transparent; border: 0; }
.au-page { padding: 12px 16px 0; background: #F5F5F7 !important; }
.au-page > span { display: block; }
.au-bar { display: flex !important; gap: 4px; margin-bottom: 8px; }
.au-bar i { width: 6px; height: 6px; border-radius: 50%; background: #D5D7DC; }
.au-hero { height: 46px; border-radius: 10px; background: linear-gradient(135deg, #CFE6FA, #E4F0FB); }
.au-l { height: 7px; width: 62%; margin-top: 10px; border-radius: 4px; background: #DADCE0; }
.au-l.s { width: 40%; margin-top: 6px; background: #E4E6EA; }
.au-row { display: flex !important; gap: 8px; margin-top: 10px; }
.au-row i { flex: 1; height: 26px; border-radius: 8px; background: #fff; }
.au-mk { position: absolute; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; display: grid !important; place-items: center; border: 2.5px solid #fff; color: #fff; font-size: 13px; font-weight: 600; box-shadow: 0 6px 14px rgba(17,17,17,.2); }
.au-mk svg { width: 12px; height: 12px; }
.au-mk.ok { background: #34C759; } .au-mk.fix { background: #FF9F0A; }

/* Partner: por qué funciona, un grosor menos */
#por-que .sv-head h2 { font-weight: 400; }
#por-que .why3 h3, #por-que .why3 .wn { font-weight: 400; }

/* Partner: cuatro pasos */
.sv-cards.sx-four { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1240px; gap: 18px; }
.sx-four .sv-card { position: relative; padding: 18px 18px 26px; }
.sx-four .sv-canvas { padding-top: 34px; height: 250px; display: flex; align-items: center; justify-content: center; }
.sx-four .sv-card h3 { font-size: 20px; margin-top: 18px; }
.sx-four .sv-card p { font-size: 15px; }
@media (max-width: 1100px) { .sv-cards.sx-four { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; } }
@media (max-width: 600px) { .sv-cards.sx-four { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; } }
.s7-path, .s7-build { width: 200px; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.s7-path span, .s7-build span { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 12px; background: #fff; font-size: 12.5px; font-weight: 500; color: var(--text); box-shadow: inset 0 0 0 1px #E6E7EB; white-space: nowrap; }
.s7-path b { width: 16px; font-size: 13px; font-weight: 600; color: #86868B; text-align: center; }
.s7-path em { margin-left: auto; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 600; color: #fff; }
.s7-path em svg { width: 10px; height: 10px; }
.s7-path em.ok { background: #34C759; } .s7-path em.x { background: #FF3B30; }
.s7-path .bad { box-shadow: inset 0 0 0 1.5px #FF3B30; }
.s7-path .off { color: #A1A1A6; background: transparent; box-shadow: inset 0 0 0 1px #E6E7EB; }
.s7-base { width: 190px; padding: 18px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px #E6E7EB; text-align: left; }
.s7-base small { display: block; font-size: 12.5px; font-weight: 500; color: var(--text-dim); }
.s7-base b { display: block; margin-top: 6px; font-size: 46px; font-weight: 500; letter-spacing: -.04em; line-height: 1; color: var(--text); }
.s7-base span { display: inline-block; margin-top: 14px; padding: 4px 10px; border-radius: 99px; background: #F2F2F4; font-size: 11.5px; font-weight: 600; color: var(--text-dim); }
.s7-build em.d { flex: none; width: 38px; font-style: normal; font-size: 10px; font-weight: 600; letter-spacing: .04em; color: var(--c); }
.s7-build small { margin-left: auto; font-size: 11.5px; color: var(--text-faint); }
.s7-build small.on { color: #0A84FF; font-weight: 600; }
.s7-build .tg { margin-left: auto; position: relative; width: 30px; height: 18px; border-radius: 99px; background: #34C759; flex: none; }
.s7-build .tg::after { content: ""; position: absolute; right: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); }

/* Partner: la promesa en tres partes */
.pr { max-width: 1080px; margin: 80px auto 0; padding: 52px 48px 48px; border-radius: 32px; background: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -44px rgba(17,17,17,.35); text-align: center; }
.pr-h { font-size: clamp(28px, 3.4vw, 42px); font-weight: 500; letter-spacing: -.035em; line-height: 1.12; color: var(--text); }
.pr-h span { color: #0A84FF; }
.pr-sub { margin: 12px auto 0; max-width: 520px; font-size: 17px; line-height: 1.5; color: var(--text-dim); }
.pr-grid { margin-top: 44px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); text-align: left; }
.pr-c { padding: 4px 32px; border-left: 1px solid var(--border); }
.pr-c:first-child { border-left: 0; padding-left: 0; }
.pr-c:last-child { padding-right: 0; }
.pr-k { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--c); }
.pr-k i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.pr-c b { display: block; margin-top: 12px; font-size: clamp(22px, 2.2vw, 28px); font-weight: 500; letter-spacing: -.03em; line-height: 1.15; color: var(--text); }
.pr-c p { margin-top: 10px; font-size: 15.5px; line-height: 1.5; color: var(--text-dim); }
.pr-cta { display: inline-flex; align-items: center; gap: 8px; margin-top: 40px; padding: 14px 24px; border-radius: 99px; background: #111; color: #fff; font-size: 16px; font-weight: 500; text-decoration: none; }
.pr-cta svg { width: 16px; height: 16px; }
@media (max-width: 760px) {
  .pr { margin-top: 56px; padding: 36px 22px 32px; border-radius: 26px; }
  .pr-grid { grid-template-columns: 1fr; margin-top: 28px; }
  .pr-c, .pr-c:first-child, .pr-c:last-child { padding: 20px 0; border-left: 0; border-top: 1px solid var(--border); }
  .pr-c:first-child { border-top: 0; padding-top: 0; }
  .pr-sub { font-size: 15.5px; }
  .pr-cta { margin-top: 20px; }
}
@media (max-width: 600px) { .qa4 { grid-template-columns: 1fr; max-width: 360px; } .qa-a { height: 130px; } .qa-q { font-size: 15px; } .qa > b { font-size: 17px; } .qa-cat i { width: 54px; height: 70px; } .qa-cat i:nth-child(2) { height: 84px; } .qa-price { width: 76%; } .qa-wa { font-size: 15px; padding: 11px 18px 11px 13px; } .qa-wa svg { width: 19px; height: 19px; } }

/* ==== 13 oct 2026 (8va): web en teléfono, auditoría Google, partner ==== */
/* Web: la web en un teléfono y las preguntas alrededor */
.qs-stage { max-width: 1060px; margin: 16px auto 0; display: grid; grid-template-columns: minmax(0, 1fr) 260px minmax(0, 1fr); gap: 0 28px; }
.qs-col { position: relative; }
.qs { position: absolute; top: var(--t); display: flex; flex-direction: column; gap: 8px; }
.qs-col.l .qs { right: 0; align-items: flex-end; }
.qs-col.r .qs { left: 0; align-items: flex-start; }
.qs-q { position: relative; padding: 11px 17px; border-radius: 20px; background: #fff; font-size: 17px; line-height: 1.25; color: #111; box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 16px 30px -20px rgba(17,17,17,.3); white-space: nowrap; }
.qs-col.l .qs-q { border-bottom-right-radius: 6px; }
.qs-col.r .qs-q { border-bottom-left-radius: 6px; }
.qs-q::after { content: ""; position: absolute; top: 50%; width: 22px; border-top: 1.5px dashed #C7C7CC; }
.qs-col.l .qs-q::after { left: 100%; margin-left: 6px; }
.qs-col.r .qs-q::after { right: 100%; margin-right: 6px; }
.qs-a { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 500; color: #0A84FF; padding: 0 6px; }
.qs-a i { width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; background: #0A84FF; color: #fff; }
.qs-a i svg { width: 9px; height: 9px; }
.qs-phone .scr { padding: 0 12px 12px; gap: 0; background: #fff; }
.qp-nav { display: flex; align-items: center; gap: 8px; padding: 18px 2px 12px; }
.qp-nav i { width: 18px; height: 18px; border-radius: 6px; background: #111; }
.qp-nav b { flex: 1; font-size: 12.5px; font-weight: 600; color: #111; }
.qp-nav span { display: flex; flex-direction: column; gap: 3px; }
.qp-nav em { width: 14px; height: 2px; border-radius: 1px; background: #111; }
.qp-hero { height: 112px; border-radius: 14px; background: center / cover; display: flex; flex-direction: column; justify-content: flex-end; padding: 12px; gap: 5px; position: relative; overflow: hidden; }
.qp-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.55)); }
.qp-hero b { position: relative; height: 7px; width: 70%; border-radius: 4px; background: #fff; }
.qp-hero b.s { width: 45%; opacity: .7; }
.qp-lbl { display: block; margin: 14px 2px 7px; font-size: 10.5px; font-weight: 600; color: #111; }
.qp-cat { display: flex; gap: 6px; }
.qp-cat i { flex: 1; height: 58px; border-radius: 10px; background: center / cover; }
.qp-price { display: flex; flex-direction: column; gap: 5px; }
.qp-price span { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 10px; background: #F5F5F7; }
.qp-price i { flex: 1; height: 5px; border-radius: 3px; background: #D5D7DC; }
.qp-price i.s { flex: .7; }
.qp-price b { margin-left: auto; font-size: 11px; font-weight: 600; color: #111; }
.qp-map { position: relative; margin-top: 12px; height: 74px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; }
.qp-map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.qp-map .qa-pin { width: 20px; height: 20px; border-width: 2.5px; }
.qp-wa { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px 9px 11px; border-radius: 99px; background: #25D366; color: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap; box-shadow: 0 10px 20px -10px rgba(20,140,60,.7); }
.qp-wa svg { width: 16px; height: 16px; }
@media (max-width: 860px) {
  .qs-stage { grid-template-columns: 1fr; max-width: 360px; gap: 0; justify-items: center; }
  .qs-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; }
  .qs-col.l { order: 1; margin-bottom: 28px; } .qs-phone { order: 2; } .qs-col.r { order: 3; margin-top: 28px; }
  .qs, .qs-col.l .qs, .qs-col.r .qs { position: static; align-items: center; }
  .qs-q, .qs-col.l .qs-q, .qs-col.r .qs-q { font-size: 15px; padding: 10px 14px; border-radius: 18px; }
  .qs-q::after { display: none; }
}

/* Ads & SEO: auditoría como resultado de Google, antes y después */
.au-g { padding: 14px 16px 0; background: #F5F5F7 !important; text-align: left; display: flex; flex-direction: column; gap: 0; }
.au-g > span { display: block; }
.ag-q { display: flex !important; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 99px; background: #fff; font-size: 12px; color: #111; box-shadow: 0 1px 2px rgba(17,17,17,.06); }
.ag-q svg { width: 12px; height: 12px; color: #86868B; }
.ag-site { display: flex !important; align-items: center; gap: 6px; margin-top: 11px; font-size: 10.5px; color: #5F6368; }
.ag-site i { width: 14px; height: 14px; border-radius: 50%; background: #111; box-shadow: inset 0 0 0 4px #111, inset 0 0 0 7px #C1EA50; }
.ag-old { margin-top: 5px; font-size: 13px; color: #A1A1A6; text-decoration: line-through; text-decoration-color: #FF9F0A; text-decoration-thickness: 2px; }
.ag-new { margin-top: 2px; font-size: 15px; font-weight: 500; color: #1A55B8; letter-spacing: -.01em; }
.ag-l { height: 6px; width: 70%; margin-top: 7px; border-radius: 3px; background: #DADCE0; }

/* Partner: sistema con más aire y las herramientas aparte */
#sistema .sv-head { margin-bottom: 64px; }
#sistema .sv-head p { max-width: 560px; margin-inline: auto; }
.sis-more { max-width: 660px; margin: 72px auto 0; text-align: center; font-size: 19px; line-height: 1.6; color: rgba(255,255,255,.62); }
.sis-more strong { display: block; margin-bottom: 8px; font-size: 24px; font-weight: 500; letter-spacing: -.02em; color: #fff; }
@media (max-width: 640px) { #sistema .sv-head { margin-bottom: 40px; } .sis-more { margin-top: 52px; font-size: 16.5px; } .sis-more strong { font-size: 21px; } }

/* Partner: grosores. Título en 400 con la palabra de color en 500; subtítulos en 300 */
#por-que .sv-head h2, #tu-mes .sv-head h2 { font-weight: 400; }
#por-que .sv-head h2 .grad-anim, #tu-mes .sv-head h2 .grad-anim { font-weight: 500; }
#por-que .why3 h3, .sx-four .sv-card h3 { font-weight: 300; }

/* Partner: pasos sin números ni etiquetas */
.sx-four .sv-canvas { padding-top: 0; height: 230px; }
.s7-path span { justify-content: flex-start; }
.ax.mini.s7-cal { flex-direction: row !important; align-items: center !important; gap: 14px; }
.s7-rep { width: 200px; max-width: 200px !important; display: flex; flex-direction: column; align-items: stretch !important; gap: 18px; text-align: left; }
.s7-rep .rb small { display: block; font-size: 12.5px; font-weight: 500; color: var(--text-dim); }
.s7-rep .rb i { display: block; margin-top: 8px; height: 12px; border-radius: 6px; width: var(--w); background: #D6DAE0; }
.s7-rep .rb.now small { color: var(--text); font-weight: 600; }
.s7-rep .rb.now i { background: linear-gradient(90deg, #A6D13A, #C1EA50); }

/* Partner: promesa con gráfico de meta, mismo ancho que las tarjetas */
.pr { max-width: 1240px; margin: 72px auto 0; padding: 48px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; text-align: left; }
.pr-h { font-weight: 400; }
.pr-h .grad-anim { font-weight: 500; }
.pr-sub { margin: 14px 0 0; max-width: 440px; }
.pr-list { margin-top: 30px; display: flex; flex-direction: column; }
.pr-list > div { padding: 16px 0; border-top: 1px solid var(--border); }
.pr-list > div:last-child { border-bottom: 1px solid var(--border); }
.pr-list b { display: block; margin-top: 6px; font-size: 21px; font-weight: 500; letter-spacing: -.02em; color: var(--text); }
.pr-list p { margin-top: 4px; font-size: 15px; line-height: 1.5; color: var(--text-dim); }
.pr-cta { margin-top: 30px; }
.pr-viz { position: relative; padding: 24px 24px 20px; border-radius: 26px; background: #F5F5F7; }
.pv-h { display: flex; align-items: center; justify-content: space-between; }
.pv-h b { font-size: 17px; font-weight: 600; color: var(--text); }
.pv-h span { padding: 5px 12px; border-radius: 99px; background: #111; color: var(--accent-lime); font-size: 13px; font-weight: 600; }
.pr-viz svg { display: block; width: 100%; height: auto; margin-top: 18px; overflow: visible; }
.pv-goal, .pv-now { position: absolute; font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 99px; }
.pv-goal { left: 24px; top: 74px; background: rgba(193,234,80,.28); color: #4E6B0E; }
.pv-now { left: 24px; bottom: 98px; background: #fff; color: var(--text); box-shadow: 0 1px 2px rgba(17,17,17,.08); }
.pv-x { display: flex; justify-content: space-between; margin-top: 10px; font-size: 12px; color: var(--text-faint, #8a8a8e); }
@media (max-width: 960px) { .pr { grid-template-columns: 1fr; gap: 36px; max-width: 760px; } }
@media (max-width: 760px) {
  .pr { padding: 32px 20px 24px; }
  .pr-grid { display: none; }
  .pr-viz { padding: 18px 16px 16px; border-radius: 20px; }
  .pv-goal { left: 16px; top: 62px; } .pv-now { left: 16px; bottom: 74px; }
}
.ag-q svg { position: static !important; inset: auto !important; width: 12px !important; height: 12px !important; flex: none; }
.pr-h span { color: inherit; }
.pv-now { bottom: 104px; left: 34px; }
.s7-cal .mo-cal, .s7-cal .mo-tiles { flex: none; }
.ax.mini.s7-cal { max-width: none !important; width: auto; zoom: .92; }
.pr-h .grad-anim { color: transparent; }
.ax.mini.s7-cal { zoom: .8; }
.ax.mini.s7-rep { text-align: left !important; align-items: stretch !important; }
.s7-rep .rb { display: block; width: 100%; text-align: left; }
@media (max-width: 400px) { .qs-col { gap: 8px; } .qs-q, .qs-col.l .qs-q, .qs-col.r .qs-q { font-size: 14px; padding: 9px 12px; } .qs-a { font-size: 12.5px; } }

/* ===== 13 oct 2026 (9na) ===== */
/* Auditoría: lista simple con un problema común */
.au-list { padding: 16px !important; background: #F5F5F7 !important; display: flex !important; flex-direction: column; gap: 8px; text-align: left; height: auto !important; }
.au-list .al-r { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border-radius: 14px; background: #fff; font-size: 14px; color: #111; box-shadow: 0 1px 2px rgba(17,17,17,.05); }
.au-list .al-r i { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #34C759; color: #fff; }
.au-list .al-r.bad i { background: #FF9F0A; }
.au-list .al-r.bad { font-weight: 500; }
.au-list svg { position: static !important; inset: auto !important; width: 12px !important; height: 12px !important; }

/* Partner: herramientas debajo de Por qué funciona mejor */
.wt { max-width: 1240px; margin: 88px auto 0; padding: 36px 40px; border-radius: 28px; background: #F5F5F7; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 2fr); gap: 40px; align-items: center; text-align: left; }
.wt-txt b { display: block; font-size: clamp(22px, 2.2vw, 26px); font-weight: 500; letter-spacing: -.025em; line-height: 1.2; color: #111; }
.wt-txt p { margin-top: 8px; font-size: 16px; line-height: 1.5; color: var(--text-dim); }
.wt-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.wt-items span { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 20px; background: #fff; font-size: 15.5px; font-weight: 500; line-height: 1.3; letter-spacing: -.01em; color: #111; }
.wt-items i { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; background: var(--c); color: #fff; }
.wt-items svg { width: 19px; height: 19px; }
@media (max-width: 960px) { .wt { grid-template-columns: 1fr; gap: 24px; padding: 28px 22px; } }
@media (max-width: 640px) { .wt { margin-top: 64px; } .wt-items { grid-template-columns: 1fr; gap: 10px; } .wt-items span { flex-direction: row; align-items: center; padding: 14px 16px; } }

/* Partner: promesa en texto + un solo precio */
.pz { max-width: 1240px; margin: 96px auto 0; text-align: center; }
.pz-h { font-size: clamp(30px, 3.6vw, 46px); font-weight: 400; letter-spacing: -.035em; line-height: 1.12; color: var(--text); }
.pz-h .grad-anim { font-weight: 500; color: transparent; }
.pz-sub { margin: 14px auto 0; max-width: 560px; font-size: 17px; line-height: 1.55; color: var(--text-dim); }
.pz-card { margin: 48px auto 0; max-width: 900px; padding: 64px 40px 56px; border-radius: 36px; background: #1D1D1F; color: #fff; box-shadow: 0 40px 80px -50px rgba(17,17,17,.6); }
.pz-t { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.02em; }
.pz-d { margin-top: 6px; font-size: 16px; color: #A1A1A6; }
.pz-price { margin-top: 36px; display: flex; justify-content: center; align-items: flex-start; gap: 12px; }
.pz-price span { margin-top: 18px; font-size: 20px; color: #86868B; }
.pz-price b { font-size: clamp(64px, 9vw, 96px); font-weight: 600; letter-spacing: -.05em; line-height: 1; background: linear-gradient(120deg, #9BCB2C, #C1EA50 55%, #DDF59A); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pz-note { display: block; margin-top: 12px; font-size: 13px; color: #86868B; }
.pz-list { margin: 36px auto 0; max-width: 780px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; list-style: none; padding: 0; }
.pz-list li { display: flex; align-items: center; gap: 8px; font-size: 16px; color: #F5F5F7; }
.pz-list svg { width: 15px; height: 15px; color: #C1EA50; }
.pz-btn { margin-top: 44px; display: inline-flex; align-items: center; gap: 10px; padding: 16px 30px; border-radius: 99px; background: #fff; color: #111; font-size: 16px; font-weight: 500; text-decoration: none; transition: transform .2s; }
.pz-btn:hover { transform: scale(1.03); }
.pz-btn svg { width: 16px; height: 16px; }
@media (max-width: 640px) { .pz { margin-top: 72px; } .pz-card { padding: 44px 22px 40px; border-radius: 28px; } .pz-price span { font-size: 16px; margin-top: 12px; } .pz-list { justify-content: flex-start; flex-direction: column; align-items: flex-start; max-width: 220px; gap: 12px; } }
.pz-price span { white-space: nowrap; }
@media (max-width: 640px) { .pz-price { gap: 8px; } .pz-price b { font-size: 56px; } .pz-price span { font-size: 15px; margin-top: 10px; } }

/* ===== 13 oct 2026 (10ma) ===== */
/* SEO local: el ícono del pin no debe heredar el svg absoluto del mapa */
.seo-map .pin .head svg { position: static !important; inset: auto !important; width: 15px !important; height: 15px !important; }

/* Auditoría: puntaje de hoy y con los ajustes */
.au-score { height: 150px; background: #F5F5F7 !important; display: flex !important; align-items: center; justify-content: center; gap: 22px; }
.au-score .as-r { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.au-score .as-ring { position: relative; width: 84px; height: 84px; display: grid; place-items: center; }
.au-score .as-ring svg { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; }
.au-score .as-ring b { position: relative; font-size: 26px; font-weight: 600; letter-spacing: -.03em; color: #111; }
.au-score small { font-size: 12px; color: #6E6E73; }
.au-score .as-arrow { margin-bottom: 22px; color: #A1A1A6; }
.au-score .as-arrow svg { position: static !important; width: 20px !important; height: 20px !important; }

/* Partner: herramientas como una frase */
.wt2 { max-width: 920px; margin: 104px auto 0; padding-top: 48px; border-top: 1px solid var(--border); text-align: center; font-size: clamp(24px, 2.8vw, 36px); font-weight: 300; line-height: 1.3; letter-spacing: -.03em; color: #86868B; }
.wt2 > span { color: #111; font-weight: 400; }
.wt2 .grad-anim { font-weight: 500; color: transparent; }
@media (max-width: 640px) { .wt2 { margin-top: 72px; padding-top: 36px; } }

/* Partner: un solo plan sobre el cielo */
#to-precios .plan-cta { padding: 128px 0 120px; }
#to-precios .pc-head p { max-width: 560px; margin-left: auto; margin-right: auto; }
.one-plan { margin: 56px auto 0; max-width: 640px; padding: 52px 40px 48px; border-radius: 36px; text-align: center; color: #fff;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.38); -webkit-backdrop-filter: blur(22px) saturate(1.3); backdrop-filter: blur(22px) saturate(1.3); box-shadow: 0 40px 80px -50px rgba(6,20,40,.6); }
.op-tag { display: inline-block; padding: 7px 16px; border-radius: 99px; background: #C1EA50; color: #111; font-size: 13px; font-weight: 600; }
.op-from { display: block; margin-top: 28px; font-size: 18px; color: rgba(255,255,255,.85); }
.op-price { margin-top: 6px; display: flex; justify-content: center; align-items: baseline; gap: 10px; }
.op-price b { font-size: clamp(64px, 9vw, 104px); font-weight: 600; letter-spacing: -.05em; line-height: 1; }
.op-price span { font-size: 20px; color: rgba(255,255,255,.8); }
.op-d { margin-top: 16px; font-size: 18px; line-height: 1.45; color: #fff; }
.op-chips { margin-top: 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.op-chips span { display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border-radius: 99px; background: rgba(255,255,255,.18); font-size: 14.5px; }
.op-chips svg { width: 13px; height: 13px; color: #C1EA50; }
.op-btn { margin-top: 36px; display: inline-flex; align-items: center; gap: 10px; padding: 16px 32px; border-radius: 99px; background: #fff; color: #111; font-size: 16px; font-weight: 500; text-decoration: none; transition: transform .2s; }
.op-btn:hover { transform: scale(1.03); }
.op-btn svg { width: 16px; height: 16px; }
@media (max-width: 640px) { #to-precios .plan-cta { padding: 72px 0 48px; } .one-plan { margin-top: 36px; padding: 36px 20px 32px; border-radius: 28px; } .op-price span { font-size: 16px; } .op-d { font-size: 16px; } .op-chips span { font-size: 13.5px; } }
.seo-map .pin .head svg { display: none; }
.seo-map .pin .head::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #fff; }
#to-precios .pc-bgword { display: none; }
.sv-fc-btn { white-space: nowrap; justify-content: center; text-align: center; }
/* 13 oct 2026 (11va): tarjetas de SEO sin espacio sobrante ni sombra */
#seo .ax.seo-map { min-height: 0 !important; box-shadow: none !important; border: 1px solid #E8E8ED; }

/* ===== 13 oct 2026 (12va) ===== */
/* Franja negra de mejora continua: dos líneas */
#mejora { padding: 120px 0; }
.mj-t { max-width: 1100px; margin: 0 auto; text-align: center; font-size: clamp(26px, 3.3vw, 46px); line-height: 1.22; letter-spacing: -.035em; }
.mj-t > span { display: block; }
.mj-t > span:first-child { font-weight: 300; color: #86868B; }
.mj-t > span:last-child { font-weight: 400; color: #fff; }
.mj-t .grad-anim { font-weight: 500; color: transparent; }
@media (max-width: 640px) { #mejora { padding: 80px 0; } .mj-t > span:last-child { margin-top: 10px; } }

/* Plan único: precio centrado con "Desde" y "al mes" a los lados, pesos parejos */
.op-tag { font-weight: 500; }
.op-from { font-size: 15px; font-weight: 500; letter-spacing: .02em; color: #C1EA50; }
.op-price { align-items: center; gap: 14px; margin-top: 10px; }
.op-price span { width: 72px; font-size: 18px; font-weight: 400; color: rgba(255,255,255,.8); }
.op-price span:first-child { text-align: right; }
.op-price span:last-child { text-align: left; }
.op-price b { font-weight: 500; }
.op-d { max-width: 440px; margin-left: auto; margin-right: auto; font-weight: 400; }
.op-chips span { font-weight: 400; }
@media (max-width: 640px) { .op-price { gap: 8px; } .op-price span { width: 48px; font-size: 15px; } .op-price b { font-size: 56px; } }
@media (min-width: 900px) { .mj-t > span { white-space: nowrap; } }
.op-from { color: #fff; font-size: 16px; letter-spacing: 0; }
#to-precios .pc-head p { max-width: none; white-space: normal; text-align: center; }

/* ===== 13 oct 2026 (13va) ===== */
.mj-t { font-size: clamp(22px, 2.5vw, 34px); max-width: 980px; }
.mj-t > span:first-child { font-weight: 300; color: #fff; }
.mj-t > span:last-child { font-weight: 400; color: #fff; margin-top: 4px; }
/* precio apilado y centrado */
.op-t { display: block; margin-top: 26px; font-size: 24px; font-weight: 500; letter-spacing: -.02em; color: #fff; }
.op-price { margin-top: 26px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.op-price small { font-size: 16px; font-weight: 400; color: rgba(255,255,255,.85); }
.op-price b { font-size: clamp(64px, 8vw, 96px); font-weight: 500; line-height: 1; letter-spacing: -.05em; }
.op-d { margin-top: 22px; }
.op-ben { margin: 28px auto 0; max-width: 520px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.op-ben span { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.18); font-size: 14.5px; font-weight: 400; line-height: 1.25; color: #fff; text-align: center; }
.op-ben svg { flex: none; width: 13px; height: 13px; color: #C1EA50; }
@media (max-width: 640px) { .op-ben { grid-template-columns: 1fr; max-width: 280px; } .op-price b { font-size: 60px; } .op-t { font-size: 21px; } }
/* 13 oct 2026 (14va): jerarquía clara en la franja de mejora */
.mj-t > span:first-child { font-size: clamp(28px, 3.3vw, 46px); font-weight: 500; letter-spacing: -.035em; line-height: 1.12; color: #fff; }
.mj-t > span:last-child { margin-top: 16px; font-size: clamp(18px, 1.8vw, 24px); font-weight: 300; letter-spacing: -.015em; line-height: 1.4; color: #fff; }
.mj-t > span:last-child .grad-anim { font-weight: 500; }
.u3-ok .seal { background: #0A84FF !important; box-shadow: none !important; } /* 13 oct 2026: color sólido */
/* 13 oct 2026 (15va): Partner CREVO como texto verde, sin recuadro */
.op-tag { padding: 0; background: none; color: #C1EA50; font-size: 15px; font-weight: 600; letter-spacing: .01em; text-shadow: 0 1px 10px rgba(6,30,60,.35); }
.op-t { margin-top: 10px; font-size: 28px; }
.mj-t { max-width: 900px; }
.mj-t > span:last-child { white-space: normal !important; max-width: 720px; margin-left: auto; margin-right: auto; text-wrap: balance; }

/* ===== 13 oct 2026 (16va): SEO que se entiende ===== */
.sx-g, .sx-maps { height: 170px; padding: 14px 16px !important; background: #F5F5F7 !important; display: flex !important; flex-direction: column; gap: 10px; text-align: left; }
.sx-q { display: flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 99px; background: #fff; font-size: 12.5px; color: #111; box-shadow: 0 1px 2px rgba(17,17,17,.06); }
.sx-q svg { position: static !important; inset: auto !important; width: 12px !important; height: 12px !important; color: #86868B; flex: none; }
.sx-row { flex: 1; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.sx-c { padding: 12px 10px; border-radius: 14px; background: #fff; text-align: center; display: flex; flex-direction: column; gap: 3px; }
.sx-c small { font-size: 11px; color: #86868B; }
.sx-c b { font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.sx-c em { font-style: normal; font-size: 11px; font-weight: 500; }
.sx-c.bad b, .sx-c.bad em { color: #E07A00; }
.sx-c.ok b, .sx-c.ok em { color: #248A3D; }
.sx-arw { color: #A1A1A6; }
.sx-arw svg { position: static !important; width: 16px !important; height: 16px !important; }
.sx-pl { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: #fff; }
.sx-pl i { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 600; background: #E5E5EA; color: #86868B; }
.sx-pl.me { box-shadow: inset 0 0 0 2px #34C759; }
.sx-pl.me i { background: #34C759; color: #fff; }
.sx-pl > div { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sx-pl b { font-size: 14px; font-weight: 600; color: #111; }
.sx-pl .st { display: flex; align-items: center; gap: 4px; font-size: 11.5px; color: #6E6E73; }
.sx-pl .st svg { position: static !important; width: 11px !important; height: 11px !important; color: #FF9F0A; }
.sx-pl .ln { display: block; height: 7px; width: 55%; border-radius: 4px; background: #E5E5EA; }
.sx-pl .ln.s { width: 35%; }
.sx-pl:not(.me) { opacity: .7; }

/* ===== 13 oct 2026 (17va) ===== */
/* Franja de mejora: "resolvemos" en lima y la IA en azul, los dos animados */
.mj-t > span:first-child .grad-anim { font-weight: 500; color: transparent; }
.grad-blue { display: inline-block; padding-right: .06em; margin-right: -.06em; font-weight: 500; background: linear-gradient(100deg, #0A84FF, #4FB2FF, #8FD0FF, #4FB2FF, #0A84FF); background-size: 230% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: gradSoft 4.5s ease-in-out infinite alternate; }

/* Web: responsive liviano en tres tarjetas */
#responsive .rw3 { max-width: 1160px; margin-top: 8px; }
#responsive .u3 { box-shadow: 0 1px 2px rgba(17,17,17,.03), 0 30px 60px -44px rgba(17,17,17,.35); }
.dv { position: relative; display: block; background: #111; box-shadow: 0 20px 30px -22px rgba(17,17,17,.5); }
.dv .scr { position: absolute; overflow: hidden; background: #fff; display: flex; flex-direction: column; gap: 5px; padding: 6px; }
.dv.lap { width: 230px; height: 146px; border-radius: 10px 10px 4px 4px; margin-bottom: 8px; }
.dv.lap .scr { inset: 6px 6px 8px; border-radius: 4px; }
.dv.lap .kb { position: absolute; left: -16px; right: -16px; bottom: -8px; height: 8px; border-radius: 0 0 10px 10px; background: linear-gradient(#D9D9DE, #B8B8BE); }
.dv.tab { width: 128px; height: 166px; border-radius: 16px; }
.dv.tab .scr { inset: 6px; border-radius: 11px; }
.dv.ph { width: 84px; height: 170px; border-radius: 18px; }
.dv.ph .scr { inset: 4px; border-radius: 15px; padding: 10px 5px 5px; }
.ms-nav { display: flex; align-items: center; justify-content: space-between; height: 9px; }
.ms-nav i { width: 22px; height: 5px; border-radius: 3px; background: #111; }
.ms-nav b { width: 18px; height: 8px; border-radius: 99px; background: #0A84FF; }
.ms-hero { flex: none; height: 52px; border-radius: 6px; background-size: cover; background-position: center; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 0 8px; }
.ms-hero em { display: block; width: 60%; height: 5px; border-radius: 3px; background: #fff; }
.ms-hero em.s { width: 40%; }
.ms-hero u { display: block; width: 22px; height: 7px; margin-top: 2px; border-radius: 99px; background: #0A84FF; }
.ms-tiles { flex: 1; display: grid; gap: 5px; }
.ms-tiles i { border-radius: 5px; background-size: cover; background-position: center; min-height: 28px; }
.lap .ms-tiles { grid-template-columns: repeat(3, 1fr); }
.tab .ms-hero { height: 62px; }
.tab .ms-tiles { grid-template-columns: repeat(2, 1fr); }
.ph .ms-hero { height: 70px; align-items: center; padding: 0 5px; }
.ph .ms-hero em { width: 80%; }
.ph .ms-hero em.s { width: 55%; }
.ph .ms-nav b { width: 9px; height: 7px; border-radius: 2px; background: none; border-top: 2px solid #111; border-bottom: 2px solid #111; }

/* 13 oct 2026 (18va): la fuente solo llega a 600; nada de negrita 700 sintética */
b, strong { font-weight: 600; }
.sv-head p strong { font-weight: 500; color: var(--text); }
.sv-dark .sv-head p strong { color: #fff; }
.mobile-panel a, .fb-bar b, .pc-badge, .evt-shop .poster b, .tk-l b, .tk, .pay-bg b, .ap-sum b, .lv-tile b.big, .lv-tile b.big span, .cols .col.now span, .mo-cal span, symbol text { font-weight: 600 !important; }

/* ===== 13 oct 2026 (23va): responsive con aparatos tipo Apple y un punto corto ===== */
#responsive .u3 { padding-bottom: 22px; }
.rw-pt { margin: 18px auto 0 !important; display: inline-flex; align-items: center; gap: 8px; font-size: 16px !important; font-weight: 500; color: var(--text) !important; }
.rw-pt::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #9BCB2C; }
.dv2 .scr, .rw-ph .screen { overflow: hidden; background: #fff; display: flex; flex-direction: column; gap: 5px; padding: 7px 6px 6px; }
/* MacBook: bisel fino con notch y base de aluminio */
.dv2.mac { display: flex; flex-direction: column; align-items: center; }
.dv2.mac .lid { position: relative; width: 236px; height: 150px; padding: 5px 5px 7px; border-radius: 11px 11px 3px 3px; background: #111; box-shadow: inset 0 0 0 1px #2B2B2E; }
.dv2.mac .scr { width: 100%; height: 100%; border-radius: 5px 5px 1px 1px; padding-top: 10px; }
.dv2.mac .notch { position: absolute; left: 50%; top: 4px; width: 30px; height: 7px; margin-left: -15px; border-radius: 0 0 4px 4px; background: #111; }
.dv2.mac .base { position: relative; width: 272px; height: 7px; border-radius: 1px 1px 8px 8px; background: linear-gradient(#E3E4E6, #BFC0C4); box-shadow: 0 10px 18px -12px rgba(17,17,17,.5); }
.dv2.mac .base i { position: absolute; left: 50%; top: 0; width: 40px; height: 3px; margin-left: -20px; border-radius: 0 0 4px 4px; background: #A9AAAE; }
/* iPad: bisel fino y parejo, sin cámara */
.dv2.pad { display: block; width: 132px; height: 170px; padding: 5px; border-radius: 15px; background: #111; box-shadow: inset 0 0 0 1px #2B2B2E, 0 20px 30px -22px rgba(17,17,17,.5); }
.dv2.pad .scr { width: 100%; height: 100%; border-radius: 10px; }
/* iPhone: el mismo .sv-phone de Social Media, en chico */
.rw-ph.sv-phone { width: 90px; height: 184px; border-radius: 15px; padding: 2.5px; display: block; box-shadow: 0 20px 30px -22px rgba(17,17,17,.5); }
.rw-ph .screen { width: 100%; height: 100%; border-radius: 12.5px; padding-top: 12px; }
.rw-ph i.btn.vol1 { top: 40px; height: 10px; } .rw-ph i.btn.vol2 { top: 55px; height: 10px; } .rw-ph i.btn.pwr { top: 50px; height: 16px; }
.dv2 .ms-tiles i, .rw-ph .ms-tiles i { min-height: 26px; }
.mac .ms-tiles { grid-template-columns: repeat(3, 1fr); }
.pad .ms-hero { height: 62px; } .pad .ms-tiles { grid-template-columns: repeat(2, 1fr); }
.rw-ph .ms-hero { height: 74px; align-items: center; padding: 0 5px; }
.rw-ph .ms-hero em { width: 80%; } .rw-ph .ms-hero em.s { width: 55%; }
.rw-ph .ms-nav b { width: 9px; height: 7px; border-radius: 2px; background: none; border-top: 2px solid #111; border-bottom: 2px solid #111; }
#responsive .rw-ph .screen { position: absolute !important; inset: 2.5px !important; width: auto !important; height: auto !important; transform: none !important; margin: 0 !important; }
#responsive .rw-ph { position: relative !important; overflow: visible; }
#responsive .u3 p.rw-pt { color: #111 !important; font-weight: 500; }
/* 13 oct 2026 (23va): SEO más simple */
.sx-c { padding: 14px 10px; gap: 4px; }
.sx-c b { font-size: 22px; }
.sx-maps { justify-content: flex-start; }
.sx-maps .sx-pl.me { padding: 14px; }
.sx-pl b { font-size: 15px; }
.sx-maps .sx-pl.me { margin: auto 0; }
@media (max-width: 400px) { .dv2.mac { zoom: .86; } }

/* 14 oct 2026: precios reales de Web y nota de mantenimiento debajo de los planes */
.pc-note { max-width: 640px; margin: 28px auto 0; text-align: center; font-size: 15px; line-height: 1.55; font-weight: 400; color: rgba(255,255,255,.9); text-shadow: 0 1px 14px rgba(12,40,70,.25); }
@media (max-width: 760px) { .pc-note { font-size: 14px; padding: 0 8px; } }
.pc-price span { white-space: nowrap; }
.pc-price.from { position: relative; }
.pc-price.from .pc-from { position: absolute; left: 0; top: -19px; font-size: 13px; }
@media (max-width: 760px) { .pc-price.from { margin-top: 36px; } }

/* 14 oct 2026: precios reales de Ads & SEO, línea de comisión bajo el precio */
.pc-card .pc-alt { margin-top: 8px; font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.8); }
#ads-precios .pc-card .pc-sub { white-space: normal; overflow: visible; text-overflow: clip; }
@media (min-width: 761px) { #ads-precios .pc-card .pc-sub { min-height: 42px; } }

/* 14 oct 2026: nota de mantenimiento de Web como burbuja de vidrio, fina y en una línea */
#web-precios .pc-note { display: table; max-width: none; margin: 30px auto 0; padding: 9px 20px; border-radius: 999px; font-size: 14px; font-weight: 300; line-height: 1.4; white-space: nowrap; color: #fff; text-shadow: none; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.32); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 24px -12px rgba(12,40,70,.35); }
@media (max-width: 760px) { #web-precios .pc-note { white-space: normal; max-width: calc(100% - 16px); padding: 10px 18px; border-radius: 20px; font-size: 13px; text-align: center; } }
@media (max-width: 760px) { #web-precios .pc-note { text-wrap: balance; padding: 10px 16px; max-width: 320px; } }
@media (max-width: 374px) { #web-precios .pc-note { font-size: 12.5px; padding: 9px 12px; max-width: 300px; } }
@media (max-width: 374px) { #web-precios .pc-note { max-width: calc(100% - 8px); } }
/* 14 oct 2026: Ads & SEO sin descriptivo bajo el nombre del plan */
#ads-precios .pc-card .pc-price { margin-top: 18px; }
#ads-precios .pc-card .pc-btn { margin-top: 24px; }
#ads-precios .pc-card ul { flex: 0 0 auto; margin-bottom: 24px; }
#ads-precios .pc-card .pc-btn { margin-top: auto; }
/* 14 oct 2026: precios reales de Eventos, botones alineados al fondo */
#evt-precios .pc-card ul { flex: 0 0 auto; margin-bottom: 24px; }
#evt-precios .pc-card .pc-btn { margin-top: auto; }
/* 14 oct 2026: nota de pasarela en Eventos, misma burbuja de vidrio que Web */
#evt-precios .pc-note { display: table; max-width: none; margin: 30px auto 0; padding: 9px 20px; border-radius: 999px; font-size: 14px; font-weight: 300; line-height: 1.4; white-space: nowrap; color: #fff; text-shadow: none; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.32); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 24px -12px rgba(12,40,70,.35); }
@media (max-width: 760px) { #evt-precios .pc-note { white-space: normal; text-wrap: balance; max-width: calc(100% - 8px); padding: 10px 16px; border-radius: 20px; font-size: 13px; text-align: center; } }

/* 14 oct 2026: Web, encabezado de cada plan centrado y "pago único" debajo del precio */
#web-precios .pc-card h3, #web-precios .pc-card .pc-sub { text-align: center; }
#web-precios .pc-card .pc-sub { white-space: normal; overflow: visible; }
#web-precios .pc-price { flex-direction: column; align-items: center; gap: 6px; margin-top: 22px; }
#web-precios .pc-price span { font-size: 14px; }
#web-precios .pc-card ul { flex: 0 0 auto; margin-bottom: 24px; }
#web-precios .pc-card .pc-btn { margin-top: auto; }

/* 14 oct 2026: mismo encabezado centrado en Ads & SEO y Eventos */
#ads-precios .pc-card h3, #evt-precios .pc-card h3, #evt-precios .pc-card .pc-sub { text-align: center; }
#evt-precios .pc-card .pc-sub { white-space: normal; overflow: visible; }
#ads-precios .pc-price, #evt-precios .pc-price { flex-direction: column; align-items: center; gap: 6px; margin-top: 22px; }
#ads-precios .pc-card .pc-alt, #evt-precios .pc-card .pc-alt { text-align: center; text-wrap: balance; margin-top: 6px; }
/* 14 oct 2026: Eventos, "+10% de tus ventas" como burbuja de vidrio bajo el precio */
#evt-precios .pc-card .pc-plus { display: inline-flex; align-self: center; align-items: baseline; gap: 5px; margin-top: 12px; padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 300; line-height: 1.3; color: #fff; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); box-shadow: inset 0 1px 0 rgba(255,255,255,.3); }
#evt-precios .pc-card .pc-plus b { font-size: 14px; font-weight: 600; letter-spacing: -.01em; }
#evt-precios .pc-card.rec .pc-plus b { color: #C1EA50; }
#evt-precios .pc-card.rec .pc-plus b { color: #fff; }
#evt-precios .pc-card .pc-plus { gap: 4px; }

/* 14 oct 2026: Web Pro vuelve a "Desde", pequeño y centrado sobre el precio sin mover la tarjeta */
#web-precios .pc-price.from { position: relative; }
#web-precios .pc-price.from .pc-from { position: absolute; top: -18px; left: 50%; transform: translateX(-50%); font-size: 13px; font-weight: 400; color: rgba(255,255,255,.8); white-space: nowrap; }
@media (max-width: 760px) { #web-precios .pc-price.from { margin-top: 36px; } }
@media (min-width: 761px) { #web-precios .pc-price.from { margin-top: 34px; } #web-precios .pc-price.from .pc-from { top: -20px; } }
#ads-precios .pc-card .pc-alt strong { font-weight: 600; color: #fff; }
/* 14 oct 2026: ticket de confirmación sin "TU EVENTO", el VIP centrado y un poco más grande */
.em-tk .tk-l.solo { display: flex; align-items: center; justify-content: center; }
.em-tk .tk-l.solo .tk.vip { margin: 0; font-size: 15px; padding: 7px 18px; }

/* 14 oct 2026: Partner, línea de los 90 días como burbuja de vidrio bajo el precio */
.one-plan .op-90 { display: inline-block; margin: 14px auto 0; padding: 8px 18px; border-radius: 999px; font-size: 14px; font-weight: 400; line-height: 1.4; color: #fff; text-align: center; text-wrap: balance; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); box-shadow: inset 0 1px 0 rgba(255,255,255,.3); }
@media (max-width: 760px) { .one-plan .op-90 { border-radius: 18px; font-size: 13px; padding: 8px 14px; } }
.one-plan .op-d { text-wrap: balance; }
/* 14 oct 2026: Partner, frase de 90 días de corrido y tres beneficios */
.one-plan .op-d { text-wrap: wrap; }
@media (min-width: 641px) { .one-plan .op-d { max-width: none; white-space: nowrap; } }
.op-ben { display: flex; flex-wrap: wrap; justify-content: center; max-width: 560px; }
.op-ben span { flex: 0 1 auto; padding: 12px 18px; }
@media (max-width: 640px) { .op-ben { flex-direction: column; align-items: stretch; max-width: 290px; } }
@media (max-width: 640px) { .op-ben { max-width: 100%; } .op-ben span { padding: 12px 12px; white-space: nowrap; font-size: 14px; } }
.op-btn { white-space: nowrap; } @media (max-width: 374px) { .op-btn { padding-left: 22px; padding-right: 22px; font-size: 15px; } }
.one-plan .op-t { text-wrap: balance; }
@media (max-width: 640px) { .one-plan .op-t { font-size: 21px; line-height: 1.25; } }

/* 14 oct 2026 (revisión general): botón "Cotiza gratis" de Social Media se cortaba a 360 */
@media (max-width: 560px) { .sv-fc-actions { align-self: stretch; } .sv-fc-btn { width: 100%; justify-content: center; padding-left: 18px; padding-right: 18px; box-sizing: border-box; } }
#ads-precios .pc-note { max-width: 680px; text-wrap: balance; }


  /* 14 oct 2026: preguntas frecuentes compactas, acordeón estilo Apple */
  .fq { max-width: 760px; margin: 0 auto; }
  .fq h2 { text-align: center; font-size: clamp(24px, 2.6vw, 32px); font-weight: 500; letter-spacing: -0.025em; line-height: 1.15; color: var(--text, #111); }
  .fq-list { margin-top: 22px; border-top: 1px solid #E8E8ED; }
  .fq-i { border-bottom: 1px solid #E8E8ED; }
  .fq-i summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 2px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.005em; color: var(--text, #111); }
  .fq-i summary::-webkit-details-marker { display: none; }
  .fq-i summary i { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; background: #F5F5F7; transition: background .25s ease; }
  .fq-i summary i::before, .fq-i summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 1.5px; border-radius: 2px; background: #111; transform: translate(-50%, -50%); transition: transform .3s ease; }
  .fq-i summary i::after { transform: translate(-50%, -50%) rotate(90deg); }
  .fq-i summary:hover i { background: #ECECEF; }
  .fq-i[open] summary i, .fq-i[open] summary:hover i { background: #C1EA50; }
  .fq-i[open] summary i::after { transform: translate(-50%, -50%) rotate(0deg); }
  .fq-i p { padding: 0 2px 18px; font-size: 15px; line-height: 1.6; font-weight: 400; color: var(--text-dim, rgba(0,0,0,.56)); }
  @media (max-width: 640px) { .fq-i summary { font-size: 15.5px; padding: 14px 0; } .fq-i p { font-size: 14.5px; padding-bottom: 16px; } }
.fq-wrap { padding-top: 56px; padding-bottom: 8px; }
@media (max-width: 640px) { .fq-wrap { padding-top: 40px; } }

  /* 14 oct 2026 (b): preguntas en panel gris aparte; título como "De dónde viene CREVO" */
  .fq { max-width: 880px; margin: 0 auto; padding: 40px 44px 26px; border-radius: 30px; background: #F5F5F7; }
  .fq h2 { text-align: left; font-size: clamp(21px, 2.3vw, 28px); font-weight: 500; letter-spacing: -0.01em; line-height: 1.3; }
  .fq h2 .grad-anim { font-weight: 500; }
  .fq-list { margin-top: 18px; border-top-color: rgba(0,0,0,.08); }
  .fq-i { border-bottom-color: rgba(0,0,0,.08); }
  .fq-i:last-child { border-bottom: 0; }
  .fq-i summary { font-weight: 400; font-size: 16.5px; }
  .fq-i summary i { background: #fff; }
  .fq-i summary:hover i { background: #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
  @media (max-width: 640px) { .fq { padding: 28px 20px 14px; border-radius: 24px; } .fq-i summary { font-size: 15.5px; } }

/* 14 oct 2026 (d): Ads, inversión incluida al final de cada tarjeta en una línea y nota en burbuja */
#ads-precios .pc-card .pc-inc { order: 6; margin: 14px 0 0; text-align: center; white-space: nowrap; font-size: 12.5px; line-height: 1.3; font-weight: 400; color: rgba(255,255,255,.82); }
#ads-precios .pc-card .pc-inc strong { font-weight: 600; color: #fff; }
#ads-precios .pc-note { display: table; max-width: none; margin: 30px auto 0; padding: 9px 20px; border-radius: 999px; font-size: 14px; font-weight: 300; line-height: 1.4; white-space: nowrap; text-align: center; color: #fff; text-shadow: none; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.32); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 24px -12px rgba(12,40,70,.35); }
@media (max-width: 760px) { #ads-precios .pc-note { white-space: normal; text-wrap: balance; max-width: calc(100% - 8px); padding: 10px 16px; border-radius: 20px; font-size: 13px; } #ads-precios .pc-card .pc-inc { font-size: 13px; } }
#ads-precios .pc-card .pc-inc { display: block; } #ads-precios .pc-card .pc-inc strong { display: inline; }

/* 14 oct 2026 (g): revisión general.
   Las notas en burbuja de los precios bajan a varias líneas antes (en tablet se salían),
   y en Diagnóstico va una pregunta corta encima de los motivos. */
@media (max-width: 900px) {
  #ads-precios .pc-note, #evt-precios .pc-note, #web-precios .pc-note { white-space: normal; text-wrap: balance; max-width: min(620px, calc(100% - 8px)); border-radius: 20px; text-align: center; }
}
.ag-lbl { margin: 0 0 12px; text-align: center; font-size: 15px; font-weight: 500; color: var(--text, #111); }

/* 14 oct 2026 (i): títulos de sección con el mismo tamaño en todas las páginas.
   Social Media tenía 44, 38 y 40px; ahora todos como Web, Ads y Eventos (40px),
   y "Planes a tu medida" al mismo tamaño que "Elige tu sitio" (60px). */
#diseno-grafico .sv-head h2, #manejo-redes .sv-head h2, #social-content .sv-motion-head h2 { font-size: clamp(28px, 3.6vw, 40px); }
#precios .sv-fc-copy h2 { font-size: clamp(36px, 4.6vw, 60px); }
@media (max-width: 760px) { #precios .sv-fc-copy h2 { font-size: 34px; } }

/* 14 oct 2026 (j): corazón de la notificación con forma clásica, un poco más grande. */
.lock .lk-ic.heart svg { width: 20px; height: 20px; }

/* 14 oct 2026 (k): Ads sin "Incluye hasta" en las tarjetas. La nota de abajo
   explica tres cosas, así que va en dos líneas dentro de la burbuja. */
#ads-precios .pc-note { white-space: normal; max-width: 720px; border-radius: 22px; padding: 12px 24px; line-height: 1.55; text-align: center; }
@media (max-width: 760px) { #ads-precios .pc-note br.d { display: none; } }

/* 14 oct 2026 (l): nota de Ads más legible: un poco más grande y con más peso. */
#ads-precios .pc-note { font-size: 15px; font-weight: 400; max-width: 820px; padding: 14px 26px; }
@media (max-width: 760px) { #ads-precios .pc-note { font-size: 14px; padding: 12px 18px; } }
@media (max-width: 760px) { #ads-precios .pc-note { text-wrap: balance; } }
#ads-precios .pc-note { text-wrap: balance; }
/* 14 oct 2026 (m): la nota de Ads ya es corta: una sola línea en computadora. */
@media (min-width: 901px) { #ads-precios .pc-note { white-space: nowrap; max-width: none; border-radius: 999px; padding: 11px 26px; } }
/* 14 oct 2026 (n): segunda línea para inversiones grandes; burbuja de dos líneas. */
@media (min-width: 901px) { #ads-precios .pc-note { border-radius: 24px; padding: 12px 28px; line-height: 1.6; } }
@media (max-width: 760px) { #ads-precios .pc-note br.d { display: inline; } }
/* 14 oct 2026 (o): la primera línea de la nota es más larga; en una línea solo desde 1200px. */
@media (min-width: 901px) and (max-width: 1199px) { #ads-precios .pc-note { white-space: normal; max-width: min(820px, calc(100% - 8px)); text-wrap: balance; } }
/* 14 oct 2026 (p): la pregunta de la nota de Ads, un grosor más. */
#ads-precios .pc-note .pn-q { font-weight: 500; }

/* 15 oct 2026 (a): Web, precios. "Conecta" lleva "Desde" encima del
   precio y su cifra quedaba más abajo que las otras dos. En computadora
   las tres tarjetas reservan ese mismo espacio y los precios quedan a la
   misma altura. */
@media (min-width: 761px) {
  #web-precios .pc-price { margin-top: 34px; }
}

/* 15 oct 2026 (b): Partner. Los títulos de "Por qué funciona mejor" y
   "Así crecemos juntos" y los de sus tarjetas iban en 300 y 400; el resto
   del sitio usa 500. Se igualan. */
#por-que .sv-head h2, #tu-mes .sv-head h2,
#por-que .why3 h3, #tu-mes .sx-four .sv-card h3 { font-weight: 500; }

/* 15 oct 2026 (c): Social Media en celular. La línea que une a las tres
   personas del chat arrancaba arriba del todo y, antes de dibujarse, se
   veía como una rayita negra suelta sobre la primera burbuja. Ahora va
   de la primera foto a la última y queda por detrás de ellas. */
@media (max-width: 640px) {
  .sv-funnel-mobile { top: 57px; bottom: auto; height: 216px; }
  .sv-orders .av { position: relative; z-index: 1; }
}

/* 15 oct 2026 (d): Partner, "Por qué funciona mejor". Luis pidió los
   títulos de las cuatro columnas un grosor más fino: de 500 a 400. */
#por-que .why3 h3 { font-weight: 400; }