/* Banner publicitário: título enorme, preço e botão, em cima da imagem da campanha. */
.campaign-reel{--rise:cubic-bezier(.16,1,.3,1);margin:var(--space,96px) 0 0}
.campaign-film{height:clamp(460px,50vw,720px)}
.campaign-scene::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#000 0,#000c 28%,#0004 52%,transparent 72%)}
.campaign-scene>img,.campaign-scene>video{filter:grayscale(1) contrast(1.08)}
.campaign-mask>img,.campaign-mask>video{object-position:78% 36%}
.ad-copy{position:absolute;z-index:2;left:clamp(20px,6vw,112px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;gap:clamp(16px,2vw,28px);max-width:min(640px,62%)}
.ad-title{margin:0;font:700 clamp(72px,11.5vw,190px)/.82 TunnelDisplay,"Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:0;color:#fff}
.ad-title span{display:block;overflow:hidden;padding-top:.2em;margin-top:-.2em}
.ad-title i{display:block;font-style:normal}
.ad-offer{margin:0;display:flex;align-items:center;gap:16px;color:#f5f5f2}
.ad-offer strong{font:700 clamp(48px,5.6vw,88px)/.85 TunnelDisplay,"Arial Narrow",sans-serif;padding-right:16px;border-right:1px solid #ffffff80}
.ad-offer span{font:500 clamp(13px,1.2vw,16px)/1.45 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.06em}
.ad-cta{display:inline-flex;align-items:center;gap:14px;min-height:56px;padding:0 30px;background:#f5f5f2;color:#000;font:700 clamp(16px,1.3vw,19px)/1 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;transition:background-color .2s,transform .2s var(--rise)}
.ad-cta:hover{background:#fff;transform:translateY(-2px)}
.ad-cta:focus-visible{outline:2px solid #fff;outline-offset:4px}
.ad-cta span{font-size:1.25em}
.ad-included{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin:0;padding:0;list-style:none;background:#f5f5f2;color:#000}
.ad-included li{flex:1 1 auto;padding:16px 24px;text-align:center;font:700 clamp(12px,1.1vw,14px)/1.3 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em;border-right:1px solid #00000030}
.ad-included li:last-child{border-right:0}
.campaign-caption h2{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.campaign-footer{padding-top:14px;grid-template-columns:auto 1fr;gap:0 24px}
.campaign-caption{display:contents}
.campaign-credit{grid-column:1;grid-row:1;align-self:center;margin:0}
.campaign-playback{grid-column:2;justify-self:end}
/* One authored moment: each line of the headline rises out of the frame as the scene arrives. */
.campaign-scene.is-active .ad-title i{animation:ad-rise .9s var(--rise) both}
.campaign-scene.is-active .ad-title span:nth-child(2) i{animation-delay:.12s}
.campaign-scene.is-active .ad-offer,.campaign-scene.is-active .ad-cta{animation:ad-fade .7s ease-out .45s both}
@keyframes ad-rise{from{transform:translateY(105%)}to{transform:none}}
@keyframes ad-fade{from{opacity:0}to{opacity:1}}
@media(max-width:700px){
 .campaign-reel{margin-top:56px}
 .campaign-film{height:auto;aspect-ratio:4/5}
 .campaign-scene::after{background:linear-gradient(0deg,#000 0,#000d 38%,#0003 62%,transparent 80%)}
 .campaign-mask>img,.campaign-mask>video{object-position:72% 30%}
 .ad-copy{left:20px;right:20px;top:auto;bottom:24px;transform:none;max-width:none;gap:14px}
 .ad-title{font-size:clamp(68px,22vw,104px)}
 .ad-cta{width:100%;justify-content:center}
 .ad-included{display:grid;grid-template-columns:1fr 1fr}
 .ad-included li{padding:13px 10px;font-size:11px;letter-spacing:.08em;border-bottom:1px solid #00000030}
 .ad-included li:nth-child(2n){border-right:0}
 .ad-included li:nth-last-child(-n+2){border-bottom:0}
 .campaign-footer{width:calc(100% - 40px);grid-template-columns:1fr auto;gap:0}
 .campaign-credit{grid-row:1}.campaign-playback{grid-row:1;grid-column:2}
}
@media(prefers-reduced-motion:reduce){.campaign-scene.is-active .ad-title i,.campaign-scene.is-active .ad-offer,.campaign-scene.is-active .ad-cta{animation:none}}
