@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');

:root { --ink:#17201d; --muted:#66706c; --paper:#f7f5f0; --line:#d9d7cf; --dark:#18201e; --accent:#b58a52; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.nav { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 6vw; border-bottom:1px solid var(--line); background:rgba(247,245,240,.96); position:sticky; top:0; z-index:10; backdrop-filter:blur(8px); }
.brand { font-size:15px; font-weight:700; letter-spacing:.18em; }
.brand span { font-weight:500; opacity:.55; margin-left:8px; letter-spacing:.12em; }
nav { display:flex; gap:30px; align-items:center; font-size:13px; font-weight:600; }
nav a { opacity:.78; } nav a:hover { opacity:1; }
.nav-cta { border:1px solid var(--ink); padding:10px 16px; opacity:1!important; }
.hero { min-height:78vh; display:flex; flex-direction:column; justify-content:center; padding:9vw 12vw 8vw; max-width:1250px; }
.eyebrow,.section-label { font-size:11px; font-weight:700; letter-spacing:.2em; color:var(--accent); margin-bottom:22px; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(58px,8vw,108px); line-height:.98; letter-spacing:-.055em; font-weight:600; margin-bottom:30px; }
h1 em,h2 em { font-family:"Playfair Display",serif; font-weight:500; }
.hero-copy { max-width:670px; font-size:19px; color:var(--muted); }
.hero-actions { display:flex; gap:14px; margin-top:25px; flex-wrap:wrap; }
.button { display:inline-block; padding:14px 22px; font-weight:700; font-size:13px; letter-spacing:.02em; }
.primary { background:var(--ink); color:white; }
.secondary { border:1px solid var(--ink); }
.statement { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:44px 12vw; font-family:"Playfair Display",serif; font-size:clamp(24px,3vw,39px); line-height:1.25; max-width:100%; }
.statement p { max-width:1000px; margin:0; }
.section { padding:110px 10vw; }
h2 { font-size:clamp(38px,5vw,66px); line-height:1.04; letter-spacing:-.04em; font-weight:600; max-width:850px; }
.cards { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:65px; }
.card { background:var(--paper); padding:42px; min-height:270px; }
.number { font-size:11px; color:var(--accent); font-weight:700; letter-spacing:.16em; margin-bottom:38px; }
.card h3 { font-size:23px; margin-bottom:12px; }
.card p { color:var(--muted); max-width:450px; }
.dark-section { background:var(--dark); color:#f4f2eb; padding:110px 10vw; }
.dark-section .section-label { color:#c7a878; }
.approach-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:10vw; }
.approach-grid h2 { margin:0; }
.approach-copy { color:#c5cbc7; font-size:17px; }
.approach-copy .accent-line { color:#f4f2eb; font-family:"Playfair Display",serif; font-size:23px; border-left:2px solid var(--accent); padding-left:20px; margin-top:35px; }
.about { display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.about h2 { margin-top:0; }
.about p { color:var(--muted); }
.about .large { color:var(--ink); font-family:"Playfair Display",serif; font-size:27px; line-height:1.35; }
.contact { background:#b58a52; color:#fff; padding:105px 10vw; }
.contact .section-label { color:#fff; opacity:.75; }
.contact h2 { max-width:800px; margin-bottom:20px; }
.contact p { max-width:650px; font-size:18px; opacity:.9; }
.light { background:#fff; color:var(--ink); margin-top:15px; }
.domain { margin-top:55px; font-size:12px; letter-spacing:.14em; opacity:.75; }
footer { display:flex; justify-content:space-between; gap:20px; padding:25px 6vw; font-size:11px; letter-spacing:.08em; color:var(--muted); border-top:1px solid var(--line); }
@media(max-width:760px) {
  .nav { padding:0 5vw; height:70px; } nav a:not(.nav-cta) { display:none; }
  .brand { font-size:12px; }
  .hero { padding:80px 8vw; min-height:75vh; }
  h1 { font-size:57px; }
  .section,.dark-section,.contact { padding:75px 8vw; }
  .statement { padding:38px 8vw; }
  .cards,.approach-grid,.about { grid-template-columns:1fr; }
  .card { min-height:auto; }
  .approach-grid { gap:35px; }
  footer { flex-direction:column; padding:25px 8vw; }
}