
:root{--paper:#f4f2ec;--ink:#232821;--blue:#253c9e;--line:#d3d5cc}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit}header,main,footer{max-width:1440px;margin:auto}header{padding:30px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:24px;letter-spacing:-1px}.brand b{font-weight:400;color:var(--blue)}nav{display:flex;gap:28px;font-size:13px}nav a{text-decoration:none}.hero{display:grid;grid-template-columns:1fr 1fr;padding:64px 5% 76px;gap:7%;align-items:center}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:2.5px;color:var(--blue)}h1{font-family:Georgia,serif;font-size:clamp(48px,6.5vw,96px);font-weight:400;line-height:1.02;letter-spacing:-3px;margin:26px 0}h1 em{font-weight:400;color:var(--blue)}.intro{font-size:17px;line-height:1.7;max-width:400px}.cta{display:inline-block;margin-top:28px;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:9px;font-size:14px}.hero figure{margin:0}.hero img{display:block;width:100%;max-height:590px;object-fit:contain}.hero figcaption{margin-top:12px;font-size:11px;color:#63695f}.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:1px solid var(--line);padding-top:24px;margin-bottom:36px}.section-head h2{font-family:Georgia,serif;font-size:35px;font-weight:400;margin:0}.section-head span{font-size:12px;color:#656a61}.works{padding:0 5% 80px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:56px 32px}.work{margin:0}.work>a{display:block;background:#e7e7df}.work img{width:100%;height:460px;object-fit:contain;display:block}.work figcaption{padding-top:18px}.num{font-size:11px;color:var(--blue);letter-spacing:1px}.work h3{font-size:25px;font-family:Georgia,serif;font-weight:400;margin:10px 0}.work p{font-size:14px;line-height:1.65;margin:0;max-width:500px;color:#5b6257}.about{padding:55px 5% 64px;background:#e8eadf;display:grid;grid-template-columns:1fr 1fr;gap:7%}.about h2{font-family:Georgia,serif;font-size:42px;font-weight:400;margin:15px 0}.about p{font-size:17px;line-height:1.75;margin:0}.about a{font-size:14px}footer{padding:28px 5%;display:flex;justify-content:space-between;font-size:11px;color:#64695e;gap:20px}a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}@media(max-width:700px){header{padding:23px 6%}.brand{font-size:22px}nav{gap:17px}.hero{grid-template-columns:1fr;padding:45px 6%;gap:35px}h1{letter-spacing:-2px}.hero img{max-height:440px}.intro{font-size:16px}.works{padding:0 6% 45px}.grid{grid-template-columns:1fr;gap:35px}.work img{height:auto;max-height:500px}.section-head{align-items:start}.section-head span{max-width:100px;line-height:1.5}.about{grid-template-columns:1fr;padding:40px 6%;gap:20px}.about h2{font-size:35px}footer{padding:24px 6%;flex-direction:column;gap:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.guide{max-width:1000px;padding:54px 6% 80px}.guide h1{font-size:clamp(42px,7vw,76px);max-width:780px;letter-spacing:-2px}.lead{font-family:Georgia,serif;font-size:24px;line-height:1.5;max-width:740px}.article{max-width:730px}.article h2{font-family:Georgia,serif;font-size:29px;font-weight:400;line-height:1.3;margin-top:42px}.article p,.article li{font-size:17px;line-height:1.8}.article a,.reading a{color:var(--blue);text-underline-offset:4px}.reading{padding:24px;border:1px solid var(--line);margin:34px 0}.reading a{display:block;margin:13px 0;line-height:1.5}.guide figure{margin:35px 0}.guide img{width:100%;max-height:400px;object-fit:contain;background:#e7e7df}.guide figcaption{font-size:12px;margin-top:10px;color:#5b6257}.guide nav{flex-wrap:wrap}.guide-links{padding:45px 5%;border-top:1px solid var(--line)}.guide-links h2{font:32px Georgia,serif}.guide-links ul{display:flex;flex-wrap:wrap;gap:20px 32px;list-style:none;padding:0}.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;background:white;padding:12px;z-index:2}header nav{flex-wrap:wrap}@media(max-width:600px){header{align-items:flex-start;gap:20px}header nav{gap:12px;font-size:12px;max-width:160px}.lead{font-size:21px}}
