.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: var(--surface-sunken);
  border-bottom: 1px solid var(--edge-soft);
  box-shadow: 0 0.6em 1.8em rgba(0, 0, 0, 0.45);
}
.offer-banner {
  background: var(--action-primary);
  color: var(--content-inverse);
  font-family: var(--type-display);
  font-weight: 700;
  font-size: 0.82em;
  letter-spacing: 0.04em;
  text-align: center;
  padding: 0.75em 1em;
}
.offer-banner span { white-space: nowrap; }
.site-header-inner {
  display: flex;
  align-items: center;
  gap: 1.5em;
  max-width: var(--shell-measure);
  margin: 0 auto;
  padding: 0.9em 2em;
}
.site-nav { margin-left: auto; }
.site-nav-toggle { margin-left: auto; }
.site-nav-toggle span { border-radius: 2px; }
.site-nav-list { display: flex; list-style: none; margin: 0; padding: 0; }
.nav-item { display: block; }
.nav-link {
  font-family: var(--type-display);
  font-weight: 700;
  font-size: 0.86em;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--content-primary);
  border-bottom: 2px solid transparent;
  transition: border-color var(--motion-glide), color var(--motion-glide);
}
.nav-link:hover, .nav-link:focus-visible { color: var(--action-hover); border-bottom-color: var(--action-hover); text-decoration: none; }
.header-call {
  font-family: var(--type-display);
  font-weight: 800;
  font-size: 0.95em;
  color: var(--content-primary);
  white-space: nowrap;
}
.header-call:hover { color: var(--action-hover); text-decoration: none; }


.content-section.firm-introduction {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  text-align: center;
  padding: 9.5em 1em 0;
}

.content-section.firm-introduction::after {
  content: '';
  position: absolute;
  inset: 0;
  background: url(/dist/img/hero-bg.png) center/cover no-repeat;
  opacity: 0.5;
  pointer-events: none;
  z-index: -1;
}

@media (min-width: 1025px) {
  .content-section.firm-introduction::after { background-position: 90% center; }
}

.firm-introduction-canvas {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-color: var(--surface-base);
  background-image: var(--hero-photo, none);
  background-size: cover;
  background-position: center;
}
.firm-introduction-canvas::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--hero-wash);
  opacity: var(--hero-veil, 1);
}
.firm-introduction .firm-container { position: relative; z-index: 1; }
.hero-copy { max-width: 26em; margin: 0 auto; }
.hero-copy h1 { margin-bottom: 0.35em; }
.hero-lede { font-size: 1.2em; color: var(--content-primary); margin-bottom: var(--rhythm-base); }
.hero-price { margin: var(--rhythm-base) 0; }
.hero-actions { display: flex; gap: 1em; justify-content: center; flex-wrap: wrap; margin-bottom: var(--rhythm-base); }
.hero-badges { display: flex; gap: 0.7em; justify-content: center; flex-wrap: wrap; margin-top: var(--rhythm-base); }
.hero-shot {
  display: block;
  max-width: 30em;
  width: 82%;
  margin: 2.6em auto 0;
  border-radius: var(--edge-round-wide);
  box-shadow: 0 2.4em 4.6em rgba(0, 0, 0, 0.5);
  animation: shot-float 6s ease-in-out infinite;
}
@keyframes shot-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-0.75em); } }
@media (prefers-reduced-motion: reduce) { .hero-shot { animation: none; } }
.hero-extras { margin-top: var(--rhythm-base); }


@media (min-width: 1025px) {
  .firm-introduction .firm-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "copy shot" "extras extras";
    column-gap: var(--rhythm-wide);
    align-items: center;
  }
  .hero-copy { grid-area: copy; }
  .hero-shot { grid-area: shot; width: 100%; margin: 0 auto; }
  .hero-extras { grid-area: extras; margin-top: var(--rhythm-wide); }
}


.firm-heritage { background: linear-gradient(180deg, #271c17 0%, #1c1411 100%); }
.client-advantages { background: linear-gradient(200deg, #2b1d16 0%, #1c1411 72%); }
.legal-resources { background: linear-gradient(160deg, #1c1411 0%, #32211a 100%); }
.service-terms { background: linear-gradient(180deg, #241a15 0%, #1c1411 100%); }
.legal-process { background: linear-gradient(140deg, #1c1411 0%, #2a1c15 100%); }
.initial-consultation { background: linear-gradient(170deg, #3a2419 0%, #1c1411 68%); }
.client-inquiries { background: linear-gradient(200deg, #1c1411 0%, #271c17 100%); }

.section-title { max-width: 18em; }
.section-lede { max-width: 34em; color: var(--content-primary); }


.order-layout { display: grid; grid-template-columns: 1fr; gap: var(--rhythm-wide); }
.order-brief h2 { margin-bottom: var(--rhythm-tight); }
.order-flow { list-style: none; margin: var(--rhythm-base) 0; padding: 0; }
.order-summary {
  border: 1px solid var(--edge-strong);
  border-radius: var(--edge-round-wide);
  padding: 1.5em;
  margin-bottom: var(--rhythm-base);
  background: rgba(19, 13, 11, 0.45);
}
.order-summary-line { display: flex; justify-content: space-between; gap: 1em; padding: 0.35em 0; font-size: 0.95em; }
.order-summary-line strong { font-family: var(--type-display); }

.order-rail {
  position: fixed;
  top: 0;
  right: 0;
  width: 26em;
  max-width: 92vw;
  height: 100%;
  overflow-y: auto;
  z-index: 1200;
  background: var(--surface-raised);
  border-left: 2px solid var(--action-primary);
  box-shadow: -1.2em 0 3em rgba(0, 0, 0, 0.55);
  padding: 2.4em 2em;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform var(--motion-glide), visibility var(--motion-glide);
}
.order-rail.is-open { transform: translateX(0); visibility: visible; }
.order-rail-scrim {
  position: fixed;
  inset: 0;
  z-index: 1150;
  background: var(--surface-veil);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--motion-glide), visibility var(--motion-glide);
}
.order-rail-scrim.is-open { opacity: 1; visibility: visible; }
.order-rail-close {
  position: absolute;
  top: 0.8em;
  right: 0.8em;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  background: none;
  border: 1px solid var(--edge-soft);
  border-radius: 50%;
  color: var(--content-primary);
  font-size: 1.3em;
  line-height: 1;
  cursor: pointer;
}
.order-rail-close:hover { border-color: var(--action-hover); color: var(--action-hover); }
.order-rail-title { font-size: 1.5em; margin-bottom: 0.3em; }
.order-rail-note { font-size: 0.88em; color: var(--content-muted); margin-bottom: var(--rhythm-base); }

.no-js .order-rail { position: static; width: auto; max-width: none; height: auto; transform: none; visibility: visible; box-shadow: none; border-left: 0; border: 1px solid var(--edge-strong); border-radius: var(--edge-round-wide); padding: 1.8em; }
.no-js .order-rail-close, .no-js .order-rail-scrim { display: none; }


.site-footer { background: var(--surface-sunken); color: var(--content-muted); padding: 3.4em 1em 0; border-top: 1px solid var(--edge-soft); }
.footer-columns { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 2.2em; max-width: var(--shell-measure); margin: 0 auto; padding: 0 2em 2.4em; }
.footer-column p { font-size: 0.92em; margin-bottom: 0.7em; }
.footer-heading { font-family: var(--type-display); font-size: 0.8em; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--content-primary); margin-bottom: 1em; }
.footer-list { list-style: none; margin: 0; padding: 0; }
.footer-list li { margin-bottom: 0.55em; }
.footer-link { color: var(--content-muted); font-size: 0.92em; }
.footer-link:hover { color: var(--action-hover); }
.footer-logo { margin-bottom: 1em; }
.footer-logo .site-logo-mark { height: 2em; width: auto; }
.cosmetic-note { font-size: 0.85em; color: var(--content-muted); max-width: 46em; margin: 0 auto; padding: 0 2em 1.4em; text-align: center; }
.legal-bar {
  border-top: 1px solid var(--edge-soft);
  padding: 1.1em;
  display: flex;
  gap: 1.25em;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  font-size: 0.8em;
}
.legal-bar-link { color: var(--content-muted); }
.legal-bar-link:hover { color: var(--action-hover); }
.legal-bar-mark { color: var(--content-muted); }

@media (max-width: 1024px) {
  .site-header-inner { padding: 0.8em 1.4em; gap: 1em; }
  .footer-columns { grid-template-columns: 1fr 1fr; padding: 0 1.4em 2em; }
  .content-section.firm-introduction { padding-top: 9em; }
}
@media (max-width: 768px) {
  .site-header-inner { padding: 0.7em 1.1em; }
  .offer-banner { font-size: 0.74em; padding: 0.6em 0.8em; line-height: 1.4; }
  
  .offer-banner span { white-space: normal; }
  .header-call { display: none; }
  
  .content-section.firm-introduction { padding: 7em 1.1em 0; }
  .hero-lede { font-size: 1.05em; }
  .hero-shot { width: 92%; margin-top: 1.2em; }
  .hero-actions .primary-button { width: 100%; }
  .order-rail { width: 100%; max-width: 100%; padding: 2.2em 1.2em; }
  .footer-columns { grid-template-columns: 1fr; gap: 1.6em; }
  .cosmetic-note { padding: 0 1.1em 1.2em; text-align: left; }
}