:root {
  --ink:#1d211f; --muted:#5c625e; --bg:#f7f4ef;
  --accent:#2f5d50; --accent-dark:#21443a; --line:#e4ded4;
  --serif:"Fraunces", Georgia, serif;
  --sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:var(--sans); font-size:17px; line-height:1.6; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; }
img { display:block; width:100%; object-fit:cover; }
.wrap { max-width:1120px; margin:0 auto; padding:0 28px; }

/* Header */
header { padding:28px 0; display:flex; justify-content:space-between; align-items:center; }
.logo { font-family:var(--serif); font-size:24px; font-weight:500; font-variation-settings:"opsz" 72; letter-spacing:-0.01em; color:var(--ink); text-decoration:none; }
.logo em { color:var(--accent); font-style:italic; }
.nav-cta { font-size:14px; font-weight:500; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--ink); padding-bottom:2px; }

/* Hero */
.hero { padding:56px 0 48px; display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center; }
.hero h1 { font-family:var(--serif); font-weight:350; font-variation-settings:"opsz" 144; font-size:clamp(44px,6.4vw,80px); line-height:1.02; letter-spacing:-0.02em; }
.hero h1 em { font-style:italic; color:var(--accent); }
.hero p { font-size:19px; line-height:1.55; color:var(--muted); margin:24px 0 34px; max-width:470px; }
.btn { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; padding:15px 28px; border-radius:999px; font-size:15px; font-weight:500; transition:background .2s; }
.btn:hover { background:var(--accent-dark); }
.hero-img { border-radius:20px; overflow:hidden; aspect-ratio:4/5; }
.hero-img img { height:100%; }

/* Steps */
.steps { padding:96px 0; }
.steps h2, .contact h2 { font-family:var(--serif); font-weight:400; font-variation-settings:"opsz" 96; font-size:clamp(32px,4vw,46px); line-height:1.1; letter-spacing:-0.02em; max-width:560px; margin-bottom:48px; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.card img { aspect-ratio:4/3; border-radius:14px; margin-bottom:22px; }
.card .num { font-family:var(--serif); font-style:italic; font-size:18px; color:var(--accent); margin-bottom:6px; }
.card h3 { font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 36; font-size:23px; line-height:1.25; letter-spacing:-0.01em; margin-bottom:8px; }
.card p { font-size:16px; color:var(--muted); }

/* Contact */
.contact { background:var(--accent); color:#f4efe6; border-radius:24px; padding:72px 64px; margin-bottom:64px; display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:end; }
.contact h2 { margin-bottom:14px; color:#fff; }
.contact p { color:#cfdcd5; max-width:420px; }
.contact a { display:block; font-family:var(--serif); font-variation-settings:"opsz" 72; font-size:clamp(24px,2.6vw,32px); font-weight:400; color:#fff; text-decoration:none; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.25); }
.contact a:hover { color:#d8e8df; }

/* Footer */
footer { border-top:1px solid var(--line); padding:24px 0 40px; color:var(--muted); font-size:13px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
footer nav { display:flex; gap:22px; flex-wrap:wrap; }
footer a { color:var(--muted); text-decoration:none; }
footer a:hover { color:var(--ink); text-decoration:underline; }

/* Legal pages */
.legal { max-width:720px; padding:48px 0 88px; }
.legal h1 { font-family:var(--serif); font-weight:350; font-variation-settings:"opsz" 144; font-size:clamp(40px,5vw,60px); line-height:1.05; letter-spacing:-0.02em; margin-bottom:12px; }
.legal .updated { color:var(--muted); font-size:14px; margin-bottom:48px; }
.legal h2 { font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 36; font-size:22px; line-height:1.3; margin:40px 0 10px; }
.legal p, .legal li { color:#3b403d; font-size:16px; }
.legal p + p { margin-top:12px; }
.legal ul { padding-left:20px; margin-top:10px; }
.legal li + li { margin-top:6px; }
.legal a { color:var(--accent); }

@media (max-width:820px) {
  .hero { grid-template-columns:1fr; gap:36px; padding-top:24px; }
  .hero-img { aspect-ratio:4/3; }
  .grid { grid-template-columns:1fr; gap:44px; }
  .steps { padding:72px 0; }
  .contact { grid-template-columns:1fr; padding:48px 28px; }
}
