/* ==========================================================
   VSArte 2026 — capa de diseño sobre sitio.css
   ========================================================== */

[hidden] { display: none !important; }
.solo-lectores { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.saltar-contenido { position: absolute; left: -999px; top: 8px; z-index: 100; background: var(--rosa); color: #fff; padding: 10px 16px; border-radius: 999px; font-weight: 700; }
.saltar-contenido:focus { left: 12px; }
html { scroll-padding-top: 88px; }
.cabeza-seccion.centrado { margin-inline: auto; text-align: center; justify-items: center; }
.cabeza-seccion h2 .acento, .titular-grande .acento, .cifras-cabeza .acento, .valores-titulo .acento { color: var(--rosa); }
.entrada { font-size: var(--t-md); color: var(--texto); line-height: 1.55; }

/* ---------- Encabezado ---------- */
.encabezado { transition: background .35s ease, border-color .35s ease, color .35s ease; }
.encabezado .logo img { transition: filter .35s ease; }
.pagina-inicio .encabezado { position: fixed; left: 0; right: 0; top: 0; }
.encabezado.sobre-portada { background: transparent; border-bottom-color: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--portada-fg, #0a0a0b); }
.encabezado.sobre-portada .menu > li > a,
.encabezado.sobre-portada .sub-btn { color: var(--portada-fg, #0a0a0b); opacity: .82; }
.encabezado.sobre-portada .menu > li > a:hover,
.encabezado.sobre-portada .sub-btn:hover { opacity: 1; }
.encabezado.sobre-portada .btn-cta-nav { background: var(--portada-fg, #0a0a0b); color: var(--portada-bg, #ff2b7a); transition: background .7s, color .7s; }
.encabezado.sobre-portada .hamburguesa { border-color: currentColor; color: var(--portada-fg, #0a0a0b); }
:root[data-portada-tono="claro"] .encabezado.sobre-portada .logo img { filter: brightness(0); }
.encabezado-acciones { display: flex; gap: 10px; align-items: center; }
.nav-cta-movil { display: none; }
.submenu-servicios { min-width: 320px; }
.submenu-servicios a { display: flex; align-items: center; gap: 10px; }
.sub-icono { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); flex: none; }
.sub-icono svg { width: 16px; height: 16px; }
.sub-todos { border-top: 1px solid var(--linea); margin-top: 6px; padding-top: 12px !important; color: var(--rosa) !important; font-weight: 700 !important; }
@media (max-width: 960px) {
  body.menu-abierto { overflow: hidden; }
  body.menu-abierto .encabezado { --portada-fg: #f6f3f5; background: var(--negro) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  body.menu-abierto .encabezado .logo img { filter: none !important; }
  .nav-principal .menu a, .nav-principal .sub-btn { color: var(--texto) !important; opacity: 1 !important; }
  .nav-principal .submenu a { color: var(--texto-2) !important; }
  .nav-cta-movil { display: flex; margin-top: 24px; width: 100%; }
  body.menu-abierto .wsp-flotante { opacity: 0; pointer-events: none; }
  .submenu-servicios { min-width: 0; }
}

/* ==========================================================
   Portada animada
   ========================================================== */
.portada {
  position: relative; overflow: hidden; isolation: isolate;
  height: 100vh; height: 100svh; min-height: 560px; max-height: 1400px;
  background: var(--bg, #ff2b7a); color: var(--fg, #0a0a0b);
  transition: background .7s cubic-bezier(.7,0,.2,1), color .7s;
  container-type: size;
}
.portada::after { content: ""; position: absolute; inset: -50%; z-index: 20; pointer-events: none; opacity: .06;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.portada-palabra { position: absolute; left: 50%; top: 50%; width: min(86%, 1160px); width: min(86cqw, 165cqh); pointer-events: none;
  transform: translate(-50%, -50%) translate(calc(var(--mx, 0) * -14px), calc(var(--my, 0) * -8px)); transition: transform .4s ease-out; }
.portada-palabra svg { display: block; width: 100%; height: auto; overflow: visible; }
.portada-palabra.fondo { z-index: 2; }
.portada-palabra.frente { z-index: 6; }
.portada .letra { transform-box: fill-box; transform-origin: 50% 85%; opacity: 0; transform: translateY(22%) scale(.5);
  transition: opacity .2s ease, transform .6s cubic-bezier(.34,1.56,.64,1); }
.portada .letra.ve { opacity: 1; transform: none; }
.portada .letra.sale { opacity: 0; transform: translateY(-16%) scale(.7); transition: opacity .3s ease, transform .4s ease-in; }
.portada .fondo text { fill: var(--fg, #0a0a0b); transition: fill .7s; }
.portada .frente .letra { transform: none !important; transition: opacity .2s ease .55s; }
.portada .frente .letra.sale { transition: opacity .12s ease; }
.portada .frente feFlood { flood-color: var(--fg, #0a0a0b); }
.portada .sub { opacity: 0; transition: opacity .45s ease; }
.portada .sub.ve { opacity: 1; }
.portada-objetos { position: absolute; inset: 0; z-index: 4; pointer-events: none;
  transform: translate(calc(var(--mx, 0) * 30px), calc(var(--my, 0) * 18px)); transition: transform .4s ease-out; }
.portada-pieza { position: absolute; left: 0; top: 0; z-index: 2; height: calc(74% * var(--tam, 1)); height: calc(min(74cqh, 70cqw) * var(--tam, 1)); aspect-ratio: 4 / 5; opacity: 0; will-change: transform; }
.portada-pieza img, .portada-merch img { width: 100%; height: 100%; object-fit: contain; display: block; }
.portada-pieza img { filter: drop-shadow(0 40px 45px rgba(0,0,0,.35)); }
.portada-merch { position: absolute; left: 0; top: 0; z-index: 1; height: calc(20% * var(--s, 1)); height: calc(min(20cqh, 17cqw) * var(--s, 1)); aspect-ratio: 1; opacity: 0; will-change: transform; }
.portada-merch img { filter: drop-shadow(0 22px 26px rgba(0,0,0,.3)); }
.portada .flota img { animation: portada-flota 4s ease-in-out infinite; }
.portada .portada-merch.flota:nth-of-type(2n) img { animation-duration: 3.4s; animation-delay: -1.2s; }
.portada.quieta .flota img { animation-play-state: paused; }
@keyframes portada-flota { 50% { transform: translateY(-4%) rotate(-2deg); } }
.portada-rafaga { position: absolute; left: 0; top: 0; z-index: 0; width: 70%; aspect-ratio: 1; border-radius: 50%; opacity: 0;
  background: radial-gradient(closest-side, rgba(255,255,255,.95), rgba(255,255,255,.35) 40%, transparent 72%); }

.portada-ui { position: absolute; z-index: 15; font-size: clamp(11px, .78cqw, 15px); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1.45; }
.portada-agencia { left: var(--gutter); bottom: clamp(20px, 3cqh, 36px); max-width: 30ch; }
.portada-accion { right: calc(var(--gutter) + 96px); bottom: clamp(20px, 3cqh, 36px); max-width: clamp(250px, 22cqw, 400px); text-align: right; text-transform: none; letter-spacing: 0; font-weight: 600; font-size: clamp(13px, .95cqw, 18px); }
.portada-accion p { margin-bottom: 12px; }
.portada-cta { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 22px; border-radius: 999px; background: var(--fg, #0a0a0b); color: var(--bg, #ff2b7a); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; font-size: clamp(12px, .8cqw, 14px); transition: background .7s, color .7s, transform .2s; }
.portada-cta:hover { transform: translateY(-2px); }
.portada-pausa { position: absolute; z-index: 16; right: var(--gutter); bottom: clamp(24px, 3.4cqh, 40px); width: 40px; height: 40px; border-radius: 50%;
  border: 1.5px solid currentColor; background: transparent; color: inherit; cursor: pointer; display: grid; place-items: center; opacity: .75; }
.portada-pausa:hover { opacity: 1; }
.portada-pausa svg { width: 13px; height: 13px; }
.portada-bajar { position: absolute; z-index: 15; left: 50%; bottom: 14px; width: 26px; height: 42px; margin-left: -13px; border: 1.5px solid currentColor; border-radius: 999px; opacity: .55; }
.portada-bajar span { position: absolute; left: 50%; top: 8px; width: 3px; height: 8px; margin-left: -1.5px; border-radius: 3px; background: currentColor; animation: portada-rueda 1.8s ease-in-out infinite; }
@keyframes portada-rueda { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(14px); opacity: 0; } 100% { opacity: 0; } }

/* Portada en vertical (celular / tablet de pie) */
@container (orientation: portrait) {
  .portada-palabra { width: 92cqw; top: 44%; }
  .portada .sub { font-size: 25px; }
  .portada-pieza { height: calc(min(56cqh, 88cqw) * var(--tam, 1)); }
  .portada-merch { height: calc(min(14cqh, 25cqw) * var(--s, 1)); }
  .portada-agencia { bottom: auto; top: 88px; font-size: 11px; letter-spacing: .12em; opacity: .85; }
  .portada-accion { left: var(--gutter); right: var(--gutter); max-width: none; text-align: left; font-size: 16px; line-height: 1.35; bottom: 24px; }
  .portada-accion p { max-width: 24ch; margin-bottom: 14px; }
  .portada-cta { min-height: 50px; font-size: 13px; }
  .portada-pausa { bottom: 29px; }
  .portada-bajar { display: none; }
}
@container (orientation: portrait) and (min-width: 600px) {
  .portada-palabra { width: 84cqw; top: 41%; }
  .portada-agencia { top: 110px; font-size: 13px; }
  .portada-accion { font-size: 21px; bottom: 36px; }
  .portada-pausa { bottom: 42px; }
}
@container (max-height: 620px) and (orientation: landscape) {
  .portada-bajar { display: none; }
}

/* ==========================================================
   Servicios
   ========================================================== */
.servicios-v2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linea); border: 1px solid var(--linea); border-radius: calc(var(--radio) + 6px); overflow: hidden; }
.servicio-v2 { position: relative; background: var(--negro); padding: clamp(24px, 3vw, 36px); display: flex; flex-direction: column; gap: 14px; transition: background .3s; min-height: 100%; }
.servicio-v2:hover { background: var(--negro-2); }
.sv-num { position: absolute; top: clamp(20px, 2.6vw, 30px); right: clamp(20px, 2.6vw, 30px); font: 800 var(--t-xs) var(--f-texto); letter-spacing: .1em; color: var(--texto-3); }
.sv-icono { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.sv-icono svg { width: 24px; height: 24px; }
.servicio-v2:hover .sv-icono { transform: rotate(-8deg) scale(1.06); }
.servicio-v2 h3 { font-size: var(--t-lg); margin-top: 6px; }
.servicio-v2 > p { color: var(--texto-2); font-size: var(--t-sm); }
.sv-lista { display: grid; gap: 6px; padding-top: 14px; border-top: 1px solid var(--linea); margin-top: 2px; }
.sv-lista li { font-size: var(--t-sm); color: var(--texto-2); display: flex; gap: 10px; align-items: center; }
.sv-lista li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--rosa); flex: none; }
.sv-ver { margin-top: auto; padding-top: 8px; font-size: var(--t-sm); font-weight: 700; color: var(--rosa); display: inline-flex; gap: 6px; transition: gap .2s; }
.servicio-v2:hover .sv-ver { gap: 12px; }
.servicio-v2.resaltado { background: var(--rosa); }
.servicio-v2.resaltado:hover { background: #ff3f88; }
.servicio-v2.resaltado .sv-icono { background: rgba(255,255,255,.18); color: #fff; }
.servicio-v2.resaltado > p, .servicio-v2.resaltado .sv-lista li, .servicio-v2.resaltado .sv-num { color: rgba(255,255,255,.88); }
.servicio-v2.resaltado .sv-lista { border-top-color: rgba(255,255,255,.28); }
.servicio-v2.resaltado .sv-lista li::before { background: #fff; }
.servicio-v2.resaltado .sv-ver { color: #fff; }
@media (max-width: 960px) { .servicios-v2 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .servicios-v2 { grid-template-columns: 1fr; } }

/* ==========================================================
   Precios
   ========================================================== */
.precios .cabeza-seccion { margin-bottom: 28px; }
.planes-pestanas { display: flex; justify-content: center; gap: 4px; width: max-content; max-width: 100%; margin: 0 auto 36px; padding: 5px; border-radius: 999px; background: var(--negro-2); border: 1px solid var(--linea-2); overflow-x: auto; scrollbar-width: none; }
.planes-pestanas button { border: 0; background: none; color: var(--texto-2); font: 700 var(--t-sm) var(--f-texto); padding: 10px 20px; border-radius: 999px; cursor: pointer; white-space: nowrap; transition: background .2s, color .2s; }
.planes-pestanas button:hover { color: var(--texto); }
.planes-pestanas button[aria-selected="true"] { background: var(--rosa); color: #fff; }
.planes-lista { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; align-items: stretch; padding-top: 14px; }
@media (min-width: 1100px) { .planes-lista { grid-template-columns: repeat(min(var(--n), 5), 1fr); } }
.plan { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 28px 22px 22px; border-radius: 20px; background: var(--negro-2); border: 1px solid var(--linea-2); transition: transform .3s, border-color .3s; }
.plan:hover { border-color: rgba(255,43,122,.5); }
.plan h3 { font-size: var(--t-lg); text-transform: uppercase; letter-spacing: .01em; }
.plan-sub { color: var(--texto-3); font-size: var(--t-sm); min-height: 2.6em; }
.plan-precio { display: grid; gap: 2px; padding: 18px 0; margin: 4px 0 6px; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.plan-prefijo, .plan-periodo { font-size: var(--t-xs); color: var(--texto-3); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.plan-periodo { letter-spacing: .02em; text-transform: none; font-weight: 600; }
.plan-precio strong { font-family: var(--f-display); font-weight: 800; font-size: clamp(2rem, 1.6rem + 1.2vw, 2.6rem); line-height: 1; letter-spacing: -.035em; color: var(--rosa); font-variant-numeric: tabular-nums; white-space: nowrap; }
.plan-precio strong small { font-size: .5em; margin-right: 4px; letter-spacing: 0; vertical-align: .55em; }
.plan-incluye { display: grid; gap: 10px; margin: 12px 0 20px; }
.plan-incluye li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: var(--t-sm); color: var(--texto-2); line-height: 1.4; }
.plan-incluye svg { width: 16px; height: 16px; color: var(--rosa); margin-top: 2px; }
.plan-boton { margin-top: auto; width: 100%; min-height: 46px; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.plan.destacado { background: linear-gradient(180deg, rgba(255,43,122,.12), rgba(255,43,122,.02) 45%), var(--negro-2); border: 1.5px solid var(--rosa); }
@media (min-width: 1100px) { .plan.destacado { transform: translateY(-10px); } }
.plan-etiqueta { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); padding: 6px 14px; border-radius: 999px; background: var(--rosa); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.precios-nota { margin-top: 28px; text-align: center; color: var(--texto-3); font-size: var(--t-sm); }
@media (max-width: 760px) {
  .planes-pestanas { justify-content: flex-start; }
  .planes-lista { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin-inline: calc(var(--gutter) * -1); padding: 14px var(--gutter) 8px; scrollbar-width: none; }
  .planes-lista::-webkit-scrollbar { display: none; }
  .plan { flex: 0 0 82%; scroll-snap-align: center; }
}

/* ==========================================================
   Páginas internas
   ========================================================== */
.interna-cabeza { padding-block: clamp(56px, 8vw, 104px) clamp(40px, 6vw, 72px); border-bottom: 1px solid var(--linea); position: relative; overflow: hidden; }
.interna-cabeza::before { content: ""; position: absolute; width: 640px; height: 640px; right: -220px; top: -300px; background: radial-gradient(closest-side, rgba(255,43,122,.22), transparent); pointer-events: none; }
.interna-cabeza .contenedor { position: relative; }
.interna-cabeza h1 { font-size: clamp(2.4rem, 1.2rem + 4.6vw, 4.8rem); font-weight: 800; letter-spacing: -.04em; line-height: .98; margin: 18px 0 20px; max-width: 18ch; }
.interna-cabeza .entrada { max-width: 60ch; color: var(--texto-2); }
.interna-cabeza .acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.interna-rejilla { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: end; }
.interna-icono { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: var(--rosa-suave); color: var(--rosa); margin-top: 24px; }
.interna-icono svg { width: 26px; height: 26px; }
.interna-incluye { background: var(--negro-2); border: 1px solid var(--linea-2); border-radius: 20px; padding: 26px; }
.interna-incluye h2 { font-size: var(--t-xs); font-family: var(--f-texto); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--rosa); margin-bottom: 14px; }
.interna-incluye ul { display: grid; gap: 12px; }
.interna-incluye li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-weight: 600; }
.interna-incluye svg { width: 18px; height: 18px; color: var(--rosa); margin-top: 3px; }
.migas { display: flex; flex-wrap: wrap; gap: 8px; font-size: var(--t-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); }
.migas a:hover { color: var(--rosa); }
.otros-servicios { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.otros-servicios a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--linea-2); font-weight: 700; transition: border-color .2s, background .2s; }
.otros-servicios a:hover { border-color: var(--rosa); background: var(--negro-2); }
.otros-servicios a > span:last-child { margin-left: auto; color: var(--rosa); }
.otros-servicios .sv-icono { width: 38px; height: 38px; border-radius: 10px; }
.otros-servicios .sv-icono svg { width: 18px; height: 18px; }
.pagina-aviso { min-height: 60vh; display: grid; align-items: center; }
@media (max-width: 860px) { .interna-rejilla { grid-template-columns: 1fr; } }

/* ---------- Pie ---------- */
.pie-dato { color: var(--texto-2); font-size: var(--t-sm); }
.pie .horarios { margin-top: 18px; }

@media (prefers-reduced-motion: reduce) {
  .portada *, .por-aparecer { transition: none !important; animation: none !important; }
}

/* El botón flotante de WhatsApp se oculta mientras se ve la portada (ya tiene su propio botón) */
.wsp-flotante { transition: transform .3s, opacity .3s; }
body.en-portada .wsp-flotante { opacity: 0; transform: scale(.6); pointer-events: none; }

/* ==========================================================
   Logo del encabezado: brillo sutil en bucle
   ========================================================== */
.logo { position: relative; display: inline-block; isolation: isolate; }
.logo::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.95) 50%, transparent 62%) 180% 0 / 260% 100% no-repeat;
  animation: logo-brillo 5.5s ease-in-out infinite;
}
.logo img { animation: logo-respira 5.5s ease-in-out infinite; transform-origin: 30% 60%; }
@keyframes logo-brillo { 0%, 55% { background-position: 180% 0; } 80%, 100% { background-position: -80% 0; } }
@keyframes logo-respira { 0%, 100% { transform: rotate(0) scale(1); } 62% { transform: rotate(-3deg) scale(1.04); } 72% { transform: rotate(1.5deg) scale(1.02); } 80% { transform: none; } }

/* ==========================================================
   Clientes: pasarela
   ========================================================== */
.clientes-v2 { padding-block: clamp(56px, 7vw, 96px); border-bottom: 1px solid var(--linea); overflow: hidden; }
.clientes-titulo { font-family: var(--f-display); font-weight: 700; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.2rem); line-height: 1.12; letter-spacing: -.025em; max-width: 26ch; margin: 0 auto clamp(32px, 4vw, 52px); text-align: center; color: var(--texto-2); text-wrap: balance; }
.clientes-titulo .acento { color: var(--texto); }
.pasarela { display: grid; gap: clamp(10px, 1.2vw, 16px); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.pasarela-fila { display: flex; width: max-content; animation: pasarela var(--vel, 55s) linear infinite; }
.pasarela-fila.inversa { animation-direction: reverse; animation-duration: calc(var(--vel, 55s) * 1.15); }
.pasarela:hover .pasarela-fila { animation-play-state: paused; }
.pasarela-pista { display: flex; gap: clamp(10px, 1.2vw, 16px); padding-right: clamp(10px, 1.2vw, 16px); }
@keyframes pasarela { to { transform: translateX(-50%); } }
.tesela { display: block; width: clamp(104px, 11vw, 150px); aspect-ratio: 1 / 1.1; border-radius: 16px; overflow: hidden; background: #f3edf0;
  filter: grayscale(1) contrast(.95) brightness(.78); opacity: .78;
  transition: filter .45s ease, opacity .45s ease, transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s; }
.tesela img { width: 100%; height: 100%; object-fit: cover; user-select: none; }
.tesela.con-margen img { object-fit: contain; padding: 18%; }
.tesela:hover, .tesela:focus-visible { filter: none; opacity: 1; transform: translateY(-6px) scale(1.04); box-shadow: 0 22px 44px -20px rgba(255, 43, 122, .7); }
.paises { display: flex; flex-direction: column; align-items: center; gap: 16px; margin-top: clamp(36px, 4.5vw, 56px); text-align: center; }
.paises-titulo { font-family: var(--f-display); font-weight: 600; font-size: var(--t-md); color: var(--texto-2); letter-spacing: -.01em; }
.paises ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.paises li { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 10px; border-radius: 999px; border: 1px solid var(--linea-2); background: var(--negro-2); font-size: var(--t-sm); font-weight: 600; color: var(--texto); transition: border-color .25s, transform .25s; }
.paises li:hover { border-color: var(--rosa-borde); transform: translateY(-2px); }
.bandera { width: 26px; height: auto; aspect-ratio: 3 / 2; border-radius: 4px; box-shadow: 0 0 0 1px rgba(255,255,255,.12); flex: none; }

/* ==========================================================
   Quiénes somos
   ========================================================== */
.nosotros-rejilla { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(36px, 6vw, 96px); align-items: center; }
.titular-grande { font-size: clamp(2.6rem, 1.3rem + 5vw, 5.4rem); font-weight: 800; letter-spacing: -.045em; line-height: .95; margin: 0 0 28px; }
.nosotros-texto > p { color: var(--texto-2); max-width: 54ch; }
.nosotros-texto > p + p { margin-top: 14px; }
.nosotros-texto > .entrada { color: var(--texto); }
.pilares { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 34px; }
.pilares li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 15px 7px 7px; border-radius: 999px; border: 1px solid var(--linea-2); font-family: var(--f-display); font-weight: 700; font-size: 15px; letter-spacing: -.01em; transition: border-color .3s, background .3s; }
.pilares li:hover { border-color: var(--rosa); background: var(--rosa-suave); }
.pilar-icono { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--rosa); color: #fff; flex: none; }
.pilar-icono svg { width: 14px; height: 14px; }

.marcas-carrusel { position: relative; margin: 0; max-width: 480px; width: 100%; justify-self: center; display: grid; gap: 18px; }
.mc-forma { position: absolute; inset: 8% -6% 16% 10%; border-radius: 28px; background: var(--rosa); transform: rotate(4deg); z-index: 0; }
.mc-forma::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle, rgba(255,255,255,.35) 0 1.5px, transparent 2px) 0 0 / 16px 16px; mask-image: linear-gradient(210deg, #000 5%, transparent 45%); -webkit-mask-image: linear-gradient(210deg, #000 5%, transparent 45%); }
.mc-marco { position: relative; z-index: 1; aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; background: var(--negro-3); box-shadow: 0 40px 80px -30px rgba(0,0,0,.8); }
.mc-slide { position: absolute; inset: 0; clip-path: inset(0 0 0 100%); transition: clip-path .9s cubic-bezier(.77,0,.18,1); }
.mc-slide.activo { clip-path: inset(0 0 0 0); z-index: 2; }
.mc-slide.saliendo { clip-path: inset(0 0 0 0); z-index: 1; }
.mc-slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 4.5s ease-out; }
.mc-slide.activo img { transform: scale(1); }
.mc-pie { position: relative; z-index: 1; display: flex; flex-wrap: wrap; row-gap: 6px; align-items: center; justify-content: space-between; gap: 16px; padding-inline: 4px; }
.mc-texto { display: grid; flex: 1 1 170px; }
.mc-texto b { font-family: var(--f-display); font-size: var(--t-md); letter-spacing: -.01em; }
.mc-texto small { color: var(--texto-2); font-size: var(--t-sm); }
.mc-texto.cambia { animation: mc-texto .5s ease; }
@keyframes mc-texto { from { opacity: 0; transform: translateY(8px); } }
.mc-puntos { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 2px; }
.mc-puntos button { min-width: 22px; height: 24px; border: 0; background: none; padding: 0; cursor: pointer; display: grid; place-items: center; }
.mc-puntos i { display: block; width: 16px; height: 3px; border-radius: 3px; background: var(--linea-2); position: relative; overflow: hidden; transition: width .4s ease; }
@media (hover: hover) { .mc-puntos button:hover i { background: var(--texto-2); } }
.mc-puntos button[aria-current="true"] i { width: 30px; }
.mc-puntos button[aria-current="true"] i::after { content: ""; position: absolute; inset: 0; background: var(--rosa); transform-origin: left; animation: mc-avance var(--int, 3.5s) linear forwards; }
.marcas-carrusel.quieto .mc-puntos button[aria-current="true"] i::after { animation-play-state: paused; }
@keyframes mc-avance { from { transform: scaleX(0); } }

.valores { margin-top: clamp(72px, 9vw, 120px); display: grid; grid-template-columns: .9fr 2.1fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
.valores-cabeza { position: sticky; top: 110px; display: grid; gap: 14px; }
.valores-titulo { font-size: clamp(2rem, 1.3rem + 2.4vw, 3.2rem); letter-spacing: -.04em; line-height: 1; }
.valores-cabeza p { color: var(--texto-2); }
.valores-lista { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.valores-lista li { position: relative; display: grid; gap: 12px; align-content: start; padding: clamp(22px, 2.4vw, 30px); border-radius: 20px; background: var(--negro-2); border: 1px solid var(--linea); overflow: hidden; transition: border-color .35s, transform .35s cubic-bezier(.2,.8,.2,1); }
.valores-lista li::before { content: ""; position: absolute; inset: auto -30% -60% auto; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,43,122,.28), transparent); opacity: 0; transition: opacity .45s; }
.valores-lista li:hover { border-color: var(--rosa-borde); transform: translateY(-4px); }
.valores-lista li:hover::before { opacity: 1; }
.valor-icono { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); transition: transform .45s cubic-bezier(.34,1.56,.64,1); }
.valores-lista li:hover .valor-icono { transform: rotate(-10deg) scale(1.08); }
.valor-icono svg { width: 24px; height: 24px; }
.valores-lista h4 { font-family: var(--f-display); font-size: var(--t-lg); letter-spacing: -.015em; }
.valores-lista p { color: var(--texto-2); font-size: var(--t-sm); position: relative; }
@media (max-width: 960px) {
  .nosotros-rejilla { grid-template-columns: 1fr; }
  .valores { grid-template-columns: 1fr; }
  .valores-cabeza { position: static; }
}
@media (max-width: 600px) { .valores-lista { grid-template-columns: 1fr; } .marcas-carrusel { max-width: 88%; } }

/* ==========================================================
   Cifras
   ========================================================== */
.cifras { position: relative; overflow: hidden; }
.cifras::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(600px 380px at 88% 8%, rgba(255,43,122,.16), transparent 70%),
              radial-gradient(circle, rgba(255,255,255,.07) 1px, transparent 1.5px) 0 0 / 26px 26px;
  mask-image: linear-gradient(180deg, #000, transparent 85%); -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); }
.cifras .contenedor { position: relative; }
.cifras-cabeza { display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px 64px; align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
.cifras-cabeza h2 { font-size: var(--t-2xl); }
.cifras-cabeza p { color: var(--texto-2); font-size: var(--t-md); }
.cifras-lista { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0 0 14px; }
.cifras-lista > div { position: relative; display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 10px; padding: clamp(22px, 2.6vw, 34px); border-radius: 20px; border: 1px solid var(--linea); background: linear-gradient(160deg, var(--negro-2), var(--negro)); overflow: hidden; transition: border-color .35s, transform .35s; }
.cifras-lista > div::after { content: ""; position: absolute; left: clamp(22px, 2.6vw, 34px); right: clamp(22px, 2.6vw, 34px); bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--rosa); transform: scaleX(0); transform-origin: left; transition: transform 1.2s cubic-bezier(.2,.8,.2,1) .2s; }
.cifras-lista > div.visto::after, html:not(.js) .cifras-lista > div::after { transform: scaleX(1); }
.cifras-lista > div:hover { border-color: var(--rosa-borde); transform: translateY(-4px); }
.cifras-lista dt { color: var(--texto-2); font-size: var(--t-sm); font-weight: 600; }
.cifras-lista dd { margin: 0; font-family: var(--f-display); font-weight: 800; font-size: clamp(2.6rem, 1.4rem + 3.4vw, 4.8rem); line-height: 1; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.cifras-lista .sufijo { color: var(--rosa); }
.resultados-v2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.res-tarjeta { display: grid; gap: 10px; align-content: start; padding: clamp(22px, 2.6vw, 34px); border-radius: 20px; background: var(--negro-2); border: 1px solid var(--linea-2); transition: border-color .35s, transform .35s; }
.res-tarjeta:hover { border-color: var(--rosa); transform: translateY(-4px); }
.res-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 8px; }
.res-valor { font-family: var(--f-display); font-weight: 800; font-size: clamp(2.8rem, 1.8rem + 2.6vw, 4.4rem); line-height: .9; letter-spacing: -.045em; color: var(--rosa); }
.res-tarjeta h3 { font-size: var(--t-lg); }
.res-tarjeta p { color: var(--texto-2); font-size: var(--t-sm); }
.graf { height: clamp(56px, 5vw, 72px); width: auto; flex: none; overflow: visible; }
.graf-linea .area { fill: rgba(255,43,122,.14); opacity: 0; transition: opacity .8s ease .9s; }
.graf-linea .trazo { fill: none; stroke: var(--rosa); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.4s cubic-bezier(.6,.1,.2,1); }
.graf-linea circle { fill: var(--rosa); opacity: 0; transition: opacity .3s 1.3s; }
.graf-barras rect { fill: var(--rosa); transform-box: fill-box; transform-origin: bottom; transform: scaleY(0); transition: transform .9s cubic-bezier(.34,1.3,.64,1) var(--d, 0s); }
.graf-barras rect:nth-child(1), .graf-barras rect:nth-child(2) { fill: rgba(255,43,122,.45); }
.graf-anillo { width: clamp(64px, 6.5vw, 86px); transform: rotate(-90deg); }
.graf-anillo circle { fill: none; stroke-width: 7; }
.graf-anillo .pista { stroke: var(--linea-2); }
.graf-anillo .valor { stroke: var(--rosa); stroke-linecap: round; stroke-dasharray: var(--c); stroke-dashoffset: var(--c); transition: stroke-dashoffset 1.6s cubic-bezier(.3,.1,.2,1) .2s; }
.res-tarjeta.visto .graf-linea .trazo, html:not(.js) .graf-linea .trazo { stroke-dashoffset: 0; }
.res-tarjeta.visto .graf-linea .area, .res-tarjeta.visto .graf-linea circle, html:not(.js) .graf-linea .area, html:not(.js) .graf-linea circle { opacity: 1; }
.res-tarjeta.visto .graf-linea circle { animation: pulso 2s ease-in-out 1.6s infinite; transform-box: fill-box; transform-origin: center; }
@keyframes pulso { 50% { transform: scale(1.6); opacity: .5; } }
.res-tarjeta.visto .graf-barras rect, html:not(.js) .graf-barras rect { transform: none; }
.res-tarjeta.visto .graf-anillo .valor, html:not(.js) .graf-anillo .valor { stroke-dashoffset: var(--o); }
@media (max-width: 900px) { .cifras-cabeza { grid-template-columns: 1fr; } .resultados-v2 { grid-template-columns: 1fr; } }
@media (max-width: 800px) { .cifras-lista { grid-template-columns: 1fr 1fr; } }

/* ==========================================================
   Animaciones de entrada (solo si hay JavaScript)
   ========================================================== */
.js [data-animar="titulo"] .pal { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.js [data-animar="titulo"] .pal > span { display: inline-block; transform: translateY(105%); transition: transform .9s cubic-bezier(.2,.85,.25,1); transition-delay: calc(var(--i, 0) * 55ms); }
.js [data-animar="titulo"].visto .pal > span { transform: none; }
.js [data-animar="texto"] { opacity: 0; transform: translateY(16px); filter: blur(6px); transition: opacity .9s ease .25s, transform .9s cubic-bezier(.2,.8,.2,1) .25s, filter .9s ease .25s; }
.js [data-animar="texto"].visto { opacity: 1; transform: none; filter: none; }
.js [data-animar="subir"] { opacity: 0; transform: translateY(34px); transition: opacity .8s ease, transform .9s cubic-bezier(.2,.8,.2,1), border-color .35s; transition-delay: calc(var(--i, 0) * 90ms); }
.js [data-animar="subir"].visto { opacity: 1; transform: none; }
.js [data-animar="subir"].visto:hover { transform: translateY(-4px); transition-delay: 0s; }
.js [data-animar="imagen"] { clip-path: inset(12% 12% 12% 12% round 28px); opacity: 0; transform: scale(.94); transition: clip-path 1.3s cubic-bezier(.77,0,.18,1), opacity .6s ease, transform 1.3s cubic-bezier(.2,.8,.2,1); }
.js [data-animar="imagen"].visto { clip-path: inset(-20% -20% -20% -20%); opacity: 1; transform: none; }
.js .proyecto .foto { clip-path: inset(100% 0 0 0 round 14px); transition: clip-path 1.1s cubic-bezier(.77,0,.18,1); }
.js .proyecto.visto .foto { clip-path: inset(0 0 0 0 round 14px); }
.js .proyecto .foto img { transform: scale(1.15); transition: transform 1.6s cubic-bezier(.2,.8,.2,1); }
.js .proyecto.visto .foto img { transform: none; }
.js .proyecto.visto:hover .foto img { transform: scale(1.04); transition-duration: .5s; }
.js .servicio-v2, .js .plan, .js .paso { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1), background .3s, border-color .3s; transition-delay: calc(var(--i, 0) * 70ms); }
.js .servicio-v2.visto, .js .plan.visto, .js .paso.visto { opacity: 1; transform: none; }
@media (min-width: 1100px) { .js .plan.destacado.visto { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) {
  .js [data-animar], .js [data-animar] .pal > span, .js .proyecto .foto, .js .proyecto .foto img, .js .servicio-v2, .js .plan, .js .paso { opacity: 1 !important; transform: none !important; clip-path: none !important; filter: none !important; transition: none !important; }
  .logo::after, .logo img, .pasarela-fila { animation: none !important; }
}

/* ---------- Proyectos: tarjeta con enlace ---------- */
.proyecto { position: relative; }
.proyecto .foto { position: relative; }
.proyecto-link { position: absolute; inset: 0; z-index: 3; border-radius: var(--radio); }
.proyecto-link:focus-visible { outline: 2px solid var(--rosa); outline-offset: 6px; }
.ver-proyecto { position: absolute; left: 14px; bottom: 14px; z-index: 2; padding: 8px 14px; border-radius: 999px; background: var(--rosa); color: #fff; font-weight: 700; font-size: var(--t-sm); opacity: 0; transform: translateY(8px); transition: opacity .35s ease, transform .35s ease; }
.proyecto.con-enlace:hover .ver-proyecto, .proyecto.con-enlace:focus-within .ver-proyecto { opacity: 1; transform: none; }
.proyecto.con-enlace:hover h3 { color: var(--rosa); }
.proyecto h3 { transition: color .3s; }
.proyecto .metricas:empty { display: none; }
@media (hover: none) { .proyecto.con-enlace .ver-proyecto { opacity: 1; transform: none; } }

/* ---------- Redes sociales en el menú del celular ---------- */
.nav-redes-movil { display: none; }
@media (max-width: 960px) {
  .nav-redes-movil { display: grid; justify-items: center; gap: 12px; margin-top: 28px; }
  .nav-redes-movil span { color: var(--texto-2); font-size: var(--t-sm); }
  .nav-redes-movil .redes { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
  .nav-redes-movil .redes a { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--linea-2); display: grid; place-items: center; color: var(--texto); transition: background .25s, border-color .25s, color .25s; }
  .nav-redes-movil .redes a:hover, .nav-redes-movil .redes a:focus-visible { background: var(--rosa); border-color: var(--rosa); color: #fff; }
  .nav-redes-movil svg { width: 20px; height: 20px; }
}

/* ---------- Página de servicio: respuesta directa y preguntas frecuentes ---------- */
.interna-cabeza .entrada-2 { color: var(--texto-2); margin-top: 14px; max-width: 60ch; }
.faq-rejilla { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.faq-cabeza { position: sticky; top: 110px; display: grid; gap: 16px; justify-items: start; margin: 0; }
.faq-cabeza p { color: var(--texto-2); }
.faq-lista { display: grid; gap: 12px; }
.faq { border: 1px solid var(--linea-2); border-radius: 18px; background: var(--negro-2, #121113); transition: border-color .3s, background .3s; }
.faq[open] { border-color: rgba(255,43,122,.5); }
.faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary h3 { font-size: var(--t-md); line-height: 1.3; margin: 0; }
.faq-signo { position: relative; width: 30px; height: 30px; flex: none; border-radius: 50%; border: 1px solid var(--linea-2); transition: transform .35s ease, background .3s, border-color .3s; }
.faq-signo::before, .faq-signo::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: currentColor; border-radius: 2px; transition: transform .35s ease; }
.faq-signo::after { transform: rotate(90deg); }
.faq[open] .faq-signo { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.faq[open] .faq-signo::after { transform: rotate(0); }
.faq summary:hover .faq-signo { border-color: var(--rosa); }
.faq-respuesta { padding: 0 22px 22px; color: var(--texto-2); line-height: 1.65; }
@media (max-width: 860px) { .faq-rejilla { grid-template-columns: 1fr; } .faq-cabeza { position: static; } }

/* ---------- Barra de promoción ---------- */
.barra-promo { font-size: var(--t-sm); line-height: 1.35; }
.barra-promo-in { display: flex; align-items: center; justify-content: center; gap: 10px 16px; flex-wrap: wrap; padding-block: 9px; position: relative; padding-right: 44px; padding-left: 44px; text-align: center; }
.barra-promo p { margin: 0; }
.barra-promo .acento { font-weight: 800; }
.promo-rosa { background: linear-gradient(90deg, #d80f5a, #ff2b7a 55%, #d80f5a); color: #fff; box-shadow: inset 0 -1px 0 rgba(0,0,0,.18); }
.promo-rosa .acento { color: #fff; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.promo-oscuro { background: #141315; color: var(--texto); border-bottom: 1px solid var(--linea-2); }
.promo-claro { background: #f6f3f5; color: #0a0a0b; }
.promo-claro .acento { color: var(--rosa); }
.barra-promo-btn { display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: 999px; font-weight: 800; text-decoration: none; background: #fff; color: #0a0a0b; white-space: nowrap; transition: transform .2s; }
.promo-oscuro .barra-promo-btn, .promo-claro .barra-promo-btn { background: var(--rosa); color: #fff; }
.barra-promo-btn:hover { transform: translateY(-1px); }
.barra-promo-cerrar { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 22px; line-height: 1; cursor: pointer; opacity: .8; }
.barra-promo-cerrar:hover { opacity: 1; background: rgba(0,0,0,.12); }
body.menu-abierto .barra-promo { display: none; }

/* ---------- Plan en promoción ---------- */
.plan.en-promo { border-color: rgba(255,43,122,.65); box-shadow: 0 0 0 1px rgba(255,43,122,.25), 0 30px 60px -30px rgba(255,43,122,.45); }
.plan-etiqueta-promo { display: inline-flex; align-items: center; gap: 6px; background: var(--rosa); color: #fff; animation: promo-latido 2.4s ease-in-out infinite; }
.plan-etiqueta-promo svg { width: 13px; height: 13px; }
@keyframes promo-latido { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,43,122,.5); } 50% { box-shadow: 0 0 0 8px rgba(255,43,122,0); } }
.plan-antes { display: block; color: var(--texto-2); font-size: var(--t-sm); font-weight: 600; text-decoration-color: var(--rosa); text-decoration-thickness: 2px; margin-bottom: 2px; }
.plan-promo-nota { margin: 8px 0 0; font-size: var(--t-xs, 12px); color: var(--rosa); font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .plan-etiqueta-promo { animation: none; } }

.pagina-inicio .portada { margin-top: var(--promo-h, 0px); height: calc(100svh - var(--promo-h, 0px)); }
@media (max-width: 600px) {
  .barra-promo-in { flex-wrap: nowrap; justify-content: flex-start; text-align: left; gap: 10px; padding: 8px 40px 8px 16px; font-size: 12.5px; }
  .barra-promo p { flex: 1 1 auto; }
  .barra-promo-btn { flex: none; padding: 5px 11px; font-size: 12px; }
  .barra-promo-cerrar { right: 4px; }
}

/* ---------- Página de servicio: beneficios ---------- */
.beneficios { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.beneficios li { position: relative; display: grid; gap: 12px; align-content: start; padding: 28px 26px; border: 1px solid var(--linea-2); border-radius: 20px; background: linear-gradient(180deg, rgba(255,255,255,.035), transparent 70%); overflow: hidden; transition: border-color .35s, transform .35s; }
.beneficios li::after { content: ""; position: absolute; left: 26px; right: 26px; bottom: 0; height: 2px; background: var(--rosa); transform: scaleX(0); transform-origin: left; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.beneficios li:hover { border-color: rgba(255,43,122,.45); }
.beneficios li:hover::after { transform: scaleX(1); }
.beneficio-icono { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: var(--rosa-suave, rgba(255,43,122,.12)); color: var(--rosa); }
.beneficio-icono svg { width: 22px; height: 22px; }
.beneficios h3 { font-size: var(--t-md); }
.beneficios p { color: var(--texto-2); font-size: var(--t-sm); line-height: 1.6; }

/* ---------- Proceso: línea de tiempo con bolita que salta ---------- */
.proceso.animada { position: relative; overflow: visible; }
section:has(> .contenedor > .proceso) { overflow-x: clip; }
.proceso.animada .paso { position: relative; border-top-color: var(--linea-2); opacity: .45; transition: opacity .5s ease; }
.proceso.animada .paso::after { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 2px; background: var(--rosa); transform: scaleX(0); transform-origin: left; transition: transform var(--rueda, 700ms) linear; box-shadow: 0 0 12px rgba(255,43,122,.6); }
.proceso.animada .paso.activo { opacity: 1; }
.proceso.animada .paso.activo::after { transform: scaleX(1); }
.proceso.animada .paso h3 { transition: color .4s; }
.proceso.animada .paso.actual h3 { color: var(--rosa); }
.proceso.reiniciando .paso::after { transition: transform .45s ease; }
@media (max-width: 560px) { .proceso.animada .paso { opacity: .72; } }
.proceso-bola { position: absolute; left: 0; top: 0; width: 16px; height: 16px; margin: -9px 0 0 -8px; border-radius: 50%; background: var(--rosa); box-shadow: 0 0 0 4px rgba(255,43,122,.18), 0 0 22px rgba(255,43,122,.8); pointer-events: none; z-index: 2; opacity: 0; will-change: transform; }
.proceso-bola::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: rgba(255,255,255,.55); }
@media (prefers-reduced-motion: reduce) { .proceso.animada .paso { opacity: 1; } .proceso.animada .paso::after { transform: scaleX(1); } .proceso-bola { display: none; } }

/* ---------- Portafolio: filtros, galería mosaico y visor ---------- */
.portafolio-cabeza .entrada { max-width: 62ch; }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filtro { font: 600 var(--t-sm) var(--f-texto); color: var(--texto-2); background: transparent; border: 1px solid var(--linea-2); border-radius: 999px; padding: 9px 16px; cursor: pointer; display: inline-flex; gap: 8px; align-items: center; transition: color .25s, background .25s, border-color .25s; }
.filtro span { font-size: 11px; font-weight: 800; min-width: 22px; padding: 2px 6px; border-radius: 999px; background: rgba(255,255,255,.08); text-align: center; }
.filtro:hover { color: var(--texto); border-color: var(--texto-2); }
.filtro[aria-pressed="true"] { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.filtro[aria-pressed="true"] span { background: rgba(0,0,0,.2); }
.galeria-trabajos { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 8px; gap: 0 16px; }
.trabajo { grid-row: span var(--span, 40); padding-bottom: 16px; transition: opacity .45s ease, transform .45s ease; }
.trabajo.grande { grid-column: span 2; }
.trabajo.grande .trabajo-btn img { aspect-ratio: 16 / 10; object-fit: cover; }
.trabajo.oculto { display: none; }
.trabajo.entra { animation: trabajo-entra .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--k, 0) * 45ms); }
@keyframes trabajo-entra { from { opacity: 0; transform: translateY(24px) scale(.97); } }
.trabajo-btn { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: var(--negro-3, #1a191b); cursor: zoom-in; color: #fff; text-align: left; }
.trabajo-btn img { display: block; width: 100%; height: auto; transition: transform .8s cubic-bezier(.2,.8,.2,1), filter .5s; }
.trabajo-info { position: absolute; inset: auto 0 0 0; display: grid; gap: 2px; padding: 48px 18px 16px; background: linear-gradient(transparent, rgba(0,0,0,.82)); opacity: 0; transform: translateY(10px); transition: opacity .4s, transform .4s; }
.trabajo-info small { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--rosa); }
.trabajo-info b { font-family: var(--f-display); font-size: var(--t-md); line-height: 1.2; }
.trabajo-info em { font-style: normal; font-size: var(--t-sm); color: rgba(255,255,255,.75); }
.trabajo-mas { position: absolute; top: 12px; right: 12px; padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,.6); font-size: 12px; font-weight: 800; backdrop-filter: blur(6px); }
.trabajo-btn:hover img, .trabajo-btn:focus-visible img { transform: scale(1.05); }
.trabajo-btn:hover .trabajo-info, .trabajo-btn:focus-visible .trabajo-info { opacity: 1; transform: none; }
@media (hover: none) { .trabajo-info { opacity: 1; transform: none; padding-top: 36px; } }
@media (max-width: 900px) { .galeria-trabajos { grid-template-columns: repeat(2, 1fr); gap: 0 12px; } .trabajo { padding-bottom: 12px; } }
@media (max-width: 520px) { .trabajo.grande { grid-column: span 2; }
.trabajo.grande .trabajo-btn img { aspect-ratio: 16 / 10; object-fit: cover; } .trabajo-info b { font-size: 15px; } .trabajo-info { padding: 32px 12px 10px; } }
@media (max-width: 600px) {
  .filtros { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding: 2px 16px 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .filtros::-webkit-scrollbar { display: none; }
  .filtro { flex: none; }
}
.vacio-publico { color: var(--texto-2); text-align: center; padding: 40px 0; }

.visor { width: min(1180px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid var(--linea-2); border-radius: 22px; background: #111012; color: var(--texto); overflow: hidden; }
.visor::backdrop { background: rgba(5,5,6,.86); backdrop-filter: blur(6px); }
.visor[open] { animation: visor-abre .35s cubic-bezier(.2,.8,.2,1); }
@keyframes visor-abre { from { opacity: 0; transform: scale(.96); } }
.visor-caja { position: relative; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); max-height: calc(100vh - 34px); }
.visor-media { position: relative; background: #09090a; display: grid; place-items: center; min-height: 320px; }
.visor-media img { max-width: 100%; max-height: calc(100vh - 34px); object-fit: contain; display: block; }
.visor-media img.cambia { animation: visor-img .4s ease; }
@keyframes visor-img { from { opacity: 0; } }
.visor-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; font-size: 28px; line-height: 1; cursor: pointer; backdrop-filter: blur(6px); }
.visor-nav:hover { background: var(--rosa); }
.visor-prev { left: 12px; } .visor-sig { right: 12px; }
.visor-miniaturas { position: absolute; left: 0; right: 0; bottom: 12px; display: flex; gap: 6px; justify-content: center; }
.visor-miniaturas button { width: 44px; height: 44px; border-radius: 8px; overflow: hidden; border: 2px solid transparent; padding: 0; cursor: pointer; background: #000; opacity: .7; }
.visor-miniaturas button[aria-current="true"] { border-color: var(--rosa); opacity: 1; }
.visor-miniaturas img { width: 100%; height: 100%; object-fit: cover; }
.visor-texto { padding: 40px 32px; display: grid; gap: 12px; align-content: center; overflow: auto; }
.visor-texto small { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--rosa); }
.visor-texto h2 { font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.2rem); line-height: 1.1; }
.visor-cliente { color: var(--texto); font-weight: 700; }
.visor-texto p { color: var(--texto-2); margin: 0; }
.visor-acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.visor-cerrar { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; font-size: 26px; cursor: pointer; z-index: 2; }
.visor-cerrar:hover { background: var(--rosa); }
@media (max-width: 800px) {
  .visor { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; border: 0; }
  .visor-caja { grid-template-columns: 1fr; grid-template-rows: auto 1fr; height: 100dvh; max-height: 100dvh; overflow: auto; }
  .visor-media img { max-height: 62dvh; }
  .visor-texto { padding: 22px 18px 32px; align-content: start; }
}
body.visor-abierto { overflow: hidden; }

/* ---------- Página de servicio: foto al costado con la tarjeta "Qué incluye" flotando ---------- */
.interna-visual { position: relative; }
.interna-visual.con-foto { padding: 0 0 70px 0; }
.interna-foto { position: relative; margin: 0; aspect-ratio: 4 / 5; max-height: 560px; margin-left: auto; width: min(100%, 440px); }
.interna-foto-forma { position: absolute; inset: 7% -6% -5% 12%; border-radius: 28px; background: var(--rosa); transform: rotate(4deg); z-index: 0; }
.interna-foto-forma::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle, rgba(255,255,255,.35) 0 1.5px, transparent 2px) 0 0 / 16px 16px; mask-image: linear-gradient(210deg, #000 5%, transparent 45%); -webkit-mask-image: linear-gradient(210deg, #000 5%, transparent 45%); }
.interna-foto img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; border-radius: 24px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.8); }
.interna-visual.con-foto .interna-incluye { position: absolute; left: 0; bottom: 0; z-index: 2; width: min(300px, 78%); padding: 20px 22px; background: rgba(20,19,21,.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 30px 60px -25px rgba(0,0,0,.8); }
.interna-visual.con-foto .interna-incluye ul { gap: 8px; }
@media (max-width: 860px) {
  .interna-foto { width: min(88%, 330px); margin: 16px auto 0; }
  .interna-visual.con-foto { padding-bottom: 0; }
  .interna-visual.con-foto .interna-incluye { position: relative; width: 100%; margin-top: -48px; }
}

/* ---------- Catálogo de merchandising ---------- */
.catalogo-cabeza { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px 48px; align-items: end; margin-bottom: 34px; }
.catalogo-cabeza h2 { margin-bottom: 12px; font-size: var(--t-2xl); }
.catalogo-cabeza h2 .acento { color: var(--rosa); }
.catalogo-cabeza p { color: var(--texto-2); max-width: 56ch; }
.catalogo-chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.catalogo-chips li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--rosa-suave, rgba(255,43,122,.12)); color: var(--texto); font-size: var(--t-sm); font-weight: 600; }
.catalogo-chips svg { width: 14px; height: 14px; color: var(--rosa); }
.catalogo-barra { display: grid; gap: 14px; margin-bottom: 26px; }
.catalogo-barra .filtros { margin-bottom: 0; }
.catalogo-buscar { display: flex; align-items: center; gap: 10px; max-width: 420px; padding: 0 16px; border: 1px solid var(--linea-2); border-radius: 999px; background: var(--negro-2, #121113); transition: border-color .25s; }
.catalogo-buscar:focus-within { border-color: var(--rosa); }
.catalogo-buscar svg { width: 18px; height: 18px; color: var(--texto-2); flex: none; }
.catalogo-buscar input { flex: 1; min-width: 0; border: 0; background: none; color: var(--texto); font: 500 var(--t-sm) var(--f-texto); padding: 13px 0; outline: none; }
.productos-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.producto { display: flex; flex-direction: column; border: 1px solid var(--linea-2); border-radius: 20px; overflow: hidden; background: var(--negro-2, #121113); transition: border-color .3s, transform .35s cubic-bezier(.2,.8,.2,1); }
.producto:hover { border-color: rgba(255,43,122,.5); transform: translateY(-4px); }
.producto.entra { animation: trabajo-entra .5s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--k, 0) * 35ms); }
.producto-foto { position: relative; aspect-ratio: 1; background: #f3f1f2; overflow: hidden; }
.producto-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.producto:hover .producto-foto img { transform: scale(1.06); }
.producto-sin-foto { position: absolute; inset: 0; display: grid; place-items: center; color: var(--rosa); background: linear-gradient(135deg, #1b1a1c, #0e0d0f); }
.producto-sin-foto svg { width: 42px; height: 42px; opacity: .8; }
.producto-etiqueta { position: absolute; top: 12px; left: 12px; padding: 5px 11px; border-radius: 999px; background: var(--rosa); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.producto-cuerpo { display: flex; flex-direction: column; gap: 6px; padding: 16px 16px 18px; flex: 1; }
.producto-cuerpo small { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rosa); }
.producto-cuerpo h3 { font-size: var(--t-md); line-height: 1.25; }
.producto-cuerpo p { color: var(--texto-2); font-size: var(--t-sm); line-height: 1.5; margin: 0; }
.producto-meta { font-size: 12px !important; color: var(--texto) !important; opacity: .75; }
.producto-acciones { display: flex; gap: 8px; margin-top: auto; padding-top: 10px; }
.btn.btn-chico { padding: 9px 14px; font-size: 13px; }
.producto-pack[aria-pressed="true"] { background: var(--rosa-suave, rgba(255,43,122,.14)); border-color: var(--rosa); color: var(--texto); }
.pack-mas { font-weight: 800; }
.catalogo-vacio { text-align: center; color: var(--texto-2); padding: 34px 0; }
.catalogo-vacio a { color: var(--rosa); font-weight: 700; }
.catalogo-medida { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 34px; padding: 28px 30px; border-radius: 22px; background: radial-gradient(120% 140% at 100% 0%, rgba(255,43,122,.22), transparent 55%), var(--negro-2, #121113); border: 1px solid var(--linea-2); }
.catalogo-medida h3 { font-size: var(--t-lg); margin-bottom: 6px; }
.catalogo-medida p { color: var(--texto-2); max-width: 60ch; }
.pack-barra { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 45; display: flex; align-items: center; gap: 14px; width: min(760px, calc(100% - 32px)); padding: 12px 12px 12px 20px; border-radius: 18px; background: rgba(20,19,21,.94); border: 1px solid rgba(255,43,122,.5); box-shadow: 0 24px 60px -20px rgba(0,0,0,.8); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.pack-barra.late { animation: pack-late .45s ease; }
@keyframes pack-late { 40% { transform: translateX(-50%) scale(1.03); } }
.pack-info { display: grid; min-width: 0; flex: 1; }
.pack-info b { font-family: var(--f-display); }
.pack-lista { color: var(--texto-2); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pack-limpiar { background: none; border: 0; color: var(--texto-2); font: 600 13px var(--f-texto); cursor: pointer; text-decoration: underline; }
body.con-pack .wsp-flotante { bottom: 96px; }
@media (max-width: 1100px) { .productos-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) { .catalogo-cabeza { grid-template-columns: 1fr; } .catalogo-chips { justify-content: flex-start; } }
@media (max-width: 640px) {
  .productos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .producto-cuerpo { padding: 12px; }
  .producto-cuerpo p:not(.producto-meta) { display: none; }
  .producto-acciones { flex-direction: column; }
  .producto-acciones .btn { justify-content: center; }
  .catalogo-buscar { max-width: none; }
  .pack-limpiar { display: none; }
  .catalogo-chips { gap: 6px; }
  .catalogo-chips li { padding: 6px 11px; font-size: 12px; }
}

/* ---------- Blog: lista ---------- */
.blog-filtros { margin-bottom: 30px; }
.blog-filtros .filtro { text-decoration: none; }
.blog-filtros .filtro[aria-current="page"] { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.blog-cat { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--rosa); text-decoration: none; }
.blog-meta { color: var(--texto-2); font-size: var(--t-sm); margin: 0; }
.blog-destacado { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding: 18px; margin-bottom: 40px; border: 1px solid var(--linea-2); border-radius: 26px; background: radial-gradient(120% 120% at 100% 0%, rgba(255,43,122,.14), transparent 55%), var(--negro-2, #121113); }
.blog-destacado-foto { display: block; aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; background: var(--negro-3, #1a191b); }
.blog-destacado-foto img, .blog-tarjeta-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.blog-destacado:hover .blog-destacado-foto img, .blog-tarjeta:hover .blog-tarjeta-foto img { transform: scale(1.05); }
.blog-destacado-texto { display: grid; gap: 14px; justify-items: start; padding-right: 12px; }
.blog-destacado h2 { font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.5rem); line-height: 1.1; }
.blog-destacado h2 a, .blog-tarjeta h3 a { color: inherit; text-decoration: none; background: linear-gradient(var(--rosa), var(--rosa)) 0 100% / 0 2px no-repeat; transition: background-size .45s ease; }
.blog-destacado h2 a:hover, .blog-tarjeta h3 a:hover { background-size: 100% 2px; }
.blog-destacado p:not(.blog-meta) { color: var(--texto-2); }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 22px; }
.blog-tarjeta { display: grid; gap: 10px; align-content: start; }
.blog-tarjeta-foto { display: block; aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; background: var(--negro-3, #1a191b); margin-bottom: 6px; }
.blog-sin-foto { display: grid; place-items: center; width: 100%; height: 100%; color: var(--rosa); }
.blog-sin-foto svg { width: 40px; height: 40px; }
.blog-tarjeta h3 { font-size: var(--t-lg); line-height: 1.2; }
.blog-tarjeta p:not(.blog-meta) { color: var(--texto-2); font-size: var(--t-sm); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.paginacion { display: flex; justify-content: center; gap: 8px; margin-top: 44px; }
.paginacion a { min-width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--linea-2); color: var(--texto); text-decoration: none; font-weight: 700; }
.paginacion a[aria-current="page"], .paginacion a:hover { background: var(--rosa); border-color: var(--rosa); color: #fff; }
@media (max-width: 960px) { .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .blog-destacado { grid-template-columns: 1fr; } .blog-destacado-texto { padding: 0 6px 10px; } }
@media (max-width: 600px) { .blog-grid { grid-template-columns: 1fr; } }

/* ---------- Blog: artículo (misma tipografía y estilo para todos) ---------- */
.lectura-progreso { position: fixed; left: 0; right: 0; top: 0; height: 3px; z-index: 60; pointer-events: none; }
.lectura-progreso span { display: block; height: 100%; width: 100%; background: var(--rosa); transform-origin: left; transform: scaleX(var(--p, 0)); box-shadow: 0 0 10px rgba(255,43,122,.7); }
.articulo-cabeza { padding: clamp(40px, 7vw, 90px) 0 0; }
.articulo-cabeza-in { max-width: 900px; display: grid; gap: 16px; justify-items: start; }
.articulo-cabeza h1 { font-size: clamp(2rem, 1.2rem + 3vw, 3.6rem); line-height: 1.05; letter-spacing: -.035em; text-wrap: balance; }
.articulo-entrada { font-size: clamp(1.05rem, 1rem + .35vw, 1.3rem); color: var(--texto-2); line-height: 1.55; max-width: 60ch; }
.articulo-meta { display: flex; align-items: center; gap: 12px; margin-top: 4px; line-height: 1.35; }
.articulo-meta b { color: var(--texto); }
.autor-ini { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--rosa); color: #fff; font-weight: 800; font-family: var(--f-display); }
.articulo-portada { margin-top: clamp(28px, 4vw, 48px); }
.articulo-portada img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 26px; }
.articulo-rejilla { display: grid; grid-template-columns: 240px minmax(0, 720px); justify-content: center; gap: clamp(32px, 5vw, 72px); padding-block: clamp(40px, 6vw, 72px); }
.articulo-lateral { position: sticky; top: 110px; align-self: start; display: grid; gap: 28px; }
.articulo-indice b, .compartir b { display: block; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--texto-2); margin-bottom: 12px; }
.articulo-indice ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; border-left: 2px solid var(--linea-2); }
.articulo-indice a { display: block; padding: 6px 0 6px 14px; margin-left: -2px; border-left: 2px solid transparent; color: var(--texto-2); text-decoration: none; font-size: var(--t-sm); line-height: 1.35; transition: color .2s, border-color .2s; }
.articulo-indice a:hover, .articulo-indice a.activo { color: var(--texto); border-left-color: var(--rosa); }
.compartir div { display: flex; gap: 8px; }
.compartir a, .compartir button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--linea-2); display: grid; place-items: center; color: var(--texto); background: none; cursor: pointer; transition: background .2s, border-color .2s; }
.compartir a:hover, .compartir button:hover { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.compartir svg { width: 18px; height: 18px; }
.compartir button.copiado { background: #1fa855; border-color: #1fa855; color: #fff; }
.articulo-cuerpo { font-size: 1.1rem; line-height: 1.8; color: #d9d3d7; min-width: 0; }
.articulo-cuerpo > * + * { margin-top: 1.25em; }
.articulo-cuerpo h2 { color: var(--texto); font-size: clamp(1.45rem, 1.2rem + .8vw, 1.9rem); line-height: 1.2; letter-spacing: -.02em; margin-top: 2.2em; scroll-margin-top: 110px; position: relative; padding-left: 18px; }
.articulo-cuerpo h2::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 5px; border-radius: 3px; background: var(--rosa); }
.articulo-cuerpo h2:first-child { margin-top: 0; }
.articulo-cuerpo strong { color: var(--texto); }
.articulo-cuerpo a:not(.btn) { color: var(--rosa); text-decoration: underline; text-underline-offset: 3px; }
.art-imagen { margin-inline: 0; }
.art-imagen img { width: 100%; border-radius: 18px; }
.art-imagen.ancha { margin-inline: clamp(-120px, -8vw, 0px); }
.art-imagen figcaption { margin-top: 10px; font-size: var(--t-sm); color: var(--texto-2); text-align: center; }
.art-lista { padding-left: 0; list-style: none; display: grid; gap: 10px; }
.art-lista li { position: relative; padding-left: 30px; }
.art-lista-vinetas li::before { content: ""; position: absolute; left: 8px; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--rosa); }
.art-lista-numeros { counter-reset: n; }
.art-lista-numeros li { counter-increment: n; }
.art-lista-numeros li::before { content: counter(n); position: absolute; left: 0; top: .15em; width: 22px; height: 22px; border-radius: 50%; background: var(--rosa); color: #fff; font: 800 12px/22px var(--f-texto); text-align: center; }
.art-lista-check li svg { position: absolute; left: 0; top: .3em; width: 20px; height: 20px; color: var(--rosa); }
.art-cita { margin: 1.8em 0; padding: 6px 0 6px 28px; border-left: 4px solid var(--rosa); }
.art-cita p { font-family: var(--f-display); font-size: clamp(1.3rem, 1.1rem + .7vw, 1.7rem); line-height: 1.35; color: var(--texto); letter-spacing: -.01em; }
.art-cita cite { display: block; margin-top: 10px; font-style: normal; font-size: var(--t-sm); color: var(--texto-2); }
.art-destacado { display: flex; gap: 16px; padding: 22px 24px; border-radius: 18px; background: rgba(255,43,122,.08); border: 1px solid rgba(255,43,122,.35); }
.art-destacado-icono { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--rosa); color: #fff; }
.art-destacado-icono svg { width: 18px; height: 18px; }
.art-destacado b { display: block; color: var(--texto); font-family: var(--f-display); font-size: 1.1rem; margin-bottom: 4px; }
.art-destacado p { margin: 0; }
.art-destacado p + p { margin-top: .8em; }
.art-boton { margin-top: 1.8em; }
.art-video { position: relative; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #000; }
.art-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.articulo-cta { margin-top: 3em !important; padding: 30px; border-radius: 22px; background: radial-gradient(120% 140% at 100% 0%, rgba(255,43,122,.28), transparent 55%), var(--negro-2, #121113); border: 1px solid var(--linea-2); display: grid; gap: 12px; justify-items: start; }
.articulo-cta h2 { margin: 0; padding: 0; font-size: 1.6rem; }
.articulo-cta h2::before { display: none; }
.articulo-cta h2 .acento { color: var(--rosa); }
@media (max-width: 1080px) {
  .articulo-rejilla { grid-template-columns: minmax(0, 720px); }
  .articulo-lateral { position: static; order: 2; }
  .articulo-indice { display: none; }
  .art-imagen.ancha { margin-inline: 0; }
}
@media (max-width: 600px) { .articulo-cuerpo { font-size: 1.02rem; } .articulo-portada img { border-radius: 18px; aspect-ratio: 16 / 10; } }

/* ==========================================================
   Contacto
   ========================================================== */
.contacto-cabeza-in { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(28px, 5vw, 72px); align-items: end; }
.contacto-cabeza h1 { max-width: 12ch; }
.estado-atencion { display: inline-flex; align-items: center; gap: 10px; margin: 26px 0 0; padding: 8px 14px 8px 12px; border-radius: 999px; border: 1px solid var(--linea-2); font-size: var(--t-sm); font-weight: 700; color: var(--texto); background: rgba(255,255,255,.03); }
.estado-punto { width: 9px; height: 9px; border-radius: 50%; background: var(--texto-3); position: relative; flex: none; }
.estado-atencion.abierto .estado-punto { background: var(--verde-wsp); }
.estado-atencion.abierto .estado-punto::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid var(--verde-wsp); opacity: 0; animation: pulso-estado 2s ease-out infinite; }
@keyframes pulso-estado { 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(1.4); opacity: 0; } }
.canales { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.canal { display: flex; align-items: center; gap: 14px; padding: 14px 18px 14px 14px; border-radius: 16px; background: var(--negro-2); border: 1px solid var(--linea); transition: border-color .25s, transform .25s, background .25s; }
.canal:hover { border-color: var(--rosa-borde); transform: translateX(4px); }
.canal-icono { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); flex: none; }
.canal-icono svg { width: 22px; height: 22px; }
.canal-wsp { background: linear-gradient(120deg, rgba(37,211,102,.14), rgba(37,211,102,.04)); border-color: rgba(37,211,102,.35); }
.canal-wsp .canal-icono { background: var(--verde-wsp); color: #06210f; }
.canal-wsp:hover { border-color: var(--verde-wsp); }
.canal-texto { display: grid; min-width: 0; }
.canal-texto small { font-size: var(--t-xs); color: var(--texto-3); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.canal-texto b { font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canal-flecha { margin-left: auto; color: var(--texto-3); transition: color .25s, transform .25s; }
.canal:hover .canal-flecha { color: var(--rosa); transform: translateX(3px); }

.contacto-seccion { padding-top: clamp(40px, 6vw, 72px); }
.contacto-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.contacto-caja { position: relative; background: var(--negro-2); border: 1px solid var(--linea); border-radius: 24px; padding: clamp(22px, 4vw, 44px); scroll-margin-top: 110px; }
.contacto-caja::before { content: ""; position: absolute; left: 32px; right: 32px; top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--rosa), transparent); }
.form-cabeza { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 26px; }
.form-cabeza h2 { margin: 0; font-size: var(--t-xl); letter-spacing: -.03em; line-height: 1.05; }
.form-cabeza h2 .acento { color: var(--rosa); }
.sello-respuesta { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; background: var(--rosa-suave); color: var(--rosa-claro); font-size: var(--t-xs); font-weight: 800; }
.sello-respuesta svg { width: 15px; height: 15px; }
.form-aviso { margin: 0 0 20px; padding: 12px 16px; border-radius: 12px; background: rgba(255,43,122,.1); border: 1px solid var(--rosa-borde); color: var(--texto); font-size: var(--t-sm); }

.contacto-form .campo { display: grid; gap: 8px; margin: 0 0 18px; min-width: 0; }
.contacto-form fieldset.campo { border: 0; padding: 0; }
.contacto-form label, .contacto-form legend { font-size: var(--t-sm); font-weight: 700; color: var(--texto); padding: 0; }
.contacto-form legend { margin-bottom: 12px; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.contacto-form legend em, .contacto-form .req { font-style: normal; font-weight: 600; color: var(--texto-3); font-size: var(--t-xs); }
.contacto-form .req { color: var(--rosa); font-size: inherit; }
.contacto-form input[type=text], .contacto-form input[type=email], .contacto-form input[type=tel], .contacto-form input[type=url], .contacto-form textarea, .contacto-form select {
  width: 100%; font: inherit; font-size: 1rem; color: var(--texto); background: var(--negro); border: 1px solid var(--linea-2); border-radius: 12px; padding: 14px 16px; transition: border-color .2s, box-shadow .2s; }
.contacto-form textarea { resize: vertical; min-height: 140px; line-height: 1.55; }
.contacto-form select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23b3abb0' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 42px; }
.contacto-form ::placeholder { color: var(--texto-3); }
.contacto-form input:focus, .contacto-form textarea:focus, .contacto-form select:focus { outline: none; border-color: var(--rosa); box-shadow: 0 0 0 4px var(--rosa-suave); }
.contacto-form .error { color: var(--rosa-claro); font-size: var(--t-xs); font-weight: 700; min-height: 0; }
.contacto-form .error:empty { display: none; }
.contacto-form .con-error input, .contacto-form .con-error textarea { border-color: var(--rosa); }
.campos-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.campo-nota { margin: -8px 0 22px; font-size: var(--t-xs); color: var(--texto-3); }
.campo-corto { max-width: 340px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; cursor: pointer; }
.chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--linea-2); font-size: var(--t-sm); font-weight: 600; color: var(--texto-2); transition: all .2s; user-select: none; }
.chip span svg { width: 16px; height: 16px; color: var(--texto-3); transition: color .2s; }
.chip:hover span { border-color: var(--rosa-borde); color: var(--texto); }
.chip input:checked + span { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.chip input:checked + span svg { color: #fff; }
.chip input:focus-visible + span { outline: 2px solid var(--rosa); outline-offset: 3px; }
.campo-trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-pie { display: grid; gap: 14px; margin-top: 8px; padding-top: 22px; border-top: 1px solid var(--linea); }
.acepto { display: flex !important; gap: 12px; align-items: flex-start; font-weight: 500 !important; color: var(--texto-2) !important; line-height: 1.5; cursor: pointer; }
.acepto input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--rosa); flex: none; }
.acepto a { color: var(--rosa); text-decoration: underline; text-underline-offset: 3px; }
.acepto.con-error span { color: var(--texto); }
.btn-enviar { justify-self: start; min-width: 220px; justify-content: center; position: relative; }
.btn-enviar-carga { display: none; width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,.35); border-top-color: #fff; animation: girar .7s linear infinite; }
.btn-enviar.enviando { pointer-events: none; opacity: .85; }
.btn-enviar.enviando .btn-enviar-carga { display: inline-block; }
.btn-enviar.enviando > span:last-child { display: none; }
@keyframes girar { to { transform: rotate(360deg); } }

.contacto-exito { text-align: center; padding: clamp(20px, 5vw, 48px) 0; outline: none; }
.exito-check { display: inline-grid; width: 84px; height: 84px; color: var(--verde-wsp); margin-bottom: 18px; }
.exito-check circle { stroke-dasharray: 151; stroke-dashoffset: 151; animation: trazo .7s ease forwards; }
.exito-check path { stroke-dasharray: 40; stroke-dashoffset: 40; animation: trazo .4s .6s ease forwards; }
@keyframes trazo { to { stroke-dashoffset: 0; } }
.contacto-exito h2 { font-size: var(--t-xl); letter-spacing: -.03em; margin: 0 0 12px; }
.contacto-exito p { color: var(--texto-2); max-width: 46ch; margin: 0 auto 26px; }
.exito-acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.exito-acciones svg { width: 18px; height: 18px; }

.contacto-lateral { display: grid; gap: 14px; position: sticky; top: 110px; }
.lateral-bloque { padding: 22px 24px; border-radius: 18px; border: 1px solid var(--linea); }
.lateral-titulo { font-size: var(--t-xs) !important; font-family: var(--f-texto); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); margin: 0 0 16px; }
.pasos-despues { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; position: relative; }
.pasos-despues::before { content: ""; position: absolute; left: 15px; top: 18px; bottom: 18px; width: 2px; background: linear-gradient(var(--rosa), rgba(255,43,122,.1)); }
.pasos-despues li { display: flex; gap: 14px; position: relative; }
.paso-n { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--negro); border: 2px solid var(--rosa); color: var(--rosa); font-weight: 800; font-size: var(--t-sm); }
.pasos-despues b { display: block; margin-top: 4px; }
.pasos-despues p { margin: 4px 0 0; color: var(--texto-2); font-size: var(--t-sm); line-height: 1.5; }
.horario { list-style: none; margin: 0; padding: 0; }
.horario li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--linea-2); font-size: var(--t-sm); color: var(--texto-2); }
.horario li:last-child { border-bottom: 0; }
.horario li b { color: var(--texto); white-space: nowrap; }
.horario li.hoy { color: var(--texto); }
.horario li.hoy span::after { content: "Hoy"; margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: var(--rosa); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; vertical-align: 1px; }
.horario-nota { margin: 12px 0 0; font-size: var(--t-xs); color: var(--texto-3); line-height: 1.5; }
.lateral-lugar p { margin: 0; color: var(--texto-2); font-size: var(--t-sm); line-height: 1.6; }
.lateral-lugar b { color: var(--texto); font-size: 1rem; }
.redes-contacto { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.redes-contacto a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--linea); font-size: var(--t-sm); font-weight: 700; color: var(--texto-2); transition: all .2s; }
.redes-contacto a:hover { border-color: var(--rosa-borde); color: var(--texto); }
.redes-contacto svg { width: 18px; height: 18px; }

@media (max-width: 960px) {
  .contacto-cabeza-in, .contacto-grid { grid-template-columns: 1fr; }
  .contacto-lateral { position: static; }
}
@media (max-width: 600px) {
  .campos-2 { grid-template-columns: 1fr; }
  .btn-enviar { justify-self: stretch; }
  .contacto-caja { border-radius: 18px; }
  .canal-texto b { font-size: 1rem; }
}

/* ---------- Páginas legales ---------- */
.legal-grid { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: clamp(28px, 5vw, 72px); justify-content: center; align-items: start; }
.legal-indice { position: sticky; top: 110px; font-size: var(--t-sm); }
.legal-indice b { display: block; font-size: var(--t-xs); letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 12px; }
.legal-indice ol { margin: 0; padding: 0 0 0 18px; display: grid; gap: 8px; color: var(--texto-3); }
.legal-indice a { color: var(--texto-2); }
.legal-indice a:hover { color: var(--rosa); }
.legal-cuerpo { font-size: 1.02rem; }
.legal-cuerpo h2 { font-size: 1.35rem; }
@media (max-width: 860px) { .legal-grid { grid-template-columns: 1fr; } .legal-indice { position: static; } }
@media (max-width: 600px) {
  .campo-chips .chips { gap: 6px; }
  .campo-chips .chip span { padding: 8px 12px; font-size: 13px; gap: 6px; }
  .campo-chips .chip span svg { display: none; }
}

/* ---------- Libro de Reclamaciones ---------- */
.reclamos-titulo { display: flex; gap: clamp(16px, 3vw, 28px); align-items: flex-start; }
.libro-icono { width: clamp(64px, 8vw, 92px); aspect-ratio: 1; border-radius: 22px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); flex: none; margin-top: 18px; border: 1px solid var(--rosa-borde); }
.libro-icono svg { width: 58%; }
.reclamos-titulo h1 { max-width: 14ch; }
.reclamos-contenedor { max-width: 920px; }
.proveedor-caja { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px 24px; padding: 20px 24px; border-radius: 18px; border: 1px solid var(--linea); background: var(--negro-2); margin-bottom: 22px; }
.proveedor-caja small { display: block; font-size: var(--t-xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-3); }
.proveedor-caja b { font-size: .98rem; }
.reclamos-form { background: var(--negro-2); border: 1px solid var(--linea); border-radius: 24px; padding: clamp(22px, 4vw, 40px); }
.bloque-hoja { border: 0; padding: 0; margin: 0 0 28px; min-width: 0; }
.bloque-hoja + .bloque-hoja { padding-top: 26px; border-top: 1px solid var(--linea); }
.reclamos-form .bloque-hoja > legend { display: flex; align-items: center; gap: 12px; font-family: var(--f-display); font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; margin-bottom: 18px; }
.bloque-hoja > legend span { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--rosa); color: #fff; font-size: 14px; flex: none; font-family: var(--f-texto); }
.campo-ancho { grid-column: 1 / -1; }
.doc-fila { display: grid; grid-template-columns: 120px 1fr; gap: 8px; }
.tipo-reclamo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.tipo-opcion { position: relative; cursor: pointer; }
.tipo-opcion input { position: absolute; opacity: 0; }
.tipo-opcion > span { display: grid; gap: 4px; height: 100%; padding: 16px 18px 16px 46px; border-radius: 14px; border: 1px solid var(--linea-2); transition: border-color .2s, background .2s; position: relative; }
.tipo-opcion > span::before { content: ""; position: absolute; left: 16px; top: 18px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--texto-3); }
.tipo-opcion input:checked + span { border-color: var(--rosa); background: var(--rosa-suave); }
.tipo-opcion input:checked + span::before { border-color: var(--rosa); background: radial-gradient(var(--rosa) 45%, transparent 50%); }
.tipo-opcion input:focus-visible + span { outline: 2px solid var(--rosa); outline-offset: 3px; }
.tipo-opcion small { color: var(--texto-2); font-size: var(--t-xs); line-height: 1.45; }
.nota-legal { margin: 0; font-size: var(--t-xs); color: var(--texto-3); line-height: 1.55; }
.hoja-ok-cabeza { display: flex; gap: 20px; align-items: center; margin-bottom: 24px; }
.hoja-ok-cabeza .exito-check { width: 64px; height: 64px; margin: 0; flex: none; }
.hoja-ok-cabeza h2 { margin: 0 0 6px; font-size: var(--t-xl); letter-spacing: -.03em; }
.hoja-ok-cabeza p { margin: 0; color: var(--texto-2); }
.hoja-papel { background: #fff; color: #1b1b1f; border-radius: 18px; padding: clamp(18px, 4vw, 36px); }
.hoja-acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.pie-libro { display: inline-flex; align-items: center; gap: 8px; }
.pie-libro svg { width: 22px; height: 22px; color: var(--rosa); }
@media (max-width: 640px) { .tipo-reclamo { grid-template-columns: 1fr; } .hoja-ok-cabeza { align-items: flex-start; } .reclamos-titulo { flex-direction: column; gap: 0; } }
@media print {
  .encabezado, .pie, .wsp-flotante, .interna-cabeza, .hoja-acciones, .hoja-ok-cabeza .exito-check { display: none !important; }
  body { background: #fff; color: #000; }
  .hoja-papel { padding: 0; }
  .hoja-ok-cabeza h2, .hoja-ok-cabeza p { color: #000; }
}

/* ---------- Reels ---------- */
.reels-seccion { overflow: hidden; }
.reels-cabeza { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.reels-cabeza h2 { margin: 0; font-size: var(--t-2xl); letter-spacing: -.035em; line-height: 1; }
.reels-cabeza h2 .acento { color: var(--rosa); }
.reels-nav { display: flex; gap: 8px; }
.reels-flecha { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--linea-2); background: transparent; color: var(--texto); font-size: 26px; line-height: 1; cursor: pointer; transition: all .2s; }
.reels-flecha:hover { background: var(--rosa); border-color: var(--rosa); }
.reels-flecha:disabled { opacity: .3; pointer-events: none; }
.reels-pista { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-inline: max(var(--gutter), calc((100vw - var(--ancho)) / 2 + var(--gutter))); scroll-padding-inline: max(var(--gutter), calc((100vw - var(--ancho)) / 2 + var(--gutter))); }
.reels-pista::-webkit-scrollbar { display: none; }
.reels-lista { list-style: none; margin: 0; padding: 0 0 8px; display: flex; gap: 16px; width: max-content; }
.reel { width: clamp(200px, 22vw, 260px); scroll-snap-align: start; flex: none; }
.reel-btn { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; border: 0; padding: 0; border-radius: 22px; overflow: hidden; cursor: pointer; background: var(--negro-3); color: #fff; isolation: isolate; box-shadow: 0 24px 50px -30px rgba(0,0,0,.9); }
.reel-btn img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.reel-btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, transparent 28%, transparent 55%, rgba(0,0,0,.85) 100%); z-index: 1; }
.reel-btn:hover img { transform: scale(1.06); }
.reel-btn:focus-visible { outline: 3px solid var(--rosa); outline-offset: 3px; }
.reel-fondo { position: absolute; inset: 0; display: grid; place-items: center; }
.reel-fondo svg { width: 38%; opacity: .95; filter: drop-shadow(0 10px 30px rgba(0,0,0,.35)); }
.reel-instagram .reel-fondo { background: radial-gradient(circle at 25% 110%, #fdd35a 0%, #fd5b3a 28%, #d6297b 55%, #7a2fd0 90%); }
.reel-tiktok .reel-fondo { background: radial-gradient(circle at 20% 15%, rgba(37,244,238,.45), transparent 45%), radial-gradient(circle at 85% 90%, rgba(254,44,85,.55), transparent 50%), #0b0b0d; }
.reel-facebook .reel-fondo { background: linear-gradient(160deg, #3b82f6, #1d4ed8 60%, #0b2a7a); }
.reel-youtube .reel-fondo { background: linear-gradient(160deg, #ff3d3d, #b50000); }
.reel-red { position: absolute; top: 14px; left: 14px; z-index: 2; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(0,0,0,.45); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.reel-red svg { width: 18px; height: 18px; }
.reel-play { position: absolute; left: 50%; top: 50%; z-index: 2; width: 62px; height: 62px; margin: -31px 0 0 -31px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.18); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.4); transition: transform .3s, background .3s; }
.reel-play svg { width: 26px; height: 26px; margin-left: 3px; }
.reel-btn:hover .reel-play { transform: scale(1.1); background: var(--rosa); border-color: var(--rosa); }
.reel-titulo { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 2; text-align: left; font-weight: 800; font-size: .98rem; line-height: 1.25; text-shadow: 0 2px 12px rgba(0,0,0,.5); }
.reel-visor { padding: 0; border: 0; background: transparent; max-width: none; max-height: none; width: 100vw; height: 100dvh; margin: 0; }
.reel-visor::backdrop { background: rgba(5,5,6,.9); backdrop-filter: blur(8px); }
.reel-visor[open] { display: grid; place-items: center; }
.reel-visor-caja { position: relative; display: grid; gap: 12px; justify-items: center; }
.reel-marco { width: min(400px, calc(100vw - 32px), calc((100dvh - 120px) * 9 / 16)); aspect-ratio: 9 / 16; border-radius: 18px; overflow: hidden; background: #000 radial-gradient(circle, #222, #000); display: grid; place-items: center; }
.reel-marco.cargando::before { content: ""; width: 34px; height: 34px; border-radius: 50%; border: 3px solid rgba(255,255,255,.2); border-top-color: var(--rosa); animation: girar .8s linear infinite; grid-area: 1 / 1; }
.reel-marco iframe { width: 100%; height: 100%; border: 0; grid-area: 1 / 1; background: #fff; }
.reel-visor-pie { display: flex; gap: 16px; align-items: center; justify-content: space-between; width: 100%; color: #fff; font-size: var(--t-sm); font-weight: 700; }
.reel-visor-pie a { color: var(--rosa-claro); white-space: nowrap; }
.reel-visor-cerrar, .reel-visor-nav { position: absolute; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: rgba(20,20,22,.8); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.reel-visor-cerrar { top: -6px; right: -62px; }
.reel-visor-nav { top: 45%; }
.reel-prev { left: -66px; }
.reel-sig { right: -66px; }
.reel-visor-cerrar:hover, .reel-visor-nav:hover { background: var(--rosa); border-color: var(--rosa); }
@media (max-width: 640px) {
  .reel { width: 64vw; }
  .reels-nav { display: none; }
  .reel-visor-cerrar { top: auto; bottom: -60px; right: 50%; margin-right: -23px; }
  .reel-prev { left: 4px; } .reel-sig { right: 4px; }
  .reel-visor-nav { background: rgba(20,20,22,.6); }
  .reel-visor-caja { padding-bottom: 60px; }
}
.lugar-google { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: var(--t-sm); font-weight: 700; color: var(--rosa-claro); }
.lugar-google svg { width: 18px; height: 18px; }
.lugar-google:hover { color: #fff; }

/* ---------- Opiniones ---------- */
.opiniones-cabeza { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; margin-bottom: 36px; }
.opiniones-cabeza .cabeza-seccion { margin: 0; }
.nota-google { display: grid; gap: 6px; padding: 20px 24px; border-radius: 20px; background: var(--negro-2); border: 1px solid var(--linea); min-width: 260px; }
.nota-google-num { display: flex; align-items: center; gap: 12px; }
.nota-google-num b { font-family: var(--f-display); font-size: 2.6rem; line-height: 1; letter-spacing: -.03em; }
.nota-google p { margin: 0; color: var(--texto-2); font-size: var(--t-sm); }
.nota-google-acciones { display: flex; align-items: center; gap: 14px; margin-top: 8px; flex-wrap: wrap; }
.nota-google-ver { font-size: var(--t-sm); font-weight: 700; color: var(--texto-2); }
.nota-google-ver:hover { color: var(--rosa); }
.estrellas { display: inline-flex; gap: 2px; color: #fbbf24; }
.estrellas svg { width: 18px; height: 18px; }
.opiniones-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.opiniones-lista.cantidad-1 { grid-template-columns: minmax(0, 780px); }
.opiniones-lista.cantidad-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opinion { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 28px 26px 22px; border-radius: 22px; background: linear-gradient(160deg, var(--negro-2), var(--negro)); border: 1px solid var(--linea); overflow: hidden; }
.opinion-comillas { position: absolute; right: 18px; top: -18px; font-family: Georgia, serif; font-size: 9rem; line-height: 1; color: var(--rosa); opacity: .16; pointer-events: none; }
.opinion-texto { margin: 0; font-size: 1.05rem; line-height: 1.65; color: var(--texto); }
.opinion-texto p { margin: 0; }
.opinion-texto.cortado { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.cantidad-1 .opinion-texto { font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); line-height: 1.55; }
.opinion-mas { align-self: flex-start; background: none; border: 0; padding: 0; color: var(--rosa-claro); font: 700 var(--t-sm) var(--f-texto); cursor: pointer; }
.opinion-pie { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--linea); }
.opinion-inicial, .opinion-foto { width: 44px; height: 44px; border-radius: 50%; flex: none; object-fit: cover; }
.opinion-inicial { display: grid; place-items: center; background: var(--rosa); color: #fff; font-weight: 800; font-family: var(--f-display); font-size: 1.1rem; }
.opinion-autor { display: grid; min-width: 0; }
.opinion-autor small { color: var(--texto-3); font-size: var(--t-xs); }
.opinion-fuente { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-xs); font-weight: 700; color: var(--texto-3); white-space: nowrap; }
.opinion-fuente svg { width: 16px; height: 16px; }
.fuente-google svg { color: #34a853; }
.fuente-facebook svg { color: #3b82f6; }
a.opinion-fuente:hover { color: var(--texto); }
@media (max-width: 900px) {
  .opiniones-lista, .opiniones-lista.cantidad-2 { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(84vw, 360px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  .opiniones-lista.cantidad-1 { grid-auto-columns: 100%; margin-inline: 0; padding-inline: 0; }
  .opinion { scroll-snap-align: start; }
  .nota-google { width: 100%; }
}
.opinion-recomienda { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 5px 12px; border-radius: 999px; background: rgba(59,130,246,.14); color: #93c5fd; font-size: var(--t-xs); font-weight: 800; }
.opinion-recomienda svg { width: 15px; height: 15px; }

/* ---------- Brief creativo ---------- */
.brief-pagina { padding-block: clamp(40px, 6vw, 80px) var(--seccion); position: relative; overflow: clip; }
.brief-pagina::before { content: ""; position: absolute; width: 700px; height: 700px; left: -260px; top: -320px; background: radial-gradient(closest-side, rgba(255,43,122,.18), transparent); pointer-events: none; }
.brief-grid { position: relative; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.brief-intro { position: sticky; top: 110px; }
.brief-intro h1 { font-size: clamp(2.4rem, 1.2rem + 4vw, 4.4rem); font-weight: 800; letter-spacing: -.04em; line-height: .98; margin: 16px 0 18px; }
.brief-intro h1 .acento { color: var(--rosa); }
.brief-intro .entrada { color: var(--texto-2); max-width: 44ch; }
.brief-ante { margin: 22px 0 0; font-size: var(--t-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--rosa); }
.brief-datos { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.brief-datos li { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--linea-2); font-size: var(--t-sm); font-weight: 700; }
.brief-progreso { margin-top: 32px; }
.brief-progreso-barra { height: 4px; border-radius: 4px; background: var(--linea); overflow: hidden; margin-bottom: 18px; }
.brief-progreso-barra span { display: block; height: 100%; width: 12.5%; background: linear-gradient(90deg, var(--rosa), var(--rosa-claro)); transition: width .5s cubic-bezier(.2,.7,.2,1); }
.brief-progreso ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.brief-progreso li { display: flex; align-items: center; gap: 12px; padding: 6px 0; font-size: var(--t-sm); font-weight: 600; color: var(--texto-3); transition: color .3s; }
.brief-progreso li span { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; border: 1.5px solid var(--linea-2); transition: all .3s; }
.brief-progreso li.hecho { color: var(--texto-2); }
.brief-progreso li.hecho span { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.brief-progreso li.actual { color: var(--texto); }
.brief-progreso li.actual span { border-color: var(--rosa); color: var(--rosa); box-shadow: 0 0 0 4px var(--rosa-suave); }
html:not(.js) .brief-progreso { display: none; }
.brief-caja { background: var(--negro-2); border: 1px solid var(--linea); border-radius: 26px; padding: clamp(22px, 4vw, 44px); scroll-margin-top: 110px; min-height: 480px; }
.bpaso { border: 0; padding: 0; margin: 0; min-width: 0; }
html.js .bpaso:not(.activo) { display: none; }
html:not(.js) .bpaso + .bpaso { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--linea); }
html.js .bpaso.activo { animation: paso-entra .45s cubic-bezier(.2,.7,.2,1); }
@keyframes paso-entra { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
.paso-cabeza { margin-bottom: 24px; }
.paso-cabeza small { font-size: var(--t-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rosa); }
.paso-cabeza h2 { margin: 8px 0 6px; font-size: var(--t-xl); letter-spacing: -.03em; line-height: 1.05; }
.paso-cabeza p { margin: 0; color: var(--texto-2); }
.paso-sub { margin: 20px 0 10px; font-size: var(--t-sm); font-weight: 700; }
.op-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.op-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.op-tarjeta { position: relative; cursor: pointer; }
.op-tarjeta input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.op-tarjeta > span { display: grid; gap: 4px; height: 100%; padding: 16px 40px 16px 16px; border-radius: 14px; border: 1px solid var(--linea-2); background: var(--negro); transition: border-color .2s, background .2s, transform .2s; position: relative; }
.op-tarjeta:hover > span { border-color: var(--rosa-borde); transform: translateY(-2px); }
.op-tarjeta b { font-size: .98rem; }
.op-tarjeta small { color: var(--texto-3); font-size: var(--t-xs); }
.op-icono { font-style: normal; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); margin-bottom: 6px; }
.op-icono svg { width: 18px; height: 18px; }
.op-check { position: absolute; top: 12px; right: 12px; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--linea-2); display: grid; place-items: center; color: transparent; transition: all .2s; }
.op-check svg { width: 12px; height: 12px; }
.op-tarjeta input:checked + span { border-color: var(--rosa); background: linear-gradient(160deg, rgba(255,43,122,.14), rgba(255,43,122,.04)); }
.op-tarjeta input:checked + span .op-check { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.op-tarjeta input:focus-visible + span { outline: 2px solid var(--rosa); outline-offset: 3px; }
.paso-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--linea); }
html:not(.js) .paso-nav [data-atras], html:not(.js) .paso-nav [data-siguiente] { display: none; }
.brief-form .error:empty { display: none; }
.brief-form .error { display: block; margin-top: 8px; }
.ref-agregar { display: flex; gap: 8px; }
.ref-agregar input { flex: 1; min-width: 0; }
.ref-lista { list-style: none; margin: 12px 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ref-lista li { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 6px 8px 6px 14px; border-radius: 999px; background: var(--rosa-suave); color: var(--rosa-claro); font-size: var(--t-sm); font-weight: 600; }
.ref-lista li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ref-lista button { width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(255,255,255,.1); color: inherit; cursor: pointer; flex: none; }
.brief-exito { text-align: center; padding: 20px 0; outline: none; }
.brief-exito h2 { font-size: var(--t-xl); letter-spacing: -.03em; margin: 0 0 12px; }
.brief-exito > p { color: var(--texto-2); max-width: 46ch; margin: 0 auto 26px; }
.brief-promesas { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; text-align: left; }
.brief-promesas li { display: grid; gap: 4px; padding: 16px; border-radius: 14px; border: 1px solid var(--linea); }
.brief-promesas span { color: var(--texto-2); font-size: var(--t-sm); line-height: 1.5; }
.brief-exito .btn-wsp svg { width: 18px; height: 18px; }
@media (max-width: 960px) {
  .brief-grid { grid-template-columns: 1fr; }
  .brief-intro { position: static; }
  .brief-progreso ol { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .brief-progreso li { font-size: 0; gap: 0; padding: 0; }
  .brief-progreso li span { font-size: 12px; }
  .brief-progreso li.actual { font-size: var(--t-sm); gap: 8px; white-space: nowrap; }
}
@media (max-width: 600px) {
  .op-grid, .op-grid-3, .brief-promesas { grid-template-columns: 1fr; }
  .op-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paso-nav .btn { flex: 1; justify-content: center; }
}

/* ---------- Proceso de trabajo (presentación) ---------- */
.proceso-pres { position: relative; }
.pres-pista { position: sticky; top: var(--alto-cab, 72px); z-index: 20; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; padding: 12px max(var(--gutter), calc((100vw - var(--ancho)) / 2 + var(--gutter))); background: rgba(10,10,11,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--linea); }
.pres-pista::-webkit-scrollbar { display: none; }
html:not(.js) .pres-pista, html:not(.js) .pres-nav { display: none; }
.pres-paso { flex: none; display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px 7px 7px; border-radius: 999px; border: 0; background: none; color: var(--texto-3); font: 600 var(--t-sm) var(--f-texto); cursor: pointer; transition: background .25s, color .25s; }
.pres-paso-n { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--linea-2); font-size: 12px; font-weight: 800; transition: all .3s; }
.pres-paso:hover { color: var(--texto); }
.pres-paso.hecho { color: var(--rosa-claro); }
.pres-paso.hecho .pres-paso-n { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.pres-paso[aria-selected="true"] { background: var(--rosa-suave); color: #fff; }
.pres-paso[aria-selected="true"] .pres-paso-n { background: var(--rosa); border-color: var(--rosa); color: #fff; box-shadow: 0 0 18px rgba(255,43,122,.45); }
.pres-diapos { position: relative; }
html.js .diapo:not(.activa) { display: none; }
html.js .diapo.activa { animation: diapo-entra .55s cubic-bezier(.2,.7,.2,1); }
html.js .diapo.activa.desde-izq { animation-name: diapo-entra-izq; }
@keyframes diapo-entra { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes diapo-entra-izq { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }
.diapo { padding-block: clamp(40px, 6vw, 80px); min-height: calc(100svh - 240px); }
html:not(.js) .diapo + .diapo { border-top: 1px solid var(--linea); }
.diapo-intro { text-align: center; position: relative; overflow: hidden; }
.diapo-intro::before { content: ""; position: absolute; width: 900px; height: 900px; left: 50%; top: -520px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(255,43,122,.2), transparent); pointer-events: none; }
.diapo-intro .contenedor { position: relative; display: grid; justify-items: center; }
.diapo-intro .migas { justify-content: center; }
.diapo-intro h1 { font-size: clamp(2.8rem, 1.2rem + 6vw, 6.4rem); font-weight: 800; letter-spacing: -.045em; line-height: .92; margin: 22px 0 20px; max-width: 12ch; }
.diapo-intro h1 .acento, .diapo h2 .acento, .diapo-cierre h2 .acento { color: var(--rosa); }
.diapo-intro .entrada { color: var(--texto-2); max-width: 56ch; margin: 0 auto; }
.pres-cifras { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); width: min(720px, 100%); border: 1px solid var(--linea); border-radius: 20px; overflow: hidden; }
.pres-cifras li { display: grid; gap: 4px; padding: 24px 12px; background: var(--negro-2); }
.pres-cifras li + li { border-left: 1px solid var(--linea); }
.pres-cifras b { font-family: var(--f-display); font-size: clamp(2rem, 1.4rem + 2vw, 3rem); color: var(--rosa); line-height: 1; letter-spacing: -.03em; }
.pres-cifras span { font-size: var(--t-xs); color: var(--texto-3); font-weight: 700; }
.pres-fichas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 36px; max-width: 760px; }
.pres-ficha { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; border: 1px solid var(--linea-2); background: var(--negro-2); color: var(--texto-2); font: 600 var(--t-sm) var(--f-texto); cursor: pointer; transition: all .2s; }
.pres-ficha svg { width: 16px; height: 16px; color: var(--rosa); }
.pres-ficha:hover { border-color: var(--rosa-borde); color: #fff; background: var(--rosa-suave); }
.diapo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.diapo-izq { position: relative; }
.diapo-num { position: absolute; left: -8px; top: -40px; font-family: var(--f-display); font-weight: 800; font-size: clamp(7rem, 5rem + 8vw, 12rem); line-height: 1; color: rgba(255,43,122,.06); pointer-events: none; letter-spacing: -.05em; }
.diapo-etq { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 8px; border: 1px solid var(--rosa-borde); background: var(--rosa-suave); color: var(--rosa); font-size: var(--t-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.diapo-etq svg { width: 15px; height: 15px; }
.diapo h2 { position: relative; font-size: clamp(2.4rem, 1.4rem + 3.4vw, 4.4rem); letter-spacing: -.04em; line-height: .96; margin: 20px 0 18px; }
.diapo-texto { color: var(--texto-2); font-size: var(--t-md); line-height: 1.7; margin: 0 0 26px; }
.diapo-puntos { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.diapo-puntos li { display: flex; gap: 12px; align-items: flex-start; color: var(--texto-2); line-height: 1.55; }
.diapo-puntos svg { width: 22px; height: 22px; padding: 5px; border-radius: 50%; background: var(--rosa-suave); color: var(--rosa); flex: none; margin-top: 1px; }
.diapo-der { display: grid; gap: 18px; }
.diapo-caso, .diapo-datos { position: relative; padding: 26px; border-radius: 20px; background: var(--negro-2); border: 1px solid var(--linea); overflow: hidden; }
.diapo-caso::before { content: ""; position: absolute; width: 220px; height: 220px; right: -80px; top: -80px; background: radial-gradient(closest-side, rgba(255,43,122,.14), transparent); }
.diapo-caso small, .diapo-datos-t { display: block; font-size: var(--t-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rosa); margin-bottom: 8px; }
.diapo-datos-t { color: var(--texto-3); margin-bottom: 18px; }
.diapo-caso > b { display: block; font-size: 1.1rem; margin-bottom: 10px; }
.diapo-caso p { margin: 0 0 8px; color: var(--texto-2); line-height: 1.7; }
.diapo-caso strong { color: var(--rosa-claro); }
.barra { display: grid; grid-template-columns: 150px 1fr 44px; align-items: center; gap: 12px; font-size: var(--t-sm); color: var(--texto-2); }
.barra + .barra { margin-top: 14px; }
.barra i { height: 7px; border-radius: 6px; background: rgba(255,255,255,.06); overflow: hidden; }
.barra em { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, var(--rosa), var(--rosa-claro)); transition: width 1.2s cubic-bezier(.2,.7,.2,1) .2s; }
.diapo.activa .barra em, html:not(.js) .barra em { width: var(--v); }
.barra b { color: var(--rosa); text-align: right; }
.cifras-mini { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cifras-mini li { display: grid; gap: 4px; padding: 18px 14px; border-radius: 14px; border: 1px solid var(--linea); text-align: center; background: var(--negro); }
.cifras-mini b { font-family: var(--f-display); font-size: 2.2rem; line-height: 1; color: var(--rosa); letter-spacing: -.03em; }
.cifras-mini span { font-size: var(--t-xs); color: var(--texto-3); font-weight: 700; }
.pasos-mini { list-style: none; margin: 0; padding: 0; display: grid; }
.pasos-mini li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--linea); }
.pasos-mini li:last-child { border-bottom: 0; }
.pm-n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--rosa-suave); border: 1.5px solid var(--rosa-borde); color: var(--rosa); font-size: 12px; font-weight: 800; }
.pasos-mini b { display: block; }
.pasos-mini p { margin: 4px 0 6px; color: var(--texto-2); font-size: var(--t-sm); line-height: 1.5; }
.pasos-mini em { font-style: normal; display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--rosa-suave); color: var(--rosa-claro); font-size: 11px; font-weight: 700; }
.diapo-cierre { text-align: center; display: grid; align-items: center; }
.diapo-cierre h2 { font-size: clamp(2.6rem, 1.4rem + 4.4vw, 5.2rem); margin: 0 auto 20px; max-width: 14ch; }
.diapo-cierre .entrada { color: var(--texto-2); max-width: 56ch; margin: 0 auto; }
.diapo-cierre blockquote { margin: 26px auto 36px; max-width: 46ch; font-size: var(--t-lg); font-weight: 700; line-height: 1.45; font-style: italic; }
.diapo-cierre .acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.pres-nav { position: sticky; bottom: 0; z-index: 20; display: flex; align-items: center; gap: 16px; padding: 14px max(var(--gutter), calc((100vw - var(--ancho)) / 2 + var(--gutter))); background: rgba(10,10,11,.94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-top: 1px solid var(--linea); }
.pres-nav .btn:disabled { opacity: .35; pointer-events: none; }
.pres-puntos { flex: 1; display: flex; justify-content: center; gap: 6px; }
.pres-puntos button { width: 8px; height: 8px; border-radius: 6px; border: 0; padding: 0; background: rgba(255,255,255,.18); cursor: pointer; transition: all .3s; }
.pres-puntos button.activo { width: 26px; background: var(--rosa); }
.pres-cuenta { font-size: var(--t-xs); font-weight: 700; color: var(--texto-3); white-space: nowrap; }
.pagina-proceso .wsp-flotante { bottom: 88px; }
@media (max-width: 860px) {
  .diapo-grid { grid-template-columns: 1fr; }
  .pres-cifras { grid-template-columns: 1fr 1fr; }
  .pres-cifras li:nth-child(3) { border-left: 0; }
  .pres-cifras li:nth-child(n+3) { border-top: 1px solid var(--linea); }
  .barra { grid-template-columns: 110px 1fr 40px; }
  .pres-paso:not([aria-selected="true"]) .pres-paso-t { display: none; }
  .pres-paso:not([aria-selected="true"]) { padding-right: 7px; }
  .pres-puntos { display: none; }
  .pres-nav { justify-content: space-between; }
  .pres-nav .btn { padding: 12px 18px; }
}
.proceso-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 36px; }
.btn-texto-rosa { font-weight: 700; color: var(--rosa-claro); font-size: var(--t-sm); }
.btn-texto-rosa:hover { color: #fff; }
.lateral-brief { display: grid; gap: 6px; background: linear-gradient(150deg, rgba(255,43,122,.2), rgba(255,43,122,.04)); border-color: var(--rosa-borde) !important; transition: transform .25s; }
.lateral-brief:hover { transform: translateY(-3px); }
.lateral-brief small { font-size: var(--t-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rosa); }
.lateral-brief b { font-size: 1.15rem; }
.lateral-brief span { color: var(--texto-2); font-size: var(--t-sm); }

/* ---------- Calendario de marketing ---------- */
.cal-pagina { padding-block: clamp(40px, 6vw, 80px) var(--seccion); position: relative; overflow: clip; }
.cal-pagina::before { content: ""; position: absolute; width: 800px; height: 800px; right: -300px; top: -380px; background: radial-gradient(closest-side, rgba(255,43,122,.16), transparent); pointer-events: none; }
.cal-cabeza { position: relative; max-width: 760px; }
.cal-cabeza h1 { font-size: clamp(2.4rem, 1.2rem + 4vw, 4.4rem); font-weight: 800; letter-spacing: -.04em; line-height: .98; margin: 14px 0 16px; }
.cal-cabeza h1 .acento { color: var(--rosa); }
.cal-cabeza .entrada { color: var(--texto-2); }
.cal-pasos { list-style: none; margin: 34px 0 18px; padding: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.cal-pasos li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 999px; border: 1px solid var(--linea); font-size: var(--t-sm); font-weight: 700; color: var(--texto-3); transition: all .3s; }
.cal-pasos li span { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; border: 1.5px solid var(--linea-2); }
.cal-pasos li.hecho { color: var(--texto-2); }
.cal-pasos li.hecho span { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.cal-pasos li.actual { color: #fff; border-color: var(--rosa-borde); background: var(--rosa-suave); }
.cal-pasos li.actual span { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.cal-caja { position: relative; background: var(--negro-2); border: 1px solid var(--linea); border-radius: 26px; padding: clamp(22px, 4vw, 44px); scroll-margin-top: 110px; }
.cpaso:not(.activo) { display: none; }
.cpaso.activo { animation: paso-entra .45s cubic-bezier(.2,.7,.2,1); }
.rubros-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.rubro { position: relative; cursor: pointer; }
.rubro input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.rubro > span { display: grid; gap: 2px; justify-items: center; text-align: center; height: 100%; padding: 18px 10px; border-radius: 16px; border: 1px solid var(--linea-2); background: var(--negro); transition: all .2s; }
.rubro i { font-style: normal; font-size: 1.9rem; line-height: 1.2; margin-bottom: 6px; }
.rubro small { color: var(--texto-3); font-size: var(--t-xs); }
.rubro:hover > span { border-color: var(--rosa-borde); transform: translateY(-2px); }
.rubro input:checked + span { border-color: var(--rosa); background: linear-gradient(160deg, rgba(255,43,122,.16), rgba(255,43,122,.04)); }
.rubro input:focus-visible + span { outline: 2px solid var(--rosa); outline-offset: 3px; }
.cal-otro { margin-top: 18px; max-width: 360px; }
.cal-caja .error:empty { display: none; }
.cal-caja .error { color: var(--rosa-claro); font-weight: 700; font-size: var(--t-sm); margin: 10px 0 0; }
.cal-leyenda { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 18px; font-size: var(--t-sm); color: var(--texto-2); }
.cal-leyenda span { display: inline-flex; align-items: center; gap: 6px; }
.cal-leyenda i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.l-pub { background: var(--rosa); }
.l-esp { border: 2px solid #fbbf24; }
.l-hoy { border: 2px solid #fff; }
.cal-leyenda b { margin-left: auto; color: var(--texto); }
.cal-meses { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 22px; }
.cal-mes h3 { font-size: 1.15rem; margin: 0 0 12px; }
.cal-rejilla { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.cal-dow { text-align: center; font-size: 11px; font-weight: 800; color: var(--texto-3); padding-bottom: 4px; text-transform: uppercase; }
.cal-dia { position: relative; aspect-ratio: 1; border-radius: 10px; border: 1px solid var(--linea); background: var(--negro); color: var(--texto-2); font: 700 var(--t-sm) var(--f-texto); cursor: pointer; display: grid; place-items: center; padding: 0; transition: all .15s; }
.cal-dia:hover:not(:disabled) { border-color: var(--rosa-borde); color: #fff; }
.cal-dia:disabled { opacity: .28; cursor: default; }
.cal-dia.pub { background: var(--rosa); border-color: var(--rosa); color: #fff; }
.cal-dia.esp { box-shadow: inset 0 0 0 2px #fbbf24; }
.cal-dia.hoy { outline: 2px solid #fff; outline-offset: 1px; }
.cal-dia i { position: absolute; top: -7px; right: -5px; font-style: normal; font-size: 13px; line-height: 1; }
.cal-especiales { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 4px; font-size: var(--t-xs); color: var(--texto-2); }
.cal-especiales b { display: inline-block; min-width: 20px; color: #fbbf24; }
.ideas-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; max-height: 60vh; overflow-y: auto; padding-right: 4px; }
.idea { display: flex; gap: 14px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--negro); border: 1px solid var(--linea); }
.idea-esp { border-color: rgba(251,191,36,.45); }
.idea-fecha { display: grid; justify-items: center; min-width: 46px; padding: 6px 0; border-radius: 10px; background: var(--rosa-suave); color: var(--rosa-claro); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.idea-fecha b { font-family: var(--f-display); font-size: 1.4rem; line-height: 1; color: #fff; }
.idea-cuerpo { min-width: 0; flex: 1; }
.idea-cuerpo small { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); }
.idea-cuerpo em { font-style: normal; color: #fbbf24; }
.idea-cuerpo p { margin: 4px 0 0; padding: 4px 6px; margin-left: -6px; border-radius: 6px; line-height: 1.5; outline: none; transition: background .2s; }
.idea-cuerpo p:hover, .idea-cuerpo p:focus { background: rgba(255,255,255,.05); }
.cal-listo { text-align: center; padding: 10px 0; }
.cal-listo h2 { font-size: var(--t-xl); margin: 0 0 10px; letter-spacing: -.03em; }
.cal-listo > p { color: var(--texto-2); }
.cal-listo .btn-texto-rosa { background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit; }
.cal-cta { display: grid; gap: 6px; justify-items: center; margin: 26px auto; padding: 26px; border-radius: 20px; border: 1px solid var(--rosa-borde); background: linear-gradient(150deg, rgba(255,43,122,.16), rgba(255,43,122,.03)); max-width: 560px; }
.cal-cta b { font-size: 1.2rem; }
.cal-cta > span { color: var(--texto-2); }
.cal-cta .acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 10px; }
.cal-cta .btn-wsp svg { width: 18px; height: 18px; }
@media (max-width: 600px) {
  .rubros-grid { grid-template-columns: repeat(2, 1fr); }
  .cal-pasos li { font-size: 0; padding: 4px; gap: 0; }
  .cal-pasos li.actual { font-size: var(--t-sm); gap: 8px; padding-right: 12px; }
  .cal-dia { border-radius: 8px; font-size: 13px; }
  .cal-leyenda b { margin-left: 0; width: 100%; }
}
.opiniones .contenedor { position: relative; }
.opiniones-nav { display: flex; justify-content: flex-end; gap: 8px; margin: -12px 0 16px; }
.opiniones-lista.carrusel { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: calc((100% - 36px) / 3); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.opiniones-lista.carrusel::-webkit-scrollbar { display: none; }
.opiniones-lista.carrusel .opinion { scroll-snap-align: start; }
.opiniones-mas { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.opiniones-mas .btn svg { width: 18px; height: 18px; }
.opiniones-mas .btn:first-child svg { color: #34a853; }
.opiniones-mas .btn:last-child svg { color: #3b82f6; }
@media (max-width: 900px) { .opiniones-nav { display: none; } .opiniones-lista.carrusel { grid-auto-columns: min(84vw, 360px); } .opiniones-mas .btn { width: 100%; justify-content: center; } }

/* ---------- Influencers ---------- */
.infl-beneficios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.infl-beneficios li { background: var(--negro-2); border: 1px solid var(--linea); border-radius: 20px; padding: 26px 22px; display: grid; gap: 10px; align-content: start; }
.infl-beneficios b { font-size: 1.1rem; }
.infl-beneficios p { color: var(--texto-2); font-size: var(--t-sm); line-height: 1.6; }
.infl-ico { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; background: var(--rosa-suave); color: var(--rosa); }
.infl-ico svg { width: 22px; height: 22px; }
.creadores { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
.creador { background: var(--negro-2); border: 1px solid var(--linea); border-radius: 20px; padding: 24px 20px; text-align: center; display: grid; justify-items: center; gap: 6px; transition: border-color .25s, transform .25s; }
.creador:hover { border-color: var(--rosa); transform: translateY(-3px); }
.creador-foto { width: 92px; height: 92px; border-radius: 50%; overflow: hidden; margin-bottom: 8px; background: var(--rosa-suave); display: grid; place-items: center; box-shadow: 0 0 0 3px var(--negro-2), 0 0 0 5px var(--rosa); }
.creador-foto img { width: 100%; height: 100%; object-fit: cover; }
.creador-foto span { font-size: 2rem; font-weight: 800; color: var(--rosa); }
.creador-usuario { display: inline-flex; align-items: center; gap: 6px; color: var(--texto-2); font-size: var(--t-sm); }
.creador-usuario svg { width: 15px; height: 15px; }
.creador-datos { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 4px; }
.creador-datos span { font-size: .78rem; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--linea-2); color: var(--texto-2); }
.creador-datos b { color: var(--texto, #fff); }
.creador-link { margin-top: 8px; color: var(--rosa); font-weight: 700; font-size: var(--t-sm); }
.infl-form-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.infl-form-grid > div:first-child { position: sticky; top: 110px; }
.infl-form-titulo { font-size: clamp(1.8rem, 3.4vw, 2.6rem); line-height: 1.1; margin-bottom: 14px; }
.infl-form-titulo .acento { color: var(--rosa); }
.infl-pasos { display: grid; gap: 14px; margin-top: 26px; }
.infl-pasos li { display: flex; align-items: center; gap: 14px; font-weight: 600; }
.infl-pasos span { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--rosa); color: #fff; font-weight: 800; font-size: .9rem; flex: none; }
.campo-chips { border: 0; padding: 0; margin: 0 0 18px; }
.campo-chips legend { font-weight: 600; font-size: var(--t-sm); margin-bottom: 10px; }
.campo-chips .chip span { display: inline-flex; align-items: center; gap: 6px; }
.campo-chips .chip svg { width: 15px; height: 15px; }
.infl-cabeza .acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
@media (max-width: 980px) { .infl-beneficios { grid-template-columns: repeat(2, 1fr); } .infl-form-grid { grid-template-columns: 1fr; } .infl-form-grid > div:first-child { position: static; } }
@media (max-width: 560px) { .infl-beneficios { grid-template-columns: 1fr; } }