/* CaricaFlash · web de venta para empresas (portada) */
html { scroll-behavior: smooth; }
body.w { background: #FFFFFF; color: var(--navy); font-size: 16px; line-height: 1.55; border-top: 6px solid var(--naranja); }
.w section { scroll-margin-top: 76px; }
.w h1, .w h2, .w h3 { text-wrap: balance; }
.w p { text-wrap: pretty; }
.w a { color: var(--navy); }
.w a:hover { color: var(--naranja-txt); }
.w summary:focus-visible { outline: 3px solid var(--celeste); outline-offset: -3px; }
.w-saltar { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--navy); color: #FFFFFF !important; padding: 10px 16px; border-radius: 10px; font-weight: 700; text-decoration: none; }
.w-saltar:focus { top: 12px; }
.ic { stroke: currentColor; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; fill: none; }
.qrp { fill-rule: evenodd; }

/* ---------- Botones ---------- */
.w-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 22px; border-radius: 14px; border: 2px solid transparent; font-weight: 700; font-size: 17px; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; box-sizing: border-box; }
.w-btn svg { width: 20px; height: 20px; flex: none; }
.w .w-btn-naranja, .w .w-btn-naranja:hover { background: var(--naranja); border-color: var(--naranja); color: var(--navy); }
.w .w-btn-naranja:hover { background: #F0481F; border-color: #F0481F; }
.w .w-btn-borde { background: transparent; border-color: var(--navy); color: var(--navy); }
.w .w-btn-borde:hover { background: var(--navy); color: #FFFFFF; }
.w .w-btn-navy { background: var(--navy); border-color: var(--navy); color: #FFFFFF; }
.w .w-btn-navy:hover { background: var(--navy2); border-color: var(--navy2); color: #FFFFFF; }
.w .w-btn-claro { background: transparent; border-color: #FFFFFF; color: #FFFFFF; }
.w .w-btn-claro:hover { background: #FFFFFF; color: var(--navy); }
.w-btn-peq { min-height: 44px; padding: 0 14px; font-size: 14.5px; border-radius: 12px; border-width: 1.5px; }
.w-botones { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- Cabecera ---------- */
.w-cab { position: sticky; top: 0; z-index: 20; background: rgba(255, 255, 255, 0.97); border-bottom: 1px solid var(--borde); }
.w-cab-in { max-width: 1200px; margin: 0 auto; padding: 8px 20px; display: flex; align-items: center; gap: 12px; }
.w-cab-logo { display: block; flex: none; line-height: 0; }
.w-cab-logo img { display: block; height: 52px; width: auto; }
.w-nav { display: flex; flex-wrap: wrap; gap: 0 20px; margin-left: auto; font-weight: 700; font-size: 14.5px; }
.w-nav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.w-cab-acc { display: flex; gap: 8px; margin-left: 14px; }
@media (max-width: 980px) { .w-nav { display: none; } .w-cab-acc { margin-left: auto; } }
@media (max-width: 440px) {
  .w-cab-in { padding: 6px 14px; gap: 8px; }
  .w-cab-logo img { height: 42px; }
  .w-cab-acc .w-btn-peq { padding: 0 11px; font-size: 14px; }
  .w-solo-ancho { display: none; }
}

/* ---------- Secciones ---------- */
.w-sec { padding: 72px 20px; }
.w-sec-in { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; gap: 32px; }
.w-sec-gris { background: var(--gris); }
.w-sec-navy { background: var(--navy); color: #FFFFFF; }
.w-sec-navy a { color: #FFFFFF; }
.w-titulo { display: flex; flex-direction: column; gap: 10px; max-width: 760px; }
.w-kick { font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--naranja-txt); }
.w-sec-navy .w-kick { color: var(--naranja2); }
.w-h2 { margin: 0; font-size: clamp(1.7rem, 2.2vw + 0.6rem, 2.5rem); line-height: 1.15; }
.w-lead { margin: 0; font-size: 17px; color: var(--muted); }
.w-sec-navy .w-lead { color: #D5DCEB; }
@media (max-width: 560px) { .w-sec { padding: 56px 16px; } .w-botones .w-btn { width: 100%; } }

/* ---------- Portada ---------- */
.w-hero { background: var(--gris); overflow: hidden; }
.w-hero-in { max-width: 1200px; margin: 0 auto; padding: 56px 20px 64px; display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
.w-hero-txt { flex: 1 1 440px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.w-h1 { margin: 0; font-size: clamp(2rem, 3vw + 0.6rem, 3.1rem); line-height: 1.08; letter-spacing: -0.5px; }
.w-h1 span { color: var(--naranja-txt); }
.w-hero-lead { margin: 0; font-size: 18px; line-height: 1.55; color: var(--muted); max-width: 34em; }
.w-regalo { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; background: #FFF0BF; color: #5C3D00; border-radius: 999px; padding: 8px 16px; font-weight: 700; font-size: 15px; }
.w-regalo svg { width: 22px; height: 22px; flex: none; color: #C93C17; }
.w-pildoras { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; font-weight: 700; }
.w-pildoras li { background: #FFFFFF; border-radius: 999px; padding: 6px 14px; }
.w-arte { flex: 1 1 440px; min-width: 0; position: relative; display: flex; align-items: flex-end; padding: 24px 0 30px; }
@media (max-width: 560px) { .movil-hero { display: none !important; } .w-hero-in { padding: 40px 16px 48px; gap: 28px; } }

/* Dibujo animado del cartel y cinta */
.cfo { stroke: #061638; stroke-width: 4; stroke-linejoin: round; stroke-linecap: round; }
.cft { stroke: #061638; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.dib .cfo, .dib .cft { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: w-dibujo 7s ease-in-out infinite; }
.dib .rel { animation: w-relleno 7s ease-in-out infinite; }
@keyframes w-dibujo { 0% { stroke-dashoffset: 1000; fill-opacity: 0; } 45% { stroke-dashoffset: 0; fill-opacity: 0; } 65% { stroke-dashoffset: 0; fill-opacity: 1; } 100% { stroke-dashoffset: 0; fill-opacity: 1; } }
@keyframes w-relleno { 0%, 45% { fill-opacity: 0; } 65%, 100% { fill-opacity: 1; } }
.pulso { animation: w-pulso 1.4s ease-in-out infinite; }
@keyframes w-pulso { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
.w-cinta-caja { background: var(--naranja); overflow: hidden; padding: 14px 0; }
.w-cinta { display: flex; gap: 34px; width: max-content; padding-right: 34px; font-size: 18px; font-weight: 700; letter-spacing: 2px; color: var(--navy); white-space: nowrap; animation: w-cinta 40s linear infinite; }
.w-cinta span { display: flex; align-items: center; gap: 34px; }
@keyframes w-cinta { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- Cómo funciona ---------- */
.w-dos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 18px; align-items: stretch; }
.w-bloque { border-radius: 24px; padding: 26px; display: flex; flex-direction: column; gap: 18px; }
.w-bloque-gris { background: var(--gris); }
.w-bloque-navy { background: var(--navy); color: #FFFFFF; border-top: 8px solid var(--naranja); }
.w-bloque h3 { margin: 0; font-size: 22px; line-height: 1.25; }
.w-pasos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.w-pasos li { display: flex; gap: 14px; align-items: flex-start; }
.w-num { width: 40px; height: 40px; border-radius: 999px; display: flex; align-items: center; justify-content: center; flex: none; font-weight: 700; font-size: 17px; color: var(--navy); }
.w-num.n1 { background: var(--naranja); } .w-num.n2 { background: var(--amarillo); } .w-num.n3 { background: var(--celeste); }
.w-pasos strong { display: block; font-size: 17px; line-height: 1.3; }
.w-pasos span.t { display: block; font-size: 15px; color: var(--muted); margin-top: 2px; }
.w-bloque-navy .w-pasos span.t { color: #D5DCEB; }

/* ---------- Tarjetas ---------- */
.w-rej { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 14px; }
.w-tarjeta { display: flex; gap: 14px; align-items: flex-start; background: #FFFFFF; border: 1px solid var(--borde); border-radius: 18px; padding: 18px; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.w-tarjeta:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(6, 22, 56, 0.10); }
.w-tarjeta .tx { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.w-tarjeta strong { font-size: 16.5px; line-height: 1.3; }
.w-tarjeta .tx span { font-size: 14.5px; color: var(--muted); }
.w-ico { width: 46px; height: 46px; border-radius: 14px; display: flex; align-items: center; justify-content: center; flex: none; color: var(--navy); }
.w-ico svg { width: 24px; height: 24px; }
.w-ico.c1 { background: #FFE2D9; } .w-ico.c2 { background: #FFF0BF; } .w-ico.c3 { background: #DDF2FA; }
.w-sec-navy .w-tarjeta { background: var(--navy2); border-color: var(--navy3); color: #FFFFFF; }
.w-sec-navy .w-tarjeta .tx span { color: #D5DCEB; }

/* ---------- Pantallas ---------- */
.w-pant { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 16px; }
.w-pant li { background: var(--gris); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 12px; }
.w-pant .dib-p { height: 150px; display: flex; align-items: center; justify-content: center; }
.w-pant strong { font-size: 19px; }
.w-pant span.t { font-size: 15px; color: var(--muted); }

/* ---------- Precios ---------- */
.w-precio { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); gap: 18px; align-items: stretch; }
.w-precio-card { background: var(--navy); color: #FFFFFF; border-radius: 24px; padding: 28px; border-top: 8px solid var(--naranja); display: flex; flex-direction: column; gap: 14px; }
.w-precio-card .cifra { font-size: clamp(2.6rem, 4vw + 1rem, 3.8rem); font-weight: 700; line-height: 1; color: var(--amarillo); }
.w-precio-card .unidad { font-size: 18px; font-weight: 700; }
.w-precio-card p { margin: 0; color: #D5DCEB; font-size: 15.5px; }
.w-precio-card .pro { background: var(--navy2); border-radius: 14px; padding: 12px 14px; font-size: 15px; color: #FFFFFF; }
.w-lista-ok { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; font-size: 16px; }
.w-lista-ok li { display: flex; gap: 12px; align-items: flex-start; }
.w-lista-ok svg { width: 22px; height: 22px; flex: none; color: var(--naranja-txt); margin-top: 1px; }
.w-packs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 14px; }
.w-pack { border: 1.5px solid var(--borde2); border-radius: 18px; padding: 18px; display: flex; flex-direction: column; gap: 6px; background: #FFFFFF; }
.w-pack .n { font-size: 26px; font-weight: 700; line-height: 1.1; }
.w-pack .n small { font-size: 15px; }
.w-pack .p { font-size: 20px; font-weight: 700; color: var(--naranja-txt); }
.w-pack .s { font-size: 14px; color: var(--muted); }
.w-nota { margin: 0; font-size: 14px; color: var(--muted); }

/* ---------- Banda particulares ---------- */
.w-banda { background: var(--amarillo); padding: 40px 20px; }
.w-banda-in { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; }
.w-banda h2 { margin: 0; font-size: clamp(1.4rem, 1.6vw + 0.7rem, 2rem); line-height: 1.2; }
.w-banda p { margin: 6px 0 0; font-size: 16.5px; max-width: 40em; }
.w-banda .w-banda-acc { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.w-banda .w-banda-acc a.lnk { font-weight: 700; font-size: 14.5px; display: inline-flex; min-height: 40px; align-items: center; }

/* ---------- Preguntas ---------- */
.w-faq { display: flex; flex-direction: column; gap: 10px; }
.w-faq details { background: #FFFFFF; border-radius: 16px; overflow: hidden; }
.w-faq summary { list-style: none; cursor: pointer; min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; font-weight: 700; font-size: 16.5px; line-height: 1.35; }
.w-faq summary::-webkit-details-marker { display: none; }
.w-faq summary::after { content: '+'; width: 30px; height: 30px; border-radius: 999px; background: var(--gris); display: flex; align-items: center; justify-content: center; flex: none; font-size: 20px; line-height: 1; }
.w-faq details[open] summary::after { content: '\2212'; }
.w-faq .w-resp { margin: 0; padding: 0 20px 18px; font-size: 15.5px; line-height: 1.6; color: var(--muted); }

/* ---------- Contacto ---------- */
.w-contacto { display: flex; flex-wrap: wrap; gap: 36px; align-items: flex-start; }
.w-contacto-txt { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.w-via { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 16px; border-radius: 14px; background: var(--gris); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.w-via svg { width: 22px; height: 22px; flex: none; }
.w-form-caja { flex: 1 1 480px; min-width: 0; background: var(--navy); color: #FFFFFF; border-radius: 26px; padding: 28px; border-top: 8px solid var(--naranja); }
.w-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); gap: 14px; }
.w-ancho { grid-column: 1 / -1; }
.w-campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.w-campo label { font-size: 14px; font-weight: 700; }
.w-campo label small { font-weight: 400; color: var(--muted-navy); }
.w-campo input, .w-campo select, .w-campo textarea { width: 100%; height: 48px; border-radius: 12px; border: 0; padding: 0 14px; font-size: 16px; color: var(--navy); background: #FFFFFF; }
.w-campo textarea { height: auto; min-height: 96px; padding: 12px 14px; resize: vertical; }
.w-perfil { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); gap: 10px; }
.w-perfil legend { padding: 0; margin-bottom: 8px; font-size: 14px; font-weight: 700; }
.w-opcion { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 14px; border-radius: 12px; border: 1.5px solid #3A4E80; cursor: pointer; font-weight: 700; font-size: 15px; line-height: 1.3; }
.w-opcion:has(input:checked) { border-color: var(--amarillo); background: var(--navy2); }
.w-opcion input { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--amarillo); }
.w-casilla { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.5; color: #D5DCEB; }
.w-casilla input { width: 22px; height: 22px; margin: 1px 0 0; flex: none; accent-color: var(--amarillo); }
.w-casilla a, .w-capa a { color: #FFFFFF; font-weight: 700; }
.w-capa { border-top: 1px solid var(--navy3); padding-top: 12px; font-size: 12.5px; line-height: 1.55; color: var(--muted-navy); }
.w-capa strong { color: #FFFFFF; }
.w-error { margin: 0; background: var(--rojo-claro); color: var(--rojo); border-radius: 12px; padding: 12px 14px; font-size: 15px; }
.w-ok { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 4px; }
.w-ok svg { width: 44px; height: 44px; color: var(--amarillo); }
.w-ok strong { font-size: 24px; }
.w-ok span { font-size: 16px; color: #D5DCEB; }
.w-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.w-form .w-btn { width: 100%; }

/* ---------- Pie ---------- */
.w-pie { background: var(--navy); color: #FFFFFF; }
.w-pie-in { max-width: 1200px; margin: 0 auto; padding: 48px 20px 32px; display: flex; flex-direction: column; gap: 28px; }
.w-pie-arriba { display: flex; flex-wrap: wrap; align-items: center; gap: 28px 56px; }
.w-pie-logo { width: min(100%, 360px); background: #FFFFFF; border-radius: 20px; padding: 14px 20px; }
.w-pie-logo img { display: block; width: 100%; height: auto; }
.w-pie-txt { flex: 0 1 480px; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.w-pie-txt .lema { font-size: 24px; font-weight: 700; line-height: 1.3; }
.w-pie-txt .quien { font-size: 15px; line-height: 1.6; color: var(--muted-navy); }
.w-pie-abajo { border-top: 1px solid var(--navy3); padding-top: 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; font-size: 14px; }
.w-pie-abajo .c { color: var(--muted-navy); }
.w-pie nav { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.w-pie nav a { display: inline-flex; align-items: center; min-height: 40px; color: #FFFFFF; }
.w-pie nav a.dest { color: var(--amarillo); font-weight: 700; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .dib .cfo, .dib .cft, .dib .rel, .pulso, .w-cinta { animation: none !important; }
  .dib .cfo, .dib .cft { stroke-dashoffset: 0; }
  .w-tarjeta, .w-tarjeta:hover { transition: none; transform: none; }
}