:root {
  --ink: #14231e;
  --deep: #10241d;
  --paper: #f5f1e8;
  --cream: #ece5d8;
  --gold: #b89457;
  --muted: #667069;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }

.site-header { height: 96px; padding: 0 5.5vw; display: flex; align-items: center; justify-content: space-between; background: #f9f7f1; border-bottom: 1px solid #dcd6c9; position: relative; z-index: 10; }
.brand { display: flex; align-items: center; gap: 15px; }
.brand-mark { font-family: Georgia, serif; font-size: 24px; letter-spacing: 2px; color: var(--gold); }
.brand-copy { display: flex; flex-direction: column; gap: 4px; padding-left: 15px; border-left: 1px solid #ccc4b5; }
.brand-copy strong { font-family: Georgia, serif; font-size: 17px; font-weight: normal; }
.brand-copy small { color: var(--muted); text-transform: uppercase; letter-spacing: 1.3px; font-size: 8px; }
nav { display: flex; gap: 30px; font-size: 12px; text-transform: uppercase; letter-spacing: 1.4px; }
nav a { padding: 12px 0; border-bottom: 1px solid transparent; }
nav a:hover { border-color: var(--gold); }
.header-cta { color: white; background: var(--ink); padding: 15px 22px; font-size: 11px; text-transform: uppercase; letter-spacing: 1.4px; }

.hero { min-height: calc(100vh - 96px); position: relative; display: flex; align-items: center; overflow: hidden; color: white; }
.hero > img { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(9,19,16,.92) 0%, rgba(10,22,18,.73) 48%, rgba(10,18,15,.15) 100%); }
.hero-content { position: relative; max-width: 760px; margin-left: 10vw; padding: 80px 0 120px; }
.eyebrow { color: #d1b57f; font-size: 11px; text-transform: uppercase; letter-spacing: 3px; margin: 0 0 26px; }
h1, h2 { font-family: Georgia, 'Times New Roman', serif; font-weight: normal; }
h1 { font-size: clamp(54px, 6.8vw, 96px); line-height: .99; letter-spacing: -3px; margin: 0; }
h1 em, h2 em { color: #d1b57f; font-weight: normal; }
.hero-text { max-width: 560px; font-family: Georgia, serif; font-size: 20px; line-height: 1.65; color: #e1e4de; margin: 34px 0; }
.hero-actions { display: flex; align-items: center; gap: 30px; }
.button { display: inline-block; padding: 18px 25px; font-size: 11px; text-transform: uppercase; letter-spacing: 1.7px; }
.button-light { background: var(--paper); color: var(--ink); }
.text-link { font-size: 11px; text-transform: uppercase; letter-spacing: 1.4px; }
.text-link span { color: #d1b57f; font-size: 17px; margin-left: 8px; }
.hero-note { position: absolute; bottom: 38px; right: 5.5vw; font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; color: #d8d9d4; }
.hero-note span { display: inline-block; width: 28px; height: 1px; background: var(--gold); margin: 0 10px 3px; }

.intro { padding: 120px 9vw; display: grid; grid-template-columns: .55fr 1.25fr 1fr; gap: 6vw; }
.section-label { font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: var(--muted); }
.section-label span { color: var(--gold); margin-right: 12px; }
.intro-heading p { color: var(--gold); font-family: Georgia, serif; font-style: italic; margin: 0 0 10px; }
.intro h2, .approach h2 { font-size: clamp(40px, 4.3vw, 64px); line-height: 1.1; margin: 0; letter-spacing: -1.7px; }
.intro-copy > p { color: #4f5a54; line-height: 1.8; font-size: 15px; margin: 0 0 20px; }
.credential { margin-top: 42px; padding-top: 25px; border-top: 1px solid #d8d1c3; display: flex; align-items: baseline; gap: 15px; }
.credential strong { font-family: Georgia, serif; color: var(--gold); font-size: 35px; font-weight: normal; }
.credential span { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }

.quote-band { min-height: 430px; padding: 75px 9vw; display: flex; align-items: center; justify-content: center; gap: clamp(45px, 7vw, 105px); background: var(--cream); }
.quote-portrait { width: clamp(210px, 19vw, 270px); flex: 0 0 auto; }
.quote-portrait img { width: 100%; aspect-ratio: .89; object-fit: cover; object-position: center top; filter: saturate(.82); box-shadow: 0 20px 45px rgba(20,35,30,.14); }
blockquote { max-width: 760px; margin: 0; padding: 0; display: flex; flex-direction: column; justify-content: center; font-family: Georgia, serif; font-size: clamp(27px, 3vw, 44px); line-height: 1.35; }
blockquote cite { margin-top: 38px; font-family: Arial, sans-serif; font-style: normal; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 2px; }

.practice { background: var(--deep); color: #eef0eb; padding: 110px 9vw 120px; }
.section-label.light { color: #a8b1ac; }
.practice-top { display: grid; grid-template-columns: 1.35fr .65fr; gap: 8vw; align-items: end; margin: 45px 0 80px; }
.practice h2 { font-size: clamp(44px, 5.4vw, 75px); line-height: 1.05; margin: 0; letter-spacing: -2px; }
.practice-top p { color: #b8c0bc; line-height: 1.8; }
.practice-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #405048; border-left: 1px solid #405048; }
.practice-grid article { min-height: 260px; padding: 34px; border-right: 1px solid #405048; border-bottom: 1px solid #405048; transition: background .25s; }
.practice-grid article:hover { background: #193229; }
.practice-grid article > span { color: var(--gold); font-size: 10px; letter-spacing: 1px; }
.practice-grid h3 { font-family: Georgia, serif; font-size: 25px; font-weight: normal; margin: 42px 0 17px; }
.practice-grid p { color: #aeb8b3; font-size: 13px; line-height: 1.7; }

.approach { display: grid; grid-template-columns: 1fr 1fr; background: #f8f5ee; }
.articles-panel { min-height: 760px; padding: 90px 6.5vw; background: var(--cream); }
.articles-panel h2 { margin: 38px 0 22px; font-size: clamp(38px, 3.8vw, 58px); }
.articles-intro { margin: 0 0 38px; max-width: 570px; color: var(--muted); line-height: 1.75; }
.article-list { border-top: 1px solid #cfc5b4; }
.article-card { display: block; padding: 26px 0 24px; border-bottom: 1px solid #cfc5b4; transition: padding .2s, color .2s; }
.article-card:hover { padding-left: 12px; color: #6f552d; }
.article-card > span { color: var(--gold); font-size: 9px; text-transform: uppercase; letter-spacing: 1.7px; }
.article-card h3 { margin: 9px 0; font: normal 22px/1.25 Georgia, serif; }
.article-card p { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.65; }
.article-card strong { font-size: 9px; font-weight: normal; text-transform: uppercase; letter-spacing: 1.5px; }
.approach-copy { padding: 100px 8vw; }
.approach-copy h2 { margin: 38px 0 28px; }
.approach-copy > p { line-height: 1.8; color: var(--muted); }
.approach ol { list-style: none; padding: 0; margin: 45px 0 0; border-top: 1px solid #d9d2c4; }
.approach li { display: flex; gap: 22px; padding: 23px 0; border-bottom: 1px solid #d9d2c4; }
.approach li > span { color: var(--gold); font-family: Georgia, serif; }
.approach li div { display: flex; flex-direction: column; gap: 7px; }
.approach li strong { font-family: Georgia, serif; font-size: 18px; font-weight: normal; }
.approach li small { color: var(--muted); line-height: 1.5; }

.contact { background: #172a23; color: white; padding: 110px 9vw; text-align: center; }
.contact h2 { font-size: clamp(46px, 5.8vw, 78px); line-height: 1.08; margin: 0 auto 70px; }
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #42534c; border-bottom: 1px solid #42534c; margin-bottom: 48px; text-align: left; }
.contact-grid > div { padding: 35px; border-right: 1px solid #42534c; display: flex; flex-direction: column; gap: 9px; }
.contact-grid > div:last-child { border-right: 0; }
.contact-grid span { color: #bca16f; font-size: 9px; text-transform: uppercase; letter-spacing: 1.7px; margin-bottom: 7px; }
.contact-grid a, .contact-grid address { font-family: Georgia, serif; font-size: 16px; line-height: 1.6; font-style: normal; }
.button-gold { background: var(--gold); color: white; }

footer { min-height: 130px; padding: 35px 5.5vw; display: flex; align-items: center; gap: 32px; background: #0d1915; color: #89938e; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; }
footer p:nth-last-child(1) { margin-left: auto; }

.article-main { background: #f8f5ee; }
.article-hero { padding: 105px 9vw 80px; background: var(--deep); color: white; }
.article-hero .article-kicker { margin: 0 0 25px; color: #d1b57f; font-size: 10px; text-transform: uppercase; letter-spacing: 2.3px; }
.article-hero h1 { max-width: 1000px; font-size: clamp(43px, 5.5vw, 76px); line-height: 1.07; letter-spacing: -2px; }
.article-hero .article-deck { max-width: 760px; margin: 30px 0 0; color: #c7cfcb; font: 19px/1.65 Georgia, serif; }
.article-body { max-width: 900px; margin: 0 auto; padding: 85px 30px 100px; }
.article-meta { margin: 0 0 45px; padding-bottom: 24px; border-bottom: 1px solid #d9d2c4; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; }
.article-body h2 { margin: 54px 0 18px; font-size: clamp(30px, 3vw, 42px); line-height: 1.2; letter-spacing: -.7px; }
.article-body h3 { margin: 36px 0 12px; font: normal 24px/1.3 Georgia, serif; }
.article-body p, .article-body li { color: #46534d; font-size: 16px; line-height: 1.85; }
.article-body ul { padding-left: 22px; }
.article-body li { margin: 7px 0; }
.article-note { margin: 55px 0 0; padding: 28px 30px; border-left: 3px solid var(--gold); background: var(--cream); }
.article-note strong { display: block; margin-bottom: 8px; font-family: Georgia, serif; font-size: 20px; font-weight: normal; }
.article-references { margin-top: 55px; padding-top: 28px; border-top: 1px solid #d9d2c4; }
.article-references h2 { margin-top: 0; font-size: 25px; }
.article-references a { border-bottom: 1px solid var(--gold); }
.article-back { display: inline-block; margin-bottom: 35px; color: var(--gold); font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; }
.article-cta { padding: 70px 9vw; background: var(--cream); text-align: center; }
.article-cta h2 { margin: 0 auto 28px; max-width: 760px; font-size: clamp(34px, 4vw, 55px); }
.article-cta p { margin: 0 auto 30px; max-width: 680px; color: var(--muted); line-height: 1.7; }

@media (max-width: 1050px) {
  nav { gap: 18px; font-size: 10px; }
}

@media (max-width: 900px) {
  .site-header { height: 82px; padding: 0 22px; }
  .brand-copy, nav { display: none; }
  .hero { min-height: calc(100vh - 82px); }
  .hero-content { margin: 0; padding: 90px 25px 125px; }
  h1 { letter-spacing: -2px; }
  .hero-text { font-size: 17px; }
  .intro { padding: 80px 25px; grid-template-columns: 1fr; gap: 30px; }
  .quote-band { min-height: auto; padding: 70px 25px; flex-direction: column; gap: 42px; }
  .quote-portrait { width: 190px; }
  blockquote { max-width: 620px; padding: 0; text-align: center; }
  blockquote cite { margin-top: 28px; }
  .approach { grid-template-columns: 1fr; }
  .practice { padding: 80px 25px; }
  .practice-top { grid-template-columns: 1fr; gap: 20px; }
  .practice-grid { grid-template-columns: 1fr; }
  .practice-grid article { min-height: auto; }
  .articles-panel { min-height: auto; padding: 75px 25px; }
  .approach-copy { padding: 70px 25px; }
  .contact { padding: 80px 25px; }
  .contact-grid { grid-template-columns: 1fr; }
  .contact-grid > div { border-right: 0; border-bottom: 1px solid #42534c; padding: 25px 0; text-align: center; }
  .contact-grid > div:last-child { border-bottom: 0; }
  footer { flex-direction: column; text-align: center; gap: 10px; }
  footer p { margin: 0; }
  footer p:nth-last-child(1) { margin-left: 0; }
  .article-hero { padding: 80px 25px 65px; }
  .article-body { padding: 65px 25px 80px; }
  .article-cta { padding: 65px 25px; }
}

@media (max-width: 520px) {
  .header-cta { padding: 13px 15px; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; }
  .hero-note { left: 25px; right: auto; }
  .article-card h3 { font-size: 20px; }
  .article-note { padding: 24px 22px; }
}