/* Más Técnica · Inicio. Referencia: docs/prototipo/Inicio_v27.dc.html */

html { scroll-behavior: smooth; }
.sec { padding-top: clamp(32px, min(6vw, 6vh), 80px); padding-bottom: clamp(32px, min(6vw, 6vh), 80px); }
.gris { color: var(--texto-2); }

/* Encabezado transparente sobre la portada; se oscurece al bajar */
.pag-inicio .site-head { background: rgba(17,17,17,0); border-bottom-color: rgba(17,17,17,0); transition: background .4s ease, border-color .4s ease; }
.pag-inicio .site-head.is-scrolled, .pag-inicio .site-head:has(.menu-btn[aria-expanded="true"]), html:not(.js) .pag-inicio .site-head { background: var(--fondo); border-bottom-color: var(--linea-suave); }

.rise { animation: rise 1s var(--ez) both; }
.rise2 { animation: rise 1s var(--ez) .25s both; }
.rise3 { animation: rise 1s var(--ez) .5s both; }
@keyframes rise { from { opacity: 0; transform: translateY(28px) scale(.94); } to { opacity: 1; transform: none; } }

/* ---------- Portada ---------- */
.hero {
  position: relative; display: flex; align-items: flex-end; overflow: hidden;
  height: min(100vh, 960px); min-height: 540px;
  margin-top: calc(-1 * (clamp(96px, 8vw, 112px) * .62 + 25px));
}
/* Video al 40 % sobre negro. La imagen fija (primer cuadro del video) va encima,
   con el mismo tratamiento, y se funde cuando el video empieza: debajo del video solo queda el negro. */
.hero-media { position: absolute; inset: 0; background: #000000; }
.hero-capa { position: absolute; inset: 0; opacity: .4; }
.hero-fija, .hero-img, .hero-vid { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-vid { opacity: 0; }
.hero-vid.ok { opacity: 1; }
.hero-fija { z-index: 1; transition: opacity .4s ease, visibility 0s linear .4s; }
.hero.vid-on .hero-fija { opacity: 0; visibility: hidden; }
.hero-fade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17,17,17,.55) 0%, rgba(17,17,17,0) 35%, rgba(17,17,17,.2) 60%, #111111 100%); }
.hero-in { position: relative; width: 100%; padding-bottom: clamp(48px, 8vh, 96px); }
.hero-txt { max-width: 1100px; }
.hero-l1, .hero-l2 { display: block; }
.hero .bajada { margin-top: 24px; }
.hero-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; margin-top: 36px; }
.hero-pie { display: flex; align-items: center; gap: 16px; margin-top: clamp(40px, 7vh, 72px); font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-2); }
.hero-linea { flex: 1; height: 1px; background: var(--linea); }
.pz-hero { flex: none; order: -1; margin: -14px 0 -14px -14px; }

/* Halo de «a medida»: un degradado recorre la palabra entera. Sin .fx (sin JavaScript o con menos
   movimiento) o sin background-clip: text, la palabra queda quieta y en blanco. */
.halo { text-shadow: 0 0 18px rgba(255,255,255,.18); }
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .fx .halo {
    text-shadow: none; color: transparent;
    background: linear-gradient(90deg, #FFFFFF 33.34%, rgba(255,255,255,.8) 41%, #FFFFFF 50%, rgba(255,255,255,.8) 59%, #FFFFFF 66.66%) 100% 0 / 300% 100% no-repeat;
    -webkit-background-clip: text; background-clip: text;
    filter: drop-shadow(0 0 3px rgba(255,255,255,0)) drop-shadow(0 0 18px rgba(255,255,255,.18));
    animation: haloBarrido 6s linear 1.1s infinite, haloBrillo 6s ease-in-out 1.1s infinite;
  }
  .hero.paused .halo { animation-play-state: paused; }
}
@keyframes haloBarrido { 0% { background-position: 100% 0; } 21%, 100% { background-position: 0 0; } }
@keyframes haloBrillo { 0%, 27%, 100% { filter: drop-shadow(0 0 3px rgba(255,255,255,0)) drop-shadow(0 0 18px rgba(255,255,255,.18)); } 12% { filter: drop-shadow(0 0 3px rgba(255,255,255,.9)) drop-shadow(0 0 20px rgba(255,255,255,.75)); } }

/* ---------- Cinta de logos ---------- */
.trust { position: relative; padding-top: clamp(24px, 4vh, 40px); padding-bottom: clamp(24px, 4vh, 40px); border-bottom: 1px solid var(--linea-suave); }
.trust-row { display: flex; align-items: center; gap: 16px 48px; }
/* Pausa de la cinta: a la izquierda en cualquier ancho (en el celular, debajo de los logos) */
.pz-mq { flex: none; order: -1; margin: -14px 0 -14px -14px; }
.trust-lab { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-2); white-space: nowrap; }
.mq { flex: 1; min-width: 0; overflow-x: auto; overflow-y: hidden; padding: 8px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; touch-action: pan-x pan-y; }
.mq::-webkit-scrollbar { display: none; }
.mq-track { display: flex; width: max-content; }
.mq-set { display: flex; align-items: center; gap: clamp(48px, 6vw, 96px); padding: 0 clamp(24px, 3vw, 48px); margin: 0; list-style: none; }
.mq-set li { flex: none; display: flex; align-items: center; justify-content: center; height: 88px; }
.mq-set img { display: block; width: auto; max-width: none; object-fit: contain; }
.lg-b { display: flex; align-items: center; justify-content: center; padding: 0; background: transparent; border: 0; cursor: pointer; opacity: .82; transition: transform .35s var(--ez), opacity .35s ease; -webkit-tap-highlight-color: transparent; }
.lg-b:hover { opacity: 1; }
.lg-b.sel { transform: scale(1.15); opacity: 1; }
html:not(.fx) .mq-dup, html:not(.fx) .lg-rep { display: none; }
html:not(.fx) .mq-track { width: auto; }
html:not(.fx) .mq-set { flex-wrap: wrap; justify-content: center; gap: 16px 48px; }

/* ---------- Servicios: carrusel 3D ---------- */
.serv { position: relative; overflow: hidden; }
.cf-bgs { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.cf-bg { position: absolute; inset: -10%; width: 120%; height: 120%; max-width: none; object-fit: cover; filter: grayscale(1) blur(36px) brightness(.5); opacity: 0; transition: opacity 1s ease; }
.cf-bg.act { opacity: .7; }
.cf-fade { position: absolute; inset: 0; background: linear-gradient(180deg, #111111 0%, rgba(17,17,17,.55) 30%, rgba(17,17,17,.55) 70%, #111111 100%); }
.serv-head { position: relative; z-index: 2; }
.serv-head h2 { margin-top: 20px; max-width: 22em; }
.cf { --ch: clamp(240px, 43vh, 480px); --cw: calc(var(--ch) * .8); position: relative; z-index: 2; height: calc(var(--ch) + 52px); margin-top: clamp(14px, 2.5vh, 32px); perspective: 1400px; }
.cf-card { position: absolute; left: 50%; top: calc(50% - 26px); width: var(--cw); height: var(--ch); padding: 0; border: 0; background: var(--superficie); cursor: pointer; overflow: hidden; transform-style: preserve-3d; box-shadow: 0 30px 60px rgba(0,0,0,.55); transform: translate(-50%, -50%) scale(.9); opacity: 0; transition: transform .8s var(--ez), opacity .6s ease, filter .8s ease; }
.cf-card img, .cf-card video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cf-card video { opacity: 0; }
.cf-card video.ok { opacity: 1; }
.cf-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17,17,17,0) 30%, rgba(17,17,17,.55) 52%, rgba(17,17,17,.94) 100%); }
.cf-info { position: absolute; left: calc(50% - var(--cw) * .5 + 24px); top: calc(50% - 26px + var(--ch) * .5 - 20px); z-index: 20; width: calc(var(--cw) - 48px); text-shadow: 0 1px 12px rgba(0,0,0,.6); opacity: 0; visibility: hidden; transform: translateY(calc(-100% + 10px)); pointer-events: none; transition: opacity .6s ease, transform .7s var(--ez); }
.cf-info.act { opacity: 1; visibility: visible; transform: translateY(-100%); pointer-events: auto; }
.cf-info h3 { font-size: clamp(28px, 2.8vw, 40px); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; }
.cf-raya { display: block; width: 40px; height: 1px; background: var(--blanco); margin: 14px 0 12px; }
.cf-info p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--texto); }
.cf-info a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 4px; font-size: 15px; font-weight: 500; text-decoration: none; }
.cf-ctrl { position: absolute; left: 0; right: 0; bottom: 0; z-index: 25; display: flex; align-items: center; justify-content: center; gap: 20px; }
.cf-num { min-width: 64px; text-align: center; font-size: 15px; color: var(--texto-2); }
.cf-act { color: var(--blanco); }
.cf-side { position: absolute; top: calc(50% - 26px); z-index: 25; transform: translateY(-50%); background: rgba(17,17,17,.55); border-radius: 2px; }
.cf-side.l { left: clamp(16px, 4vw, 64px); }
.cf-side.r { right: clamp(16px, 4vw, 64px); }
.cf-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; background: transparent; border: 0; color: var(--blanco); cursor: pointer; }
.cf-side.cf-btn { background: rgba(17,17,17,.55); }
.cf-btn:hover { color: var(--texto); }
.pz-sv { position: absolute; left: calc(var(--margen) - 14px); bottom: 0; z-index: 26; }

/* Sin JavaScript: las seis tarjetas en una fila que se desliza, con su texto debajo */
html:not(.js) .cf { display: flex; gap: 24px; height: auto; overflow-x: auto; padding: 0 var(--margen) 24px; perspective: none; }
html:not(.js) .cf-item { flex: none; width: var(--cw); }
html:not(.js) .cf-card { position: relative; left: auto; top: auto; display: block; transform: none; opacity: 1; }
html:not(.js) .cf-info { position: static; width: auto; margin-top: 16px; opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
html:not(.js) .cf-side, html:not(.js) .cf-ctrl, html:not(.js) .pz-sv { display: none; }
html:not(.js) .cf-bgs noscript:first-of-type .cf-bg { opacity: .7; }

/* ---------- Cómo trabajamos ---------- */
#como { border-top: 1px solid var(--linea-suave); }
.esc-grid { display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 32px 72px; align-items: start; margin-top: 24px; }
.h-grande { font-size: clamp(34px, 4vw, 56px); line-height: 1.06; }
.h-grande span, .nos-h2 span, .form-h2 span { display: block; }
.esc-baj { margin-top: 24px; max-width: 30em; }
.esc-h3 { font-size: clamp(20px, 1.8vw, 24px); }
.esc-gris { font-weight: 400; color: var(--texto-2); }
.res { text-align: center; margin-top: clamp(36px, 6vh, 64px); }
.fx .res-txt { opacity: 0; transform: translateY(14px); transition: opacity .9s ease .3s, transform 1s var(--ez) .3s; }
.fx .res.on .res-txt { opacity: 1; transform: none; }
.res-lab { display: block; font-size: 14px; font-weight: 500; color: var(--texto-2); margin-bottom: 12px; }
.res-h { margin: 0; font-size: clamp(36px, 4.6vw, 64px); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; }
.res-p { margin: 20px auto 0; max-width: 34em; color: var(--texto); }
.res .arrow-l { margin-top: 16px; }

/* ---------- Eventos: panel (computadora) y lista desplegable (celular) ---------- */
#eventos, #testimonios { border-top: 1px solid var(--linea-suave); }
.ev-h2 { margin-top: 20px; max-width: 24em; }
.evx { list-style: none; margin: clamp(24px, 4vh, 40px) 0 0; padding: 0; display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); grid-template-rows: repeat(4, auto); column-gap: clamp(40px, 6vw, 96px); align-items: stretch; }
.evx > li { display: contents; }
.evx > li:nth-child(1) .evx-b { grid-row: 1; }
.evx > li:nth-child(2) .evx-b { grid-row: 2; }
.evx > li:nth-child(3) .evx-b { grid-row: 3; }
.evx > li:nth-child(4) .evx-b { grid-row: 4; }
.evx-b { grid-column: 1; position: relative; display: flex; align-items: baseline; gap: 16px; width: 100%; min-height: 56px; padding: clamp(12px, 2.2vh, 20px) 0; border: 0; border-bottom: 1px solid var(--linea-suave); background: transparent; color: var(--blanco); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.evx > li:first-child .evx-b { border-top: 1px solid var(--linea-suave); }
.evx-n { flex: none; width: 30px; font-size: 13px; font-weight: 500; letter-spacing: .14em; color: var(--texto-2); }
.evx-t { flex: 1; font-size: clamp(32px, min(3.2vw, 5.6vh), 48px); font-weight: 300; line-height: 1.05; letter-spacing: -.02em; color: var(--blanco); }
.evx-b.act .evx-t { font-weight: 700; }
.evx-bar { position: absolute; left: 0; bottom: -1px; height: 1px; width: 0; background: var(--blanco); transition: width .7s var(--ez); }
.evx-b.act .evx-bar { width: 100%; }
.evx-ar { flex: none; align-self: center; color: var(--blanco); opacity: 0; transform: translateX(-8px); transition: opacity .4s ease, transform .5s var(--ez); }
.evx-b.act .evx-ar { opacity: 1; transform: none; }
.evx-ic { display: none; flex: none; align-self: center; color: var(--blanco); }
.evx-p { grid-column: 2; grid-row: 1 / 5; align-self: center; display: grid; grid-template-rows: 1fr; opacity: 0; visibility: hidden; transform: translateY(18px); transition: opacity .45s ease, transform .6s var(--ez), visibility 0s linear .45s; }
.evx-p.act { opacity: 1; visibility: visible; transform: none; transition: opacity .55s ease .1s, transform .7s var(--ez) .1s, visibility 0s; }
.evx-in { min-height: 0; overflow: hidden; }
.evx-m { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-2); line-height: 1.6; }
.evx-d { margin: 16px 0 0; max-width: 24em; font-size: clamp(22px, 2.2vw, 32px); font-weight: 400; line-height: 1.3; letter-spacing: -.01em; color: var(--blanco); }
.evx-go { margin-top: 20px; }

/* ---------- Lo que dicen ---------- */
.testi-lab { margin-bottom: clamp(20px, 3.5vh, 32px); }
.testi-1 { margin: 0; }
.testi-1 blockquote { margin: 0; max-width: 24em; font-size: clamp(32px, min(3.2vw, 5.4vh), 46px); line-height: 1.2; font-weight: 300; letter-spacing: -.02em; }
.testi-1 figcaption { margin-top: clamp(16px, 3vh, 24px); font-size: 17px; color: var(--texto-2); }
.g2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 32px 48px; margin-top: clamp(32px, 5vh, 56px); padding-top: clamp(24px, 4vh, 32px); border-top: 1px solid var(--linea); }
.g2 figure { margin: 0; }
.g2 blockquote { margin: 0; font-size: clamp(19px, 1.6vw, 22px); line-height: 1.45; color: var(--texto); }
.g2 figcaption { margin-top: 12px; font-size: 15px; color: var(--texto-2); }
.testi-cta { margin-top: clamp(32px, 5vh, 48px); }

/* ---------- Para salones y planners ---------- */
.b2b { background: var(--superficie); }
.split { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px 48px; }
.b2b-split { align-items: end; margin-top: 24px; }
.b2b-p { margin: 0; max-width: 30em; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.3; letter-spacing: -.01em; }
.b2b-p .t-light { font-weight: 400; }
.b2b-wa { white-space: nowrap; }

/* ---------- Quiénes somos y evolución del logo ---------- */
.nos-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-areas: "h evo" "t evo"; grid-template-rows: auto 1fr; gap: 24px 64px; align-items: start; margin-top: 24px; }
.nos-h2 { grid-area: h; }
.nos-p { grid-area: t; margin: 0; max-width: 34em; color: var(--texto-2); }
.evo-wrap { grid-area: evo; position: relative; display: flex; flex-direction: column; }
.pz-evo { order: 2; align-self: flex-start; margin: 4px 0 -14px -14px; }

@property --p { syntax: '<percentage>'; inherits: true; initial-value: 100%; }
@property --y { syntax: '<integer>'; inherits: true; initial-value: 2026; }
@property --lo { syntax: '<number>'; inherits: true; initial-value: 0; }
.evo { --p: 100%; --y: var(--anio); --lo: 0; }
.fx .evo:not(.go) { --p: 0%; --y: 1985; }
.fx .evo.go { animation: evoSweep 8s linear .4s infinite both; }
.evo.go.pzd { animation-play-state: paused; }
@keyframes evoSweep {
  0%, 8% { --p: 0%; --y: 1985; --lo: 0; opacity: 1; animation-timing-function: cubic-bezier(.45,0,.25,1); }
  9% { --lo: 1; }
  45% { --p: 100%; --y: var(--anio); --lo: 1; opacity: 1; }
  47%, 90% { --p: 100%; --y: var(--anio); --lo: 0; opacity: 1; }
  94% { --p: 100%; --y: var(--anio); --lo: 0; opacity: 0; }
  95% { --p: 0%; --y: 1985; --lo: 0; opacity: 0; }
  100% { --p: 0%; --y: 1985; --lo: 0; opacity: 1; }
}
.evo-stage { position: relative; width: 100%; aspect-ratio: 16 / 10; max-height: max(40vh, 160px); }
.evo-l { --evo-w: clamp(220px, min(64%, 55vh), 380px); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.evo-l img { display: block; height: auto; }
.evo-old { clip-path: inset(0 0 0 var(--p)); }
.evo-old img { width: min(60%, calc(var(--evo-w) * .9375)); }
.evo-new { clip-path: inset(0 calc(100% - var(--p)) 0 0); }
.evo-new img { width: var(--evo-w); }
.evo-line { position: absolute; top: 8%; bottom: 8%; left: var(--p); width: 1px; background: rgba(255,255,255,.75); opacity: var(--lo); }
.evo-bar { margin-top: 20px; padding-top: 30px; }
.evo-track { position: relative; display: block; height: 1px; background: var(--linea); }
.evo-fill { position: absolute; left: 0; top: 0; height: 1px; width: var(--p); background: var(--blanco); }
.evo-dot { position: absolute; top: 0; left: var(--p); width: 9px; height: 9px; border-radius: 50%; background: var(--blanco); transform: translate(-50%, -50%); }
.evo-yr { position: absolute; bottom: 12px; left: var(--p); transform: translateX(-50%); font-size: 14px; font-weight: 500; color: var(--blanco); opacity: var(--lo); counter-reset: yr var(--y); }
.evo-yr::after { content: counter(yr); }
.evo-ends { display: flex; justify-content: space-between; margin-top: 14px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-2); }

/* ---------- Formulario (fondo claro, sin verde) ---------- */
/* Abajo, como mínimo 88 px de aire: el botón flotante (16 + 56 px) no tapa el botón, los errores, el aviso ni las pantallas */
.form-sec { color-scheme: light; background: var(--texto); color: var(--fondo); padding: clamp(40px, min(7vw, 8vh), 96px) var(--margen) max(88px, clamp(40px, min(7vw, 8vh), 96px)); }
.form-split { grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 64px; }
.form-lab { display: flex; align-items: center; gap: 16px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--linea); }
.form-raya { flex: 1; height: 1px; background: var(--linea); }
.form-h2 { margin-top: 20px; font-size: clamp(36px, min(4.4vw, 8vh), 64px); line-height: 1.05; }
.form-intro { margin: 24px 0 0; max-width: 26em; color: var(--fondo); }
.fgrid[hidden] { display: none; }
.fgrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: clamp(14px, 2.6vh, 28px) 32px; }
.fgrid .full { grid-column: 1 / -1; }
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--fondo); }
.campo[hidden] { display: none; }
.field { width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--linea); border-radius: 0; color: var(--fondo); font: inherit; font-size: 17px; padding: 10px 0; }
.field::placeholder { color: #6B6B6B; }
.field option { color: var(--fondo); }
textarea.field { resize: vertical; }
.chk-set { margin: 0; padding: 0; border: 0; }
.chk-set legend { font-size: 14px; color: var(--fondo); margin-bottom: 4px; padding: 0; }
.chk { display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 17px; }
.chk label { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; }
.chk input { width: 20px; height: 20px; margin: 0; accent-color: var(--fondo); }
.opt-btn { display: none; align-items: center; gap: 10px; min-height: 44px; padding: 0; background: transparent; border: 0; color: var(--fondo); font: inherit; font-size: 15px; font-weight: 500; text-align: left; cursor: pointer; }
.opt { display: contents; }
.form-envio { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: 8px; }
.btn-n { min-height: 52px; padding: 0 28px; background: var(--fondo); color: var(--blanco); border: 0; border-radius: 2px; font: inherit; font-size: 17px; font-weight: 700; cursor: pointer; }
.btn-n:disabled { cursor: default; }
.form-priv { font-size: 14px; color: var(--linea); max-width: 28em; }
.form-sec a:hover { color: var(--fondo); }
/* Errores: rojo #A4161A (7:1 sobre #F4F4F2, sin verde) */
.form-sec { --error: #A4161A; }
.campo-error { margin: 0; font-size: 14px; line-height: 1.4; color: var(--error); }
.campo-error[hidden] { display: none; }
.field[aria-invalid="true"] { border-bottom: 2px solid var(--error); }
.form-aviso { flex-basis: 100%; margin: 0; font-size: 15px; font-weight: 500; color: var(--error); }
.form-aviso:empty { display: none; }
.form-falla:empty { display: none; }
.form-falla { flex-basis: 100%; margin: 0; scroll-margin-bottom: 88px; font-size: 15px; font-weight: 500; color: var(--error); }
.form-falla a { color: var(--fondo); font-weight: 700; text-underline-offset: 3px; }
/* Campo para bots: fuera de la vista, sin lector de pantalla ni teclado */
.trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
/* Confirmación */
.form-ok { border-top: 1px solid var(--linea); padding-top: 32px; }
/* Confirmado: sin el título ni su línea; la etiqueta arriba y la confirmación debajo, en una columna */
.form-h2[hidden] { display: none; }
.confirmado .form-split { grid-template-columns: minmax(0,1fr); gap: 24px; }
.confirmado .form-ok { border-top: 0; padding-top: 0; }
.form-ok:focus { outline: none; }
.form-ok-h { margin: 0; font-size: clamp(32px, 3vw, 40px); line-height: 1.15; letter-spacing: -.02em; }
.form-ok-h span { display: block; }
.form-ok-p { margin: 16px 0 0; max-width: 32em; color: var(--fondo); }

/* ---------- Celular ---------- */
.hide-m { display: inline; }
@media (max-width: 820px) {
  .hide-m { display: none; }
  .sec { padding-top: 40px; padding-bottom: 40px; }
  .resp { font-size: 13px; letter-spacing: .08em; }
  .trust-row { flex-direction: column; align-items: stretch; }
  /* En el celular, todos los signos de pausa van abajo a la izquierda */
  .pz-mq { order: 0; align-self: flex-start; margin: -8px 0 -14px -14px; }
  .mq-set li { height: 72px; }
  .mq-set img { transform: scale(.8); }
  .cf { --ch: clamp(250px, 47vh, 420px); }
  .cf-info { left: calc(50% - var(--cw) * .5 + 18px); width: calc(var(--cw) - 36px); }
  .cf-side { display: none; }
  .esc-grid, .split, .g2, .form-split { grid-template-columns: minmax(0,1fr); }
  .evx { display: block; border-top: 1px solid var(--linea-suave); }
  .evx > li { display: block; border-bottom: 1px solid var(--linea-suave); }
  .evx > li:first-child .evx-b { border-top: 0; }
  .evx-b { align-items: center; min-height: 64px; border-bottom: 0; padding: 16px 0; }
  .evx-t { font-size: 32px; }
  .evx-bar, .evx-ar { display: none; }
  .evx-ic { display: block; }
  .evx-p { grid-template-rows: 0fr; opacity: 1; transform: none; transition: grid-template-rows .45s var(--ez), visibility 0s linear .45s; }
  .evx-p.act { grid-template-rows: 1fr; transform: none; transition: grid-template-rows .45s var(--ez), visibility 0s; }
  .evx-in { padding-left: 46px; }
  .evx-p.act .evx-in { padding-bottom: 22px; }
  .evx-m { font-size: 12px; }
  .evx-d { margin-top: 10px; font-size: 19px; line-height: 1.4; }
  .evx-go { margin-top: 8px; }
  .testi-lab { margin-bottom: 32px; }
  .testi-1 figcaption { margin-top: 24px; }
  .b2b-p { font-size: 19px; }
  .nos-grid { grid-template-columns: minmax(0,1fr); grid-template-areas: "h" "evo" "t"; grid-template-rows: none; }
  .form-split { gap: 24px; }
  .form-h2 { margin-top: 14px; }
  .fgrid { gap: 14px 16px; }
  .fgrid .full-m { grid-column: 1 / -1; }
  .fgrid .field { padding: 8px 0; }
  .chk { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 16px; font-size: 16px; }
  .js .opt-btn { display: inline-flex; }
  .js .opt:not(.open) { display: none; }
}
@media (max-width: 820px) and (max-height: 660px) { .cf { --ch: clamp(210px, 37vh, 380px); } }

/* ---------- Menos movimiento ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-vid { display: none; }
}