/* Rolo Motion v3: capa dinamica sobre Papel Crema y Pino.
   Los colores de las secciones v3 viven en variables --rm-* que el JS anima
   al cruzar cada seccion (claro <-> tinta). Sin JS, cada seccion pinta su tema. */

:root{
  --rm-bg:#FAF3E4; --rm-fg:#1E1710; --rm-soft:#6E5A47; --rm-accent:#8C3A22; --rm-line:#DCC9A3;
  --rm-btn:#032E21; --rm-btn-h:#02261B; --rm-btn-b:#1E1710; --rm-btn-tx:#FAF3E4; --rm-card:#FFFDF8; --rm-ph:#F1E6CE; --rm-ph-2:#DCC9A3;
  --rm-ease:cubic-bezier(.65,0,.35,1);
  --rm-hh:84px;
}
html:not(.rm-js) [data-theme="dark"], .elementor-editor-active [data-theme="dark"]{
  --rm-bg:#1E1710; --rm-fg:#FAF3E4; --rm-soft:rgba(250,243,228,.7); --rm-accent:#F6D488; --rm-line:rgba(250,243,228,.22);
  --rm-btn:#F6D488; --rm-btn-h:#FAF3E4; --rm-btn-b:#F6D488; --rm-btn-tx:#1E1710; --rm-card:#2A2119; --rm-ph:#2E251C; --rm-ph-2:#4A3D30;
}
html:not(.rm-js) [data-theme], .elementor-editor-active [data-theme]{background-color:var(--rm-bg)}
html, body{background-color:var(--rm-bg)!important}
body{overflow-x:clip}
.rm-v3 #content > .ast-container{max-width:100%!important;padding-left:0!important;padding-right:0!important}
.rm-v3 .elementor-location-header + #content, .rm-v3 #content{margin-top:0}
html.lenis, html.lenis body{height:auto}
html.rm-js, html.rm-js body, .lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* ---------- Tipografia ---------- */
.rm-v3 .elementor-heading-title em, .rm-header em{font-style:italic;color:var(--rm-accent)}
.rm-v3 .elementor-heading-title mark{color:inherit;background:linear-gradient(#F6D488,#F6D488) no-repeat 0 90%/0% 36%;transition:background-size 1.2s var(--rm-ease) .35s;padding:0 .04em}
.rm-v3 .is-in .elementor-heading-title mark, .rm-v3 .elementor-editor-active .elementor-heading-title mark{background-size:100% 36%}
.rm-ln{padding-bottom:.06em;margin-bottom:-.06em}
.rm-v3 .elementor-widget-text-editor p:last-child{margin-bottom:0}

/* ---------- Botones: texto que rueda ---------- */
.rm-v3 .elementor-button, .rm-header .elementor-button{transition:background-color .35s var(--rm-ease),border-color .35s var(--rm-ease),color .35s var(--rm-ease)}
.rm-v3 .elementor-button .elementor-button-content-wrapper, .rm-header .elementor-button .elementor-button-content-wrapper{overflow:hidden}
.rm-v3 .elementor-button .elementor-button-text, .rm-header .elementor-button .elementor-button-text{display:inline-block;text-shadow:0 1.7em currentColor;transition:transform .55s var(--rm-ease)}
.rm-v3 .elementor-button:hover .elementor-button-text, .rm-header .elementor-button:hover .elementor-button-text{transform:translateY(-1.7em)}

/* ---------- Cabecera ---------- */
.rm-header{position:fixed!important;top:0;left:0;right:0;z-index:999;transition:transform .6s var(--rm-ease),background-color .45s var(--rm-ease),border-color .45s}
.rm-header.is-scrolled{background-color:var(--rm-bg)!important;border-bottom-color:var(--rm-line)!important}
.rm-header.is-hidden{transform:translateY(-105%)}
.admin-bar .rm-header{top:32px}
@media(max-width:782px){.admin-bar .rm-header{top:46px}}
.rm-logo{position:relative}
.rm-logo .rm-logo-crema{position:absolute!important;inset:0;opacity:0}
.rm-logo .rm-logo-pino, .rm-logo .rm-logo-crema{transition:opacity .5s var(--rm-ease)}
html[data-rm-theme="dark"] .rm-logo .rm-logo-crema{opacity:1}
html[data-rm-theme="dark"] .rm-logo .rm-logo-pino{opacity:0}
.rm-logo img{display:block}
.rm-logo{transition:opacity .5s var(--rm-ease)}
@media(min-width:901px){.home .rm-header:not(.is-scrolled) .rm-logo{opacity:0;pointer-events:none}}
body:not(.rm-v3):not(.elementor-editor-active){padding-top:var(--rm-hh)}
.rm-header .elementor-nav-menu--dropdown{background-color:var(--rm-bg)!important}

/* ---------- Secciones y marcadores de media ---------- */
.rm-sec{position:relative}
.rm-ph{background-color:var(--rm-ph);position:relative;overflow:hidden}
body.logged-in .rm-ph::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(135deg,transparent 0 16px,var(--rm-ph-2) 16px 17px);opacity:.55;pointer-events:none}
body.logged-in .rm-ph[data-ph]::after{content:attr(data-ph);position:absolute;left:16px;bottom:14px;max-width:calc(100% - 32px);font:400 11px/1.5 'Space Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:#1E1710;background:#F6D488;padding:6px 10px;border-radius:8px;z-index:3;pointer-events:none}
.rm-ph > .e-con-inner, .rm-ph > .elementor-element{position:relative;z-index:2}

.rm-ar-45{aspect-ratio:4/5}
.rm-ar-43{aspect-ratio:4/3}
.rm-ar-169{aspect-ratio:16/9}
.rm-ar-11{aspect-ratio:1/1}

/* ---------- Hero ---------- */
.rm-hero{min-height:100vh;min-height:100svh;z-index:3}
.rm-hero-slot{height:calc(100vh - 32px);height:calc(100svh - 32px)}
/* El logo gigante va en el flujo de la columna derecha, al fondo: nunca tapa el texto.
   Se desplaza a la izquierda para montarse sobre la tarjeta de video, como en la referencia. */
.rm-hero-logo{position:relative;z-index:4;pointer-events:none;margin-top:auto!important;padding-top:40px;align-self:flex-start!important;width:min(50vw,72vh)!important;max-width:none!important;margin-left:calc(-1 * min(12vw,180px))!important}
.rm-hero-logo img{width:100%!important;height:auto!important;max-width:none!important}
.rm-hero-col{min-height:calc(100vh - 32px);min-height:calc(100svh - 32px)}
@media(max-width:900px){
  .rm-hero-logo{width:78%!important;margin-left:0!important;padding-top:48px}
  .rm-hero-col{min-height:0}
}
@media(prefers-reduced-motion:no-preference){
  .rm-js:not(.rm-failsafe):not(.rm-intro-done) .rm-intro{opacity:0}
  .rm-js:not(.rm-failsafe):not(.rm-intro-done) .rm-reel-media{clip-path:inset(100% 0 0 0)}
}

.elementor-editor-active .rm-intro{opacity:1!important}
.elementor-editor-active .rm-reel-media{clip-path:none!important}
.elementor-editor-active .rm-hero-slot{visibility:visible!important;background:#6E5A47}
.elementor-editor-active .rm-reel{height:auto!important}
.elementor-editor-active .rm-reel-pin{position:relative!important}

/* ---------- Reel que se expande ---------- */
.rm-reel{z-index:2;height:300vh}
.rm-reel-pin{position:sticky!important;top:0;height:100vh;height:100svh}
.rm-reel-media{position:absolute!important;left:0;top:0;width:100%;height:100%;will-change:transform,width,height;border-radius:0}
.rm-reel-shade{position:absolute!important;inset:0;background:#1E1710;opacity:0;pointer-events:none;z-index:2}
.rm-reel-text{position:absolute!important;inset:0;z-index:3;pointer-events:none}
@media(min-width:901px){.rm-hero-slot{visibility:hidden}}
@media(max-width:900px){.rm-reel{height:220vh}.rm-hero-slot{display:none!important}}

/* ---------- Media que crece al hacer scroll ---------- */
.rm-grow{transform-origin:50% 0;will-change:transform}
.rm-hero-page{min-height:0}

/* ---------- Carril horizontal ---------- */
.rm-hscroll-track{flex-wrap:nowrap!important;width:max-content!important;max-width:none!important}
.rm-hscroll-track > .e-con{flex:0 0 auto!important}
@media(min-width:901px){.rm-hscroll-pin{position:sticky!important;top:0;height:100vh;height:100svh;overflow:hidden}}
@media(max-width:900px){
  .rm-hscroll-track{width:100%!important;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding-bottom:8px!important}
  .rm-hscroll-track > .e-con{width:80vw!important;scroll-snap-align:center}
}

/* ---------- Marquesina ---------- */
.rm-marquee{overflow:hidden}
.rm-marquee-track{flex-wrap:nowrap!important;width:max-content!important;max-width:none!important}
.rm-marquee-track > .elementor-element{flex:0 0 auto!important;width:auto!important}

/* ---------- Mazo de tarjetas ---------- */
@media(min-width:901px){
  .rm-deck{height:440vh}
  .rm-deck-pin{position:sticky!important;top:0;height:100vh;height:100svh}
  .rm-deck-list{position:relative;top:-40px;perspective:1400px;transform-style:preserve-3d;height:min(66vh,620px)}
  .rm-deck-card{position:absolute!important;inset:0;transform-origin:50% 100%;will-change:transform}
}
@media(max-width:900px){.rm-deck-card{min-height:440px}}

/* ---------- Ciclo de imagenes ---------- */
.rm-cycle{position:relative}
.rm-cycle-item{position:absolute!important;inset:0}

/* ---------- Lista con media fija ---------- */
@media(min-width:901px){
  .rm-steps-media{position:sticky!important;top:16vh;height:68vh}
  .rm-steps-item{position:absolute!important;inset:0}
  .rm-js .rm-step{opacity:.28;transition:opacity .6s var(--rm-ease)}
  .rm-js .rm-step.is-active{opacity:1}
}
@media(max-width:900px){.rm-steps-media{display:none!important}}

/* ---------- Filas con hairline que se dibuja ---------- */
.rm-row{position:relative}
.rm-row::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rm-line);transform:scaleX(var(--rm-draw,1));transform-origin:left center}
.rm-row .rm-verb .elementor-heading-title{display:inline-block;transition:transform .6s var(--rm-ease),color .35s var(--rm-ease)}
.rm-row:hover .rm-verb .elementor-heading-title{transform:translateX(18px);color:var(--rm-accent)}

/* ---------- Trazo dibujado ---------- */
.rm-squiggle{position:absolute!important;pointer-events:none;z-index:0}
.rm-squiggle svg{display:block;width:100%;height:auto;overflow:visible}
.rm-squiggle path{fill:none;stroke:var(--rm-accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
/* Los trazos viven solo en el acolchado superior o inferior de la seccion (>=160px escritorio, >=96px movil):
   alto maximo ~116px, nunca cruzan texto. */
.rm-squiggle{width:min(26vw,420px)}
.rm-sq-a{top:20px;right:4vw}
.rm-sq-b{bottom:20px;left:4vw}
.rm-sq-c{top:20px;left:50%;transform:translateX(-50%)}
@media(max-width:900px){.rm-squiggle{width:62vw!important}.rm-sq-a,.rm-sq-c{top:12px}.rm-sq-b{bottom:12px}}

/* ---------- Tabla ---------- */
.rm-table{max-width:100%}
@media(max-width:900px){.rm-table{overflow-x:auto;-webkit-overflow-scrolling:touch}.rm-table > .e-con{min-width:640px}}

/* ---------- Agenda HubSpot a todo el ancho ---------- */
.rm-agenda .elementor-widget-html, .rm-agenda .meetings-iframe-container, .rm-agenda .meetings-iframe-container iframe{width:100%!important;max-width:100%!important}
.rm-tagrow > .e-con{flex:0 0 auto!important;width:auto!important}

/* ---------- Articulos ---------- */
.rm-list{padding-left:1.1em;margin:0}
.rm-list li{margin:0 0 .7em;padding-left:.2em}
.rm-list li::marker{color:var(--rm-accent)}
.rm-v3 #articulo strong{font-weight:600}

/* ---------- Tarjetas de articulo ---------- */
.rm-card-link{text-decoration:none!important;transition:transform .5s var(--rm-ease),border-color .35s var(--rm-ease)}
.rm-card-link:hover{transform:translateY(-6px);border-color:#8C3A22!important}
.rm-card-link .rm-card-more .elementor-heading-title{display:inline-block;transition:transform .5s var(--rm-ease)}
.rm-card-link:hover .rm-card-more .elementor-heading-title{transform:translateX(8px);color:#8C3A22}