/* comocamps Finder — layout, 3 card variants, event card, detail modal.
   Requires css/tokens.css + css/components.css (design-system primitives). */

:root { --bar-h: 132px; --cc-wrap: min(1200px, 92vw); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--black); font-family: var(--font-body); }
body.cc-noscroll { overflow: hidden; }
.cc-wrap { width: var(--cc-wrap); margin-inline: auto; }
button { font-family: inherit; }

/* ============ HEADER ============ */
.cc-head { background: var(--black); border-bottom: 3px solid var(--teal); }
.cc-head-row { display: flex; align-items: center; gap: 18px; padding: 14px 0; }
.cc-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.cc-tentbadge { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--teal); border: 2px solid #fff; box-shadow: 3px 3px 0 rgba(255,255,255,.25); color: #fff; flex: 0 0 auto; }
.cc-wm { font-family: var(--font-display); font-weight: 700; font-size: 26px; letter-spacing: -.03em; line-height: 1;
  display: inline-flex; align-items: baseline; text-shadow: 2px 0 0 rgba(20,168,155,.55); }
.cc-wm .a { color: #fff; } .cc-wm .b { color: var(--teal); text-shadow: 2px 0 0 rgba(31,24,16,.5); }
.cc-head-meta { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.cc-head-meta .loc { color: rgba(255,255,255,.62); font-family: var(--font-display); font-size: 12px; font-weight: 600;
  display: inline-flex; align-items: center; gap: 6px; }
.cc-head-meta .loc svg { color: var(--teal); }
.cc-getlisted { color: #fff; background: transparent; border: 2px solid rgba(255,255,255,.3); padding: 9px 15px;
  font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  text-decoration: none; transition: .15s; }
.cc-getlisted:hover { background: var(--teal); border-color: var(--teal); color: #fff; }
.cc-getlisted.is-on { background: var(--teal); border-color: var(--teal); color: #fff; }

/* ---- primary nav (shared chrome) ---- */
.cc-nav { display: flex; align-items: center; gap: 4px; margin-left: 6px; }
.cc-burger { display: none; }

/* ---- trust strip ---- */
.cc-trust { background: var(--cream-2); border-bottom: 2px solid var(--black); }
.cc-trust-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 7px 6px; padding: 9px 0; }
.cc-trust-i { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--ink-70); white-space: nowrap; }
.cc-trust-i b { color: var(--black); font-weight: 700; }
.cc-trust-i svg { color: var(--teal-dark); flex: 0 0 auto; }
.cc-trust-dot { color: var(--rule); }

/* ---- mobile nav (hamburger slide-over) ---- */
.cc-mobnav { position: fixed; inset: 0; z-index: 120; }
.cc-mobnav[hidden] { display: none; }
.cc-mobnav-scrim { position: absolute; inset: 0; background: rgba(31,24,16,.55); opacity: 0; transition: opacity .2s ease; }
.cc-mobnav.open .cc-mobnav-scrim { opacity: 1; }
.cc-mobnav-panel { position: absolute; top: 0; right: 0; height: 100%; width: min(320px, 84vw); background: var(--cream); border-left: 2px solid var(--black); box-shadow: -8px 0 0 rgba(20,168,155,.4); transform: translateX(100%); transition: transform .24s cubic-bezier(.2,.7,.2,1); display: flex; flex-direction: column; padding: 14px 16px 22px; gap: 2px; overflow-y: auto; }
.cc-mobnav.open .cc-mobnav-panel { transform: none; }
.cc-mobnav-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 0 14px; border-bottom: 2px solid var(--black); margin-bottom: 8px; }
.cc-mobnav-head .cc-wm { font-size: 22px; }
.cc-mobnav-close { background: var(--white); border: 2px solid var(--black); width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 2px 2px 0 var(--black); }
.cc-mobnav-a { display: block; padding: 14px 12px; font-family: var(--font-display); font-size: 17px; font-weight: 700; color: var(--black); text-decoration: none; border-bottom: 1px solid var(--rule); }
.cc-mobnav-a:hover, .cc-mobnav-a.is-on { color: var(--teal-dark); }
.cc-mobnav-cta { margin-top: 16px; justify-content: center; }
@media (max-width: 860px) {
  .cc-burger { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 2px solid rgba(255,255,255,.32); background: transparent; color: #fff; cursor: pointer; }
  .cc-burger:hover { background: var(--teal); border-color: var(--teal); }
}
@media (max-width: 600px) { .cc-head-meta .cc-getlisted { display: none; } }

/* ---- footer columns (shared chrome) ---- */
.cc-foot-cols { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 30px 24px; padding: 40px 0 28px; }
.cc-foot-brand { display: inline-flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 18px; }
.cc-foot-brand svg { color: var(--teal); } .cc-foot-brand b { color: #fff; }
.cc-foot-tag { color: rgba(255,255,255,.6); font-family: var(--font-body); font-size: 13px; line-height: 1.55; max-width: 38ch; margin: 12px 0 16px; }
.cc-foot-news label { display: block; font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: 7px; }
.cc-foot-news-row { display: flex; gap: 8px; }
.cc-foot-news-row input { flex: 1; min-width: 0; border: 2px solid var(--black); background: #fff; padding: 9px 11px; font-family: var(--font-body); font-size: 13px; }
.cc-foot-news-row .btn { flex: 0 0 auto; }
.cc-foot-thanks { color: var(--teal); font-family: var(--font-display); font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 7px; }
.cc-foot-col h4 { font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #fff; margin: 0 0 12px; }
.cc-foot-col a { display: block; color: rgba(255,255,255,.66); font-family: var(--font-display); font-size: 13.5px; font-weight: 600; text-decoration: none; padding: 5px 0; }
.cc-foot-col a:hover { color: var(--teal); }
.cc-foot-bottom { display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center; justify-content: space-between; padding: 16px 0 26px; border-top: 1px solid rgba(255,255,255,.14); font-family: var(--font-display); font-size: 12px; color: rgba(255,255,255,.55); }
.cc-foot-updated { display: inline-flex; align-items: center; gap: 6px; } .cc-foot-updated svg { color: var(--teal); }
@media (max-width: 860px) { .cc-foot-cols { grid-template-columns: 1fr 1fr; } .cc-foot-brandcol { grid-column: 1 / -1; } }
@media (max-width: 480px) { .cc-foot-cols { grid-template-columns: 1fr; } }

/* ---- saved pill + tray (§1.7) ---- */
.cc-saved { display: inline-flex; align-items: center; gap: 6px; border: 2px solid rgba(255,255,255,.3); background: transparent; color: #fff; padding: 8px 12px; font-family: var(--font-display); font-size: 12px; font-weight: 700; text-decoration: none; cursor: pointer; }
.cc-saved:hover { border-color: var(--pink); color: #fff; }
.cc-saved svg { color: rgba(255,255,255,.7); }
.cc-saved.has-n svg { color: var(--pink); }
.cc-saved-n { background: rgba(255,255,255,.16); color: #fff; border-radius: 999px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; padding: 0 5px; }
.cc-saved.has-n .cc-saved-n { background: var(--pink); }
@media (max-width: 640px) { .cc-saved .cc-saved-txt { display: none; } }
.cc-tray { position: fixed; inset: 0; z-index: 130; }
.cc-tray[hidden] { display: none; }
.cc-tray-scrim { position: absolute; inset: 0; background: rgba(31,24,16,.55); opacity: 0; transition: opacity .2s ease; }
.cc-tray.open .cc-tray-scrim { opacity: 1; }
.cc-tray-panel { position: absolute; top: 0; right: 0; height: 100%; width: min(380px, 88vw); background: var(--cream); border-left: 2px solid var(--black); box-shadow: -8px 0 0 rgba(255,79,139,.4); transform: translateX(100%); transition: transform .24s cubic-bezier(.2,.7,.2,1); display: flex; flex-direction: column; }
.cc-tray.open .cc-tray-panel { transform: none; }
.cc-tray-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 2px solid var(--black); background: var(--black); color: #fff; }
.cc-tray-head b { font-family: var(--font-display); font-size: 15px; display: inline-flex; align-items: center; gap: 8px; } .cc-tray-head b svg { color: var(--pink); }
.cc-tray-close { background: var(--white); border: 2px solid var(--black); width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.cc-tray-body { flex: 1; overflow-y: auto; padding: 12px 14px; }
.cc-tray-row { display: flex; align-items: center; gap: 10px; border: 2px solid var(--black); background: #fff; box-shadow: 2px 2px 0 var(--black); padding: 11px 12px; margin-bottom: 10px; }
.cc-tray-info { flex: 1; min-width: 0; text-decoration: none; color: var(--black); display: flex; flex-direction: column; gap: 2px; }
.cc-tray-info b { font-family: var(--font-display); font-size: 14px; line-height: 1.2; }
.cc-tray-info span { font-family: var(--font-display); font-size: 11px; font-weight: 600; color: var(--muted); }
.cc-tray-x { flex: 0 0 auto; background: var(--white); border: 2px solid var(--black); width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.cc-tray-x:hover { background: var(--pink); color: #fff; }
.cc-tray-empty { text-align: center; padding: 50px 20px; color: var(--ink-70); }
.cc-tray-empty svg { color: var(--muted); margin: 0 auto 12px; }
.cc-tray-empty p { font-family: var(--font-display); font-weight: 700; font-size: 16px; margin: 0 0 6px; }
.cc-tray-empty span { font-size: 13px; }
.cc-tray-foot { padding: 14px 18px; border-top: 2px solid var(--black); }
.cc-tray-foot[hidden] { display: none; }
.cc-tray-foot .btn { width: 100%; justify-content: center; }
.cc-tray-compare.is-disabled { opacity: .45; pointer-events: none; }

.cc-nav-a { color: rgba(255,255,255,.66); font-family: var(--font-display); font-size: 13px; font-weight: 700; letter-spacing: .02em; text-decoration: none; padding: 8px 12px; white-space: nowrap; transition: .12s; }
.cc-nav-a:hover { color: #fff; }
.cc-nav-a.is-on { color: var(--teal); }
@media (max-width: 860px) { .cc-nav { display: none; } }

/* shared footer (chrome) */
.cc-foot-brand { display: inline-flex; align-items: center; gap: 8px; }
.cc-foot-brand svg { color: var(--teal); } .cc-foot-brand b { color: #fff; }
.cc-foot-nav { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.cc-foot-nav a { color: var(--teal); font-weight: 700; white-space: nowrap; }
.cc-foot-note { margin-left: auto; }
@media (max-width: 720px) { .cc-foot-note { margin-left: 0; width: 100%; } }

/* ============ HERO STRIP ============ */
.cc-hero { position: relative; border-bottom: 2px solid var(--black); overflow: hidden;
  background: radial-gradient(circle at 12% 20%, rgba(20,168,155,.20) 0%, transparent 44%),
              radial-gradient(circle at 88% 30%, rgba(255,79,139,.16) 0%, transparent 44%),
              radial-gradient(circle at 60% 120%, rgba(255,182,39,.18) 0%, transparent 50%), var(--cream); }
.cc-hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(31,24,16,.07) 1px, transparent 1.5px); background-size: 4px 4px; pointer-events: none; }
.cc-hero .cc-wrap { position: relative; padding: 34px 0 30px; }
.cc-eyebrow { display: inline-block; background: var(--teal-dark); color: #fff; padding: 5px 16px 5px 12px; border: 2px solid var(--black); white-space: nowrap;
  font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; box-shadow: -2px 2px 0 var(--black); }
.cc-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(28px, 4.6vw, 46px); line-height: 1.06;
  letter-spacing: -.02em; margin: 16px 0 8px; max-width: 20ch; text-wrap: balance; text-shadow: 2px 0 0 rgba(20,168,155,.35); }
.cc-hero h1 .ann { font-family: var(--font-hand); font-size: .62em; color: var(--pink); margin-left: 10px; transform: rotate(-3deg); display: inline-block; text-shadow: none; }
.cc-hero .lede { font-size: 15.5px; line-height: 1.6; color: var(--ink-70); max-width: 60ch; margin: 0; }
.cc-hero-stats { display: flex; flex-wrap: wrap; gap: 8px 10px; margin-top: 18px; }
.cc-stat { display: inline-flex; align-items: center; gap: 6px; background: var(--white); border: 2px solid var(--black); white-space: nowrap;
  box-shadow: 2px 2px 0 var(--black); padding: 7px 12px; font-family: var(--font-display); font-size: 12px; font-weight: 700; }
.cc-stat svg { color: var(--teal); } .cc-stat b { color: var(--teal-dark); }

/* ============ STICKY FILTER BAR ============ */
.cc-filterbar { position: sticky; top: 0; z-index: 40; background: var(--white); border-bottom: 2px solid var(--black); box-shadow: 0 3px 0 rgba(31,24,16,.07); }
.cc-bar-1 { display: flex; align-items: center; gap: 12px; padding: 11px 0; }
.cc-filterbar .cc-bar-1, .cc-filterbar .cc-bar-2 { width: var(--cc-wrap); margin-inline: auto; }
.cc-seg-group { display: inline-flex; border: 2px solid var(--black); box-shadow: 2px 2px 0 var(--black); flex: 0 0 auto; }
.cc-seg { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; background: var(--white); border: none; border-right: 2px solid var(--black);
  font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .03em; cursor: pointer; color: var(--black); transition: .12s; }
.cc-seg:last-child { border-right: none; }
.cc-seg svg { opacity: .7; }
.cc-seg:hover { background: var(--teal-light); }
.cc-seg.is-on { background: var(--black); color: #fff; } .cc-seg.is-on svg { opacity: 1; color: var(--teal); }
.cc-search { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; border: 2px solid var(--black); background: var(--white); padding: 0 12px; box-shadow: 2px 2px 0 var(--black); }
.cc-search:focus-within { box-shadow: 0 0 0 3px var(--teal-light), 2px 2px 0 var(--black); }
.cc-search-ic { color: var(--muted); display: inline-flex; }
.cc-search input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font-family: var(--font-body); font-size: 14px; padding: 11px 0; color: var(--black); }
.cc-bar-1-end { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.cc-sort, .cc-weekpick { display: inline-flex; align-items: center; gap: 7px; border: 2px solid var(--black); background: var(--white); padding: 8px 11px; box-shadow: 2px 2px 0 var(--black); color: var(--muted); }
.cc-sort select, .cc-weekpick select { border: none; outline: none; background: transparent; font-family: var(--font-display); font-size: 12px; font-weight: 700; color: var(--black); cursor: pointer; }

/* layer 2 — quick chips */
.cc-bar-2 { display: flex; align-items: flex-start; gap: 12px; padding: 0 0 11px; }
.cc-quick { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.cc-chiprow { display: flex; align-items: center; gap: 7px; overflow-x: auto; scrollbar-width: none; padding-bottom: 1px; }
.cc-chiprow::-webkit-scrollbar { display: none; }
.cc-chip-label { font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); flex: 0 0 auto; width: 44px; }
.cc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; min-height: 44px; border: 2px solid var(--black); background: var(--white); color: var(--black);
  font-family: var(--font-display); font-size: 12.5px; font-weight: 700; letter-spacing: .01em; white-space: nowrap; cursor: pointer; flex: 0 0 auto; transition: box-shadow .12s, background .12s, transform .1s; }
.cc-chip:hover { box-shadow: 2px 2px 0 var(--black); }
.cc-chip:active { transform: translate(1px,1px); }
.cc-chip .cc-dot { width: 11px; height: 11px; border: 1.5px solid var(--black); background: var(--ink, var(--muted)); flex: 0 0 auto; }
.cc-chip svg { opacity: .75; }
.cc-chip.is-on { background: var(--ink, var(--black)); color: var(--ink-on, #fff); border-color: var(--black); box-shadow: 2px 2px 0 var(--black); }
.cc-chip.is-on .cc-dot { background: var(--ink-on, #fff); } .cc-chip.is-on svg { opacity: 1; }
.cc-more { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; min-height: 38px; border: 2px solid var(--black); background: var(--cream-2);
  font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .02em; cursor: pointer; box-shadow: 2px 2px 0 var(--black); flex: 0 0 auto; align-self: flex-start; }
.cc-more:hover { background: var(--marigold-light); }
.cc-more-count { background: var(--pink); color: #fff; border-radius: 999px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; padding: 0 5px; }

/* ============ ACTIVE FILTER BAR ============ */
.cc-active { border-bottom: 2px solid var(--rule); background: var(--cream-2); }
.cc-active.is-empty { display: none; }
.cc-active-inner { width: var(--cc-wrap); margin-inline: auto; display: flex; align-items: center; gap: 10px; padding: 9px 0; flex-wrap: wrap; }
.cc-active-lead { font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.cc-active-tags { display: flex; flex-wrap: wrap; gap: 7px; flex: 1; }
.cc-active-tag { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; background: var(--white); border: 2px solid var(--black);
  font-family: var(--font-display); font-size: 12px; font-weight: 700; cursor: pointer; transition: .12s; }
.cc-active-tag:hover { background: var(--pink); color: #fff; box-shadow: 2px 2px 0 var(--black); }
.cc-active-tag svg { opacity: .6; } .cc-active-tag:hover svg { opacity: 1; }
.cc-clear { background: var(--black); color: #fff; border: 2px solid var(--black); padding: 6px 12px; font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.cc-clear:hover { background: var(--pink-dark); }

/* ============ LAYOUT: rail + results ============ */
.cc-layout { width: var(--cc-wrap); margin-inline: auto; display: block; padding: 22px 0 80px; }
.cc-rail { display: none; }
/* Results column must be allowed to shrink below its content's intrinsic width,
   or the Day-camps scroll rail / grid would force the 1fr track too wide (overflow). */
.cc-results { min-width: 0; }
.cc-daystrip { max-width: 100%; }
.cc-results-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; }
.cc-count { font-family: var(--font-display); font-size: 16px; font-weight: 600; color: var(--ink-70); white-space: nowrap; }
.cc-count b { font-size: 20px; font-weight: 700; color: var(--black); }
.cc-results-sub { font-family: var(--font-hand); font-size: 19px; color: var(--pink); transform: rotate(-1deg); white-space: nowrap; }
@media (max-width: 540px) { .cc-results-sub { display: none; } }
.cc-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }

@media (min-width: 1040px) {
  .cc-bar-2 { display: none; }
  .cc-layout { display: grid; grid-template-columns: 280px 1fr; gap: 26px; align-items: start; }
  .cc-rail { display: block; position: sticky; top: calc(var(--bar-h) - 70px); align-self: start; border: 2px solid var(--black); background: var(--white); box-shadow: 4px 4px 0 var(--black); max-height: calc(100vh - 96px); overflow-y: auto; }
  .cc-rail-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 2px solid var(--black); background: var(--black); color: #fff; position: sticky; top: 0; }
  .cc-rail-head b { font-family: var(--font-display); font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
  .cc-rail-head b svg { color: var(--teal); }
  .cc-rail-clear { background: transparent; border: none; color: rgba(255,255,255,.7); font-family: var(--font-display); font-size: 11px; font-weight: 700; cursor: pointer; text-transform: uppercase; letter-spacing: .04em; }
  .cc-rail-clear:hover { color: var(--teal); }
  .cc-rail-facets { padding: 4px 16px 16px; }
  .cc-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
  .v-b .cc-grid { grid-template-columns: 1fr; }
}
@media (min-width: 1440px) {
  .v-b .cc-grid { grid-template-columns: 1fr 1fr; }
  .v-a .cc-grid, .v-c .cc-grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
}

/* facet panel (rail + sheet) */
.cc-fg { padding: 13px 0; border-bottom: 1px solid var(--rule); }
.cc-fg:last-child { border-bottom: none; }
.cc-fg-h { font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 9px; }
.cc-fg-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.cc-fselect, .cc-finput { width: 100%; border: 2px solid var(--black); background: var(--white); padding: 10px 11px; font-family: var(--font-body); font-size: 13.5px; color: var(--black); }
.cc-fselect:focus, .cc-finput:focus { outline: none; box-shadow: 0 0 0 3px var(--teal-light); }
.cc-fg-checks { display: flex; flex-direction: column; gap: 9px; }
.cc-check { display: flex; align-items: center; gap: 9px; cursor: pointer; font-family: var(--font-display); font-size: 13px; font-weight: 600; }
.cc-check input { width: 18px; height: 18px; accent-color: var(--teal); flex: 0 0 auto; }
.cc-check span { display: inline-flex; align-items: center; gap: 7px; } .cc-check span svg { color: var(--teal); }

/* ============ SHARED CARD BITS ============ */
.cc-statusline { font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .01em; color: var(--ink, var(--teal-dark));
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cc-statusline > span { white-space: nowrap; }
.cc-statusline .dot { color: var(--rule); }
.cc-card-title { font-family: var(--font-display); font-weight: 700; font-size: 17.5px; line-height: 1.2; letter-spacing: -.01em; margin: 0; text-wrap: balance; color: var(--black); }
.cc-prov { font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--muted); }
.cc-meta, .cc-row-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--ink-70); }
.cc-m { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.cc-m svg { color: var(--muted); flex: 0 0 auto; }
.cc-price { font-family: var(--font-display); font-weight: 700; font-size: 19px; color: var(--black); letter-spacing: -.01em; }
.cc-price small { font-size: 11px; font-weight: 600; color: var(--muted); margin-left: 1px; }
.cc-price.is-tbc { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: var(--muted); background: var(--cream-2); border: 1.5px solid var(--rule); padding: 4px 9px; letter-spacing: .01em; cursor: help; }
.cc-price.is-tbc svg { color: var(--muted); opacity: .75; }
.cc-topic-tag { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; background: var(--ink-light, var(--cream-2)); color: var(--ink, var(--black)); border: 1.5px solid var(--ink, var(--black));
  font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.cc-status { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border: 1.5px solid var(--black); white-space: nowrap; }
.cc-status svg { flex: 0 0 auto; }rap; }
.cc-status--ok { background: var(--teal-light); color: var(--teal-dark); }
.cc-status--warn { background: var(--marigold-light); color: var(--marigold-dark); }
.cc-status--bad { background: var(--tomato-light); color: var(--tomato-dark); }
.cc-fresh { font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.cc-fresh svg { color: var(--teal); }
.cc-badges { display: flex; flex-wrap: wrap; gap: 5px; }
/* status pill + meaning badges share one row (was stacking with no rule) */
.cc-card-statusrow { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.cc-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border: 1.5px solid var(--black);
  font-family: var(--font-display); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: var(--white); }
.cc-badge--pink { background: var(--pink); color: #fff; } .cc-badge--teal { background: var(--teal); color: #fff; }
.cc-badge--blue { background: var(--blue); color: #fff; } .cc-badge--ghost { background: var(--white); color: var(--black); }
.cc-cta-hint { font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--teal-dark); display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.cc-fav { position: absolute; top: 10px; right: 10px; z-index: 3; width: 44px; height: 44px; border: 2px solid var(--black); background: var(--white); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: .12s; box-shadow: 2px 2px 0 var(--black); }
.cc-fav:hover { background: var(--pink-light); } .cc-fav.on { background: var(--pink); color: #fff; }
.cc-fav svg { color: inherit; }

/* ============ CARD A — image-led ============ */
.cc-card { position: relative; display: flex; flex-direction: column; background: var(--white); border: 2px solid var(--black); box-shadow: 4px 4px 0 var(--black); cursor: pointer; transition: transform .15s, box-shadow .15s; outline: none; }
.cc-card:hover { transform: translateY(-3px); box-shadow: 6px 6px 0 var(--black); }
.cc-card:focus-visible { box-shadow: 0 0 0 3px var(--teal-light), 4px 4px 0 var(--black); }
.cc-card--a .cc-card-media { position: relative; aspect-ratio: 4/3; border-bottom: 2px solid var(--black); display: flex; align-items: center; justify-content: center; overflow: hidden;
  background-color: var(--ink-light);
  background-image: radial-gradient(115% 95% at 78% 118%, rgba(31,24,16,.20), transparent 55%), radial-gradient(80% 70% at 22% 16%, rgba(255,255,255,.55), transparent 62%); }
.cc-card--a .cc-glyph { transform: scale(1.15); }
.cc-glyph { color: var(--ink, var(--teal)); position: relative; z-index: 1; }
.cc-card-media::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(31,24,16,.10) 1px, transparent 1.5px); background-size: 5px 5px; }
.cc-card-media .cc-badges { position: absolute; top: 10px; left: 10px; z-index: 2; }
.cc-card-body { padding: 14px 15px 15px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.cc-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 11px; border-top: 1px solid var(--rule); }
.cc-card-foot2 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cc-foot-price { display: inline-flex; align-items: baseline; }
.cc-foot-price .cc-price { font-size: 18px; }
.cc-foot-price .cc-price.is-ask { font-size: 13px; }
.cc-card-foot2 .cc-fresh { margin-left: auto; }

/* ============ CARD B — compressed list row ============ */
.cc-card--b { flex-direction: row; align-items: stretch; padding: 0; gap: 0; }
.cc-card--b .cc-row-glyph { width: 56px; flex: 0 0 56px; display: flex; align-items: center; justify-content: center; background: var(--ink-light); border-right: 2px solid var(--black); color: var(--ink); }
.cc-card--b .cc-row-main { flex: 1; min-width: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
.cc-card--b .cc-row-meta { align-items: center; }
.cc-card--b .cc-row-end { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 4px; padding: 12px 46px 12px 10px; border-left: 1px solid var(--rule); text-align: right; }
.cc-card--b .cc-fav { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; }
.cc-card--b .cc-row-end .cc-cta-hint { margin-top: 2px; }
@media (max-width: 560px) {
  .cc-card--b { flex-wrap: wrap; }
  .cc-card--b .cc-row-end { width: 100%; flex-direction: row; align-items: center; justify-content: space-between; border-left: none; border-top: 1px solid var(--rule); text-align: left; padding: 12px 14px; }
}

/* ============ CARD C — bold ink header band ============ */
.cc-card--c .cc-c-head { position: relative; background: var(--ink); color: var(--ink-on); padding: 12px 15px 13px; border-bottom: 2px solid var(--black); overflow: hidden; min-height: 116px; display: flex; flex-direction: column;flex; flex-direction: column; }
.cc-card--c .cc-c-head::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.13) 1px, transparent 1.5px); background-size: 5px 5px; }
.cc-c-watermark { position: absolute; right: -14px; bottom: -22px; color: var(--ink-on); opacity: .16; z-index: 0; }
.cc-c-topic { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; align-self: flex-start; }
.cc-card--c .cc-c-head .cc-fav { background: var(--white); color: var(--black); }
.cc-c-headfoot { position: relative; z-index: 1; margin-top: auto; display: flex; align-items: baseline; gap: 10px; }
.cc-c-next { font-family: var(--font-display); font-weight: 700; font-size: 21px; letter-spacing: -.02em; }
.cc-c-cov { font-family: var(--font-display); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; opacity: .8; }
/* cover-style camp title anchored to the bottom of the ink band */
.cc-c-title { position: relative; z-index: 1; margin: 12px 0 0; margin-top: auto; font-family: var(--font-display); font-weight: 700; font-size: 18px; line-height: 1.14; letter-spacing: -.01em; color: var(--ink-on); text-wrap: balance; }
/* facility · direction-of-town — the smaller “expanded” line under the band */
.cc-prov--lead { display: flex; align-items: center; gap: 6px; }
.cc-prov--lead svg { color: var(--muted); flex: 0 0 auto; }
.cc-card--c .cc-card-body { padding: 13px 15px 15px; gap: 8px; }
.cc-c-pricewrap { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }

/* ============ EVENT CARD — date-forward ============ */
.cc-event { position: relative; display: flex; background: var(--white); border: 2px solid var(--black); box-shadow: 4px 4px 0 var(--black); cursor: pointer; transition: transform .15s, box-shadow .15s; overflow: hidden; }
.cc-event:hover { transform: translateY(-3px); box-shadow: 6px 6px 0 var(--ink, var(--black)); }
.cc-event:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--teal-light), 4px 4px 0 var(--black); }
.cc-event-date { flex: 0 0 86px; background: var(--ink); color: var(--ink-on); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 12px 6px; border-right: 2px solid var(--black); position: relative; }
.cc-event-date::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.14) 1px, transparent 1.5px); background-size: 5px 5px; }
.cc-ev-dow { font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .14em; opacity: .8; }
.cc-ev-day { font-family: var(--font-display); font-size: 44px; font-weight: 700; line-height: .9; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.cc-ev-mon { font-family: var(--font-display); font-size: 14px; font-weight: 700; letter-spacing: .1em; }
.cc-event-body { flex: 1; min-width: 0; padding: 13px 15px; display: flex; flex-direction: column; gap: 8px; }
.cc-event-body .cc-card-title { margin-top: 1px; }
.cc-event-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 9px; border-top: 1px solid var(--rule); }
.cc-ev-price { font-family: var(--font-display); font-weight: 700; font-size: 17px; color: var(--black); }
.cc-ev-price.is-free { color: var(--teal-dark); text-transform: uppercase; letter-spacing: .04em; font-size: 14px; padding: 3px 9px; background: var(--teal-light); border: 1.5px solid var(--black); }
.cc-event .cc-fav { top: 8px; right: 8px; }

/* ============ EMPTY STATE ============ */
.cc-grid.is-empty { display: block; }
.cc-empty { text-align: center; padding: 56px 24px; border: 2px dashed var(--rule); background: var(--white); }
.cc-empty svg { color: var(--muted); margin: 0 auto 14px; }
.cc-empty h3 { font-family: var(--font-display); font-size: 22px; margin: 0 0 8px; }
.cc-empty p { color: var(--ink-70); max-width: 44ch; margin: 0 auto 18px; font-size: 14.5px; }

/* ============ DETAIL MODAL ============ */
.cc-modal-root { display: none; } .cc-modal-root.open { display: block; }
.cc-overlay { position: fixed; inset: 0; background: rgba(31,24,16,.62); z-index: 200; display: flex; justify-content: flex-end; animation: cc-fade .2s ease; }
@keyframes cc-fade { from { opacity: 0; } to { opacity: 1; } }
.cc-modal { width: min(560px, 100%); height: 100%; background: var(--cream); border-left: 2px solid var(--black); overflow-y: auto; box-shadow: -8px 0 0 rgba(20,168,155,.4); animation: cc-slide .26s cubic-bezier(.2,.7,.2,1); display: flex; flex-direction: column; }
@keyframes cc-slide { from { transform: translateX(46px); opacity: .5; } to { transform: none; opacity: 1; } }
.cc-modal-media { position: relative; aspect-ratio: 16/7; background: var(--ink-light); display: flex; align-items: center; justify-content: center; border-bottom: 2px solid var(--black); overflow: hidden; }
.cc-modal-media::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(31,24,16,.10) 1px, transparent 1.5px); background-size: 6px 6px; }
.cc-modal-glyph { color: var(--ink); position: relative; z-index: 1; }
.cc-modal-media--event { background: var(--ink); }
.cc-modal-bigdate { position: relative; z-index: 1; color: var(--ink-on); display: flex; flex-direction: column; align-items: center; line-height: 1; }
.cc-modal-bigdate .cc-ev-day { font-size: 72px; } .cc-modal-bigdate .cc-ev-mon { font-size: 18px; } .cc-modal-bigdate .cc-ev-dow { font-size: 12px; margin-bottom: 2px; }
.cc-modal-badges { position: absolute; top: 12px; left: 12px; z-index: 2; display: flex; flex-wrap: wrap; gap: 5px; max-width: 70%; }
.cc-modal-close { position: absolute; top: 12px; right: 12px; z-index: 3; width: 38px; height: 38px; border: 2px solid var(--black); background: var(--white); cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 2px 2px 0 var(--black); }
.cc-modal-close:hover { background: var(--pink-light); }
.cc-modal-body { padding: 22px 24px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.cc-modal-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cc-modal-title { font-family: var(--font-display); font-weight: 700; font-size: 26px; line-height: 1.15; letter-spacing: -.02em; margin: 4px 0 0; text-wrap: balance; }
.cc-modal-prov { font-family: var(--font-display); font-size: 13px; font-weight: 600; color: var(--muted); margin-bottom: 4px; }
.cc-sec-h { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal-dark); margin: 16px 0 4px; padding-top: 14px; border-top: 1px solid var(--rule); }
.cc-sec-h:first-of-type, .cc-modal-top + .cc-modal-title + .cc-modal-prov + .cc-sec-h { }
.cc-sec-h svg { color: var(--teal); }
.cc-sec-h span { white-space: nowrap; }
.cc-modal-sum { font-size: 15px; line-height: 1.6; color: var(--ink-70); margin: 4px 0 0; }
.cc-keyfacts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.cc-keyfacts > div { border: 2px solid var(--black); background: var(--white); padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; }
.cc-keyfacts span { font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.cc-keyfacts span svg { color: var(--teal); }
.cc-keyfacts b { font-family: var(--font-display); font-size: 16px; font-weight: 700; }
.cc-sess-table { width: 100%; border-collapse: collapse; border: 2px solid var(--black); background: var(--white); font-size: 13px; margin-top: 4px; }
.cc-sess-table th { background: var(--cream-2); font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); text-align: left; padding: 8px 11px; border-bottom: 2px solid var(--black); }
.cc-sess-table td { padding: 9px 11px; border-bottom: 1px solid var(--rule); vertical-align: middle; }
.cc-sess-table tr:last-child td { border-bottom: none; }
.cc-s-date { font-family: var(--font-display); font-weight: 700; white-space: nowrap; }
.cc-s-theme { color: var(--ink-70); }
.cc-gap-note, .cc-modal-line { font-size: 13px; color: var(--ink-70); display: flex; align-items: center; gap: 7px; margin: 8px 0 0; }
.cc-gap-note svg, .cc-modal-line svg { color: var(--marigold-dark); flex: 0 0 auto; }
.cc-ec-list { margin: 8px 0 0; padding-left: 18px; font-size: 13px; color: var(--ink-70); line-height: 1.7; }
.cc-price-table { border: 2px solid var(--black); background: var(--white); margin-top: 4px; }
.cc-pr { display: flex; justify-content: space-between; gap: 14px; padding: 9px 12px; border-bottom: 1px solid var(--rule); font-size: 13.5px; }
.cc-pr:last-child { border-bottom: none; }
.cc-pr span { color: var(--ink-70); } .cc-pr b { font-family: var(--font-display); text-align: right; }
.cc-map { display: flex; align-items: center; gap: 13px; border: 2px solid var(--black); background: var(--ink-light); padding: 14px; text-decoration: none; margin-top: 4px; transition: .15s; }
.cc-map:hover { box-shadow: 3px 3px 0 var(--black); transform: translateY(-1px); }
.cc-map-pin { color: var(--ink); flex: 0 0 auto; }
.cc-map b { display: block; font-family: var(--font-display); font-size: 14px; color: var(--black); }
.cc-map span { font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--teal-dark); display: inline-flex; align-items: center; gap: 4px; }
.cc-amens { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.cc-amen { padding: 4px 10px; background: var(--cream-2); border: 1.5px solid var(--rule); font-family: var(--font-display); font-size: 11px; font-weight: 600; }
.cc-contact { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 2px; }
.cc-contact a { font-family: var(--font-display); font-size: 13px; font-weight: 700; color: var(--teal-dark); display: inline-flex; align-items: center; gap: 6px; }
.cc-modal-cta { position: sticky; bottom: 0; background: var(--cream); border-top: 2px solid var(--black); padding: 14px 24px; display: flex; gap: 10px; }
.cc-modal-cta .btn { flex: 1; justify-content: center; }
.cc-save-big { display: inline-flex; align-items: center; gap: 7px; border: 2px solid var(--black); background: var(--white); padding: 13px 16px; font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; box-shadow: var(--sh-1); }
.cc-save-big:hover { background: var(--pink-light); }
.cc-free-note { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 2px solid var(--black); background: var(--teal-light); padding: 13px; font-family: var(--font-display); font-size: 13px; font-weight: 700; color: var(--teal-dark); }

/* ============ MOBILE SHEET (more filters) ============ */
.cc-sheet { position: fixed; inset: 0; z-index: 180; display: none; }
.cc-sheet.open { display: block; }
.cc-sheet-overlay { position: absolute; inset: 0; background: rgba(31,24,16,.55); }
.cc-sheet-panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 86vh; background: var(--cream); border-top: 2px solid var(--black); display: flex; flex-direction: column; animation: cc-up .26s cubic-bezier(.2,.7,.2,1); }
@keyframes cc-up { from { transform: translateY(40px); opacity: .6; } to { transform: none; opacity: 1; } }
.cc-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 2px solid var(--black); background: var(--black); color: #fff; }
.cc-sheet-head b { font-family: var(--font-display); font-size: 14px; letter-spacing: .04em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.cc-sheet-head b svg { color: var(--teal); }
.cc-sheet-close { background: transparent; border: none; color: #fff; cursor: pointer; }
.cc-sheet-facets { padding: 4px 18px; overflow-y: auto; }
.cc-sheet-foot { padding: 14px 18px; border-top: 2px solid var(--black); display: flex; gap: 10px; }
.cc-sheet-foot .btn { flex: 1; justify-content: center; }

@media (max-width: 1039px) { .cc-rail { display: none; } }
@media (min-width: 1040px) { .cc-sheet, .cc-more { display: none; } }

/* footer */
.cc-foot { border-top: 2px solid var(--black); background: var(--black); color: rgba(255,255,255,.62); }
.cc-foot-inner { width: var(--cc-wrap); margin-inline: auto; padding: 26px 0; display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; font-family: var(--font-display); font-size: 12.5px; }
.cc-foot a { color: var(--teal); font-weight: 700; } .cc-foot .sp { margin-left: auto; }

@media (max-width: 720px) {
  .cc-head-meta .loc { display: none; }
  .cc-bar-1 { flex-wrap: wrap; }
  .cc-search { order: 3; flex: 1 1 100%; }
  .cc-bar-1-end { order: 2; margin-left: auto; }
  .cc-modal { width: 100%; }
}
/* ============ DESKTOP BALANCE + PLACEHOLDER IMAGERY ============ */
/* media caption — makes the placeholder read as a captioned photo */
.cc-media-cap { position: absolute; left: 10px; bottom: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  background: var(--white); color: var(--ink, var(--black)); border: 2px solid var(--black); box-shadow: 2px 2px 0 var(--black);
  padding: 4px 9px; font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-card-blurb { display: none; font-size: 14px; line-height: 1.55; color: var(--ink-70); margin: 2px 0 0; }
.cc-prov-sep { margin: 0 7px; color: var(--rule); }
.cc-foot-meta { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); }
.cc-foot-meta svg { color: var(--muted); }

/* HERO — two-column with placeholder art collage on desktop */
.cc-hero-grid { display: block; }
.cc-hero-art { display: none; }
@media (min-width: 1040px) {
  .cc-hero .cc-wrap { padding: 40px 0 36px; }
  .cc-hero-grid { display: grid; grid-template-columns: 1.18fr 0.82fr; gap: 46px; align-items: center; }
  .cc-hero-art { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 16px; position: relative; }
  .cc-hero-photo { position: relative; border: 2px solid var(--black); box-shadow: 4px 4px 0 var(--black); overflow: hidden;
    display: flex; align-items: center; justify-content: center; min-height: 124px;
    background-color: var(--ink-light);
    background-image: radial-gradient(120% 95% at 78% 120%, rgba(31,24,16,.22), transparent 55%), radial-gradient(80% 70% at 20% 14%, rgba(255,255,255,.6), transparent 62%); }
  .cc-hero-photo svg { color: var(--ink); width: 64%; height: 64%; }
  .cc-hero-photo--img { padding: 0; }
  .cc-hero-photo--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .cc-hero-photo::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(31,24,16,.10) 1px, transparent 1.5px); background-size: 5px 5px; }
  .cc-hero-photo .cap { position: absolute; left: 8px; bottom: 8px; z-index: 2; background: var(--white); border: 1.5px solid var(--black); color: var(--ink); padding: 3px 8px;
    font-family: var(--font-display); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
  .cc-hero-photo.p1 { grid-row: span 2; transform: rotate(-1.4deg); }
  .cc-hero-photo.p2 { transform: rotate(1.6deg); }
  .cc-hero-photo.p3 { transform: rotate(-1deg); }
  .cc-hero-note { position: absolute; left: 0; right: auto; top: -24px; font-family: var(--font-hand); font-size: 21px; color: var(--pink); transform: rotate(-3deg); white-space: nowrap; }

  /* roomier grid + featured editorial lead card (A & C) */
  .cc-layout { gap: 30px; padding: 26px 0 84px; }
  .v-a .cc-grid { grid-template-columns: repeat(auto-fill, minmax(326px, 1fr)); gap: 22px; }
  .v-c .cc-grid { grid-template-columns: repeat(auto-fill, minmax(326px, 1fr)); gap: 22px; }

  .v-a .cc-grid > .cc-card--a:first-child { grid-column: 1 / -1; flex-direction: row; }
  .v-a .cc-grid > .cc-card--a:first-child .cc-card-media { aspect-ratio: auto; flex: 0 0 44%; border-bottom: none; border-right: 2px solid var(--black); }
  .v-a .cc-grid > .cc-card--a:first-child .cc-card-body { padding: 24px 26px; gap: 11px; justify-content: center; }
  .v-a .cc-grid > .cc-card--a:first-child .cc-card-title { font-size: 27px; }
  .v-a .cc-grid > .cc-card--a:first-child .cc-card-blurb { display: block; max-width: 52ch; }
  .v-a .cc-grid > .cc-card--a:first-child .cc-media-cap { font-size: 12px; padding: 6px 12px; }

  .v-c .cc-grid > .cc-card--featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "ribbon ribbon" "head body"; }
  .v-c .cc-grid > .cc-card--featured .cc-feat-ribbon { grid-area: ribbon; }
  .v-c .cc-grid > .cc-card--featured .cc-c-head { grid-area: head; min-height: 100%; border-bottom: none; border-right: 2px solid var(--black); padding: 26px 28px; }
  .v-c .cc-grid > .cc-card--featured .cc-c-watermark { transform: scale(1.6); right: -10px; bottom: -10px; }
  .v-c .cc-grid > .cc-card--featured .cc-c-next { font-size: 30px; }
  .v-c .cc-grid > .cc-card--featured .cc-card-body { grid-area: body; padding: 24px 26px; justify-content: center; gap: 11px; }
  .v-c .cc-grid > .cc-card--featured .cc-card-title { font-size: 26px; }
  .v-c .cc-grid > .cc-card--featured .cc-card-blurb { display: block; max-width: 48ch; }
}
@media (min-width: 1440px) {
  .v-a .cc-grid > .cc-card--a:first-child .cc-card-media { grid-column: span 2; }
  .v-a .cc-grid > .cc-card--a:first-child { grid-column: span 2; }
}

/* ---- coverage bar (the differentiator) ---- */
/* §1 reordered-card fact line: Ages · Day coverage · Price as 3 squared, divided cells
   (was unstyled → values ran together). */
.cc-factline { display: flex; border: none; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: none; margin: 3px 0; }
.cc-factline .cc-fact { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 8px 11px 8px 0; border-right: none; }
.cc-factline .cc-fact:last-child { border-right: none; padding-right: 0; }
.cc-factline .cc-fact-k { font-family: var(--font-display); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); line-height: 1; }
.cc-factline .cc-fact b { font-family: var(--font-display); font-size: 14px; font-weight: 700; line-height: 1.2; color: var(--black); }
.cc-factline .cc-fact b small { font-size: 10px; font-weight: 600; color: var(--muted); margin-left: 1px; }
/* "Ask provider" in the Price cell: match the price value — squared, in-cell, no pill. */
.cc-factline .cc-price.is-ask { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 700; color: var(--teal-dark); background: none; border: none; border-radius: 0; padding: 0; }
.cc-factline .cc-price.is-ask svg { width: 12px; height: 12px; }
.cc-covbar { margin: 4px 0 2px; }
.cc-covbar-track { position: relative; height: 11px; background: var(--cream-2); border: 1.5px solid var(--black); overflow: hidden; }
.cc-covbar-ext { position: absolute; top: 0; bottom: 0; background: var(--ink-light); }
.cc-covbar-fill { position: absolute; top: 0; bottom: 0; background: var(--ink); }
/* P1 #1: fill reads green when it spans the 8–5 workday, amber when it doesn't. */
.cc-covbar.is-covers .cc-covbar-fill { background: var(--teal); }
.cc-covbar.is-partial .cc-covbar-fill { background: var(--marigold-dark); }
.cc-covbar-work { position: absolute; top: -1px; bottom: -1px; border-left: 2px dashed rgba(31,24,16,.5); border-right: 2px dashed rgba(31,24,16,.5); }
.cc-covbar-labels { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; font-family: var(--font-display); font-size: 9px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); }
.cc-covbar-mid { color: var(--ink-70); }
.cc-covbar.is-lg .cc-covbar-track { height: 16px; }
.cc-covbar.is-lg .cc-covbar-labels { font-size: 10px; margin-top: 5px; }
/* legend (detail view) */
.cc-covbar-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; }
.cc-cl { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--ink-70); }
.cc-cl::before { content: ""; width: 14px; height: 10px; border: 1.5px solid var(--black); }
.cc-cl--fill::before { background: var(--teal); }
.cc-cl--ext::before { background: var(--ink-light); }
.cc-cl--work::before { background: repeating-linear-gradient(90deg, rgba(31,24,16,.5) 0 2px, transparent 2px 4px); }
.cc-covbar--flex { display: flex; }
.cc-covbar-flexnote { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--marigold-dark); background: var(--marigold-light); border: 1.5px solid var(--black); padding: 7px 11px; }
.cc-covbar-flexnote svg { flex: 0 0 auto; }

/* ---- featured (paid placement) card ---- */
.cc-card--featured { box-shadow: 6px 6px 0 var(--ink); }
.cc-card--featured:hover { box-shadow: 8px 8px 0 var(--ink); }
.cc-feat-ribbon { display: flex; align-items: center; gap: 7px; background: var(--pink); color: #fff; border-bottom: 2px solid var(--black); padding: 6px 13px; font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cc-feat-ribbon svg { flex: 0 0 auto; }

/* ---- image slot (§1.4) — reads `image`, falls back to ink band ---- */
.cc-c-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.cc-c-scrim { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(31,24,16,.12) 0%, rgba(31,24,16,.68) 100%); }
.cc-c-head.has-photo .cc-c-watermark { display: none; }
.cc-c-head.has-photo .cc-c-topic, .cc-c-head.has-photo .cc-c-headfoot { position: relative; z-index: 1; }
.cc-modal-media.has-photo { background: var(--black); }
.cc-modal-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.cc-modal-media.has-photo::after { opacity: .5; }
.cc-media-credit { position: absolute; right: 8px; bottom: 8px; z-index: 2; background: rgba(31,24,16,.7); color: #fff; font-family: var(--font-display); font-size: 9px; font-weight: 600; letter-spacing: .02em; padding: 2px 7px; }

/* ---- §2.1 price-slider $-axis ---- */
.cc-ps-axis { display: flex; justify-content: space-between; margin-top: 2px; font-family: var(--font-display); font-size: 9.5px; font-weight: 700; letter-spacing: .02em; color: var(--muted); }
.cc-count-sep { color: var(--rule); margin: 0 5px; }

/* ---- §1.4 inline map embed ---- */
.cc-mapembed { border: 2px solid var(--black); box-shadow: 3px 3px 0 var(--black); margin: 4px 0 10px; aspect-ratio: 16 / 8; overflow: hidden; background: var(--cream-2); }
.cc-mapembed iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ---- focus rings (P2 #unify) ---- */
:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }

/* ============ §1.3 UNIFIED FEEDBACK ============ */
.cc-fb-tab { position: fixed; right: 0; bottom: 84px; z-index: 95; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 10px 14px; background: var(--black); color: #fff; border: 2px solid var(--black); border-right: none; box-shadow: -3px 3px 0 rgba(31,24,16,.25); cursor: pointer; font-family: var(--font-display); font-size: 12.5px; font-weight: 700; letter-spacing: .03em; writing-mode: vertical-rl; transform: rotate(180deg); }
.cc-fb-tab svg { transform: rotate(180deg); color: var(--teal); }
.cc-fb-tab:hover { background: var(--teal-dark); }
.cc-fb-tab.nudge { animation: cc-fb-bob 1s ease-in-out 3; }
@keyframes cc-fb-bob { 0%,100% { transform: rotate(180deg) translateY(0); } 50% { transform: rotate(180deg) translateY(8px); } }
@media (min-width: 700px) { .cc-fb-tab { writing-mode: horizontal-tb; transform: none; right: 18px; bottom: 18px; border-right: 2px solid var(--black); border-radius: 0; box-shadow: 3px 3px 0 var(--black); } .cc-fb-tab svg { transform: none; } .cc-fb-tab.nudge { animation: cc-fb-bob2 1s ease-in-out 3; } }
@keyframes cc-fb-bob2 { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.cc-fb { position: fixed; inset: 0; z-index: 210; }
.cc-fb[hidden] { display: none; }
.cc-fb-scrim { position: absolute; inset: 0; background: rgba(31,24,16,.6); opacity: 0; transition: opacity .2s ease; }
.cc-fb.open .cc-fb-scrim { opacity: 1; }
.cc-fb-panel { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -46%); opacity: 0; width: min(520px, 94vw); max-height: 90vh; overflow-y: auto; background: var(--cream); border: 2px solid var(--black); box-shadow: 6px 6px 0 var(--black); transition: transform .22s cubic-bezier(.2,.7,.2,1), opacity .22s; }
.cc-fb.open .cc-fb-panel { transform: translate(-50%, -50%); opacity: 1; }
.cc-fb-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 2px solid var(--black); background: var(--black); color: #fff; }
.cc-fb-head b { font-family: var(--font-display); font-size: 15px; display: inline-flex; align-items: center; gap: 8px; } .cc-fb-head b svg { color: var(--teal); }
.cc-fb-x { background: var(--white); border: 2px solid var(--black); width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.cc-fb-form { padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.cc-fb-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cc-fb-type { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 12px; border: 2px solid var(--black); background: var(--white); font-family: var(--font-display); font-size: 13px; font-weight: 700; cursor: pointer; text-align: left; }
.cc-fb-type svg { flex: 0 0 auto; color: var(--muted); }
.cc-fb-type.is-on { background: var(--black); color: #fff; } .cc-fb-type.is-on svg { color: var(--teal); }
.cc-fb-ctx { font-family: var(--font-display); font-size: 12.5px; color: var(--ink-70); margin: 2px 0; display: flex; align-items: center; gap: 6px; }
.cc-fb-ctx svg { color: var(--teal-dark); }
.cc-fb-label { font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .03em; color: var(--black); margin-top: 4px; }
.cc-fb-opt { color: var(--muted); font-weight: 600; text-transform: none; letter-spacing: 0; }
.cc-fb-form textarea, .cc-fb-form input[type=email] { border: 2px solid var(--black); background: #fff; padding: 10px 11px; font-family: var(--font-body); font-size: 14px; width: 100%; }
.cc-fb-form textarea { resize: vertical; }
.cc-fb-check { display: flex; align-items: flex-start; gap: 9px; font-family: var(--font-body); font-size: 13px; color: var(--ink-70); line-height: 1.4; cursor: pointer; }
.cc-fb-check input { width: 18px; height: 18px; accent-color: var(--teal-dark); flex: 0 0 auto; margin-top: 1px; }
.cc-fb-actions { margin-top: 4px; } .cc-fb-actions .btn { width: 100%; justify-content: center; }
.cc-fb-msg { font-size: 12.5px; margin: 4px 0 0; min-height: 0; } .cc-fb-msg.is-err { color: var(--tomato-dark); }
.cc-fb-ok { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 15px; font-weight: 700; color: var(--teal-dark); padding: 18px 4px; line-height: 1.4; } .cc-fb-ok svg { flex: 0 0 auto; }
@media (max-width: 460px) { .cc-fb-seg { grid-template-columns: 1fr; } }

/* ============ "Register by the day" feature strip ============ */
.cc-daystrip { margin: 0 0 22px; border: 2px solid var(--black); background: var(--cream-2); box-shadow: 4px 4px 0 var(--black); padding: 14px 0 14px 14px; }
.cc-daystrip[hidden] { display: none; }
.cc-day-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-right: 14px; margin-bottom: 12px; }
.cc-day-h { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cc-day-badge { display: inline-flex; align-items: center; gap: 7px; align-self: flex-start; background: var(--black); color: #fff; border: 2px solid var(--black); padding: 5px 11px; font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-day-badge svg { color: var(--marigold); }
.cc-day-sub { font-family: var(--font-display); font-size: 12.5px; font-weight: 600; color: var(--ink-70); }
.cc-day-all { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; min-height: 40px; padding: 8px 13px; border: 2px solid var(--black); background: var(--white); font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; cursor: pointer; box-shadow: 2px 2px 0 var(--black); white-space: nowrap; }
.cc-day-all:hover { background: var(--marigold-light); }
.cc-day-rail { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.cc-day-tile { scroll-snap-align: start; flex: 0 0 172px; position: relative; display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 13px 13px 14px; border: 2px solid var(--black); background: var(--white); box-shadow: 3px 3px 0 var(--black); cursor: pointer; transition: transform .14s, box-shadow .14s; }
.cc-day-tile:hover { transform: translateY(-3px); box-shadow: 5px 5px 0 var(--ink, var(--black)); }
.cc-day-pin { position: absolute; top: -2px; right: -2px; display: inline-flex; align-items: center; gap: 3px; background: var(--pink); color: #fff; border: 2px solid var(--black); padding: 2px 7px; font-family: var(--font-display); font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-day-ic { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--black); background: var(--ink-light); color: var(--ink); }
.cc-day-name { font-family: var(--font-display); font-weight: 700; font-size: 14px; line-height: 1.18; margin-top: 4px; text-wrap: balance; }
.cc-day-meta { font-family: var(--font-display); font-size: 11px; font-weight: 600; color: var(--muted); }
.cc-day-hours { margin-top: auto; padding-top: 6px; display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-display); font-weight: 700; font-size: 14px; color: var(--ink, var(--teal-dark)); }
.cc-day-hours svg { flex: 0 0 auto; opacity: .8; }
.cc-day-ext { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--teal-dark); }
.cc-day-ext svg { flex: 0 0 auto; }
@media (max-width: 700px) { .cc-day-head { flex-wrap: wrap; } .cc-day-tile { flex-basis: 158px; } }

@media (prefers-reduced-motion: reduce) { * { animation-duration: .01ms !important; } }

/* P1 #8: on mobile the modal is full-bleed — pin the close-X to the viewport corner so it's
   always reachable at open (it previously scrolled away with a tall hero). */
@media (max-width: 560px) {
  .cc-modal-close { position: fixed; top: 10px; right: 10px; z-index: 6; }
}

/* ============ §2.1 AIRLINE PRICE SLIDER ============ */
.cc-ps { display: flex; flex-direction: column; gap: 9px; }
.cc-ps-readout { font-family: var(--font-display); display: flex; align-items: baseline; gap: 7px; }
.cc-ps-val { font-size: 19px; font-weight: 700; letter-spacing: -.01em; color: var(--black); }
.cc-ps-dash { color: var(--muted); margin: 0 1px; }
.cc-ps-unit { font-size: 12px; font-weight: 600; color: var(--muted); }
.cc-ps-graph { position: relative; height: 56px; }
.cc-ps-hist { position: absolute; left: 0; right: 0; top: 0; height: 40px; display: flex; align-items: flex-end; gap: 2px; }
.cc-ps-bar { flex: 1; background: var(--cream-2); border: 1px solid var(--rule); border-bottom: none; transition: background .12s; min-height: 4px; }
.cc-ps-bar.on { background: var(--teal-light); border-color: var(--teal); }
.cc-ps-track { position: absolute; left: 0; right: 0; bottom: 9px; height: 6px; background: var(--cream-2); border: 2px solid var(--black); }
.cc-ps-fill { position: absolute; top: 0; bottom: 0; background: var(--teal); }
.cc-ps-input { position: absolute; left: -2px; right: -2px; bottom: -5px; width: calc(100% + 4px); margin: 0; background: none; -webkit-appearance: none; appearance: none; pointer-events: none; height: 26px; }
.cc-ps-input::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; pointer-events: auto; width: 22px; height: 22px; border-radius: 50%; background: var(--white); border: 2px solid var(--black); box-shadow: 2px 2px 0 var(--black); cursor: grab; margin-top: 0; }
.cc-ps-input::-moz-range-thumb { pointer-events: auto; width: 22px; height: 22px; border-radius: 50%; background: var(--white); border: 2px solid var(--black); cursor: grab; }
.cc-ps-input::-webkit-slider-runnable-track { background: none; height: 22px; }
.cc-ps-input::-moz-range-track { background: none; }
.cc-ps-input:focus-visible::-webkit-slider-thumb { outline: 3px solid var(--teal-light); }
.cc-ps-toggles { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cc-ps-na { font-size: 12px; }
.cc-ps-na small { color: var(--muted); }

/* ============ §2.2 TRI-STATE chips (faith / homeschool) ============ */
.cc-tri { position: relative; }
.cc-tri.is-tri-only { background: var(--teal); color: #fff; border-color: var(--black); box-shadow: 2px 2px 0 var(--black); }
.cc-tri.is-tri-only svg { opacity: 1; }
.cc-tri.is-tri-hide { background: var(--tomato-light); color: var(--tomato-dark); border-color: var(--black); box-shadow: 2px 2px 0 var(--black); text-decoration: line-through; }
.cc-tri-tag { display: inline-flex; align-items: center; gap: 2px; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; border-left: 1.5px solid currentColor; padding-left: 5px; margin-left: 2px; text-decoration: none; }

/* ============ §2.4 NOTIFY-ME ============ */
.cc-modal-cta--col { flex-direction: column; align-items: stretch; gap: 12px; }
.cc-cta-row { display: flex; gap: 10px; }
.cc-cta-row .btn { flex: 1; justify-content: center; }
.cc-notify { border: 2px solid var(--black); background: var(--teal-light); padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.cc-notify-h { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); font-size: 14px; }
.cc-notify-h svg { color: var(--teal-dark); flex: 0 0 auto; }
.cc-notify-sub { font-size: 12.5px; color: var(--ink-70); margin: 0; line-height: 1.45; }
.cc-notify-row { display: flex; gap: 8px; }
.cc-notify-row input { flex: 1; min-width: 0; border: 2px solid var(--black); background: #fff; padding: 10px 11px; font-family: var(--font-body); font-size: 14px; }
.cc-notify-row .btn { flex: 0 0 auto; }
.cc-notify-msg { font-size: 12px; margin: 0; min-height: 0; }
.cc-notify-msg.is-err { color: var(--tomato-dark); }
.cc-notify-ok { display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-weight: 700; font-size: 13.5px; color: var(--teal-dark); margin: 0; }
.cc-notify-ok svg { flex: 0 0 auto; }


/* ===== restored from pre-v4 build (my static-page + capture + content-page styles) ===== */

.cc-fullpage-link { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-display); font-size: 12px; font-weight: 700; color: var(--teal-dark); margin: 2px 0 2px; }

.cc-fullpage-link:hover { text-decoration: underline; }


/* ============ EMAIL CAPTURE ============ */
.cc-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.cc-capture { border-top: 2px solid var(--black); background:
  radial-gradient(circle at 12% 30%, rgba(20,168,155,.16) 0%, transparent 46%),
  radial-gradient(circle at 88% 70%, rgba(255,182,39,.18) 0%, transparent 46%), var(--cream-2); }

.cc-capture-inner { width: var(--cc-wrap); margin-inline: auto; padding: 40px 0; display: grid; grid-template-columns: 1.1fr 1fr; gap: 26px 46px; align-items: center; }

.cc-capture-copy h2 { font-family: var(--font-display); font-weight: 700; font-size: clamp(22px, 3vw, 30px); line-height: 1.1; letter-spacing: -.02em; margin: 0 0 8px; text-wrap: balance; }

.cc-capture-copy p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--ink-70); max-width: 46ch; }

.cc-capture-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: stretch; }

.cc-capture-form input { grid-column: 1 / 2; border: 2px solid var(--black); background: var(--white); padding: 13px 14px; font-family: var(--font-body); font-size: 15px; box-shadow: 2px 2px 0 var(--black); }

.cc-capture-form input:focus { outline: none; box-shadow: 0 0 0 3px var(--teal-light), 2px 2px 0 var(--black); }

.cc-capture-form .btn { grid-column: 2 / 3; }

.cc-capture-msg { grid-column: 1 / -1; margin: 2px 0 0; min-height: 18px; font-family: var(--font-display); font-size: 12.5px; font-weight: 700; color: var(--ink-70); }

.cc-capture-msg.is-ok { color: var(--teal-dark); }
 .cc-capture-msg.is-err { color: var(--tomato-dark); }

@media (max-width: 760px) {
 .cc-capture-inner { grid-template-columns: 1fr; gap: 18px; padding: 32px 0; }
}


/* browse-by-type topic links (SEO) */
.cc-topiclinks { width: var(--cc-wrap); margin: 0 auto; padding: 18px 0 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; border-top: 1px solid var(--rule); }

.cc-topiclinks-l { font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: 4px; }

.cc-topiclinks a { font-family: var(--font-display); font-size: 12.5px; font-weight: 700; color: var(--black); text-decoration: none; border: 2px solid var(--black); padding: 6px 11px; background: var(--white); transition: .12s; }

.cc-topiclinks a:hover { background: var(--teal); color: #fff; box-shadow: 2px 2px 0 var(--black); }


/* ============ CONTENT PAGES (about / get-listed) ============ */
.cc-page-hero { border-bottom: 2px solid var(--black); background:
  radial-gradient(circle at 14% 24%, rgba(20,168,155,.18) 0%, transparent 46%),
  radial-gradient(circle at 86% 30%, rgba(255,79,139,.14) 0%, transparent 46%), var(--cream); }

.cc-page-hero .cc-wrap { padding: 40px 0 32px; }

.cc-page-hero .cc-eyebrow { margin-bottom: 14px; }

.cc-page-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(28px, 4.4vw, 44px); line-height: 1.06; letter-spacing: -.02em; margin: 0 0 10px; max-width: 22ch; text-wrap: balance; }

.cc-page-hero p { font-size: 16px; line-height: 1.6; color: var(--ink-70); max-width: 60ch; margin: 0; }

.cc-page { width: min(880px, 92vw); margin-inline: auto; padding: 36px 0 72px; }

.cc-page h2 { font-family: var(--font-display); font-weight: 700; font-size: 24px; letter-spacing: -.01em; margin: 30px 0 10px; text-wrap: balance; }

.cc-page h2:first-child { margin-top: 0; }

.cc-page p { font-size: 15.5px; line-height: 1.65; color: var(--ink-70); margin: 0 0 14px; }

.cc-page a { color: var(--teal-dark); font-weight: 700; }

.cc-page ul { margin: 0 0 16px; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }

.cc-page ul li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.55; color: var(--ink-70); }

.cc-page ul li::before { content: ""; position: absolute; left: 0; top: 7px; width: 12px; height: 12px; background: var(--teal); border: 1.5px solid var(--black); }

.cc-tier-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 8px 0 18px; }

.cc-tier { border: 2px solid var(--black); background: var(--white); box-shadow: 4px 4px 0 var(--black); padding: 18px 18px 20px; display: flex; flex-direction: column; gap: 8px; }

.cc-tier.is-feature { box-shadow: 6px 6px 0 var(--pink); }

.cc-tier h3 { font-family: var(--font-display); font-weight: 700; font-size: 16px; text-transform: uppercase; letter-spacing: .04em; margin: 0; }

.cc-tier .cc-tier-price { font-family: var(--font-display); font-weight: 700; font-size: 26px; letter-spacing: -.02em; }

.cc-tier .cc-tier-price small { font-size: 12px; font-weight: 600; color: var(--muted); }

.cc-tier p { font-size: 13.5px; margin: 0; }

.cc-page-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; }

@media (max-width: 720px) {
 .cc-tier-grid { grid-template-columns: 1fr; }
}


/* ============ CAMP DETAIL PAGE (/camps/<slug>.html) ============ */
.cc-crumb { width: min(880px, 92vw); margin: 16px auto 0; font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--muted); }

.cc-crumb a { color: var(--teal-dark); font-weight: 700; }

.cc-cp-hero { position: relative; overflow: hidden; background: var(--ink, var(--black)); color: var(--ink-on, #fff); border-bottom: 2px solid var(--black); margin-top: 14px; }

.cc-cp-hero::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.13) 1px, transparent 1.5px); background-size: 5px 5px; pointer-events: none; }

.cc-cp-hero-in { position: relative; z-index: 1; width: min(880px, 92vw); margin-inline: auto; padding: 26px 0 28px; }

.cc-cp-hero .cc-topic-tag { background: rgba(255,255,255,.16); color: var(--ink-on, #fff); border-color: rgba(255,255,255,.5); }

.cc-cp-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(26px, 4vw, 38px); line-height: 1.08; letter-spacing: -.02em; margin: 12px 0 6px; max-width: 24ch; text-wrap: balance; }

.cc-cp-hero .cc-cp-prov { font-family: var(--font-display); font-size: 14px; font-weight: 600; opacity: .85; }

.cc-cp-hero-meta { display: flex; flex-wrap: wrap; gap: 8px 10px; margin-top: 14px; align-items: center; }

.cc-cp-hero-meta .cc-fresh { color: var(--ink-on, #fff); opacity: .85; }

.cc-cp-hero-meta .cc-fresh svg { color: var(--ink-on, #fff); }

.cc-cp { width: min(880px, 92vw); margin-inline: auto; padding: 24px 0 64px; }

.cc-cp .cc-sec-h:first-child { border-top: none; padding-top: 0; margin-top: 6px; }

.cc-cp-sum { font-size: 16px; line-height: 1.6; color: var(--ink-70); margin: 0; }

.cc-cp-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; padding-top: 20px; border-top: 2px solid var(--black); }

.cc-cp-contact { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; }

.cc-cp-contact a { font-family: var(--font-display); font-size: 13.5px; font-weight: 700; color: var(--teal-dark); display: inline-flex; align-items: center; gap: 6px; }

.cc-cp-note { font-size: 13px; color: var(--muted); display: flex; align-items: flex-start; gap: 7px; margin: 10px 0 0; }

.cc-cp-note svg { color: var(--marigold-dark); flex: 0 0 auto; margin-top: 2px; }


/* ============ TOPIC PAGE CARDS (static topic landings) ============ */
.tp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin-top: 4px; }

.tp-card { position: relative; display: flex; flex-direction: column; gap: 6px; background: var(--white); border: 2px solid var(--black); box-shadow: 4px 4px 0 var(--black); padding: 0 0 14px; text-decoration: none; color: var(--black); overflow: hidden; transition: transform .15s, box-shadow .15s; }

.tp-card:hover { transform: translateY(-3px); box-shadow: 6px 6px 0 var(--black); }

.tp-card-photo { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; border-bottom: 2px solid var(--black); }

.tp-card-band { display: inline-flex; align-items: center; gap: 6px; background: var(--ink, var(--black)); color: var(--ink-on, #fff); padding: 8px 14px; font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-bottom: 2px solid var(--black); }

.tp-card-name { font-family: var(--font-display); font-weight: 700; font-size: 17px; line-height: 1.18; letter-spacing: -.01em; padding: 12px 14px 0; text-wrap: balance; }

.tp-card-meta { font-family: var(--font-display); font-size: 12px; font-weight: 600; color: var(--ink-70); padding: 0 14px; }

.tp-card-foot { display: flex; align-items: center; gap: 6px; font-family: var(--font-display); font-size: 13px; font-weight: 700; color: var(--black); padding: 4px 14px 0; margin-top: auto; }

.tp-card-foot b { color: var(--teal-dark); }
 .tp-card-foot svg { margin-left: auto; color: var(--muted); }

/* Listing trust disclaimer (modal + static camp/event pages) — Claude-style "verify with provider" */
.cc-disclaimer{display:flex;gap:7px;align-items:flex-start;margin:14px 0 2px;padding:10px 12px;
  background:var(--cream-2,#f3efe6);border:1px dashed var(--rule,#d8d2c4);border-radius:10px;
  font-size:12.5px;line-height:1.45;color:var(--ink-soft,#6b6457)}
.cc-disclaimer svg,.cc-disclaimer [data-ico]{flex:0 0 auto;margin-top:1px;opacity:.8}
.cc-disclaimer a{color:var(--teal-dark,#0e7c72);font-weight:600;text-decoration:underline}
.cc-cp-cta + .cc-disclaimer{margin-top:16px}

/* "Ask provider" — replaces Price N/A; links out to the provider site where known */
.cc-price.is-ask{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;
  color:var(--teal-dark,#0e7c72);background:var(--teal-light,#e6f5f3);border:1px solid var(--teal-dark,#0e7c72);
  border-radius:0;padding:3px 9px;text-decoration:none;line-height:1.2}
a.cc-price.is-ask:hover{background:var(--teal-dark,#0e7c72);color:#fff}
a.cc-price.is-ask:hover svg{stroke:#fff}
.cc-ask-link{color:var(--teal-dark,#0e7c72);font-weight:700;text-decoration:underline;display:inline-flex;align-items:center;gap:4px}

/* ============================================================= */
/* NEXUS pre-deploy hot-fixes (2026-06-01) — fold into v7 brief  */
/* ============================================================= */
/* (1) Contrast AA: darken teal so white-on-teal surfaces pass 4.5:1 */
:root { --teal-dark: #0A6258; }
.cc-getlisted, .cc-getlisted:hover, .cc-getlisted.is-on { background: var(--teal-dark); border-color: var(--teal-dark); color: #fff; }
.badge.teal, .cc-badge--teal { background: var(--teal-dark); }

/* (2) Feedback tab → compact FAB on mobile so it stops covering card CTAs */
.cc-fb-tab { width: 52px; height: 52px; padding: 0; border-radius: 50%; justify-content: center;
  writing-mode: horizontal-tb; transform: none; right: 14px; bottom: 80px; box-shadow: 3px 3px 0 var(--teal-dark); }
.cc-fb-tab > span { display: none; }
.cc-fb-tab svg { transform: none; }
.cc-fb-tab.nudge { animation: cc-fb-bob2 1s ease-in-out 3; }
@media (min-width: 700px) {
  .cc-fb-tab { width: auto; height: auto; border-radius: 0; padding: 10px 14px; right: 18px; bottom: 18px; }
  .cc-fb-tab > span { display: inline; }
}

/* (3) Card foot wraps on very narrow widths so status + view-details never clip */
@media (max-width: 560px) {
  .cc-card--c .cc-card-foot { flex-wrap: wrap; }
  .cc-c-pricewrap { flex-wrap: wrap; min-width: 0; }
}

/* (4) Hero frames are desktop-only: the base rule hides .cc-hero-art and the
   ≥1040px grid shows it beside the headline. Below 1040 it would stack onto a new
   line, so we intentionally leave it hidden (per design review). */