/* Paradigm Land Design — static site
   Brand maroon #760a0a, League Spartan, stamp logo. */

@font-face {
  font-family: "League Spartan";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/league-spartan-400.woff2") format("woff2");
}
@font-face {
  font-family: "League Spartan";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/league-spartan-600.woff2") format("woff2");
}
@font-face {
  font-family: "League Spartan";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/league-spartan-700.woff2") format("woff2");
}

:root {
  --maroon: #760a0a;
  --maroon-deep: #5c0808;
  --ink: #241816;
  --paper: #f4efe8;
  --paper-2: #fbf8f4;
  --line: #d9d0c4;
  --muted: #6e5e4c;
  --cream: #f6f1ea;
  --gold: #f0d78c;
  --green: #0d6b3d;
  --stage: #e7e0d4;
  --measure: 68ch;
  --header-h: 6.5rem;
  --shadow: 0 14px 40px rgba(36, 24, 22, 0.14);
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "League Spartan", "Avenir Next", "Segoe UI", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.55;
  font-weight: 400;
}

img { max-width: 100%; height: auto; }

a { color: var(--maroon); text-underline-offset: 0.15em; }
a:hover { color: var(--maroon-deep); }

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}

.skip {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  transform: translateY(-150%);
  background: #fff;
  color: var(--ink);
  padding: 0.5rem 0.8rem;
  z-index: 80;
  font-weight: 700;
}
.skip:focus { transform: none; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.preview-banner {
  background: var(--gold);
  color: var(--ink);
  text-align: center;
  font-size: 0.92rem;
  font-weight: 600;
  padding: 0.45rem 1rem;
}

.site-header {
  background: var(--maroon);
  color: var(--cream);
  position: sticky;
  top: 0;
  z-index: 40;
  overflow: visible;
}

.bar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: "toggle brand .";
  align-items: center;
  gap: 0.5rem 1rem;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0.55rem 1rem 0.7rem;
  position: relative;
}

.brand {
  grid-area: brand;
  justify-self: center;
  display: flex;
  line-height: 0;
  position: relative;
  z-index: 2;
}
.brand img {
  height: 76px;
  width: auto;
  display: block;
  margin-bottom: -20px;
}

.nav-toggle {
  grid-area: toggle;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: transparent;
  color: var(--cream);
  border: 1px solid rgba(246, 241, 234, 0.45);
  border-radius: 999px;
  padding: 0.4rem 0.75rem;
  font: inherit;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.75rem;
  cursor: pointer;
}
.burger,
.burger::before,
.burger::after {
  display: block;
  width: 1rem;
  height: 2px;
  background: var(--cream);
  position: relative;
}
.burger::before,
.burger::after {
  content: "";
  position: absolute;
  left: 0;
}
.burger::before { top: -5px; }
.burger::after { top: 5px; }

.cluster { display: none; }

@media (max-width: 959px) {
  .site-header.is-open .nav-side { display: contents; }
  .site-header.is-open .nav-link[href="/"] { order: 1; }
  .site-header.is-open .has-sub { order: 2; }
  .site-header.is-open .nav-link[href="/contact/"] { order: 3; }
  .site-header.is-open .cluster {
    display: flex;
    flex-direction: column;
    grid-column: 1 / -1;
    grid-row: 2;
    background: var(--paper-2);
    color: var(--ink);
    margin: 0.3rem -1rem -0.7rem;
    padding: 0.4rem 0 0.8rem;
    max-height: calc(100vh - 5.5rem);
    overflow: auto;
    box-shadow: var(--shadow);
  }
}

.nav-side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.nav-link,
.has-sub > button {
  appearance: none;
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.82rem;
  text-decoration: none;
  padding: 0.7rem 1.1rem;
  text-align: left;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.nav-link[aria-current="page"] { box-shadow: inset 3px 0 0 var(--maroon); }

.chev {
  width: 0.45rem;
  height: 0.45rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  display: inline-block;
}

.has-sub { position: relative; }
.submenu {
  display: none;
  list-style: none;
  margin: 0;
  padding: 0.15rem 0 0.4rem;
}
.has-sub.open > .submenu { display: block; }
.submenu a {
  display: block;
  color: var(--ink);
  text-decoration: none;
  padding: 0.45rem 1.4rem 0.45rem 1.6rem;
  font-weight: 600;
}
.submenu a:hover,
.submenu a[aria-current="page"] {
  background: #f3e6e6;
  color: var(--maroon);
}

@media (min-width: 960px) {
  .bar {
    grid-template-columns: 1fr auto 1fr;
    grid-template-areas: "left brand right";
    padding: 0.35rem 1.25rem 0.45rem;
  }
  .nav-toggle { display: none; }
  .brand img { height: 102px; margin-bottom: -14px; }
  .cluster {
    display: contents;
  }
  .nav-left { grid-area: left; flex-direction: row; justify-content: flex-end; align-items: center; gap: 0.18rem; }
  .nav-right { grid-area: right; flex-direction: row; justify-content: flex-start; align-items: center; gap: 0.18rem; }
  .nav-link,
  .has-sub > button {
    color: var(--cream);
    font-size: 0.97rem;
    padding: 0.65rem 0.83rem;
    text-align: center;
  }
  .chev {
    width: 0.53rem;
    height: 0.53rem;
  }
  .nav-link[aria-current="page"],
  .has-sub > button[aria-current="true"] {
    box-shadow: inset 0 -2px 0 var(--gold);
  }
  .submenu {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0;
    min-width: 16.5rem;
    background: var(--paper-2);
    color: var(--ink);
    padding: 0.4rem 0;
    box-shadow: var(--shadow);
    border-top: 3px solid var(--maroon);
    z-index: 30;
  }
  .submenu a { padding: 0.5rem 1rem; }
  .nav-right .submenu { left: auto; right: 0; }
  @media (hover: hover) and (pointer: fine) {
    .has-sub:hover > .submenu,
    .has-sub:focus-within > .submenu { display: block; }
  }
}

main { display: block; }

.wrap {
  width: min(1120px, calc(100% - 2rem));
  margin: 0 auto;
}

.hero-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: -1px;
  color: #fff;
  background: #241816;
}
.hero-banner-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.hero-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(20, 10, 10, 0.5) 0%, rgba(20, 10, 10, 0.62) 46%, rgba(20, 10, 10, 0.56) 100%);
}
.hero-banner .hero,
.hero-banner .tally-slot {
  position: relative;
  z-index: 2;
}
.hero {
  padding: 2.4rem 0 0.35rem;
  text-align: center;
}
.hero-banner h1,
.hero-banner .tally-label { color: #fff; }
.hero-banner .tally {
  background: transparent;
  color: #f6f1ea;
  padding-bottom: 1.85rem;
}
@media (min-width: 880px) {
  .hero-banner .tally { padding-bottom: 2.15rem; }
}
.hero-banner .tally-figure { color: #fff; }
.hero-banner .tally-sub { color: rgba(246, 241, 234, 0.86); }
.hero-banner + .section { padding-top: 0; }
.hero-copy {
  max-width: 68rem;
  margin: 0 auto;
}
.eyebrow {
  margin: 0 0 0.6rem;
  color: var(--maroon);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
}
.hero h1 {
  margin: 0 auto;
  font-size: clamp(2.1rem, 5vw, 3.4rem);
  line-height: 0.98;
  letter-spacing: -0.02em;
  font-weight: 700;
  text-align: center;
}
.lede {
  font-size: 1.15rem;
  max-width: var(--measure);
  margin: 0 0 1.1rem;
  white-space: pre-wrap;
}
.hero-photo {
  margin: 0;
  background: var(--stage);
}
.hero-photo img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: contain;
  object-position: center;
}

@media (min-width: 880px) {
  .hero { padding: 3.1rem 0 0.45rem; }
}

.section { padding: 2.2rem 0; }
.type-banner-spacer + .section { padding-top: 0; }
.section h2 {
  margin: 0 0 1.15rem;
  padding: 0.36rem 1rem;
  padding-top: calc(0.36rem + 0.22em);
  padding-left: calc(1rem + 0.1em);
  background: var(--maroon);
  color: var(--cream);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: clamp(1.2rem, 2.4vw, 1.55rem);
  line-height: 1;
}
.type-banner ~ .section > h2 {
  position: sticky;
  top: calc(var(--header-h) + var(--banner-compact) - 2px);
  z-index: 20;
  box-shadow: 0 -1px 0 #241816;
}

.services {
  display: grid;
  gap: 0.85rem;
}
.service {
  position: relative;
  background: #fff;
  color: var(--ink);
  border-top: 4px solid var(--maroon);
  padding: 1.15rem 1.15rem 1.25rem;
  text-align: center;
}
.service-head {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: 5.15rem;
  margin: 0 0 0.7rem;
}
.service-stamp {
  display: block;
  width: 7.4rem;
  height: auto;
  margin: 0 auto;
}
.service h3 {
  margin: 0;
  color: var(--maroon);
  font-size: 1rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.service p {
  margin: 0;
  white-space: pre-wrap;
  text-align: justify;
  text-align-last: start;
  hyphens: auto;
  hyphenate-limit-chars: 6 3 3;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 720px) {
  .services { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1020px) {
  .services { grid-template-columns: 1fr 1fr 1fr; }
  .service-wide { grid-column: span 2; }
}

.tally-slot { margin: 0.35rem auto 0; }
.tally {
  display: block;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  padding: 1.15rem 1.1rem 1.2rem;
}
.tally-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.05rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
.tally-figure {
  margin: 0;
  font-weight: 700;
  font-size: clamp(2.05rem, 4.4vw, 2.85rem);
  letter-spacing: -0.03em;
  line-height: 0.92;
  color: var(--maroon);
  font-variant-numeric: tabular-nums;
}
.tally-num {
  text-shadow: none;
}
.tally-suffix,
.tally-approx {
  font-size: 0.62em;
  letter-spacing: 0.01em;
}
.tally-suffix { margin-left: 0.06em; }
.tally-label {
  margin: 0.08rem 0 0;
  font-weight: 700;
  font-size: 1.13rem;
  letter-spacing: 0.04em;
  line-height: 1.05;
  text-transform: uppercase;
}
.tally-sub {
  margin: 0.02rem 0 0;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.1;
}
@media (min-width: 720px) {
  .tally-row { grid-template-columns: repeat(3, 1fr); }
  .tally-row > [role="listitem"] {
    display: grid;
    grid-row: span 3;
    grid-template-rows: subgrid;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .tally.is-live .tally-num {
    animation: tally-glow 2.8s ease-in-out infinite;
  }
  .hero-banner .tally.is-live .tally-num {
    animation-name: hero-tally-glow;
  }
}
@keyframes hero-tally-glow {
  0%, 100% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.16); }
  50% { text-shadow: 0 0 16px rgba(255, 255, 255, 0.32); }
}
@keyframes tally-glow {
  0%, 100% { text-shadow: 0 0 8px rgba(118, 10, 10, 0.08); }
  50% { text-shadow: 0 0 14px rgba(118, 10, 10, 0.2); }
}

.type-row, .more-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.type-row a, .more-row a {
  display: inline-block;
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--line);
  padding: 0.45rem 0.75rem;
  font-weight: 700;
  color: var(--ink);
}
.type-row a:hover, .more-row a:hover {
  border-color: var(--maroon);
  color: var(--maroon);
}

.type-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
@media (min-width: 360px) {
  .type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .type-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.type-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 4 / 3;
  min-width: 0;
  text-decoration: none;
  color: var(--cream);
  background: #241816;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.type-card-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.type-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.type-card-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(18, 8, 8, 0.9) 0%, rgba(18, 8, 8, 0.55) 34%, rgba(18, 8, 8, 0.12) 62%);
  transition: background 0.3s ease;
}
.type-card-title {
  position: relative;
  z-index: 1;
  align-self: stretch;
  min-width: 0;
  overflow-wrap: break-word;
  padding: 0.85rem 0.85rem 0.7rem;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.15;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cream);
  border-bottom: 4px solid transparent;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.type-card:hover,
.type-card:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 18px 34px rgba(36, 24, 22, 0.28);
  z-index: 1;
}
.type-card:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}
.type-card:hover .type-card-media img,
.type-card:focus-visible .type-card-media img {
  transform: scale(1.08);
}
.type-card:hover .type-card-media::after,
.type-card:focus-visible .type-card-media::after {
  background: linear-gradient(to top, rgba(18, 8, 8, 0.62) 0%, rgba(18, 8, 8, 0.28) 36%, rgba(18, 8, 8, 0.02) 64%);
}
.type-card:hover .type-card-title,
.type-card:focus-visible .type-card-title {
  color: #fff;
  background: #760a0a;
  border-bottom-color: #760a0a;
}
@media (prefers-reduced-motion: reduce) {
  .type-card,
  .type-card-media img,
  .type-card-media::after,
  .type-card-title { transition: none; }
  .type-card:hover,
  .type-card:focus-visible { transform: none; }
  .type-card:hover .type-card-media img,
  .type-card:focus-visible .type-card-media img { transform: none; }
}

.study-grid {
  display: grid;
  gap: 1rem;
  margin: 0 24px;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 600px) {
  .study-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
  .study-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1500px) {
  .study-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 2200px) {
  .study-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.study-card {
  position: relative;
  display: block;
  background: #fff;
  text-decoration: none;
  color: inherit;
  border: 1px solid var(--line);
  min-width: 0;
  aspect-ratio: 1.618 / 1;
  overflow: hidden;
  cursor: pointer;
}
.study-name {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}
.study-name .study-title {
  min-width: 0;
  flex: 1 1 auto;
}
.study-card:hover { border-color: var(--maroon); }
.study-card .study-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15em 0.35em;
}
.study-card .study-logos {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
  height: 2.15rem;
  max-width: 62%;
  flex: 0 1 auto;
}
.study-card .study-logo {
  display: block;
  width: auto;
  height: 2.15rem;
  max-width: 7.4rem;
  min-width: 0;
  aspect-ratio: auto;
  object-fit: contain;
  background: transparent;
  flex: 0 1 auto;
}
.study-card .study-logo + .study-logo {
  max-width: 4.4rem;
  height: 1.85rem;
}
.study-card .study-stamps {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.15rem;
  max-width: none;
  margin: 0.15rem 0 0;
  padding: 0;
  list-style: none;
}
.study-card .study-stamps .stamp {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
}
.study-card .study-stamps .stamp img {
  display: block;
  width: auto;
  height: 1.9rem;
  max-width: 100%;
  margin: 0 auto;
  aspect-ratio: auto;
  object-fit: contain;
  background: transparent;
}
.study-frame,
.study-placeholder {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  overflow: hidden;
}
.study-frame .study-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
  background: #fff;
  opacity: 0;
  transition: opacity var(--study-crossfade, 1.6s) ease;
}
.study-frame .study-slide.is-on { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .study-frame .study-slide { transition: none; }
}
.study-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  text-align: center;
  color: var(--muted);
  font-weight: 600;
}
.study-meta {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  padding: 0.35rem 0.6rem 0.4rem;
  background: #fff;
}
.study-title { font-weight: 700; font-size: 0.98rem; line-height: 1.15; }
.study-builder { color: var(--muted); font-size: 0.82rem; line-height: 1.2; }
.plan-lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background: rgba(18, 8, 8, 0.82);
}
.plan-lightbox[hidden] { display: none; }
.plan-lightbox img {
  display: block;
  max-width: calc(100vw - 2.5rem);
  max-height: calc(100vh - 4.5rem);
  width: auto;
  height: auto;
  object-fit: contain;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}
.plan-lightbox-close {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  width: 2.4rem;
  height: 2.4rem;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
}
@media (max-width: 599px) {
  .study-meta { padding: 0.22rem 0.5rem 0.24rem; gap: 0.02rem; }
  .study-title { font-size: 0.9rem; }
  .study-builder { font-size: 0.75rem; }
  .study-card .study-logo,
  .study-card .study-logo + .study-logo { height: 1.7rem; max-width: 5.2rem; }
  .study-card .study-stamps .stamp img { height: 1.55rem; }
}

.logo-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.65rem;
}
@media (min-width: 640px) {
  .logo-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 960px) {
  .logo-grid { grid-template-columns: repeat(5, 1fr); }
}
.logo-grid li {
  background: #fff;
  border: 1px solid var(--line);
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.6rem 0.7rem;
}
.logo-grid img {
  max-height: 64px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

.btn {
  display: inline-block;
  background: var(--maroon);
  color: #fff !important;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 0.75rem 1rem;
  margin-top: 0.4rem;
}
.btn:hover { background: var(--maroon-deep); color: #fff !important; }

.page-head { padding: 1.6rem 0 0.85rem; text-align: center; }
:root {
  --banner-full: 160px;
  --banner-compact: 60px;
}
@media (min-width: 720px) {
  :root {
    --banner-full: 220px;
    --banner-compact: 72px;
  }
}
.type-banner-sentinel { height: 0; }
.type-banner-spacer {
  height: 0;
  transition: height 0.35s ease;
}
.type-banner.is-compact + .type-banner-spacer {
  height: calc(var(--banner-full) - var(--banner-compact));
}
.type-banner {
  position: sticky;
  top: calc(var(--header-h) - 1px);
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--banner-full);
  overflow: hidden;
  background: #241816;
  box-shadow: 0 -1px 0 var(--maroon);
  transition: height 0.35s ease;
}
.type-banner.is-compact { height: var(--banner-compact); }
.type-banner img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Single-family banner image is already the lower Mesquite Ranch strip. */
.type-banner[data-crop="mesquite"] img {
  object-position: center 58%;
}
.type-banner[data-crop="mesquite"]::after {
  background: linear-gradient(90deg, rgba(20, 12, 10, 0.58), rgba(20, 12, 10, 0.38) 48%, rgba(20, 12, 10, 0.5));
}
@media (max-width: 719px) {
  .type-banner[data-crop="mesquite"] img {
    object-position: center center;
    transform: scale(1.36);
    transform-origin: 74% 57%;
  }
}
/* Multi-family banner image is already the Silverhawke building cluster. */
@media (max-width: 719px) {
  .type-banner[data-crop="silverhawke"] img {
    transform: scale(1.24);
    transform-origin: center;
  }
}
.type-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(20, 12, 10, 0.68), rgba(20, 12, 10, 0.48) 48%, rgba(20, 12, 10, 0.6));
}
.type-banner h1 {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0 1rem;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: clamp(1.7rem, 4vw, 2.7rem);
  line-height: 1.15;
  text-shadow:
    0 0 4px rgba(0, 0, 0, 0.9),
    0 0 10px rgba(0, 0, 0, 0.75),
    0 0 22px rgba(0, 0, 0, 0.55),
    0 2px 3px rgba(0, 0, 0, 0.8);
  transition: font-size 0.35s ease;
}
.type-banner h1::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  width: min(26rem, 68%);
  height: 2.6em;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.14) 48%, rgba(0, 0, 0, 0) 72%);
  pointer-events: none;
}
.type-banner.is-compact h1 {
  font-size: clamp(1.2rem, 2.4vw, 1.55rem);
  line-height: 1.05;
}
.contact-wrap { max-width: 40rem; margin: 0 auto 2.4rem; }
.form-status {
  background: #fff;
  border-left: 4px solid var(--maroon);
  padding: 0.8rem 1rem;
  margin: 0 0 1rem;
  font-weight: 600;
}
.contact-form { display: grid; gap: 0.85rem; }
.contact-form label { display: grid; gap: 0.3rem; font-weight: 700; font-size: 0.92rem; }
.contact-form input,
.contact-form textarea {
  font: inherit;
  font-weight: 400;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  padding: 0.65rem 0.7rem;
  width: 100%;
}
.contact-form input:focus,
.contact-form textarea:focus {
  outline: 2px solid var(--maroon);
  outline-offset: 1px;
}
.optional { font-weight: 500; color: var(--muted); }
.contact-hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.contact-form .btn { justify-self: start; border: 0; cursor: pointer; font: inherit; font-weight: 700; }
.page-head h1 {
  margin: 0.2rem 0 0;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.title-block { padding: 1.35rem 0 0.35rem; text-align: center; }
.title-block h1 {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.28em 0.55em;
  font-size: clamp(2rem, 4.2vw, 3.05rem);
  line-height: 1.05;
  letter-spacing: -0.025em;
}
.builder-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.75rem 1.35rem;
  list-style: none;
  margin: 0.7rem auto 0;
  padding: 0;
  max-width: 52rem;
}
.builder-logos li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3.35rem;
  max-width: min(16rem, 100%);
}
.builder-logos li:only-child {
  max-width: min(28rem, 100%);
}
.builder-logo {
  display: block;
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.stamp-wrap { padding: 0.4rem 0 0.1rem; }
.stamps {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.15rem 0.45rem;
  max-width: 1120px;
}
.stamp {
  margin: 0;
  flex: 0 0 calc(0.8 * (100% - 0.45rem) / 2);
  min-width: 0;
  line-height: 0;
}
.stamp img {
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 720px) {
  .stamp { flex-basis: calc(0.8 * (100% - 2 * 0.45rem) / 3); }
}
@media (min-width: 1040px) {
  .stamp { flex-basis: calc(0.8 * (100% - 5 * 0.45rem) / 6); }
  .stamps-7 { gap: 0.1rem 0.28rem; }
  .stamps-7 .stamp { flex-basis: calc(0.8 * (100% - 6 * 0.28rem) / 7); }
}

.built {
  display: block;
  width: clamp(4.4rem, 9vw, 6.2rem);
  height: auto;
  flex: 0 0 auto;
  pointer-events: none;
  transform: rotate(35deg);
  filter: drop-shadow(0 0.4rem 0.55rem rgba(36, 24, 22, 0.38));
}
.study-frame .built {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 20%;
}

:root {
  --gallery-height: min(60vh, 640px, 86vw);
  --gallery-gap: 16px;
  --gallery-frame: 8px;
}
@media (min-width: 720px) {
  :root {
    --gallery-height: min(60vh, 640px, 63vw);
  }
}
.gallery { margin: 0.4rem 0 1.4rem; }
.type-banner ~ .section:has(.gallery) { padding-bottom: 0; }
.type-banner ~ .section:has(.gallery) + .section { padding-top: 0; }
.type-banner ~ .section .gallery { margin-bottom: 0; }
.reel {
  background: transparent;
  overflow: hidden;
  padding: 12px 0 26px;
  touch-action: pan-y;
}
@media (min-width: 720px) {
  .reel { padding-bottom: 32px; }
}
.reel-track {
  position: relative;
  display: flex;
  align-items: center;
  width: max-content;
  gap: var(--gallery-gap);
  transition: transform 0.4s ease;
}
.reel-slide {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border: 0;
  appearance: none;
  background: transparent;
  color: inherit;
  font: inherit;
  height: var(--gallery-height);
  opacity: 0.55;
  cursor: pointer;
}
.reel-slide.is-selected {
  opacity: 1;
  cursor: default;
}
.reel-frame {
  height: 100%;
  box-sizing: border-box;
  padding: var(--gallery-frame);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  box-shadow:
    0 1px 2px rgba(36, 24, 22, 0.3),
    0 4px 8px rgba(36, 24, 22, 0.22),
    0 10px 14px rgba(36, 24, 22, 0.18);
}
.reel-slide img {
  display: block;
  width: auto;
  height: calc(var(--gallery-height) - (2 * var(--gallery-frame)));
  max-width: none;
  max-height: none;
  object-fit: contain;
}
.thumbs {
  display: flex;
  flex-wrap: nowrap;
  justify-content: safe center;
  gap: 0.45rem;
  margin: 0;
  padding: 0.15rem 24px 0.7rem;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 24px;
  scrollbar-width: thin;
  scrollbar-color: rgba(118, 10, 10, 0.45) transparent;
}
.thumbs::-webkit-scrollbar { height: 8px; }
.thumbs::-webkit-scrollbar-thumb {
  background: rgba(118, 10, 10, 0.45);
  border-radius: 999px;
}
.thumb {
  flex: 0 0 auto;
  width: 104px;
  height: 76px;
  border: 2px solid transparent;
  background: var(--stage);
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: start;
  line-height: 0;
}
.thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.thumb[aria-current="true"] { border-color: var(--maroon); }

.facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0.4rem 0 1.2rem;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.facts > div { padding: 0.9rem 0.8rem; }
.facts dt {
  margin: 0 0 0.25rem;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 700;
}
.facts dd {
  margin: 0;
  font-weight: 650;
  font-weight: 600;
  font-size: 1.05rem;
}
.unknown { color: var(--muted); font-weight: 500; }
@media (min-width: 860px) {
  .facts { grid-template-columns: repeat(5, 1fr); }
  .facts > div + div { box-shadow: inset 1px 0 0 var(--line); }
}

.more { padding-bottom: 2.4rem; }
.more h2 { font-size: 1.25rem; }

.callout {
  background: #fff;
  border-left: 4px solid var(--gold);
  padding: 0.9rem 1rem;
  margin: 1rem 0 1.4rem;
}
.policy h2 { font-size: 1.45rem; margin: 1.6rem 0 0.5rem; }
.policy h3 { font-size: 1.05rem; margin: 1rem 0 0.3rem; }
.policy p, .policy li { max-width: 72ch; }
.policy ul { padding-left: 1.2rem; }

.prose { padding-bottom: 2rem; }

.site-footer {
  background: var(--maroon);
  color: var(--cream);
  padding: 1.6rem 0 1.8rem;
}
.site-footer a { color: var(--cream); }
.footer-grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
}
.site-footer p { margin: 0.2rem 0; }
.site-footer p a {
  font-weight: 400;
  font-size: 0.75rem;
  text-transform: uppercase;
}
.social {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0.35rem 0 0;
}
.social a {
  display: flex;
  background: #fff;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
}
.social img { width: 28px; height: 28px; object-fit: contain; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .type-banner,
  .type-banner-spacer,
  .type-banner h1,
  .reel-track { transition: none; }
}

@media print {
  .preview-banner, .site-header, .site-footer, .thumbs, .nav-toggle, .lb-bar { display: none !important; }
  body { background: #fff; }
  a { color: #000; }
}