/* Homepage-only print direction. Content and scroll mechanics remain independent. */

body.page-editorial {
  --editorial-paper: #fff6e5;
  --editorial-ink: #092d30;
  --editorial-flora: none;
  --paper-tear: polygon(0 0,100% 0,100% 70%,98% 63%,96% 77%,93% 66%,91% 80%,88% 71%,85% 81%,82% 65%,79% 76%,76% 69%,74% 83%,71% 75%,68% 86%,65% 72%,62% 81%,59% 66%,56% 76%,53% 68%,50% 83%,47% 73%,44% 88%,41% 78%,38% 86%,35% 72%,32% 82%,29% 66%,26% 77%,23% 69%,20% 83%,17% 72%,14% 81%,11% 67%,8% 75%,5% 63%,2% 72%,0 65%);
  --paper-tear-alt: polygon(0 0,100% 0,100% 80%,97% 68%,94% 76%,91% 59%,88% 67%,85% 55%,82% 68%,79% 60%,76% 75%,73% 67%,70% 81%,67% 69%,64% 76%,61% 63%,58% 78%,55% 70%,52% 84%,49% 72%,46% 80%,43% 65%,40% 78%,37% 69%,34% 83%,31% 71%,28% 85%,25% 73%,22% 81%,19% 69%,16% 78%,13% 63%,10% 72%,7% 60%,4% 69%,0 57%);
  background: #061e28;
}
body.page-editorial .page { background: none; }
body.page-editorial .topbar { background: #071f29; box-shadow: 0 2px 0 #fff0d42b; backdrop-filter: none; }
body.page-editorial .topbar .brand-logo { filter: none; }
body.page-editorial .topbar .brand-word > strong { text-transform: uppercase; }
body.page-editorial .topbar .brand-word > span { display: block; font-size: 11px; line-height: 1.4; color: #eee4cf; margin-top: 2px; }
body.page-editorial .topbar .button { box-shadow: none; border-radius: 4px; }
body.page-editorial .topbar .button.limbo { background: #a62547; color: #fff6e5; }

body.page-editorial .story-welcome { isolation: isolate; background: var(--editorial-paper); padding: 26px 20px 14px; }
body.page-editorial .story-welcome::before { content: ""; position: absolute; inset: 0; background: var(--editorial-flora) center / 100% auto no-repeat; opacity: .4; z-index: -1; pointer-events: none; }
body.page-editorial .showcase-narrative h1 { font: 400 36px/1.15 Georgia,serif; color: var(--editorial-ink); }
body.page-editorial .story-pillars { width: min(630px,100%); gap: 14px; margin-top: 20px; }
body.page-editorial .story-pillars li { display: block; }
body.page-editorial .story-pillars a {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 9px; padding: 16px 20px 13px; min-height: 96px; height: 100%;
  background: #fffaf0; color: var(--pillar-color); border: 1px solid var(--pillar-color);
  border-radius: 5px; box-shadow: 0 3px 0 var(--pillar-color); text-decoration: none;
  transition: transform 160ms, background-color 160ms;
}
body.page-editorial .story-pillars a:hover { transform: translateY(-3px); background: #fff; }
body.page-editorial .story-pillars a:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--pillar-color); }
body.page-editorial .story-pillars .pillar-arrow { position: absolute; top: 10px; right: 10px; font-size: 11px; width: 12px; height: 12px; animation: none; }
body.page-editorial .story-pillars span { color: var(--editorial-ink); }

body.page-editorial .home-showcase.showcase-narrative,
body.page-editorial .showcase-narrative.is-flow-story {
  --story-bg: #073d33; --story-ink: #fff5de; --story-muted: #d6e3cd; --story-accent: #8be5bb;
}
body.page-editorial .showcase-narrative[data-service="content"] { --story-bg: #ae2444; --story-ink: #fff6e5; --story-muted: #ffead8; --story-accent: #ffdf9f; }
body.page-editorial .showcase-narrative[data-service="experience"] { --story-bg: #092f45; --story-ink: #fff6e5; --story-muted: #cee3e6; --story-accent: #89d6de; }
body.page-editorial .story-stage::before { background: var(--editorial-flora) center / 100% auto no-repeat; opacity: .66; }
body.page-editorial .is-flow-story .story-automation { --story-bg: #073d33; --story-ink: #fff5de; --story-muted: #d6e3cd; --story-accent: #8be5bb; }
body.page-editorial .is-flow-story .story-content { --story-bg: #ae2444; --story-ink: #fff6e5; --story-muted: #ffead8; --story-accent: #ffdf9f; }
body.page-editorial .is-flow-story .story-experience { --story-bg: #092f45; --story-ink: #fff6e5; --story-muted: #cee3e6; --story-accent: #89d6de; }
body.page-editorial .is-flow-story .story-scene { background: var(--editorial-flora) center / 100% auto no-repeat var(--story-bg); }
body.page-editorial .story-production { border: 7px solid var(--editorial-paper); border-radius: 2px; box-shadow: 6px 7px 0 #07262f66; }
body.page-editorial .story-post-brand, body.page-editorial .story-publish { background: var(--editorial-paper); }
body.page-editorial .story-customer > img { border: 6px solid var(--editorial-paper); border-radius: 2px; }
body.page-editorial .story-incoming p { background: var(--editorial-paper); border-radius: 2px 7px 7px; }
body.page-editorial .story-reply { background: #d0eace; border-radius: 7px 2px 7px 7px; }
body.page-editorial .story-cta { background: #f8ebcd; color: #11352e; border-color: #f8ebcd; border-radius: 4px; box-shadow: 3px 3px 0 #051c2970; }
body.page-editorial .story-cta:hover { background: #fff9eb; }
body.page-editorial .story-progress { left: 24px; right: 24px; }

/* Open, asymmetrical botanical bands; illustrations stay away from live copy. */
body.page-editorial #necesidades,
body.page-editorial #digitalizacion,
body.page-editorial #canales,
body.page-editorial #contenido,
body.page-editorial #maps-home,
body.page-editorial #customer-success,
body.page-editorial #casos { position: relative; isolation: isolate; }
body.page-editorial #necesidades { background: #fff6e5; }
body.page-editorial #necesidades::before,
body.page-editorial #digitalizacion::before,
body.page-editorial #canales::before,
body.page-editorial #contenido::before,
body.page-editorial #maps-home::before,
body.page-editorial #customer-success::before,
body.page-editorial #casos::before {
  content: ""; display: block; position: absolute; inset: 0; pointer-events: none; z-index: -1;
  background: var(--editorial-flora) center / 100% auto no-repeat; opacity: .45; transform: none; border: 0;
}
body.page-editorial #necesidades::before { opacity: .12; }
body.page-editorial #digitalizacion { background: #ad2441; }
body.page-editorial .digitalization-flora,
body.page-editorial .system-story-flora,
body.page-editorial .content-growth-flora,
body.page-editorial #customer-success > .neon-flora { display: none; }
body.page-editorial #digitalizacion::before { background-size: 100% auto; background-position: center top; opacity: .6; }
body.page-editorial .journey-service { border-radius: 3px; border: 1px solid #f7e9c7; box-shadow: 4px 5px 0 #35122233; }
body.page-editorial .journey-service .service-art { border: 6px solid #fff2d8; border-bottom: 0; }
body.page-editorial .service-web { background: #fff7e8; }
body.page-editorial .service-integrations { background: #f7e6da; }
body.page-editorial .service-maps { background: #236a7b; }
body.page-editorial .service-experience { background: #102b3b; }
body.page-editorial #clientes { background: #fff8eb; }
body.page-editorial #clientes .client-tile { border-radius: 4px; background: #fffdf7; }
body.page-editorial #canales.system-story { background: #062e2a !important; }
body.page-editorial #canales::before { background-size: 100% auto; opacity: .6; }
body.page-editorial #canales .channel-dragon-mark { filter: none; }
body.page-editorial #contenido { background: #fff6e5; }
body.page-editorial #contenido::before { background-size: 100% auto; opacity: .15; }
body.page-editorial #contenido::after { display: none; }
body.page-editorial #demo-whatsapp { background: #082f35; }
body.page-editorial #demo-whatsapp .demo-flora { display: none; }
body.page-editorial #demo-whatsapp .demo-flora-layer { background: var(--editorial-flora) center / 100% auto no-repeat; opacity: .55; transform: translateY(calc(var(--scroll-demo-progress,0) * -50px)); }
body.page-editorial #maps-home { background: #fff6e5 !important; }
body.page-editorial #maps-home::before { background-size: 100% auto; opacity: .2; transform: rotate(180deg); }
body.page-editorial .maps-quick-card { background: #fffaf0; border: 1px solid #d4c9af; border-radius: 3px; box-shadow: 5px 5px 0 #113b3320; }
body.page-editorial #customer-success { background: #a92846; }
body.page-editorial #customer-success::before { background-size: 100% auto; opacity: .5; transform: scaleX(-1); }
body.page-editorial .customer-success-photo { border: 7px solid var(--editorial-paper); border-radius: 2px; }
body.page-editorial #casos.journey-close { background: #092e40 !important; }
body.page-editorial #casos::before { opacity: .7; }
body.page-editorial #casos h2 > span { color: #cfe4dc; }
body.page-editorial .footer { background: #061e28; }

/* The original dragon plays a finite sequence only while the closing is visible. */
body.page-editorial .journey-closing-dragon { position: relative; width: min(570px,100%); aspect-ratio: 1180 / 380; margin: 0 auto 20px; }
.journey-closing-dragon img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; }
.journey-closing-dragon img:first-child { opacity: 1; }
.journey-closing-dragon.is-dragon-active { animation: intro-dragon-glide 4.8s ease-in-out 1; }
.journey-closing-dragon.is-dragon-active img { animation-duration: 1.2s; animation-iteration-count: 4; animation-timing-function: steps(1,end); }
.journey-closing-dragon.is-dragon-active img:nth-child(1) { animation-name: intro-dragon-a; }
.journey-closing-dragon.is-dragon-active img:nth-child(2) { animation-name: intro-dragon-b; }
.journey-closing-dragon.is-dragon-active img:nth-child(3) { animation-name: intro-dragon-c; }
.journey-closing-dragon.is-dragon-active img:nth-child(4) { animation-name: intro-dragon-d; }

@media (max-width:760px) {
  body.page-editorial .topbar .brand { gap: 9px; min-width: 0; }
  body.page-editorial .topbar .brand-word > strong { font-size: 21px; }
  body.page-editorial .topbar .brand-word > span { font-size: 10px; }
  body.page-editorial .story-welcome { padding: 22px 16px 12px; }
  body.page-editorial .story-welcome::before { background-size: auto 100%; opacity: .13; }
  body.page-editorial .showcase-narrative h1 { font-size: 28px; }
  body.page-editorial .story-pillars { gap: 10px; margin-top: 16px; }
  body.page-editorial .story-pillars a { min-height: 100px; padding: 15px 6px 12px; gap: 8px; }
  body.page-editorial .story-pillars span { font-size: 12px; line-height: 1.35; }
  body.page-editorial .story-pillars .pillar-arrow { font-size: 10px; top: 7px; right: 6px; }
  body.page-editorial .story-stage::before { background-size: 620px auto; background-position: center bottom; opacity: .48; }
  body.page-editorial #necesidades::before,
  body.page-editorial #contenido::before,
  body.page-editorial #maps-home::before { background-size: 620px auto; opacity: .15; }
  body.page-editorial #digitalizacion::before,
  body.page-editorial #canales::before,
  body.page-editorial #customer-success::before,
  body.page-editorial #casos::before { background-size: 620px auto; opacity: .48; }
  body.page-editorial #demo-whatsapp .demo-flora-layer { background-size: 620px auto; opacity: .4; }
  body.page-editorial .is-flow-story .story-scene { background-size: 620px auto; }
  body.page-editorial .journey-service .service-art { border-width: 4px; }
  body.page-editorial .journey-closing-dragon { width: min(400px,100%); }
}
@media (prefers-reduced-motion:reduce) {
  body.page-editorial .journey-closing-dragon, body.page-editorial .journey-closing-dragon img { animation: none !important; }
}
@media (max-width:360px) {
  body.page-editorial .story-pillars { grid-template-columns: 1fr; gap: 9px; }
  body.page-editorial .story-pillars a { flex-direction: row; justify-content: flex-start; min-height: 48px; gap: 12px; padding: 10px 34px 10px 14px; }
  body.page-editorial .story-pillars a > i:first-child { width: 23px; font-size: 21px; }
  body.page-editorial .story-pillars span { font-size: 13px; text-align: left; }
  body.page-editorial .story-pillars .pillar-arrow { top: 18px; right: 13px; }
}

/* Revision 8: original cutouts sit beside the UI, never stretched across the page. */
body.page-editorial .story-scene { position: relative; }
.story-editorial-art {
  --art-width: min(300px,calc((100vw - 820px) / 2));
  position: absolute; width: var(--art-width); height: var(--art-width); max-width: none;
  object-fit: contain; top: 180px; left: calc(-1 * var(--art-width) - 6px);
  padding: 8px; pointer-events: none;
  transform: translateY(calc(var(--story-progress,0) * -14px));
}
.story-content .story-editorial-art { left: auto; right: calc(-1 * var(--art-width) - 6px); top: 215px; }
.story-experience .story-editorial-art { top: 110px; }
body.page-editorial .story-stage::before { inset: 18px; border: 1px solid #f7e9cb13; background: none; opacity: 1; }
body.page-editorial .story-welcome::before { display: none; }

/* Each paper lip belongs to its preceding band and cannot intercept input. */
body.page-editorial main > section { position: relative; isolation: isolate; overflow: visible; }
body.page-editorial .story-welcome::after,
body.page-editorial .home-showcase.showcase-narrative::after,
body.page-editorial #necesidades::after,
body.page-editorial #digitalizacion::after,
body.page-editorial #clientes::after,
body.page-editorial #canales::after,
body.page-editorial #contenido::after,
body.page-editorial #maps-home::after,
body.page-editorial #customer-success::after {
  content: ""; display: block; position: absolute; inset: auto 0 -1px;
  width: 100%; height: 30px; background: var(--tear-color,var(--editorial-paper));
  clip-path: var(--paper-tear); z-index: 5; pointer-events: none; border: 0; transform: rotate(180deg);
}
body.page-editorial .story-welcome::after { bottom: -1px; height: 18px; --tear-color: #073d33; }
body.page-editorial .home-showcase.showcase-narrative::after { --tear-color: var(--editorial-paper); }
body.page-editorial #necesidades::after, body.page-editorial #clientes::after, body.page-editorial #contenido::after { clip-path: var(--paper-tear-alt); }
body.page-editorial #necesidades::after { --tear-color: #ad2441; }
body.page-editorial #digitalizacion::after { --tear-color: #fff8eb; }
body.page-editorial #clientes::after { --tear-color: #062e2a; }
body.page-editorial #canales::after { --tear-color: var(--editorial-paper); }
body.page-editorial #contenido::after { --tear-color: #082f35; }
body.page-editorial #maps-home::after { --tear-color: #a92846; }
body.page-editorial #customer-success::after { --tear-color: #092e40; clip-path: var(--paper-tear-alt); }
body.page-editorial #necesidades::before, body.page-editorial #digitalizacion::before,
body.page-editorial #canales::before, body.page-editorial #contenido::before,
body.page-editorial #maps-home::before, body.page-editorial #customer-success::before,
body.page-editorial #casos::before { display: none; }
body.page-editorial #maps-home > .cloud-lane { display: none; }
body.page-editorial #necesidades { padding-block: 52px 40px; }
body.page-editorial .service-need { border-top: 2px solid #24776b; }
body.page-editorial .service-need:nth-child(2) { border-color: #a92748; }
body.page-editorial .service-need:nth-child(3) { border-color: #248296; }
body.page-editorial #digitalizacion { padding-top: 64px; padding-bottom: 54px; }
body.page-editorial .digitalization-intro { display: grid; grid-template-columns: 150px minmax(0,1fr); align-items: center; width: min(770px,100%); gap: 26px; margin-inline: auto; text-align: left; }
.services-editorial-art { width: 150px; height: 150px; object-fit: contain; padding: 4px; }
body.page-editorial #clientes { padding-top: 20px; }
body.page-editorial #canales.system-story { padding-top: 54px; padding-bottom: 60px; }
body.page-editorial #canales .journey-step { border-top: 2px solid #78c4b3; }

/* Existing content and scroll-chat retain their original layout and behavior. */
body.page-editorial #contenido .content-growth-studio::after {
  content: ""; position: absolute; width: 96px; height: 26px; top: -8px; right: 24px;
  background: #e7d4adbf; transform: rotate(8deg); clip-path: var(--paper-tear-alt); pointer-events: none;
}
body.page-editorial #demo-whatsapp .demo-flora-layer { background: none; transform: none; }
body.page-editorial #demo-whatsapp .demo-flora-layer::before {
  content: ""; position: absolute; inset: 28px; border: 1px solid #d8dbc32b;
  border-radius: 2px; transform: rotate(-1deg); pointer-events: none;
}
body.page-editorial #maps-home { padding-block: 64px; }
body.page-editorial #maps-home .quick-cta-art::before { display: none; }
.maps-editorial-art { display: block; width: 100%; height: 220px; object-fit: contain; padding: 8px; margin-bottom: 12px; }
body.page-editorial .maps-quick-cta .quick-cta-inner { grid-template-columns: 1.05fr .9fr 1fr; gap: 22px; }
body.page-editorial .maps-quick-cta .quick-cta-art { display: contents; }
body.page-editorial .maps-quick-cta .quick-cta-copy { grid-column: 1; grid-row: 1; align-self: end; }
body.page-editorial .maps-quick-cta .quick-cta-actions { grid-column: 1; grid-row: 2; align-self: start; margin: 0; }
body.page-editorial .maps-quick-cta .maps-editorial-art { grid-column: 2; grid-row: 1 / 3; height: 380px; margin: 0; padding: 0; }
body.page-editorial .maps-quick-cta .maps-quick-card { grid-column: 3; grid-row: 1 / 3; padding: 22px; }
body.page-editorial .maps-quick-cta h2 { font-size: 38px; }
body.page-editorial .maps-one-time-price { box-shadow: none; }
body.page-editorial .maps-one-time-price strong { font-size: 58px; }
body.page-editorial .maps-one-time-price span { font-size: 11px; }
body.page-editorial #customer-success { background: #a92846 !important; padding-block: 70px; }
body.page-editorial .customer-success-photo { border: 8px solid var(--editorial-paper); box-shadow: 7px 7px 0 #52152d55; transform: rotate(1deg); }
body.page-editorial #casos.journey-close { padding-top: 60px; }

@media (max-width:1000px) {
  body.page-editorial .maps-quick-cta .quick-cta-inner { grid-template-columns: 1fr 1fr; }
  body.page-editorial .maps-quick-cta .maps-editorial-art { grid-column: 2; height: 300px; }
  body.page-editorial .maps-quick-cta .maps-quick-card { grid-column: 1 / -1; grid-row: 3; }
  body.page-editorial .maps-quick-list { grid-template-columns: 1fr 1fr; }
  .story-editorial-art { --art-width: 68px; left: auto; right: 0; top: -12px; padding: 2px; transform: none; }
  .story-content .story-editorial-art, .story-experience .story-editorial-art { right: 0; left: auto; top: -12px; }
  body.page-editorial .story-copy { padding-top: 24px; }
  body.page-editorial .is-flow-story .story-editorial-art { top: 6px; right: 14px; }
}
@media (max-width:760px) {
  body.page-editorial .maps-quick-cta .quick-cta-inner { grid-template-columns: 1fr; gap: 18px; }
  body.page-editorial .maps-quick-cta .quick-cta-copy { grid-column: 1; grid-row: 1; }
  body.page-editorial .maps-quick-cta .maps-editorial-art { grid-column: 1; grid-row: 2; height: 260px; }
  body.page-editorial .maps-quick-cta .maps-quick-card { grid-column: 1; grid-row: 3; }
  body.page-editorial .maps-quick-cta .quick-cta-actions { grid-column: 1; grid-row: 4; }
  body.page-editorial .maps-quick-list { grid-template-columns: 1fr; }
  body.page-editorial .story-stage::before { inset: 10px; }
  body.page-editorial .story-scene { grid-template-rows: 210px 260px; }
  body.page-editorial .story-copy { justify-content: flex-end; padding-top: 90px; }
  body.page-editorial .showcase-narrative .story-copy h2 { font-size: 29px; }
  body.page-editorial .showcase-narrative .story-copy h2 > span { font-size: 26px; }
  body.page-editorial .showcase-narrative .story-content .story-copy h2 > span { font-size: 17px; }
  .story-editorial-art, .story-content .story-editorial-art, .story-experience .story-editorial-art {
    --art-width: 106px; top: -2px; left: calc(50% - 53px); right: auto;
  }
  .story-experience .story-editorial-art { --art-width: 190px; left: calc(50% - 95px); top: -43px; }
  body.page-editorial .is-flow-story .story-editorial-art { top: 26px; right: auto; }
  body.page-editorial .is-flow-story .story-experience .story-editorial-art { top: -15px; }
  body.page-editorial #necesidades { padding-block: 44px 30px; }
  body.page-editorial #digitalizacion { padding-block: 48px 38px; }
  body.page-editorial .digitalization-intro { grid-template-columns: 80px minmax(0,1fr); gap: 14px; }
  .services-editorial-art { width: 80px; height: 100px; }
  body.page-editorial #digitalization-title { font-size: 28px; }
  body.page-editorial #canales.system-story { padding-block: 40px; }
  body.page-editorial #maps-home, body.page-editorial #customer-success { padding-block: 46px; }
  .maps-editorial-art { height: 190px; margin-bottom: 6px; }
}
@media (max-width:760px) and (max-height:700px) {
  body.page-editorial .story-scene { grid-template-rows: 190px 230px; }
  body.page-editorial .story-copy { padding-top: 70px; }
  .story-editorial-art, .story-content .story-editorial-art { --art-width: 88px; left: calc(50% - 44px); }
  .story-experience .story-editorial-art { --art-width: 164px; left: calc(50% - 82px); top: -36px; }
}
@media (prefers-reduced-motion:reduce) { .story-editorial-art { transform: none; } }
@media (max-width:360px) { body.page-editorial #digitalization-title { font-size: 24px; } }

/* A neutral paper stock unifies the distinct illustrations without repeating their motifs. */
body.page-editorial .story-welcome,
body.page-editorial .story-stage,
body.page-editorial .is-flow-story .story-scene,
body.page-editorial #necesidades,
body.page-editorial #digitalizacion,
body.page-editorial #clientes,
body.page-editorial #canales.system-story,
body.page-editorial #contenido,
body.page-editorial #maps-home,
body.page-editorial #customer-success,
body.page-editorial #casos.journey-close {
  background-image: url('/assets/editorial/sections/paper-grain.webp') !important;
  background-size: 480px 480px;
  background-repeat: repeat;
  background-blend-mode: multiply;
}
