/* ═══════════════════════════════════════════════════════════════════
   COMMUNITY GUIDELINES PAGE — cgp-* namespace
   Extracted from an inline <style> block into this external file so the
   page has no internal/inline CSS (matches the pattern already used for
   instructor-agreement.css and sitemap's igsm-* rules in ig-theme.css).
   Palette: --cg-cr #A41034 | --cg-cream #F5F1EA
═══════════════════════════════════════════════════════════════════ */
:root {
  --cg-cr    : #A41034;
  --cg-cr-h  : #8B0E2C;
  --cg-cream : #F5F1EA;
  --cg-border: #E5E7EB;
  --cg-soft  : #F9FAFB;
  --cg-ink   : #111827;
  --cg-text2 : #4B5563;
  --cg-text3 : #9CA3AF;
}

/* ── Light page header — mirrors the sitemap page's .igsm-lhdr /
   .igblog-lhdr pattern: centered eyebrow, Fraunces heading, underline
   bar, centered subtitle, on the site's cream background — instead of
   the page's old crimson .crs-hero band + stat pill. ── */
.cgp-lhdr {
  background:    var(--cg-cream);
  padding:       14px 0 10px;
  border-bottom: 1px solid rgba(17,24,39,0.07);
}
.cgp-lhdr__inner {
  max-width:      1200px;
  margin:         0 auto;
  padding-inline: 40px;
  display:        flex;
  flex-direction: column;
  align-items:    center;
}
.cgp-lhdr__hd { margin-bottom: 10px; }
.cgp-lhdr__eyebrow {
  font-size:      0.75rem;
  font-weight:    700;
  letter-spacing: 0.16em;
  color:          var(--cg-cr);
  margin-bottom:  6px;
}
.cgp-lhdr__title {
  font-family:    'Fraunces', Georgia, serif;
  font-size:      clamp(1.875rem, 3.4vw, 2.75rem);
  font-weight:    800;
  text-transform: none;
  letter-spacing: -0.025em;
  line-height:    1.12;
  color:          var(--cg-ink);
  margin-bottom:  6px;
}
.cgp-lhdr__underline {
  display:       block;
  width:         60px;
  height:        3px;
  background:    var(--cg-cr);
  border-radius: 2px;
  margin:        0 auto 6px;
}
.cgp-lhdr__sub {
  font-size:  0.9375rem;
  color:      var(--cg-text2);
  line-height: 1.65;
  max-width:  560px;
  text-align: center;
  margin:     0;
}
@media (max-width: 991px) {
  .cgp-lhdr        { padding: 16px 0 12px; }
  .cgp-lhdr__inner { padding-inline: 24px; }
}

/* ── Wrapper ──────────────────────────────────────────────────── */
.cgp-wrap {
  /* Horizontal edges come from the outer .container — left/right
     max-width and padding removed so this doesn't add a second,
     narrower edge inside it. */
  padding: 0 0 72px;
  background: var(--cg-cream);
}

/* ── Section titles — centered title + subtitle, matching the
   site-wide .igaf-section-hd reference style (see e.g. About Us'
   "Your learning journey, reimagined" heading) instead of this page's
   original left-aligned eyebrow layout. ── */
.cgp-section-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cg-cr);
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.cgp-section-label::before,
.cgp-section-label::after {
  content: '';
  display: inline-block;
  width: 18px; height: 2px;
  background: var(--cg-cr);
  border-radius: 2px;
}
.cgp-section-title {
  /* !important defeats the sitewide h2{font-size:clamp(1.625rem,3.5vw,2.25rem)!important}
     reset in styles.blade.php — without it this renders at ~36px regardless of the value below. */
  font-size: clamp(1.5rem, 4vw, 2rem) !important;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--cg-ink);
  margin: 0 0 8px;
}
.cgp-section-sub {
  font-size: 14px;
  color: var(--cg-text2);
  margin: 0 0 32px;
  max-width: 560px;
}
.cgp-section-label,
.cgp-section-title,
.cgp-section-sub {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* ── Spaces grid ──────────────────────────────────────────────── */
.cgp-spaces {
  padding: 48px 0 0;
}
.cgp-spaces-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}
.cgp-space-card {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 12px;
  padding: 26px 22px 24px;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.cgp-space-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  border-radius: 12px 12px 0 0;
  background: var(--cg-cr);
}
.cgp-space-card:hover {
  border-color: var(--cg-cr);
  box-shadow: 0 6px 24px rgba(164,16,52,.10);
  transform: translateY(-2px);
}
.cgp-space-card__icon {
  width: 48px; height: 48px;
  border-radius: 10px;
  background: rgba(164,16,52,.06);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cg-cr);
  margin-bottom: 16px;
}
.cgp-space-card__name {
  font-size: 14.5px;
  font-weight: 800;
  color: var(--cg-ink);
  margin: 0 0 6px;
}
.cgp-space-card__desc {
  font-size: 12.5px;
  color: var(--cg-text2);
  line-height: 1.62;
  margin: 0;
}
.cgp-space-card__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--cg-cr);
  text-decoration: none;
  margin-top: 14px;
}
.cgp-space-card__link:hover { text-decoration: underline; }
.cgp-space-card__link svg { transition: transform .15s; }
.cgp-space-card__link:hover svg { transform: translateX(3px); }

/* Category accents — same red/amber/green/blue rhythm as the contact
   cards, so each space reads as a distinct destination at a glance. */
.cgp-space-card--red::before      { background: #ef4444; }
.cgp-space-card--amber::before    { background: #f59e0b; }
.cgp-space-card--green::before    { background: #10b981; }
.cgp-space-card--blue::before     { background: #3b82f6; }

.cgp-space-card--red:hover        { border-color: #ef4444; box-shadow: 0 6px 24px rgba(239,68,68,.12); }
.cgp-space-card--amber:hover      { border-color: #f59e0b; box-shadow: 0 6px 24px rgba(245,158,11,.12); }
.cgp-space-card--green:hover      { border-color: #10b981; box-shadow: 0 6px 24px rgba(16,185,129,.12); }
.cgp-space-card--blue:hover       { border-color: #3b82f6; box-shadow: 0 6px 24px rgba(59,130,246,.12); }

.cgp-space-card--red .cgp-space-card__icon    { background: rgba(239,68,68,.08);  color: #dc2626; }
.cgp-space-card--amber .cgp-space-card__icon  { background: rgba(245,158,11,.10); color: #b45309; }
.cgp-space-card--green .cgp-space-card__icon  { background: rgba(16,185,129,.10); color: #047857; }
.cgp-space-card--blue .cgp-space-card__icon   { background: rgba(59,130,246,.10); color: #1d4ed8; }

.cgp-space-card--red .cgp-space-card__link    { color: #dc2626; }
.cgp-space-card--amber .cgp-space-card__link  { color: #b45309; }
.cgp-space-card--green .cgp-space-card__link  { color: #047857; }
.cgp-space-card--blue .cgp-space-card__link   { color: #1d4ed8; }

/* ── Golden rules ──────────────────────────────────────────────── */
.cgp-rules {
  padding: 48px 0 0;
}
.cgp-rules-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 25px;
}
.cgp-rule-card {
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 12px;
  padding: 20px 18px;
  position: relative;
  overflow: hidden;
}
.cgp-rule-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  background: var(--cg-cr);
  border-radius: 12px 12px 0 0;
}
.cgp-rule-card__num {
  font-size: 11px;
  font-weight: 700;
  color: var(--cg-cr);
  background: rgba(164,16,52,.06);
  border: 1px solid rgba(164,16,52,.12);
  border-radius: 6px;
  padding: 2px 7px;
  display: inline-block;
  margin-bottom: 12px;
  letter-spacing: .04em;
}
.cgp-rule-card__title {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--cg-ink);
  margin: 0 0 6px;
}
.cgp-rule-card__text {
  font-size: 12.5px;
  color: var(--cg-text2);
  line-height: 1.6;
  margin: 0;
}

/* Category accents — same red/amber/green/blue rhythm used across the
   page's other card grids; cycles back to red for the fifth rule. */
.cgp-rule-card--red::before      { background: #ef4444; }
.cgp-rule-card--amber::before    { background: #f59e0b; }
.cgp-rule-card--green::before    { background: #10b981; }
.cgp-rule-card--blue::before     { background: #3b82f6; }

.cgp-rule-card--red .cgp-rule-card__num    { color: #dc2626; background: rgba(239,68,68,.08);  border-color: rgba(239,68,68,.16); }
.cgp-rule-card--amber .cgp-rule-card__num  { color: #b45309; background: rgba(245,158,11,.10); border-color: rgba(245,158,11,.18); }
.cgp-rule-card--green .cgp-rule-card__num  { color: #047857; background: rgba(16,185,129,.10); border-color: rgba(16,185,129,.18); }
.cgp-rule-card--blue .cgp-rule-card__num   { color: #1d4ed8; background: rgba(59,130,246,.10); border-color: rgba(59,130,246,.18); }

/* ── Prohibited callout ────────────────────────────────────────── */
.cgp-prohibited {
  padding: 48px 0 0;
}
.cgp-zero-tolerance {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: #fff8f0;
  border: 1.5px solid #f97316;
  border-radius: 12px;
  padding: 20px 22px;
  margin-bottom: 28px;
}
.cgp-zero-tolerance__icon {
  width: 36px; height: 36px;
  flex-shrink: 0;
  background: #fef3c7;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b45309;
}
.cgp-zero-tolerance__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #b45309;
  margin: 0 0 4px;
}
.cgp-zero-tolerance__text {
  font-size: 13px;
  color: #92400e;
  line-height: 1.6;
  margin: 0;
}
.cgp-zero-tolerance__text strong { color: #92400e; font-weight: 700; }

.cgp-prohibited-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.cgp-prohibited-item {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 10px;
  padding: 18px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cgp-prohibited-item::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  border-radius: 10px 10px 0 0;
  background: var(--cg-text3);
}
/* Top bar mirrors the severity dot below it — same colour, two cues, so
   the ranking still reads for anyone who can't distinguish the hues. */
.cgp-prohibited-item--red::before    { background: #ef4444; }
.cgp-prohibited-item--orange::before { background: #f97316; }
.cgp-prohibited-item--amber::before  { background: #f59e0b; }
.cgp-prohibited-item--gray::before   { background: #9ca3af; }
.cgp-prohibited-item__head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.cgp-prohibited-item__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cgp-prohibited-item__dot--red    { background: #ef4444; }
.cgp-prohibited-item__dot--orange { background: #f97316; }
.cgp-prohibited-item__dot--amber  { background: #f59e0b; }
.cgp-prohibited-item__dot--gray   { background: #9ca3af; }
.cgp-prohibited-item__name {
  font-size: 13px;
  font-weight: 700;
  color: var(--cg-ink);
  margin: 0;
}
.cgp-prohibited-item__desc {
  font-size: 12px;
  color: var(--cg-text2);
  line-height: 1.58;
  margin: 0;
}

/* Severity legend — replaces the inline style="..." version. */
.cgp-severity-legend {
  font-size: 12px;
  color: var(--cg-text3);
  margin-top: 14px;
}
.cgp-severity-legend strong { color: var(--cg-text2); }
.cgp-severity-dots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 8px;
}
.cgp-severity-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.cgp-severity-dot--red    { background: #ef4444; }
.cgp-severity-dot--orange { background: #f97316; }
.cgp-severity-dot--amber  { background: #f59e0b; }
.cgp-severity-dot--gray   { background: #9ca3af; }

/* ── Enforcement ladder — a sequential process, so it's laid out as a
   vertical stack of full-width rows (left accent bar + filled numbered
   circle + title/description) rather than four side-by-side cards. */
.cgp-ladder {
  padding: 48px 0 0;
}
.cgp-ladder-track {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}
.cgp-ladder-step {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 14px;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 8px;
  padding: 10px 16px;
}
.cgp-ladder-step::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
}
.cgp-ladder-step--1::before { background: #9ca3af; }
.cgp-ladder-step--2::before { background: #f59e0b; }
.cgp-ladder-step--3::before { background: #f97316; }
.cgp-ladder-step--4::before { background: #ef4444; }
.cgp-ladder-step__circle {
  width: 28px; height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.cgp-ladder-step--1 .cgp-ladder-step__circle { background: #9ca3af; }
.cgp-ladder-step--2 .cgp-ladder-step__circle { background: #f59e0b; }
.cgp-ladder-step--3 .cgp-ladder-step__circle { background: #f97316; }
.cgp-ladder-step--4 .cgp-ladder-step__circle { background: #ef4444; }
.cgp-ladder-step__body { min-width: 0; }
.cgp-ladder-step__name {
  font-size: 13px;
  font-weight: 700;
  color: var(--cg-ink);
  margin: 0 0 3px;
}
.cgp-ladder-step__desc {
  font-size: 11.5px;
  color: var(--cg-text2);
  line-height: 1.5;
  margin: 0;
}

/* Appeals box — replaces the inline style="..." version. */
.cgp-appeals-box {
  font-size: 13px;
  color: var(--cg-text2);
  margin-top: 28px;
  padding: 16px 20px;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 10px;
}
.cgp-appeals-box strong { color: var(--cg-ink); }
.cgp-appeals-box a { color: var(--cg-cr); font-weight: 600; text-decoration: none; }
.cgp-appeals-box a:hover { text-decoration: underline; }

/* ── Reporting table ───────────────────────────────────────────── */
.cgp-reporting {
  padding: 48px 0 0;
}
.cgp-report-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.cgp-report-card {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 10px;
  padding: 20px 16px 18px;
}
.cgp-report-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  border-radius: 10px 10px 0 0;
  background: var(--cg-cr);
}
.cgp-report-card__feature {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--cg-cr);
  margin: 0 0 8px;
}
.cgp-report-card__how {
  font-size: 12.5px;
  color: var(--cg-text2);
  line-height: 1.6;
  margin: 0;
}
.cgp-report-card__how strong { color: var(--cg-ink); font-weight: 600; }
.cgp-report-card__how a { color: var(--cg-cr); font-weight: 600; text-decoration: none; }
.cgp-report-card__how a:hover { text-decoration: underline; }

/* Category accents — same rhythm as the other card grids on this page. */
.cgp-report-card--amber::before { background: #f59e0b; }
.cgp-report-card--green::before { background: #10b981; }
.cgp-report-card--blue::before   { background: #3b82f6; }
.cgp-report-card--amber .cgp-report-card__feature { color: #b45309; }
.cgp-report-card--green .cgp-report-card__feature { color: #047857; }
.cgp-report-card--blue .cgp-report-card__feature   { color: #1d4ed8; }
.cgp-report-card--amber .cgp-report-card__how a { color: #b45309; }
.cgp-report-card--green .cgp-report-card__how a { color: #047857; }
.cgp-report-card--blue .cgp-report-card__how a   { color: #1d4ed8; }

/* Urgent/Safety — the one card that must read as an alarm, not just
   another category, so it keeps a full tinted background rather than
   only a top bar. */
.cgp-report-card--urgent {
  border-color: #ef4444;
  background: #fff5f5;
}
.cgp-report-card--urgent::before { background: #ef4444; }
.cgp-report-card--urgent .cgp-report-card__feature { color: #dc2626; }
.cgp-report-card--urgent .cgp-report-card__how a { color: #dc2626; }

/* ── Doc section (detail) ──────────────────────────────────────── */
.cgp-doc {
  padding: 32px 0 0;
}
.cgp-doc-header {
  margin-bottom: 24px;
}
.cgp-doc-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Doc TOC — horizontal tab bar above the content card. Sticks header-height
   + 24px below the fixed site header, not at a literal top:24px (which
   would tuck it under the fixed header). */
.cgp-doc-toc {
  position: sticky;
  top: calc(var(--header-h, 70px) + 24px);
  z-index: 10;
  background: #fff;
  border: 1px solid var(--cg-border);
  border-radius: 10px;
  padding: 14px 16px;
}
.cgp-doc-toc__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--cg-border);
}
.cgp-doc-toc__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #000;
  margin: 0;
}
.cgp-doc-toc__progress {
  width: 36px;
  height: 3px;
  flex-shrink: 0;
  background: var(--cg-border);
  border-radius: 2px;
  overflow: hidden;
}
.cgp-doc-toc__progress-fill {
  height: 100%;
  width: 0%;
  background: var(--cg-cr);
  border-radius: 2px;
  transition: width .1s linear;
}
.cgp-doc-toc__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
}
/* Flat highlighted rows — matches the Privacy Policy sidebar's
   .pp2-toc__link instead of the old rounded pill/tag look. */
.cgp-doc-toc__link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
  color: var(--cg-text2) !important;
  text-decoration: none !important;
  line-height: 1.5;
  background: transparent;
  border: none;
  transition: color .14s, background .14s;
}
.cgp-doc-toc__num {
  width: auto;
  height: auto;
  min-width: 18px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--cg-text3);
  background: transparent;
  border: none;
  border-radius: 0;
  font-variant-numeric: tabular-nums;
  transition: color .14s;
}
.cgp-doc-toc__link:hover {
  background: var(--cg-soft);
  color: var(--cg-ink) !important;
}
.cgp-doc-toc__link:hover .cgp-doc-toc__num {
  color: var(--cg-text3);
}
.cgp-doc-toc__link.is-active {
  background: rgba(164, 16, 52, .08);
  color: var(--cg-cr) !important;
  font-weight: 600;
}
.cgp-doc-toc__link.is-active .cgp-doc-toc__num {
  background: transparent;
  color: var(--cg-cr);
}
/* Report-it card — boxed like the Privacy Policy sidebar's .pp2-toc__cta,
   instead of a divider + inline row. */
.cgp-doc-toc__report {
  margin-top: 8px;
  padding: 12px;
  background: var(--cg-soft);
  border: 1px solid var(--cg-border);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cgp-doc-toc__report span {
  font-size: 13px;
  color: var(--cg-text3);
}
.cgp-doc-toc__report a {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--cg-cr) !important;
  text-decoration: none !important;
  white-space: nowrap;
}

/* Related-reading card — plain static sidebar content below the pinned
   TOC (mirrors privacy-policy.css's .pp2-toc-extra). Not sticky/pinned;
   scrolls with the page like normal content. */
.cgp-doc-toc-extra {
  margin-top: 16px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--cg-border);
  border-radius: 10px;
}
.cgp-doc-toc-extra__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #000;
  margin: 0 0 10px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--cg-border);
}
.cgp-doc-toc-extra__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cgp-doc-toc-extra__list a {
  display: block;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 400;
  color: var(--cg-text2) !important;
  text-decoration: none !important;
  line-height: 1.5;
  transition: color .14s, background .14s;
}
.cgp-doc-toc-extra__list a:hover {
  color: var(--cg-ink) !important;
  background: var(--cg-soft);
}

/* Doc content card — capped line length; the width saved back to the grid
   cell is left as breathing room rather than reclaimed for height. Top
   accent bar echoes the same motif used on the rule/contact cards above. */
.cgp-doc-card {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cg-border);
  border-radius: 12px;
  padding: 32px;
}
.cgp-doc-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  background: var(--cg-cr);
  border-radius: 12px 12px 0 0;
}
/* Tab panels — only the current section renders; no adjacent section to
   divide against, so no border/margin bookkeeping is needed here. */
.cgp-doc-sec {
  display: none;
  scroll-margin-top: calc(var(--header-h, 70px) + 20px);
}
.cgp-doc-sec.is-current {
  display: block;
}
.cgp-doc-sec__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.cgp-doc-sec__num {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: var(--cg-cr);
  border: none;
  border-radius: 5px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cgp-doc-sec__title {
  /* !important defeats the sitewide h3{font-size:clamp(1.375rem,2.5vw,1.75rem)!important}
     reset — without it this renders at ~28px regardless of the value below. */
  font-size: 1.5rem !important;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--cg-ink);
  margin: 0;
}
.cgp-doc-sec p {
  font-size: 0.9375rem; /* 15px floor — legal text must not go smaller */
  line-height: 1.6;
  color: var(--cg-text2);
  margin: 0 0 12px;
}
.cgp-doc-sec p:last-child { margin-bottom: 0; }
.cgp-doc-sec p strong { color: var(--cg-ink); font-weight: 600; }
.cgp-doc-sec a { color: var(--cg-cr) !important; font-weight: 600; text-decoration: none !important; }
.cgp-doc-sec a:hover { text-decoration: underline !important; }

/* Label-lead "Term: text" rows (Questions:, Replies:, Voting: …) — compact
   definition-row rhythm instead of full paragraph spacing between them. */
.cgp-doc-sec p.cgp-doc-row {
  margin: 0 0 8px;
}
.cgp-doc-sec p.cgp-doc-row:last-child { margin-bottom: 0; }

/* ── Contact panel ─────────────────────────────────────────────── */
.cgp-contact {
  padding: 48px 0 0;
}
.cgp-contact-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}
.cgp-contact-card {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1.5px solid var(--cg-border);
  border-radius: 12px;
  padding: 22px 20px 20px;
  text-decoration: none;
  color: inherit;
  transition: border-color .18s, box-shadow .18s, transform .18s;
  display: block;
}
.cgp-contact-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 3px;
  border-radius: 12px 12px 0 0;
  background: var(--cg-cr);
}
.cgp-contact-card:hover {
  border-color: var(--cg-cr);
  box-shadow: 0 6px 20px rgba(164,16,52,.10);
  transform: translateY(-2px);
  text-decoration: none;
  color: inherit;
}
.cgp-contact-card__icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(164,16,52,.06);
  color: var(--cg-cr);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.cgp-contact-card__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--cg-text3);
  margin: 0 0 4px;
}
.cgp-contact-card__value {
  font-size: 14px;
  font-weight: 700;
  color: var(--cg-cr);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Category accents — top bar + icon + value tint per card, echoing the
   severity-dot palette used in §3 so the four tiles read as distinct
   destinations rather than four copies of the same card. */
.cgp-contact-card--red::before      { background: #ef4444; }
.cgp-contact-card--amber::before    { background: #f59e0b; }
.cgp-contact-card--green::before    { background: #10b981; }
.cgp-contact-card--blue::before     { background: #3b82f6; }

.cgp-contact-card--red:hover        { border-color: #ef4444; box-shadow: 0 6px 20px rgba(239,68,68,.12); }
.cgp-contact-card--amber:hover      { border-color: #f59e0b; box-shadow: 0 6px 20px rgba(245,158,11,.12); }
.cgp-contact-card--green:hover      { border-color: #10b981; box-shadow: 0 6px 20px rgba(16,185,129,.12); }
.cgp-contact-card--blue:hover       { border-color: #3b82f6; box-shadow: 0 6px 20px rgba(59,130,246,.12); }

.cgp-contact-card--red .cgp-contact-card__icon    { background: rgba(239,68,68,.08);  color: #dc2626; }
.cgp-contact-card--amber .cgp-contact-card__icon  { background: rgba(245,158,11,.10); color: #b45309; }
.cgp-contact-card--green .cgp-contact-card__icon  { background: rgba(16,185,129,.10); color: #047857; }
.cgp-contact-card--blue .cgp-contact-card__icon   { background: rgba(59,130,246,.10); color: #1d4ed8; }

.cgp-contact-card--red .cgp-contact-card__value   { color: #dc2626; }
.cgp-contact-card--amber .cgp-contact-card__value { color: #b45309; }
.cgp-contact-card--green .cgp-contact-card__value { color: #047857; }
.cgp-contact-card--blue .cgp-contact-card__value  { color: #1d4ed8; }

/* ── Divider ───────────────────────────────────────────────────── */
.cgp-divider {
  border: none;
  border-top: 1px solid var(--cg-border);
  margin: 40px 0 0;
}

/* ── Closing CTA — plain full-bleed band on the shared cream
   background, no card/shadow (same treatment as the Cookie Policy
   page's .ig-ck-contact-footer). ── */
.cgp-cta-footer {
  background: var(--cg-cream);
  padding: 40px 24px;
  text-align: center;
}
.cgp-cta-footer__inner {
  max-width: 560px;
  margin: 0 auto;
}
.cgp-cta-footer__inner h2 {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 1.5rem !important;
  font-weight: 700;
  color: var(--cg-ink);
  margin: 0 0 8px;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.cgp-cta-footer__inner h2 span {
  color: var(--cg-cr);
}
.cgp-cta-footer__inner p {
  font-size: 0.875rem;
  color: var(--cg-text2);
  margin: 0 0 18px;
  line-height: 1.6;
}
.cgp-cta-footer__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--cg-cr);
  color: #fff;
  font-size: .85rem;
  font-weight: 600;
  padding: 10px 24px;
  border-radius: 10px;
  border: 2px solid var(--cg-cr);
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(164,16,52,.30);
  transition: background .18s, border-color .18s, transform .12s, box-shadow .18s;
}
.cgp-cta-footer__btn:hover {
  background: var(--cg-cr-h);
  border-color: var(--cg-cr-h);
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(164,16,52,.38);
}

/* ── Back to top ──────────────────────────────────────────────────
   Scoped to this page's own tokens rather than reusing #pp-totop from
   privacy-policy.css, since that rule reads var(--ink)/var(--cr), which
   are only defined inside .pp2-wrap — undefined (and invisible) here. */
.cgp-totop {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 38px;
  height: 38px;
  background: var(--cg-ink);
  color: #fff;
  border: none;
  border-radius: 9px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .2s, transform .2s, background .18s;
  z-index: 9000;
  pointer-events: none;
}
.cgp-totop.show { opacity: 1; transform: translateY(0); pointer-events: auto; }
.cgp-totop:hover { background: var(--cg-cr); }

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .cgp-wrap { padding: 0 0 56px; }
  .cgp-prohibited-grid { grid-template-columns: repeat(2, 1fr); }
  .cgp-report-cards { grid-template-columns: repeat(2, 1fr); }
  .cgp-contact-row { grid-template-columns: repeat(2, 1fr); }
  .cgp-ladder-track { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .cgp-ladder-step { align-items: flex-start; }
  .cgp-spaces-grid, .cgp-rules-grid, .cgp-prohibited-grid,
  .cgp-report-cards, .cgp-contact-row { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .cgp-totop { transition: none; }
}