:root{--paper:#f6f3ee;--ink:#1f1d24;--soft:#6b6570;--accent:#e76f51;--line:#e3ddd3}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 Georgia,"Times New Roman",serif}
a{color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:3px}
a:hover{color:var(--accent)}
.top{display:flex;justify-content:space-between;align-items:center;padding:22px clamp(16px,5vw,64px);border-bottom:1px solid var(--line)}
.mark{font:600 20px/1 "Segoe UI",system-ui,sans-serif;letter-spacing:.02em;text-decoration:none}
.mark span{color:var(--accent)}
.top nav a{margin-left:22px;font:15px "Segoe UI",system-ui,sans-serif;text-decoration:none}
.top nav a[aria-current]{border-bottom:2px solid var(--accent)}
.reel{position:relative;background:#111;aspect-ratio:16/9;max-height:78vh;width:100%;overflow:hidden}
.reel video{width:100%;height:100%;object-fit:cover;display:block;opacity:.92}
.reel-text{position:absolute;left:clamp(16px,5vw,64px);bottom:clamp(16px,6vw,64px);color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.reel-text h1{margin:0;font-weight:400;font-size:clamp(26px,4.4vw,56px);line-height:1.15}
.eyebrow{margin:0 0 10px;font:13px "Segoe UI",system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.intro{max-width:760px;margin:64px auto;padding:0 16px;font-size:21px}
.grid{padding:0 clamp(16px,5vw,64px) 40px}
.grid h2,.page h2{font-weight:400;font-size:28px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px}
.card{margin:0}
.card video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#ddd;display:block;cursor:pointer}
.card figcaption{padding-top:10px;font:15px/1.4 "Segoe UI",system-ui,sans-serif}
.card figcaption strong{display:block;font-size:17px}
.card figcaption span{color:var(--soft)}
.more{margin-top:28px;font-family:"Segoe UI",system-ui,sans-serif}
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;padding:56px clamp(16px,5vw,64px);border-top:1px solid var(--line);margin-top:40px}
.services h3{margin:0 0 8px;font-weight:400;font-size:22px;color:var(--accent)}
.page{padding:48px clamp(16px,5vw,64px);max-width:1180px;margin:0 auto}
.page.narrow{max-width:760px}
.page h1{font-weight:400;font-size:clamp(34px,5vw,52px);margin:0 0 12px}
.lead{font-size:20px;color:var(--soft)}
.project{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:start;padding:32px 0;border-top:1px solid var(--line)}
.project video{width:100%;aspect-ratio:16/9;background:#ddd;display:block}
.project h2{margin:0 0 6px}
.meta{font:14px "Segoe UI",system-ui,sans-serif;color:var(--soft)}
.steps li{margin-bottom:10px}
.big{font-size:24px}
.foot{padding:40px clamp(16px,5vw,64px);border-top:1px solid var(--line);font:15px "Segoe UI",system-ui,sans-serif;color:var(--soft)}
.foot p{margin:4px 0}
.small{font-size:13px}
@media (max-width:720px){.project{grid-template-columns:1fr}.top nav a{margin-left:14px}.intro{font-size:18px;margin:40px auto}}