/* The approved Multiplataforma cover. All rules are scoped to this hero. */
.agency-hero.jl-multiplataforma{background:#e3dddf;color:#172335;min-height:660px;border-bottom:1px solid #d8dde5}
.jl-multiplataforma .jl-multiplataforma-media{position:absolute;inset:0 0 0 auto;width:min(100%,1680px);right:max(0px,calc((100% - 1680px)/2));z-index:-3;overflow:hidden;background:transparent;pointer-events:none}
.jl-multiplataforma-media>video,.jl-multiplataforma-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:right center;display:block}
.jl-multiplataforma-media>video{opacity:0}
.jl-multiplataforma-media[data-motion-state="playing"]>video{opacity:1}
.jl-multiplataforma .agency-hero-shade{background:linear-gradient(90deg,#e3dddf 0%,#e3dddffa 18%,#e3dddfeb 33%,#e3dddfa6 43%,#e3dddf00 61%)}
.jl-multiplataforma .agency-hero-grid{min-height:660px;padding-block:82px 66px}
.jl-multiplataforma .agency-hero-copy{width:49%;max-width:670px;text-shadow:none}
.jl-multiplataforma .agency-label{color:#425470;font-size:10px;letter-spacing:.045em}
.jl-multiplataforma h1{color:#172335;font-size:clamp(44px,4.65vw,76px);font-weight:700;line-height:1.06;letter-spacing:-.055em}
.jl-multiplataforma h1 em{color:#245ce4}
.jl-multiplataforma .agency-hero-copy>p:not(.agency-label){color:#41526a;font-size:16px;line-height:1.85;max-width:540px;margin-top:26px}
.jl-multiplataforma .button.ghost{color:#18355f;border-color:#9aaac1;background:#ffffff45}
.jl-multiplataforma .button.ghost:hover{background:#ffffffa6}
.jl-multiplataforma .agency-promises{color:#425470;border-color:#acb8ca80;font-size:10px;gap:20px}
.jl-multiplataforma .agency-promises svg{color:#315da2}
@media(min-width:1700px){.jl-multiplataforma .agency-hero-grid{min-height:750px;padding-top:100px}.jl-multiplataforma .agency-hero-copy>p:not(.agency-label){font-size:18px}}
@media(max-width:1050px) and (min-width:741px){.jl-multiplataforma .agency-hero-copy{width:55%}.jl-multiplataforma h1{font-size:52px}.jl-multiplataforma .agency-hero-copy>p:not(.agency-label){font-size:14px}.jl-multiplataforma .agency-promises{flex-wrap:wrap;gap:12px}.jl-multiplataforma .agency-hero-shade{background:linear-gradient(90deg,#e3dddf 0%,#e3dddffa 25%,#e3dddfdb 40%,#e3dddf00 72%)}}
@media(max-width:740px){
 /* Put the decorative film immediately after the heading. Text keeps its DOM
    reading order; one video stays in normal layout instead of a padded footer. */
 .agency-hero.jl-multiplataforma{min-height:0;background:#e3dddf;display:grid;grid-template-columns:18px minmax(0,1fr) 18px;padding:28px 0 26px}
 .jl-multiplataforma .agency-hero-grid,.jl-multiplataforma .agency-hero-copy{display:contents}
 .jl-multiplataforma .agency-hero-copy>*{grid-column:2;min-width:0}
 .jl-multiplataforma h1{grid-row:2;font-size:clamp(34px,10vw,46px);line-height:1.06;margin:0}
 .jl-multiplataforma .agency-label{grid-row:1;font-size:8px;margin:0 0 14px}
 .jl-multiplataforma .agency-hero-copy>p:not(.agency-label){grid-row:4;font-size:14px;line-height:1.65;max-width:600px;margin:4px 0 0}
 .jl-multiplataforma .actions{grid-row:5;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 0}
 .jl-multiplataforma .actions .button{min-height:46px;height:100%;font-size:11px;line-height:1.45;padding:10px 8px;gap:8px}
 .jl-multiplataforma .agency-promises{grid-row:6;flex-wrap:wrap;font-size:10px;gap:8px 16px;margin:20px 0 0;padding-top:15px}
 .jl-multiplataforma .jl-multiplataforma-media{grid-column:1/-1;grid-row:3;position:relative;inset:auto;width:min(100%,560px);height:auto;aspect-ratio:16/9;justify-self:center;margin:8px 0;z-index:0}
 .jl-multiplataforma-media>video,.jl-multiplataforma-media>img{object-position:center}
 .jl-multiplataforma .agency-hero-shade{display:none}
}
@media(prefers-reduced-motion:reduce){.jl-multiplataforma-media>video{opacity:0!important}}



/* The perimeter is now baked into every media asset, including initial poster.
   A four-pixel feather only absorbs codec rounding; no runtime canvas exists. */
.jl-multiplataforma .jl-multiplataforma-media{background:transparent}
.jl-multiplataforma-media[data-motion-state="playing"]>img{visibility:hidden}
@supports(width:1cqh){
 .jl-multiplataforma .jl-multiplataforma-media{container-type:size}
 .jl-multiplataforma-media>video,.jl-multiplataforma-media>img{
  inset:50% 0 auto auto;width:min(100%,177.777778cqh);height:min(100%,56.25cqw);
  transform:translateY(-50%);object-fit:contain;object-position:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4px,#000 calc(100% - 4px),transparent),linear-gradient(180deg,transparent,#000 4px,#000 calc(100% - 4px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4px,#000 calc(100% - 4px),transparent),linear-gradient(180deg,transparent,#000 4px,#000 calc(100% - 4px),transparent);
  -webkit-mask-composite:source-in;mask-composite:intersect;
 }
}