*{box-sizing:border-box}
:root{color:#2d2018;background:#fbf4e8;font:16px/1.55 "Segoe UI",system-ui,sans-serif;scroll-behavior:smooth}
body{margin:0}
a{color:#693820;text-underline-offset:.24em}
a:focus-visible{outline:3px solid #26685d;outline-offset:4px}
.frame{width:min(1100px,calc(100% - 2.5rem));margin-inline:auto}
.skip{position:absolute;top:-4rem;left:1rem;background:#fff;padding:.75rem;z-index:1}
.skip:focus{top:.7rem}
.masthead{min-height:5.2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid #d5c5b3}
.masthead>a{font-weight:650}
.imprint{display:flex;align-items:center;gap:.65rem;color:inherit;text-decoration:none}
.imprint img{display:block;object-fit:contain;border-radius:50%}
.feature{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(1.5rem,6vw,4.5rem);padding-block:clamp(2.2rem,6vw,5rem)}
.author{color:#6e4a31;margin:0;font-size:.95rem;font-weight:650}
h1,h2,h3{font-family:Georgia,serif;line-height:1.08;font-weight:500}
h1{font-size:clamp(3.1rem,7vw,6.2rem);letter-spacing:-.05em;margin:.18em 0 .22em}
.lead{font-size:1.15rem;max-width:36ch}
.cover{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:.45rem}
.button{display:inline-block;margin-top:.75rem;background:#38261d;color:#fff;padding:.75rem 1.05rem;border-radius:.32rem;text-decoration:none;font-weight:700}
.button:hover{background:#573726}
.films{border-top:1px solid #d5c5b3;padding:2rem 0 3rem}
h2{margin:.15em 0 1.15rem;font-size:2.15rem}
.film-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
article{padding:1.2rem;background:#fffaf1;border-bottom:2px solid #b07545}
h3{margin:.15em 0 .45em;font-size:1.37rem}
article p{margin:.5rem 0 1rem}
article a{font-weight:650}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem;border-top:1px solid #d5c5b3;padding-block:1.1rem 1.6rem;overflow-wrap:anywhere}
@media(max-width:700px){.feature,.film-list{grid-template-columns:1fr}.cover{max-width:32rem}}
@media(max-width:410px){.masthead{align-items:flex-start;flex-direction:column;justify-content:center;gap:.45rem;padding-block:.7rem}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}}