/* Public B brand motifs only. No word wrappers, generated copy or state.
   The shared pixel wordmark/fivebar and C bridge stay owned by their sources. */
body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) {
  --public-c-brand-cream: #FFF7F0;
  --public-c-brand-ink: #16110F;
  --public-c-brand-orange: #FF5B3A;
  --public-c-brand-yellow: #FFC21A;
  --public-c-brand-green: #2FD38A;
  --public-c-brand-blue: #4EA3FF;
  --public-c-brand-pink: #FF77C8;
  --public-c-brand-mark:
    linear-gradient(#FF5B3A, #FF5B3A) 9px 9px / 26px 3px no-repeat,
    linear-gradient(#FFC21A, #FFC21A) 9px 15px / 20px 3px no-repeat,
    linear-gradient(#2FD38A, #2FD38A) 9px 21px / 26px 3px no-repeat,
    linear-gradient(#4EA3FF, #4EA3FF) 9px 27px / 17px 3px no-repeat,
    linear-gradient(#FF77C8, #FF77C8) 9px 33px / 23px 3px no-repeat,
    #16110F;
}
/* Decorate the existing heading element: no text surgery or last-word guess. */
body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) .hero h1::after {
  content: ""; display: block; pointer-events: none;
  width: min(3.2em, 100%); height: .1em; margin-top: .16em;
  background: var(--five);
}
/* More specific than the LAST bridge's .primary rule. Fixed ink on cream
   stays readable in the dark hero and the light pricing/closing sections. */
body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) :is(.hero, .closing) .primary {
  --btn-bg: var(--public-c-brand-cream); --btn-fg: var(--public-c-brand-ink);
  background: var(--five) left bottom / 100% 5px no-repeat, var(--public-c-brand-cream);
  color: var(--public-c-brand-ink); border: 1px solid #3A2F29;
}
@media (hover: hover) {
  body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) .primary:hover:not(:disabled) {
    background-size: 100% 100%, auto; color: var(--public-c-brand-ink); filter: none;
  }
}
/* launch.css and the LAST bridge both have inherited hover rules. Restore
   every marked-page CTA on touch, including a browser's sticky :hover. */
@media (hover: none) {
  body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) .primary,
  body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) .primary:hover:not(:disabled) {
    background: var(--five) left bottom / 100% 5px no-repeat, var(--btn-bg);
    color: var(--btn-fg); filter: none;
  }
  body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) :is(.hero, .closing) .primary,
  body:is([data-public-c-pages="usecase"], [data-public-c-pages="pricing"]) :is(.hero, .closing) .primary:hover:not(:disabled) {
    background: var(--five) left bottom / 100% 5px no-repeat, var(--public-c-brand-cream);
    color: var(--public-c-brand-ink); filter: none;
  }
}
/* Empty decorative marks; they have no accessible name, input or hit area. */
body[data-public-c-pages="usecase"] .values article::before,
body[data-public-c-pages="pricing"] .plans-section > .column::before {
  content: ""; display: block; pointer-events: none;
  width: 44px; height: 44px; margin-bottom: 18px;
  border: 1px solid #3A2F29; border-radius: 6px;
  background: var(--public-c-brand-mark);
}
/* Highlight existing reviewer/case words, never edit the example data or
   use a reviewer colour for text. Ink remains dark on the coloured fill. */
body[data-public-c-pages="usecase"] .input-header b {
  padding-inline: .14em; border-radius: 3px;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  color: var(--public-c-brand-ink); background: var(--public-c-voice);
}
body[data-public-c-pages="usecase"] .values article { --public-c-brand-highlight: var(--public-c-brand-orange); }
body[data-public-c-pages="usecase"] .values article:nth-child(5n + 2) { --public-c-brand-highlight: var(--public-c-brand-yellow); }
body[data-public-c-pages="usecase"] .values article:nth-child(5n + 3) { --public-c-brand-highlight: var(--public-c-brand-green); }
body[data-public-c-pages="usecase"] .values article:nth-child(5n + 4) { --public-c-brand-highlight: var(--public-c-brand-blue); }
body[data-public-c-pages="usecase"] .values article:nth-child(5n) { --public-c-brand-highlight: var(--public-c-brand-pink); }
body[data-public-c-pages="usecase"] .values article h3 {
  display: inline; padding-inline: .14em; border-radius: 4px;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  color: var(--public-c-brand-ink); background: var(--public-c-brand-highlight);
}
body[data-public-c-pages="usecase"] .values article p { margin-top: 16px; }
/* Native table headers stay table headers, including the current phone view. */
body[data-public-c-pages="pricing"] .plans-table tbody tr { --public-c-brand-highlight: var(--public-c-brand-orange); }
body[data-public-c-pages="pricing"] .plans-table tbody tr:nth-child(5n + 2) { --public-c-brand-highlight: var(--public-c-brand-yellow); }
body[data-public-c-pages="pricing"] .plans-table tbody tr:nth-child(5n + 3) { --public-c-brand-highlight: var(--public-c-brand-green); }
body[data-public-c-pages="pricing"] .plans-table tbody tr:nth-child(5n + 4) { --public-c-brand-highlight: var(--public-c-brand-blue); }
body[data-public-c-pages="pricing"] .plans-table tbody tr:nth-child(5n) { --public-c-brand-highlight: var(--public-c-brand-pink); }
body[data-public-c-pages="pricing"] .plans-table tbody th[scope="row"] {
  text-decoration-line: underline; text-decoration-color: var(--public-c-brand-highlight);
  text-decoration-thickness: .25em; text-underline-offset: .12em;
}
