/* Sponsor page — mirrors the homepage design system (tokens, nav, CTA, footer) */
:root {
  --brand:          #2D8653;
  --brand-hover:    #256B44;
  --brand-2:        #3A9E63;
  --text-primary:   #181d27;
  --text-secondary: #414651;
  --text-tertiary:  #535862;
  --bg-primary:     #ffffff;
  --bg-secondary:   #fafafa;
  --bg-body:        #f2f3f5;
  --bg-dark:        #0a0d12;
  --border-secondary:#e9eaeb;
  --font-ui:        'Inter', sans-serif;
  --font-headline:  'Archivo Black', 'Inter', sans-serif;
  --headline-color-light: #0D1B3E;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: auto; }
body {
  font-family: var(--font-ui);
  font-size: 14px;
  color: var(--text-primary);
  background: var(--bg-body);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  cursor: none;
}

/* CURSOR */
.cur-ring {
  position: fixed; pointer-events: none; z-index: 99999;
  width: 32px; height: 32px;
  border: 1.5px solid var(--brand);
  background: transparent;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width .35s cubic-bezier(.16,1,.3,1), height .35s cubic-bezier(.16,1,.3,1), background .3s ease, opacity .3s ease;
}
.cur-dot {
  position: fixed; pointer-events: none; z-index: 99999;
  width: 6px; height: 6px;
  background: var(--brand);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.cur-ring.on-link { width: 48px; height: 48px; background: rgba(45,134,83,0.15); }

/* NAV */
#nav {
  position: fixed;
  top: 16px; left: 50%;
  transform: translateX(-50%) translateY(-120px);
  z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  gap: 4px;
  background: #F0F0F0;
  border-radius: 55px;
  height: 81px;
  padding: 0 12px 0 24px;
  white-space: nowrap;
  opacity: 0;
  transition: transform .5s cubic-bezier(.4,0,.6,1), opacity .5s ease, box-shadow .3s ease;
  box-shadow: 0 2px 16px rgba(0,0,0,0.08);
}
#nav.visible { transform: translateX(-50%) translateY(0); opacity: 1; }
#nav.scrolled { box-shadow: 0 8px 32px rgba(0,0,0,0.12); }
.nav-logo {
  font-family: var(--font-ui);
  font-size: 15px; font-weight: 700;
  color: var(--text-primary); text-decoration: none;
  display: flex; align-items: center; gap: 9px;
  margin-right: 20px;
}
.nav-logo-img { height: 30px; width: auto; display: block; }
.nav-link {
  font-family: var(--font-ui);
  font-size: 16px; font-weight: 600;
  color: var(--text-secondary);
  text-decoration: none;
  padding: 8px 16px; border-radius: 40px;
  transition: color .2s, background .2s;
}
.nav-link:hover { color: var(--text-primary); background: rgba(0,0,0,0.04); }
.nav-cta {
  background: #000; color: #fff;
  font-family: var(--font-ui);
  font-size: 15px; font-weight: 600;
  padding: 10px 20px;
  border-radius: 43px;
  text-decoration: none; margin-left: 8px;
  transition: background .2s, transform .2s;
  flex-shrink: 0;
}
.nav-cta:hover { background: #1a1a1a; }
.lang-toggle { display: flex; align-items: center; gap: 2px; margin: 0 4px; }
.lang-toggle-btn {
  font-family: var(--font-ui); font-size: 12px; font-weight: 700;
  color: var(--text-tertiary); background: none; border: none; cursor: pointer;
  padding: 6px 8px; border-radius: 20px; transition: color .2s, background .2s;
}
.lang-toggle-btn:hover { color: var(--text-primary); }
.lang-toggle-btn.active { color: var(--brand-2); background: rgba(45,134,83,0.1); }

/* HERO */
.sp-hero {
  background: var(--bg-secondary);
  position: relative; overflow: hidden;
  padding: 200px 64px 120px;
  text-align: center;
}
.hero-noise {
  position: absolute; inset: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: 0.025;
}
.sp-hero-inner { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; }
.sp-tag {
  font-size: 12px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--brand); display: block; margin-bottom: 20px;
}
.sp-hero h1 {
  font-family: var(--font-headline); font-weight: 800;
  font-size: clamp(40px, 5.8vw, 72px); line-height: 1.02; letter-spacing: normal;
  color: var(--headline-color-light);
}
.sp-hero h1 .accent { color: var(--brand); }
.sp-hero p {
  font-size: 17px; color: var(--text-tertiary); line-height: 1.6;
  max-width: 520px; margin: 24px auto 0; font-weight: 400;
}

/* VIDEO */
.sp-video { background: var(--bg-primary); padding: 100px 64px; position: relative; }
.sp-video-inner { max-width: 880px; margin: 0 auto; }
.sponsor-video { width: 100%; aspect-ratio: 16 / 9; display: block; border-radius: 24px; background: #000; box-shadow: 0 24px 64px rgba(13,27,62,.12); }

/* CTA */
.cta { background: var(--bg-secondary); padding: 140px 64px; text-align: center; position: relative; overflow: hidden; }
.cta-blob { position: absolute; width: 500px; height: 500px; border-radius: 50%; background: radial-gradient(circle,rgba(45,134,83,.06) 0%,transparent 70%); top: 50%; left: 50%; transform: translate(-50%,-50%); pointer-events: none; }
.cta-line-wrap { overflow: hidden; padding-bottom: .15em; margin-bottom: -.15em; }
.cta-line-inner {
  display: block;
  transform: translateY(110%);
  transition: transform .85s cubic-bezier(.76,0,.24,1);
}
.cta-line-inner.show { transform: translateY(0); }
.cta-d0 { transition-delay: 0ms; }
.cta-d1 { transition-delay: 200ms; }
.cta-d2 { transition-delay: 400ms; }
.cta-h { font-family: var(--font-headline); font-size: clamp(32px,5vw,60px); font-weight: 800; line-height: 1.05; letter-spacing: normal; color: var(--headline-color-light); max-width: 720px; margin: 0 auto; }
.cta-h .accent { color: var(--brand); }
.cta-sub { font-size: 16px; color: var(--text-tertiary); font-weight: 300; margin: 20px auto 0; max-width: 520px; line-height: 1.6; }
.cta-actions { display: flex; gap: 12px; justify-content: center; margin-top: 44px; }
.btn-brand { background: var(--brand); color: #fff; font-size: 15px; font-weight: 600; padding: 14px 36px; border-radius: 100px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: background .2s, transform .2s; box-shadow: 0 8px 32px rgba(45,134,83,.4); }
.btn-brand:hover { background: var(--brand-hover); transform: translateY(-2px); }

/* FOOTER */
footer { background: var(--headline-color-light); padding: 80px 64px 32px; }
.footer-top { display: flex; justify-content: space-between; gap: 60px; padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.1); }
.footer-brand { max-width: 280px; }
.footer-logo-img { height: 26px; width: auto; display: block; margin-bottom: 14px; filter: brightness(0) invert(1); }
.footer-tagline { font-size: 14px; color: rgba(255,255,255,.55); line-height: 1.6; }
.footer-social { display: flex; gap: 10px; margin-top: 24px; }
.footer-social a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.08); display: flex; align-items: center; justify-content: center; text-decoration: none; font-size: 15px; color: #fff; transition: background .2s; }
.footer-social a svg { flex-shrink: 0; }
.footer-social a:hover { background: rgba(255,255,255,.18); }
.footer-cols { display: flex; gap: 64px; }
.fc-title { font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.35); margin-bottom: 16px; }
.fc a { display: block; font-size: 14px; color: rgba(255,255,255,.7); text-decoration: none; margin-bottom: 10px; transition: color .2s; }
.fc a:hover { color: #fff; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 28px; font-size: 13px; color: rgba(255,255,255,.4); }
.footer-cta { background: #fff; color: var(--headline-color-light); font-size: 14px; font-weight: 600; padding: 12px 28px; border-radius: 100px; text-decoration: none; transition: background .2s; }
.footer-cta:hover { background: rgba(255,255,255,.85); }
.fpulse { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--brand-2); margin-right: 6px; animation: fpulse 2s ease-in-out infinite; }
@keyframes fpulse { 0%,100%{opacity:1} 50%{opacity:.3} }

/* SCROLL REVEAL */
[data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity .65s ease, transform .65s ease; }
[data-reveal].in { opacity: 1; transform: translateY(0); }
.rv-word { display: inline; will-change: color; transition: color 0.1s ease; }

/* Small screens / touch */
@media (pointer: coarse) {
  body { cursor: auto; }
  .cur-ring, .cur-dot { display: none; }
}
@media (max-width: 860px) {
  #nav .nav-link:not(.nav-home) { display: none; }
  .sp-hero { padding: 160px 24px 80px; }
  .sp-video, .cta { padding-left: 24px; padding-right: 24px; }
  footer { padding: 56px 24px 24px; }
  .footer-top { flex-direction: column; gap: 40px; }
  .footer-cols { flex-wrap: wrap; gap: 32px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 16px; }
}
@media (max-width: 520px) {
  #nav .nav-cta { display: none; }
}
