/*! Rep Counter for WordPress. Colours: gold #E8B456, amber #A46900, black. Override any --token on .rpc-root in your theme's CSS. */
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2"); }

.rpc-root {
  --black: #000000;
  --surface: #14110b;
  --line: #4d3d1f;
  --gold: #e8b456;
  --gold-hi: #f0c77a;
  --gold-soft: #2b2110;
  --amber: #a46900;
  --ink: #f4ebdd;
  --ink-muted: #9c8e76;
  --on-gold: var(--black);
  --focus: var(--gold);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 24px;
  --radius-pill: 9999px;
  --tap-min: 44px;
  --tap-main: 64px;
  --font-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  container: rpc / inline-size;
  display: block;
  font-family: var(--font-sans);
  color: var(--ink);
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  margin-block: var(--space-8);
}
.rpc-root.rpc-hero-root { margin-block: 0; }
.rpc-root.rpc-full { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

/* Guard against theme styles leaking in. */
.rpc-root.rpc-scope *, .rpc-root.rpc-scope *::before, .rpc-root.rpc-scope *::after { box-sizing: border-box; }
.rpc-root.rpc-scope button, .rpc-root.rpc-scope a, .rpc-root.rpc-scope h1, .rpc-root.rpc-scope p, .rpc-root.rpc-scope ul, .rpc-root.rpc-scope ol, .rpc-root.rpc-scope li, .rpc-root.rpc-scope kbd, .rpc-root.rpc-scope nav, .rpc-root.rpc-scope header, .rpc-root.rpc-scope footer, .rpc-root.rpc-scope section {
  margin: 0; padding: 0; border: 0; background: none; box-shadow: none; text-shadow: none;
  font: inherit; color: inherit; letter-spacing: normal; text-transform: none; text-decoration: none;
  min-height: 0; max-width: none; width: auto; float: none; list-style: none;
}
.rpc-root.rpc-scope li::marker { content: none; }
.rpc-root.rpc-scope svg { display: inline-block; max-width: none; height: auto; }
.rpc-root.rpc-scope .rp-btn { line-height: 1; text-decoration: none; }
.rpc-root.rpc-scope .rpc-tool-wrap { display: flex; justify-content: center; }
.rpc-root.rpc-scope .rp-tool { margin: 0 auto; }

.rpc-root.rpc-scope .rp-btn { font: inherit; font-weight: 600; font-size: 15px; line-height: 1; min-height: var(--tap-min); min-width: var(--tap-min); padding: 0 var(--space-6); border-radius: var(--radius-pill); border: 1.5px solid transparent; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); white-space: nowrap; text-decoration: none; transition: transform .1s ease, background-color .15s ease, border-color .15s ease, color .15s ease, width .25s cubic-bezier(.2,.8,.2,1); -webkit-tap-highlight-color: transparent; }
.rpc-root.rpc-scope .rp-btn:active:not(:disabled) { transform: scale(.95); }
.rpc-root.rpc-scope .rp-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.rpc-root.rpc-scope .rp-btn:disabled { opacity: .3; cursor: not-allowed; }
.rpc-root.rpc-scope .rp-btn-primary { background: var(--gold); color: var(--on-gold); }
.rpc-root.rpc-scope .rp-btn-primary:hover:not(:disabled) { background: var(--gold-hi); }
.rpc-root.rpc-scope .rp-btn-primary:active:not(:disabled) { background: var(--amber); }
.rpc-root.rpc-scope .rp-btn-secondary { background: transparent; border-color: var(--line); color: var(--gold); }
.rpc-root.rpc-scope .rp-btn-secondary:hover:not(:disabled) { border-color: var(--amber); background: var(--gold-soft); }
.rpc-root.rpc-scope .rp-btn-secondary:active:not(:disabled) { background: var(--gold-soft); border-color: var(--gold); }
.rpc-root.rpc-scope .rp-btn-ghost { background: transparent; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-btn-ghost:hover:not(:disabled) { color: var(--gold); }
.rpc-root.rpc-scope .rp-btn-sm { min-height: 36px; padding: 0 var(--space-4); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.rpc-root.rpc-scope .rp-btn-lg { min-height: 52px; padding: 0 28px; font-size: 15px; }
.rpc-root.rpc-scope .rp-btn-link { padding-left: var(--space-3); padding-right: var(--space-3); color: var(--ink); }
.rpc-root.rpc-scope .rp-btn-link .rp-icon { transition: transform .15s ease; }
.rpc-root.rpc-scope .rp-btn-link:hover .rp-icon { transform: translateX(3px); }
.rpc-root.rpc-scope .rp-icon { display: block; flex: none; }
.rpc-root.rpc-scope .rp-counter { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); }
.rpc-root.rpc-scope .rp-title { font-family: var(--font-display); font-weight: 700; font-size: 28px; line-height: 32px; color: var(--ink); }
.rpc-root.rpc-scope .rp-dial { position: relative; }
.rpc-root.rpc-scope .rp-ring { display: block; overflow: visible; }
.rpc-root.rpc-scope .rp-seg { fill: none; stroke: var(--gold-soft); transition: stroke .2s ease; }
.rpc-root.rpc-scope .rp-seg.is-on { stroke: var(--gold); }
.rpc-root.rpc-scope .rp-seg.is-last { animation: rp-pop .4s cubic-bezier(.2,.8,.2,1); }
@keyframes rp-pop { 0% { stroke: var(--ink); } 100% { stroke: var(--gold); } }
.rpc-root.rpc-scope .rp-ring-track { fill: none; stroke: var(--gold-soft); }
.rpc-root.rpc-scope .rp-ring-fill { fill: none; stroke: var(--gold); stroke-linecap: round; transition: stroke-dashoffset .35s cubic-bezier(.2,.8,.2,1); }
.rpc-root.rpc-scope .rp-ring-inner { fill: var(--black); stroke: var(--gold-soft); stroke-width: 1; }
.rpc-root.rpc-scope .rp-ring-disc { fill: var(--gold); opacity: 0; transform: scale(.88); transform-origin: center; transform-box: fill-box; transition: opacity .25s ease, transform .4s cubic-bezier(.2,.8,.2,1); }
.rpc-root.rpc-scope .rp-ring-disc.is-on { opacity: 1; transform: scale(1); }
.rpc-root.rpc-scope .rp-face { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-align: center; pointer-events: none; }
.rpc-root.rpc-scope .rp-unit { font-family: var(--font-display); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-count { font-family: var(--font-display); font-weight: 700; line-height: .88; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--gold); }
.rpc-root.rpc-scope .rp-caption { font-family: var(--font-display); font-size: 16px; line-height: 20px; font-weight: 600; letter-spacing: .04em; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.rpc-root.rpc-scope .rp-counter.is-done .rp-unit,
.rpc-root.rpc-scope .rp-counter.is-done .rp-count,
.rpc-root.rpc-scope .rp-counter.is-done .rp-caption { color: var(--on-gold); }
.rpc-root.rpc-scope .rp-controls { display: flex; align-items: center; justify-content: center; gap: var(--space-4); height: var(--tap-main); }
.rpc-root.rpc-scope .rp-round { width: var(--tap-min); padding: 0; }
.rpc-root.rpc-scope .rp-plus { width: var(--tap-main); height: var(--tap-main); padding: 0; }
.rpc-root.rpc-scope .rp-plus.rp-next { width: 148px; padding: 0 var(--space-5); font-size: 15px; }
.rpc-root.rpc-scope .rp-sets { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); }
.rpc-root.rpc-scope .rp-label { font-family: var(--font-display); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-label b { color: var(--gold); font-weight: 700; }
.rpc-root.rpc-scope .rp-gold { color: var(--gold); }
.rpc-root.rpc-scope .rp-set-list { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.rpc-root.rpc-scope .rp-set { position: relative; width: 20px; height: 4px; border-radius: var(--radius-pill); background: var(--gold-soft); overflow: hidden; }
.rpc-root.rpc-scope .rp-set i { position: absolute; inset: 0 auto 0 0; display: block; background: var(--gold); border-radius: inherit; transition: width .3s cubic-bezier(.2,.8,.2,1); }
.rpc-root.rpc-scope .rp-set-current { box-shadow: inset 0 0 0 1px var(--amber); }
.rpc-root.rpc-scope .rp-tool { position: relative; box-sizing: border-box; width: 100%; max-width: 400px; aspect-ratio: 1 / 1; background: var(--surface); border: 1px solid var(--gold-soft); border-radius: var(--radius-lg); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); outline: none; box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .45); transition: border-color .2s ease; }
.rpc-root.rpc-scope .rp-tool:focus-visible { border-color: var(--gold); }
.rpc-root.rpc-scope .rp-tool-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); flex: none; }
.rpc-root.rpc-scope .rp-tool-id { min-width: 0; }
.rpc-root.rpc-scope .rp-tool-title { font-family: var(--font-display); font-weight: 700; font-size: 26px; line-height: 28px; letter-spacing: -.005em; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rpc-root.rpc-scope .rp-tool-detail { font-size: 13px; line-height: 18px; color: var(--ink-muted); margin-top: 4px; }
.rpc-root.rpc-scope .rp-tool-keys { display: flex; align-items: center; gap: 6px; }
.rpc-root.rpc-scope .rp-tool-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: none; padding-top: 2px; }
.rpc-root.rpc-scope .rp-tool-sum { font-size: 12px; line-height: 16px; color: var(--ink-muted); white-space: nowrap; }
.rpc-root.rpc-scope .rp-tool-sum b { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.rpc-root.rpc-scope .rp-tool-body { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.rpc-root.rpc-scope .rp-tool .rp-counter { gap: var(--space-4); }
.rpc-root.rpc-scope .rp-tool-finish { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); text-align: center; }
.rpc-root.rpc-scope .rp-tool-total { font-family: var(--font-display); font-weight: 700; font-size: 96px; line-height: .9; color: var(--gold); font-variant-numeric: tabular-nums; }
.rpc-root.rpc-scope .rp-tool-total span { color: var(--amber); margin: 0 .1em; font-size: .55em; vertical-align: .28em; }
.rpc-root.rpc-scope .rp-tool-note { margin: 0 0 var(--space-3); font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-kbd { display: inline-block; font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .02em; padding: 1px 6px; border-radius: var(--radius-sm); background: var(--gold-soft); color: var(--ink); box-shadow: inset 0 -1px 0 var(--line); }
@media (hover: none) {
  .rpc-root.rpc-scope .rp-tool-keys .rp-kbd { display: none; }
  .rpc-root.rpc-scope .rp-tool-keys::before { content: "Tap + to count"; }
  .rpc-root.rpc-scope .rp-tool-keys { font-size: 0; }
  .rpc-root.rpc-scope .rp-tool-keys::before { font-size: 13px; }
}
.rpc-root.rpc-scope .rp-hero { position: relative; overflow: hidden; background: var(--black); color: var(--ink); padding: 0 var(--space-12) var(--space-16); }
.rpc-root.rpc-scope .rp-hero-rings { position: absolute; width: 900px; height: 900px; right: -200px; top: 50%; transform: translateY(-46%); pointer-events: none; }
.rpc-root.rpc-scope .rp-hero-ring { fill: none; stroke: var(--gold-soft); stroke-width: 1.5; }
.rpc-root.rpc-scope .rp-hero-ring-0 { stroke-dasharray: 2 10; }
.rpc-root.rpc-scope .rp-nav { position: relative; display: flex; align-items: center; gap: var(--space-8); max-width: 1120px; margin: 0 auto; height: 72px; }
.rpc-root.rpc-scope .rp-brand { font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); text-decoration: none; }
.rpc-root.rpc-scope .rp-nav-links { display: flex; gap: var(--space-8); margin-left: auto; }
.rpc-root.rpc-scope .rp-nav-links a { color: var(--ink-muted); text-decoration: none; font-size: 14px; font-weight: 500; transition: color .15s ease; }
.rpc-root.rpc-scope .rp-nav-links a:hover { color: var(--ink); }
.rpc-root.rpc-scope .rp-nav a:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; border-radius: 2px; }
.rpc-root.rpc-scope .rp-hero-grid { position: relative; max-width: 1120px; margin: 0 auto; padding-top: var(--space-6); display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: var(--space-16); align-items: center; }
.rpc-root.rpc-scope .rp-hero-copy { display: flex; flex-direction: column; align-items: flex-start; max-width: 580px; }
.rpc-root.rpc-scope .rp-eyebrow { display: inline-flex; align-items: center; gap: var(--space-2); height: 28px; padding: 0 var(--space-3) 0 10px; border: 1px solid var(--gold-soft); border-radius: var(--radius-pill); font-size: 12px; font-weight: 500; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-eyebrow i { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }
.rpc-root.rpc-scope .rp-hero-title { margin: var(--space-5) 0 0; font-family: var(--font-display); font-weight: 700; font-size: 80px; line-height: .92; letter-spacing: -.01em; text-transform: uppercase; color: var(--ink); }
.rpc-root.rpc-scope .rp-hero-title em { font-style: normal; color: var(--gold); }
.rpc-root.rpc-scope .rp-hero-sub { margin: var(--space-5) 0 0; max-width: 440px; font-size: 17px; line-height: 27px; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-hero-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-8); }
.rpc-root.rpc-scope .rp-hero-points { list-style: none; margin: var(--space-10) 0 0; padding: var(--space-5) 0 0; border-top: 1px solid var(--gold-soft); display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.rpc-root.rpc-scope .rp-hero-points li { display: flex; align-items: center; gap: var(--space-2); font-size: 13px; line-height: 20px; color: var(--ink-muted); }
.rpc-root.rpc-scope .rp-hero-points li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--gold); }
.rpc-root.rpc-scope .rp-hero-tool { display: flex; justify-content: flex-end; }
@container rpc (max-width: 1080px) {
  .rpc-root.rpc-scope .rp-hero-title { font-size: 68px; }
  .rpc-root.rpc-scope .rp-hero-grid { gap: var(--space-10); }
}
@container rpc (max-width: 900px) {
  .rpc-root.rpc-scope .rp-hero { padding: 0 var(--space-5) var(--space-12); }
  .rpc-root.rpc-scope .rp-hero-grid { grid-template-columns: 1fr; gap: var(--space-10); padding-top: var(--space-4); }
  .rpc-root.rpc-scope .rp-hero-tool { justify-content: center; }
  .rpc-root.rpc-scope .rp-nav-links { display: none; }
  .rpc-root.rpc-scope .rp-nav-cta { margin-left: auto; }
  .rpc-root.rpc-scope .rp-hero-rings { width: 640px; height: 640px; right: -280px; top: 480px; transform: none; }
}
@container rpc (max-width: 520px) {
  .rpc-root.rpc-scope .rp-hero-title { font-size: 52px; }
  .rpc-root.rpc-scope .rp-hero-sub { font-size: 16px; line-height: 24px; }
  .rpc-root.rpc-scope .rp-tool { padding: var(--space-5); }
  .rpc-root.rpc-scope .rp-tool .rp-dial { transform: scale(.8); margin: -21px 0; }
}

/* WordPress: the site supplies the nav, so the hero gets its own top padding. */
.rpc-root.rpc-scope .rp-hero { padding-top: var(--space-12); }
@container rpc (max-width: 900px) { .rpc-root.rpc-scope .rp-hero { padding-top: var(--space-10); } }