:root {
  color-scheme: light;
  --ink: #10243a;
  --ink-soft: #344658;
  --gold: #b99762;
  --cream: #f6f4ef;
  --paper: #fff;
  --line: #dedbd2;
  --muted: #687583;
  font-family: Georgia, "Times New Roman", serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); }
a { color: inherit; }
.draft-banner { padding: .7rem 1.25rem; background: #f4e8ce; color: #4c3b20; text-align: center; font: 600 .78rem/1.5 Arial, sans-serif; letter-spacing: .015em; }
.site-header { min-height: 90px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1rem clamp(1.25rem, 6vw, 6rem); border-bottom: 1px solid var(--line); }
.brand, .footer-brand { display: inline-flex; align-items: center; gap: .8rem; text-decoration: none; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--ink); font: 700 .85rem/1 Arial, sans-serif; letter-spacing: -.05em; }
.brand-mark span, .brand-name span, .hero-initials span { color: var(--gold); }
.brand-name { font: 600 .91rem/1.2 Arial, sans-serif; letter-spacing: .035em; }
.brand-name small { display: block; margin-top: .25rem; color: var(--muted); font-size: .68rem; font-weight: 400; letter-spacing: .16em; text-transform: uppercase; }
nav { display: flex; gap: clamp(1rem, 3vw, 2.5rem); font: 500 .82rem Arial, sans-serif; }
nav a { text-decoration: none; }
nav a:hover, nav a:focus-visible { color: #85683b; text-decoration: underline; text-underline-offset: .25em; }
.hero { min-height: min(680px, calc(100svh - 90px)); display: grid; grid-template-columns: 1.1fr .9fr; background: var(--cream); overflow: hidden; }
.hero-content { align-self: center; max-width: 760px; padding: clamp(3rem, 8vw, 7rem) 0 clamp(3rem, 8vw, 7rem) clamp(1.25rem, 9vw, 9rem); }
.eyebrow { margin: 0 0 1.2rem; color: #876a3e; font: 700 .68rem/1.4 Arial, sans-serif; letter-spacing: .19em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(2.8rem, 6.5vw, 6rem); font-weight: 400; line-height: .99; letter-spacing: -.045em; }
h1 em { color: #8f744b; font-weight: 400; }
.hero-copy { max-width: 440px; margin: 1.7rem 0 2rem; color: var(--ink-soft); font: 1rem/1.75 Arial, sans-serif; }
.button { display: inline-flex; align-items: center; gap: 1.4rem; min-height: 48px; padding: .75rem 1.1rem; background: var(--ink); color: white; text-decoration: none; font: 600 .79rem Arial, sans-serif; }
.button:hover, .button:focus-visible { background: #203b57; }
.button span { color: #d3b27b; font-size: 1.1rem; }
.hero-art { position: relative; min-height: 450px; display: grid; place-items: center; background: var(--ink); overflow: hidden; }
.hero-art::before, .hero-art::after { position: absolute; content: ""; width: 1px; height: 145%; background: rgba(255,255,255,.12); transform: rotate(34deg); }
.hero-art::after { transform: rotate(-34deg); }
.arch { position: absolute; left: 50%; bottom: -13%; transform: translateX(-50%); border: 1px solid rgba(203,176,129,.72); border-bottom: 0; border-radius: 50% 50% 0 0 / 42% 42% 0 0; }
.arch-outer { width: min(72%, 400px); height: 83%; }
.arch-inner { width: min(48%, 265px); height: 60%; border-color: rgba(255,255,255,.45); }
.hero-rule { z-index: 1; position: absolute; bottom: 21%; left: 14%; right: 14%; height: 1px; background: var(--gold); }
.hero-initials { z-index: 1; color: #fff; font: 400 clamp(2.2rem, 5vw, 4rem) Georgia, serif; letter-spacing: .06em; }
.section { display: grid; grid-template-columns: minmax(150px, .55fr) 1.45fr; gap: 2rem; padding: clamp(3.5rem, 8vw, 7rem) clamp(1.25rem, 9vw, 9rem); border-bottom: 1px solid var(--line); }
.section-label { color: var(--muted); font: 600 .72rem Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.section-label span { display: block; margin-bottom: .8rem; color: var(--gold); font-size: .83rem; }
.section-body { max-width: 750px; }
.section h2, .contact-pending h2 { margin: 0 0 1rem; font-size: clamp(1.8rem, 3.4vw, 3rem); font-weight: 400; letter-spacing: -.025em; }
.section p, .contact-pending p:not(.eyebrow) { max-width: 680px; margin: 0; color: var(--ink-soft); font: 1rem/1.8 Arial, sans-serif; }
.practice { background: var(--cream); }
.practice-card { display: grid; grid-template-columns: minmax(130px, .5fr) 1.5fr; gap: 2rem; align-items: start; }
.practice-number { color: #8f744b; font: 400 1.1rem/1.4 Arial, sans-serif; letter-spacing: .08em; }
.contact-pending { padding: clamp(3rem, 7vw, 6rem) clamp(1.25rem, 9vw, 9rem); background: #edf0f2; }
.contact-pending h2 { max-width: 600px; }
.site-footer { display: grid; grid-template-columns: 1fr 1.2fr auto; align-items: center; gap: 2rem; padding: 2rem clamp(1.25rem, 6vw, 6rem); background: #0c1b2a; color: white; }
.contact-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 2rem; max-width: 850px; }
.contact-info p { display: grid; gap: .45rem; margin: 0; color: var(--ink-soft); font: 1rem/1.7 Arial, sans-serif; overflow-wrap: anywhere; }
.contact-info p span { color: #876a3e; font: 700 .68rem/1.4 Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.contact-info a { text-decoration-thickness: 1px; text-underline-offset: .2em; }
.contact-info address { font-style: normal; }
.site-footer .brand-name, .site-footer .brand-name small { color: white; }
.site-footer .brand-mark { color: white; border-color: var(--gold); }
.footer-legal { display: grid; gap: .4rem; font: .78rem/1.5 Arial, sans-serif; }
.footer-legal strong { font-size: .75rem; letter-spacing: .035em; }
.footer-note { color: #c0c8d0; font-size: .7rem; }
.footer-status { color: #d3b27b; font: .7rem Arial, sans-serif; text-align: right; }
:focus-visible { outline: 3px solid #c9a56a; outline-offset: 3px; }
@media (max-width: 760px) {
  .site-header { min-height: 76px; flex-wrap: wrap; }
  .hero { grid-template-columns: 1fr; }
  .hero-content { padding: 4rem 1.25rem 3rem; }
  .hero-art { min-height: 300px; }
  .section { grid-template-columns: 1fr; gap: 1.5rem; }
  .practice-card { grid-template-columns: 1fr; gap: 1rem; }
  .contact-info { grid-template-columns: 1fr; gap: 1.15rem; }
  .site-footer { grid-template-columns: 1fr; gap: 1.3rem; }
  .footer-status { text-align: left; }
}
@media (max-width: 420px) {
  .site-header { align-items: flex-start; flex-direction: column; gap: 1rem; }
  nav { width: 100%; justify-content: space-between; padding-bottom: .3rem; }
  .hero-art { min-height: 250px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }