/* Project footage: restrained documentary presentation shared by homepage and case study. */
.vf-section{position:relative;isolation:isolate;color:#f4f5f7;font-family:Inter,'Plus Jakarta Sans',sans-serif}
.vf-section *{box-sizing:border-box}
.vf-home{background:#151922;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.08);padding:66px 0 70px}
.vf-grid,.vf-case-shell{display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.2fr);align-items:center;gap:clamp(32px,6vw,92px)}
.vf-copy{min-width:0}
.vf-eyebrow{display:inline-flex;align-items:center;gap:12px;color:#ff9b59;font:800 10px/1.5 Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.vf-rule{display:inline-block;width:26px;height:2px;background:#ff6b00;flex:0 0 auto}
.vf-copy h2{font-family:'Plus Jakarta Sans',Inter,sans-serif;font-size:clamp(35px,3.6vw,54px);font-weight:750;line-height:1.1;letter-spacing:-.065em;margin:19px 0 20px;color:#f7f7f7}
.vf-copy h2 em{font-style:normal;color:#ff8a36}
.vf-copy>p{color:#b2bac5;font-size:14px;line-height:1.9;margin:0 0 22px;max-width:485px}
.vf-ident{display:flex;align-items:center;gap:15px;margin:27px 0 22px;padding:19px 0;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
.vf-ident-number{font:750 24px/1 'Plus Jakarta Sans',Inter,sans-serif;color:#ff8837;letter-spacing:-.05em}
.vf-ident div{display:flex;flex-direction:column;gap:3px}
.vf-ident strong{font:700 13px/1.35 Inter,sans-serif;color:#f1f3f6}
.vf-ident small{font:500 11px/1.5 Inter,sans-serif;color:#8f9aab}
.vf-text-link{display:inline-flex;align-items:center;gap:34px;text-decoration:none;border-bottom:1px solid #ff893a;padding:0 0 8px;font:750 11px/1.5 Inter,sans-serif;color:#ffc093;letter-spacing:.025em;transition:color .2s}
.vf-text-link:hover{color:#fff}
.vf-media-column{min-width:0}
.vf-player{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:#080b11;box-shadow:0 16px 45px rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.15)}
.vf-player::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0}
.vf-player video{position:relative;display:block;width:100%;height:100%;object-fit:contain;background:#090c12}
.vf-player .vf-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.76);background:rgba(10,14,20,.78);color:#fff;width:118px;height:118px;cursor:pointer;font:800 10px/1.2 Inter,sans-serif;letter-spacing:.12em;transition:background .2s,border-color .2s,transform .2s}
.vf-player .vf-play:hover{background:#ff6b00;border-color:#ff6b00;color:#101116;transform:translate(-50%,-50%) scale(1.04)}
.vf-player .vf-play:focus-visible{outline:3px solid #ffb07a;outline-offset:5px}
.vf-play-symbol{font-size:27px;line-height:1;margin-left:5px;font-weight:400}
.vf-player .vf-play[hidden],.vf-player .vf-duration[hidden]{display:none!important}
.vf-duration{position:absolute;z-index:1;right:15px;top:14px;padding:5px 7px;background:rgba(7,10,15,.75);color:#fff;font:750 10px/1.2 Inter,sans-serif;letter-spacing:.05em;pointer-events:none}
.vf-media-meta{display:flex;justify-content:space-between;gap:15px;color:#8792a1;font:750 9px/1.5 Inter,sans-serif;letter-spacing:.13em;padding-top:13px}
.vf-case{background:#0d1016;border-top:1px solid #353b44;padding:67px max(24px,calc((100% - 1240px)/2)) 71px}
.vf-case-shell{max-width:1240px;margin:0 auto;grid-template-columns:minmax(0,.77fr) minmax(0,1.2fr)}
.vf-case .vf-source-note{color:#85909e;font-size:11px;line-height:1.75;max-width:440px;margin-top:25px}
@media(max-width:900px){.vf-home{padding:52px 0 57px}.vf-grid,.vf-case-shell{grid-template-columns:1fr;gap:26px}.vf-copy h2{max-width:640px}.vf-copy>p{max-width:630px}.vf-case{padding:50px max(24px,5vw) 54px}}
@media(max-width:550px){.vf-home{padding:42px 0 46px}.vf-copy h2{font-size:clamp(32px,9vw,42px);margin:15px 0}.vf-copy>p{font-size:13px;line-height:1.85}.vf-eyebrow{font-size:9px}.vf-player .vf-play{width:78px;height:78px;gap:5px;font-size:8px}.vf-play-symbol{font-size:20px}.vf-media-meta{flex-wrap:wrap;font-size:8px;gap:4px}.vf-case{padding:40px 19px 46px}.vf-ident{margin:18px 0;padding:13px 0}}
@media(prefers-reduced-motion:reduce){.vf-player .vf-play,.vf-text-link{transition:none}}


/* Step 20 — client-directed homepage: the authentic project film is the primary hero. */
.vf-primary-hero{
  padding:clamp(42px,5.2vw,78px) 0 24px;
  background:#0b0d13;
  border-top:0;
  border-bottom:1px solid #2b3038;
}
.vf-main-shell{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.35fr);
  gap:clamp(32px,4.2vw,70px);
  align-items:stretch;
}
.vf-primary-hero .vf-copy{max-width:490px}

.vf-primary-hero .vf-media-column{
  display:flex;
  flex-direction:column;
  justify-content:stretch;
  min-width:0;
}
.vf-primary-hero .vf-copy h1{
  color:#fff;
  font-family:'Plus Jakarta Sans',Inter,sans-serif;
  font-size:clamp(38px,4.4vw,65px);
  line-height:1.06;
  letter-spacing:-.064em;
  font-weight:750;
  margin:25px 0 22px;
  text-wrap:balance;
}
.vf-primary-hero .vf-copy h1 em{font-style:normal;color:#ff8730}
.vf-primary-hero .vf-copy>p{
  font-size:clamp(14px,1.15vw,16px);
  line-height:1.8;
  color:#aeb7c5;
  max-width:455px;
}
.vf-primary-hero .vf-copy>p strong{font-weight:650;color:#f8f8f8}
.vf-primary-hero .vf-ident{margin:24px 0 25px;padding:16px 0;gap:16px}
.vf-primary-hero .vf-ident-number{font-size:17px;letter-spacing:.02em}
.vf-primary-hero .vf-ident strong{font-size:13px}
.vf-primary-hero .vf-ident small{font-size:11px}
.vf-primary-hero .vf-player{
  box-shadow:0 22px 70px rgba(0,0,0,.22);
  border-color:#323843;
  aspect-ratio:auto;
  height:100%;
  min-height:clamp(360px,40vw,520px);
}
.vf-primary-hero .vf-media-meta{display:none!important}
.vf-primary-hero .vf-player .vf-play{
  width:104px;height:104px;
  background:rgba(5,9,14,.85);
  border:1px solid rgba(255,255,255,.88);
}
.vf-primary-hero .vf-player .vf-play:hover{background:#ff6b00;border-color:#ff6b00}
.vf-primary-hero .vf-player .vf-play[hidden]{display:none!important}
.vf-main-links{display:flex;gap:19px;align-items:center;flex-wrap:wrap}
.vf-primary-link{
  display:inline-flex;gap:35px;align-items:center;justify-content:space-between;
  color:#101115;background:#ff6b00;padding:16px 18px;
  font:800 11px/1.4 Inter,sans-serif;letter-spacing:.025em;text-decoration:none;
  transition:background .2s ease;
}
.vf-primary-link:hover{background:#ff9240}
.vf-secondary-link{
  display:inline-flex;gap:12px;align-items:center;color:#eff2f6;
  font:700 11px/1.4 Inter,sans-serif;text-decoration:none;
  border-bottom:1px solid #67717e;padding:12px 0;
}
.vf-secondary-link:hover{color:#ffae70;border-color:#ff6b00}
.vf-hero-footer{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin-top:clamp(28px,4vw,60px);padding-top:18px;
  border-top:1px solid #252b34;
  color:#8a96a5;
  font:700 9px/1.5 Inter,sans-serif;
  letter-spacing:.13em;
}
.vf-hero-footer a{color:#a9b3c0;text-decoration:none}
.vf-hero-footer a:hover{color:#ffae70}
.vf-hero-footer a span{margin-left:8px}
@media(max-width:1000px){
  .vf-main-shell{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:28px}
  .vf-primary-hero .vf-copy h1{font-size:clamp(34px,4.9vw,50px)}
  .vf-primary-hero .vf-copy>p{font-size:13px}
  .vf-primary-link{padding:13px 15px;gap:20px}
}
@media(max-width:760px){
  .vf-primary-hero{padding:28px 0 20px}
  .vf-main-shell{display:flex;flex-direction:column;align-items:stretch;gap:25px}
  .vf-primary-hero .vf-media-column{order:-1}
  .vf-primary-hero .vf-player{height:auto;min-height:auto;aspect-ratio:16 / 9}
  .vf-primary-hero .vf-copy{max-width:none}
  .vf-primary-hero .vf-copy h1{font-size:clamp(31px,7vw,46px);margin:13px 0 14px}
  .vf-primary-hero .vf-copy>p{max-width:580px;font-size:14px;line-height:1.75}
  .vf-primary-hero .vf-ident{margin:17px 0 18px;padding:14px 0}
  .vf-hero-footer{margin-top:27px}
}
@media(max-width:480px){
  .vf-primary-hero{padding:18px 0 16px}
  .vf-primary-hero .vf-media-column{margin-inline:-2px}
  .vf-primary-hero .vf-player .vf-play{width:75px;height:75px;font-size:8px}
  .vf-primary-hero .vf-copy h1{font-size:clamp(30px,8vw,38px)}
  .vf-primary-hero .vf-copy>p{font-size:13px}
  .vf-main-links{gap:15px}
  .vf-primary-link{padding:13px 14px;font-size:10px;gap:16px}
  .vf-secondary-link{font-size:10px}
  .vf-hero-footer{font-size:8px;letter-spacing:.07em;flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
  .vf-primary-link,.vf-secondary-link{transition:none}
}