/* ============================================================
   The A Team — Guide Template
   Builds on colors_and_type.css
   A reusable long-form guide system: neighborhood, relocation,
   commuting, buyer & first-time-homebuyer guides.
   Three cover/section "directions" toggle via [data-direction].
   ============================================================ */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg-2); color: var(--fg-1); }

img { display: block; max-width: 100%; }
button { font: inherit; cursor: pointer; }

/* page sits on a paper "sheet" floating over the stone backdrop */
.sheet {
  width: min(1180px, 100%);
  margin: 0 auto;
  background: var(--at-paper);
  box-shadow: 0 1px 0 rgba(20,22,44,.04);
}

.wrap   { width: min(1040px, 88%); margin-inline: auto; }
.prose  { max-width: 700px; }
.prose p { font-size: var(--prose-fs, var(--fs-18)); line-height: 1.7; margin: 0 0 var(--s-5); color: var(--at-stone-700); }
.prose p:first-of-type { margin-top: 0; }

.eyebrow { color: var(--at-navy); }
.scroll-mt { scroll-margin-top: 84px; }

/* ===================== STICKY READER BAR ===================== */
.readerbar {
  position: sticky; top: 0; z-index: 40;
  background: rgba(251,250,247,.86);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border-soft);
  transition: transform var(--dur-base) var(--ease-out);
}
.readerbar-inner {
  width: min(1180px, 100%); margin-inline: auto;
  display: flex; align-items: center; gap: var(--s-6);
  padding: 12px clamp(20px, 5vw, 64px);
}
.readerbar .rb-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.readerbar .rb-brand img { height: 26px; }
.readerbar .rb-title {
  font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: var(--fs-14); color: var(--at-navy); letter-spacing: -0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.toc {
  display: flex; gap: 2px; margin-left: auto; overflow-x: auto;
  scrollbar-width: none;
}
.toc::-webkit-scrollbar { display: none; }
.toc a {
  font-family: var(--font-body); font-size: 13px; font-weight: 500;
  color: var(--fg-2); text-decoration: none; white-space: nowrap;
  padding: 7px 12px; border-radius: var(--r-pill);
  transition: all var(--dur-fast) var(--ease-out);
}
.toc a:hover { color: var(--at-navy); background: var(--at-stone-50); }
.toc a.active { color: var(--at-navy); background: var(--at-lime); font-weight: 600; }
.rb-progress {
  position: absolute; left: 0; bottom: -1px; height: 2px;
  background: var(--at-lime); width: 0%;
  transition: width 80ms linear;
}

/* ===================== COVER (shared) ===================== */
.cover { position: relative; }
.cover-variant { display: none; }
[data-direction="a"] .cover-a,
[data-direction="b"] .cover-b,
[data-direction="c"] .cover-c { display: block; }

.cover-eyebrow {
  font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: var(--fs-12); letter-spacing: 0.2em; text-transform: uppercase;
}
.cover-kicker { /* the guide-type line e.g. NEIGHBORHOOD GUIDE */ }
.cover h1 {
  font-family: var(--font-display); font-weight: var(--fw-black);
  letter-spacing: -0.035em; line-height: 0.95; margin: 0;
  text-wrap: balance;
}
.cover .cover-sub {
  font-size: var(--fs-20); line-height: 1.45; font-weight: var(--fw-regular);
}
.cover-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px;
  font-size: var(--fs-14);
}
.cover-meta .dot { width: 4px; height: 4px; border-radius: 999px; background: currentColor; opacity: .5; }

/* --- Direction A: full-bleed editorial photo --- */
.cover-a { height: clamp(560px, 86vh, 760px); color: #fff; }
.cover-a image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
.cover-a .cover-grade {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(20,22,44,.42) 0%, rgba(20,22,44,0) 32%),
    linear-gradient(0deg, rgba(20,22,44,.82) 2%, rgba(20,22,44,.30) 38%, rgba(20,22,44,0) 64%);
}
.cover-a .cover-top {
  position: absolute; z-index: 2; top: 0; left: 0; right: 0;
  display: flex; align-items: center; justify-content: space-between;
  padding: clamp(22px, 4vw, 40px) clamp(24px, 6vw, 72px);
}
.cover-a .cover-top img { height: 32px; }
.cover-a .cover-top .cover-badge {
  font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--at-navy); background: var(--at-lime);
  padding: 7px 13px; border-radius: var(--r-pill);
}
.cover-a .cover-body {
  position: absolute; z-index: 2; left: 0; right: 0; bottom: 0;
  padding: clamp(28px, 5vw, 64px) clamp(24px, 6vw, 72px);
}
.cover-a .cover-eyebrow { color: var(--at-lime); }
.cover-a h1 { color: #fff; font-size: clamp(48px, 8.5vw, 104px); margin: 14px 0 18px; }
.cover-a .cover-sub { color: rgba(255,255,255,.92); max-width: 560px; }
.cover-a .cover-meta { color: rgba(255,255,255,.82); margin-top: 22px; }

/* --- Direction B: brand split block --- */
.cover-b { display: none; min-height: clamp(560px, 84vh, 720px); }
[data-direction="b"] .cover-b { display: grid; grid-template-columns: 1.05fr 0.95fr; }
.cover-b .cb-panel {
  position: relative; overflow: hidden;
  background: var(--at-navy); background-image: url("../assets/bg-blue.png");
  background-size: cover; background-position: center;
  color: #fff; display: flex; flex-direction: column;
  padding: clamp(34px, 5vw, 64px);
}
.cover-b .cb-glyph {
  position: absolute; right: -8%; bottom: -10%;
  width: 62%; opacity: 0.07; filter: brightness(0) invert(1);
  pointer-events: none;
}
.cover-b .cb-top { display: flex; align-items: center; gap: 12px; margin-bottom: auto; }
.cover-b .cb-top img { height: 30px; }
.cover-b .cb-rule { height: 1px; flex: 1; background: rgba(255,255,255,.25); }
.cover-b .cover-eyebrow { color: var(--at-lime); position: relative; }
.cover-b h1 { color: #fff; font-size: clamp(46px, 6vw, 78px); margin: 16px 0 18px; position: relative; }
.cover-b .cover-sub { color: rgba(255,255,255,.88); max-width: 460px; position: relative; }
.cover-b .cover-meta { color: rgba(255,255,255,.78); margin-top: 26px; position: relative; }
.cover-b .cb-photo { position: relative; }
.cover-b .cb-photo image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }

/* --- Direction C: framed paper booklet --- */
.cover-c { display: none; }
[data-direction="c"] .cover-c { display: block; }
.cover-c .cc-frame {
  padding: clamp(40px, 6vw, 88px) clamp(24px, 6vw, 72px) clamp(32px, 4vw, 56px);
  text-align: center;
  border-bottom: 1px solid var(--border-soft);
}
.cover-c .cc-top {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  margin-bottom: clamp(28px, 5vw, 52px);
}
.cover-c .cc-top img { height: 30px; }
.cover-c .cc-top .cc-line { width: 40px; height: 1px; background: var(--border-strong); }
.cover-c .cover-eyebrow { color: var(--at-navy); }
.cover-c .cover-eyebrow::after {
  content: ""; display: block; width: 34px; height: 3px; border-radius: 2px;
  background: var(--at-lime); margin: 14px auto 0;
}
.cover-c h1 { color: var(--at-navy); font-size: clamp(46px, 7vw, 92px); margin: 22px 0 20px; }
.cover-c .cover-sub { color: var(--fg-2); max-width: 600px; margin-inline: auto; }
.cover-c .cover-meta { color: var(--fg-2); justify-content: center; margin-top: 24px; }
.cover-c .cc-photo {
  width: min(1040px, 88%); margin: clamp(32px, 5vw, 56px) auto 0;
}
.cover-c .cc-photo image-slot { width: 100%; height: clamp(320px, 42vw, 480px); }

/* ===================== SECTION HEADERS ===================== */
section.block { padding: clamp(48px, 7vw, 96px) 0; }
.block + .block { border-top: 1px solid var(--border-soft); }

.sec-head { margin-bottom: clamp(28px, 4vw, 48px); }
.sec-head .sec-no {
  font-family: var(--font-display); font-weight: var(--fw-black);
  font-size: var(--fs-14); color: var(--at-stone-300);
  letter-spacing: 0.04em; display: none;
}
.sec-head .eyebrow { display: block; margin-bottom: 12px; }
.sec-head h2 {
  font-family: var(--font-display); font-weight: var(--fw-heavy);
  font-size: clamp(28px, 3.6vw, 46px); line-height: 1.05;
  letter-spacing: -0.02em; color: var(--at-navy); margin: 0;
  text-wrap: balance;
}
.sec-head .sec-lede {
  font-size: var(--fs-20); line-height: 1.5; color: var(--fg-2);
  max-width: 640px; margin: 16px 0 0;
}

/* Direction-specific section header treatments */
[data-direction="a"] .sec-head { border-top: 3px solid var(--at-navy); padding-top: 18px; max-width: 760px; }
[data-direction="a"] .sec-head .eyebrow { color: var(--at-stone-400); }

[data-direction="b"] .sec-head { display: grid; grid-template-columns: auto 1fr; gap: 0 22px; align-items: start; }
[data-direction="b"] .sec-head .sec-no {
  display: grid; place-items: center; grid-row: span 3;
  width: 52px; height: 52px; font-size: var(--fs-20);
  color: var(--at-navy); background: var(--at-lime); border-radius: var(--r-md);
}
[data-direction="b"] .sec-head .eyebrow { color: var(--at-navy); }

[data-direction="c"] .sec-head { text-align: center; max-width: 720px; margin-inline: auto; }
[data-direction="c"] .sec-head .eyebrow::after {
  content: ""; display: block; width: 30px; height: 3px; border-radius: 2px;
  background: var(--at-lime); margin: 12px auto 0;
}
[data-direction="c"] .sec-head .sec-lede { margin-inline: auto; }

/* ===================== INTRO / WELCOME ===================== */
.intro { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.intro .intro-figure image-slot { width: 100%; height: clamp(320px, 38vw, 460px); }
.intro figcaption {
  font-size: var(--fs-12); color: var(--fg-3); margin-top: 10px;
  font-family: var(--font-display); letter-spacing: 0.04em; text-transform: uppercase; font-weight: 600;
}
body.dropcap .lead-cap::first-letter {
  font-family: var(--font-display); font-weight: var(--fw-black);
  font-size: 3.4em; line-height: 0.8; float: left;
  padding: 6px 12px 0 0; color: var(--at-navy);
}

/* ===================== AT-A-GLANCE STATS ===================== */
.stats-band { background: var(--at-navy); background-image: url("../assets/bg-blue.png"); background-size: cover; background-position: center; color: #fff; }
.stats-band .sec-head h2 { color: #fff; }
.stats-band .sec-head .eyebrow { color: var(--at-lime) !important; }
.stats-band .sec-head .sec-lede { color: rgba(255,255,255,.82); }
[data-direction="a"] .stats-band .sec-head { border-top-color: var(--at-lime); }
[data-direction="b"] .stats-band .sec-head .sec-no { color: var(--at-navy); background: var(--at-lime); }
.stat-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.16); border-radius: var(--r-lg); overflow: hidden;
}
.stat-cell { background: var(--at-navy); padding: clamp(22px, 3vw, 34px); }
.stat-cell .stat-val {
  font-family: var(--font-display); font-weight: var(--fw-black);
  font-size: clamp(34px, 4.4vw, 56px); line-height: 1; color: #fff; letter-spacing: -0.02em;
}
.stat-cell .stat-val .unit { font-size: 0.42em; color: var(--at-lime); font-weight: var(--fw-bold); letter-spacing: 0; }
.stat-cell .stat-label {
  font-size: var(--fs-14); color: rgba(255,255,255,.74); margin-top: 10px; line-height: 1.4;
}
.stat-cell .stat-note { font-size: var(--fs-12); color: var(--at-lime); margin-top: 6px; font-weight: 500; }

/* ===================== PHOTO GALLERY ===================== */
.gallery { display: grid; gap: 14px; }
.gallery.cols-3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.gallery.cols-3 image-slot:nth-child(1) { grid-row: span 2; height: 100%; min-height: 360px; }
.gallery.cols-3 image-slot { width: 100%; height: 100%; min-height: 173px; }

/* ===================== PULL QUOTE ===================== */
.pullquote { margin: clamp(36px, 5vw, 64px) 0; max-width: 880px; }
.pullquote blockquote {
  margin: 0; font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: clamp(24px, 3.4vw, 40px); line-height: 1.18; letter-spacing: -0.02em;
  color: var(--at-navy); text-wrap: balance;
}
.pullquote .pq-mark { color: var(--at-lime); }
.pullquote cite {
  display: block; margin-top: 18px; font-style: normal;
  font-size: var(--fs-14); color: var(--fg-2); font-family: var(--font-body); font-weight: 500;
}
[data-direction="c"] .pullquote { text-align: center; margin-inline: auto; }

/* ===================== MAP / LOCATION ===================== */
.locate { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(28px, 4vw, 56px); align-items: center; }
.map-figure {
  position: relative; border-radius: var(--r-lg); overflow: hidden;
  border: 1px solid var(--border-soft); box-shadow: var(--shadow-1);
  background: #e9ece3;
  aspect-ratio: 4/3;
}
.map-figure .map-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(41,48,114,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(41,48,114,.07) 1px, transparent 1px);
  background-size: 38px 38px;
}
.map-figure .map-road { position: absolute; background: #fff; box-shadow: 0 0 0 1px var(--border-soft); }
.map-figure .map-river { position: absolute; background: #bcd4dd; }
.map-figure .map-pin {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%,-100%);
  display: flex; flex-direction: column; align-items: center; gap: 4px; z-index: 2;
}
.map-figure .map-pin .pin-dot {
  width: 18px; height: 18px; border-radius: 999px 999px 999px 2px;
  background: var(--at-lime); border: 3px solid var(--at-navy); transform: rotate(45deg);
}
.map-figure .map-pin .pin-label {
  font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 12px;
  color: var(--at-navy); background: rgba(251,250,247,.9); padding: 3px 8px; border-radius: var(--r-pill);
  transform: rotate(0); white-space: nowrap;
}
.map-figure .map-tag {
  position: absolute; font-family: var(--font-body); font-size: 11px; font-weight: 600;
  color: var(--at-stone-500);
}
.drive-list { list-style: none; margin: 0; padding: 0; }
.drive-list li {
  display: flex; align-items: baseline; gap: 14px;
  padding: 16px 0; border-bottom: 1px solid var(--border-soft);
}
.drive-list li:first-child { padding-top: 0; }
.drive-list .d-place { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-18); color: var(--at-navy); }
.drive-list .d-mode { font-size: 0.8125rem; color: var(--fg-2); margin-top: 2px; }
.drive-list .d-time {
  margin-left: auto; font-family: var(--font-display); font-weight: var(--fw-heavy);
  font-size: var(--fs-20); color: var(--at-navy); white-space: nowrap;
}
.drive-list .d-time small { font-size: 12px; color: var(--fg-2); font-weight: 500; }

/* ===================== NEIGHBORHOOD / HOUSING CARDS ===================== */
.nb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.nb-card {
  background: var(--at-paper); border: 1px solid var(--border-soft);
  border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-1);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  display: flex; flex-direction: column;
}
.nb-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
.nb-card image-slot { width: 100%; height: 190px; }
.nb-card .nb-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.nb-card .nb-name { font-family: var(--font-display); font-weight: var(--fw-heavy); font-size: var(--fs-20); color: var(--at-navy); letter-spacing: -0.01em; }
.nb-card .nb-desc { font-size: var(--fs-14); line-height: 1.55; color: var(--fg-2); }
.nb-card .nb-tag {
  margin-top: auto; align-self: flex-start;
  font-size: var(--fs-12); font-weight: 600; color: var(--at-navy);
  background: var(--at-lime-200); padding: 5px 11px; border-radius: var(--r-pill);
}

/* ===================== AMENITIES / SCHOOLS ===================== */
.amenity-cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 56px); }
.amenity-list { list-style: none; margin: 0; padding: 0; }
.amenity-list li {
  display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start;
  padding: 14px 0; border-bottom: 1px solid var(--border-soft);
}
.amenity-list li:first-child { padding-top: 0; }
.amenity-list .am-ic {
  width: 38px; height: 38px; border-radius: var(--r-md);
  background: var(--at-stone-50); border: 1px solid var(--border-soft);
  display: grid; place-items: center; color: var(--at-navy);
}
.amenity-list .am-ic svg { width: 20px; height: 20px; }
.amenity-list .am-name { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-16); color: var(--at-navy); }
.amenity-list .am-meta { font-size: 0.8125rem; color: var(--fg-2); margin-top: 2px; }
.school-block { background: var(--at-stone-50); border: 1px solid var(--border-soft); border-radius: var(--r-lg); padding: clamp(22px, 3vw, 32px); }
.school-block h3 { margin: 0 0 6px; color: var(--at-navy); }
.school-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-soft); }
.school-row:last-child { border-bottom: 0; padding-bottom: 0; }
.school-row .sr-name { font-weight: 600; color: var(--at-stone-700); font-size: 0.9375rem; }
.school-row .sr-grade { font-size: 0.8125rem; color: var(--fg-2); }
.school-row .sr-score {
  font-family: var(--font-display); font-weight: var(--fw-heavy); font-size: var(--fs-16);
  color: var(--at-navy); background: var(--at-lime); padding: 3px 10px; border-radius: var(--r-pill);
}

/* ===================== COMPARE TABLE ===================== */
.compare-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.compare {
  width: 100%; border-collapse: separate; border-spacing: 0; min-width: 680px;
  background: var(--at-paper); border: 1px solid var(--border-soft);
  border-radius: var(--r-lg); overflow: hidden;
}
.compare th, .compare td { padding: 16px 18px; text-align: left; font-size: 0.9375rem; }
.compare thead th {
  background: var(--at-navy); color: #fff; font-family: var(--font-display);
  font-weight: var(--fw-bold); font-size: var(--fs-14); letter-spacing: 0.01em;
}
.compare thead th:first-child { background: var(--at-navy-900); }
.compare tbody th {
  font-family: var(--font-display); font-weight: var(--fw-bold); color: var(--at-navy);
  background: var(--at-stone-50); white-space: nowrap;
}
.compare tbody td { color: var(--at-stone-700); border-top: 1px solid var(--border-soft); }
.compare tbody th { border-top: 1px solid var(--border-soft); }
.compare .col-home { box-shadow: inset 3px 0 0 var(--at-lime), inset -3px 0 0 var(--at-lime); position: relative; }
.compare thead .col-home { background: var(--at-royal); }
.compare tbody .col-home { background: var(--at-lime-200); color: var(--at-navy); font-weight: 600; }
.compare-note { font-size: var(--fs-12); color: var(--fg-3); margin-top: 12px; }

/* ===================== TIPS ===================== */
.tips-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.tip {
  background: var(--at-paper); border: 1px solid var(--border-soft); border-left: 3px solid var(--at-lime);
  border-radius: var(--r-md); padding: 22px 24px;
}
.tip h4 { margin: 0 0 8px; color: var(--at-navy); font-size: var(--fs-18); }
.tip p { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--fg-2); }

/* ===================== AGENT CTA ===================== */
.cta {
  background: var(--at-navy); background-image: url("../assets/bg-blue.png");
  background-size: cover; background-position: center; color: #fff;
}
.cta-inner { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.cta .agent { display: flex; align-items: center; gap: 18px; }
.cta .agent image-slot { width: 96px; height: 96px; flex-shrink: 0; }
.cta .agent .ag-name { font-family: var(--font-display); font-weight: var(--fw-heavy); font-size: var(--fs-20); color: #fff; }
.cta .agent .ag-role { font-size: var(--fs-14); color: var(--at-lime); margin-top: 3px; }
.cta .agent .ag-line { font-size: 0.8125rem; color: rgba(255,255,255,.78); margin-top: 8px; }
.cta .cta-eyebrow { color: var(--at-lime); }
.cta h2 { font-family: var(--font-display); font-weight: var(--fw-black); font-size: clamp(30px, 4vw, 50px); line-height: 1.02; letter-spacing: -0.025em; color: #fff; margin: 14px 0 14px; text-wrap: balance; }
.cta .cta-sub { font-size: var(--fs-18); color: rgba(255,255,255,.86); max-width: 460px; margin: 0 0 26px; }
.cta-form { display: flex; flex-direction: column; gap: 12px; max-width: 440px; }
.cta-form .row { display: flex; gap: 12px; }
.cta-form input {
  flex: 1; width: 100%; border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.08);
  color: #fff; font-family: var(--font-body); font-size: var(--fs-16); padding: 14px 16px; border-radius: var(--r-md);
  outline: none; transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.cta-form input::placeholder { color: rgba(255,255,255,.55); }
.cta-form input:focus { border-color: var(--at-lime); background: rgba(255,255,255,.12); }
.cta-form .btn-accent {
  background: var(--at-lime); color: var(--at-navy); font-family: var(--font-body); font-weight: 700;
  font-size: var(--fs-16); border: 0; padding: 15px 22px; border-radius: var(--r-md);
  transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.cta-form .btn-accent:hover { background: var(--at-lime-600); }
.cta-form .btn-accent:active { transform: scale(.985); }
.cta-fine { font-size: var(--fs-12); color: rgba(255,255,255,.6); margin-top: 4px; }
.cta-confirm {
  background: rgba(201,226,101,.14); border: 1px solid var(--at-lime); border-radius: var(--r-lg);
  padding: 22px 24px; color: #fff; font-size: var(--fs-16);
}
.cta-confirm strong { color: var(--at-lime); font-family: var(--font-display); }

/* ===================== FOOTER ===================== */
.guide-footer { background: var(--at-navy-900); color: rgba(255,255,255,.8); padding: clamp(40px, 5vw, 64px) 0 32px; }
.guide-footer .gf-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.guide-footer img { height: 34px; margin-bottom: 14px; }
.guide-footer .gf-blurb { font-size: var(--fs-14); line-height: 1.6; color: rgba(255,255,255,.7); max-width: 360px; margin: 0; }
.guide-footer .gf-contact { font-size: var(--fs-14); line-height: 1.9; }
.guide-footer .gf-contact a { color: rgba(255,255,255,.85); text-decoration: none; }
.guide-footer .gf-contact a:hover { color: var(--at-lime); }
.guide-footer .gf-contact .gf-h { display: block; font-family: var(--font-display); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--at-lime); margin-bottom: 6px; font-weight: 700; }
.guide-footer .gf-base {
  border-top: 1px solid rgba(255,255,255,.1); margin-top: 36px; padding-top: 22px;
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px;
  font-size: var(--fs-12); color: rgba(255,255,255,.5);
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 880px) {
  [data-direction="b"] .cover-b { grid-template-columns: 1fr; }
  .cover-b .cb-photo { min-height: 300px; }
  .intro, .locate, .cta-inner, .amenity-cols { grid-template-columns: 1fr; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .nb-grid { grid-template-columns: 1fr 1fr; }
  .tips-grid { grid-template-columns: 1fr; }
  .gallery.cols-3 { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .gallery.cols-3 image-slot:nth-child(1) { grid-column: span 2; grid-row: auto; min-height: 240px; }
  .readerbar .rb-title { display: none; }
}
@media (max-width: 560px) {
  .stat-grid { grid-template-columns: 1fr; }
  .nb-grid { grid-template-columns: 1fr; }
  .cover-meta { font-size: 0.8125rem; }
}

/* ===================== PRINT ===================== */
@media print {
  @page { size: letter; margin: 0.6in 0.7in; }
  html { scroll-behavior: auto; }
  body { background: #fff; }
  .sheet { width: 100%; box-shadow: none; }
  .readerbar, .tweaks-host, .no-print { display: none !important; }
  section.block { padding: 28px 0; break-inside: avoid-page; }
  .block + .block { border-top: 1px solid var(--border-soft); }
  .cover-a { height: 92vh; min-height: 680px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .stats-band, .cta, .cover-b .cb-panel, .guide-footer, .compare thead th, .stat-cell, .school-row .sr-score, .compare tbody .col-home {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  .nb-card, .tip, .school-block, .map-figure, .pullquote, .stat-grid, .intro, .locate { break-inside: avoid; }
  .sec-head { break-after: avoid; }
  .cover, .stats-band, .cta { break-after: page; }
  a { text-decoration: none; color: inherit; }
}

/* color-exact for on-screen brand bands too */
.stats-band, .cta, .cover-b .cb-panel { -webkit-print-color-adjust: exact; print-color-adjust: exact; }