{"id":285,"date":"2026-02-04T04:08:40","date_gmt":"2026-02-04T04:08:40","guid":{"rendered":"https:\/\/withifi.muhubonurture.nl\/?page_id=285"},"modified":"2026-06-20T03:34:52","modified_gmt":"2026-06-20T03:34:52","slug":"armen-en-benen","status":"publish","type":"page","link":"https:\/\/withifi.muhubonurture.nl\/?page_id=285","title":{"rendered":"Armen &amp; Benen"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"285\" class=\"elementor elementor-285\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-65f14a3 e-con-full e-flex e-con e-parent\" data-id=\"65f14a3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a7bd905 elementor-widget elementor-widget-html\" data-id=\"a7bd905\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\nbody {\r\n  margin: 0;\r\n  font-family: 'Inter', sans-serif;\r\n}\r\n\r\n\/* ===================================\r\n   RUSTMOMENT \u2014 ARMEN & BENEN BEWEGEN\r\n   Soft mint \u2022 active but calm\r\n=================================== *\/\r\n\r\n.ifi-anchor {\r\n  position: relative;\r\n  min-height: 100vh;\r\n  overflow: hidden;\r\n  padding: 6rem 7vw;\r\n\r\n  color: #3B2A22;\r\n\r\n  background:\r\n    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.72) 0%, transparent 28%),\r\n    radial-gradient(circle at 78% 35%, rgba(223,241,255,0.72) 0%, transparent 30%),\r\n    radial-gradient(circle at 50% 82%, rgba(220,235,231,0.68) 0%, transparent 35%),\r\n    linear-gradient(\r\n      135deg,\r\n      #FFF7E8 0%,\r\n      #EAF4F1 45%,\r\n      #DCEBE7 100%\r\n    );\r\n}\r\n\r\n\/* ===================================\r\n   SCENES\r\n=================================== *\/\r\n\r\n.ifi-scene {\r\n  position: absolute;\r\n  inset: 0;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  padding: 6vh 7vw;\r\n\r\n  opacity: 0;\r\n  pointer-events: none;\r\n\r\n  transform: translateY(24px);\r\n  transition: all .8s ease;\r\n}\r\n\r\n.ifi-scene.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n  transform: translateY(0);\r\n}\r\n\r\n.ifi-scene-inner {\r\n  width: 100%;\r\n  max-width: 1250px;\r\n\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  align-items: center;\r\n\r\n  gap: 90px;\r\n}\r\n\r\n\/* ===================================\r\n   TEXT\r\n=================================== *\/\r\n\r\n.ifi-text {\r\n  max-width: 560px;\r\n}\r\n\r\n.ifi-label {\r\n  display: inline-block;\r\n  margin-bottom: 22px;\r\n  padding: 11px 20px;\r\n\r\n  border-radius: 999px;\r\n\r\n  background: rgba(255,255,255,0.52);\r\n  border: 1px solid rgba(255,255,255,0.9);\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n\r\n  color: #7A5140;\r\n  font-size: 15px;\r\n  font-weight: 800;\r\n}\r\n\r\n.ifi-text h2 {\r\n  margin: 0 0 28px;\r\n\r\n  font-size: clamp(42px,5vw,64px);\r\n  line-height: 1.05;\r\n  font-weight: 800;\r\n\r\n  color: #3B2A22;\r\n}\r\n\r\n.ifi-text p {\r\n  margin: 0 0 22px;\r\n\r\n  font-size: 20px;\r\n  line-height: 1.8;\r\n  font-weight: 600;\r\n\r\n  color: #7A5140;\r\n}\r\n\r\n\/* ===================================\r\n   BUTTON\r\n=================================== *\/\r\n\r\n.ifi-btn {\r\n  display: inline-block;\r\n\r\n  margin-top: 2.2rem;\r\n  padding: 1rem 2.2rem;\r\n\r\n  border-radius: 999px;\r\n\r\n  text-decoration: none;\r\n  cursor: pointer;\r\n\r\n  background: rgba(255,255,255,0.58);\r\n  border: 1px solid rgba(255,255,255,0.95);\r\n\r\n  color: #3B2A22;\r\n  font-weight: 800;\r\n\r\n  box-shadow: 0 8px 24px rgba(80,60,40,0.08);\r\n\r\n  transition: all .25s ease;\r\n}\r\n\r\n.ifi-btn:hover {\r\n  transform: translateY(-2px);\r\n  background: rgba(255,255,255,0.78);\r\n}\r\n\r\n\/* ===================================\r\n   AVATAR\r\n=================================== *\/\r\n\r\n.ifi-avatar {\r\n  position: relative;\r\n\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.ifi-avatar::before {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n\r\n  width: 430px;\r\n  height: 430px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(223,241,255,0.78) 0%,\r\n      rgba(220,235,231,0.55) 45%,\r\n      transparent 72%\r\n    );\r\n\r\n  filter: blur(48px);\r\n}\r\n\r\n.ifi-avatar img {\r\n  position: relative;\r\n  z-index: 2;\r\n\r\n  width: 100%;\r\n  max-width: 500px;\r\n  height: auto;\r\n\r\n  filter: drop-shadow(0 24px 42px rgba(80,60,40,0.10));\r\n\r\n  animation: gentleMove 5s ease-in-out infinite;\r\n}\r\n\r\n@keyframes gentleMove {\r\n  0%, 100% {\r\n    transform: translateY(0);\r\n  }\r\n\r\n  50% {\r\n    transform: translateY(-7px);\r\n  }\r\n}\r\n\r\n\/* ===================================\r\n   TIMER\r\n=================================== *\/\r\n\r\n.ifi-timer {\r\n  margin-top: 2.4rem;\r\n  max-width: 360px;\r\n}\r\n\r\n.ifi-timer-bar {\r\n  width: 100%;\r\n  height: 10px;\r\n\r\n  overflow: hidden;\r\n\r\n  border-radius: 999px;\r\n\r\n  background: rgba(255,255,255,0.5);\r\n}\r\n\r\n.ifi-timer-progress {\r\n  height: 100%;\r\n  width: 100%;\r\n\r\n  border-radius: 999px;\r\n\r\n  background: #AFC7E8;\r\n\r\n  transition: width 1s linear;\r\n}\r\n\r\n.ifi-timer-text {\r\n  margin-top: .9rem;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n\r\n  color: #7A5140;\r\n}\r\n\r\n\/* ===================================\r\n   RESPONSIVE\r\n=================================== *\/\r\n\r\n@media (max-width: 900px) {\r\n  .ifi-scene {\r\n    position: relative;\r\n    min-height: 100vh;\r\n  }\r\n\r\n  .ifi-scene-inner {\r\n    grid-template-columns: 1fr;\r\n    gap: 42px;\r\n    text-align: center;\r\n  }\r\n\r\n  .ifi-avatar {\r\n    order: 1;\r\n  }\r\n\r\n  .ifi-text {\r\n    order: 2;\r\n    max-width: 100%;\r\n  }\r\n\r\n  .ifi-avatar img {\r\n    max-width: 340px;\r\n  }\r\n\r\n  .ifi-timer {\r\n    margin-left: auto;\r\n    margin-right: auto;\r\n  }\r\n\r\n  .ifi-btn {\r\n    width: 100%;\r\n    text-align: center;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div class=\"ifi-anchor\">\r\n\r\n\r\n\r\n  <!-- SCENE 1 \u2013 VOETEN -->\r\n  <div class=\"ifi-scene active\" id=\"scene-voeten\">\r\n    <div class=\"ifi-scene-inner\">\r\n\r\n      <div class=\"ifi-text\">\r\n        <div class=\"ifi-label\">\ud83e\uddb6 Rustmoment<\/div>\r\n\r\n        <h2>Voeten bewegen.<\/h2>\r\n\r\n        <p>\r\n          Misschien voel je je voeten op de grond.<br>\r\n          Of in je schoenen.\r\n        <\/p>\r\n\r\n        <p>\r\n          Je kunt rustig op de plaats<br>\r\n          een paar stapjes maken.\r\n        <\/p>\r\n\r\n        <p>\r\n          Alsof je lijf even wakker wordt.<br>\r\n          Op jouw manier.\r\n        <\/p>\r\n\r\n        <p>\r\n          Ik doe met je mee.\r\n        <\/p>\r\n\r\n        <div class=\"ifi-timer\">\r\n          <div class=\"ifi-timer-bar\">\r\n            <div class=\"ifi-timer-progress\" id=\"timer-voeten\"><\/div>\r\n          <\/div>\r\n          <div class=\"ifi-timer-text\" id=\"timer-voeten-text\">\r\n            We bewegen even\u2026\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <a class=\"ifi-btn\" onclick=\"goToScene('scene-armen')\">\r\n          Armen rustig meebewegen\r\n        <\/a>\r\n      <\/div>\r\n\r\n      <div class=\"ifi-avatar\">\r\n        <img decoding=\"async\" src=\"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/Benen-Bewegen.png\" alt=\"IFI voeten bewegen\">\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- SCENE 2 \u2013 ARMEN -->\r\n  <div class=\"ifi-scene\" id=\"scene-armen\">\r\n    <div class=\"ifi-scene-inner\">\r\n\r\n      <div class=\"ifi-text\">\r\n        <div class=\"ifi-label\">\ud83c\udf3f Rustmoment<\/div>\r\n\r\n        <h2>Armen bewegen.<\/h2>\r\n\r\n        <p>\r\n          Je kunt je armen rustig<br>\r\n          een beetje laten draaien.\r\n        <\/p>\r\n\r\n        <p>\r\n          Vooruit.<br>\r\n          En misschien ook achteruit.\r\n        <\/p>\r\n\r\n        <p>\r\n          Alsof je ruimte maakt in je lijf.\r\n        <\/p>\r\n\r\n        <p>\r\n          Niets forceren.<br>\r\n          Alles is goed.\r\n        <\/p>\r\n\r\n        <p>\r\n          We zijn weer klaar om verder te gaan.\r\n        <\/p>\r\n\r\n        <div class=\"ifi-timer\">\r\n          <div class=\"ifi-timer-bar\">\r\n            <div class=\"ifi-timer-progress\" id=\"timer-armen\"><\/div>\r\n          <\/div>\r\n          <div class=\"ifi-timer-text\" id=\"timer-armen-text\">\r\n            Nog even\u2026\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ifi-avatar\">\r\n        <img decoding=\"async\" src=\"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/Armen-bewegen.png\" alt=\"IFI armen bewegen\">\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\nconst bell = document.getElementById(\"ifi-bell\");\r\n\r\nfunction goToScene(sceneId) {\r\n  document.querySelectorAll('.ifi-scene').forEach(scene => {\r\n    scene.classList.remove('active');\r\n  });\r\n\r\n  document.getElementById(sceneId).classList.add('active');\r\n\r\n  if (sceneId === 'scene-armen') {\r\n    startTimer('timer-armen', 'timer-armen-text', 30);\r\n  }\r\n}\r\n\r\nfunction startTimer(progressId, textId, seconds) {\r\n  const progress = document.getElementById(progressId);\r\n  const text = document.getElementById(textId);\r\n  let remaining = seconds;\r\n\r\n  progress.style.width = \"100%\";\r\n  text.textContent = \"We nemen even de tijd\u2026\";\r\n\r\n  const interval = setInterval(() => {\r\n    remaining--;\r\n    progress.style.width = (remaining \/ seconds * 100) + \"%\";\r\n\r\n    if (remaining <= 5 && remaining > 0) {\r\n      text.textContent = \"Bijna klaar\u2026\";\r\n    }\r\n\r\n    if (remaining <= 0) {\r\n      clearInterval(interval);\r\n      progress.style.width = \"0%\";\r\n      text.textContent = \"Klaar \ud83c\udf31\";\r\n\r\n      bell.currentTime = 0;\r\n      bell.play();\r\n    }\r\n  }, 1000);\r\n}\r\n\r\nstartTimer('timer-voeten', 'timer-voeten-text', 35);\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\ud83e\uddb6 Rustmoment Voeten bewegen. Misschien voel je je voeten op de grond. Of in je schoenen. Je kunt rustig op de plaats een paar stapjes maken. Alsof je lijf even wakker wordt. Op jouw manier. Ik doe met je mee. We bewegen even\u2026 Armen rustig meebewegen \ud83c\udf3f Rustmoment Armen bewegen. Je kunt je armen rustig [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-285","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/285","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=285"}],"version-history":[{"count":29,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/285\/revisions"}],"predecessor-version":[{"id":3772,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/285\/revisions\/3772"}],"wp:attachment":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=285"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}