
:root{
  --ink:#2f2e2b;
  --muted:#706b62;
  --gold:#b59a55;
  --line:#ded6c8;
  --cream:#f7f3eb;
  --paper:#fffdf8;
  --sage:#6f765d;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:linear-gradient(180deg,#f8f5ee 0%,#fffdf8 55%,#f4efe6 100%);
}
a{color:inherit;text-decoration:none}
.container{width:min(1120px,calc(100% - 40px));margin:auto}
header{
  position:sticky;top:0;z-index:20;
  background:rgba(248,245,238,.94);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(181,154,85,.18)
}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:86px;gap:30px}
.logo{width:290px;max-width:48vw}
nav{display:flex;gap:28px;align-items:center;font-family:Georgia,serif;font-size:17px}
nav a{padding:30px 0 24px;border-bottom:2px solid transparent}
nav a:hover,nav a.active{border-color:var(--gold)}
.hero{
  position:relative;overflow:hidden;min-height:660px;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 72% 22%,rgba(181,154,85,.14),transparent 27%),
    radial-gradient(circle at 84% 68%,rgba(111,118,93,.12),transparent 30%),
    linear-gradient(135deg,#fffdf8 0%,#f5f0e7 55%,#ece6d9 100%);
}
.hero:before,.hero:after{
  content:"";position:absolute;border:1px solid rgba(181,154,85,.27);border-radius:50%;
  width:540px;height:540px;right:-160px;top:-180px;transform:rotate(18deg)
}
.hero:after{width:370px;height:370px;right:-65px;top:110px;border-color:rgba(111,118,93,.18)}
.hero-inner{position:relative;z-index:2;text-align:center;padding:70px 0 90px}
.hero-mark{width:min(560px,90%);margin:0 auto 28px}
.eyebrow{text-transform:uppercase;letter-spacing:5px;color:var(--gold);font-size:13px;margin-bottom:22px}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400}
h1{font-size:clamp(40px,6vw,72px);line-height:1.06;margin:0 auto 24px;max-width:900px}
.lead{font-size:21px;line-height:1.7;color:#4e4a43;max-width:760px;margin:0 auto 36px}
.cta-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;padding:14px 22px;border:1px solid var(--gold);letter-spacing:.04em}
.btn.primary{background:var(--gold);color:white}
.btn:hover{transform:translateY(-1px)}
.section{padding:92px 0}
.section.alt{background:rgba(255,255,255,.58);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-title{text-align:center;max-width:760px;margin:0 auto 52px}
.section-title h2{font-size:44px;margin:0 0 14px}
.section-title p{color:var(--muted);line-height:1.7}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{
  background:rgba(255,253,248,.82);border:1px solid var(--line);padding:34px 28px;
  min-height:250px;box-shadow:0 18px 50px rgba(62,54,40,.05)
}
.card h3{font-size:25px;margin:16px 0 10px}
.card p{line-height:1.65;color:var(--muted)}
.icon{font-size:34px;color:var(--gold)}
.two{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:start}
.copy h2{font-size:48px;margin:0 0 22px}
.copy p{font-size:18px;line-height:1.8;color:#514d46}
.quote{
  border-left:2px solid var(--gold);padding:8px 0 8px 26px;
  font-family:Georgia,serif;font-size:30px;line-height:1.4;color:#4a463f
}
.details{
  background:#f0eadf;border:1px solid #ddd3c4;padding:30px
}
.details dt{font-size:12px;text-transform:uppercase;letter-spacing:2px;color:var(--gold);margin-top:18px}
.details dd{margin:6px 0 0;line-height:1.6}
footer{background:#2f2e2b;color:#e9e2d6;padding:45px 0}
.footer-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:30px}
footer small,footer p{color:#c9c0b1;line-height:1.7}
.footer-links{display:flex;gap:18px;flex-wrap:wrap}
.page-hero{padding:95px 0 64px;text-align:center}
.page-hero h1{font-size:58px}
.prose{max-width:820px;margin:0 auto}
.prose h2{font-size:34px;margin-top:44px}
.prose p,.prose li{line-height:1.8;color:#4e4a43}
.notice{background:#f3eee5;border-left:3px solid var(--gold);padding:22px 24px;margin:28px 0}
@media(max-width:900px){
  .nav{align-items:flex-start;padding:16px 0;flex-direction:column}
  .logo{width:250px;max-width:90vw}
  nav{gap:16px;flex-wrap:wrap;font-size:15px}
  nav a{padding:5px 0 10px}
  .grid{grid-template-columns:1fr 1fr}
  .two{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .container{width:min(100% - 28px,1120px)}
  .grid{grid-template-columns:1fr}
  h1{font-size:42px}
  .section{padding:66px 0}
  .section-title h2,.copy h2{font-size:37px}
}
