/* FilmHands static site */
:root { --ink:#202020; --muted:#666; --line:#d7d7d7; --paper:#fff; --panel:#f5f5f3; --accent:#7b1f1f; }
* { box-sizing:border-box; }
html { font-size:100%; scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#ecebe7; font-family:Arial, Helvetica, sans-serif; line-height:1.65; }
a { color:var(--accent); text-underline-offset:.15em; }
a:hover, a:focus { text-decoration-thickness:2px; }
img { max-width:100%; height:auto; }
.skip-link { position:absolute; left:-9999px; top:auto; }
.skip-link:focus { left:1rem; top:1rem; z-index:100; padding:.65rem 1rem; background:#fff; border:2px solid #111; }
.site-header { max-width:850px; margin:1.5rem auto 0; background:#fff; }
.site-header-image { display:block; line-height:0; }
.site-header-image img { display:block; width:100%; }
.main-navigation { max-width:850px; margin:0 auto; background:#222; }
.main-navigation ul { display:flex; flex-wrap:wrap; justify-content:center; gap:0; margin:0; padding:0; list-style:none; }
.main-navigation a { display:block; padding:.8rem 1.15rem; color:#fff; text-decoration:none; font-weight:700; }
.main-navigation a:hover, .main-navigation a:focus, .main-navigation a.active { background:var(--accent); }
main { max-width:850px; margin:0 auto; background:var(--paper); }
.page-section { padding:2.25rem 2.5rem; border-bottom:1px solid var(--line); }
.content { max-width:720px; margin:0 auto; }
h1, h2, h3 { line-height:1.2; margin-top:0; font-family:Georgia, 'Times New Roman', serif; }
h1 { font-size:2.2rem; margin-bottom:1rem; }
h2 { font-size:1.55rem; margin-top:2rem; }
h3 { font-size:1.15rem; }
p, ul, ol { margin-top:0; margin-bottom:1.1rem; }
.introduction { font-size:1.12rem; }
.service-grid, .post-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.service-card, .post-card { padding:1.2rem; border:1px solid var(--line); background:var(--panel); }
.service-card h3, .post-card h2 { margin-bottom:.55rem; }
.post-card h2 { font-size:1.25rem; }
.featured-production img, .post figure img { display:block; width:100%; }
.post figure { margin:1.5rem 0; }
.post figcaption { color:var(--muted); font-size:.9rem; margin-top:.45rem; }
.post-date { color:var(--muted); }
.post-navigation { margin-top:2rem; padding-top:1rem; border-top:1px solid var(--line); }
.timeline { list-style:none; margin:1.5rem 0; padding:0; }
.timeline li { padding:0 0 1.25rem 1.25rem; border-left:2px solid var(--line); }
.timeline li::before { content:''; display:inline-block; width:.65rem; height:.65rem; margin-left:-1.62rem; margin-right:.65rem; border-radius:50%; background:var(--accent); }
.site-footer { max-width:850px; margin:0 auto 1.5rem; padding:1rem; background:#222; color:#fff; text-align:center; font-size:.9rem; }
.site-footer p { margin:0; }
