/* ── FLATTENED 2026-06-15: hybrid-base + scale-base + scheme inlined (no @import; same cascade order, 1 request instead of 3) ── */
/* ════════════════════════════════════════════════════════════════════════
 * PALETTE SANDBOX — HYBRID ROUND shared base (2026-06-11)
 * Dev-only (cooperbeitman.com / localhost). NEVER deploy — see CLAUDE.md.
 *
 * The verdict layer assembled from the richness round, identical across
 * all three candidates (they differ ONLY in photo-band intensity):
 *   1. Global spacing tightened ~20-25% (the dead-space fix)
 *   2. The colonial-village DEPTH About treatment, adopted as-is
 *   3. The dutchess PRICE-POP At a Glance (navy anchor, ice linework)
 *   4. Photo-band primitives (.hy-band custom properties consumed by the
 *      per-candidate files; gradient where text sits, scroll attachment
 *      on mobile)
 * ════════════════════════════════════════════════════════════════════════ */

/* ── 1. SPACING: ~20-25% tighter everywhere ──────────────────────────── */
.section { padding: 4.2rem 1.5rem; }
.section-header { margin-bottom: 2.3rem; }
.cintro { padding: 3.8rem 1.5rem; }
.cintro-eyebrow { margin-bottom: 1.5rem; }
.cintro-subhead { margin-bottom: 1.9rem; }
.cintro-meta-block { margin-bottom: 2.1rem; }
.cintro-meta-block::before,
.cintro-meta-block::after { margin: 1rem auto; }
.cglance { padding: 2.1rem 1.5rem; }
.cpets { padding: 2.8rem 1.5rem; }
.csisters { padding: 2rem 1.5rem; }
.cunit-grid { gap: 1.4rem; }
.cvoices-grid { gap: 1.9rem; }
.camen-categories { gap: 2rem; }
.cvisit-grid { gap: 2.3rem; }
.coverview-grid { gap: 3.2rem; }
.cvisit-map { margin-top: 2.6rem; }
.cfoot { padding: 2.4rem 1.5rem 1.3rem; }
@media (max-width: 768px) {
  .section { padding: 2.7rem 1.25rem; }
  .cintro { padding: 2.4rem 1.25rem; }
}

/* Orphan-card width formula re-derived for the 1.4rem gap (desktop only) */
.cunit-grid > .cunit-card:last-child:nth-child(odd) {
  max-width: calc((100% - 1.4rem) / 2);
}
@media (max-width: 768px) {
  .cunit-grid > .cunit-card:last-child:nth-child(odd) { max-width: 100%; }
}

/* ── 2. DEPTH ABOUT (colonial-village treatment, as-is) ──────────────── */
.coverview-img {
  box-shadow: 0 1px 2px rgba(13, 38, 66, .06), 0 8px 24px rgba(13, 38, 66, .08);
}
.coverview-img img { box-shadow: none; }
.coverview-address {
  box-shadow: 0 1px 2px rgba(13, 38, 66, .06), 0 8px 24px rgba(13, 38, 66, .08);
}
/* the section-edge "fold" under the glance band's bottom rule */
.cresidences {
  background-image: linear-gradient(to bottom, rgba(13, 38, 66, .035), transparent 44px);
}

/* ── 3. PRICE-POP AT A GLANCE (dutchess navy anchor, as-is) ──────────── */
.cglance {
  background: #0a1628;
  color: #ffffff;
  border-top: 2px solid #9fd0f0;
  border-bottom: 2px solid #9fd0f0;
}
.cglance-item { border-left: 1px solid rgba(159, 208, 240, .35); }
.cglance-item:first-child { border-left: 0; }
.cglance-value { color: #9fd0f0; }                   /* 11.01 AAA */
.cglance-label { color: rgba(255, 255, 255, .65); }  /*  8.05 AAA */
.cglance-item.feature .cglance-value { color: #9fd0f0; }
.cglance-item.feature .cglance-label { color: rgba(255, 255, 255, .65); }
@media (max-width: 1024px) {
  .cglance-item:nth-child(3), .cglance-item:nth-child(4) {
    border-top: 1px solid rgba(159, 208, 240, .35);
  }
}
@media (max-width: 480px) {
  .cglance-item:nth-child(n) { border-top: 1px solid rgba(159, 208, 240, .35); }
  .cglance-item:first-child { border-top: 0; }
}

/* ── 4. PHOTO-BAND PRIMITIVE ─────────────────────────────────────────────
 * Per-candidate files apply this pattern to chosen sections:
 *   .hy-band-section {
 *     background-image: var(--band-grad), url('…');
 *     background-size: cover; background-position: …;
 *     background-attachment: fixed;   ← desktop polish, NOT a JS parallax
 *   }
 * The gradient guarantees text legibility wherever copy sits. */
:root {
  --band-grad: linear-gradient(to bottom,
               rgba(7, 14, 24, .62) 0%,
               rgba(7, 14, 24, .45) 45%,
               rgba(7, 14, 24, .62) 100%);
}

/* ════════════════════════════════════════════════════════════════════════
 * COLEMAN SCALE-CONTRAST — LIVE production base (promoted 2026-06-15)
 * Was the sandbox scale round; now the shipped community-page design. SHIPS.
 *
 * THE VERDICT BASE, identical on all 8 variants (variant 1 black-rock is
 * built to exactly this and nothing more = the control):
 *   • Established base via hybrid-base (tight spacing, depth About, navy
 *     price band) — the band layout IS the brittany price-bar style
 *   • Townhomes scale-contrast composition: oversized display headlines,
 *     giant in-bar stat numerals (2.6rem / feature 3.6rem — the 5rem
 *     extreme pulled back so the brittany bar layout holds), the
 *     full-width flanked pull-quote (section numbers removed per final verdict)
 *   • DISPLAY TEXT goes luminous navy #14365c (12.3:1 on white) — reads
 *     unmistakably blue where #0a1628 read flat black; body copy stays
 *     near-black for small-size readability (judgment call per brief)
 *   • APPLY pops (corrected): solid #2f6e96 with white text, bright
 *     #4a90c2 hover flare — the only filled button, cool not warm
 * Per-variant files add ONLY their aerial band photo + their mechanism.
 * ════════════════════════════════════════════════════════════════════════ */
:root {
  --display-navy: #14365c;   /* the headline blue — 12.3:1 on white */
  --apply-pop:    #2f6e96;   /* cool pop — white text 5.54:1 */
  --apply-pop-h:  #4a90c2;   /* hover flare — navy text 5.23:1 */
}

/* ── 1. SCALE-CONTRAST TYPOGRAPHY ────────────────────────────────────── */
.section-title {
  font-size: clamp(2.8rem, 5.5vw, 4.4rem);
  line-height: 1.05;
  text-wrap: balance;
}
.cintro-subhead { font-size: 2.8rem; line-height: 1.25; }
.cfloorplan figcaption { font-size: 1.35rem; }
.cunit-name { font-size: 1.7rem; }
/* giant in-bar numerals on the brittany-style navy band */
.cglance-value { font-size: 2.6rem; line-height: 1.05; text-wrap: balance; }
.cglance-item.feature .cglance-value { font-size: 3.6rem; }
.cglance-label { font-size: .58rem; }
/* the one-word city panel collides at giant sizes (prior-round lesson) */
.cglance-item:last-child:not(.feature) .cglance-value { font-size: 2.1rem; }

/* full-width flanked pull-quote (the townhomes intro treatment) */
.cintro-inner { max-width: 1100px; position: relative; }
.cintro-subhead { position: relative; z-index: 1; }
.cintro-inner::before,
.cintro-inner::after {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 7.5rem;
  line-height: 1;
  color: #4a90c2;
  opacity: .2;
  position: absolute;
  z-index: 0;
  pointer-events: none;
}
.cintro-inner::before { content: '\201C'; top: 1.4rem; left: -.5rem; }
.cintro-inner::after  { content: '\201D'; top: 1.4rem; right: -.5rem; }

/* section numbers REMOVED (final style verdict 2026-06-12) — headings
 * stand alone, no numerals */

/* ── 2. DISPLAY TEXT → LUMINOUS NAVY (black retired from display) ────── */
.cnav-name,
.section-title,
.cintro-subhead,
.cintro-meta,
.coverview-text h2,
.camen-cat-title,
.cvisit-block h3,
.cunit-name,
.cpets-title,
.cfloorplan figcaption,
.csisters-list a,
.cfoot-brand .name { color: var(--display-navy); }
/* bands/dark sections keep their own light display colors — re-assert */
.cglance-value, .cglance-item.feature .cglance-value { color: #9fd0f0; }

/* ── 3. APPLY POPS (corrected: amber rejected — cool pop): solid deep
 *    blue, white text, bright #4a90c2 flare on hover. Filled = the only
 *    solid button on the page, so it still reads unmissable. ─────────── */
.cnav-cta {
  background: var(--apply-pop);
  border: 2px solid var(--apply-pop);
  color: #ffffff;
  font-weight: 700;
  padding: calc(.55rem - 2px) calc(1.1rem - 2px);
}
.cnav-cta:hover { background: var(--apply-pop-h); border-color: var(--apply-pop-h); color: #0a1628; }
/* the transparent-header state keeps it amber too (it should pop on the photo) */
.cnav:not(.scrolled):not(.menu-open) .cnav-cta {
  background: var(--apply-pop);
  border-color: #ffffff;
  color: #ffffff;
  text-shadow: none;
}
.cnav:not(.scrolled):not(.menu-open) .cnav-cta:hover { background: var(--apply-pop-h); border-color: #ffffff; color: #0a1628; }
.cunit-apply {
  background: var(--apply-pop);
  border: 2px solid var(--apply-pop);
  color: #ffffff;
  font-weight: 700;
  padding: calc(.55rem - 1px) calc(.95rem - 1px);
}
.cunit-apply:hover { background: var(--apply-pop-h); border-color: var(--apply-pop-h); color: #0a1628; }
@media (max-width: 768px) {
  .cnav-links a.cnav-apply-mobile {
    background: var(--apply-pop);
    border: 2px solid var(--apply-pop);
    color: #ffffff;
    font-weight: 700;
  }
  .cnav-links a.cnav-apply-mobile:hover { background: var(--apply-pop-h); border-color: var(--apply-pop-h); color: #0a1628; }
}

/* ── RESPONSIVE SCALE-DOWNS (this file outranks baseline media rules) ── */
@media (max-width: 1024px) {
  .section-title { font-size: clamp(2.4rem, 4.8vw, 3.3rem); }
  .cintro-subhead { font-size: 2.25rem; }
}
@media (max-width: 768px) {
  .section-title { font-size: 2.3rem; }
  .cintro-subhead { font-size: 1.85rem; }
  .cglance-value { font-size: 2rem; }
  .cglance-item.feature .cglance-value { font-size: 2.7rem; }
  .cglance-item:last-child:not(.feature) .cglance-value { font-size: 1.8rem; }
  .cintro-inner::before, .cintro-inner::after { font-size: 4.5rem; }
}
@media (max-width: 480px) {
  .section-title { font-size: 1.95rem; }
  .cintro-subhead { font-size: 1.55rem; }
}


/* ════════════════════════════════════════════════════════════════════════
 * SPEC CORRECTIONS (round 9)
 * ════════════════════════════════════════════════════════════════════════ */

/* ── CORRECTION 2: top bar pushes harder ─────────────────────────────── */
.cnav-name { font-size: 2rem; font-weight: 700; }
.cnav-links a {
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .16em;
}
.cnav-rt-toggle { font-size: .74rem; font-weight: 700; letter-spacing: .16em; }
/* solid state: full-strength luminous navy, not the muted rgba */
.cnav.scrolled .cnav-links > a:not(.cnav-apply-mobile),
.cnav.menu-open .cnav-links > a:not(.cnav-apply-mobile),
.cnav.scrolled .cnav-rt-toggle,
.cnav.menu-open .cnav-rt-toggle { color: var(--display-navy); }
.cnav.scrolled .cnav-links > a:not(.cnav-apply-mobile):hover,
.cnav.scrolled .cnav-rt-toggle:hover { color: #4a90c2; }
/* transparent state: crisp white at the heavier weight + stronger scrim */
.cnav:not(.scrolled):not(.menu-open) .cnav-links > a:not(.cnav-apply-mobile),
.cnav:not(.scrolled):not(.menu-open) .cnav-rt-toggle {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .8), 0 2px 8px rgba(0, 0, 0, .55);
}
.cnav::before {
  background: linear-gradient(to bottom,
              rgba(8, 16, 28, .64) 0%,
              rgba(8, 16, 28, .4) 62%,
              rgba(8, 16, 28, 0) 100%);
}

/* ── CORRECTION 3: alignment craft pass ──────────────────────────────────
 * Centered tracked-uppercase lines carry a trailing letter-space that
 * shifts glyphs left of optical center — compensate with padding-left
 * equal to one tracking unit. The price bar especially (its labels and
 * the location line read off-center). */
.cglance-label { padding-left: .2em; }
.eyebrow { padding-left: .22em; }
.cintro-eyebrow { padding-left: .28em; }
.cintro-meta { padding-left: .22em; }
.cvoices-source { padding-left: .2em; }
.csisters-label { padding-left: .26em; }
.chero-tag-text { padding-left: .22em; }
/* numeral/label rhythm: one consistent gap in every glance panel */
.cglance-value { margin-bottom: .4rem; }
.cglance-item.feature .cglance-value { margin-bottom: .4rem; }
/* the location panel's two-line label centers like the others */
.cglance-label { line-height: 1.5; }

/* ── CORRECTION 4: the wide canvas — kill the side dead-room ─────────── */
.cglance-inner,
.cunit-grid,
.camen-categories,
.cpets-inner,
.cvoices-grid,
.cvisit-grid,
.coverview-grid,
.cfloorplans-grid,
.csisters-inner,
.cfoot-inner { max-width: 1360px; }
.cvisit-map { max-width: 1360px; }
.caerial-video { max-width: 1280px; }
.section-header { max-width: 800px; }
/* photo-led surfaces run wider still */
.cgallery-grid { max-width: 1520px; grid-auto-rows: 240px; }
/* rebalance interiors for the wider canvas */
.cvoices-grid { gap: 2.4rem; }
.camen-categories { gap: 2.4rem; grid-template-columns: repeat(auto-fit, minmax(220px, 300px)); }
.cunit-grid { gap: 1.6rem; }
.cunit-grid > .cunit-card:last-child:nth-child(odd) {
  max-width: calc((100% - 1.6rem) / 2);
}
@media (max-width: 768px) {
  .cunit-grid > .cunit-card:last-child:nth-child(odd) { max-width: 100%; }
}

/* ════════════════════════════════════════════════════════════════════════
 * PET POLICY → full-width policy bar (shared across all 8 communities)
 *
 * Replaces the lonely-card-in-a-band treatment. A navy Linework band carries
 * a centered header (paw + eyebrow + serif title), then one full-width white
 * "policy bar" per pet — a paw badge + the pet type (serif) beside the
 * Allowance and Fees facts, split by hairline rules. One pet (Coleman, cat
 * only) → one rich full-width bar, never a stranded box; two pets (Brittany,
 * cat + dog) → two stacked bars. Every value is the page's real $pets data;
 * the column labels are static UI scaffolding. Matched to Amenities' caliber.
 * Per-scheme .cpets overrides were removed so this single source governs.
 * ════════════════════════════════════════════════════════════════════════ */
.cpets {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(140% 120% at 50% -10%, rgba(74, 144, 194, .22) 0%, rgba(74, 144, 194, 0) 55%),
    linear-gradient(165deg, #0e2440 0%, #0a1628 58%, #0c2138 100%);
  color: #ffffff;
  padding: 5.5rem 1.5rem;
  overflow: hidden;
}
/* faint diagonal Linework rules — structure, not noise */
.cpets::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(159, 208, 240, .06) 0,
    rgba(159, 208, 240, .06) 1px,
    transparent 1px,
    transparent 22px);
}
.cpets-inner {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 1180px;
  margin: 0 auto;
  text-align: left;
}
/* header spans the full row, centered above the card(s) */
.cpets-title {
  flex: 0 0 100%;
  text-align: center;
  color: #ffffff;
  font-family: var(--serif);
  font-size: clamp(2.1rem, 3.6vw, 3rem);
  font-weight: 600;
  line-height: 1.1;
  margin: 0 0 1.6rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}
.cpets-title::before {
  content: "";
  display: block;
  width: 44px;
  height: 44px;
  margin: 0 auto 1rem;
  background: center/contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%239fd0f0'%3E%3Ccircle cx='5.5' cy='12.5' r='2.1'/%3E%3Ccircle cx='9.7' cy='7.5' r='2.1'/%3E%3Ccircle cx='14.3' cy='7.5' r='2.1'/%3E%3Ccircle cx='18.5' cy='12.5' r='2.1'/%3E%3Cellipse cx='12' cy='16.2' rx='3.7' ry='3.2'/%3E%3C/svg%3E");
}
.cpets-title small {
  display: block;
  font-family: var(--sans);
  font-size: .62rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: #9fd0f0;
  font-weight: 600;
  margin-bottom: .7rem;
}
/* full-width policy bar — one per pet; labelled columns split by hairlines */
.cpets-card {
  display: grid;
  grid-template-columns: minmax(240px, 1.1fr) 1fr 1fr;
  align-items: stretch;
  background: #ffffff;
  border: 0;
  border-top: 3px solid #4a90c2;
  border-radius: 4px;
  box-shadow: 0 18px 44px rgba(4, 12, 24, .42);
  overflow: hidden;
}
/* column 1 — paw badge + pet type */
.cpets-card h4 {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0;
  padding: 1.9rem 2rem;
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.15;
  color: var(--display-navy);
}
.cpets-card h4::before {
  content: "";
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid #d4e6f5;
  background: #eaf3fb center/26px 26px no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232f6e96'%3E%3Ccircle cx='5.5' cy='12.5' r='2.1'/%3E%3Ccircle cx='9.7' cy='7.5' r='2.1'/%3E%3Ccircle cx='14.3' cy='7.5' r='2.1'/%3E%3Ccircle cx='18.5' cy='12.5' r='2.1'/%3E%3Cellipse cx='12' cy='16.2' rx='3.7' ry='3.2'/%3E%3C/svg%3E");
}
/* columns 2 & 3 — micro-labelled facts (the <p> detail and .cpets-fee) */
.cpets-card p {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 0;
  padding: 1.9rem 2rem;
  border-left: 1px solid #e9eef5;
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 500;
  color: #243a55;
}
.cpets-card p::before {
  content: "Allowance";
  font-family: var(--sans);
  font-size: .6rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #2f6e96;
  font-weight: 700;
  margin-bottom: .5rem;
}
.cpets-card .cpets-fee {
  margin-top: 0 !important;
  font-size: 1rem !important;
  font-style: normal;
  letter-spacing: 0;
  color: var(--display-navy) !important;
  font-weight: 600;
}
.cpets-card .cpets-fee::before { content: "Fees"; }

@media (max-width: 760px) {
  .cpets { padding: 4rem 1.25rem; }
  .cpets-card { grid-template-columns: 1fr; }
  .cpets-card h4 { padding: 1.6rem 1.6rem 1.2rem; }
  .cpets-card p {
    border-left: 0;
    border-top: 1px solid #e9eef5;
    padding: 1.3rem 1.6rem;
  }
}

/* ════════════════════════════════════════════════════════════════════════
 * FINAL STYLE ROLLOUT — COLEMAN WIDTH-ALTERNATION SYSTEM (black-rock)
 * Dev-only. NEVER deploy — see CLAUDE.md.
 *
 * Ported from the winning scheme-coleman.css with per-page judgment:
 * this page HAS an aerial section, so the ONE photo band stays there
 * (block ported verbatim from the prior control file — hero pano at
 * 78% 65%). Pets and Voices therefore both take the clean treatment:
 * Voices clean white, Pets white boxed cards.
 *
 * System: scale-base (locked spec, NO section numbers) + width
 * alternation — sections swing between contained and full-bleed:
 *   intro (contained 1100) → glance (navy full band, base) →
 *   residences (contained, base 1360) → AMENITIES (full-bleed pale tint
 *   #e8f1f8, content widened to ~1600) → GALLERY (edge-to-edge photo
 *   wall: max-width none, 6px gutters, 250px rows — includes the
 *   laundry/gym tiles with corrected alts; real amenities, they stay) →
 *   AERIAL (full-bleed photo band) → pets/voices (contained, clean) →
 *   visit (contained blocks + FULL-BLEED map flush to the section
 *   bottom) → overview (contained, depth About) → sisters strip.
 * Full-bleed via negative margins matching the .section gutter (1.5rem
 * desktop / 1.25rem ≤768) — width:auto where community.css sets
 * width:100% (prior-round lesson: 100% + negative margins = right gap).
 * ════════════════════════════════════════════════════════════════════════ */
/* ── THE BAND: Aerial section over the hero panorama (no aerial poster
 *    exists for this page; the slice favors the brick buildings and trims
 *    the overcast sky — the misnamed exterior-01/02 interiors avoided) ── */
.caerial {
  background-image: var(--band-grad), url('/images/black-rock-gardens/black-rock-gardens-exterior-hero.jpg');
  background-size: cover;
  background-position: 78% 65%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #ffffff;
}
@media (max-width: 1024px) {
  .caerial { background-attachment: scroll; }
}
.caerial .eyebrow { color: #9fd0f0; text-shadow: 0 1px 3px rgba(0, 0, 0, .5); }
.caerial .section-title { color: #ffffff; text-shadow: 0 1px 3px rgba(0, 0, 0, .55); }
.caerial .section-sub { color: rgba(255, 255, 255, .85); text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
.caerial-video {
  border: 2px solid #9fd0f0;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
}
.caerial-play { border-color: #9fd0f0; background: rgba(7, 14, 24, .5); }
.caerial-play svg { fill: #9fd0f0; }
.caerial-poster:hover .caerial-play { background: rgba(7, 14, 24, .75); border-color: #ffffff; }

/* ── CLEAN SLOTS: the band lives on Aerial, so both quiet sections stay
 *    contained and clean (the coleman pets/voices correction, applied to
 *    this page's layout) ──────────────────────────────────────────────── */
/* Resident Voices: clean white — quotes read easily */
.cvoices { background: #ffffff; }

/* ── WIDTH 1: GALLERY → edge-to-edge photo wall ───────────────────────
 * Grid breaks out of the contained column to the viewport edges (negative
 * margins eat the section's 1.5rem gutter; width stays auto so both
 * edges land flush). Gutters shrink to 6px and rows grow to 250px so it
 * reads as a wall of photographs, not a contained collage. Re-fit note:
 * scale-base caps its gallery at 1520 contained — these rules come
 * after the @import at equal specificity, so max-width:none still wins
 * and the wall stays a true 0→1920 bleed. ─────────────────────────────── */
.cgallery-grid {
  max-width: none;
  margin-left: -1.5rem;
  margin-right: -1.5rem;
  gap: 6px;
  grid-auto-rows: 250px;
}

/* ── WIDTH 2: AMENITIES → full-width pale tint band ───────────────────
 * The section box is already viewport-wide; community.css paints it
 * white — repaint ice-tint edge to edge, and spread the category columns
 * across ~1600px (contained is 1360, so 1600 keeps the swing legible).
 * Columns widened 340→400 so three columns still fill the span. ──────── */
.camen { background: #e8f1f8; }
.camen-categories {
  /* Multicol: 3 balanced columns. 3-category pages render one category per
   * column (unchanged); 4-category pages flow the 4th block under column 3
   * instead of orphaning it on a second row with dead space beside it. */
  display: block;
  column-count: 3;
  column-gap: 2.4rem;
  max-width: 1280px;
  grid-template-columns: none;
  justify-content: normal;
}
.camen-categories > div {
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
  margin: 0 0 2.4rem;
}
.camen-categories > div:last-child { margin-bottom: 0; }
@media (max-width: 980px) { .camen-categories { column-count: 2; } }
@media (max-width: 600px) { .camen-categories { column-count: 1; } }
.camen-cat-title { border-bottom-color: #9fc3dd; }

/* ── WIDTH 3: VISIT MAP → full-bleed, flush to the section bottom ─────
 * community.css sets width:100% on .cvisit-map; with negative margins
 * that leaves a right gap (prior-round lesson) — width:auto lets the box
 * stretch the full broken-out width. Frame chrome (radius, side/bottom
 * borders) dropped so the bleed is honest; section bottom padding zeroed
 * so the map sits flush against the About section. ────────────────────── */
.cvisit { padding-bottom: 0; }
.cvisit-map {
  max-width: none;
  width: auto;
  margin: 2.6rem -1.5rem 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  border-radius: 0;
}
.cvisit-map iframe { height: 520px; }

/* ── RESPONSIVE: full-bleed gutters track the .section padding ────────── */
@media (max-width: 1024px) {
  .cvisit-map iframe { height: 400px; }
}
@media (max-width: 768px) {
  .cgallery-grid {
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    gap: 6px;
  }
  .cvisit-map { margin: 2.5rem -1.25rem 0; }
  .cvisit-map iframe { height: 300px; }
}

/* EVEN/PROPORTION 2026-06-16: the scale pass stretched the price bar to
   max-width:1360 — the 4 stats spread too thin. Tighten so they read as one
   even, balanced cluster (consistent across all 8 community pages). */
.cglance-inner { max-width: 1240px !important; }
