{"id":5,"date":"2026-06-18T19:40:03","date_gmt":"2026-06-18T17:40:03","guid":{"rendered":"https:\/\/airhelper.es\/?page_id=5"},"modified":"2026-06-18T20:02:04","modified_gmt":"2026-06-18T18:02:04","slug":"inicio","status":"publish","type":"page","link":"https:\/\/airhelper.es\/","title":{"rendered":"inicio"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5\" class=\"elementor elementor-5\">\n\t\t\t\t<div class=\"elementor-element elementor-element-da24a0a e-con e-atomic-element e-flexbox-base e-05d8b55 \" data-id=\"da24a0a\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"da24a0a\">\n    \t\t<div class=\"elementor-element elementor-element-235e1f4 elementor-widget elementor-widget-html\" data-id=\"235e1f4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     PEGAR ESTO EN UN WIDGET \"HTML\" DE ELEMENTOR\r\n     El email se env\u00eda con wp_mail (ver snippet PHP aparte)\r\n============================================================ -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Pacifico&family=Quicksand:wght@500;700&display=swap');\r\n\r\n\/* Ocultar cabecera y pie del tema (opcional, si te molestan) *\/\r\n#site-header, #site-footer{ display:none !important; }\r\n\r\n.cita-app, .cita-app *{ box-sizing:border-box; }\r\n\r\n.cita-app{\r\n  position:fixed; inset:0; z-index:99999;\r\n  font-family:'Quicksand', sans-serif;\r\n  background:linear-gradient(160deg,#ffffff 0%,#fff2f7 55%,#ffe3ef 100%);\r\n  color:#c2185b;\r\n  display:flex; align-items:center; justify-content:center;\r\n  overflow:hidden;\r\n}\r\n\r\n.cita-app .fondo{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:0; }\r\n.cita-app .fondo span{ position:absolute; bottom:-60px; font-size:28px; opacity:.7; animation:citaSubir linear infinite; user-select:none; }\r\n@keyframes citaSubir{ 0%{transform:translateY(0) rotate(0);opacity:0;} 10%{opacity:.8;} 90%{opacity:.8;} 100%{transform:translateY(-115vh) rotate(360deg);opacity:0;} }\r\n\r\n.cita-app .escenas{ position:relative; z-index:1; width:100%; max-width:560px; padding:24px; }\r\n.cita-app .escena{ display:none; background:rgba(255,255,255,.9); border:3px solid #ffc2d8; border-radius:32px; padding:44px 32px; text-align:center; box-shadow:0 18px 50px rgba(255,111,165,.25); animation:citaAparecer .5s ease; }\r\n.cita-app .escena.activa{ display:block; }\r\n@keyframes citaAparecer{ from{opacity:0;transform:translateY(20px) scale(.96);} to{opacity:1;transform:translateY(0) scale(1);} }\r\n\r\n.cita-app .emojis-titulo{ font-size:46px; margin:0 0 10px; }\r\n.cita-app h1{ font-family:'Pacifico', cursive; font-weight:400; font-size:clamp(28px,6vw,40px); line-height:1.25; color:#c2185b; margin:0 0 8px; }\r\n.cita-app .sub{ font-size:18px; color:#e0578f; margin:0 0 28px; }\r\n\r\n.cita-app .botones{ position:relative; display:flex; gap:18px; justify-content:center; align-items:center; flex-wrap:wrap; min-height:64px; }\r\n.cita-app .btn{ font-family:'Quicksand', sans-serif; font-weight:700; font-size:20px; padding:16px 42px; border-radius:50px; cursor:pointer; transition:transform .25s ease, background .2s ease, box-shadow .2s ease; }\r\n.cita-app .btn-si{ background:#ff6fa5; color:#fff; border:3px solid #ff6fa5; box-shadow:0 8px 20px rgba(255,111,165,.45); }\r\n.cita-app .btn-si:hover{ background:#ff5096; transform:scale(1.08); box-shadow:0 12px 26px rgba(255,111,165,.55); }\r\n.cita-app .btn-no{ background:#fff; color:#e0578f; border:3px solid #ff9cc0; position:relative; z-index:2; will-change:transform; transition:transform .6s cubic-bezier(.22,.61,.36,1), background .2s ease; }\r\n\r\n\/* Formulario de puntuaci\u00f3n *\/\r\n.cita-app .estrellas{ position:relative; display:inline-block; font-size:46px; line-height:1; letter-spacing:8px; margin:0 0 6px; }\r\n.cita-app .estrellas-base{ color:#ffd9e6; }\r\n.cita-app .estrellas-relleno{ position:absolute; top:0; left:0; white-space:nowrap; overflow:hidden; width:100%; color:#ffc107; text-shadow:0 2px 6px rgba(255,170,0,.45); transition:width .15s ease; }\r\n.cita-app .puntos{ font-family:'Pacifico', cursive; font-size:clamp(34px,9vw,52px); color:#ff6fa5; line-height:1.1; }\r\n.cita-app .puntos-max{ font-size:15px; color:#e0578f; margin:0 0 14px; }\r\n.cita-app .slider{ -webkit-appearance:none; appearance:none; width:100%; height:12px; border-radius:50px; background:#ffe0ec; outline:none; margin:8px 0 6px; cursor:pointer; }\r\n.cita-app .slider::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:30px; height:30px; border-radius:50%; background:#ff6fa5; border:3px solid #fff; box-shadow:0 3px 10px rgba(255,111,165,.5); cursor:pointer; }\r\n.cita-app .slider::-moz-range-thumb{ width:30px; height:30px; border-radius:50%; background:#ff6fa5; border:3px solid #fff; box-shadow:0 3px 10px rgba(255,111,165,.5); cursor:pointer; }\r\n.cita-app .mensajito{ font-size:18px; font-weight:700; color:#c2185b; min-height:26px; margin:6px 0 22px; }\r\n.cita-app .mensaje-extra{ width:100%; min-height:90px; resize:vertical; font-family:'Quicksand', sans-serif; font-size:16px; color:#c2185b; padding:14px 16px; border:3px solid #ffc2d8; border-radius:20px; outline:none; background:#fff; margin:0 0 20px; }\r\n.cita-app .mensaje-extra::placeholder{ color:#f3a9c6; }\r\n.cita-app .mensaje-extra:focus{ border-color:#ff9cc0; }\r\n.cita-app .btn-enviar{ width:100%; }\r\n.cita-app .btn-enviar:disabled{ opacity:.6; cursor:default; transform:none; }\r\n.cita-app .estado{ margin-top:14px; font-size:15px; color:#e0578f; min-height:20px; }\r\n\r\n\/* Pantalla final *\/\r\n.cita-app .final .recogida{ font-size:22px; font-weight:700; color:#c2185b; margin:18px 0 6px; }\r\n.cita-app .final .beso{ font-size:64px; margin:14px 0; display:block; }\r\n.cita-app .final .quiero{ font-family:'Pacifico', cursive; font-size:30px; color:#ff6fa5; }\r\n.cita-app .corazones-final span{ display:inline-block; font-size:26px; animation:citaLatir 1s ease-in-out infinite; margin:18px 4px 0; }\r\n.cita-app .corazones-final span:nth-child(2){ animation-delay:.15s; }\r\n.cita-app .corazones-final span:nth-child(3){ animation-delay:.3s; }\r\n.cita-app .corazones-final span:nth-child(4){ animation-delay:.45s; }\r\n.cita-app .corazones-final span:nth-child(5){ animation-delay:.6s; }\r\n@keyframes citaLatir{ 0%,100%{transform:scale(1);} 50%{transform:scale(1.4);} }\r\n<\/style>\r\n\r\n<div class=\"cita-app\">\r\n\r\n  <div class=\"fondo\" id=\"citaFondo\"><\/div>\r\n\r\n  <div class=\"escenas\">\r\n\r\n    <!-- PANTALLA 1 -->\r\n    <section class=\"escena activa\" id=\"citap1\">\r\n      <div class=\"emojis-titulo\">\ud83d\udc31\ud83c\udf38\ud83d\udc96<\/div>\r\n      <h1>\u00bfQuieres tener una cita conmigo?<\/h1>\r\n      <p class=\"sub\">Porfaaa, di que s\u00ed \ud83e\udd7a<\/p>\r\n      <div class=\"botones\">\r\n        <button class=\"btn btn-si\" onclick=\"citaSiguiente('citap2')\">\u00a1S\u00ed! \ud83d\udc95<\/button>\r\n        <button class=\"btn btn-no\" data-no>No<\/button>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANTALLA 2 -->\r\n    <section class=\"escena\" id=\"citap2\">\r\n      <div class=\"emojis-titulo\">\ud83c\udf77\ud83c\udf7b\ud83c\udf37<\/div>\r\n      <h1>\u00bfTe apetece tomar una cenita rica conmigo?<\/h1>\r\n      <p class=\"sub\">Con unos vinos y unas cervecitas \ud83d\ude0b<\/p>\r\n      <div class=\"botones\">\r\n        <button class=\"btn btn-si\" onclick=\"citaSiguiente('citap3')\">\u00a1S\u00ed! \ud83e\udd42<\/button>\r\n        <button class=\"btn btn-no\" data-no>No<\/button>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANTALLA 3 (FORMULARIO) -->\r\n    <section class=\"escena\" id=\"citap3\">\r\n      <div class=\"emojis-titulo\">\u2b50\ud83d\udc96\u2b50<\/div>\r\n      <h1>Una \u00faltima cosa...<\/h1>\r\n      <p class=\"sub\">\u00bfCu\u00e1nto me quieres? (del 1 al 1.000.000) \ud83e\udd2d<\/p>\r\n\r\n      <div class=\"estrellas\">\r\n        <div class=\"estrellas-base\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n        <div class=\"estrellas-relleno\" id=\"citaRelleno\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"puntos\" id=\"citaPuntos\">1.000.000<\/div>\r\n      <div class=\"puntos-max\">de 1.000.000<\/div>\r\n\r\n      <input type=\"range\" id=\"citaSlider\" class=\"slider\" min=\"1\" max=\"1000000\" value=\"1000000\">\r\n      <p class=\"mensajito\" id=\"citaMensajito\"><\/p>\r\n\r\n      <button class=\"btn btn-si btn-enviar\" onclick=\"citaSiguiente('citap4')\">Enviar \ud83d\udc8c<\/button>\r\n    <\/section>\r\n\r\n    <!-- PANTALLA 4 (FINAL) -->\r\n    <section class=\"escena final\" id=\"citap4\">\r\n      <div class=\"emojis-titulo\">\ud83e\udd73\ud83c\udf38\ud83d\udc31<\/div>\r\n      <h1>\u00a1Bien!<\/h1>\r\n      <p class=\"recogida\">Te paso a recoger a las 8 y media \ud83d\ude97\ud83d\udca8<\/p>\r\n      <span class=\"beso\">\ud83d\ude18<\/span>\r\n      <p class=\"quiero\">Te quiero much\u00edsimo<\/p>\r\n      <div class=\"corazones-final\">\r\n        <span>\ud83d\udc96<\/span><span>\ud83c\udf38<\/span><span>\ud83d\udc95<\/span><span>\ud83c\udf37<\/span><span>\ud83d\udc96<\/span>\r\n      <\/div>\r\n    <\/section>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  const app = document.querySelector('.cita-app');\r\n\r\n  \/* ---- Cambiar de pantalla ---- *\/\r\n  function citaSiguiente(id){\r\n    app.querySelectorAll('.escena').forEach(e => e.classList.remove('activa'));\r\n    const el = document.getElementById(id);\r\n    if(el) el.classList.add('activa');\r\n  }\r\n  window.citaSiguiente = citaSiguiente;\r\n\r\n  \/* ---- Bot\u00f3n NO que se desliza suavemente huyendo del cursor ---- *\/\r\n  const PAD = 16, ACERCARSE = 140, VOLVER = 260, PASO = 150;\r\n  const clamp = (min, v, max) => Math.max(min, Math.min(max, v));\r\n  const botones = [...app.querySelectorAll('[data-no]')].map(el => ({ el, ox:0, oy:0 }));\r\n\r\n  function colocar(b, destinoX, destinoY){\r\n    const r = b.el.getBoundingClientRect();\r\n    const hw = r.width\/2, hh = r.height\/2;\r\n    destinoX = clamp(hw+PAD, destinoX, window.innerWidth  - hw - PAD);\r\n    destinoY = clamp(hh+PAD, destinoY, window.innerHeight - hh - PAD);\r\n    const baseX = (r.left + hw) - b.ox;\r\n    const baseY = (r.top  + hh) - b.oy;\r\n    b.ox = destinoX - baseX;\r\n    b.oy = destinoY - baseY;\r\n    b.el.style.transform = 'translate(' + b.ox + 'px,' + b.oy + 'px)';\r\n  }\r\n  function volver(b){\r\n    if(b.ox !== 0 || b.oy !== 0){ b.ox = 0; b.oy = 0; b.el.style.transform = 'translate(0px,0px)'; }\r\n  }\r\n  function alMover(cx, cy){\r\n    botones.forEach(b => {\r\n      if(!b.el.offsetParent) return;\r\n      const r = b.el.getBoundingClientRect();\r\n      const centroX = r.left + r.width\/2, centroY = r.top + r.height\/2;\r\n      const dx = centroX - cx, dy = centroY - cy;\r\n      const dist = Math.hypot(dx, dy);\r\n      if(dist < ACERCARSE){\r\n        const ang = Math.atan2(dy, dx);\r\n        colocar(b, centroX + Math.cos(ang)*PASO, centroY + Math.sin(ang)*PASO);\r\n      } else if(dist > VOLVER){ volver(b); }\r\n    });\r\n  }\r\n  window.addEventListener('pointermove', e => alMover(e.clientX, e.clientY));\r\n  botones.forEach(b => {\r\n    b.el.addEventListener('touchstart', e => {\r\n      e.preventDefault();\r\n      const r = b.el.getBoundingClientRect();\r\n      const ang = Math.random() * Math.PI * 2;\r\n      colocar(b, r.left + r.width\/2 + Math.cos(ang)*190, r.top + r.height\/2 + Math.sin(ang)*190);\r\n    }, { passive:false });\r\n  });\r\n\r\n  \/* ---- Puntuaci\u00f3n con estrellas (1 a 1.000.000) ---- *\/\r\n  const slider = document.getElementById('citaSlider');\r\n  const puntos = document.getElementById('citaPuntos');\r\n  const relleno = document.getElementById('citaRelleno');\r\n  const mensajito = document.getElementById('citaMensajito');\r\n\r\n  function mensajePorValor(v){\r\n    if(v < 50000)   return '\u00bfSolo eso? \ud83e\udd72';\r\n    if(v < 250000)  return 'Bueno, algo es algo \ud83d\ude05';\r\n    if(v < 500000)  return '\u00a1Vamos mejorando! \ud83d\ude0a';\r\n    if(v < 800000)  return '\u00a1Eso ya me gusta m\u00e1s! \ud83d\ude0d';\r\n    if(v < 1000000) return '\u00a1Casi el m\u00e1ximo! \ud83e\udd79';\r\n    return '\u00a1EL M\u00c1XIMO! Te quiero igual \ud83d\udc96';\r\n  }\r\n  function actualizarPuntos(){\r\n    const v = parseInt(slider.value, 10);\r\n    puntos.textContent = v.toLocaleString('es-ES');\r\n    relleno.style.width = (v \/ 1000000 * 100) + '%';\r\n    mensajito.textContent = mensajePorValor(v);\r\n  }\r\n  slider.addEventListener('input', actualizarPuntos);\r\n  actualizarPuntos();\r\n\r\n  \/* ---- Emojis flotando de fondo ---- *\/\r\n  const emojis = ['\ud83d\udc31','\ud83c\udf38','\ud83d\udc96','\ud83c\udf37','\u2728','\ud83d\udc95','\ud83d\udc3e','\ud83c\udf39'];\r\n  const fondo = document.getElementById('citaFondo');\r\n  for(let i = 0; i < 22; i++){\r\n    const s = document.createElement('span');\r\n    s.textContent = emojis[Math.floor(Math.random() * emojis.length)];\r\n    s.style.left = Math.random() * 100 + 'vw';\r\n    s.style.fontSize = (20 + Math.random() * 26) + 'px';\r\n    s.style.animationDuration = (7 + Math.random() * 8) + 's';\r\n    s.style.animationDelay = (Math.random() * 8) + 's';\r\n    fondo.appendChild(s);\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\ud83d\udc31\ud83c\udf38\ud83d\udc96 \u00bfQuieres tener una cita conmigo? Porfaaa, di que s\u00ed \ud83e\udd7a \u00a1S\u00ed! \ud83d\udc95 No \ud83c\udf77\ud83c\udf7b\ud83c\udf37 \u00bfTe apetece tomar una cenita rica conmigo? Con unos vinos y unas cervecitas \ud83d\ude0b \u00a1S\u00ed! \ud83e\udd42 No \u2b50\ud83d\udc96\u2b50 Una \u00faltima cosa&#8230; \u00bfCu\u00e1nto me quieres? (del 1 al 1.000.000) \ud83e\udd2d \u2605\u2605\u2605\u2605\u2605 \u2605\u2605\u2605\u2605\u2605 1.000.000 de 1.000.000 Enviar \ud83d\udc8c \ud83e\udd73\ud83c\udf38\ud83d\udc31 \u00a1Bien! Te paso [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/pages\/5","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/airhelper.es\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5"}],"version-history":[{"count":16,"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions"}],"predecessor-version":[{"id":32,"href":"https:\/\/airhelper.es\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions\/32"}],"wp:attachment":[{"href":"https:\/\/airhelper.es\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}