/* ==========================================================================
   home (/) page styles - scoped under body.page-home
   Sections: hero, animated hero (sticky phone showcase + "Moments ,not messages"
   ticker), about (reveal text, product cards, mercados, casos reales), results,
   testimonials + process, FAQ (shared), closing CTA (shared).
   ========================================================================== */

/* ---------- helpers ---------- */
body.page-home .page { overflow-x: clip; }
body.page-home .only-mobile, body.page-home .only-mobile-block { display: none; }
body.page-home .btn--46 { min-height: 46px; min-width: 237px; padding: 10px 28px; }
body.page-home .btn--44 { min-height: 44px; min-width: 237px; padding: 9px 28px; }
body.page-home .btn--purple { background: rgb(133, 72, 244); color: var(--c-bg); }
body.page-home .btn--purple:hover { background: #2b2a2b; color: #8548f4; }
@media (max-width: 767px) {
  body.page-home .only-desktop, body.page-home .only-desktop-block { display: none !important; }
  body.page-home .only-mobile { display: inline; }
  body.page-home .btn.only-mobile { display: inline-flex; }
  body.page-home .only-mobile-block { display: block; }
}

/* ---------- 1. Hero ---------- */
body.page-home .hero { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 110px 50px 50px; }
body.page-home .hero__glow { position: absolute; left: 50%; top: 660px; width: 1720px; height: 1287px; margin-left: -860px; border-radius: 10px; background: var(--g-green-glow); pointer-events: none; z-index: 0; }
body.page-home .hero__wrapper { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 96px; width: 100%; max-width: 1340px; border-radius: var(--r-lg); }
body.page-home .hero__container { display: flex; flex-direction: column; align-items: center; gap: 48px; width: 100%; max-width: 1280px; padding: 8px 60px 0; }
body.page-home .hero__inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 51px; width: 100%; padding: 100px 80px 27px; }
body.page-home .hero__container { width: 100%; }
body.page-home .hero__top { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 38px; width: 800px; max-width: 100%; }
body.page-home .hero__texttag { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 19px; width: 100%; }
body.page-home .hero__tagtitle { display: flex; flex-direction: column; align-items: center; gap: 24px; width: 100%; padding: 3px 0; }
body.page-home .hero__title { width: 100%; font-family: var(--f-dm); font-weight: 300; font-size: 99px; line-height: 97px; letter-spacing: -5px; text-align: center; color: #080808; }
body.page-home .hero__title .t-serif { letter-spacing: -5px; }
body.page-home .hero__title-desktop, body.page-home .hero__title-mobile { display: flex; flex-direction: column; }
body.page-home .hero__title-mobile { display: none; }
body.page-home .hero__line { display: block; }
body.page-home .hero__body { display: flex; justify-content: center; width: 100%; overflow: hidden; }
body.page-home .hero__p { width: 500px; max-width: 100%; font-family: var(--f-dm); font-weight: 300; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; text-align: center; color: #000; }
body.page-home .hero__p--mobile { display: none; }
body.page-home .hero__buttons { display: flex; align-items: center; justify-content: center; gap: 12px; width: 600px; max-width: 100%; }
body.page-home .hero__bottom { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; width: 1000px; max-width: 100%; }
body.page-home .nowrap { white-space: nowrap; }
body.page-home .only-desktop-br { display: inline; }
body.page-home .hero__bottom .clients { gap: 3px; }
body.page-home .hero__bottom .ticker { height: 100px; padding: 24px; }
body.page-home .hero__bottom .ticker__track { height: 52px; }
/* hero fade-in like live (no scroll needed) */
body.page-home .hero__top, body.page-home .hero__bottom { animation: home-fade-in 0.8s var(--ease-out) both; }
@keyframes home-fade-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ---------- 2. Animated hero ---------- */
/* heights are vh based like live: Main 100vh (sticky), Feature 1 130vh+10, Feature 2 124.5vh+40.5 (= 3241px at 900) */
body.page-home .ah { position: relative; display: flex; flex-direction: column; width: 1200px; max-width: 100%; margin: 0 auto; }
body.page-home .ah__glow { position: absolute; left: 0; top: 384px; width: 375px; height: 346px; border-radius: 10px; background: var(--g-green-glow); pointer-events: none; z-index: 0; }
body.page-home .ah__bigticker { position: absolute; left: calc(50% - 902px); top: 311px; width: 1882px; height: 367px; z-index: 0; pointer-events: none; will-change: transform; }
body.page-home .bigticker { display: flex; align-items: center; width: 100%; height: 100%; overflow: hidden; }
body.page-home .bigticker__track { gap: 0; }
body.page-home .bigticker__item { flex: none; height: 243px; font-family: var(--f-dm); font-weight: 400; font-size: 270px; line-height: 0.9em; letter-spacing: -0.08em; color: #232323; white-space: nowrap; padding: 0 0 0 19px; }
body.page-home .bigticker__item--serif { font-family: var(--f-serif); font-style: italic; letter-spacing: -0.06em; padding: 0 30px 0 3px; }

body.page-home .ah__main { position: sticky; top: 0; z-index: 1; height: 100vh; height: min(100vh, 1000px); }
body.page-home .ah__phone-wrap { position: absolute; inset: 0; }
/* live phone: 258x536.6 box centred in Main, transform = translate(-50%,-50%) perspective(700px) translateY() scale() rotateX() driven by scroll (js/home.js) */
body.page-home .ah__phone { position: absolute; left: 50%; top: 50%; width: 258px; height: 536.625px; transform-origin: 50% 50%; transform: translate(-50%, -50%) perspective(700px) translateY(-180px) scale(1.7) rotateX(27deg); transition: transform 0.15s linear; will-change: transform; }
/* the phone artwork keeps its 529x1095 layout and is scaled into the live box */
body.page-home .ah__body { position: absolute; left: 0; top: 0; width: 529px; height: 1095px; transform-origin: 0 0; transform: scale(0.48771, 0.49006); }
body.page-home .ah__frame { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
body.page-home .ah__frame img { width: 100%; height: 100%; object-fit: cover; }
body.page-home .ah__screen { position: absolute; left: 24px; top: 20px; width: 481px; height: 1055px; border-radius: 68px; background: rgb(235, 239, 242); overflow: hidden; clip-path: inset(0 round 68px); transform-style: flat; isolation: isolate; z-index: 1; }
body.page-home .ah__screens { display: flex; height: 100%; width: 400%; transform: translateX(0); transition: transform 0.7s var(--ease-out); will-change: transform; }
body.page-home .ah__scr { position: relative; flex: none; width: 25%; height: 100%; overflow: hidden; background: rgb(235, 240, 243); }
body.page-home .ah__scr--home, body.page-home .ah__scr--pay { background: rgb(16, 16, 14); }
body.page-home .ah__scr--again { background: rgb(18, 18, 18); border-radius: 32px; }
body.page-home .ah__chat { position: absolute; left: 0; top: 0; width: 100%; height: auto; transform: translateY(0); transition: transform 0.9s var(--ease-out); }
/* live: the chat graphic sits above the status bar (z-index 1) and covers the whole screen */
body.page-home .ah__scr--home .ah__chat, body.page-home .ah__scr--pay .ah__chat { top: 0; height: 100%; object-fit: cover; object-position: center top; z-index: 2; }
body.page-home .ah__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.page-home .ah__status { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; height: 31px; padding: 4px 2px 0 24px; background: rgb(16, 16, 14); }
body.page-home .ah__time { font-family: var(--f-inter); font-size: 10px; line-height: 1; color: #fff; }
body.page-home .ah__levels { display: flex; width: 113px; height: 27px; }
body.page-home .ah__levels svg { width: 100%; height: 100%; }
body.page-home .ah__scr--again .ah__status { background: rgb(18, 18, 18); }
body.page-home .ah__again-content { display: flex; flex-direction: column; justify-content: space-between; align-items: center; height: calc(100% - 31px); padding: 0 16px 20px; background: linear-gradient(rgba(255, 255, 255, 0) 35%, rgb(23, 16, 30) 99.3666%); }
body.page-home .ah__again-top { display: flex; align-self: flex-start; width: 100%; height: 17px; }
body.page-home .ah__again-bottom { display: flex; align-items: center; justify-content: center; gap: 2px; width: 100%; }
body.page-home .ah__again-input { display: flex; align-items: center; flex: 1; height: 42px; padding: 6px 12px; border-radius: 100px; background: rgb(36, 25, 47); }
body.page-home .ah__again-input p { font-family: var(--f-inter); font-size: 8px; line-height: 9.6px; letter-spacing: -0.2px; color: #666; }
body.page-home .ah__again-send { display: flex; align-items: center; justify-content: center; width: 75px; height: 35px; padding: 3px 8px; border-radius: 100px; background: rgb(36, 25, 47); }
/* phone states driven by js/home.js */
body.page-home .ah.is-s1 .ah__screens { transform: translateX(-25%); }
body.page-home .ah.is-s2 .ah__screens { transform: translateX(-50%); }

/* mobile-only captions (live "Phone | Feature 1/2") */
body.page-home .ah__mfeat { display: none; }

/* Feature 1 / Feature 2 (sticky text blocks, same structure as live) */
body.page-home .ah__feature { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 0 30px; }
body.page-home .ah__feature--1 { height: calc(130vh + 10px); }
body.page-home .ah__feature--2 { height: calc(124.5vh + 40.5px); padding-top: 30px; }
body.page-home .ah__content { position: sticky; top: 0; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 100vh; padding: 0 130px 0 0; border-radius: 49px; pointer-events: none; }
body.page-home .ah__feature--2 .ah__content { padding: 130px 0 130px 130px; }
body.page-home .ah__content > * { pointer-events: auto; }
body.page-home .ah__tdg { display: flex; flex-direction: column; justify-content: center; gap: 7px; width: 100%; max-width: 1010px; }
body.page-home .ah__tdg--right { gap: 19px; align-items: flex-end; }
body.page-home .ah__td { display: flex; flex-direction: column; justify-content: center; gap: 26px; padding: 19px 0; overflow: hidden; }
body.page-home .ah__title { font-family: var(--f-dm); font-weight: 300; font-size: 64px; line-height: 64px; letter-spacing: -2.56px; color: #131313; text-align: left; }
body.page-home .ah__title .t-serif { letter-spacing: -2.56px; }
body.page-home .ah__title--right { width: 438px; max-width: 100%; text-align: right; }
body.page-home .ah__p { width: 312px; max-width: 100%; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -0.16px; color: #131313; }
body.page-home .ah__p--inter { width: 350px; font-family: var(--f-inter); text-align: right; }
body.page-home .ah__scrollarea { display: flex; align-items: center; width: 100%; height: 270px; overflow: hidden; }
body.page-home .ah__scrollarea--2 { height: 221px; }
body.page-home .ah__scrollarea--end { display: none; height: 50vh; } /* live: mobile-only 50vh 'Scroll Area' */
/* feature text appears while its block is in view (js toggles .is-on) */
body.page-home .ah__tdg { opacity: 0; transform: translateY(24px); transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out); }
body.page-home .ah__feature.is-on .ah__tdg { opacity: 1; transform: none; }
body.page-home.no-js .ah__tdg, .no-js body.page-home .ah__tdg { opacity: 1; transform: none; }

/* ---------- 3. About ---------- */
body.page-home .about { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 50px 0 70px; }
body.page-home .about__wrapper { display: flex; flex-direction: column; align-items: center; gap: 64px; width: 100%; border-radius: var(--r-lg); background: linear-gradient(rgb(249, 247, 246) 0%, rgba(247, 244, 242, 0) 100%); }
body.page-home .about__container { display: flex; flex-direction: column; align-items: center; gap: 74px; width: 100%; padding: 93px 0 60px; background: var(--c-white); border-radius: 33px; }
body.page-home .about__heading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 57px; width: 100%; max-width: 1340px; padding: 0 32px; }
body.page-home .reveal { width: 100%; max-width: 1240px; }
body.page-home .reveal__text { display: flex; flex-wrap: wrap; justify-content: center; font-family: var(--f-dm); font-weight: 400; font-size: 83px; line-height: 75px; letter-spacing: -3px; color: #666666; }
body.page-home .reveal__word { white-space: nowrap; }
body.page-home .reveal__char { color: rgb(255, 255, 255); transition: color 0.25s linear; }
body.page-home .reveal__char.is-on { color: #292429; }
.no-js body.page-home .reveal__char { color: #292429; }
body.page-home .about__tagline { width: 640px; max-width: 100%; font-family: var(--f-satoshi); font-weight: 400; font-size: 20px; line-height: 30px; letter-spacing: -0.4px; text-align: center; color: var(--c-text); }
body.page-home .about__how { width: 640px; max-width: 100%; font-family: var(--f-is); font-weight: 400; font-size: 76px; line-height: 1.1; letter-spacing: -3.04px; text-align: center; color: var(--c-ink); }
body.page-home .about__bottom { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; max-width: 1200px; padding: 30px 0; background: var(--c-white); border-radius: 30px; }
body.page-home .pcard { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; width: 591px; height: 737px; background: #f5f5f5; border-radius: var(--r-sm); overflow: hidden; }
body.page-home .pcard--panel { gap: 21px; }
body.page-home .pcard__visual { position: absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: flex-end; width: 100%; height: 409px; overflow: clip; }
body.page-home .pcard__visual--panel { height: 496px; padding-bottom: 40px; }
body.page-home .pcard__ball { position: absolute; top: 40px; left: 50%; width: 350px; height: 350px; margin-left: -175px; border-radius: 50%; }
body.page-home .pcard__ball--green { background: radial-gradient(circle at 50% 50%, #58f46f 0%, #5cf47a 40%, #6ff28a 58%, rgba(120, 245, 150, 0.45) 72%, rgba(120, 245, 150, 0) 100%); filter: blur(6px); }
body.page-home .pcard__ball--purple { top: 49px; background: radial-gradient(circle at 50% 50%, #b57de5 0%, #b884e4 45%, #c39be6 62%, rgba(195, 165, 230, 0.4) 74%, rgba(195, 165, 230, 0) 100%); filter: blur(6px); box-shadow: rgba(0, 0, 0, 0.05) 0 -200px 100px 0; }
body.page-home .pcard__visual--panel::before { content: ""; position: absolute; top: 49px; left: 50%; width: 350px; height: 350px; margin-left: -175px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 232, 150, 0.35) 0%, rgba(255, 232, 150, 0.12) 55%, rgba(255, 232, 150, 0) 72%); filter: blur(20px); transform: scale(1.35); }
/* product-card layers (live: Holo pattern revealed on hover, floating robot / dashboard image) */
body.page-home .pcard { transition: background-color 0.35s var(--ease-out); }
body.page-home .pcard__holo { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: inherit; opacity: 0; mix-blend-mode: color-dodge; transition: opacity 0.35s var(--ease-out); pointer-events: none; }
body.page-home .pcard__pattern { display: block; width: 100%; height: 100%; object-fit: cover; }
body.page-home .pcard__visual { z-index: 1; }
body.page-home .pcard__bot { position: absolute; z-index: 2; height: auto; filter: hue-rotate(20deg) saturate(0.91); transition: width 0.35s var(--ease-out), left 0.35s var(--ease-out), top 0.35s var(--ease-out); }
body.page-home .pcard__bot--smart { left: 160px; top: 55px; width: 271px; animation: pcard-float 3.2s ease-in-out infinite alternate; }
body.page-home .pcard__bot--panel { left: 118px; top: 126px; width: 355px; filter: hue-rotate(20deg) saturate(0.91) drop-shadow(rgba(0, 0, 0, 0.25) 0 18px 22px); }
@keyframes pcard-float { from { transform: translateY(0); } to { transform: translateY(30px); } }
body.page-home .pcard__ball { transition: opacity 0.35s var(--ease-out); }
body.page-home .pcard__ball-in { display: none; }
body.page-home .pcard__title, body.page-home .pcard__body { transition: color 0.35s var(--ease-out); }
@media (hover: hover) and (min-width: 768px) {
  body.page-home .pcard--smartbot:hover { background: rgb(20, 255, 87); }
  body.page-home .pcard--panel:hover { background: rgb(133, 72, 244); }
  body.page-home .pcard:hover .pcard__holo { opacity: 0.16; }
  body.page-home .pcard--panel:hover .pcard__holo { opacity: 0.09; }
  body.page-home .pcard:hover .pcard__ball { opacity: 0; }
  body.page-home .pcard--smartbot:hover .pcard__bot--smart { left: 97px; top: 20px; width: 397px; animation: none; }
  body.page-home .pcard--panel:hover .pcard__bot--panel { left: 85px; top: 55px; width: 420px; }
  body.page-home .pcard--smartbot:hover .pcard__body { color: var(--c-text); }
  body.page-home .pcard--panel:hover .pcard__title, body.page-home .pcard--panel:hover .pcard__body { color: var(--c-bg); }
  body.page-home .pcard--smartbot:hover .pcard__cta { background: var(--c-text); color: rgb(84, 227, 91); }
  body.page-home .pcard--smartbot .pcard__cta:hover { opacity: 0.6; }
  body.page-home .pcard--panel:hover .pcard__cta { background: var(--c-text); color: rgb(133, 72, 244); }
}
@media (prefers-reduced-motion: reduce) { body.page-home .pcard__bot--smart { animation: none; } }
body.page-home .pcard__text { position: absolute; left: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; width: 100%; padding: 16px 45px 57px; overflow: hidden; bottom: -2px; }
body.page-home .pcard__text--panel { gap: 32px; padding: 46px 45px; bottom: -11px; }
body.page-home .pcard__title { font-family: var(--f-dm); font-weight: 400; font-size: 67px; line-height: 30px; letter-spacing: -2.1px; text-align: center; color: var(--c-text); }
body.page-home .pcard__body { width: 451px; max-width: 100%; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.5px; text-align: center; color: var(--c-ink-60); }
body.page-home .pcard--panel .pcard__body { width: 431px; }
body.page-home .pcard__body--mobile { display: none; }
body.page-home .pcard__btn { display: flex; justify-content: center; padding: 5px 4px; }
body.page-home .pcard__cta { min-width: 284px; min-height: 56px; padding: 15px 28px; }

/* markets */
body.page-home .about__content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 57px; width: 100%; padding: 109px 50px 0; }
body.page-home .markets__top { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 30px; width: 1010px; max-width: 100%; }
body.page-home .markets__title { font-family: var(--f-dm); font-weight: 300; font-size: 123px; line-height: 110.7px; letter-spacing: -4px; text-align: center; color: #080808; }
body.page-home .markets__title .t-serif { letter-spacing: -4px; }
body.page-home .markets__body { width: 520px; max-width: 100%; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; text-align: center; color: #131313; }
body.page-home .markets__cta { display: flex; justify-content: center; }
body.page-home .mercados { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 22px; width: 100%; max-width: 1280px; overflow: hidden; }
body.page-home .mercados__row { display: flex; align-items: center; justify-content: center; gap: 24px; width: 100%; }
body.page-home .mcard { position: relative; display: flex; flex-direction: column; gap: 12px; width: 628px; height: 419px; padding: 44px; background: var(--c-white); border-radius: var(--r-md); overflow: hidden; }
body.page-home .mcard__tag { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 12px; align-self: flex-start; padding: 8px 16px; border-radius: 24px; border: 1px solid #ededed; font-family: var(--f-satoshi); font-weight: 500; font-size: 14px; line-height: 21px; letter-spacing: 2.24px; text-transform: uppercase; color: var(--c-ink-60); }
body.page-home .mcard__title { position: relative; z-index: 1; width: 324px; font-family: var(--f-dm); font-weight: 400; font-size: 39px; line-height: 39px; letter-spacing: -2px; color: var(--c-text); }
body.page-home .mcard__soy { position: relative; z-index: 1; font-family: var(--f-dm); font-weight: 400; font-size: 24px; line-height: 26px; letter-spacing: -0.5px; color: #757575; }
body.page-home .mcard__body { position: relative; z-index: 1; width: 218px; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 23px; letter-spacing: -0.5px; color: #131313; }
body.page-home .mcard__body--w215 { width: 215px; }
body.page-home .mcard__btn { position: absolute; left: 44px; bottom: 31px; z-index: 1; }
body.page-home .mcard__mind { position: absolute; left: 360px; top: 48px; width: 378px; height: 416px; }
body.page-home .mcard__mind img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
body.page-home .mcard--city .mcard__mind { left: 370px; top: 64px; width: 368px; height: 405px; }
body.page-home .mcard--turis .mcard__mind { left: 313px; top: 1px; width: 425px; height: 467px; }

/* casos reales */
body.page-home .cases { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 60px; width: 100%; max-width: 1340px; padding-top: 59px; border-radius: 20px; overflow: hidden; }
body.page-home .cases__content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 27px; width: 800px; max-width: 100%; }
body.page-home .cases__title { font-family: var(--f-dm); font-weight: 300; font-size: 83px; line-height: 78px; letter-spacing: -4.6px; text-align: center; color: #2b2b2b; }
body.page-home .cases__body { width: 521px; max-width: 100%; font-family: var(--f-satoshi); font-weight: 400; font-size: 18px; line-height: 27px; text-align: center; color: var(--c-text); }
body.page-home .services { display: grid; grid-template-columns: repeat(3, 404px); gap: 24px; justify-content: center; width: 100%; max-width: 1260px; overflow: hidden; }
body.page-home .scard { display: flex; flex-direction: column; gap: 22px; padding: 30px; background: var(--c-white); border-radius: 20px; overflow: hidden; }
body.page-home .scard__content { display: flex; flex-direction: column; justify-content: center; gap: 19px; }
body.page-home .scard__middle { display: flex; flex-direction: column; overflow: hidden; }
body.page-home .scard__title { font-family: var(--f-dm); font-weight: 500; font-size: 24px; line-height: 26px; letter-spacing: -0.5px; color: #3d3d3d; }
body.page-home .scard__sub, body.page-home .scard__p { font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #3d3d3d; }
body.page-home .scard__sep { width: 230px; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 100%); }
body.page-home .tags { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px; width: 1072px; max-width: 100%; }
body.page-home .tag { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 13px 14px; background: var(--c-white); border-radius: 17px; }
body.page-home .tag__dots { position: absolute; left: 0; top: -7px; width: 100%; height: calc(100% + 14px); border-radius: 100%; overflow: hidden; pointer-events: none; }
body.page-home .tag__dots img { width: 100%; height: 100%; object-fit: cover; border-radius: 100%; }
body.page-home .tag__label { position: relative; font-family: var(--f-dm); font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: -0.5px; color: #424242; white-space: nowrap; }

/* ---------- 4. Results (home variants) ---------- */
body.page-home .results--home { padding: 0 93px 0 94px; }
body.page-home .results--home .results__wrap { max-width: none; }
body.page-home .results--home .results__container { gap: 0; padding: 52px 0 48px; }
body.page-home .results--home .results__grid { max-width: 1253px; }
body.page-home .results--home .results__col { width: 295px; }
body.page-home .results__col--white { background: var(--c-white); }
body.page-home .results--home .results__col--up .results__card { min-height: 416px; }
body.page-home .results--home-m { display: none; }

/* ---------- 5. Testimonials + process ---------- */
body.page-home .testimonials { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 0 50px 20px; background: var(--c-bg); }
body.page-home .testimonial { width: 100%; max-width: 1239px; }
body.page-home .testimonial .eyebrow { line-height: 37.8px; letter-spacing: 7.2px; }
body.page-home .testimonial__head { gap: 24px; }
body.page-home .process-text { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 1239px; padding: 64px; overflow: hidden; }
body.page-home .process-text__container { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 34px; width: 100%; }
body.page-home .process-text .eyebrow { line-height: 37.8px; letter-spacing: 7.2px; }
body.page-home .process-text__title { width: 660px; max-width: 100%; line-height: 80px; letter-spacing: -3.2px; text-align: center; }
body.page-home .process-text__p { width: 582px; max-width: 100%; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; text-align: center; color: #131313; }
body.page-home .process-text__p--ghost { display: none; }
body.page-home .process { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; max-width: 1239px; padding: 62px 50px 61px; background: var(--c-white); border-radius: 49px; overflow: hidden; }
body.page-home .process__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; justify-content: center; width: 100%; max-width: 1139px; }
body.page-home .process__step { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 272px; padding: 0 24px; }
body.page-home .process__step::before { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 100%; background: var(--c-line); }
body.page-home .process__card { display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding-top: 16px; }
body.page-home .process__title { line-height: 44px; letter-spacing: -2px; }
body.page-home .process__p { line-height: 18.2px; letter-spacing: -0.28px; }

/* ---------- tablet (768-1199) ---------- */
@media (max-width: 1199px) {
  body.page-home .hero__inner { padding: 60px 20px 27px; }
  body.page-home .hero__buttons { flex-wrap: wrap; }
  /* live tablet capture: 'Convertí / cada' at desktop size, 'consulta en acción ッ' rendered smaller on one line */
  body.page-home .hero__title-desktop .hero__line:nth-child(2) { font-size: 62px; line-height: 90px; letter-spacing: -3px; white-space: nowrap; }
  body.page-home .hero__title-desktop .hero__line:nth-child(2) .t-serif { letter-spacing: -3px; }
  body.page-home .ah { width: 100%; }
  /* live tablet variant: 265x551 phone box, tilt rotateX(50) scale(1.9) -> scale(1.1), parked right (+187px) then left (-200px);
     feature text left/right aligned in a 613px sticky block with 64px padding, 60px title */
  body.page-home .ah__phone { width: 265px; height: 551.188px; transform: translate(-50%, -50%) perspective(700px) translateY(-140px) scale(1.9) rotateX(50deg); }
  body.page-home .ah__body { transform: scale(0.50095, 0.50337); }
  body.page-home .ah__feature--1 { height: 930px; }
  body.page-home .ah__feature--2 { height: 1315px; padding-top: 0; }
  body.page-home .ah__content { height: 613px; padding: 64px !important; align-items: flex-start; justify-content: flex-start; }
  body.page-home .ah__feature--2 .ah__content { height: 100vh; align-items: center; justify-content: flex-end; }
  body.page-home .ah__tdg { width: auto; max-width: 100%; }
  body.page-home .ah__title { font-size: 60px; line-height: 60px; letter-spacing: -2.4px; }
  body.page-home .ah__title .t-serif { letter-spacing: -2.4px; }
  body.page-home .ah__title--right { width: 438px; }
  body.page-home .about__bottom { flex-direction: column; }
  body.page-home .pcard { width: 100%; max-width: 591px; }
  body.page-home .markets__title { font-size: 80px; line-height: 1; }
  body.page-home .mercados__row { flex-direction: column; }
  body.page-home .mcard { width: 100%; max-width: 628px; }
  body.page-home .cases__title { font-size: 64px; line-height: 1; }
  body.page-home .services { grid-template-columns: repeat(2, minmax(0, 404px)); }
  body.page-home .results--home { padding: 0 24px; }
  body.page-home .process__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- phone (<768) ---------- */
@media (max-width: 767px) {
  body.page-home .hero { padding: 74px 10px 0; overflow: hidden; }
  body.page-home .hero__glow { display: none; }
  body.page-home .hero__wrapper { gap: 0; border-radius: var(--r-md); }
  body.page-home .hero__container { gap: 48px; padding: 58px 20px 0; }
  body.page-home .hero__inner { gap: 0; padding: 0; }
  body.page-home .hero__top { gap: 44px; width: 100%; padding-bottom: 47px; }
  body.page-home .hero__texttag { gap: 27px; }
  body.page-home .hero__title { font-size: 66px; line-height: 52.8px; letter-spacing: -3.8px; }
  body.page-home .hero__title .t-serif { letter-spacing: -3.8px; }
  body.page-home .hero__title-desktop { display: none; }
  body.page-home .hero__title-mobile { display: flex; }
  body.page-home .hero__line--tight, body.page-home .hero__line--tight .t-serif { letter-spacing: -3px; }
  body.page-home .hero__p--desktop { display: none; }
  body.page-home .hero__p--mobile { display: block; width: 261px; font-family: var(--f-satoshi); font-weight: 400; font-size: 18px; line-height: 27px; letter-spacing: 0; color: var(--c-text); }
  body.page-home .hero__buttons { flex-direction: column; width: 100%; }
  body.page-home .hero__buttons .btn { width: 100%; }
  body.page-home .hero__bottom { width: 100%; max-width: none; }
  body.page-home .only-desktop-br { display: none; }
  body.page-home .hero__bottom .clients { overflow: visible; }
  body.page-home .hero__bottom .clients__label { font-family: var(--f-dm); }
  body.page-home .hero__bottom .ticker { width: 908px; max-width: none; height: 75px; padding: 24px; }
  body.page-home .hero__bottom .ticker__track { height: 27px; }

  body.page-home .ah__glow { display: block; }
  body.page-home .ah__bigticker { left: 50%; top: 363px; width: 375px; height: 367px; margin-left: -187px; }
  body.page-home .bigticker__item { height: 90px; font-size: 100px; padding-left: 19px; }
  body.page-home .bigticker__item--serif { padding: 0 30px 0 3px; }
  /* live mobile: Main 100vh, phone box 202x420 centred at 45%, tilted rotateX(50) scale(1.3) translateY(-179) -> straight scale(1) translateY(-30) over the first 100vh of scroll */
  body.page-home .ah__main { overflow: hidden; }
  body.page-home .ah__phone { top: 45%; width: 202px; height: 420.156px; transform: translate(-50%, -50%) perspective(700px) translateY(-179px) scale(1.3) rotateX(50deg); }
  body.page-home .ah__body { transform: scale(0.38185, 0.38371); }
  body.page-home .ah__mfeat { position: absolute; left: 0; bottom: 60px; display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; padding: 0 32px 30px; opacity: 0; transform: translateY(250px); will-change: transform, opacity; }
  body.page-home .ah__mfeat--1 { opacity: 1; }
  body.page-home .ah__mfeat--2 { bottom: 30px; }
  body.page-home .ah__mfeat--2 .ah__mfeat-title { width: 337px; flex: none; margin: 0 -13px; } /* live: title box 337px wide (overflows the 32px padding) so it wraps in 2 lines */
  body.page-home .ah__mfeat-title { font-family: var(--f-dm); font-weight: 300; font-size: 36px; line-height: 36px; letter-spacing: -1.44px; text-align: center; color: #131313; }
  body.page-home .ah__mfeat-title .t-serif { letter-spacing: -1.44px; }
  body.page-home .ah__mfeat-p { font-family: var(--f-satoshi); font-weight: 400; font-size: 16px; line-height: 22.4px; text-align: center; color: var(--c-ink); }
  body.page-home .ah__feature { padding: 0; }
  body.page-home .ah__feature--1 { height: calc(150vh + 10px); }
  body.page-home .ah__feature--2 { height: 100vh; padding-top: 0; }
  body.page-home .ah__feature .ah__content { display: none; }
  body.page-home .ah__scrollarea { height: 450px; }
  body.page-home .ah__scrollarea--2 { display: none; }
  body.page-home .ah__scrollarea--end { display: block; height: 50vh; }

  body.page-home .about { padding: 30px 10px 20px; }
  body.page-home .about__wrapper { border-radius: var(--r-md); }
  body.page-home .about__container { gap: 64px; padding: 44px 20px; border-radius: 41px; }
  body.page-home .about__heading { gap: 39px; padding: 0; }
  body.page-home .reveal__text { font-size: 40px; line-height: 40px; letter-spacing: -3px; }
  body.page-home .about__tagline { width: 306px; font-size: 16px; line-height: 22.4px; letter-spacing: 0; color: var(--c-ink); }
  body.page-home .about__how { font-size: 32px; line-height: 35.2px; letter-spacing: -1.28px; }
  body.page-home .about__bottom { flex-direction: column; gap: 10px; padding: 0; border-radius: 30px; overflow: hidden; }
  body.page-home .pcard { gap: 55px; justify-content: flex-start; width: 100%; height: 555px; padding: 16px 30px 0; background: #f7f6f5; border-radius: 37px; }
  body.page-home .pcard--panel { gap: 74px; height: 513px; padding-top: 48px; }
  body.page-home .pcard__visual, body.page-home .pcard__visual--panel { position: relative; width: 255px; height: 243px; padding: 0; overflow: visible; }
  body.page-home .pcard__ball, body.page-home .pcard__ball--purple { top: -131px; width: 300px; height: 300px; margin-left: -150px; }
  body.page-home .pcard__ball--green { background: radial-gradient(circle at 50% 50%, #54e35b 0%, #5ee66a 45%, #7ceb84 62%, rgba(124, 235, 132, 0.4) 76%, rgba(124, 235, 132, 0) 100%); }
  body.page-home .pcard__visual--panel::before { display: none; }
  body.page-home .pcard__visual--panel { height: 152px; }
  body.page-home .pcard__visual--panel .pcard__ball { top: -148px; }
  /* live phone ball: off-white disc with soft grey/yellow ripple shadows + blurred colour disc clipped inside */
  body.page-home .pcard__ball, body.page-home .pcard__ball--green, body.page-home .pcard__ball--purple { background: rgb(249, 247, 246); filter: none; box-shadow: rgba(0, 0, 0, 0.05) 0 100px 100px 0, rgba(255, 208, 38, 0.01) 0 4px 20px 0, rgba(255, 208, 38, 0.01) 0 7px 34px 0, rgba(255, 208, 38, 0.02) 0 11px 55px 0, rgba(255, 208, 38, 0.03) 0 18px 89px 0, rgba(255, 208, 38, 0.04) 0 31px 154px 0, rgba(255, 208, 38, 0.08) 0 56px 280px 0; }
  body.page-home .pcard__ball-in { display: block; position: absolute; inset: 0; border-radius: 50%; overflow: hidden; }
  body.page-home .pcard__ball-in::before { content: ""; position: absolute; inset: -5px; border-radius: 50%; background: rgb(84, 227, 91); filter: blur(40px); }
  body.page-home .pcard__ball--purple .pcard__ball-in::before { background: rgb(181, 125, 229); }
  body.page-home .pcard__bot--smart { left: 31px; top: 36px; width: 194px; }
  body.page-home .pcard__bot--panel { left: 19px; top: 35px; width: 218px; }
  body.page-home .pcard__text, body.page-home .pcard__text--panel { position: relative; bottom: auto; gap: 24px; width: 255px; padding: 23px 0; }
  body.page-home .pcard__text--panel { padding: 20px 0 24px; }
  body.page-home .pcard__title { font-size: 52px; letter-spacing: -2.1px; }
  body.page-home .pcard__body--desktop { display: none; }
  body.page-home .pcard__body--mobile, body.page-home .pcard--panel .pcard__body--mobile { display: block; width: 262px; font-family: var(--f-satoshi); font-size: 16px; line-height: 22.4px; letter-spacing: 0; color: var(--c-ink); }
  body.page-home .pcard__btn { width: 100%; padding: 0; }
  body.page-home .pcard__cta { width: 100%; min-width: 0; min-height: 50px; padding: 10px 28px; }

  body.page-home .about__content { gap: 50px; padding: 40px 0 0; }
  body.page-home .markets__top { gap: 30px; }
  body.page-home .markets__title { font-size: 60px; line-height: 60px; letter-spacing: -4px; }
  body.page-home .markets__body { width: 314px; font-family: var(--f-satoshi); font-size: 16px; line-height: 22.4px; letter-spacing: 0; color: var(--c-ink); }
  body.page-home .markets__cta { width: 100%; padding: 0 18px; }
  body.page-home .markets__cta .btn { width: 100%; }
  body.page-home .mercados { gap: 11px; }
  body.page-home .mercados__row { flex-direction: column; gap: 15px; }
  body.page-home .mcard { width: 100%; height: 395px; padding: 28px; }
  body.page-home .mcard__tag { font-size: 11px; line-height: 16.5px; letter-spacing: 1.76px; }
  body.page-home .mcard__title { width: 287px; font-size: 35px; line-height: 35px; }
  body.page-home .mcard__body { width: 145px; line-height: 24px; }
  body.page-home .mcard__body--w215 { width: 175px; line-height: 23px; }
  body.page-home .mcard--city .mcard__body { width: 157px; }
  body.page-home .mcard--turis .mcard__body { width: 134px; }
  body.page-home .mcard__btn { left: 27px; bottom: 33px; min-height: 50px; padding: 10px 28px; }
  body.page-home .mcard--const .mcard__btn, body.page-home .mcard--turis .mcard__btn { left: 24px; }
  body.page-home .mcard--turis .mcard__btn { bottom: 22px; } /* live: 22px from the card bottom, 10px under 'turísticos.' */
  body.page-home .mcard__mind { left: 169px; top: 81px; width: 285px; height: 313px; }
  body.page-home .mcard--const .mcard__mind { left: 171px; top: 82px; width: 312px; height: 343px; }
  body.page-home .mcard--city .mcard__mind { left: 168px; top: 93px; width: 298px; height: 328px; }
  body.page-home .mcard--turis .mcard__mind { left: 131px; top: 63px; width: 318px; height: 350px; }

  body.page-home .results--home { display: none; }
  body.page-home .results--home-m { display: flex; padding: 0; }
  body.page-home .results--home-m .results__wrap { border-radius: 0; background: none; }
  body.page-home .results--home-m .results__container { gap: 48px; padding: 34px 10px 63px; border-radius: 70px; }
  body.page-home .results--home-m .results__grid { gap: 9px; }
  body.page-home .results--home-m .results__title { max-width: 300px; }
  body.page-home .results--home-m .results__card { min-height: 0; padding: 32px; }
  body.page-home .results--home-m .results__col--down .results__card { min-height: 206px; }
  body.page-home .results--home-m .results__col--up .results__card { min-height: 108px; }
  body.page-home .results--home-m .results__col--up .results__image { height: 270px; }
  body.page-home .results--home-m .results__overlay { border-radius: var(--r-xs); }

  body.page-home .testimonials { padding: 0 10px; }
  body.page-home .process-text { min-height: 487px; padding: 16px; }
  body.page-home .process-text__container { gap: 0; }
  body.page-home .process-text__title { width: 297px; font-size: 51px; line-height: 51px; letter-spacing: -2.04px; }
  body.page-home .process-text__p--ghost { display: block; flex: none; width: 582px; max-width: none; font-family: var(--f-inter); font-size: 16px; line-height: 19.2px; letter-spacing: 0; color: rgba(255, 255, 255, 0.6); }
  body.page-home .process { padding: 62px 16px 61px; }
  body.page-home .process__grid { grid-template-columns: 1fr; gap: 64px; width: 297px; }
  body.page-home .process__step { width: 244px; height: 320px; }
}