#ov-direct .content-cards .reel{background:#171222}
#ov-direct .content-cards{height:max(760px,calc(100svh - 32px))}
#ov-direct .cards-stage{margin:24px 0 28px}
#ov-direct .cards-source{display:flex;align-items:center;gap:14px;max-width:500px;margin:0 auto 26px;padding:0 0 20px;border-bottom:1px solid #4c405d}
#ov-direct .cards-source>svg{width:30px;height:36px;stroke:#c3afd9;stroke-width:1.5;fill:none;flex-shrink:0}
#ov-direct .cards-source>img{object-fit:contain;margin-left:auto}
#ov-direct .cards-source strong{display:block;font-size:17px;font-weight:500;line-height:1.25}
#ov-direct .cards-source span{display:block;color:#c5c1d1;font-size:13px;margin-top:4px}
#ov-direct .cards-fan{display:grid;grid-template-columns:26% 40% 27%;gap:3.5%;align-items:center;max-width:1050px;margin:auto;perspective:1200px}
#ov-direct .content-sample-card{background:#f8f7f5;color:#111622;border:8px solid #f8f7f5;border-radius:20px;overflow:hidden;transform-origin:center bottom;min-width:0;box-shadow:0 18px 30px #070b113b}
#ov-direct .card-shorts{transform:rotate(-5deg) translateY(-7px)}
#ov-direct .card-video{transform:rotate(-2deg) translateY(40px)}
#ov-direct .card-posts{transform:rotate(5deg) translateY(-15px)}
#ov-direct .sample-platform{height:32px;display:flex;align-items:center;gap:8px;background:#111622;color:#f1f0ed;padding:0 10px;font-size:11px}
#ov-direct .sample-platform>i{width:12px;height:12px;border-radius:50%;background:#8a43f6}
#ov-direct .sample-platform>svg{width:18px;height:18px;fill:currentColor;margin-left:auto}
#ov-direct .sample-visual{position:relative;overflow:hidden;isolation:isolate;color:#fff}
#ov-direct .sample-visual>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;z-index:-2}
#ov-direct .sample-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,#11162245 48%,#111622e8 100%);z-index:-1}
#ov-direct .sample-visual h3{font:500 clamp(19px,2.1vw,30px)/1.05 'Inter Tight',sans-serif;letter-spacing:-.025em;position:absolute;bottom:22px;left:14px;right:10px;margin:0;color:#fff;max-width:none}
#ov-direct .sample-reel{aspect-ratio:9/12}
#ov-direct .sample-reel>img{object-position:53% center}
#ov-direct .sample-landscape{aspect-ratio:16/10}
#ov-direct .sample-landscape>img{object-position:50% 35%}
#ov-direct .sample-landscape:after{background:linear-gradient(90deg,#111622d9, #11162240 80%),linear-gradient(0deg,#5421d07a,transparent)}
#ov-direct .sample-landscape h3{top:18px;bottom:auto;font-size:clamp(24px,2.8vw,39px);max-width:80%}
#ov-direct .sample-landscape small{position:absolute;bottom:14px;left:14px;font-size:9px;letter-spacing:.03em}
#ov-direct .sample-play{position:absolute;bottom:12px;right:12px;width:32px;height:32px;border:1px solid #ffffff80;border-radius:50%;display:grid;place-items:center}
#ov-direct .sample-play svg{width:17px;height:17px;fill:white}
#ov-direct .sample-social{aspect-ratio:4/5}
#ov-direct .sample-social h3{bottom:38px}
#ov-direct .sample-social small{position:absolute;bottom:13px;left:14px;font-size:10px}
#ov-direct .sample-footer{height:31px;background:#111622;color:#f1f0ed;display:flex;justify-content:space-between;align-items:center;padding:0 10px;gap:8px;font-size:9px;letter-spacing:.025em}
#ov-direct .sample-footer svg{width:16px;height:16px;stroke:#f1f0ed;stroke-width:1.5;fill:none}
#ov-direct .sample-browser{display:flex;align-items:center;gap:4px;height:32px;padding:0 6px}
#ov-direct .sample-browser>i{width:5px;height:5px;background:#c7c5c2;border-radius:50%;flex-shrink:0}
#ov-direct .sample-browser>span{font-size:11px;background:#e7e4e9;padding:4px 8px;border-radius:3px;margin-left:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ov-direct .content-cards .flow-caption small{display:block;font-size:10px;color:#b7accd;margin-top:5px}
#ov-direct[data-motion=false] .content-cards .content-sample-card,#ov-direct[data-motion=false] .content-cards .cards-source,.motion-off #ov-direct .content-cards .content-sample-card,.motion-off #ov-direct .content-cards .cards-source{animation:none!important}
@media(prefers-reduced-motion:reduce){#ov-direct .content-cards .content-sample-card,#ov-direct .content-cards .cards-source{animation:none!important}}
@media(min-width:760px) and (max-height:740px){#ov-direct .content-cards .flow-composition{padding:26px 4vw}#ov-direct .content-cards .flow-heading h2{font-size:36px}#ov-direct .cards-stage{margin:20px 0 30px}#ov-direct .cards-source{margin-bottom:20px;padding-bottom:15px}#ov-direct .cards-fan{max-width:800px}#ov-direct .sample-reel{aspect-ratio:1}#ov-direct .sample-social{aspect-ratio:1}}
@media(max-width:759px){
 #ov-direct .content-cards{height:920px}
 #ov-direct .content-cards .flow-composition{padding:28px 24px}
 #ov-direct .cards-source{gap:10px;margin:0 0 25px;padding-bottom:18px}
 #ov-direct .cards-source strong{font-size:15px}
 #ov-direct .cards-source span{font-size:12px;max-width:195px}
 #ov-direct .cards-source>img{width:24px}
 #ov-direct .cards-fan{grid-template-columns:1fr 1fr;gap:16px;max-width:460px}
 #ov-direct .content-sample-card{border-width:5px;border-radius:14px}
 #ov-direct .card-shorts{grid-column:1;grid-row:1}
 #ov-direct .card-posts{grid-column:2;grid-row:1;transform:rotate(5deg) translateY(12px)}
 #ov-direct .card-video{grid-column:1/-1;grid-row:2;width:85%;justify-self:center;transform:rotate(-2deg) translateY(0)}
 #ov-direct .sample-reel{aspect-ratio:9/12}
 #ov-direct .sample-social{aspect-ratio:9/12}
 #ov-direct .sample-visual h3{font-size:19px;left:10px;right:8px;bottom:15px}
 #ov-direct .sample-social h3{bottom:30px}
 #ov-direct .sample-landscape{aspect-ratio:16/9}
 #ov-direct .sample-landscape h3{font-size:25px;top:13px}
 #ov-direct .sample-platform{height:26px;padding:0 6px;gap:5px;font-size:9px}
 #ov-direct .sample-platform>i{height:9px;width:9px}
 #ov-direct .sample-footer{font-size:7px;padding:0 6px;height:25px}
 #ov-direct .sample-browser{height:26px}
 #ov-direct .sample-browser>span{font-size:10px}
 #ov-direct .content-cards .flow-caption{padding-top:18px;gap:8px}
 #ov-direct .content-cards .flow-caption>span{max-width:145px}
 #ov-direct .content-cards .flow-replay{font-size:11px;padding:9px}
  }

/* Selected treatment: the original 3D reel and oversized brand words remain behind the samples. */
#ov-direct .cinematic-cards .reel{isolation:isolate;background:#111622}
#ov-direct .cinematic-cards .reel>.ambient-video{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover}
#ov-direct .cinematic-cards .reel:after{content:'';position:absolute;inset:0;z-index:1;background:#070b112e;pointer-events:none}
#ov-direct .cinematic-cards .reel-words{z-index:2;transition:opacity 800ms var(--ease-out);opacity:1}
#ov-direct .cinematic-cards .flow-composition{position:relative;z-index:3;justify-content:center;padding:clamp(30px,5vw,72px);transition:opacity 800ms var(--ease-out);background:transparent}
#ov-direct .cinematic-cards.cards-revealed .reel-words{opacity:.2}
#ov-direct .cards-accessible-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#ov-direct .cinematic-cards .cards-stage{margin:0 0 64px}
#ov-direct .cinematic-cards .cards-source{background:#111622de;border:0;border-radius:8px;padding:16px 20px;margin-bottom:40px}
#ov-direct .cinematic-cards .cards-source span{color:#f1f0ed}
#ov-direct .cinematic-cards .flow-caption{border:0;border-radius:8px;background:#111622de;padding:14px 18px;color:#f1f0ed;width:100%;max-width:650px;margin:0 auto}
#ov-direct .cinematic-cards .flow-caption small{color:#d1c6e3}
#ov-direct .cinematic-cards .flow-replay{background:#111622;border-color:#b7accd}
@media(min-width:760px) and (max-height:740px){#ov-direct .cinematic-cards .flow-composition{padding:28px 4vw}#ov-direct .cinematic-cards .cards-stage{margin-bottom:54px}#ov-direct .cinematic-cards .cards-source{margin-bottom:22px;padding:12px 16px}}
@media(max-width:759px){#ov-direct .cinematic-cards{height:860px}#ov-direct .cinematic-cards .flow-composition{padding:30px 24px}#ov-direct .cinematic-cards .cards-stage{margin-bottom:28px}#ov-direct .cinematic-cards .cards-source{padding:14px 12px;margin-bottom:26px}#ov-direct .cinematic-cards .flow-caption{padding:12px 10px}#ov-direct .cinematic-cards .reel-words{inset:5% 6%}#ov-direct .cinematic-cards .reel-words b{font-size:48px}}
@media(prefers-reduced-motion:reduce){#ov-direct .cinematic-cards .flow-composition,#ov-direct .cinematic-cards .reel-words{transition:none}}

/* Brand words have their own rows, never beneath the sample cards. */
#ov-direct .cinematic-cards .flow-composition{justify-content:space-between;gap:22px;padding:36px 5%}
#ov-direct .cinematic-cards .cards-brand-line{font-size:clamp(48px,6.8vw,96px);font-weight:500;line-height:.98;letter-spacing:-.035em;color:#fff;text-shadow:0 3px 18px #070b1180;flex-shrink:0}
#ov-direct .cinematic-cards .cards-brand-bottom{text-align:right}
#ov-direct .cinematic-cards .cards-stage{margin:0 0 32px;transition:opacity 800ms var(--ease-out)}
#ov-direct .cinematic-cards .cards-source{margin-bottom:28px;padding:12px 18px}
#ov-direct .cinematic-cards .cards-fan{max-width:900px}
#ov-direct .cinematic-cards .flow-caption{transition:opacity 800ms var(--ease-out);flex-shrink:0;padding:10px 16px}
@media(min-width:760px) and (max-height:740px){#ov-direct .cinematic-cards .flow-composition{padding:24px 4%;gap:18px}#ov-direct .cinematic-cards .cards-brand-line{font-size:54px}#ov-direct .cinematic-cards .cards-source{margin-bottom:16px;padding:10px 14px}#ov-direct .cinematic-cards .cards-fan{max-width:720px}#ov-direct .cinematic-cards .cards-stage{margin-bottom:35px}}
@media(max-width:759px){#ov-direct .cinematic-cards{height:auto;min-height:900px}#ov-direct .cinematic-cards .flow-composition{padding:28px 24px;gap:22px}#ov-direct .cinematic-cards .cards-brand-line{font-size:42px}#ov-direct .cinematic-cards .cards-source{margin-bottom:24px;padding:12px}#ov-direct .cinematic-cards .cards-stage{margin:0}#ov-direct .cinematic-cards .flow-caption{padding:12px 10px}}
@media(prefers-reduced-motion:reduce){#ov-direct .cinematic-cards .cards-stage,#ov-direct .cinematic-cards .flow-caption{transition:none}}

/* Static photographic samples; motion belongs to the background and expanding reel. */
#ov-direct .cinematic-cards .flow-caption{width:auto;max-width:none;text-align:center;justify-content:center;padding:10px 18px}
#ov-direct .cinematic-cards .flow-caption>span{max-width:none}