/* Rallify 2.0 — additions only. Every value derives from the live 1.1 palette
   (editorial-light + tracks); nothing here restyles an existing component. */
:root{
  --rallify-primary:#0c4231;      /* forest (existing --forest) */
  --rallify-secondary:#21694b;    /* green (existing --green) */
  --rallify-accent:#c5ff32;       /* Rallify lime */
  --rallify-accent-ink:#14240b;
  --rallify-background:#eef1ee;
  --rallify-surface:#ffffff;
  --rallify-surface-soft:#e0e9de;
  --rallify-text:#111a15;
  --rallify-muted:#53665a;
  --rallify-border:#c5cec5;
  --rallify-business:#d9a441;     /* business track gold */
  --rallify-business-paper:#f4ede1;
  --rallify-politics:#e8c547;
  --rallify-success:#226543;
  --rallify-warning:#805000;
  --rallify-danger:#a72e28;
}

/* ---------- plans ---------- */
.plan-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:720px){.plan-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.plan-grid.cols-4{grid-template-columns:repeat(4,1fr)}.plan-grid.cols-3{grid-template-columns:repeat(3,1fr)}}
.plan-card{position:relative;display:flex;flex-direction:column;gap:12px;background:var(--rallify-surface);border:1px solid var(--rallify-border);border-radius:14px;padding:22px 20px;min-width:0}
.plan-card.is-recommended{border:2px solid var(--rallify-primary);box-shadow:0 14px 34px rgba(12,66,49,.12)}
.plan-card.is-current{background:var(--rallify-surface-soft)}
.plan-card .plan-badge{position:absolute;top:-11px;left:18px;background:var(--rallify-accent);color:var(--rallify-accent-ink);font:700 .72rem/1 var(--body);letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:999px}
.plan-card h3{margin:0;font-size:1.35rem}
.plan-card .plan-tagline{color:var(--rallify-muted);font-size:.92rem;margin:0}
.plan-price{font:700 2rem/1 var(--display);letter-spacing:-.03em;color:var(--rallify-text)}
.plan-price small{font:600 .82rem var(--body);letter-spacing:0;color:var(--rallify-muted)}
.plan-price s{font-size:1rem;color:var(--rallify-muted);margin-right:6px}
.plan-list{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:.92rem}
.plan-list li{display:grid;grid-template-columns:18px 1fr;gap:8px;align-items:start}
.plan-list li::before{content:"";width:16px;height:16px;margin-top:3px;border-radius:50%;background:var(--rallify-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.6L12 5.4' fill='none' stroke='%2314240b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.plan-card .btn{margin-top:auto;width:100%;justify-content:center}
.plan-radio{position:absolute;opacity:0;pointer-events:none}
label.plan-card{cursor:pointer}
label.plan-card:has(.plan-radio:checked){border:2px solid var(--rallify-primary);box-shadow:0 0 0 4px rgba(197,255,50,.55)}
label.plan-card:has(.plan-radio:focus-visible){outline:3px solid var(--rallify-accent);outline-offset:2px}
.plan-current-tag{display:inline-flex;align-items:center;gap:6px;font:700 .72rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--rallify-primary)}
.plan-section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin:56px 0 18px}
.plan-section-head h2{margin:0}
.eyebrow-slash{font:700 .72rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--rallify-muted)}

/* ---------- boosts ---------- */
.boost-row{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:720px){.boost-row{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.boost-card{background:var(--rallify-surface);border:1px solid var(--rallify-border);border-left:4px solid var(--rallify-accent);border-radius:12px;padding:16px}
.boost-card strong{display:block;font-family:var(--display);font-size:1.05rem}
.boost-card .boost-price{font:700 1.2rem var(--display);margin:6px 0}

/* ---------- held / notices ---------- */
.notice-hold{border:1px solid var(--rallify-business);background:var(--rallify-business-paper);border-radius:12px;padding:14px 16px}
.track-pill-free-start{background:var(--rallify-accent);color:var(--rallify-accent-ink)}

/* ---------- admin tables that must not overflow on phones ---------- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}

/* ---------- homepage hero (2.0) ----------
   Text-only hero keeps the 1.1 composition: headline left, description column right.
   The description, buttons and note share one grid cell so the layout is unchanged. */
.hero-side{grid-column:2;grid-row:2/4;align-self:end;min-width:0}
.hero-ctas{margin:0 0 20px;gap:10px}
.hero-highlight{color:var(--rallify-secondary)}
@media(max-width:767px){.hero-side{grid-column:auto;grid-row:auto}.hero-ctas .btn{flex:1 1 auto;justify-content:center}}
/* with an image: TEXT | IMAGE on desktop, TEXT then IMAGE on phones */
.hero.has-image .hero-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px;align-items:center}
.hero.has-image.img-left .hero-media{order:-1}
.hero.has-image .hero-copy{display:block}
.hero.has-image h1{font-size:clamp(2.6rem,4.6vw,4.4rem);max-width:14ch}
.hero.has-image .hero-side{margin-top:26px}
.hero-media{margin:0;border-radius:18px;overflow:hidden;background:var(--rallify-surface-soft);aspect-ratio:4/5;max-height:620px;border:1px solid var(--rallify-border)}
.hero-media img{width:100%;height:100%;display:block}
.hero-media.fit-cover img{object-fit:cover}
.hero-media.fit-contain img{object-fit:contain;padding:12px}
@media(max-width:899px){.hero.has-image .hero-layout{grid-template-columns:1fr;gap:28px}.hero.has-image.img-left .hero-media{order:0}.hero-media{aspect-ratio:4/3;max-height:none}}

/* featured label on cards */
.badge-featured{background:var(--rallify-accent);color:var(--rallify-accent-ink);border-color:var(--rallify-accent)}

/* KPI tiles: let columns shrink below their content on small phones and wrap long values
   (1.1 used 1fr, which cannot go below min-content). */
.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:768px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kpi{min-width:0}
.kpi b{overflow-wrap:anywhere}
