/* Dedicated mobile compositions. Desktop originals remain selected from 768px. */
main .responsive-art>source{display:none}
/* Preserve the same desktop frame when a WordPress thumbnail gains a picture. */
.evo-front .project-card a>.responsive-art>img{aspect-ratio:180/104;object-fit:cover;border-radius:9px}
@media(max-width:767px){
 main .responsive-art>img{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;mask-image:none;-webkit-mask-image:none}
 .evo-front .service-card:has(.responsive-art) .evo-art{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
 .evo-front .strategy-art:has(.responsive-art),.evo-front .crm-art:has(.responsive-art){height:auto;max-height:none;aspect-ratio:auto}
 .evo-front .strategy-art:has(.responsive-art) .evo-art,.evo-front .crm-art:has(.responsive-art) .evo-art{width:100%;height:auto;max-height:none;aspect-ratio:1122/1402;object-fit:contain}
 .evo-front .strategy-art:has(.responsive-art)::before{display:none}
 .service-seo .page-visual:has(.responsive-art),.service-geo .page-visual:has(.responsive-art){height:auto;max-height:none;min-height:0;aspect-ratio:auto}
 .service-geo .page-cta-geo .cta-art:has(.responsive-art){height:auto;max-height:none}
 .blog-page .recommended-grid .responsive-art>img{width:100px;height:100px;aspect-ratio:1;object-fit:contain}

 /* Keep the complete foreground above the copy; the quiet lower part stays behind it. */
 .evo-front .hero:has(.responsive-art),
 .service-seo .page-hero:has(.responsive-art),
 .service-geo .page-hero:has(.responsive-art),
 .blog-page .blog-reference-hero:has(.responsive-art){position:relative;isolation:isolate;overflow:hidden;padding:0;background:#080808;color:#fff}
 .evo-front .hero-inner:has(.responsive-art),
 .service-seo .page-hero>.page-split:has(.responsive-art),
 .service-geo .page-hero>.page-split:has(.responsive-art),
 .blog-page .blog-reference-hero>.page-split:has(.responsive-art){position:relative;display:block;min-height:0;gap:0}
 .evo-front .hero-art:has(.responsive-art),
 .service-seo .page-hero .page-visual:has(.responsive-art),
 .service-geo .page-hero .page-visual:has(.responsive-art),
 .blog-page .blog-reference-hero .page-visual:has(.responsive-art){position:absolute;inset:0 -20px auto;width:100vw;height:calc(100vw * 1672 / 941);min-height:0;max-height:none;margin:0;aspect-ratio:941/1672;z-index:0}
 .evo-front .hero-art .responsive-art>.evo-art,
 .service-seo .page-hero .responsive-art>.page-art,
 .service-geo .page-hero .responsive-art>.page-art,
 .blog-page .blog-reference-hero .responsive-art>.page-art{width:100%;height:100%;max-height:none;aspect-ratio:941/1672;object-fit:contain;object-position:center top;mask-image:none;-webkit-mask-image:none}
 .evo-front .hero-art:has(.responsive-art)::before{display:none}
 .evo-front .hero-inner:has(.responsive-art)::after,
 .service-seo .page-hero>.page-split:has(.responsive-art)::after,
 .service-geo .page-hero>.page-split:has(.responsive-art)::after,
 .blog-page .blog-reference-hero>.page-split:has(.responsive-art)::after{content:"";position:absolute;inset:0 -20px;z-index:1;pointer-events:none;background:linear-gradient(180deg,#08080808 0,#08080814 62vw,#080808a6 94vw,#080808eb 136vw,#080808 178vw)}
 .service-geo .page-hero>.page-split:has(.responsive-art)::after{background:linear-gradient(180deg,#08080808 0,#08080818 88vw,#080808b5 120vw,#080808ef 151vw,#080808 178vw)}
 .evo-front .hero-inner:has(.responsive-art)>.hero-copy,
 .service-seo .page-hero>.page-split:has(.responsive-art)>.page-copy,
 .service-geo .page-hero>.page-split:has(.responsive-art)>.page-copy,
 .blog-page .blog-reference-hero>.page-split:has(.responsive-art)>.page-copy{position:relative;z-index:2;display:block;width:100%;max-width:none;margin:0;padding:96vw 0 34px;color:#fff}
 .service-seo .page-hero>.page-split:has(.responsive-art)>.page-copy{padding-top:92vw}
 .service-geo .page-hero>.page-split:has(.responsive-art)>.page-copy{padding-top:124vw}
 .blog-page .blog-reference-hero>.page-split:has(.responsive-art)>.page-copy{padding-top:105vw}
 .evo-front .hero:has(.responsive-art) .hero-description,
 .service-seo .page-hero:has(.responsive-art) .page-lead,
 .service-geo .page-hero:has(.responsive-art) .page-lead,
 .blog-page .blog-reference-hero:has(.responsive-art) .page-lead{color:#f4f4f4}
 .blog-page .blog-reference-hero:has(.responsive-art) .eyebrow,
 .blog-page .blog-reference-hero:has(.responsive-art) .blog-signature{color:#fff}
 .blog-page .blog-reference-hero:has(.responsive-art) .blog-strategy-note{display:none}
}
/* Preserve the existing tablet rule after adding the picture wrapper. */
@media(min-width:768px) and (max-width:1023px){
 .evo-front .hero-art:has(.responsive-art) .evo-art,.evo-front .strategy-art:has(.responsive-art) .evo-art,.evo-front .crm-art:has(.responsive-art) .evo-art{width:100%;height:auto;max-height:560px;aspect-ratio:auto;object-fit:contain;object-position:right center}
}

@media(max-width:767px){
 /* The new heroes retain their complete upper composition and fade into live text. */
 .evo-front .hero-inner:has(.responsive-art)>.hero-copy{padding-top:108vw}
 .service-trafego-pago .page-hero:has(.responsive-art),
 .contact-page .contact-reference-hero:has(.responsive-art),
 .faq-reference .faq-reference-hero:has(.responsive-art){position:relative;isolation:isolate;overflow:hidden;padding:0;background:#080808;color:#fff}
 .service-trafego-pago .page-hero>.page-split:has(.responsive-art),
 .contact-page .contact-reference-layout:has(.responsive-art),
 .faq-reference .faq-hero-layout:has(.responsive-art){position:relative;display:block;min-height:0;gap:0}
 .service-trafego-pago .page-hero .page-visual:has(.responsive-art),
 .contact-page .contact-hero-visual:has(.responsive-art),
 .faq-reference .faq-hero-art:has(.responsive-art){position:absolute;inset:0 -20px auto;width:100vw;height:calc(100vw * 1672 / 941);min-height:0;max-height:none;max-width:none;margin:0;aspect-ratio:941/1672;z-index:0;display:block;overflow:hidden}
 .service-trafego-pago .page-hero .page-visual .responsive-art>img,
 .contact-page .contact-hero-visual .responsive-art>img,
 .faq-reference .faq-hero-art .responsive-art>img{display:block;width:100%;height:100%;max-height:none;aspect-ratio:941/1672;object-fit:contain;object-position:center top;mask-image:none;-webkit-mask-image:none}
 .service-trafego-pago .page-hero>.page-split:has(.responsive-art)::after,
 .faq-reference .faq-hero-layout:has(.responsive-art)::after,
 .contact-page .contact-reference-layout:has(.responsive-art)>.contact-intro::before{content:"";position:absolute;inset:0 -20px;pointer-events:none;background:linear-gradient(180deg,#08080808 0,#08080812 105vw,#0808087a 124vw,#080808ec 146vw,#080808 178vw)}
 .service-trafego-pago .page-hero>.page-split:has(.responsive-art)::after,
 .faq-reference .faq-hero-layout:has(.responsive-art)::after{z-index:1}
 .contact-page .contact-reference-layout:has(.responsive-art)>.contact-intro::before{z-index:-1}
 .service-trafego-pago .page-hero>.page-split:has(.responsive-art)>.page-copy,
 .contact-page .contact-reference-layout:has(.responsive-art)>.contact-intro,
 .faq-reference .faq-hero-layout:has(.responsive-art)>.faq-hero-copy{position:relative;z-index:2;width:100%;max-width:none;margin:0;padding:134vw 0 34px;color:#fff}
 .service-trafego-pago .page-hero:has(.responsive-art) .page-lead,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-intro>.page-lead,
 .faq-reference .faq-reference-hero:has(.responsive-art) .page-lead{color:#f4f4f4}
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-hero-note,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-map-note{display:none}
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-intro>.eyebrow,
 .faq-reference .faq-reference-hero:has(.responsive-art) .faq-hero-copy>.eyebrow{color:#eee}
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-info{color:#f3f3f3}
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-channel,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-channel h2,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-box,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-box h2,
 .contact-page .contact-reference-hero:has(.responsive-art) .contact-form label{color:#080808}

 /* One complete square composition per card, with its copy in its own flow. */
 .evo-front .project-card a>.responsive-art>img,
 .evo-front .article-card a>.responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1;object-fit:contain}
 .service-trafego-pago .traffic-channel-card .channel-art:has(.responsive-art),
 .faq-reference .faq-path-image:has(.responsive-art){width:100%;height:auto;aspect-ratio:1;margin:0}
 .service-trafego-pago .traffic-channel-card .channel-art .responsive-art>img,
 .faq-reference .faq-path-image .responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1;object-fit:contain;mask-image:none;-webkit-mask-image:none}

 /* These sections stack their portrait below the copy without a desktop crop or mask. */
 .service-trafego-pago .page-section .page-visual:has(.responsive-art),
 .service-trafego-pago .service-section-4 .page-visual:has(.responsive-art),
 .service-seo .seo-journey-visual:has(.responsive-art),
 .contact-page .contact-process-visual:has(.responsive-art){position:relative;inset:auto;height:auto;min-height:0;max-height:none;aspect-ratio:auto;opacity:1}
 .service-trafego-pago .page-section .page-visual .responsive-art>img,
 .service-trafego-pago .service-section-4 .page-visual .responsive-art>img,
 .service-seo .seo-journey-visual .responsive-art>img,
 .contact-page .contact-process-visual .responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1122/1402;object-fit:contain;mask-image:none;-webkit-mask-image:none}
 .blog-page .featured-article:has(.responsive-art){display:flex;flex-direction:column;min-height:0;aspect-ratio:auto}
 .blog-page .featured-image:has(.responsive-art){position:relative;inset:auto;display:block;width:100%;height:auto;min-height:0;aspect-ratio:1122/1402;margin:0}
 .blog-page .featured-image>.responsive-art{display:contents}
 .blog-page .featured-image .responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1122/1402;object-fit:contain;mask-image:none;-webkit-mask-image:none}

 /* Closing banners use the whole portrait; live buttons stay above the illustration. */
 .evo-front .final-cta:has(.responsive-art),
 .service-seo .page-cta-seo:has(.responsive-art),
 .service-trafego-pago .page-cta.traffic-final-cta:has(.responsive-art),
 .blog-page .blog-reference-cta:has(.responsive-art),
 .contact-page .contact-final-cta:has(.responsive-art){display:flex;flex-direction:column;gap:0;min-height:0;padding:30px 0 0}
 .service-seo .page-cta-seo:has(.responsive-art),
 .service-trafego-pago .page-cta.traffic-final-cta:has(.responsive-art),
 .contact-page .contact-final-cta:has(.responsive-art){background:#080808}
 .evo-front .final-cta:has(.responsive-art)>.container,
 .service-seo .page-cta-seo:has(.responsive-art)>.container,
 .service-trafego-pago .page-cta.traffic-final-cta:has(.responsive-art)>.container,
 .blog-page .blog-reference-cta:has(.responsive-art)>.container,
 .contact-page .contact-final-cta:has(.responsive-art)>.container{position:relative;inset:auto;order:1;min-height:0;padding:0 0 28px;margin-inline:auto;width:calc(100% - 40px)}
 .evo-front .final-cta:has(.responsive-art)>.cta-art,
 .service-seo .page-cta-seo:has(.responsive-art)>.cta-art,
 .service-trafego-pago .page-cta.traffic-final-cta:has(.responsive-art)>.cta-art,
 .blog-page .blog-reference-cta:has(.responsive-art)>.cta-art,
 .contact-page .contact-final-cta:has(.responsive-art)>.contact-cta-art{position:relative;inset:auto;display:block;order:2;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1122/1402;margin:0;z-index:0}
 .evo-front .final-cta .cta-art .responsive-art>img,
 .service-seo .page-cta-seo .cta-art .responsive-art>img,
 .service-trafego-pago .traffic-final-cta .cta-art .responsive-art>img,
 .blog-page .blog-reference-cta .cta-art .responsive-art>img,
 .contact-page .contact-final-cta .contact-cta-art .responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1122/1402;object-fit:contain;mask-image:none;-webkit-mask-image:none}
 .evo-front .final-cta:has(.responsive-art)>.cta-art::before,
 .service-trafego-pago .page-cta.traffic-final-cta:has(.responsive-art)::after,
 .blog-page .blog-reference-cta:has(.responsive-art)::after{display:none}
 .service-trafego-pago .traffic-final-cta:has(.responsive-art) .traffic-final-copy{width:100%;max-width:100%}
 .service-trafego-pago .traffic-final-cta:has(.responsive-art) h2,
 .service-trafego-pago .traffic-final-cta:has(.responsive-art) p:not(.eyebrow){max-width:100%}
 .blog-page .blog-reference-cta:has(.responsive-art) .blog-cta-note{position:static;inset:auto;max-width:none!important;width:auto;margin:24px 0 0;transform:none;text-align:right}
 .blog-page .blog-reference-cta:has(.responsive-art) .blog-cta-note svg{display:none}
 .faq-reference .faq-reference-cta:has(.responsive-art)>.container{display:flex;flex-direction:column;gap:0;min-height:0}
 .faq-reference .faq-reference-cta:has(.responsive-art) .faq-cta-copy{width:100%;max-width:100%}
 .faq-reference .faq-reference-cta:has(.responsive-art) .faq-cta-art{position:relative;inset:auto;display:block;width:100vw;height:auto;max-height:none;aspect-ratio:1122/1402;margin:0 -20px}
 .faq-reference .faq-reference-cta .faq-cta-art .responsive-art>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1122/1402;object-fit:contain;mask-image:none;-webkit-mask-image:none}
}