/* Film Direction page — extra sections on top of service.css */

/* Why film */
.fd-why{ padding-top:96px; }
.fd-why-top{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:40px; align-items:end; margin-bottom:36px; }
.fd-why h2, .fdp-intro h2{ font-size:clamp(40px,5.6vw,72px); line-height:.95; margin-top:10px; }
.fd-why-top > p, .fdp-intro > p{ color:var(--dim); font-size:16px; line-height:1.65; max-width:46ch; }
.fd-why-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.fd-card{ border:1px solid var(--line); border-radius:8px; padding:28px 24px; background:linear-gradient(180deg,rgba(255,255,255,.02),transparent); }
.fd-card svg{ width:30px; height:30px; stroke:var(--red); fill:none; stroke-width:1.5; }
.fd-card svg .fill{ fill:var(--red); }
.fd-card h3{ font-size:26px; line-height:1; margin:18px 0 10px; }
.fd-card p{ color:var(--dim); font-size:15px; line-height:1.6; }

/* Process — long stacked timeline */
.fdp{ padding-top:110px; }
.fdp-intro{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:40px; align-items:end; margin-bottom:16px; }
.fdp-steps{ position:relative; }
.fdp-rows{ list-style:none; margin:0; padding:0; }
.fdp-line{ position:absolute; left:21px; top:88px; bottom:88px; width:1px; background:rgba(255,255,255,.18); }
.fdp-line i{ position:absolute; inset:0; background:var(--red); transform-origin:top; transform:scaleY(0); }
.fdp-row{ position:relative; display:grid; grid-template-columns:44px minmax(0,1fr) minmax(0,1.05fr); gap:clamp(24px,4vw,56px); align-items:center; padding:clamp(56px,7vw,88px) 0; }
.fdp-row + .fdp-row{ border-top:1px solid var(--line); }
.fdp-node{ position:relative; z-index:1; align-self:start; margin-top:30px; width:44px; height:44px; border-radius:50%; display:grid; place-items:center;
  font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:18px; color:var(--dim); background:var(--bg); border:1px solid rgba(255,255,255,.18);
  transition:background .4s, color .4s, border-color .4s; }
.fdp-row.is-seen .fdp-node{ background:var(--red); border-color:var(--red); color:#fff; }
.fdp-count{ font-family:'Barlow Condensed',sans-serif; font-weight:600; font-size:15px; letter-spacing:.06em; color:var(--dim); }
.fdp-count b{ color:var(--red2); font-weight:600; }
.fdp-text h3{ font-family:'Barlow Condensed','Arial Narrow',sans-serif; font-weight:700; text-transform:uppercase; font-size:clamp(44px,5.2vw,68px); line-height:.9; margin:10px 0 6px; }
.fdp-def{ font-size:17px; font-weight:500; margin-bottom:14px; }
.fdp-para{ color:var(--dim); font-size:15.5px; line-height:1.7; margin-bottom:20px; max-width:52ch; }
.fdp-list{ list-style:none; display:grid; gap:10px; margin-bottom:22px; }
.fdp-list li{ display:grid; grid-template-columns:18px 1fr; gap:10px; font-size:15px; line-height:1.5; }
.fdp-list li::before{ content:""; width:8px; height:8px; margin-top:7px; border:1.5px solid var(--red); transform:rotate(45deg); }
.fdp-meta{ display:flex; flex-wrap:wrap; gap:10px; }
.fdp-out, .fdp-gate{ display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; font-size:13px; line-height:1; }
.fdp-out{ border:1px solid rgba(255,255,255,.18); color:var(--dim); }
.fdp-out strong{ color:var(--text); font-weight:500; }
.fdp-gate{ border:1px solid var(--red); color:var(--red2); background:rgba(210,54,56,.14); }
.fdp-gate svg{ width:14px; height:14px; }
.fdp-media{ margin:0; aspect-ratio:4/3; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--panel); }
.fdp-media img{ width:100%; height:100%; object-fit:cover; }

.fdp.js .fdp-text, .fdp.js .fdp-media{ opacity:0; transform:translateY(32px); transition:opacity .7s ease, transform .7s ease; }
.fdp.js .fdp-media{ transition-delay:.12s; }
.fdp.js .fdp-row.is-seen .fdp-text, .fdp.js .fdp-row.is-seen .fdp-media{ opacity:1; transform:none; }

/* Gallery heading */
.fd-gallery h2{ font-size:clamp(36px,4.6vw,60px); line-height:1; margin:10px 0 28px; }

@media (max-width:1000px){
  .fd-why-top, .fdp-intro{ grid-template-columns:1fr; gap:18px; }
  .fd-why-cards{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .fdp-row{ grid-template-columns:44px minmax(0,1fr); gap:18px 20px; align-items:start; }
  .fdp-node{ margin-top:0; grid-row:1; }
  .fdp-media{ grid-column:2; order:-1; }
  .fdp-text{ grid-column:2; }
  .fdp-text h3{ font-size:clamp(34px,10vw,52px); }
}
@media (max-width:700px){
  .fd-why{ padding-top:72px; }
  .fdp{ padding-top:80px; }
}
@media (prefers-reduced-motion:reduce){
  .fdp.js .fdp-text, .fdp.js .fdp-media{ opacity:1; transform:none; }
}