/* ==========================================================================
   STAY FREE ENTERPRISE — proof gallery + client-message wall (2026-07-13)
   Two horizontal scroll-snap strips of REAL client artifacts:
     .sf-proofwall  — redacted 3-bureau result reports (numeric content lives
                      in the images; captions stay non-numeric, and the
                      section carries a same-screen disclaimer of equal
                      visual weight per plan §6)
     .sf-saywall    — text-message screenshots, framed like the phones they
                      came from
   Click any card -> <dialog> lightbox (proof-gallery.js). Tokens only.
   ========================================================================== */

.sf-proofwall__strip,
.sf-saywall__strip {
  display: flex;
  gap: var(--sf-space-4);
  overflow-x: auto;
  padding: var(--sf-space-4) var(--sf-space-2) var(--sf-space-5);
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-color: var(--sf-gold) transparent;
}

.sf-proofcard {
  flex: 0 0 auto;
  scroll-snap-align: center;
  border: 0;
  padding: 0;
  background: var(--sf-bg-primary);
  border-radius: var(--sf-radius-md);
  box-shadow: var(--sf-elevation-1);
  cursor: zoom-in;
  transition: transform var(--sf-dur-fast) var(--sf-ease-out),
              box-shadow var(--sf-dur-fast) var(--sf-ease-out);
}
.sf-proofcard:nth-child(odd)  { transform: rotate(-0.6deg); }
.sf-proofcard:nth-child(even) { transform: rotate(0.5deg); }
.sf-proofcard:hover, .sf-proofcard:focus-visible {
  transform: rotate(0deg) translateY(-4px);
  box-shadow: var(--sf-elevation-2);
  z-index: 1;
}
.sf-proofcard:focus-visible { outline: 2px solid var(--sf-gold); outline-offset: 3px; }

.sf-proofcard img {
  display: block;
  width: 220px;
  height: 300px;
  object-fit: cover;
  object-position: top;
  border-radius: var(--sf-radius-md) var(--sf-radius-md) 0 0;
}
.sf-proofcard--wide img { width: 320px; object-fit: contain; background: var(--sf-ivory); }
.sf-proofcard figcaption {
  padding: var(--sf-space-2) var(--sf-space-3);
  font-size: var(--sf-text-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sf-teal);
}

/* message-wall cards: phone-bezel framing */
.sf-saycard {
  flex: 0 0 auto;
  scroll-snap-align: center;
  border: 0;
  padding: 6px;
  background: var(--sf-charcoal);
  border-radius: 18px;
  box-shadow: var(--sf-elevation-1);
  cursor: zoom-in;
  transition: transform var(--sf-dur-fast) var(--sf-ease-out);
}
.sf-saycard:nth-child(odd)  { transform: rotate(0.6deg); }
.sf-saycard:nth-child(even) { transform: rotate(-0.5deg); }
.sf-saycard:hover, .sf-saycard:focus-visible { transform: rotate(0deg) translateY(-4px); z-index: 1; }
.sf-saycard:focus-visible { outline: 2px solid var(--sf-gold); outline-offset: 3px; }
.sf-saycard img {
  display: block;
  width: 200px;
  height: 340px;
  object-fit: cover;
  object-position: top;
  border-radius: 13px;
}

/* same-screen disclaimer, equal visual weight (plan §6) */
.sf-proofwall__disclaimer {
  display: block;
  max-width: 46rem;
  margin-top: var(--sf-space-2);
  padding: var(--sf-space-3) var(--sf-space-4);
  border-left: 3px solid var(--sf-gold);
  background: var(--sf-bg-alt);
  color: var(--sf-text-primary);
  font-size: var(--sf-text-sm);
}

/* ---- lightbox ---- */
.sf-proof-dialog {
  border: 0;
  padding: 0;
  background: transparent;
  max-width: min(92vw, 620px);
}
.sf-proof-dialog::backdrop { background: rgba(7, 39, 31, 0.82); }
.sf-proof-dialog img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 88vh;
  object-fit: contain;
  border-radius: var(--sf-radius-md);
  background: var(--sf-ivory);
}
.sf-proof-dialog__close {
  position: absolute;
  top: -14px; right: -14px;
  width: 40px; height: 40px;
  border: 0;
  border-radius: 50%;
  background: var(--sf-gold);
  color: var(--sf-midnight-teal);
  font-size: 1.2rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--sf-shadow-soft);
}
.sf-proof-dialog__close:focus-visible { outline: 2px solid var(--sf-ivory); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .sf-proofcard, .sf-saycard { transform: none; transition: none; }
}

/* ---- consult wall (book page): 3 vertical consultation videos ---- */
.sf-consultwall__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--sf-space-4);
  max-width: 56rem;
  margin-inline: auto;
}
.sf-consultwall .sf-testimonial--video .sf-testimonial__poster { aspect-ratio: 9 / 16; }