:root{
  --bg:#f7f4ef;
  --paper:#fffdf8;
  --ink:#111111;
  --muted:#5c5c5c;
  --line:rgba(17,17,17,.12);
  --accent:#b68b2e;
  --shadow: 0 10px 30px rgba(17,17,17,.08);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background: radial-gradient(1200px 500px at 25% 0%, rgba(182,139,46,.12), transparent 55%),
              radial-gradient(900px 400px at 85% 10%, rgba(15,61,46,.10), transparent 60%),
              var(--bg);
  line-height:1.55;
}

.skip{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip:focus{
  left:16px; top:16px; width:auto; height:auto; padding:10px 12px; z-index:1000;
  background:var(--paper); border:1px solid var(--line); border-radius:10px;
}

.container{max-width:1040px; margin:0 auto; padding:28px 22px;}

.site-header{
  border-bottom:1px solid var(--line);
  background: linear-gradient(to bottom, rgba(255,253,248,.9), rgba(255,253,248,.55));
  backdrop-filter: blur(6px);
}

.topline{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 0 20px;}

.brand{display:flex; align-items:center; gap:10px; font-weight:600; letter-spacing:.2px;}
.mark{width:10px; height:10px; background:var(--accent); display:inline-block; border-radius:2px; box-shadow:0 0 0 6px rgba(182,139,46,.12)}

.nav{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.nav a{
  color:var(--ink); text-decoration:none; font-size:14px; padding:8px 10px; border-radius:10px;
}
.nav a:hover{background:rgba(17,17,17,.06)}
.nav .cta{border:1px solid var(--line); background:rgba(255,253,248,.6)}

.hero{padding:22px 0 34px;}
.kicker{margin:0 0 10px; color:var(--muted); font-size:14px; letter-spacing:.12em; text-transform:uppercase;}

h1{
  margin:0 0 12px;
  font-family: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Garamond, Georgia, serif;
  font-weight:650;
  letter-spacing:-.02em;
  line-height:1.06;
  font-size: clamp(36px, 5vw, 56px);
}

.lede{max-width:70ch; font-size:18px; color:#1b1b1b;}

.hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin:18px 0 10px;}
.button{display:inline-block; text-decoration:none; padding:11px 14px; border-radius:12px; font-weight:600;}
.button.primary{background:var(--ink); color:var(--paper); box-shadow:var(--shadow)}
.button.primary:hover{transform:translateY(-1px)}
.button.ghost{border:1px solid var(--line); color:var(--ink); background:rgba(255,253,248,.55)}
.button.ghost:hover{background:rgba(17,17,17,.06)}

.trust{margin:10px 0 0; color:var(--muted); font-size:14px;}

.site-main{padding:30px 0 80px;}

.card{
  background:rgba(255,253,248,.72);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:22px;
  box-shadow: 0 1px 0 rgba(17,17,17,.02);
  margin:0 0 18px;
}

h2{
  margin:0 0 10px;
  font-family: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Garamond, Georgia, serif;
  letter-spacing:-.01em;
  font-size:26px;
}

h3{margin:0 0 8px; font-size:16px;}

.muted{color:var(--muted)}
.note{margin-top:14px; padding-top:12px; border-top:1px dashed var(--line); color:var(--muted)}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px;}
@media (max-width:860px){.grid-2{grid-template-columns:1fr}}

.mini{padding:14px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.35)}

.offers{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:14px;}
@media (max-width:980px){.offers{grid-template-columns:1fr}}

.offer{padding:14px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.35)}
.offer ul{margin:10px 0 0; padding-left:18px}

.principles{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px;}
.pill{border:1px solid var(--line); background:rgba(255,255,255,.35); padding:8px 10px; border-radius:999px; font-size:14px}

.steps{margin:10px 0 0; padding-left:20px}
.steps li{margin:8px 0}

.contact{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px;}
@media (max-width:860px){.contact{grid-template-columns:1fr}}
.contact-box{padding:14px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.35)}

a{color:inherit}

.site-footer{padding:4px 4px 0; color:var(--muted); font-size:14px}