/* Small rendered-review refinements; same words, palette and image assets. */
:is(h1, h2, h3, h4, .eyebrow, .card-kicker, .cf-endcap__ask) { text-wrap: balance; }
p { text-wrap: pretty; }
.tune-keep { white-space: nowrap; }

/* Keep separators with the preceding trust item, never at the next line start. */
.hero .cf-trust-strip { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 8px; }
.tune-trust-item { white-space: nowrap; }

/* Matching outline actions and equally tall second-row slots. No status chrome. */
/* Superseded by the matched disabled button treatment below. */

/* A clearly visible primary hover using existing light-gold/bronze colors. */
html .button-primary {
  transition: transform 220ms ease-out, opacity 220ms ease-out, background-color 160ms ease-out, box-shadow 180ms ease-out;
}
html .button-primary:hover, html .cm-lane-science .button-primary:hover {
  transform: translateY(-2px); background: var(--cf-gold-light); color: var(--cf-on-accent);
  opacity: 1; filter: none; box-shadow: 0 8px 24px rgba(212, 165, 116, 0.35);
}
html .button-primary:active, html .cm-lane-science .button-primary:active { transform: scale(0.98); }

/* Reuse the existing local explainer artwork while the YouTube frame loads. */
.design-eli5 #explainer .cf-media {
  background: var(--cf-navy) url('../assets/explainer-poster.webp') center / cover no-repeat;
}
.design-eli5 #explainer .cf-media.tune-video-wait::before {
  content: ""; position: absolute; inset: 0; z-index: 1; background: inherit; pointer-events: none;
}
.design-eli5 #explainer .cf-media.tune-video-wait iframe { visibility: hidden; }

/* Allow action rows to wrap between buttons, not within their labels. */
.button-primary, .button-secondary, .site-footer a[href="https://ko-fi.com/cefritelabs"] { white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  html .button-primary:hover, html .cm-lane-science .button-primary:hover,
  html .button-primary:active, html .cm-lane-science .button-primary:active {
    transform: none !important; opacity: 1 !important; filter: none;
    background: var(--cf-accent); box-shadow: none; transition: none !important;
  }
}

/* Symmetry: stretch every card row without changing the editorial chronology. */
.cf-grid-2, .cf-grid-3, .cf-named-pair { align-items: stretch; }
:is(.cf-grid-2, .cf-grid-3) > .card,
.cf-contact-lane > .contact-card {
  display: flex; flex-direction: column; height: 100%; width: 100%; margin-inline: 0;
}
/* Real action pairs remain one bottom-pinned unit, regardless of prose length. */
.tune-card-actions, .tune-contact-actions { margin-top: auto; padding-top: 24px; display: flex; flex-direction: column; gap: 12px; }
#involved .tune-card-actions > .cf-card-cta { margin: 0; width: 100%; }
#involved .tune-card-actions :is(.button-primary, .button-secondary) { width: 100%; min-width: 0; min-height: 48px; }
.tune-contact-actions > p { margin: 0; }
.cf-card > .cf-card__status { margin-top: auto; padding-top: 12px; }
/* CEF/RITE: same full-width outline row and same full-width second-row slot. */
.cf-named-pair > .cf-named .cf-named__action { margin-top: auto; align-items: stretch; }
.cf-named-pair > .cf-named .cf-named__action :is(.button-primary, .button-secondary, .tune-disabled) {
  width: 100%; min-width: 0; min-height: 48px; padding: 12px 20px;
  border-radius: 12px; font: 600 14px/1.4 var(--cf-font-body);
}
.cf-named-pair .tune-disabled {
  display: inline-flex; align-items: center; justify-content: center; margin: 0;
  background: var(--cf-surface); color: var(--cf-text-muted); border: 1px solid var(--cf-line-strong);
  appearance: none; white-space: nowrap; pointer-events: none; cursor: default; transform: none; filter: none; box-shadow: none; transition: none; animation: none;
}
/* Equal-width closing buttons; 4-action groups form 2x2 until a full row fits. */
.closing-actions, .design-eli5 .closing-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; width: 100%; }
.closing-actions > :is(.button-primary, .button-secondary) { width: 100%; min-width: 0; min-height: 48px; }
@media (max-width: 639px) {
  .closing-actions, .design-eli5 .closing-actions { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 640px) and (max-width: 899px) {
  .closing-actions.tune-actions-3 { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 900px) {
  .closing-actions.tune-actions-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
  .design-eli5 .closing-actions.tune-actions-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* The opening CTA pair shares the video spine and two equal columns as well. */
.hero .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: 640px; margin-inline: auto; }
.hero-actions > :is(.button-primary, .button-secondary) { width: 100%; min-width: 0; }
@media (max-width: 639px) {
  .hero .hero-actions { grid-template-columns: minmax(0, 1fr); }
}