/* Fine ruled frames and stepped corners, using only the three brand inks. */
body { position: relative; isolation: isolate; min-height: 100vh; }
body::before {
  content: ''; position: absolute; inset: 13px; z-index: 0;
  border: 32px solid transparent;
  border-image: url('assets/brand/period-frame.svg') 32 / 32px / 0 stretch;
  pointer-events: none;
}
.site-header, main, .site-footer { position: relative; z-index: 1; }
.site-header { position: relative; border-bottom: 0; }
.site-header::before, .home-story::before, .core-principles::before, .footer-bottom::before {
  content: ''; position: absolute; inset: auto 0 0; height: 5px;
  background: linear-gradient(to bottom, var(--gold) 0 1px, transparent 1px 4px, var(--ochre) 4px 5px);
  pointer-events: none;
}
.site-header::after, .home-story::after, .core-principles::after, .footer-bottom::after {
  content: ''; position: absolute; bottom: -7px; left: calc(50% - 49px);
  width: 98px; height: 20px;
  background: var(--green) url('assets/brand/period-ornament.svg') center / 80px 20px no-repeat;
  pointer-events: none;
}
.home-story, .core-principles { position: relative; border-top: 0; }
.home-story::before, .core-principles::before, .footer-bottom::before { top: 0; bottom: auto; }
.home-story::after, .core-principles::after, .footer-bottom::after { top: -7px; bottom: auto; }
.site-footer { padding-bottom: 34px; }
.footer-bottom { position: relative; border-top: 0; padding-top: 26px; }

/* Photographs retain their existing crops and arch silhouettes. */
.art-border { border: 1px solid var(--gold); outline: 1px solid var(--ochre); outline-offset: 7px; }
.forest-path-frame { padding: 8px; border-color: var(--gold); outline: 1px solid var(--ochre); outline-offset: 5px; }
.forest-landscape { position: relative; border: 0; padding: 28px; overflow: visible; }
.forest-landscape::after, .corner-feature::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 2;
  border: 26px solid transparent;
  border-image: url('assets/brand/period-frame.svg') 32 / 26px / 0 stretch;
}
.forest-signature { border: 0; outline: none; }

/* Gold panels use an inset frame instead of a heavy enclosing border. */
.service-aside, .virginia-section, .approach-quote, .invitation, dialog {
  position: relative; border: 1px solid var(--ochre);
}
dialog { position: fixed; padding-top: 58px; }
.dialog-close { top: 20px; right: 20px; width: 32px; height: 32px; }
.service-aside::before, .virginia-section::before, .approach-quote::before, .invitation::before, dialog::before {
  content: ''; position: absolute; inset: 7px; pointer-events: none;
  border: 28px solid transparent;
  border-image: url('assets/brand/period-frame-dark.svg') 32 / 28px / 0 stretch;
}
.corner-feature { position: relative; border: 0; background: var(--green); padding: 28px; }
.corner-feature > div:nth-child(2) { background: var(--gold); }
.corner-feature .forest-next { border-right: 1px solid var(--ochre); }
.text-banner, .back-to-business { border-block: 1px solid var(--gold); }
.text-banner { border-top-style: solid; }
.corner-items article { border-top: 1px solid var(--ochre); position: relative; }
.corner-items article::before {
  content: ''; position: absolute; top: -1px; left: 0;
  width: 48px; height: 1px; background: var(--gold);
}
.story-copy blockquote { border-left: 1px solid var(--gold); }
.hero > *, .consulting-layout > *, .approach-grid > *, .corner-feature > * { min-width: 0; }

@media (min-width: 701px) and (max-width: 1150px) {
  .wrap { width: calc(100% - 96px); }
}

@media (max-width: 700px) {
  .wrap { width: calc(100% - 56px); }
  body::before { inset: 5px; border-width: 21px; border-image-width: 21px; }
  .site-footer { padding-bottom: 24px; }
  .site-header::after, .home-story::after, .core-principles::after, .footer-bottom::after {
    width: 76px; left: calc(50% - 38px); background-size: 60px 15px;
  }
  .forest-landscape, .corner-feature { padding: 23px; }
  .forest-landscape::after, .corner-feature::after { border-width: 21px; border-image-width: 21px; }
  .forest-path-frame { padding: 6px; outline-offset: 4px; }
  .art-border { outline-offset: 5px; }
  .service-aside::before, .virginia-section::before, .approach-quote::before, .invitation::before, dialog::before {
    inset: 5px; border-width: 23px; border-image-width: 23px;
  }
  .corner-feature .forest-next { border-right: 0; }
  .corner-feature > .forest-next + div { padding: 30px 22px; }
  .forest-next .forest-caption { padding-inline: 10px; }
  .forest-next .forest-signature { gap: 10px; }
  .forest-next .forest-signature .gg-mark { width: 40px; }
  .corner-feature .forest-signature p { font-size: clamp(18px, 5.6vw, 28px); }
}
@media (max-width: 380px) {
  .main-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; font-size: 14px; text-align: center; }
  .site-footer { grid-template-columns: minmax(0, 1fr); }
  .site-footer > p { grid-column: 1; grid-row: auto; }
  .site-footer > button { justify-self: start; }
  .footer-bottom { grid-column: 1; }
  .corner-feature h2 { font-size: 23px; }
  .corner-feature > .forest-next + div { padding-inline: 18px; }
}
@media print { body::before { display: none; } }