/* The same Business content, laid out for sharing and paper. */
:root { color-scheme: light; --accent: #c81e3a; --muted: #615b61; font-family: 'Space Grotesk', Arial, sans-serif; color: #1b1a1e; background: #faf9f7; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; line-height: 1.45; }
a { color: inherit; text-underline-offset: .18em; }
button { font: inherit; cursor: pointer; }
a:focus-visible, button:focus-visible { outline: 3px solid #c81e3a; outline-offset: 4px; }
.skip { position: absolute; left: 1rem; top: -5rem; padding: .7rem; background: white; z-index: 5; }
.skip:focus { top: .5rem; }
.kit-toolbar { max-width: 850px; margin: 1.4rem auto 0; padding: 0 1rem; display: flex; gap: 1rem; justify-content: space-between; align-items: center; font-size: .85rem; }
.kit-toolbar > div { display: flex; flex-wrap: wrap; gap: .5rem; }
.kit-toolbar button { padding: .6rem .85rem; border: 1px solid #999d92; border-radius: 3px; background: transparent; }
.kit-toolbar #printKit { background: #c81e3a; color: white; border-color: #c81e3a; }
.kit-help { margin: .7rem 1rem 1.3rem; text-align: center; color: var(--muted); font-size: .75rem; }
.kit { max-width: 794px; margin: 0 auto 2rem; padding: 34px 40px 26px; background: #fff; box-shadow: 0 10px 40px #00000012; }
.kit-brand { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: .7rem; font-weight: 700; letter-spacing: .15em; }
.kit-brand a { text-decoration: none; font-family: 'Anton', Impact, sans-serif; font-size: 1.2rem; letter-spacing: .02em; }
.kit-brand a span { margin-left: .5rem; color: #c81e3a; }
h1 { margin: 16px 0 10px; font-family: 'Anton', Impact, sans-serif; font-size: clamp(1.9rem, 6vw, 2.9rem); line-height: 1.13; font-weight: 400; }
.kit-head { border-bottom: 5px solid #c81e3a; padding-bottom: 16px; }
p { margin: 0; font-size: .84rem; }
h2 { margin: 0 0 9px; font-size: .67rem; font-weight: 700; text-transform: uppercase; letter-spacing: .13em; }
.kit-section { margin-top: 20px; break-inside: avoid; }
dl { margin: 0; }
dd { margin: 0; }
.proof, .metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.proof { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.proof dd, .metric dd { font-family: 'Anton', Impact, sans-serif; font-size: 1.65rem; line-height: 1.25; }
.proof dt, .metric dt { margin-top: 4px; font-size: .62rem; font-weight: 600; }
.proof > div { border-left: 2px solid #746c72; padding-left: 10px; }
/* Label first in the markup for screen readers; the figure is drawn on top. */
.proof > div, .metric { display: flex; flex-direction: column; }
.proof dd, .metric dd { order: -1; }
.kit-note { margin-top: 9px; font-size: .62rem; color: var(--muted); }
.metric { padding: 10px; background: #eeebe8; border: 1px solid #746c7266; break-inside: avoid; }
.metric em { display: block; margin-top: 6px; font-style: normal; font-size: .61rem; font-weight: 400; color: #615b61; }
.metric__source { display: block; margin-top: 7px; font-size: .59rem; font-weight: 400; overflow-wrap: anywhere; }
.kit-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.tags { list-style: none; display: flex; gap: 4px 6px; flex-wrap: wrap; margin: 0; padding: 0; }
.tags li { font-size: .7rem; padding: 3px 6px; border: 1px solid #746c7266; }
.kit-platforms { display: flex; align-items: baseline; gap: 16px; }
.kit-platforms h2 { flex-shrink: 0; }
.kit-platforms ul { display: flex; flex-wrap: wrap; gap: 5px 14px; list-style: none; padding: 0; margin: 0; font-size: .72rem; }
.contact { margin-top: 20px; padding: 15px 18px; border: 2px solid #c81e3a; break-inside: avoid; }
.contact__tag { text-transform: uppercase; letter-spacing: .12em; font-size: .6rem; font-weight: 700; }
.contact__name { margin: 3px 0; font-family: 'Anton', Impact, sans-serif; font-size: 1.2rem; letter-spacing: 0; font-weight: 400; }
.contact__note { font-size: .72rem; color: var(--muted); }
.contact__actions { display: flex; gap: 7px 14px; flex-wrap: wrap; align-items: center; margin-top: 9px; }
.contact__email { font-size: .87rem; font-weight: 700; overflow-wrap: anywhere; }
.contact__copy { display: flex; gap: 5px; align-items: center; padding: 0; border: 0; background: transparent; font-size: .68rem; }
.contact__copy svg { width: 13px; height: 13px; }
.contact__brief { font-size: .67rem; color: var(--muted); margin-top: 10px; }
.contact--secondary { display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 0; border-bottom: 1px solid #746c7266; padding: 10px 0; margin-top: 0; }
.contact--secondary .contact__name { font-family: inherit; font-size: .75rem; font-weight: 600; }
.contact--secondary .contact__actions { margin: 0; font-size: .67rem; }
.contact__secondary-email { overflow-wrap: anywhere; }
.kit-footer { display: flex; flex-wrap: wrap; gap: 5px 14px; justify-content: space-between; margin-top: 15px; font-size: .6rem; color: var(--muted); }
.kit-footer #version { flex-basis: 100%; font-size: .53rem; }
.toast { position: fixed; bottom: 1.5rem; left: 50%; transform: translateX(-50%); padding: .8rem 1.2rem; color: white; background: #c81e3a; border-radius: 4px; font-size: .85rem; }
@media (max-width: 600px) {
  .kit-toolbar { align-items: flex-start; flex-direction: column; }
  .kit-help { text-align: left; }
  .kit { padding: 24px 20px; margin-bottom: 0; }
  .proof, .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .proof > div:last-child { grid-column: 1 / -1; }
  .kit-columns { grid-template-columns: 1fr; gap: 0; }
  .contact--secondary { align-items: flex-start; flex-direction: column; }
  .kit-platforms { display: block; }
}
@page { size: A4; margin: 12mm; }
@media print {
  :root { background: white; }
  body { font-size: 9pt; }
  .kit-toolbar, .kit-help, .skip, .toast, .contact__copy, .contact__brief { display: none !important; }
  .kit { width: 100%; max-width: none; padding: 0; margin: 0; box-shadow: none; }
  .kit-brand { font-size: 8pt; }
  h1 { font-size: 28pt; }
  .kit-section { margin-top: 14px; }
  .proof, .metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .proof { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .proof > div:last-child { grid-column: auto; }
  .kit-columns { grid-template-columns: 1fr 1fr; gap: 20px; }
  .contact { margin-top: 16px; }
  .contact--secondary { margin-top: 0; flex-direction: row; }
  .kit-platforms { display: flex; }
  .metric { background: white; }
  h2 { break-after: avoid; }
  a { text-decoration: underline; }
}
/* Campaigns, one block per platform, each in that platform's colour. */
.case-group--youtube { --platform: #d4001f; }
.case-group--twitch { --platform: #772ce8; }
.case-group--tiktok, .case-group--x { --platform: #1b1a1e; }
.case-group--kick { --platform: #237a05; }
.case-group--instagram { --platform: #c13584; }
.case-group--other { --platform: #c81e3a; }
.case-group { margin-top: 14px; }
.case-group + .case-group { margin-top: 20px; }
.case-group__title { display: flex; align-items: center; gap: 7px; margin: 0; padding-bottom: 6px; border-bottom: 1px solid #746c7266; color: var(--platform); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; break-after: avoid; }
.case-group__title svg { width: 14px; height: 14px; flex-shrink: 0; }
.case-group__count { margin-left: auto; color: var(--muted); font-weight: 600; letter-spacing: 0; }
.case { border-left: 2px solid var(--platform, #c81e3a); padding-left: 12px; margin-top: 12px; break-inside: avoid; }
.case h4 { margin: 3px 0 5px; font-size: .9rem; }
.case p { font-size: .7rem; }
.case__period, .case__result { color: var(--muted); }
.case__links { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .65rem; margin-top: 7px; }
