/* ==========================================================================
   Spice Mobile — policies (/policies/ and /policies/<slug>/)
   One index, one reading template. Values mirror the approved prototype.

   Ships as a new filename (sm-policy-1.css): the CDN ignores ?ver, so a
   change always arrives as sm-policy-N.css.
   ========================================================================== */

.smc-policy,
.smc-policy-body {
  --ink: #0a0a0a;
  --ink-2: #3d4046;
  --muted: #5f6368;
  --quiet: #6b7280;
  --line: #e7e7e9;
  --line-soft: #efeff1;
  --surface: #f9f9fa;
  --card: #ffffff;
  --green: #047857;
  --green-ink: #065f46;
  --green-tint: #eaf7ee;
  --green-line: #cfe8d8;
  --dark: #0e0f10;
  --dark-2: #16181a;
  --danger: #b42318;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 24px;
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  --smc-header-h: 55px;
}

.smc-policy-body { background: var(--surface); }

.smc-policy {
  background: var(--surface);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.smc-policy *,
.smc-policy *::before,
.smc-policy *::after { box-sizing: border-box; }

.smc-policy .smc-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.smc-policy .smc-page-inner { padding-bottom: 0; }
.smc-policy .smc-wrap--index { padding-bottom: 72px; }

@media (max-width: 860px) {
  .smc-policy .smc-wrap { padding: 0 20px; }
  .smc-policy .smc-wrap--index { padding-bottom: 48px; }
  .smc-policy { --smc-header-h: 51px; }
}

/* shared content system ------------------------------------------------- */
.smc-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
@media (min-width: 1024px) { .smc-wrap { padding: 0 40px; } }

.smc-page-inner { padding-bottom: 0; }
.smc-page-inner > .smc-wrap:last-child { padding-bottom: 72px; }

.smc-eyebrow {
  display: inline-block;
  font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--green);
}
.smc-eyebrow--muted { color: var(--quiet); }

.smc-h1 {
  font-family: var(--font-display);
  font-size: clamp(30px, 3.6vw, 40px);
  font-weight: 600; line-height: 1.08; letter-spacing: -.025em;
  color: var(--ink); margin: 12px 0 0; max-width: 24ch;
}
.smc-h1--article { font-size: clamp(32px, 4.4vw, 44px); line-height: 1.06; letter-spacing: -.028em; max-width: 26ch; }
.smc-deck { font-size: 18px; line-height: 1.55; color: var(--ink-2); max-width: 60ch; margin: 14px 0 0; }

.smc-hero { padding: 40px 0 30px; }
.smc-hero--tight { padding: 26px 0 22px; }

.smc-breadcrumb { padding-top: 20px; }
.smc-breadcrumb ol {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px;
  list-style: none; margin: 0; padding: 0;
  font-size: 12px; font-weight: 500; color: var(--quiet);
}
.smc-breadcrumb a:hover { color: var(--green); }
.smc-breadcrumb li + li::before { content: "/"; color: #c4c4c9; margin-right: 7px; }
.smc-breadcrumb [aria-current] { color: var(--ink-2); }

.smc-metarow {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px;
  margin-top: 18px; font-size: 12px; color: var(--quiet); font-weight: 500;
}
.smc-metarow strong { color: var(--ink-2); font-weight: 600; }
.smc-metarow .dot { width: 3px; height: 3px; border-radius: 99px; background: #c4c4c9; }

.smc-pill {
  display: inline-flex; align-items: center; gap: 6px;
  height: 26px; padding: 0 11px; border-radius: var(--r-sm);
  background: #f1f1f3; color: var(--ink-2);
  font-size: 10.5px; font-weight: 600; letter-spacing: .02em;
}
.smc-pill--green { background: var(--green-tint); color: var(--green-ink); }
.smc-pill--line { background: #fff; border: 1px solid var(--line); }
.smc-pill--count { height: 24px; font-size: 10px; padding: 0 9px; }

/* buttons, links, section head ----------------------------------------- */
.smc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 44px; padding: 0 20px; border-radius: var(--r-sm);
  background: var(--ink); color: #fff; border: 1px solid var(--ink);
  font-size: 13.5px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.smc-btn:hover { background: #1d1d1f; }
.smc-btn--ghost { background: #fff; color: var(--ink); border-color: var(--line); }
.smc-btn--ghost:hover { border-color: #c9c9ce; background: #fff; }
.smc-btn--sm { height: 36px; font-size: 12px; padding: 0 14px; border-radius: 7px; }
.smc-btn--full { width: 100%; }
.smc-link {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 500; color: var(--green);
}
.smc-link:hover { text-decoration: underline; text-underline-offset: 3px; }

.smc-section { padding: 34px 0; }
.smc-section--tight { padding: 22px 0; }
.smc-section__head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  margin-bottom: 22px;
}
.smc-section__title {
  font-family: var(--font-display);
  font-size: 28px; font-weight: 600; line-height: 1.15; letter-spacing: -.01em;
  color: var(--ink); margin: 0;
}
.smc-section__sub { color: #737373; font-weight: 600; }
.smc-section__reason { font-size: 13px; color: var(--quiet); margin: 7px 0 0; max-width: 60ch; }

.smc-dark {
  background: var(--dark); color: #fff; border-radius: 0;
}
.smc-dark .smc-eyebrow { color: #8fe3aa; }
.smc-dark .smc-section__title { color: #fff; }
.smc-dark .smc-section__reason { color: rgba(255,255,255,.66); }


/* prose --------------------------------------------------------------- */
/* prose ---------------------------------------------------------------- */
.smc-prose { max-width: 100%; color: #1d1d1f; }
.smc-prose > * { margin: 0; }
.smc-prose p,
.smc-prose ul,
.smc-prose ol,
.smc-prose table,
.smc-prose figure,
.smc-prose blockquote { margin-top: 24px; }
.smc-prose p { font-size: 17px; line-height: 1.7; letter-spacing: -.003em; }
.smc-prose p + p { margin-top: 24px; }
.smc-prose h2 {
  font-family: var(--font-display);
  font-size: 28px; font-weight: 600; line-height: 1.2; letter-spacing: -.015em;
  margin-top: 72px; margin-bottom: 12px; color: var(--ink); scroll-margin-top: 96px;
  text-wrap: balance;
}
.smc-prose h2 + p,
.smc-prose h2 + ul,
.smc-prose h2 + ol,
.smc-prose h2 + .smc-tablewrap { margin-top: 0; }
.smc-prose h3 {
  font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em;
  margin-top: 32px; margin-bottom: 8px; color: var(--ink); scroll-margin-top: 96px;
}
.smc-prose h3 + p,
.smc-prose h3 + ul,
.smc-prose h3 + ol { margin-top: 0; }
.smc-prose h4 {
  font-size: 15.5px; font-weight: 600; line-height: 1.4;
  margin-top: 30px; margin-bottom: 6px; color: var(--ink-2); scroll-margin-top: 96px;
}
.smc-prose ul, .smc-prose ol { padding-left: 0; list-style: none; }
.smc-prose p + ul,
.smc-prose p + ol { margin-top: 10px; }
.smc-prose li { position: relative; font-size: 16.5px; line-height: 1.65; }
.smc-prose ul > li { padding-left: 20px; margin-top: 10px; }
.smc-prose ul > li::before {
  content: ""; position: absolute; left: 2px; top: .62em;
  width: 6px; height: 6px; border-radius: 2px; background: var(--green);
}
.smc-prose ul > li > ul > li::before,
.smc-prose ul > li > ol > li::before { background: #9aa3a0; width: 5px; height: 5px; }
.smc-prose ol { counter-reset: smstep; }
.smc-prose ol > li {
  counter-increment: smstep;
  position: relative;
  padding-left: 38px;
  margin-top: 14px;
  min-height: 26px;
}
.smc-prose ol > li::before {
  content: counter(smstep);
  position: absolute; left: 0; top: 1px;
  width: 26px; height: 26px; border-radius: 7px;
  background: var(--green-tint); color: var(--green-ink);
  font-size: 12px; font-weight: 700; line-height: 1;
  display: grid; place-items: center;
  font-variant-numeric: tabular-nums;
}
.smc-prose ul ul, .smc-prose ol ol, .smc-prose ul ol, .smc-prose ol ul { margin-top: 8px; }
.smc-prose strong { font-weight: 600; color: var(--ink); }
.smc-prose a { color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.smc-prose blockquote {
  border-left: 2px solid var(--green); padding: 2px 0 2px 20px;
  font-size: 17px; line-height: 1.6; color: var(--ink-2);
}
.smc-prose table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  font-size: 13.5px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
}
.smc-prose thead th {
  background: #f4f8f5; color: var(--green-ink);
  font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 12px 16px; text-align: left; border-bottom: 1px solid #dcebe2;
}
.smc-prose tbody th {
  padding: 14px 16px; text-align: left; vertical-align: top;
  font-weight: 600; color: var(--ink); font-size: 13.5px;
  width: 220px; background: #f6f8f7;
}
.smc-prose tbody td {
  padding: 14px 16px; text-align: left; vertical-align: top;
  color: var(--ink-2); font-size: 13.5px; line-height: 1.6;
  border-left: 1px solid var(--line-soft);
  border-top: 1px solid var(--line-soft);
}
.smc-prose tbody tr:first-child th,
.smc-prose tbody tr:first-child td { border-top: 0; }
.smc-prose tbody tr th:first-child { border-left: 0; }

.smc-prose figure { margin: 26px 0 0; }
.smc-prose figcaption { font-size: 12px; line-height: 1.5; color: var(--quiet); margin-top: 9px; }

/* optional table caption — never rendered when the template has none */
.smc-tablecap {
  margin: 6px 0 0; text-align: center;
  font-size: 10.5px; font-weight: 400; line-height: 1.5;
  color: #9a9aa2; letter-spacing: 0;
}
.smc-tablecap b { font-weight: 600; color: var(--ink-2); }

/* in-article help card (replaces a plain blockquote).
   Icon holds column 1 on the first row only — it has no heading to pair with,
   so the space beneath it stays empty and the copy gets the full measure. */
.smc-prose-help {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  column-gap: 16px; row-gap: 10px;
  align-items: start;
  margin-top: 34px; padding: 20px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
}
.smc-prose-help__icon {
  grid-column: 1; grid-row: 1;
  width: 32px; height: 32px; border-radius: 9px;
  background: var(--green-tint); color: var(--green-ink);
  display: grid; place-items: center;
}
.smc-prose-help__icon svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.smc-prose .smc-prose-help__text {
  grid-column: 2; grid-row: 1;
  margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-2);
}
.smc-prose .smc-prose-help__link {
  grid-column: 2; grid-row: 2; justify-self: start;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; font-weight: 600; color: var(--green);
  text-decoration: none;
}
.smc-prose .smc-prose-help__link:hover { color: var(--green-ink); text-decoration: none; }
.smc-prose-help__arrow { display: inline-flex; }
.smc-prose-help__arrow svg { width: 13px; height: 13px; stroke-width: 2.2; }

/* table stacking (reflow, not horizontal scroll) */
@media (max-width: 700px) {
  .smc-prose table, .smc-prose thead, .smc-prose tbody,
  .smc-prose tr, .smc-prose th, .smc-prose td { display: block; width: auto; }
  .smc-prose thead { display: none; }
  .smc-prose tbody tr {
    padding: 14px 16px; border-top: 1px solid var(--line-soft);
  }
  .smc-prose tbody tr:first-child { border-top: 0; }
  .smc-prose tbody th {
    padding: 0 0 8px; background: transparent; border: 0;
    font-size: 15px; font-weight: 600;
  }
  .smc-prose tbody td {
    padding: 0; border: 0; margin-top: 8px;
    font-size: 13.5px; line-height: 1.55;
  }
  .smc-prose tbody td::before {
    content: attr(data-label);
    display: block; margin-bottom: 3px;
    font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
    color: var(--green-ink);
  }
  .smc-prose tbody td[data-label=""]::before,
  .smc-prose tbody th::before { display: none; }
  .smc-prose tbody tr:hover td { background: transparent; }
}

/* editorial callout — a dynamic block inside the article, not a header object.
   Row 1: icon + title. Row 2: description across both columns. */
.smc-callout {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  column-gap: 14px; row-gap: 12px;
  margin: 30px 0; padding: 20px;
  border: 1px solid #f1dfc4; border-radius: 14px; background: #fdf9f2;
}
.smc-callout__head { display: contents; }
.smc-callout__icon {
  grid-column: 1; grid-row: 1;
  width: 36px; height: 36px; border-radius: 10px;
  background: #fdf0dd; color: #b45309;
  display: grid; place-items: center;
  font-size: 15px; font-weight: 700;
}
.smc-callout__title {
  grid-column: 2; grid-row: 1; align-self: center;
  font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #92400e;
}
.smc-prose .smc-callout__text {
  grid-column: 1 / -1; grid-row: 2;
  margin: 0; font-size: 14.5px; line-height: 1.65; color: #4d4237;
}

.smc-notice {
  display: flex; gap: 12px; padding: 16px 18px; border-radius: var(--r-md);
  border: 1px solid var(--green-line); background: var(--green-tint);
  margin: 22px 0;
}
.smc-notice__icon {
  width: 20px; height: 20px; flex: none; border-radius: 99px;
  background: var(--green); color: #fff; display: grid; place-items: center;
  font-size: 12px; font-weight: 700; margin-top: 1px;
}
.smc-notice__body { font-size: 13.5px; line-height: 1.6; color: #14532d; }
.smc-notice__body strong { display: block; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 4px; color: var(--green-ink); }
.smc-notice--warn { background: #fffbeb; border-color: #fde68a; }
.smc-notice--warn .smc-notice__icon { background: #b45309; }
.smc-notice--warn .smc-notice__body { color: #78350f; }
.smc-notice--warn .smc-notice__body strong { color: #92400e; }
.smc-notice--dark { background: var(--dark); border-color: #2a2d30; }
.smc-notice--dark .smc-notice__body { color: rgba(255,255,255,.8); }
.smc-notice--dark .smc-notice__body strong { color: #8fe3aa; }
.smc-notice--dark .smc-notice__icon { background: #fff; color: var(--dark); }


/* page header --------------------------------------------------------- */
/* page header ---------------------------------------------------------- */
.smc-hero--page { padding: 30px 0 22px; }

.smc-titlerow {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
}
.smc-titlerow .smc-h1 { flex: 1 1 auto; min-width: 0; }

.smc-backlink {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 500; color: var(--green);
  margin-bottom: 14px;
}
.smc-titlerow .smc-backlink { margin-bottom: 0; flex: none; }
.smc-backlink:hover { text-decoration: underline; text-underline-offset: 3px; }

.smc-pill--meta {
  height: 32px; padding: 0 12px; gap: 7px;
  border: 1px solid var(--line); border-radius: 8px; background: #fff;
  font-size: 12px; font-weight: 500; color: var(--ink-2);
}
.smc-pill--meta svg { width: 14px; height: 14px; stroke: var(--green); fill: none; stroke-width: 1.7; flex: none; }
.smc-pill--meta b { font-weight: 600; color: var(--ink); }

.smc-pillrow { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }

/* inline information strip: natural widths, thin separators */
.smc-inlineinfo {
  display: flex; flex-wrap: wrap; align-items: stretch;
  margin-top: 18px; row-gap: 6px;
}
.smc-inlineinfo__item {
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 0 16px; border-left: 1px solid var(--line);
  font-size: 12.5px; font-weight: 500; line-height: 1.5; color: var(--ink-2);
}
.smc-inlineinfo__item:first-child { padding-left: 0; border-left: 0; }
.smc-inlineinfo__item b { font-weight: 600; color: var(--ink); }

@media (max-width: 700px) {
  .smc-inlineinfo { flex-direction: column; gap: 6px; margin-top: 16px; }
  .smc-inlineinfo__item { padding: 0; border-left: 0; }
}


/* table of contents --------------------------------------------------- */
/* table of contents ---------------------------------------------------- */
.smc-doc {
  display: grid;
  grid-template-columns: minmax(0, 620px) 240px;
  gap: 48px;
  justify-content: space-between;
  padding-top: 18px;
}
.smc-doc__main { order: 1; min-width: 0; }
.smc-toc--desktop { order: 2; }

/* desktop contents: starts level with the first paragraph, not above it.
   When the list is taller than the viewport the column keeps the help card
   pinned and scrolls only the list (driven by page progress in app.js). */
.smc-toc {
  position: sticky; top: calc(var(--smc-header-h, 56px) + 28px); align-self: start;
  padding-top: 24px;
  display: flex; flex-direction: column;
  max-height: calc(100vh - var(--smc-header-h, 56px) - 52px);
}
.smc-toc__title {
  font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
  color: var(--quiet); margin: 0 0 12px;
}
.smc-toc__body {
  position: relative;
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: none;
}
.smc-toc__body::-webkit-scrollbar { display: none; }
.smc-toc__title, .smc-toc a.smc-toc__help { flex: none; }
/* The rail is one element scaled from the top, so it tracks the scroll
   continuously instead of stepping from item to item. No transition: the
   value is written on every frame, so it never lags or snaps. */
.smc-toc__fill {
  position: absolute; left: -1px; top: 0; width: 2px; height: 100%;
  background: var(--green); border-radius: 2px;
  transform: scaleY(0); transform-origin: 50% 0;
  will-change: transform;
}
.smc-toc ol { position: relative; list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.smc-toc li { position: relative; }
.smc-toc a {
  display: block; padding: 6px 0 6px 14px; margin-left: -1px;
  font-size: 12.5px; line-height: 1.45; color: var(--muted);
  transition: color .18s ease;
}
.smc-toc a:hover { color: var(--ink); }
.smc-toc li.is-sub a { padding-left: 26px; font-size: 12px; color: var(--quiet); }
/* every heading the reader has passed turns green, not only the current one.
   `li a` matches the specificity of `li.is-sub a`, so sub-items change too. */
.smc-toc li a.is-read { color: var(--green-ink); font-weight: 500; }
/* the rail already marks the position — the active item adds no border */
.smc-toc li a.is-active { color: var(--green-ink); font-weight: 600; }
.smc-toc li.is-sub a.is-read { color: var(--green-ink); }

/* help block — a quiet card that matches the page, never a white box.
   `.smc-toc a` styles the list links; the card is an anchor too, so the card
   rules are scoped to beat that selector. */
.smc-toc a.smc-toc__help {
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  width: 100%; margin: 26px 0 0; padding: 18px;
  border: 1px solid var(--line); border-radius: 12px;
  background: transparent;
  text-decoration: none;
  transition: border-color .18s ease;
}
.smc-toc a.smc-toc__help:hover { border-color: #d2d2d7; }
.smc-toc__help-icon {
  width: 28px; height: 28px; border-radius: 8px; flex: none;
  background: var(--green-tint); color: var(--green-ink);
  display: grid; place-items: center;
}
.smc-toc__help-icon svg { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.smc-toc__help-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.smc-toc__help-title { font-size: 12px; font-weight: 600; line-height: 1.35; color: var(--ink); }
.smc-toc__help-link { font-size: 11.5px; font-weight: 500; color: var(--green); }

/* mobile jump: one full-bleed row — label · page depth · count · chevron.
   The panel is a desktop-style rail that opens beneath the row and never
   pushes the article. */
/* Always in the flow and sticky — it scrolls up with the page above the
   article and locks under the header when it reaches it. No display toggle,
   no pop-in halfway down. */
.smc-jump {
  display: none;
  position: sticky; top: var(--smc-header-h, 56px); z-index: 45;
  margin: 0 -24px 18px;
  background: #fff;
  /* no top border: the header's bottom border is the single line of the
     junction. Two borders read as a double rule; a gap reads as a seam. */
  border-bottom: 1px solid var(--line);
}
.smc-jump__trigger {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 12px;
  width: 100%; height: 52px; padding: 0 24px;
  background: none; border: 0; text-align: left; cursor: pointer;
  font: inherit; color: inherit;
}
.smc-jump__sweep {
  position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background-image: linear-gradient(90deg,
    rgba(4,120,87,0) 0%, rgba(4,120,87,.07) 42%,
    rgba(4,120,87,.20) 50%, rgba(4,120,87,.07) 58%, rgba(4,120,87,0) 100%);
  background-size: 220% 100%;
  background-position: 190% 0;
  background-repeat: no-repeat;
}
@keyframes smc-sweep {
  0%   { opacity: 0; background-position: 80% 0; }
  10%  { opacity: 1; }
  65%  { opacity: 1; }
  100% { opacity: 0; background-position: -70% 0; }
}
.smc-jump.is-arming .smc-jump__sweep { animation: smc-sweep .46s cubic-bezier(.32,0,.24,1) forwards; }
@keyframes smc-sweep-back {
  0%   { opacity: 0; background-position: -70% 0; }
  10%  { opacity: 1; }
  65%  { opacity: 1; }
  100% { opacity: 0; background-position: 80% 0; }
}
.smc-jump.is-closing .smc-jump__sweep { animation: smc-sweep-back .36s cubic-bezier(.32,0,.24,1) forwards; }
.smc-jump__label {
  font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--quiet); white-space: nowrap;
}
.smc-jump__track {
  flex: 1 1 auto; min-width: 36px; height: 3px; border-radius: 99px;
  background: #e7e7e9; overflow: hidden;
}
.smc-jump__track-fill {
  display: block; height: 100%; width: 0; border-radius: 99px;
  background: var(--green);
}
.smc-jump__count {
  font-size: 10px; font-weight: 600; color: var(--quiet);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.smc-jump__chev { display: flex; color: var(--ink-2); transition: transform .3s cubic-bezier(.22,.61,.36,1); }
.smc-jump__chev svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.smc-jump.is-open .smc-jump__chev { transform: rotate(180deg); }

/* the panel is absolutely placed under the row, so opening it never shifts
   the paragraph the reader is on */
.smc-jump__panel {
  position: absolute; left: 0; right: 0; top: 100%;
  max-height: 0; opacity: 0; overflow: hidden;
  background: #fff;
  border-bottom: 1px solid transparent;
  box-shadow: 0 24px 44px -34px rgba(10, 10, 10, .5);
  transform: translateY(-6px);
  transition: max-height .38s cubic-bezier(.22,.61,.36,1),
              opacity .22s ease,
              transform .38s cubic-bezier(.22,.61,.36,1),
              border-color .22s ease;
  scrollbar-width: thin; scrollbar-color: #d8d8dc transparent;
}
.smc-jump.is-open .smc-jump__panel {
  max-height: min(68vh, 460px); opacity: 1; transform: none;
  border-bottom-color: var(--line); overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.smc-jump__panel::-webkit-scrollbar { width: 2px; }
.smc-jump__panel::-webkit-scrollbar-thumb { background: #d8d8dc; border-radius: 99px; }
.smc-jump__panel::-webkit-scrollbar-track { background: transparent; }

.smc-jump__rail { padding: 10px 24px 16px; }
.smc-jump__list {
  position: relative; display: flex; flex-direction: column;
  padding: 4px 0; border-left: 1px solid var(--line);
}
/* the same continuously interpolated rail as the desktop contents */
.smc-jump__fill {
  position: absolute; left: -1px; top: 4px; bottom: 4px; width: 2px;
  background: var(--green); border-radius: 2px;
  transform: scaleY(0); transform-origin: 50% 0;
  will-change: transform;
}
.smc-jump__link {
  display: block; padding: 9px 8px 9px 16px;
  font-size: 13.5px; font-weight: 500; color: var(--ink-2); line-height: 1.4;
}
.smc-jump__link.is-h3 { padding-left: 30px; font-size: 12.5px; color: var(--muted); }
.smc-jump__link.is-h4 { padding-left: 44px; font-size: 12px; color: var(--quiet); }
.smc-jump__link.is-read { color: var(--green-ink); }
.smc-jump__link.is-active { color: var(--green-ink); font-weight: 600; }

@media (max-width: 420px) {
  .smc-jump__trigger { gap: 10px; padding: 0 20px; }
  .smc-jump__rail { padding: 8px 20px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .smc-jump__panel { transition-duration: .01ms; }
  .smc-jump__chev { transition-duration: .01ms; }
  .smc-jump.is-arming .smc-jump__sweep { animation: none; }
}

.smc-doc__main { min-width: 0; }

@media (max-width: 1000px) {
  .smc-doc { grid-template-columns: 1fr; gap: 0; }
  .smc-toc--desktop { display: none; }
  .smc-jump { display: block; }
  .smc-prose h2, .smc-prose h3, .smc-prose h4 { scroll-margin-top: 124px; }
}

@media (max-width: 760px) {
  .smc-prose h2 { margin-top: 56px; margin-bottom: 10px; }
  .smc-prose h3 { margin-top: 32px; }
  .smc-prose p { font-size: 16px; line-height: 1.65; }
  .smc-prose li { font-size: 16px; }
}


/* related cards ------------------------------------------------------- */
/* related cards -------------------------------------------------------- */
.smc-related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.smc-related__card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 18px; display: flex; flex-direction: column; gap: 8px; min-height: 132px;
}
.smc-related__card:hover { border-color: #cfcfd4; }
.smc-related__kicker { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--green); }
.smc-related__title { font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; }
.smc-related__desc { font-size: 12.5px; line-height: 1.5; color: var(--quiet); }
.smc-related__go { margin-top: auto; font-size: 11.5px; font-weight: 500; color: var(--green); }

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

/* related rail card (homepage rail pattern) ---------------------------- */
.smc-relcard {
  width: 300px; flex: 0 0 auto; display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px;
  min-height: 172px;
}
.smc-relcard:hover { border-color: #d2d2d7; }
.smc-relcard__kicker {
  font-size: 10px; font-weight: 600; letter-spacing: 0; text-transform: uppercase;
  color: var(--green);
}
.smc-relcard__title {
  font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: -.012em;
  color: var(--ink); margin-top: 8px;
}
.smc-relcard__desc {
  font-size: 14px; font-weight: 500; line-height: 1.55; color: #5f6368; margin-top: 6px;
}
.smc-relcard__go {
  margin-top: auto; padding-top: 20px;
  font-size: 12.5px; font-weight: 500; color: var(--green);
}
@media (max-width: 640px) { .smc-rail .smc-relcard { width: 78vw; } }


/* policy index -------------------------------------------------------- */
/* policy index --------------------------------------------------------- */
.smc-wrap--index { padding-bottom: 56px; }

.smc-polindex { margin: 40px 0 0; }
.smc-pgroup + .smc-pgroup { margin-top: 44px; }

/* The only two rules on the page: one under each group label. */
.smc-pgroup__label {
  margin: 0; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--green);
}

.smc-pgroup__grid {
  display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px;
}

/* One row: the title line carries the arrow, the summary sits under it.
   The arrow belongs to the title it opens, not to a column at the page edge. */
.smc-policyrow {
  display: block;
  padding: 18px 0 20px;
}
.smc-policyrow__head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.smc-policyrow__title {
  display: block; font-size: 17px; font-weight: 600; letter-spacing: -.012em;
  color: var(--ink); transition: color .18s ease;
}
.smc-policyrow__desc {
  display: block; margin-top: 6px; max-width: 62ch;
  font-size: 14px; line-height: 1.55; color: var(--muted);
}
.smc-policyrow__flag {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
  border-radius: var(--r-sm); background: #fff; border: 1px solid var(--line);
  font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--quiet); white-space: nowrap;
}
.smc-policyrow__go {
  display: flex; margin-left: 2px; color: #6b7280;
  transition: color .18s ease, transform .18s ease;
}
.smc-policyrow__go svg { width: 15px; height: 15px; }

.smc-policyrow:hover .smc-policyrow__title,
.smc-policyrow:focus-visible .smc-policyrow__title { color: var(--green-ink); }
.smc-policyrow:hover .smc-policyrow__go,
.smc-policyrow:focus-visible .smc-policyrow__go { color: var(--green); transform: translate(2px, -2px); }
.smc-policyrow:focus-visible { outline: 2px solid var(--green); outline-offset: 6px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
  .smc-policyrow__go, .smc-policyrow__title { transition: none; }
}

@media (max-width: 860px) {
  .smc-wrap--index { padding-bottom: 40px; }
  .smc-pgroup__grid { grid-template-columns: 1fr; column-gap: 0; }
  .smc-policyrow { gap: 12px; padding: 16px 0 18px; }
}


/* support band -------------------------------------------------------- */
/* support band --------------------------------------------------------- */
.smc-band { background: #16181a; color: #fff; padding: 56px 0; }
.smc-band__in {
  max-width: 1240px; margin: 0 auto; padding: 0 40px;
  display: grid; grid-template-columns: minmax(0, 1fr) 340px;
  gap: 56px; align-items: center;
}
.smc-band__copy { max-width: 52ch; }
.smc-band h2 {
  font-family: var(--font-display); font-size: clamp(30px, 3vw, 36px); font-weight: 600;
  line-height: 1.15; letter-spacing: -.02em; margin: 0; color: #fff;
}
.smc-band p { margin: 14px 0 0; font-size: 18px; line-height: 1.6; color: rgba(255,255,255,.78); }

.smc-band__panel {
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.035);
  border-radius: 14px; padding: 18px;
}
.smc-band__phone { font-size: 16px; font-weight: 600; letter-spacing: -.01em; color: #fff; }
.smc-band__hours { font-size: 11.5px; line-height: 1.5; color: rgba(255,255,255,.6); }
.smc-band__actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  margin-top: 16px; padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.smc-band__actions .smc-btn {
  height: 40px; padding: 0 12px; font-size: 12.5px;
  background: #fff; color: var(--ink); border-color: #fff;
}
.smc-band__actions .smc-btn--ghost {
  background: transparent; color: #fff; border-color: rgba(255,255,255,.28);
}
.smc-band__actions .smc-btn--ghost:hover { background: rgba(255,255,255,.08); }

@media (max-width: 900px) {
  /* room under the block before the footer starts */
  .smc-band { padding: 40px 0 52px; }
  .smc-band__in { grid-template-columns: 1fr; gap: 24px; padding: 0 24px; }
  .smc-band__copy { max-width: none; }
  .smc-band__panel { width: 100%; }
  .smc-band h2 { font-size: 32px; }
  .smc-band p { font-size: 17.5px; line-height: 1.6; }
}
@media (max-width: 420px) {
  .smc-band__actions { grid-template-columns: 1fr; }
}


/* --------------------------------------------------------------------------
   Theme glue — keep the policy system self-contained inside .smc-policy and
   neutralise the block library defaults that would otherwise fight it.
   -------------------------------------------------------------------------- */

.smc-policy .wp-block-table { margin: 0; }
.smc-policy .wp-block-table table { margin: 0; }
.smc-policy .wp-block-heading { margin-left: 0; margin-right: 0; }
.smc-policy .wp-block-list { padding-left: 0; margin-left: 0; }
.smc-policy .wp-block-list li { margin-left: 0; }
.smc-policy .smc-prose > .wp-block-group { margin-top: 28px; }
.smc-policy .smc-prose figcaption { caption-side: bottom; }
.smc-policy .smc-table-caption {
  margin: 6px 0 0; text-align: center;
  font-size: 10.5px; font-weight: 400; line-height: 1.5;
  color: #9a9aa2; letter-spacing: 0;
}
.smc-policy .smc-doc__main { min-width: 0; }
.smc-policy .smc-doc { align-items: start; }
.smc-policy .smc-toc--desktop { position: sticky; top: calc(var(--smc-header-h) + 24px); }

/* the archive grid must not inherit the prose measure */
.smc-policy--index .smc-h1 { max-width: 24ch; }

/* related rail: the homepage shelf, held to the content edge */
.smc-policy .smc-railsec .smc-section { padding: 0; }
/* the article ends, then a pause, then the rail - the gap belongs to the section */
.smc-policy .smc-page-inner > .smc-railsec { padding-top: 104px; padding-bottom: 64px; }
.smc-policy .smc-rail {
  display: flex; gap: 24px; overflow-x: auto;
  padding: 4px 0 8px; scrollbar-width: none;
  padding-left: max(24px, calc((100% - 1240px) / 2 + 24px));
  padding-right: max(24px, calc((100% - 1240px) / 2 + 24px));
}
.smc-policy .smc-rail::-webkit-scrollbar { display: none; }
.smc-policy .smc-rail > * { flex: 0 0 auto; }
.smc-policy .smc-rail-foot {
  max-width: 1240px; margin: 18px auto 0; padding: 0 24px;
  display: flex; align-items: center; gap: 16px;
}
.smc-policy .smc-rail-progress { flex: 0 0 180px; height: 2px; background: #e2e2e5; border-radius: 99px; overflow: hidden; }
.smc-policy .smc-rail-progress span { display: block; height: 100%; width: 14%; background: var(--ink); border-radius: 99px; transition: width .18s ease; }
.smc-policy .smc-rail-arrows { display: flex; gap: 8px; margin-left: auto; }
.smc-policy .smc-arrow {
  width: 32px; height: 32px; border-radius: var(--r-sm); border: 1px solid var(--line);
  background: #fff; display: grid; place-items: center; cursor: pointer; padding: 0;
}
.smc-policy .smc-arrow:hover:not(:disabled) { border-color: #c9c9ce; }
.smc-policy .smc-arrow:disabled { opacity: .35; cursor: default; }
.smc-policy .smc-arrow svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; }

@media (max-width: 900px) {
  .smc-policy .smc-page-inner > .smc-railsec { padding-top: 72px; padding-bottom: 48px; }
  .smc-policy .smc-rail-foot { padding: 0 20px; }
  .smc-policy .smc-rail-progress { flex-basis: 120px; }
}
@media (min-width: 901px) {
  .smc-policy .smc-rail-foot { padding: 0 24px; }
}

/* anchors land below the real header, not under it */
.smc-policy .smc-prose h2,
.smc-policy .smc-prose h3 { scroll-margin-top: calc(var(--smc-header-h) + 32px); }

@media (max-width: 860px) {
  .smc-policy .smc-jump { margin-left: -20px; margin-right: -20px; }
}

/* The theme underlines every link; inside a card the underline is noise.
   Prose links keep it - a link in a sentence is not a card. */
.smc-policy a,
.smc-policy a:hover { text-decoration: none; }
.smc-policy .smc-prose a { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 860px) {
  .smc-policy .smc-prose p { font-size: 16px; line-height: 1.65; }
  .smc-policy .smc-prose li { font-size: 15.5px; line-height: 1.6; }
}

/* the prototype holds a 40 px gutter above 1024; the site uses 20 px below 860 */
@media (min-width: 1024px) {
  /* left/right only: a shorthand here would wipe the index bottom padding */
  .smc-policy .smc-wrap { padding-left: 40px; padding-right: 40px; }
}

/* The policy page ends on the support band; the band and the footer touch.
   A 72 px margin there reads as a stray light strip between two dark blocks. */
.smc-policy + .sm-ftr,
.smc-policy + footer { margin-top: 0; }

/* A rail footer is one object: the track and the chevrons appear together or
   not at all. A bar with two dead arrows is the worst of both. */
.smc-rail-foot.is-static { display: none; }

/* Notices: title + text, with the warning plate drawn by the template so the
   block stays two paragraphs in the editor. */
.smc-notice { position: relative; display: block; padding: 16px 18px 17px 52px; }
.smc-notice::before {
  content: "!"; position: absolute; left: 16px; top: 16px;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--green); color: #fff;
  font-size: 12px; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.smc-prose .smc-notice__title {
  margin: 0 0 4px;
  font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--green-ink);
}
.smc-prose .smc-notice__text { margin: 0; font-size: 13.5px; line-height: 1.6; color: #14532d; }
.smc-notice--warn::before { background: #b45309; }
.smc-notice--warn .smc-notice__title { color: #92400e; }
.smc-prose .smc-notice--warn .smc-notice__text { color: #78350f; }
.smc-notice--warn .smc-notice__text { color: #78350f; }

/* --------------------------------------------------------------------------
   Print — a policy is a document. The reading column prints; the navigation,
   the band, the rail and the floating helpers do not.
   -------------------------------------------------------------------------- */
@media print {
  @page { margin: 16mm; }

  .sm-hdr, .sm-ann, .sm-ftr, .sm-pf, .smc-toc, .smc-jump, .smc-railsec,
  .sm-wa-float, .sm-progress, .sm-qb, .smc-backlink { display: none !important; }

  .smc-policy,
  .smc-policy-body { background: #fff !important; color: #000; }

  .smc-policy .smc-hero--page { padding: 0 0 18px; }
  .smc-policy .smc-h1 { font-size: 26pt; max-width: none; margin: 0; }
  .smc-policy .smc-deck { font-size: 11pt; max-width: none; color: #333; }

  .smc-policy .smc-doc { display: block; }
  .smc-policy .smc-wrap { max-width: none; padding: 0; }
  .smc-policy .smc-prose { max-width: none; }
  .smc-policy .smc-prose p { font-size: 10.5pt; line-height: 1.5; }
  .smc-policy .smc-prose h2 { font-size: 15pt; margin-top: 22pt; page-break-after: avoid; }
  .smc-policy .smc-prose h3 { font-size: 11.5pt; margin-top: 14pt; page-break-after: avoid; }
  .smc-policy .smc-prose a { color: #000; text-decoration: none; }
  .smc-policy .smc-prose a[href^="http"]::after {
    content: " (" attr(href) ")"; font-size: 8pt; color: #555;
  }
  .smc-policy .smc-prose table,
  .smc-policy .smc-callout,
  .smc-policy .smc-notice { page-break-inside: avoid; }
  .smc-policy .smc-callout,
  .smc-policy .smc-notice { background: #fff !important; }
}
