/*
 * V26 Perinvo content blocks for HTML written in the Workshop / Article editors.
 * Every rule is scoped to page content (.article-content) and the admin editor (.rich-editor), so pasted HTML
 * cannot restyle the header, footer, booking panel or anything else on the site.
 */
:where(.article-content, .rich-editor) {
  --pvc-navy: #032f61;
  --pvc-navy-deep: #011f43;
  --pvc-teal: #05c8cf;
  --pvc-teal-ink: #008f9a;
  --pvc-teal-soft: #e6fafb;
  --pvc-ink: #10223a;
  --pvc-muted: #56708b;
  --pvc-line: #dbe7ee;
  --pvc-paper: #f6f9fb;
  overflow-wrap: anywhere;
}
/* Pasted layouts never push the page wider than the content column. */
:where(.article-content, .rich-editor) :where(div, section, article, table, img, figure, pre, p, ul, ol, dl, blockquote, iframe) { max-width: 100%; box-sizing: border-box; }
:where(.article-content, .rich-editor) :where(table) { display: block; overflow-x: auto; }

/* Text */
:where(.article-content, .rich-editor) .pvc-lead { font-size: 1.18em; line-height: 1.7; color: var(--pvc-ink); }
:where(.article-content, .rich-editor) .pvc-muted { color: var(--pvc-muted); }
:where(.article-content, .rich-editor) .pvc-center { text-align: center; }
:where(.article-content, .rich-editor) .pvc-highlight,
:where(.article-content, .rich-editor) mark { background: var(--pvc-teal-soft); color: var(--pvc-navy); padding: 0 .25em; border-radius: 4px; }
:where(.article-content, .rich-editor) :is(.pvc-badge, .pvc-badge-teal, .pvc-badge-navy) { display: inline-block; padding: .2em .75em; border-radius: 999px; font-size: .82em; font-weight: 700; background: var(--pvc-paper); color: var(--pvc-navy); border: 1px solid var(--pvc-line); }
:where(.article-content, .rich-editor) .pvc-badge-teal { background: var(--pvc-teal-soft); color: var(--pvc-teal-ink); border-color: #b7eef0; }
:where(.article-content, .rich-editor) .pvc-badge-navy { background: var(--pvc-navy); color: #fff; border-color: var(--pvc-navy); }

/* Sections and dividers */
:where(.article-content, .rich-editor) .pvc-section { margin: 2rem 0; }
:where(.article-content, .rich-editor) .pvc-divider { border: 0; border-top: 1px solid var(--pvc-line); margin: 2rem 0; height: 0; }

/* Cards and callouts */
:where(.article-content, .rich-editor) :is(.pvc-card, .pvc-card-navy, .pvc-card-teal) { background: #fff; border: 1px solid var(--pvc-line); border-radius: 14px; padding: 1.25rem 1.4rem; margin: 1rem 0; box-shadow: 0 6px 18px rgba(3, 47, 97, .06); }
:where(.article-content, .rich-editor) .pvc-card-navy { background: var(--pvc-navy); color: #fff; border-color: var(--pvc-navy); }
:where(.article-content, .rich-editor) .pvc-card-navy :where(h2, h3, h4, strong, a) { color: #fff; }
:where(.article-content, .rich-editor) .pvc-card-teal { background: var(--pvc-teal-soft); border-color: #b7eef0; }
:where(.article-content, .rich-editor) :is(.pvc-callout, .pvc-callout-teal, .pvc-callout-navy, .pvc-callout-warning) { border-inline-start: 4px solid var(--pvc-teal); background: var(--pvc-paper); padding: 1rem 1.2rem; border-radius: 10px; margin: 1.25rem 0; }
:where(.article-content, .rich-editor) .pvc-callout-teal { border-inline-start-color: var(--pvc-teal); background: var(--pvc-teal-soft); }
:where(.article-content, .rich-editor) .pvc-callout-navy { border-inline-start-color: var(--pvc-navy); background: #eef3f8; }
:where(.article-content, .rich-editor) .pvc-callout-warning { border-inline-start-color: #e0a100; background: #fff8e6; }
:where(.article-content, .rich-editor) .pvc-quote { font-size: 1.12em; font-style: italic; color: var(--pvc-navy); border-inline-start: 3px solid var(--pvc-teal); padding-inline-start: 1rem; margin: 1.5rem 0; }

/* Grids (responsive: one column on phones) */
:where(.article-content, .rich-editor) :is(.pvc-grid-2, .pvc-grid-3, .pvc-grid-4) { display: grid; gap: 1rem; margin: 1rem 0; }
:where(.article-content, .rich-editor) .pvc-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
:where(.article-content, .rich-editor) .pvc-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
:where(.article-content, .rich-editor) .pvc-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
:where(.article-content, .rich-editor) :where(.pvc-grid-2, .pvc-grid-3, .pvc-grid-4) > :where(.pvc-card, .pvc-card-navy, .pvc-card-teal) { margin: 0; }
@media (max-width: 760px) {
  :where(.article-content, .rich-editor) :where(.pvc-grid-2, .pvc-grid-3, .pvc-grid-4) { grid-template-columns: 1fr; }
}

/* Stats */
:where(.article-content, .rich-editor) .pvc-stat { text-align: center; padding: 1rem; }
:where(.article-content, .rich-editor) .pvc-stat-number { display: block; font-size: 2rem; font-weight: 800; color: var(--pvc-teal-ink); line-height: 1.1; }
:where(.article-content, .rich-editor) .pvc-stat-label { display: block; color: var(--pvc-muted); font-size: .9em; margin-top: .25rem; }

/* Lists */
:where(.article-content, .rich-editor) .pvc-check-list { list-style: none; padding-inline-start: 0; }
:where(.article-content, .rich-editor) .pvc-check-list > li { position: relative; padding-inline-start: 1.8em; margin: .45em 0; }
:where(.article-content, .rich-editor) .pvc-check-list > li::before { content: "✓"; position: absolute; inset-inline-start: 0; top: 0; color: var(--pvc-teal-ink); font-weight: 800; }
:where(.article-content, .rich-editor) .pvc-steps { list-style: none; counter-reset: pvc-step; padding-inline-start: 0; }
:where(.article-content, .rich-editor) .pvc-steps > li { counter-increment: pvc-step; position: relative; padding-inline-start: 2.6em; margin: .9em 0; min-height: 1.9em; }
:where(.article-content, .rich-editor) .pvc-steps > li::before { content: counter(pvc-step); position: absolute; inset-inline-start: 0; top: -.1em; width: 1.9em; height: 1.9em; border-radius: 50%; background: var(--pvc-navy); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: .9em; }

/* Agenda: <div class="pvc-agenda"><div><span class="pvc-time">10:00</span> Topic …</div></div> */
:where(.article-content, .rich-editor) .pvc-agenda { border: 1px solid var(--pvc-line); border-radius: 14px; overflow: hidden; margin: 1rem 0; }
:where(.article-content, .rich-editor) .pvc-agenda > * { padding: .85rem 1.1rem; border-top: 1px solid var(--pvc-line); margin: 0; }
:where(.article-content, .rich-editor) .pvc-agenda > *:first-child { border-top: 0; }
:where(.article-content, .rich-editor) .pvc-agenda > *:nth-child(even) { background: var(--pvc-paper); }
:where(.article-content, .rich-editor) .pvc-time { display: inline-block; min-width: 5.5em; font-weight: 700; color: var(--pvc-teal-ink); }

/* Tables */
:where(.article-content, .rich-editor) table.pvc-table { border-collapse: collapse; width: 100%; margin: 1rem 0; font-size: .95em; }
:where(.article-content, .rich-editor) table.pvc-table :where(th, td) { border: 1px solid var(--pvc-line); padding: .6rem .8rem; text-align: start; vertical-align: top; }
:where(.article-content, .rich-editor) table.pvc-table th { background: var(--pvc-navy); color: #fff; font-weight: 700; }
:where(.article-content, .rich-editor) table.pvc-table tr:nth-child(even) td { background: var(--pvc-paper); }

/* Buttons (links styled as buttons) */
:where(.article-content, .rich-editor) a.pvc-button,
:where(.article-content, .rich-editor) a.pvc-button-outline { display: inline-block; padding: .7em 1.4em; border-radius: 10px; font-weight: 700; text-decoration: none; margin: .3em .4em .3em 0; }
:where(.article-content, .rich-editor) a.pvc-button { background: var(--pvc-navy); color: #fff; }
:where(.article-content, .rich-editor) a.pvc-button:hover { background: var(--pvc-navy-deep); }
:where(.article-content, .rich-editor) a.pvc-button-outline { border: 2px solid var(--pvc-navy); color: var(--pvc-navy); }

/* Admin HTML source box */
.rich-editor-html { width: 100%; min-height: 360px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; line-height: 1.55; padding: 14px; border: 1px solid #dbe7ee; border-radius: 0 0 12px 12px; background: #0f1b2d; color: #e6f1ff; box-sizing: border-box; tab-size: 2; }
.rich-editor-html-help { font-size: 12px; color: #56708b; margin: 6px 0 0; }
.rich-editor-html-help code { background: #eef3f8; padding: 1px 5px; border-radius: 4px; }