:root {
  --paper: #f8f7f2;
  --ink: #292721;
  --muted: #706e65;
  --gold: #a99a69;
  --rule: #d9d2c0;
  --panel: #f0eee7;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Georgia, "Times New Roman", serif; }
a { color: inherit; }

.masthead { max-width: 1140px; margin: 0 auto; min-height: 166px; padding: 24px 42px 20px; display: flex; justify-content: center; align-items: center; position: relative; }
.brand { display: flex; flex-direction: column; align-items: center; text-decoration: none; }
.brand-mark { width: 72px; height: 54px; object-fit: contain; margin-bottom: 6px; }
.brand-name { font-size: 28px; line-height: 1.2; letter-spacing: .025em; }
.brand-title { margin-top: 7px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; }
.header-contact { position: absolute; right: 42px; top: 35px; display: grid; justify-items: end; gap: 7px; color: var(--muted); font: 12px Arial, sans-serif; letter-spacing: .04em; }
.header-contact a { color: var(--ink); text-decoration: none; }
.header-contact a:hover { color: #756943; }
.main-nav { min-height: 49px; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); display: flex; justify-content: center; align-items: center; gap: clamp(30px, 6vw, 74px); }
.main-nav a { padding: 15px 0; font: 12px Arial, sans-serif; letter-spacing: .14em; text-decoration: none; text-transform: uppercase; }
.main-nav a:hover { color: #756943; }

.welcome { width: min(100% - 48px, 1056px); min-height: 448px; margin: 0 auto; padding: 69px 34px 58px; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 40px; border-bottom: 1px solid var(--rule); }
.welcome-copy { max-width: 500px; }
.eyebrow { margin: 0; color: #7a704e; font-size: 11px; letter-spacing: .17em; text-transform: uppercase; }
h1 { margin: 21px 0 16px; font-size: clamp(43px, 5.4vw, 63px); line-height: 1.12; font-weight: 400; letter-spacing: -.03em; }
h1 span { color: #817650; font-style: italic; }
.gold-rule { width: 86px; height: 1px; background: var(--gold); margin: 22px 0 16px; }
.welcome-name { margin: 0; font-size: 19px; }
.welcome-text { max-width: 460px; margin: 13px 0 0; color: var(--muted); font-size: 16px; line-height: 1.8; }
.classic-button { display: inline-block; margin-top: 24px; padding: 15px 18px; border: 1px solid var(--gold); font: 13px Arial, sans-serif; letter-spacing: .02em; text-decoration: none; }
.classic-button span { margin-left: 20px; color: var(--gold); }
.classic-button:hover { background: #efede5; }
.welcome-seal { justify-self: end; width: min(100%, 380px); height: 300px; display: grid; place-items: center; background: var(--panel); }
.seal-border { width: calc(100% - 38px); height: calc(100% - 38px); border: 1px solid #cec5ab; display: flex; flex-direction: column; justify-content: center; align-items: center; color: var(--gold); }
.seal-border { background: #f8f7f2; }
.seal-border .seal-image { display: block; width: min(79%, 240px); height: auto; object-fit: contain; }
.seal-border span { margin-top: 9px; color: #575448; font-size: 11px; letter-spacing: .15em; text-transform: uppercase; }

.practice { max-width: 1140px; margin: 0 auto; padding: 64px 76px 76px; }
.section-heading { text-align: center; }
.section-heading h2, .contact-heading h2 { margin: 13px 0 8px; font-size: 38px; font-weight: 400; letter-spacing: -.02em; }
.section-heading > p:last-child { margin: 0; color: var(--muted); font-size: 15px; }
.practice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 38px; }
.practice-item { min-height: 155px; padding: 24px 22px; background: #fbfaf6; border: 1px solid var(--rule); display: grid; grid-template-columns: 30px 1fr 18px; gap: 14px; align-content: start; }
.roman { color: var(--gold); font-size: 13px; font-style: italic; }
.practice-item h3 { margin: 0 0 9px; font-size: 22px; font-weight: 400; }
.practice-item p { max-width: 330px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.practice-item > a { color: var(--gold); text-decoration: none; }

.contact { padding: 62px max(7vw, calc((100vw - 988px) / 2)) 70px; background: var(--panel); display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; align-items: start; }
.contact-heading { padding-top: 2px; }
.contact-heading h2 { margin-top: 20px; }
.contact-heading > p:last-child { margin: 8px 0 0; color: var(--muted); font-size: 15px; }
.contact-details { border-top: 1px solid #d5cfbf; }
.detail { min-height: 68px; padding: 15px 0; border-bottom: 1px solid #d5cfbf; display: grid; grid-template-columns: 100px 1fr auto; gap: 12px; align-items: center; }
.detail > span { color: #7a704e; font: 11px Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.detail address, .detail-main { font-size: 15px; line-height: 1.7; font-style: normal; text-decoration: none; }
.detail > a:last-child:not(.detail-main) { font: 12px Arial, sans-serif; color: #766b4c; text-decoration: none; white-space: nowrap; }
.detail a:hover { text-decoration: underline; text-underline-offset: 3px; }
.footer { min-height: 68px; padding: 17px max(7vw, calc((100vw - 1056px) / 2)); background: #35332d; color: #d1cec4; display: flex; justify-content: space-between; align-items: center; gap: 18px; font: 11px Arial, sans-serif; }
.footer a { text-decoration: none; }
.footer a:first-child { color: #fffdf7; font: 15px Georgia, serif; }
.footer a:last-child { color: #d2c393; }

@media (max-width: 700px) {
  .masthead { min-height: 150px; padding: 19px 20px 17px; }
  .brand-mark { width: 66px; height: 49px; }
  .brand-name { font-size: 25px; }
  .brand-title { font-size: 9px; letter-spacing: .16em; }
  .header-contact { right: 17px; top: 17px; font-size: 10px; }
  .header-contact span { display: none; }
  .main-nav { gap: 0; justify-content: space-evenly; }
  .main-nav a { padding: 15px 12px; font-size: 11px; letter-spacing: .1em; }
  .welcome { width: 100%; min-height: 0; padding: 53px 7vw 43px; grid-template-columns: 1fr; gap: 35px; }
  .welcome-copy { max-width: none; }
  h1 { font-size: clamp(44px, 13vw, 58px); }
  .welcome-seal { justify-self: stretch; width: 100%; height: 250px; }
  .seal-border .seal-image { width: min(82%, 220px); }
  .practice { padding: 52px 7vw 58px; }
  .section-heading h2, .contact-heading h2 { font-size: 32px; }
  .practice-grid { grid-template-columns: 1fr; gap: 12px; margin-top: 29px; }
  .practice-item { min-height: 130px; }
  .contact { padding: 49px 7vw 55px; grid-template-columns: 1fr; gap: 28px; }
  .detail { grid-template-columns: 75px minmax(0, 1fr); gap: 8px; }
  .detail > a:last-child:not(.detail-main) { grid-column: 2; margin-top: -6px; }
  .footer { padding: 20px 7vw; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; line-height: 1.5; }
  .footer > :nth-child(even) { text-align: right; }
}

@media (max-width: 380px) { .header-contact { display: none; } .main-nav a { padding-inline: 9px; } .welcome-text { font-size: 15px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
