.focus-video-preview, .focus-clients-preview { --fr-navy:#08142c; --fr-blue:#0b5cff; --fr-pink:#ff0a68; --fr-violet:#a911c4; --fr-line:#dbe2f0; }
.focus-video-preview { position: relative; overflow: hidden; padding: clamp(5rem,8vw,8rem) 0; background: #fff; }
.focus-video-preview .video-layout { display: none; }
.fr-home-v1 .focus-video-preview .video-layout-1, .fr-home-v2 .focus-video-preview .video-layout-2, .fr-home-v3 .focus-video-preview .video-layout-3 { display: block; }
.focus-video-preview .video-poster { position: relative; display: block; width: 100%; overflow: hidden; border: 0; padding: 0; background: #10182b var(--poster) center/cover no-repeat; color: white; cursor: pointer; }
.focus-video-preview .video-poster::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(8,20,44,.72)); transition:background .35s ease; }
.focus-video-preview .video-poster::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.12); pointer-events:none; }
.focus-video-preview .video-poster:hover::before { background:linear-gradient(180deg,rgba(8,20,44,.04),rgba(8,20,44,.55)); }
.focus-video-preview .video-poster:hover .video-play { transform:translate(-50%,-50%) scale(1.08); background:var(--fr-pink); }
.focus-video-preview .video-play { position:absolute; z-index:2; left:50%; top:50%; width:66px; height:66px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.95); color:var(--fr-pink); transform:translate(-50%,-50%); box-shadow:0 14px 40px rgba(8,20,44,.25); transition:.3s ease; font-size:17px; padding-left:3px; }
.focus-video-preview iframe { width:100%; height:100%; border:0; background:#000; }

.video-editorial-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(310px,.72fr); gap:1.2rem; }
.video-feature { position:relative; min-width:0; }
.video-feature .video-poster { aspect-ratio:16/9; }
.video-feature > div { display:grid; grid-template-columns:.5fr 1.4fr; gap:1.4rem; padding:1.4rem 0 0; border-top:1px solid var(--fr-line); }
.video-feature span, .video-side-list span { color:var(--fr-pink); font-size:.7rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.video-feature h3 { margin:0; font-size:clamp(1.45rem,2.2vw,2.35rem); line-height:1.06; letter-spacing:-.04em; }
.video-feature p { grid-column:2; margin:.6rem 0 0; color:#5f6c84; }
.video-side-list { display:grid; gap:1.2rem; }
.video-side-list article { display:grid; grid-template-columns:1.15fr 1fr; gap:1rem; align-items:start; padding-bottom:1.2rem; border-bottom:1px solid var(--fr-line); }
.video-side-list .video-poster { aspect-ratio:4/3; }
.video-side-list .video-play { width:42px;height:42px;font-size:12px; }
.video-side-list h3 { margin:.45rem 0 0; font-size:1.05rem; line-height:1.18; }

.video-layout-2 { margin:0 clamp(12px,2vw,28px); border-radius:22px; background:var(--fr-navy); color:white; }
.video-stage { display:grid; grid-template-columns:.75fr 1.45fr; gap:clamp(3rem,7vw,8rem); padding-top:clamp(4rem,7vw,7rem); padding-bottom:clamp(4rem,7vw,7rem); align-items:center; }
.video-stage-copy h2 { margin:1rem 0 1.6rem; font-size:clamp(3.3rem,5.4vw,6.6rem); line-height:.9; letter-spacing:-.075em; }
.video-stage-copy h2 span { color:#ff3d87; }
.video-stage-copy > p:not(.eyebrow) { max-width:390px; color:#c4cee0; font-size:1.06rem; line-height:1.6; }
.video-stage-copy .text-link { color:white; }
.video-stage-cards { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.video-stage-cards .video-poster { aspect-ratio:16/10; border-radius:12px; }
.video-stage-cards .stage-main { grid-column:1/-1; aspect-ratio:16/8.3; }
.video-stage-cards strong { position:absolute; z-index:2; left:1.25rem; bottom:1.1rem; font-size:.78rem; letter-spacing:.04em; }

.video-layout-3 { padding-bottom:1rem; }
.filmstrip-heading { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:2.2rem; }
.filmstrip-heading h2 { margin:.6rem 0 0; max-width:790px; font-size:clamp(2.8rem,5vw,5.6rem); line-height:.96; letter-spacing:-.065em; }
.filmstrip-heading > span { color:#7a8599; font-size:.78rem; letter-spacing:.12em; }
.video-filmstrip { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(360px,44vw); gap:1rem; padding:0 max(20px,calc((100vw - 1520px)/2)); overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.video-filmstrip article { scroll-snap-align:start; }
.video-filmstrip .video-poster { aspect-ratio:16/9; }
.video-filmstrip article > div { display:flex; justify-content:space-between; gap:1rem; padding:1rem 0 1.5rem; }
.video-filmstrip article span { color:var(--fr-pink); font-size:.72rem; font-weight:750; text-transform:uppercase; }
.video-filmstrip article h3 { max-width:66%; margin:0; font-size:1.1rem; line-height:1.15; }

.focus-clients-preview { overflow:hidden; }
.focus-clients-preview .clients-layout { display:none; }
.fr-home-v1 .clients-layout-1, .fr-home-v2 .clients-layout-2, .fr-home-v3 .clients-layout-3 { display:block; }
.clients-layout-1 { padding:2.5rem 0; background:linear-gradient(90deg,#fff4f9,#f3f6ff); border-top:1px solid #f0dce7; border-bottom:1px solid #dde6f7; }
.clients-caption { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:1.8rem; }
.clients-caption h2 { margin:.35rem 0 0; font-size:clamp(2rem,3vw,3.4rem); letter-spacing:-.05em; }
.clients-caption h2 span { color:var(--fr-pink); }
.clients-caption > p { margin:0; color:#69758d; font-size:.9rem; line-height:1.45; text-align:right; }
.logo-marquee { display:flex; width:max-content; animation:fr-logo-marquee 34s linear infinite; }
.logo-marquee:hover { animation-play-state:paused; }
.logo-marquee ul { display:flex; align-items:center; gap:1rem; margin:0; padding:0 .5rem; list-style:none; }
.logo-marquee li { width:150px; height:76px; display:grid; place-items:center; padding:10px 14px; border:1px solid rgba(8,20,44,.08); background:rgba(255,255,255,.78); }
.logo-marquee img { max-width:100%; max-height:100%; filter:grayscale(1); opacity:.72; transition:.3s ease; }
.logo-marquee li:hover img { filter:none; opacity:1; transform:scale(1.05); }
@keyframes fr-logo-marquee { to { transform:translateX(-50%); } }

.clients-layout-2 { padding:clamp(5rem,8vw,8rem) 0; background:#f5f7fc; }
.clients-wall { display:grid; grid-template-columns:.55fr 1.45fr; gap:clamp(3rem,7vw,8rem); align-items:start; }
.clients-wall-copy { position:sticky; top:8rem; }
.clients-wall-copy h2 { margin:1rem 0 1.3rem; font-size:clamp(3rem,4.8vw,5.8rem); line-height:.92; letter-spacing:-.07em; }
.clients-wall-copy h2 span { color:var(--fr-pink); }
.clients-wall-copy > p:not(.eyebrow) { max-width:380px; color:#65728a; line-height:1.6; }
.logo-wall { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0; padding:1px; list-style:none; background:#dfe5f1; }
.logo-wall li { min-height:150px; display:grid; place-items:center; padding:24px; background:white; transition:.3s ease; }
.logo-wall li:hover { z-index:1; transform:translateY(-5px); box-shadow:0 16px 35px rgba(8,20,44,.1); }
.logo-wall img { max-width:100%; max-height:90px; filter:grayscale(1); opacity:.68; transition:.3s ease; }
.logo-wall li:hover img { filter:none; opacity:1; }

.clients-layout-3 { padding:2.2rem 0; background:var(--fr-navy); color:white; }
.clients-dark-row { display:grid; grid-template-columns:260px 1fr; gap:3rem; align-items:center; }
.clients-dark-row > div p:last-child { margin:.5rem 0 0; color:#aebad0; font-size:.85rem; }
.clients-dark-row ul { display:flex; gap:.7rem; margin:0; padding:0; overflow-x:auto; list-style:none; scrollbar-width:none; }
.clients-dark-row li { flex:0 0 125px; height:70px; display:grid; place-items:center; padding:10px; border:1px solid rgba(255,255,255,.1); background:white; }
.clients-dark-row img { max-width:100%; max-height:100%; filter:grayscale(1); transition:.3s ease; }
.clients-dark-row li:hover img { filter:none; }

.home-preview-switcher { --fr-pink:#ff0a68; position:fixed; z-index:10000; right:22px; bottom:22px; width:220px; padding:14px; border:1px solid rgba(255,255,255,.35); border-radius:15px; background:rgba(8,20,44,.92); color:white; box-shadow:0 18px 55px rgba(8,20,44,.24); backdrop-filter:blur(16px); font-family:Geist,sans-serif; }
.home-preview-switcher > span { display:block; margin-bottom:9px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.home-preview-switcher > div { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.home-preview-switcher button { height:34px; border:1px solid rgba(255,255,255,.28); border-radius:8px; background:transparent; color:white; font:inherit; cursor:pointer; }
.home-preview-switcher button[aria-pressed="true"] { border-color:var(--fr-pink); background:var(--fr-pink); }
.home-preview-switcher small { display:block; margin-top:8px; color:#c7d0e2; font-size:11px; }

@media (prefers-reduced-motion:reduce) { .logo-marquee { animation:none; } }
@media (max-width:980px) {
  .video-editorial-grid, .video-stage, .clients-wall { grid-template-columns:1fr; }
  .video-side-list { grid-template-columns:1fr 1fr; }
  .clients-wall-copy { position:static; }
  .logo-wall { grid-template-columns:repeat(3,1fr); }
  .clients-dark-row { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .focus-video-preview { padding:4rem 0; }
  .video-feature > div, .video-side-list article { grid-template-columns:1fr; }
  .video-side-list { grid-template-columns:1fr; }
  .video-stage-cards { grid-template-columns:1fr; }
  .video-stage-cards .stage-main { grid-column:auto; aspect-ratio:16/10; }
  .video-filmstrip { grid-auto-columns:84vw; }
  .clients-caption { align-items:start; flex-direction:column; }
  .clients-caption > p { text-align:left; }
  .logo-wall { grid-template-columns:repeat(2,1fr); }
  .logo-wall li { min-height:120px; }
  .home-preview-switcher { right:10px; bottom:10px; width:190px; }
}