:root{
  --paper:#f7f4ee; --ink:#15120d; --muted:#6a6157; --line:#e3dccf;
  --accent:#7a5c3e; --accent-soft:rgba(122,92,62,.10); --maxw:1160px; --measure:68ch;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; color:var(--ink);
  background:
    radial-gradient(1200px 600px at 82% -12%, var(--accent-soft), transparent 60%),
    var(--paper);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:19px; line-height:1.65; font-weight:400; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{font-family:"Fraunces","Iowan Old Style",Palatino,Georgia,serif; font-weight:500; letter-spacing:-.012em; line-height:1.06; color:var(--ink)}
h1{font-size:clamp(2.7rem,6.2vw,5rem); margin:.08em 0 .3em; font-weight:560}
h2{font-size:clamp(1.75rem,3.2vw,2.6rem); margin:2.5em 0 .5em}
h3{font-size:1.4rem; margin:1.9em 0 .35em}
p,li{max-width:var(--measure)}
a{color:var(--accent); text-decoration:none; text-underline-offset:3px; border-bottom:1px solid rgba(122,92,62,.30); transition:border-color .15s,color .15s}
a:hover{border-bottom-color:var(--accent)}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,52px)}
.kicker{font-family:"Inter",sans-serif; font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin:0 0 .5em; display:flex; align-items:center; gap:.7em}
.kicker::after{content:""; height:1px; width:34px; background:var(--accent); opacity:.5}
/* header */
header.site{border-top:3px solid var(--accent); border-bottom:1px solid var(--line); position:sticky; top:0; background:rgba(247,244,238,.9); backdrop-filter:saturate(1.5) blur(10px); z-index:20}
.nav{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.05rem 0}
.brand{font-family:"Fraunces",serif; font-weight:600; font-size:1.3rem; letter-spacing:-.01em; border:0; color:var(--ink)}
.brand span{color:var(--accent)}
.nav nav{display:flex; gap:1.5rem; flex-wrap:wrap}
.nav nav a{font-size:.82rem; letter-spacing:.08em; color:var(--muted); border:0; text-transform:uppercase; font-weight:600}
.nav nav a:hover{color:var(--accent)}
/* hero */
.hero{padding:clamp(3.4rem,9vw,7rem) 0 clamp(2.2rem,5vw,3.8rem); border-bottom:1px solid var(--line)}
.hero h1{max-width:16ch}
.hero p.standfirst{font-size:clamp(1.18rem,2vw,1.5rem); line-height:1.45; color:var(--muted); max-width:58ch; margin:.7em 0 0; font-weight:400}
/* sections */
section{padding:clamp(1.5rem,3vw,2.4rem) 0}
.lede{font-size:1.28rem; line-height:1.55}
.rule{height:1px; background:var(--line); border:0; margin:0}
.cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:clamp(1.4rem,3.5vw,2.8rem); margin:1.8rem 0}
.cols>*{padding-left:1.1rem; border-left:2px solid var(--accent)}
.cols h3{margin-top:0}
.cols p{font-size:1rem; color:var(--muted)}
ul.clean{list-style:none; padding:0; margin:1.2rem 0}
ul.clean li{padding:.7rem 0; border-bottom:1px solid var(--line); max-width:none}
ul.clean li a{border:0; font-weight:500}
.cta{display:inline-block; margin-top:1.3rem; font-weight:600; border:1px solid var(--accent); border-radius:3px; padding:.72rem 1.5rem; color:var(--accent); letter-spacing:.01em}
.cta:hover{background:var(--accent); color:#fff}
form.enq{margin:1.3rem 0; display:flex; gap:.6rem; flex-wrap:wrap; max-width:540px}
form.enq input{flex:1 1 220px; padding:.8rem .95rem; border:1px solid var(--line); border-radius:3px; font:inherit; background:#fff}
form.enq button{padding:.8rem 1.4rem; border:0; background:var(--ink); color:var(--paper); border-radius:3px; font:inherit; font-weight:600; cursor:pointer}
/* article readability */
article{max-width:var(--measure)}
article p, article li{margin-bottom:.95rem}
article h2{border-top:1px solid var(--line); padding-top:1.4rem}
blockquote{margin:1.6rem 0; padding:.4rem 0 .4rem 1.4rem; border-left:3px solid var(--accent); font-family:"Fraunces",serif; font-size:1.25rem; color:var(--ink)}
/* footer */
footer.site{border-top:3px solid var(--accent); margin-top:4.5rem; padding:3.2rem 0 2.4rem; color:var(--muted); font-size:.92rem; background:#fbfaf6}
footer.site .cols{margin:0}
footer.site .cols>*{border-left:0; padding-left:0}
footer.site a{color:var(--muted); border-bottom-color:transparent}
footer.site a:hover{color:var(--accent)}
footer.site h4{font-family:"Inter",sans-serif; font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; color:var(--ink); margin:0 0 .8em}
.fine{font-size:.8rem; margin-top:2.2rem; color:var(--muted); border-top:1px solid var(--line); padding-top:1.4rem}
.meta{font-size:.82rem; color:var(--muted); letter-spacing:.02em}
@media(max-width:640px){ body{font-size:17px} .nav{flex-wrap:wrap; gap:.6rem} .nav nav{gap:1rem} .cols>*{border-left:0; padding-left:0} }
