{"id":1038,"date":"2026-05-04T12:23:22","date_gmt":"2026-05-04T10:23:22","guid":{"rendered":"https:\/\/grupaimmobles.com\/ahipoteques\/calculadora-de-hipotecas\/"},"modified":"2026-06-01T09:37:39","modified_gmt":"2026-06-01T07:37:39","slug":"calculadora-de-hipotecas","status":"publish","type":"page","link":"https:\/\/ahipoteques.com\/es\/calculadora-de-hipotecas\/","title":{"rendered":"Calculadora de hipotecas"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1038\" class=\"elementor elementor-1038 elementor-150\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e4ab298 e-flex e-con-boxed e-con e-parent\" data-id=\"e4ab298\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5cc63d3 e-con-full e-flex e-con e-child\" data-id=\"5cc63d3\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c3ac692 elementor-widget elementor-widget-shortcode\" data-id=\"c3ac692\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div class=\"ahip-simulador\" id=\"ahip-sim-6a6e096dd71b7\">\n\n<style>\n.ahip-simulador {\n  --primary:    #1e608a;\n  --light-blue: #a2dafe;\n  --dark:       #073858;\n  --bg:         #f2f2f2;\n  --accent:     #ffd233;\n  --white:      #ffffff;\n  --text:       #1a1a2e;\n  --muted:      #6b7a8d;\n  --radius:     16px;\n  --radius-sm:  10px;\n  --shadow:     0 4px 24px rgba(7,56,88,0.10);\n  --font:       'rig-sans', 'Barlow', 'Helvetica Neue', Arial, sans-serif;\n  --tr:         0.25s ease;\n\n  width: 100%;\n  max-width: 680px;\n  margin: 0 auto;\n  font-family: var(--font);\n  color: var(--text);\n  box-sizing: border-box;\n}\n.ahip-simulador *, .ahip-simulador *::before, .ahip-simulador *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\n\/* \u2500\u2500\u2500 HEADER \u2500\u2500\u2500 *\/\n.ahip-simulador .widget-header { margin-bottom: 8px; }\n.ahip-simulador .widget-eyebrow {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--accent);\n  color: var(--dark);\n  font-size: 11px;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  padding: 4px 12px;\n  border-radius: 100px;\n  margin-bottom: 12px;\n}\n.ahip-simulador .widget-title {\n  font-size: clamp(22px, 5vw, 30px);\n  font-weight: 600;\n  color: var(--dark);\n  line-height: 1.1;\n  letter-spacing: -0.02em;\n}\n.ahip-simulador .widget-subtitle {\n  font-size: 14px;\n  color: var(--muted);\n  margin-top: 6px;\n  line-height: 1.5;\n}\n\n\/* \u2500\u2500\u2500 CARD \u2500\u2500\u2500 *\/\n.ahip-simulador .card {\n  background: var(--white);\n  border-radius: var(--radius);\n  box-shadow: var(--shadow);\n  overflow: hidden;\n  margin-top: 20px;\n}\n\n\/* \u2500\u2500\u2500 INPUTS \u2500\u2500\u2500 *\/\n.ahip-simulador .inputs-section {\n  padding: 28px 28px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 28px;\n}\n.ahip-simulador .field-group {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.ahip-simulador .field-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ahip-simulador .field-label {\n  font-size: 13px;\n  font-weight: 700;\n  color: var(--dark);\n  letter-spacing: 0.01em;\n}\n.ahip-simulador .field-value-badge {\n  background: var(--primary);\n  color: var(--white);\n  font-size: 14px;\n  font-weight: 700;\n  padding: 4px 14px;\n  border-radius: 100px;\n  min-width: 90px;\n  text-align: center;\n  transition: background var(--tr);\n}\n.ahip-simulador .field-input-wrap { position: relative; }\n.ahip-simulador .field-input {\n  width: 100%;\n  border: 2px solid #e2e8f0;\n  border-radius: var(--radius-sm);\n  padding: 12px 16px;\n  font-family: var(--font);\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--dark);\n  background: #f8fafc;\n  outline: none;\n  transition: border-color var(--tr), box-shadow var(--tr);\n  -moz-appearance: textfield;\n}\n.ahip-simulador .field-input::-webkit-inner-spin-button,\n.ahip-simulador .field-input::-webkit-outer-spin-button { -webkit-appearance: none; }\n.ahip-simulador .field-input:focus {\n  border-color: var(--primary);\n  box-shadow: 0 0 0 3px rgba(30,96,138,0.12);\n  background: var(--white);\n}\n.ahip-simulador .field-unit {\n  position: absolute;\n  right: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 15px;\n  font-weight: 700;\n  color: var(--muted);\n  pointer-events: none;\n}\n\n\/* \u2500\u2500\u2500 SLIDER \u2500\u2500\u2500 *\/\n.ahip-simulador .slider-wrap { position: relative; padding: 4px 0 0; }\n.ahip-simulador .slider-track-bg {\n  height: 22px;\n  display: flex;\n  align-items: center;\n  background: transparent;\n  position: relative;\n  margin: 0 2px;\n}\n.ahip-simulador .slider-track-bg-inner {\n  position: absolute;\n  left: 0; right: 0; top: 50%;\n  transform: translateY(-50%);\n  height: 6px;\n  background: #e2e8f0;\n  border-radius: 100px;\n}\n.ahip-simulador .slider-track-fill {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translateY(-50%);\n  height: 6px;\n  background: var(--primary);\n  border-radius: 100px;\n  pointer-events: none;\n  transition: width 0.05s;\n}\n.ahip-simulador .slider {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  width: 100%;\n  transform: translateY(-50%);\n  -webkit-appearance: none;\n  appearance: none;\n  background: transparent;\n  cursor: pointer;\n  margin: 0;\n}\n.ahip-simulador .slider::-webkit-slider-thumb {\n  -webkit-appearance: none;\n  width: 22px; height: 22px;\n  border-radius: 50%;\n  background: var(--white);\n  border: 3px solid var(--primary);\n  box-shadow: 0 2px 8px rgba(30,96,138,0.25);\n  transition: border-color var(--tr), box-shadow var(--tr);\n}\n.ahip-simulador .slider::-moz-range-thumb {\n  width: 22px; height: 22px;\n  border-radius: 50%;\n  background: var(--white);\n  border: 3px solid var(--primary);\n  box-shadow: 0 2px 8px rgba(30,96,138,0.25);\n  cursor: pointer;\n}\n.ahip-simulador .slider:focus::-webkit-slider-thumb {\n  border-color: var(--accent);\n  box-shadow: 0 0 0 4px rgba(255,210,51,0.25);\n}\n.ahip-simulador .slider-labels {\n  display: flex;\n  justify-content: space-between;\n  margin-top: 8px;\n  font-size: 11px;\n  color: var(--muted);\n  font-weight: 500;\n}\n\n\/* \u2500\u2500\u2500 DIVIDER \u2500\u2500\u2500 *\/\n.ahip-simulador .divider { height: 1px; background: #f0f4f8; margin: 0 28px; }\n\n\/* \u2500\u2500\u2500 RESULTS \u2500\u2500\u2500 *\/\n.ahip-simulador .result-section {\n  background: var(--dark);\n  padding: 28px 28px 32px;\n  position: relative;\n  overflow: hidden;\n}\n.ahip-simulador .result-section::before {\n  content: '';\n  position: absolute;\n  top: -40px; right: -40px;\n  width: 200px; height: 200px;\n  border-radius: 50%;\n  background: rgba(162,218,254,0.08);\n  pointer-events: none;\n}\n.ahip-simulador .result-section::after {\n  content: '';\n  position: absolute;\n  bottom: -60px; left: -30px;\n  width: 160px; height: 160px;\n  border-radius: 50%;\n  background: rgba(255,210,51,0.05);\n  pointer-events: none;\n}\n.ahip-simulador .result-main {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n  margin-bottom: 24px;\n}\n.ahip-simulador .result-label {\n  font-size: 12px;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  color: var(--light-blue);\n  margin-bottom: 8px;\n}\n.ahip-simulador .result-quota {\n  font-size: clamp(42px, 10vw, 58px);\n  font-weight: 600;\n  color: var(--white);\n  letter-spacing: -0.03em;\n  line-height: 1;\n  transition: all 0.3s ease;\n}\n.ahip-simulador .result-quota span {\n  font-size: 0.45em;\n  font-weight: 700;\n  opacity: 0.8;\n  letter-spacing: 0;\n}\n.ahip-simulador .result-meta {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 12px;\n}\n.ahip-simulador .result-meta-item {\n  background: rgba(255,255,255,0.08);\n  border: 1px solid rgba(255,255,255,0.12);\n  border-radius: var(--radius-sm);\n  padding: 14px 16px;\n}\n.ahip-simulador .result-meta-label {\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--light-blue);\n  letter-spacing: 0.05em;\n  text-transform: uppercase;\n  margin-bottom: 4px;\n}\n.ahip-simulador .result-meta-value {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--white);\n  letter-spacing: -0.01em;\n  transition: all 0.3s ease;\n}\n.ahip-simulador .result-meta-value.accent { color: var(--accent); }\n\n\/* \u2500\u2500\u2500 CTA \u2500\u2500\u2500 *\/\n.ahip-simulador .cta-section { padding: 20px 28px 28px; background: var(--white); }\n.ahip-simulador .cta-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  width: 100%;\n  padding: 16px 24px;\n  background: var(--primary);\n  color: var(--white);\n  border: none;\n  border-radius: var(--radius-sm);\n  font-family: var(--font);\n  font-size: 15px;\n  font-weight: 700;\n  letter-spacing: 0.01em;\n  cursor: pointer;\n  transition: background var(--tr), transform var(--tr), box-shadow var(--tr);\n}\n.ahip-simulador .cta-btn:hover {\n  background: var(--dark);\n  transform: translateY(-1px);\n  box-shadow: 0 6px 20px rgba(7,56,88,0.25);\n}\n.ahip-simulador .cta-btn:active { transform: translateY(0); }\n.ahip-simulador .cta-btn svg { flex-shrink: 0; }\n.ahip-simulador .cta-note {\n  text-align: center;\n  font-size: 11px;\n  color: var(--muted);\n  margin-top: 10px;\n}\n\n\/* \u2500\u2500\u2500 DISCLAIMER \u2500\u2500\u2500 *\/\n.ahip-simulador .disclaimer {\n  font-size: 11px;\n  color: var(--muted);\n  text-align: center;\n  margin-top: 16px;\n  line-height: 1.5;\n}\n\n\/* \u2500\u2500\u2500 INTEREST \u2500\u2500\u2500 *\/\n.ahip-simulador .interest-row {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 16px;\n  align-items: end;\n}\n.ahip-simulador .interest-presets { display: flex; flex-direction: column; gap: 6px; }\n.ahip-simulador .interest-presets-label {\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--muted);\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n}\n.ahip-simulador .preset-pills { display: flex; gap: 6px; }\n.ahip-simulador .preset-pill {\n  flex: 1;\n  padding: 8px 4px;\n  border: 2px solid #e2e8f0;\n  border-radius: 8px;\n  background: #f8fafc;\n  font-family: var(--font);\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--muted);\n  cursor: pointer;\n  text-align: center;\n  transition: all var(--tr);\n}\n.ahip-simulador .preset-pill:hover { border-color: var(--primary); color: var(--primary); }\n.ahip-simulador .preset-pill.active {\n  border-color: var(--primary);\n  background: var(--primary);\n  color: var(--white);\n}\n.ahip-simulador .preset-pill span {\n  display: block;\n  font-size: 9px;\n  font-weight: 500;\n  opacity: 0.8;\n  margin-top: 1px;\n}\n\n\/* \u2500\u2500\u2500 CAMP PERSONALITZAT \u2500\u2500\u2500 *\/\n.ahip-simulador .preset-pill-custom {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 2px;\n  padding: 6px 4px;\n  border: 2px solid #e2e8f0;\n  border-radius: 8px;\n  background: #f8fafc;\n  cursor: text;\n  transition: border-color var(--tr), box-shadow var(--tr);\n  min-width: 62px;\n}\n.ahip-simulador .preset-pill-custom:focus-within {\n  border-color: var(--primary);\n  box-shadow: 0 0 0 3px rgba(30,96,138,0.12);\n  background: var(--white);\n}\n.ahip-simulador .preset-pill-custom.active {\n  border-color: var(--primary);\n  background: var(--white);\n}\n.ahip-simulador .preset-pill-custom-input {\n  width: 100%;\n  border: none;\n  background: transparent;\n  font-family: var(--font);\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--dark);\n  text-align: center;\n  outline: none;\n  -moz-appearance: textfield;\n  padding: 0;\n  line-height: 1.2;\n}\n.ahip-simulador .preset-pill-custom-input::-webkit-inner-spin-button,\n.ahip-simulador .preset-pill-custom-input::-webkit-outer-spin-button { -webkit-appearance: none; }\n.ahip-simulador .preset-pill-custom-input::placeholder { color: var(--muted); font-weight: 600; }\n.ahip-simulador .preset-pill-custom span {\n  display: block;\n  font-size: 9px;\n  font-weight: 500;\n  color: var(--muted);\n  margin-top: 1px;\n  white-space: nowrap;\n}\n\n\/* \u2500\u2500\u2500 ANIMATION \u2500\u2500\u2500 *\/\n@keyframes ahip-pulse-value {\n  0%   { transform: scale(1); }\n  50%  { transform: scale(1.04); }\n  100% { transform: scale(1); }\n}\n.ahip-simulador .ahip-pulse { animation: ahip-pulse-value 0.3s ease; }\n\n\/* \u2500\u2500\u2500 RESPONSIVE \u2500\u2500\u2500 *\/\n@media (max-width: 480px) {\n  .ahip-simulador .inputs-section { padding: 20px 20px 16px; gap: 22px; }\n  .ahip-simulador .result-section { padding: 20px 20px 24px; }\n  .ahip-simulador .cta-section    { padding: 16px 20px 20px; }\n  .ahip-simulador .divider        { margin: 0 20px; }\n  .ahip-simulador .interest-row   { grid-template-columns: 1fr; }\n}\n<\/style>\n\n  <!-- Header -->\n  <div class=\"widget-header\">\n    <div class=\"widget-eyebrow\">\n      <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><polyline points=\"22 12 18 12 15 21 9 3 6 12 2 12\"><\/polyline><\/svg>\n      Herramienta de c\u00e1lculo    <\/div>\n    <h2 class=\"widget-title\">Simulador de Hipoteca<\/h2>\n    <p class=\"widget-subtitle\">Calcula tu cuota mensual en tiempo real. Sin compromiso. <\/p>\n  <\/div>\n\n  <div class=\"card\">\n    <!-- INPUTS -->\n    <div class=\"inputs-section\">\n\n      <!-- Import -->\n      <div class=\"field-group\">\n        <div class=\"field-header\">\n          <span class=\"field-label\">Importe de la hipoteca<\/span>\n          <span class=\"field-value-badge\" data-sim=\"badge-import\">200.000 \u20ac<\/span>\n        <\/div>\n        <div class=\"field-input-wrap\">\n          <input class=\"field-input\" type=\"number\" data-sim=\"input-import\" value=\"200000\" min=\"10000\" max=\"1000000\" step=\"1000\" style=\"padding-right:36px\" aria-label=\"Importe de la hipoteca\">\n          <span class=\"field-unit\">\u20ac<\/span>\n        <\/div>\n        <div class=\"slider-wrap\">\n          <div class=\"slider-track-bg\" style=\"position:relative;\">\n            <div class=\"slider-track-bg-inner\"><\/div>\n            <div class=\"slider-track-fill\" data-sim=\"fill-import\" style=\"position:absolute;top:50%;transform:translateY(-50%);height:6px;border-radius:100px;\"><\/div>\n            <input class=\"slider\" type=\"range\" data-sim=\"slider-import\" min=\"10000\" max=\"1000000\" step=\"1000\" value=\"200000\" aria-label=\"Slider\">\n          <\/div>\n          <div class=\"slider-labels\">\n            <span>10.000 \u20ac<\/span>\n            <span>500.000 \u20ac<\/span>\n            <span>1.000.000 \u20ac<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Anys -->\n      <div class=\"field-group\">\n        <div class=\"field-header\">\n          <span class=\"field-label\">Duraci\u00f3n de la hipoteca<\/span>\n          <span class=\"field-value-badge\" data-sim=\"badge-anys\">25 a\u00f1os<\/span>\n        <\/div>\n        <div class=\"field-input-wrap\">\n          <input class=\"field-input\" type=\"number\" data-sim=\"input-anys\" value=\"25\" min=\"5\" max=\"40\" step=\"1\" style=\"padding-right:52px\" aria-label=\"Duraci\u00f3n de la hipoteca\">\n          <span class=\"field-unit\">a\u00f1os<\/span>\n        <\/div>\n        <div class=\"slider-wrap\">\n          <div class=\"slider-track-bg\" style=\"position:relative;\">\n            <div class=\"slider-track-bg-inner\"><\/div>\n            <div class=\"slider-track-fill\" data-sim=\"fill-anys\" style=\"position:absolute;top:50%;transform:translateY(-50%);height:6px;border-radius:100px;\"><\/div>\n            <input class=\"slider\" type=\"range\" data-sim=\"slider-anys\" min=\"5\" max=\"40\" step=\"1\" value=\"25\" aria-label=\"Slider\">\n          <\/div>\n          <div class=\"slider-labels\">\n            <span>5 a\u00f1os<\/span>\n            <span>20 a\u00f1os<\/span>\n            <span>40 a\u00f1os<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Inter\u00e8s -->\n      <div class=\"field-group\">\n        <div class=\"field-header\">\n          <span class=\"field-label\">Tipo de inter\u00e9s (TIN anual)<\/span>\n          <span class=\"field-value-badge\" data-sim=\"badge-interes\">3,50 %<\/span>\n        <\/div>\n        <div class=\"interest-row\">\n          <div class=\"field-input-wrap\">\n            <input class=\"field-input\" type=\"number\" data-sim=\"input-interes\" value=\"3.50\" min=\"0.1\" max=\"15\" step=\"0.05\" style=\"padding-right:32px\" aria-label=\"Tipo de inter\u00e9s (TIN anual)\">\n            <span class=\"field-unit\">%<\/span>\n          <\/div>\n          <div class=\"interest-presets\">\n            <span class=\"interest-presets-label\">R\u00e1pido<\/span>\n            <div class=\"preset-pills\">\n              <button class=\"preset-pill\" data-val=\"2.5\">2,5%<span>Fijo bajo<\/span><\/button>\n              <button class=\"preset-pill active\" data-val=\"3.5\">3,5%<span>Medio<\/span><\/button>\n              <button class=\"preset-pill\" data-val=\"5\">5%<span>Variable<\/span><\/button>\n              <div class=\"preset-pill-custom\" data-sim=\"pill-custom\">\n                <input class=\"preset-pill-custom-input\" type=\"number\" data-sim=\"input-custom\" min=\"0.1\" max=\"15\" step=\"0.05\" placeholder=\"__%\" aria-label=\"Personalizado\">\n                <span>Personalizado<\/span>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div><!-- \/inputs-section -->\n\n    <div class=\"divider\"><\/div>\n\n    <!-- RESULTS -->\n    <div class=\"result-section\">\n      <div class=\"result-main\">\n        <div class=\"result-label\">Cuota mensual estimada<\/div>\n        <div class=\"result-quota\" data-sim=\"result-quota\" aria-live=\"polite\">1.001 <span>\u20ac\/mes<\/span><\/div>\n      <\/div>\n      <div class=\"result-meta\">\n        <div class=\"result-meta-item\">\n          <div class=\"result-meta-label\">Total a pagar<\/div>\n          <div class=\"result-meta-value\" data-sim=\"result-total\" aria-live=\"polite\">300.312 \u20ac<\/div>\n        <\/div>\n        <div class=\"result-meta-item\">\n          <div class=\"result-meta-label\">Total intereses<\/div>\n          <div class=\"result-meta-value accent\" data-sim=\"result-interessos\" aria-live=\"polite\">100.312 \u20ac<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- CTA -->\n    <div class=\"cta-section\">\n      <button class=\"cta-btn\" data-sim=\"cta-btn\" data-url=\"https:\/\/ahipoteques.com\/es\/formulario-hipoteca\/\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07A19.5 19.5 0 013.93 9.11a19.79 19.79 0 01-3.07-8.67A2 2 0 012.84 2h3a2 2 0 012 1.72c.12.96.36 1.9.7 2.81a2 2 0 01-.45 2.11L6.91 9.91a16 16 0 006.18 6.18l1.27-1.27a2 2 0 012.11-.45c.91.34 1.85.58 2.81.7A2 2 0 0122 16.92z\"><\/path><\/svg>\n        Solicita estudio gratuito      <\/button>\n      <p class=\"cta-note\">Respuesta en menos de 24h \u00b7 Sin compromiso<\/p>\n    <\/div>\n  <\/div>\n\n  <p class=\"disclaimer\">* C\u00e1lculo orientativo basado en la f\u00f3rmula de renta francesa. No incluye gastos de formalizaci\u00f3n, seguros ni comisiones. Consulta a un especialista de Hipotecas para informaci\u00f3n personalizada.  <\/p>\n\n<\/div><!-- \/.ahip-simulador -->\n\n<script>\n(function() {\n  'use strict';\n  var root    = document.getElementById('ahip-sim-6a6e096dd71b7');\n  var S_ANYS  = 'a\u00f1os';\n  var S_UNIT  = '\u20ac\/mes';\n  if (!root) return;\n\n  function $s(attr) { return root.querySelector('[data-sim=\"' + attr + '\"]'); }\n\n  var state = { imp: 200000, anys: 25, interes: 3.5 };\n\n  var inputImport  = $s('input-import');\n  var sliderImport = $s('slider-import');\n  var fillImport   = $s('fill-import');\n  var badgeImport  = $s('badge-import');\n\n  var inputAnys    = $s('input-anys');\n  var sliderAnys   = $s('slider-anys');\n  var fillAnys     = $s('fill-anys');\n  var badgeAnys    = $s('badge-anys');\n\n  var inputInteres = $s('input-interes');\n  var badgeInteres = $s('badge-interes');\n\n  var resultQuota      = $s('result-quota');\n  var resultTotal      = $s('result-total');\n  var resultInteressos = $s('result-interessos');\n\n  function fmtEur(n) {\n    return n.toLocaleString('ca-ES', { maximumFractionDigits: 0 }) + ' \u20ac';\n  }\n  function fmtPct(n) {\n    return n.toLocaleString('ca-ES', { minimumFractionDigits: 2, maximumFractionDigits: 2 }) + ' %';\n  }\n\n  function calcQuota(P, years, annualRate) {\n    var n = years * 12;\n    var r = annualRate \/ 100 \/ 12;\n    if (r === 0) return P \/ n;\n    return P * r * Math.pow(1 + r, n) \/ (Math.pow(1 + r, n) - 1);\n  }\n\n  function updateFill(slider, fill) {\n    var min = parseFloat(slider.min);\n    var max = parseFloat(slider.max);\n    var val = parseFloat(slider.value);\n    fill.style.width = ((val - min) \/ (max - min) * 100) + '%';\n  }\n\n  function pulseEl(el) {\n    el.classList.remove('ahip-pulse');\n    void el.offsetWidth;\n    el.classList.add('ahip-pulse');\n    el.addEventListener('animationend', function() { el.classList.remove('ahip-pulse'); }, { once: true });\n  }\n\n  function render() {\n    var quota     = calcQuota(state.imp, state.anys, state.interes);\n    var total     = quota * state.anys * 12;\n    var interessos = total - state.imp;\n\n    resultQuota.innerHTML      = Math.round(quota).toLocaleString('ca-ES') + ' <span>' + S_UNIT + '<\/span>';\n    resultTotal.textContent    = fmtEur(Math.round(total));\n    resultInteressos.textContent = fmtEur(Math.round(interessos));\n    pulseEl(resultQuota);\n  }\n\n  function syncImport(val) {\n    val = Math.max(10000, Math.min(1000000, Number(val) || 10000));\n    state.imp = val;\n    inputImport.value  = val;\n    sliderImport.value = val;\n    badgeImport.textContent = fmtEur(val);\n    updateFill(sliderImport, fillImport);\n    render();\n  }\n\n  function syncAnys(val) {\n    val = Math.max(5, Math.min(40, Number(val) || 5));\n    state.anys = val;\n    inputAnys.value  = val;\n    sliderAnys.value = val;\n    badgeAnys.textContent = val + ' ' + S_ANYS;\n    updateFill(sliderAnys, fillAnys);\n    render();\n  }\n\n  var pillCustomWrap  = $s('pill-custom');\n  var inputCustom     = $s('input-custom');\n\n  function syncInteres(val, fromCustom) {\n    val = Math.max(0.1, Math.min(15, parseFloat(val) || 0.1));\n    state.interes = val;\n    inputInteres.value = val.toFixed(2);\n    badgeInteres.textContent = fmtPct(val);\n    \/* Pills fixes: activar si coincideix *\/\n    root.querySelectorAll('.preset-pill').forEach(function(p) {\n      p.classList.toggle('active', parseFloat(p.dataset.val) === val);\n    });\n    \/* Pill personalitzada: activa si no coincideix amb cap pill fixa *\/\n    var matchesFixed = [2.5, 3.5, 5].some(function(v) { return v === val; });\n    if (pillCustomWrap) pillCustomWrap.classList.toggle('active', !matchesFixed);\n    \/* Actualitzar el camp personalitzat llevat que el canvi ja vingu\u00ed d'ell *\/\n    if (!fromCustom && inputCustom) {\n      inputCustom.value = matchesFixed ? '' : val.toFixed(2);\n    }\n    render();\n  }\n\n  inputImport.addEventListener('input',  function(e) { syncImport(e.target.value); });\n  sliderImport.addEventListener('input', function(e) { syncImport(e.target.value); });\n  inputAnys.addEventListener('input',    function(e) { syncAnys(e.target.value); });\n  sliderAnys.addEventListener('input',   function(e) { syncAnys(e.target.value); });\n  inputInteres.addEventListener('input', function(e) {\n    if (inputCustom) inputCustom.value = '';\n    syncInteres(e.target.value);\n  });\n\n  root.querySelectorAll('.preset-pill').forEach(function(pill) {\n    pill.addEventListener('click', function() {\n      if (inputCustom) inputCustom.value = '';\n      syncInteres(parseFloat(pill.dataset.val));\n    });\n  });\n\n  \/* Camp personalitzat *\/\n  if (inputCustom) {\n    inputCustom.addEventListener('input', function() {\n      var v = parseFloat(inputCustom.value);\n      if (!isNaN(v) && v >= 0.1) syncInteres(v, true);\n    });\n    inputCustom.addEventListener('focus', function() {\n      if (pillCustomWrap) pillCustomWrap.classList.add('active');\n    });\n    inputCustom.addEventListener('blur', function() {\n      \/* Si el camp queda buit en sortir, tornar al valor actiu *\/\n      if (!inputCustom.value || parseFloat(inputCustom.value) < 0.1) {\n        inputCustom.value = '';\n        if (pillCustomWrap) pillCustomWrap.classList.remove('active');\n      }\n    });\n  }\n\n  \/* CTA: redirigeix a la URL configurada, o fa scroll al formulari si \u00e9s a la mateixa p\u00e0gina *\/\n  var ctaBtn = $s('cta-btn');\n  if (ctaBtn) {\n    ctaBtn.addEventListener('click', function() {\n      var url = ctaBtn.dataset.url || '';\n      if (url) {\n        window.location.href = url;\n      } else {\n        var form = document.querySelector('.ahip-formulari');\n        if (form) form.scrollIntoView({ behavior: 'smooth', block: 'start' });\n      }\n    });\n  }\n\n  \/* Init *\/\n  syncImport(state.imp);\n  syncAnys(state.anys);\n  syncInteres(state.interes);\n})();\n<\/script>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1038","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/pages\/1038","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/comments?post=1038"}],"version-history":[{"count":1,"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/pages\/1038\/revisions"}],"predecessor-version":[{"id":1040,"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/pages\/1038\/revisions\/1040"}],"wp:attachment":[{"href":"https:\/\/ahipoteques.com\/es\/wp-json\/wp\/v2\/media?parent=1038"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}