/* =========================================================
   WIRESTREAM MEDIA — PARTNERS PAGE, DESIGN PREVIEWS
   Two competing directions for the "Partners" page (World Wide
   Group + Event Technology Solutions), for review only. Loads
   after style.css (and projects.css on Design A) and reuses their
   color/type/motion variables — nothing here redefines :root.
   Delete this file once a direction is chosen and the real
   partners.html/css is built from it.
   ========================================================= */

/* ---------------- shared: partner hero, meta pinned to bottom ---------------- */
/* Keeps the "18+ Years" / "90+ Years" meta line docked to the same
   baseline on both partner pages regardless of how long the lede
   paragraph runs (ETS's is short, WWG's wraps further) — scoped to
   .partner-cover so it doesn't touch the blog-post hero on projects.html. */
.partner-cover{ display:flex; flex-direction:column; }
.partner-cover .post-meta{ margin-top:auto; padding-top:22px; }
.partner-cover .lede{ margin-top:22px; }
/* Real partner logo, unmodified colors, sitting right beside the lede
   paragraph (not the title) — a flex row so the card is vertically
   centered on the blurb specifically. Hidden below 900px since there's
   no room next to stacked text on mobile. The card hugs the image
   tightly (no fixed box) so there's never more than ~22px of white
   showing past the logo's own edges. */
.partner-logo-badge{ display:none; }
@media(min-width: 900px){
  .partner-blurb-row{
    display: flex;
    align-items: center;
    gap: 36px;
    margin-top: 22px;
  }
  .partner-blurb-row .lede{ flex: 1 1 auto; min-width: 0; margin-top: 0; }
  .partner-logo-badge{
    display: inline-flex;
    flex: 0 0 auto;
    background: rgba(245,245,245,.97);
    border-radius: 12px;
    padding: 22px;
    box-shadow: 0 16px 40px rgba(0,0,0,.35);
  }
}
.partner-logo-badge img{
  display: block;
  width: auto;
  height: auto;
  max-width: 170px;
  max-height: 80px;
  object-fit: contain;
}

/* ---------------- shared: trust bar + collective section ---------------- */
.pv-trust-row{
  display:flex; flex-wrap:wrap; align-items:center; gap: 22px;
  margin-top: 22px;
}
.pv-trust-row img{ height: 26px; width:auto; opacity:.85; }
.pv-badge{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid var(--line-strong); border-radius: 100px;
  padding: 8px 16px;
  font-family: var(--f-display); font-size: 12px; letter-spacing:.08em; text-transform:uppercase;
  color: var(--fg-dim);
}

.pv-collective{
  display:grid; grid-template-columns: 1fr; gap: 32px;
}
@media(min-width:900px){ .pv-collective{ grid-template-columns: repeat(3,1fr); gap: 40px; } }
.pv-collective-col{ border-top: 1px solid var(--line); padding-top: 18px; }
.pv-collective-col .k{ font-family: var(--f-display); font-size: 12px; letter-spacing:.1em; text-transform:uppercase; color: var(--accent); margin-bottom: 10px; display:block; }
.pv-collective-col h3{ font-size: 1.3rem; margin-bottom: 12px; }
.pv-collective-col p{ color: var(--fg-dim); font-size: .93rem; line-height: 1.7; }
.pv-together-quote{
  margin: 46px 0 0; padding: 6px 0 6px 28px; border-left: 2px solid var(--accent-2);
}
.pv-together-quote p{
  font-family: var(--f-display); font-size: clamp(1.3rem, 3vw, 2rem); line-height:1.3; color: var(--fg); max-width: 34ch; margin:0;
}

/* =========================================================
   DESIGN A — "Field Report" (cinematic, extends projects.css
   post-cover / post-gallery / post-stats language)
   ========================================================= */
.pv-a-divider{
  padding: 70px 0 30px;
  text-align: center;
}
.pv-a-divider .section-num{ display:block; margin-bottom: 14px; }
.pv-a-divider h2{ font-size: clamp(1.6rem, 5vw, 2.8rem); color: var(--fg-muted); }

/* =========================================================
   DESIGN B — "Where We Meet" (structured editorial split +
   synergy comparison, sticky partner switcher)
   ========================================================= */
.pv-switcher{
  position: sticky;
  top: 0;
  z-index: 40;
  display:flex; gap: 0;
  border-bottom: 1px solid var(--line);
  background: rgba(7,7,10,.86);
  backdrop-filter: blur(10px);
}
.pv-switcher a{
  flex:1; text-align:center; padding: 16px 10px;
  font-family: var(--f-display); font-size: 12px; letter-spacing:.1em; text-transform:uppercase;
  color: var(--fg-muted); border-bottom: 2px solid transparent;
  transition: color .25s var(--ease), border-color .25s var(--ease);
}
.pv-switcher a.pv-ets{ border-color: transparent; }
.pv-switcher a:hover, .pv-switcher a.is-current{ color: var(--fg); }
.pv-switcher a.pv-ets.is-current{ border-color: var(--accent); }
.pv-switcher a.pv-wwg.is-current{ border-color: var(--accent-2); }

.pv-b-section{ padding: 90px 0; border-top: 1px solid var(--line); }
.pv-b-grid{ display:grid; grid-template-columns: 1fr; gap: 40px; align-items:center; }
@media(min-width:900px){ .pv-b-grid{ grid-template-columns: 1fr 1fr; gap: 60px; } }
.pv-b-media{ position:relative; border-radius: 6px; overflow:hidden; border:1px solid var(--line); aspect-ratio: 4/3; }
.pv-b-media img{ width:100%; height:100%; object-fit:cover; filter: grayscale(.1) contrast(1.05) brightness(.85); }
.pv-b-section.pv-wwg-section .pv-b-grid{ direction: rtl; }
.pv-b-section.pv-wwg-section .pv-b-grid > *{ direction: ltr; }

.pv-b-eyebrow{ font-family: var(--f-display); font-size: 12px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px; display:flex; align-items:center; gap:10px; }
.pv-ets-section .pv-b-eyebrow{ color: var(--accent); }
.pv-wwg-section .pv-b-eyebrow{ color: var(--accent-2); }
.pv-b-section h2{ font-size: clamp(1.8rem, 4.6vw, 3rem); line-height:1.02; margin-bottom: 18px; }
.pv-b-section p.pv-b-copy{ color: var(--fg-dim); font-size: .98rem; line-height:1.75; max-width: 52ch; margin: 0 0 26px; }

.pv-fact-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 18px 28px; margin-bottom: 26px; }
.pv-fact{ border-top: 1px solid var(--line); padding-top: 10px; }
.pv-fact .num{ font-family: var(--f-display); font-size: 1.5rem; display:block; }
.pv-ets-section .pv-fact .num{ color: var(--accent); }
.pv-wwg-section .pv-fact .num{ color: var(--accent-2); }
.pv-fact .lbl{ font-size: 11px; color: var(--fg-muted); text-transform:uppercase; letter-spacing:.06em; }

.pv-synergy{
  margin-top: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 26px 28px;
}
.pv-synergy .head{ font-family: var(--f-display); font-size: 12px; letter-spacing:.1em; text-transform:uppercase; color: var(--fg-muted); margin-bottom: 16px; }
.pv-synergy-row{ display:flex; justify-content:space-between; gap: 16px; padding: 10px 0; border-top: 1px solid var(--line); font-size: .92rem; }
.pv-synergy-row:first-of-type{ border-top:none; }
.pv-synergy-row .them{ color: var(--fg-dim); }
.pv-synergy-row .us{ color: var(--fg); text-align:right; }

.pv-b-strip{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: 22px; }

@media (prefers-reduced-motion: reduce){
  .pv-switcher a{ transition:none; }
}
