{"id":1304,"date":"2026-02-27T00:37:34","date_gmt":"2026-02-27T00:37:34","guid":{"rendered":"https:\/\/coastal.richiweb.com\/?page_id=1304"},"modified":"2026-03-04T22:53:08","modified_gmt":"2026-03-04T22:53:08","slug":"como-funciona","status":"publish","type":"page","link":"https:\/\/coastal.richiweb.com\/es_es\/como-funciona\/","title":{"rendered":"C\u00f3mo funciona"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1304\" class=\"elementor elementor-1304\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a30925a e-con-full e-flex e-con e-parent\" data-id=\"a30925a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6562d9c elementor-widget elementor-widget-html\" data-id=\"6562d9c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ===============================\r\n  RW COASTAL - HERO SLIDER (1 imagen)\r\n  - Scoped: #rw-coastal-hero-01\r\n  - Imagen 1900x800 => Alto 800\r\n  - Overlay negro (opacidad) SOLO a la imagen\r\n  - Texto sin fondos, solo sombra para resaltar\r\n  - Animaci\u00f3n repetitiva cada 7000ms\r\n================================== -->\r\n\r\n<section id=\"rw-coastal-hero-01\" class=\"rw-coastal-hero\" aria-label=\"Hero slider\">\r\n  <div class=\"rw-coastal-hero__bg\" role=\"img\" aria-label=\"Classic and modern cars\"><\/div>\r\n\r\n  <div class=\"rw-coastal-hero__inner\">\r\n    <div class=\"rw-coastal-hero__copy\" data-rw-copy=\"1\">\r\n      <h2 class=\"rw-coastal-hero__title\">CARS HAVE EVOLVED\u2026<\/h2>\r\n      <p class=\"rw-coastal-hero__sub\">\r\n        And so has the way you buy yours \u2014 transparent, seamless, and completely hassle-free.\r\n      <\/p>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===============================\r\n   RW COASTAL - HERO (SCOPED)\r\n================================== *\/\r\n#rw-coastal-hero-01{\r\n  \/* ====== CONTROLES R\u00c1PIDOS ====== *\/\r\n  --rw-img:url('https:\/\/coastal.richiweb.com\/wp-content\/uploads\/2026\/02\/carro-vejo-y-carro-nuevo.webp');\r\n\r\n  \/* \u2705 Medidas: 1900 x 800 *\/\r\n  --rw-h: 800px;                 \/* desktop *\/\r\n  --rw-h-md: 620px;              \/* tablet *\/\r\n  --rw-h-sm: 440px;              \/* m\u00f3vil *\/\r\n\r\n  --rw-max: 1200px;\r\n  --rw-padX: clamp(16px, 4vw, 56px);\r\n  --rw-padTop: clamp(28px, 6vw, 64px);\r\n\r\n  \/* \u2705 Overlay negro para resaltar texto (solo imagen) *\/\r\n  --rw-dark: rgba(0,0,0,.45);    \/* sube\/baja opacidad aqu\u00ed *\/\r\n\r\n  \/* Texto (blanco + glow) *\/\r\n  --rw-text: rgba(255,255,255,.96);\r\n  --rw-muted: rgba(255,255,255,.80);\r\n\r\n  \/* Animaci\u00f3n (texto) *\/\r\n  --rw-enter-from: -80px;        \/* entra desde izquierda (positivo = derecha) *\/\r\n  --rw-enter-duration: 950ms;\r\n  --rw-enter-ease: cubic-bezier(.2,.8,.2,1);\r\n\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: var(--rw-h);\r\n  overflow: hidden;\r\n  background: #000;\r\n}\r\n\r\n\/* Imagen de fondo *\/\r\n#rw-coastal-hero-01 .rw-coastal-hero__bg{\r\n  position:absolute;\r\n  inset:0;\r\n  background-image: var(--rw-img);\r\n  background-repeat: no-repeat;\r\n  background-size: cover;          \/* mantiene proporci\u00f3n y llena *\/\r\n  background-position: center;     \/* centrado *\/\r\n  transform: scale(1.01);\r\n}\r\n\r\n\/* \u2705 Overlay negro SOLO encima de la imagen (texto NO afectado) *\/\r\n#rw-coastal-hero-01 .rw-coastal-hero__bg::after{\r\n  content:\"\";\r\n  position:absolute;\r\n  inset:0;\r\n  background: var(--rw-dark);\r\n  pointer-events:none;\r\n}\r\n\r\n\/* Contenido *\/\r\n#rw-coastal-hero-01 .rw-coastal-hero__inner{\r\n  position: relative;\r\n  z-index: 2;\r\n  min-height: var(--rw-h);\r\n  display: grid;\r\n  place-items: start center;\r\n  padding: var(--rw-padTop) var(--rw-padX) 24px;\r\n}\r\n\r\n#rw-coastal-hero-01 .rw-coastal-hero__copy{\r\n  width: min(var(--rw-max), 100%);\r\n  text-align: center;\r\n\r\n  \/* estado base (para animaci\u00f3n) *\/\r\n  opacity: 0;\r\n  transform: translateX(var(--rw-enter-from));\r\n  will-change: transform, opacity;\r\n}\r\n\r\n\/* \u2705 Texto SIN fondos, SOLO sombra\/glow *\/\r\n#rw-coastal-hero-01 .rw-coastal-hero__title{\r\n  margin: 0;\r\n  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;\r\n  letter-spacing: .22em;\r\n  text-transform: uppercase;\r\n  font-weight: 900;\r\n  color: var(--rw-text);\r\n  font-size: clamp(24px, 3.2vw, 46px);\r\n  line-height: 1.05;\r\n\r\n  text-shadow:\r\n    0 2px 10px rgba(0,0,0,.55),\r\n    0 10px 35px rgba(0,0,0,.65);\r\n}\r\n\r\n#rw-coastal-hero-01 .rw-coastal-hero__sub{\r\n  margin: 12px auto 0;\r\n  max-width: 820px;\r\n  color: var(--rw-muted);\r\n  font-size: clamp(14px, 1.35vw, 18px);\r\n  line-height: 1.5;\r\n\r\n  text-shadow:\r\n    0 2px 10px rgba(0,0,0,.55),\r\n    0 10px 30px rgba(0,0,0,.55);\r\n}\r\n\r\n\/* Animaci\u00f3n IN \/ OUT (para loop) *\/\r\n#rw-coastal-hero-01 .rw-coastal-hero__copy.is-in{\r\n  animation: rwCoastalEnter var(--rw-enter-duration) var(--rw-enter-ease) 0ms forwards;\r\n}\r\n#rw-coastal-hero-01 .rw-coastal-hero__copy.is-out{\r\n  animation: rwCoastalExit 520ms cubic-bezier(.2,.7,.2,1) 0ms forwards;\r\n}\r\n\r\n@keyframes rwCoastalEnter{\r\n  from{ opacity:0; transform: translateX(var(--rw-enter-from)); }\r\n  to{ opacity:1; transform: translateX(0); }\r\n}\r\n@keyframes rwCoastalExit{\r\n  from{ opacity:1; transform: translateX(0); }\r\n  to{ opacity:0; transform: translateX(calc(var(--rw-enter-from) * -0.55)); }\r\n}\r\n\r\n\/* Responsive *\/\r\n@media (max-width: 1024px){\r\n  #rw-coastal-hero-01{ min-height: var(--rw-h-md); }\r\n  #rw-coastal-hero-01 .rw-coastal-hero__inner{ min-height: var(--rw-h-md); }\r\n}\r\n@media (max-width: 767px){\r\n  #rw-coastal-hero-01{ min-height: var(--rw-h-sm); }\r\n  #rw-coastal-hero-01 .rw-coastal-hero__inner{ min-height: var(--rw-h-sm); padding-top: 22px; }\r\n  #rw-coastal-hero-01 .rw-coastal-hero__title{ letter-spacing: .16em; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* ===============================\r\n   RW COASTAL - LOOP ANIM (7000ms)\r\n   - Repite la animaci\u00f3n cada 7000\r\n   - Solo corre cuando el bloque es visible\r\n================================== *\/\r\n(function(){\r\n  const root = document.getElementById('rw-coastal-hero-01');\r\n  if(!root) return;\r\n\r\n  const copy = root.querySelector('[data-rw-copy=\"1\"]');\r\n  if(!copy) return;\r\n\r\n  const LOOP_MS = 7000;   \/\/ \u2705 cada 7000ms\r\n  const OUT_MS  = 520;    \/\/ coincide con rwCoastalExit\r\n  const GAP_MS  = 120;\r\n\r\n  let timer = null;\r\n\r\n  function enter(){\r\n    copy.classList.remove('is-out');\r\n    void copy.offsetWidth; \/\/ reset anim\r\n    copy.classList.add('is-in');\r\n  }\r\n\r\n  function cycle(){\r\n    copy.classList.remove('is-in');\r\n    void copy.offsetWidth;\r\n    copy.classList.add('is-out');\r\n\r\n    setTimeout(()=>{ enter(); }, OUT_MS + GAP_MS);\r\n  }\r\n\r\n  function start(){\r\n    if(timer) clearInterval(timer);\r\n    enter();\r\n    timer = setInterval(cycle, LOOP_MS);\r\n  }\r\n\r\n  function stop(){\r\n    if(timer) clearInterval(timer);\r\n    timer = null;\r\n  }\r\n\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{\r\n      if(e.isIntersecting) start();\r\n      else stop();\r\n    });\r\n  }, { threshold: 0.25 });\r\n\r\n  io.observe(root);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7fc7aba e-flex e-con-boxed e-con e-parent\" data-id=\"7fc7aba\" 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\t\t<div class=\"elementor-element elementor-element-be452fb elementor-widget elementor-widget-html\" data-id=\"be452fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ================================\r\n  COASTAL - HOW IT WORKS (4 STEPS)\r\n  - Elementor HTML Widget (copiar\/pegar)\r\n  - Scoped: #rw-hiw-coastal-01\r\n  - Animaci\u00f3n on-scroll: IntersectionObserver (1 sola vez)\r\n================================= -->\r\n\r\n<section id=\"rw-hiw-coastal-01\" class=\"rw-hiw\">\r\n  <div class=\"rw-hiw__bg\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"rw-hiw__container\">\r\n    <header class=\"rw-hiw__head\">\r\n      <p class=\"rw-hiw__kicker\">HOW IT WORKS<\/p>\r\n      <h2 class=\"rw-hiw__title\">YOUR CAR, YOUR TERMS<\/h2>\r\n      <p class=\"rw-hiw__lead\">\r\n        A simple 4-step process to help you compare options, get expert guidance, and drive away with confidence.\r\n      <\/p>\r\n    <\/header>\r\n\r\n    <!-- STEP 1 -->\r\n    <article class=\"rw-step rw-step--img-left\" data-rw-step=\"1\">\r\n      <div class=\"rw-step__badge\">\r\n        <span class=\"rw-step__tag\">ONE<\/span>\r\n        <span class=\"rw-step__dot\" aria-hidden=\"true\"><\/span>\r\n      <\/div>\r\n\r\n      <div class=\"rw-step__grid\">\r\n        <figure class=\"rw-step__media\">\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/coastal.richiweb.com\/wp-content\/uploads\/2026\/02\/bmw-how-it-works.avif\"\r\n            alt=\"Build your car\"\r\n            loading=\"lazy\"\r\n          \/>\r\n        <\/figure>\r\n\r\n        <div class=\"rw-step__content\">\r\n          <h3 class=\"rw-step__title\">BUILD YOUR CAR<\/h3>\r\n          <p class=\"rw-step__text\">\r\n            Choose the brand you love and explore trims, features, and available options. We\u2019ll guide you to the best\r\n            matches based on your needs and budget.\r\n          <\/p>\r\n          <a class=\"rw-step__btn\" href=\"\/car-builder\/\">BUILD<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <!-- STEP 2 -->\r\n    <article class=\"rw-step rw-step--img-right\" data-rw-step=\"1\">\r\n      <div class=\"rw-step__badge\">\r\n        <span class=\"rw-step__tag\">TWO<\/span>\r\n        <span class=\"rw-step__dot\" aria-hidden=\"true\"><\/span>\r\n      <\/div>\r\n\r\n      <div class=\"rw-step__grid\">\r\n        <div class=\"rw-step__content\">\r\n          <h3 class=\"rw-step__title\">GET IN TOUCH<\/h3>\r\n          <p class=\"rw-step__text\">\r\n            Tell us what you\u2019re looking for and we\u2019ll connect you with a specialist. You\u2019ll get clear answers, real\r\n            options, and a smooth plan forward\u2014no guesswork.\r\n          <\/p>\r\n          <a class=\"rw-step__btn\" href=\"\/contact-us\/\">CONTACT US<\/a>\r\n        <\/div>\r\n\r\n        <figure class=\"rw-step__media\">\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/coastal.richiweb.com\/wp-content\/uploads\/2026\/02\/mercedes.avif\"\r\n            alt=\"Get in touch\"\r\n            loading=\"lazy\"\r\n          \/>\r\n        <\/figure>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <!-- STEP 3 -->\r\n    <article class=\"rw-step rw-step--img-left\" data-rw-step=\"1\">\r\n      <div class=\"rw-step__badge\">\r\n        <span class=\"rw-step__tag\">THREE<\/span>\r\n        <span class=\"rw-step__dot\" aria-hidden=\"true\"><\/span>\r\n      <\/div>\r\n\r\n      <div class=\"rw-step__grid\">\r\n        <figure class=\"rw-step__media\">\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/coastal.richiweb.com\/wp-content\/uploads\/2026\/02\/suv.avif\"\r\n            alt=\"Apply\"\r\n            loading=\"lazy\"\r\n          \/>\r\n        <\/figure>\r\n\r\n        <div class=\"rw-step__content\">\r\n          <h3 class=\"rw-step__title\">APPLY<\/h3>\r\n          <p class=\"rw-step__text\">\r\n            Submit your information and we\u2019ll handle the next steps with the dealership. We keep the process organized,\r\n            transparent, and aligned with your goals.\r\n          <\/p>\r\n          <a class=\"rw-step__btn\" href=\"\/contact-us\/\">CONTACT US<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <!-- STEP 4 -->\r\n    <article class=\"rw-step rw-step--center\" data-rw-step=\"1\">\r\n      <div class=\"rw-step__badge\">\r\n        <span class=\"rw-step__tag\">FOUR<\/span>\r\n        <span class=\"rw-step__dot\" aria-hidden=\"true\"><\/span>\r\n      <\/div>\r\n\r\n      <div class=\"rw-step__grid rw-step__grid--center\">\r\n        <div class=\"rw-step__content rw-step__content--center\">\r\n          <h3 class=\"rw-step__title\">RELAX<\/h3>\r\n          <p class=\"rw-step__text\">\r\n            We take care of the details and keep you updated. When everything is ready, you\u2019ll be one step closer to\r\n            delivery\u2014simple and stress-free.\r\n          <\/p>\r\n        <\/div>\r\n\r\n        <figure class=\"rw-step__media rw-step__media--center\">\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/coastal.richiweb.com\/wp-content\/uploads\/2026\/03\/descansando.webp\"\r\n            alt=\"Relax\"\r\n            loading=\"lazy\"\r\n          \/>\r\n        <\/figure>\r\n      <\/div>\r\n    <\/article>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ================================\r\n   Scoped styles: #rw-hiw-coastal-01\r\n================================= *\/\r\n#rw-hiw-coastal-01.rw-hiw{\r\n  --rw-accent:#1976ff;           \/* AZUL COASTAL (ajusta si tu azul exacto es otro) *\/\r\n  --rw-ink:#121212;\r\n  --rw-muted:rgba(18,18,18,.68);\r\n  --rw-line:rgba(18,18,18,.10);\r\n  --rw-card:#ffffff;\r\n  --rw-shadow:0 18px 45px rgba(0,0,0,.10);\r\n  --rw-radius:18px;\r\n\r\n  position:relative;\r\n  overflow:hidden;\r\n  padding: clamp(56px, 6vw, 92px) 0;\r\n  background:#fff;\r\n  font-family: inherit;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__bg{\r\n  position:absolute;\r\n  inset:0;\r\n  pointer-events:none;\r\n  opacity:.85;\r\n  background:\r\n    radial-gradient(circle at 78% 22%, rgba(25,118,255,.10) 0 1px, transparent 2px) 0 0\/ 140px 140px,\r\n    radial-gradient(circle at 30% 70%, rgba(0,0,0,.10) 0 1px, transparent 2px) 0 0\/ 170px 170px,\r\n    linear-gradient(135deg, rgba(0,0,0,.05) 0 1px, transparent 1px) 0 0\/ 180px 180px,\r\n    linear-gradient(225deg, rgba(0,0,0,.04) 0 1px, transparent 1px) 0 0\/ 220px 220px;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__container{\r\n  width:min(1120px, calc(100% - 40px));\r\n  margin:0 auto;\r\n  position:relative;\r\n  z-index:1;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__head{\r\n  text-align:center;\r\n  margin-bottom: clamp(26px, 3.2vw, 44px);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__kicker{\r\n  margin:0 0 10px;\r\n  letter-spacing:.18em;\r\n  font-weight:700;\r\n  font-size:12px;\r\n  color:var(--rw-muted);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__title{\r\n  margin:0 0 10px;\r\n  font-weight:800;\r\n  letter-spacing:.06em;\r\n  color:var(--rw-ink);\r\n  font-size: clamp(26px, 3.2vw, 40px);\r\n  text-transform:uppercase;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-hiw__lead{\r\n  margin:0 auto;\r\n  max-width: 760px;\r\n  color:var(--rw-muted);\r\n  font-size: clamp(14px, 1.35vw, 16px);\r\n  line-height:1.7;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step{\r\n  position:relative;\r\n  margin: clamp(18px, 2.5vw, 30px) 0;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__badge{\r\n  display:flex;\r\n  align-items:center;\r\n  gap:10px;\r\n  margin: 0 auto 10px;\r\n  width: min(860px, 100%);\r\n  justify-content:center;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__tag{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  height:34px;\r\n  padding:0 18px;\r\n  border-radius:12px;\r\n  background:var(--rw-accent);\r\n  color:#fff;\r\n  font-weight:800;\r\n  letter-spacing:.08em;\r\n  font-size:12px;\r\n  text-transform:uppercase;\r\n  transform: skewX(-10deg);\r\n  box-shadow: 0 12px 30px rgba(25,118,255,.25);\r\n  position:relative;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__tag::after{\r\n  content:\"\";\r\n  position:absolute;\r\n  inset:0;\r\n  border-radius:12px;\r\n  border:1px solid rgba(255,255,255,.35);\r\n  transform: skewX(10deg);\r\n  pointer-events:none;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__dot{\r\n  width:10px; height:10px;\r\n  border-radius:50%;\r\n  background:var(--rw-accent);\r\n  box-shadow: 0 10px 25px rgba(25,118,255,.25);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__grid{\r\n  width: min(980px, 100%);\r\n  margin: 0 auto;\r\n  background: rgba(255,255,255,.80);\r\n  border:1px solid rgba(0,0,0,.06);\r\n  border-radius: var(--rw-radius);\r\n  box-shadow: var(--rw-shadow);\r\n  backdrop-filter: blur(6px);\r\n  overflow:hidden;\r\n\r\n  display:grid;\r\n  grid-template-columns: 1.05fr 1fr;\r\n  align-items:center;\r\n  gap: 0;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step--img-right .rw-step__grid{\r\n  grid-template-columns: 1fr 1.05fr;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step--center .rw-step__grid{\r\n  grid-template-columns: 1fr;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__media{\r\n  padding: clamp(18px, 2.4vw, 28px);\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__media img{\r\n  width:100%;\r\n  max-width: 430px;\r\n  height:auto;\r\n  display:block;\r\n  filter: drop-shadow(0 18px 28px rgba(0,0,0,.18));\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__content{\r\n  padding: clamp(20px, 2.8vw, 34px);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__title{\r\n  margin: 0 0 10px;\r\n  color:var(--rw-ink);\r\n  font-weight:900;\r\n  letter-spacing:.10em;\r\n  font-size: clamp(18px, 2vw, 22px);\r\n  text-transform:uppercase;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__text{\r\n  margin:0 0 16px;\r\n  color:var(--rw-muted);\r\n  line-height:1.75;\r\n  font-size: clamp(14px, 1.3vw, 16px);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__btn{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  height:42px;\r\n  padding:0 20px;\r\n  border-radius:999px;\r\n  background:#0f0f10;\r\n  color:#fff;\r\n  font-weight:800;\r\n  letter-spacing:.10em;\r\n  text-transform:uppercase;\r\n  font-size:12px;\r\n  text-decoration:none;\r\n  box-shadow: 0 16px 35px rgba(0,0,0,.18);\r\n  transition: transform .22s ease, box-shadow .22s ease, background .22s ease;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__btn:hover{\r\n  transform: translateY(-1px);\r\n  box-shadow: 0 18px 42px rgba(0,0,0,.22), 0 0 0 3px rgba(25,118,255,.12);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__grid--center{\r\n  text-align:center;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__content--center{\r\n  padding-bottom: 8px;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__media--center img{\r\n  max-width: 360px;\r\n  filter: drop-shadow(0 18px 22px rgba(0,0,0,.12));\r\n}\r\n\r\n\/* ================================\r\n   Animaci\u00f3n (init hidden -> reveal)\r\n================================= *\/\r\n#rw-hiw-coastal-01 [data-rw-step=\"1\"]{\r\n  --rw-delay: 0ms;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__badge,\r\n#rw-hiw-coastal-01 .rw-step__media,\r\n#rw-hiw-coastal-01 .rw-step__content{\r\n  opacity:0;\r\n  transform: translateY(10px);\r\n  transition: opacity .85s cubic-bezier(.2,.8,.2,1), transform .85s cubic-bezier(.2,.8,.2,1);\r\n  will-change: opacity, transform;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step__badge{\r\n  transform: translateY(-10px);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step--img-left .rw-step__media{\r\n  transform: translateX(-54px);\r\n}\r\n#rw-hiw-coastal-01 .rw-step--img-right .rw-step__media{\r\n  transform: translateX(54px);\r\n}\r\n#rw-hiw-coastal-01 .rw-step--center .rw-step__media{\r\n  transform: translateY(18px);\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step.is-in .rw-step__badge{\r\n  opacity:1;\r\n  transform: translateY(0);\r\n  transition-delay: 0ms;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step.is-in .rw-step__media{\r\n  opacity:1;\r\n  transform: translateX(0) translateY(0);\r\n  transition-delay: 90ms;\r\n}\r\n\r\n#rw-hiw-coastal-01 .rw-step.is-in .rw-step__content{\r\n  opacity:1;\r\n  transform: translateY(0);\r\n  transition-delay: 180ms;\r\n}\r\n\r\n\/* ================================\r\n   Responsive\r\n================================= *\/\r\n@media (max-width: 860px){\r\n  #rw-hiw-coastal-01 .rw-step__grid,\r\n  #rw-hiw-coastal-01 .rw-step--img-right .rw-step__grid{\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  #rw-hiw-coastal-01 .rw-step__badge{\r\n    justify-content:flex-start;\r\n    width:100%;\r\n  }\r\n\r\n  #rw-hiw-coastal-01 .rw-step__media img{\r\n    max-width: 520px;\r\n  }\r\n\r\n  #rw-hiw-coastal-01 .rw-step__content{\r\n    padding-top: 6px;\r\n  }\r\n\r\n  \/* En m\u00f3vil: todas las im\u00e1genes entran desde abajo (m\u00e1s natural) *\/\r\n  #rw-hiw-coastal-01 .rw-step__media{\r\n    transform: translateY(18px);\r\n  }\r\n  #rw-hiw-coastal-01 .rw-step.is-in .rw-step__media{\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce){\r\n  #rw-hiw-coastal-01 .rw-step__badge,\r\n  #rw-hiw-coastal-01 .rw-step__media,\r\n  #rw-hiw-coastal-01 .rw-step__content{\r\n    transition:none !important;\r\n    opacity:1 !important;\r\n    transform:none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function(){\r\n  \"use strict\";\r\n  const root = document.getElementById(\"rw-hiw-coastal-01\");\r\n  if(!root) return;\r\n\r\n  const steps = Array.from(root.querySelectorAll(\".rw-step\"));\r\n  if(!steps.length) return;\r\n\r\n  \/\/ Si el navegador no soporta IntersectionObserver, mostramos todo.\r\n  if(!(\"IntersectionObserver\" in window)){\r\n    steps.forEach(s => s.classList.add(\"is-in\"));\r\n    return;\r\n  }\r\n\r\n  const io = new IntersectionObserver((entries, obs) => {\r\n    entries.forEach(entry => {\r\n      if(entry.isIntersecting){\r\n        entry.target.classList.add(\"is-in\");\r\n        obs.unobserve(entry.target); \/\/ 1 sola vez (premium)\r\n      }\r\n    });\r\n  }, {\r\n    root: null,\r\n    threshold: 0.18,\r\n    rootMargin: \"0px 0px -10% 0px\"\r\n  });\r\n\r\n  steps.forEach(step => io.observe(step));\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":"<p>CARS HAVE EVOLVED\u2026 And so has the way you buy yours \u2014 transparent, seamless, and completely hassle-free. HOW IT WORKS YOUR CAR, YOUR TERMS A simple 4-step process to help you compare options, get expert guidance, and drive away with confidence. ONE BUILD YOUR CAR Choose the brand you love and explore trims, features, and [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-1304","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/pages\/1304","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/comments?post=1304"}],"version-history":[{"count":22,"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/pages\/1304\/revisions"}],"predecessor-version":[{"id":1408,"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/pages\/1304\/revisions\/1408"}],"wp:attachment":[{"href":"https:\/\/coastal.richiweb.com\/es_es\/wp-json\/wp\/v2\/media?parent=1304"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}