/* Shared styles for individual WiT Forum 2026 partner pages.
   Mirrors the design tokens and components used in index.html so these
   pages feel like part of the same site. Link from index.html partner
   logos to /partners/<slug>.html to use this. */

:root {
  --purple: #623CEA;
  --purple-soft: #CEC2FF;
  --purple-deep: #623CEA;
  --orange: #FF8442;
  --orange-glow: rgba(255,132,66,0.18);
  --cyan: #7ee8f5;
  --bg: #0a080f;
  --bg-2: #0e0b17;
  --bg-3: #130e1f;
  --text: #f0ecff;
  --mute: rgba(240,236,255,0.65);
  --mute-2: rgba(240,236,255,0.38);
  --line: rgba(255,255,255,0.07);
  --line-strong: rgba(255,255,255,0.13);
  --glass: rgba(255,255,255,0.04);
  --glass-2: rgba(255,255,255,0.02);
  --page-bg:
    radial-gradient(700px 500px at 15% 0%, rgba(98,60,234,0.16), transparent 60%),
    radial-gradient(500px 400px at 90% 10%, rgba(255,132,66,0.08), transparent 58%),
    linear-gradient(180deg, #0d0a18 0%, #0a080f 40%);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

/* ── TOP BAR (same as homepage) ── */
.top-bar { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; padding: 16px 40px; background: rgba(10,8,15,0.82); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid var(--line); }
.logo img { display: block; height: 44px; width: auto; filter: brightness(0) invert(1); }
.top-meta { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--mute-2); }
.top-meta .date { font-family: 'Space Grotesk', sans-serif; font-weight: 500; letter-spacing: 0.3px; }
.top-cta-ghost { display: inline-flex; align-items: center; gap: 6px; padding: 9px 20px; background: transparent; color: var(--text); font-size: 13px; font-weight: 700; border-radius: 999px; border: 1px solid var(--line-strong); transition: transform 0.18s cubic-bezier(0.34,1.56,0.64,1), border-color 0.15s ease, color 0.15s ease; }
.top-cta-ghost:hover { transform: translateY(-1px) scale(1.03); border-color: var(--orange); color: var(--orange); }

/* ── PAGE HERO / PROFILE HEADER ── */
.partner-hero { position: relative; padding: 64px 40px 56px; background: var(--page-bg); border-bottom: 1px solid var(--line); }
.partner-hero-inner { max-width: 820px; margin: 0 auto; }
.back-link { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--mute); margin-bottom: 36px; transition: color 0.15s ease, gap 0.15s ease; }
.back-link:hover { color: var(--orange); gap: 11px; }
.tier-badge { display: inline-flex; align-items: center; gap: 8px; font-family: 'Space Grotesk', sans-serif; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 2.5px; color: var(--orange); padding: 8px 16px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--glass-2); margin-bottom: 28px; }
.tier-badge .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 10px var(--orange); }
.partner-logo-large { height: 56px; width: auto; max-width: 260px; filter: brightness(0) invert(1); margin-bottom: 28px; }
.partner-hero h1 { font-weight: 800; font-size: clamp(32px, 4.5vw, 52px); line-height: 1.05; letter-spacing: -0.03em; color: var(--text); margin-bottom: 16px; }
.partner-hero .lead { font-size: 18px; line-height: 1.6; color: var(--mute); max-width: 640px; margin-bottom: 32px; }
.partner-links { display: flex; gap: 10px; flex-wrap: wrap; }
.partner-links a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; font-size: 14px; font-weight: 600; border-radius: 999px; background: transparent; color: var(--text); border: 1px solid var(--line-strong); transition: transform 0.18s cubic-bezier(0.34,1.56,0.64,1), border-color 0.15s ease, background 0.15s ease, color 0.15s ease; }
.partner-links a:hover { transform: translateY(-2px); border-color: var(--orange); color: var(--orange); background: rgba(255,132,66,0.06); }

/* ── CONTENT SECTION ── */
.partner-body { padding: 72px 40px 120px; background: var(--bg); }
.partner-body-inner { max-width: 820px; margin: 0 auto; }
.partner-body .section-label { display: flex; width: fit-content; align-items: center; gap: 10px; font-family: 'Space Grotesk', sans-serif; font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 2.5px; color: var(--orange); margin-bottom: 40px; }
.partner-body .section-label::before { content: ""; width: 28px; height: 1px; background: var(--orange); opacity: 0.6; }
.partner-intro { font-size: 17px; line-height: 1.7; color: var(--mute); margin-bottom: 48px; max-width: 720px; }

.qa-list { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.qa-item { padding: 32px 0; border-bottom: 1px solid var(--line); }
.qa-item h3 { font-weight: 700; font-size: 19px; letter-spacing: -0.01em; color: var(--text); margin-bottom: 12px; }
.qa-item p { font-size: 16px; line-height: 1.7; color: var(--mute); margin-bottom: 12px; max-width: 700px; }
.qa-item p:last-child { margin-bottom: 0; }

/* ── SESSION CARD (workshop-style partner pages, e.g. Knowit) ── */
.session-card { margin: 0 0 56px; padding: 36px 40px; background: linear-gradient(135deg, rgba(98,60,234,0.1), rgba(255,132,66,0.04)); border: 1px solid var(--line-strong); border-radius: 20px; }
.session-card .label { font-family: 'Space Grotesk', sans-serif; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 2.5px; color: var(--orange); margin-bottom: 14px; }
.session-card h2 { font-weight: 800; font-size: clamp(24px, 3vw, 32px); color: var(--text); letter-spacing: -0.02em; line-height: 1.15; margin-bottom: 16px; }
.session-card p { font-size: 16.5px; line-height: 1.7; color: var(--mute); max-width: 680px; }

.facilitators-label { font-family: 'Space Grotesk', sans-serif; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 2.5px; color: var(--mute-2); margin-bottom: 24px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.facilitators-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.facilitator-card { padding: 28px; background: var(--glass-2); border: 1px solid var(--line); border-radius: 16px; }
.facilitator-card .name { font-weight: 700; font-size: 18px; color: var(--text); margin-bottom: 4px; }
.facilitator-card .title { font-size: 13px; font-weight: 600; color: var(--orange); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 14px; }
.facilitator-card p { font-size: 15px; line-height: 1.6; color: var(--mute); }

/* ── FOOTER (same as homepage) ── */
footer { padding: 48px 40px 64px; background: var(--bg); color: var(--mute-2); font-size: 13px; border-top: 1px solid var(--line); }
.footer-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; }
.footer-logo img { height: 24px; filter: brightness(0) invert(1); opacity: 0.7; }
.footer-meta { text-align: center; color: var(--mute-2); }
.footer-links { display: flex; gap: 20px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.footer-links a { color: var(--mute-2); transition: color 0.15s ease; position: relative; }
.footer-links a:hover { color: var(--orange); }
.footer-socials { display: flex; gap: 10px; align-items: center; padding-left: 16px; border-left: 1px solid var(--line); margin-left: 4px; }
.footer-socials a { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--line); color: var(--mute-2); transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease; }
.footer-socials a:hover { color: var(--orange); border-color: var(--orange); background: rgba(255,132,66,0.08); }
.footer-socials svg { width: 14px; height: 14px; }

@media (max-width: 720px) {
  .top-bar { padding: 14px 20px; }
  .partner-hero { padding: 44px 20px 40px; }
  .partner-body { padding: 48px 20px 80px; }
  .session-card { padding: 28px 24px; }
  .footer-inner { grid-template-columns: 1fr; text-align: center; }
  .footer-links { justify-content: center; }
}
