{"id":2,"date":"2026-09-09T14:47:06","date_gmt":"2026-09-09T14:47:06","guid":{"rendered":"https:\/\/smoothcoffee.cl\/?page_id=2"},"modified":"2026-09-09T20:15:16","modified_gmt":"2026-09-09T20:15:16","slug":"sample-page","status":"publish","type":"page","link":"https:\/\/smoothcoffee.cl\/","title":{"rendered":"home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2\" class=\"elementor elementor-2\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a3cd3bd e-flex e-con-boxed e-con e-parent\" data-id=\"a3cd3bd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2621e09 elementor-widget elementor-widget-html\" data-id=\"2621e09\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"smooth-responsive-cover\">\r\n\r\n  <!-- ================= DESKTOP ================= -->\r\n  <div class=\"smooth-desktop\">\r\n    <video\r\n      class=\"smooth-desktop-video\"\r\n      autoplay\r\n      muted\r\n      loop\r\n      playsinline\r\n      preload=\"auto\"\r\n    >\r\n      <source src=\"https:\/\/smoothcoffee.cl\/wp-content\/uploads\/2026\/09\/necesito_generar_una_animacio.mp4\" type=\"video\/mp4\">\r\n    <\/video>\r\n  <\/div>\r\n\r\n  <!-- ================= MOBILE ================= -->\r\n  <div class=\"smooth-mobile\">\r\n\r\n    <!-- fondo ambiental -->\r\n    <div class=\"smooth-mobile-background\"><\/div>\r\n\r\n    <!-- escena -->\r\n    <div class=\"smooth-mobile-frame\">\r\n\r\n      <!-- ventana donde va el video -->\r\n      <div class=\"smooth-mobile-video-window\">\r\n        <video\r\n          class=\"smooth-mobile-video\"\r\n          autoplay\r\n          muted\r\n          loop\r\n          playsinline\r\n          preload=\"auto\"\r\n        >\r\n          <source src=\"https:\/\/smoothcoffee.cl\/wp-content\/uploads\/2026\/09\/necesito_generar_una_animacio.mp4\" type=\"video\/mp4\">\r\n        <\/video>\r\n      <\/div>\r\n\r\n      <!-- imagen encima -->\r\n      <img decoding=\"async\"\r\n        class=\"smooth-mobile-art\"\r\n        src=\"https:\/\/smoothcoffee.cl\/wp-content\/uploads\/2026\/09\/YDRAY-Sin-titulo-2-scaled.png\"\r\n        alt=\"Smooth Coffee Pr\u00f3ximamente\"\r\n      >\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\nhtml, body {\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  width: 100% !important;\r\n  height: 100% !important;\r\n  overflow: hidden !important;\r\n  background: #000 !important;\r\n}\r\n\r\n#smooth-responsive-cover {\r\n  position: fixed;\r\n  inset: 0;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  overflow: hidden;\r\n  background: #000;\r\n  z-index: 999999;\r\n}\r\n\r\n\/* ================= DESKTOP ================= *\/\r\n.smooth-desktop {\r\n  position: absolute;\r\n  inset: 0;\r\n  display: block;\r\n  overflow: hidden;\r\n  background: #000;\r\n}\r\n\r\n.smooth-desktop-video {\r\n  position: absolute;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center center;\r\n  display: block;\r\n  background: #000;\r\n}\r\n\r\n\/* ================= MOBILE BASE ================= *\/\r\n.smooth-mobile {\r\n  display: none;\r\n}\r\n\r\n\/* ================= MOBILE ================= *\/\r\n@media screen and (max-width: 767px) {\r\n\r\n  :root{\r\n    \/* Ajustes finos del video dentro del espacio *\/\r\n    --video-left: 4.92%;\r\n    --video-top: 31.90%;\r\n    --video-width: 88.74%;\r\n    --video-height: 25.73%;\r\n\r\n    \/* Ajustes finos internos del video *\/\r\n    --video-scale: 0.98;\r\n    --video-rotate: 0deg;\r\n    --video-x: 0px;\r\n    --video-y: 0px;\r\n  }\r\n\r\n  .smooth-desktop {\r\n    display: none;\r\n  }\r\n\r\n  .smooth-mobile {\r\n    position: absolute;\r\n    inset: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    width: 100vw;\r\n    height: 100vh;\r\n    overflow: hidden;\r\n    background: #111;\r\n  }\r\n\r\n  .smooth-mobile-background {\r\n    position: absolute;\r\n    inset: -40px;\r\n    background-image:\r\n      linear-gradient(rgba(0,0,0,.20), rgba(0,0,0,.20)),\r\n      url(\"https:\/\/smoothcoffee.cl\/wp-content\/uploads\/2026\/09\/YDRAY-Sin-titulo-2-scaled.png\");\r\n    background-size: cover;\r\n    background-position: center center;\r\n    filter: blur(28px);\r\n    transform: scale(1.15);\r\n    opacity: .85;\r\n    z-index: 1;\r\n  }\r\n\r\n  .smooth-mobile-frame {\r\n    position: relative;\r\n    z-index: 5;\r\n    width: 100vw;\r\n    max-width: 56.2667vh;\r\n    aspect-ratio: 1688 \/ 3000;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .smooth-mobile-video-window {\r\n    position: absolute;\r\n    left: var(--video-left);\r\n    top: var(--video-top);\r\n    width: var(--video-width);\r\n    height: var(--video-height);\r\n    overflow: hidden;\r\n    background: #000;\r\n    z-index: 1;\r\n  }\r\n\r\n  .smooth-mobile-video {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n    \/* IMPORTANTE:\r\n       contain = no recorta\r\n       scale y offsets = ajuste fino *\/\r\n    object-fit: contain;\r\n    object-position: center center;\r\n\r\n    transform:\r\n      translate(-50%, -50%)\r\n      translate(var(--video-x), var(--video-y))\r\n      scale(var(--video-scale))\r\n      rotate(var(--video-rotate));\r\n\r\n    display: block;\r\n    background: #000;\r\n  }\r\n\r\n  .smooth-mobile-art {\r\n    position: relative;\r\n    z-index: 3;\r\n    display: block;\r\n    width: 100%;\r\n    height: auto;\r\n    pointer-events: none;\r\n    user-select: none;\r\n  }\r\n}\r\n\r\n\/* ================= TABLET Y DESKTOP ================= *\/\r\n@media screen and (min-width: 768px) {\r\n  .smooth-desktop {\r\n    display: block;\r\n  }\r\n  .smooth-mobile {\r\n    display: none;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  const videos = document.querySelectorAll('#smooth-responsive-cover video');\r\n\r\n  function startVideos() {\r\n    videos.forEach(function(video) {\r\n      video.muted = true;\r\n      video.defaultMuted = true;\r\n      const p = video.play();\r\n      if (p !== undefined) {\r\n        p.catch(() => {});\r\n      }\r\n    });\r\n  }\r\n\r\n  document.addEventListener('DOMContentLoaded', startVideos);\r\n  window.addEventListener('load', startVideos);\r\n  document.addEventListener('touchstart', startVideos, { once: true });\r\n  document.addEventListener('click', startVideos, { once: true });\r\n})();\r\n<\/script>\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":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2"}],"version-history":[{"count":30,"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":51,"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions\/51"}],"wp:attachment":[{"href":"https:\/\/smoothcoffee.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}