/* ============================================================
   SHARP VOICES — Main Stylesheet (Yellow/Gold Theme)
   Color: #e8a500 golden-yellow on cream background
   ============================================================ */

/* ----- CSS Custom Properties ----- */
:root {
  /* Colors — Light Golden Yellow Theme */
  --color-primary: #e8a500;
  --color-primary-light: #f7c948;
  --color-primary-dark: #b97f00;
  --color-accent: #f2a900;
  --color-accent-light: #fde68a;
  --color-bg: #fffaf0;
  --color-bg-alt: #fdf3d6;
  --color-bg-card: #ffffff;
  --color-bg-card-hover: #fff6df;
  --color-surface: #fdf3d6;
  --color-border: rgba(200,150,20,0.18);
  --color-border-light: rgba(200,150,20,0.30);
  --color-text: #3a3120;
  --color-text-secondary: #6d6144;
  --color-text-muted: #9a8c66;
  --color-white: #332c1e;
  --color-on-gold: #3a2600;
  --color-success: #0e9f6e;
  --color-error: #c0392b;
  --color-glow: rgba(232, 165, 0, 0.35);

  /* Typography */
  --font-display: 'Playfair Display', 'Noto Serif SC', serif;
  --font-body: 'Inter', 'Noto Sans SC', -apple-system, sans-serif;

  /* Spacing */
  --container-max: 1280px;
  --section-padding: 6rem 2rem;
  --section-padding-mobile: 3rem 1rem;
  --nav-height: 72px;

  /* Effects */
  --shadow-card: 0 2px 14px rgba(120,90,10,0.10);
  --shadow-card-hover: 0 14px 44px rgba(120,90,10,0.18);
  --shadow-glow: 0 0 44px rgba(232,165,0,0.22);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --transition-fast: 0.2s cubic-bezier(0.4,0,0.2,1);
  --transition-smooth: 0.4s cubic-bezier(0.4,0,0.2,1);
  --transition-bounce: 0.5s cubic-bezier(0.34,1.56,0.64,1);
}

/* ----- Reset & Base ----- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }

html {
  scroll-behavior: auto;
  overscroll-behavior: none;
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
}

body {
  font-family: var(--font-body);
  background: var(--color-bg);
  color: var(--color-text);
  line-height: 1.7;
  overflow-x: hidden;
  min-height: 100vh;
  cursor: none;
}

img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
button { cursor:none; border:none; background:none; font:inherit; color:inherit; }
input { font:inherit; }

.container { max-width:var(--container-max); margin:0 auto; padding:0 2rem; }
.section-padding { padding:var(--section-padding); }
.module { position:relative; }
.module--dark { background:var(--color-bg-alt); }
.module--gradient {
  background: linear-gradient(180deg, var(--color-bg) 0%, var(--color-bg-alt) 50%, var(--color-bg) 100%);
}
.text-center { text-align:center; }


/* ===== CUSTOM CURSOR ===== */
#cursor-dot {
  position: fixed;
  width: 8px; height: 8px;
  background: var(--color-primary);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.2s, height 0.2s, background 0.2s;
  mix-blend-mode: difference;
}
#cursor-ring {
  position: fixed;
  width: 36px; height: 36px;
  border: 1.5px solid var(--color-primary);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.35s cubic-bezier(0.16,1,0.3,1),
              height 0.35s cubic-bezier(0.16,1,0.3,1),
              border-color 0.3s, opacity 0.3s;
  opacity: 0.55;
}
#cursor-dot.hover { width:12px; height:12px; background:var(--color-primary-light); }
#cursor-ring.hover { width:56px; height:56px; border-color:var(--color-primary-light); opacity:1; }

/* ===== PRELOADER ===== */
#preloader {
  position:fixed; inset:0;
  background:var(--color-bg);
  z-index:9998;
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:1.5rem;
  transition: opacity 0.7s ease, visibility 0.7s ease;
}
#preloader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.preloader-logo {
  font-family:var(--font-display);
  font-size:1.8rem; font-weight:700;
  color:var(--color-white); letter-spacing:0.25em;
}
.preloader-bar { width:200px; height:2px; background:var(--color-border-light); border-radius:2px; overflow:hidden; }
.preloader-bar-fill { height:100%; width:0%; background:linear-gradient(90deg,var(--color-primary-dark),var(--color-primary),var(--color-primary-light)); border-radius:2px; transition:width 0.15s; }
.preloader-percent { font-size:0.8rem; color:var(--color-text-muted); font-variant-numeric:tabular-nums; }

/* ===== SCROLL PROGRESS ===== */
#scroll-progress {
  position:fixed; top:0; left:0; right:0;
  height:3px; z-index:1002; background:transparent;
}
.scroll-progress-bar { height:100%; width:0%; background:linear-gradient(90deg,var(--color-primary-dark),var(--color-primary),var(--color-primary-light)); transition:width 0.05s; }

/* ===== TOP BAR ===== */
.top-bar {
  position:fixed; top:0; left:0; right:0; z-index:1001;
  background:rgba(255,251,240,0.88); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--color-border);
  height:40px; display:flex; align-items:center;
}
.top-bar__inner { display:flex; justify-content:space-between; align-items:center; width:100%; }
.top-bar__left { display:flex; align-items:center; gap:1rem; font-size:0.8rem; color:var(--color-text-muted); }
.top-bar__right { display:flex; align-items:center; gap:1rem; }
.lang-switch { display:flex; align-items:center; gap:0; font-size:0.8rem; }
.lang-btn { color:var(--color-text-muted); padding:0.25rem 0.4rem; border-radius:4px; font-size:0.78rem; transition:color var(--transition-fast); }
.lang-btn:hover, .lang-btn.active { color:var(--color-primary-dark); }
.lang-divider { color:var(--color-border-light); margin:0 0.15rem; }
.top-bar__member-btn { display:flex; align-items:center; gap:0.4rem; color:var(--color-text-secondary); font-size:0.8rem; padding:0.25rem 0.6rem; border-radius:var(--radius-sm); border:1px solid var(--color-border); transition:all var(--transition-fast); }
.top-bar__member-btn:hover { border-color:var(--color-primary); color:var(--color-white); background:rgba(245,158,11,0.1); }

/* ===== MAIN NAV ===== */
.main-nav {
  position:fixed; top:40px; left:0; right:0; z-index:1000;
  background:rgba(255,251,240,0.92); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--color-border);
  height:var(--nav-height); display:flex; align-items:center;
  transition: transform var(--transition-smooth), background var(--transition-smooth);
}
.main-nav.scrolled { background:rgba(255,251,240,0.98); box-shadow:0 2px 20px rgba(120,90,10,0.12); }
.main-nav--hidden { transform:translateY(-100%); }
.main-nav__inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; width:100%; }

.logo { display:flex; align-items:center; gap:0.6rem; flex-shrink:0; }
.logo__icon svg { transition:transform var(--transition-smooth); }
.logo:hover .logo__icon svg { transform:rotate(-10deg); }
.logo__text { display:flex; flex-direction:column; line-height:1.2; }
.logo__title { font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:var(--color-white); }
.logo__subtitle { font-size:0.7rem; color:var(--color-text-muted); letter-spacing:0.05em; text-transform:uppercase; }

.main-nav__links { display:flex; align-items:center; gap:0.25rem; overflow-x:auto; scrollbar-width:none; }
.main-nav__links::-webkit-scrollbar { display:none; }
.nav-link { display:block; padding:0.45rem 0.8rem; font-size:0.82rem; color:var(--color-text-secondary); border-radius:var(--radius-sm); transition:all var(--transition-fast); white-space:nowrap; position:relative; }
.nav-link:hover { color:var(--color-primary-dark); background:rgba(232,165,0,0.12); }
.nav-link.active { color:var(--color-primary-dark); background:rgba(232,165,0,0.16); font-weight:600; }
.nav-link::after { content:''; position:absolute; bottom:0; left:50%; width:0; height:2px; background:var(--color-primary); transform:translateX(-50%); transition:width var(--transition-fast); }
.nav-link:hover::after { width:60%; }

.hamburger { display:none; flex-direction:column; gap:5px; padding:0.5rem; z-index:1001; }
.hamburger span { display:block; width:22px; height:2px; background:var(--color-white); border-radius:2px; transition:all var(--transition-smooth); }
.hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity:0; }
.hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* ===== MOBILE MENU ===== */
#mobileMenuOverlay {
  position:fixed; top:calc(40px + var(--nav-height)); left:0; right:0; bottom:0;
  background:rgba(255,251,240,0.99); backdrop-filter:blur(24px);
  z-index:999; display:none; flex-direction:column;
  align-items:center; justify-content:flex-start;
  padding:1.5rem 1.25rem; overflow-y:auto;
}
#mobileMenuOverlay.open { display:flex; }
.mobile-menu-link {
  font-family:var(--font-display); font-size:1.3rem;
  color:var(--color-white); padding:0.85rem 1rem;
  width:100%; max-width:400px; text-align:center;
  border-bottom:1px solid var(--color-border);
  transition:color 0.3s, background 0.3s; border-radius:8px;
}
.mobile-menu-link:hover { color:var(--color-primary-dark); background:rgba(232,165,0,0.08); }
.mobile-menu-cta { margin-top:2rem; width:100%; display:flex; flex-direction:column; align-items:center; gap:0.75rem; }

/* ===== PAGE CONTAINER ===== */
.page-container { padding-top:calc(var(--nav-height) + 40px); position:relative; z-index:1; }
.page { display:none; animation:fadeSlideIn 0.5s cubic-bezier(0.4,0,0.2,1); }
.page.active { display:block; }
@keyframes fadeSlideIn { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* ===== HERO ===== */
.hero {
  position:relative; width:100%; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; margin-top:calc(-1*(var(--nav-height)+40px));
  padding-top:calc(var(--nav-height)+40px);
}
#globeCanvas { position:absolute; inset:0; width:100%; height:100%; z-index:0; }
.hero__overlay {
  position:absolute; inset:0;
  background:radial-gradient(ellipse at center, transparent 40%, rgba(255,250,240,0.6) 70%, rgba(255,250,240,0.95) 100%);
  z-index:1; pointer-events:none;
}
.hero__content { position:relative; z-index:2; text-align:center; max-width:860px; padding:0 2rem; }
.hero__badge {
  display:inline-block; padding:0.5rem 1.25rem;
  background:rgba(255,255,255,0.75); border:1px solid rgba(200,150,20,0.28);
  border-radius:50px; font-size:0.85rem; color:var(--color-primary-dark);
  font-weight:600; backdrop-filter:blur(10px); box-shadow:0 2px 12px rgba(200,150,20,0.10);
  margin-bottom:2rem;
}
.hero__title { font-family:var(--font-display); margin-bottom:1.5rem; }
.hero__title-main { display:block; font-size:clamp(2.5rem,7vw,5rem); font-weight:800; color:var(--color-white); letter-spacing:-0.03em; line-height:1.1; }
.hero__title-divider { display:block; width:60px; height:2px; background:var(--color-primary); margin:1rem auto; }
.hero__title-sub { display:block; font-size:clamp(1.1rem,2.5vw,1.6rem); font-weight:400; color:var(--color-text-secondary); font-style:italic; line-height:1.5; }
.hero__desc { font-size:1.05rem; color:var(--color-text-secondary); line-height:1.8; margin-bottom:2.5rem; max-width:600px; margin-left:auto; margin-right:auto; }
.hero__btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.hero__scroll-indicator {
  position:absolute; bottom:40px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:var(--color-text-muted); font-size:0.75rem; letter-spacing:0.2em; text-transform:uppercase;
}
.scroll-line { width:1px; height:60px; background:linear-gradient(to bottom,var(--color-primary),transparent); animation:scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{opacity:1;transform:scaleY(1)} 50%{opacity:0.5;transform:scaleY(0.6)} }

/* ===== BUTTONS ===== */
.btn {
  display:inline-flex; align-items:center; gap:0.5rem;
  padding:0.75rem 1.75rem; border-radius:var(--radius-md);
  font-weight:600; font-size:0.95rem;
  transition:all var(--transition-smooth); position:relative; overflow:hidden; white-space:nowrap;
}
.btn--primary { background:var(--color-primary); color:var(--color-on-gold); box-shadow:0 4px 20px rgba(245,158,11,0.3); }
.btn--primary:hover { background:var(--color-primary-light); box-shadow:0 6px 28px rgba(245,158,11,0.45); transform:translateY(-2px); }
.btn--outline { border:1.5px solid rgba(200,150,20,0.40); color:var(--color-primary-dark); backdrop-filter:blur(10px); }
.btn--outline:hover { border-color:var(--color-primary); color:var(--color-on-gold); background:rgba(232,165,0,0.10); transform:translateY(-2px); }
.btn--lg { padding:1rem 2.25rem; font-size:1.05rem; border-radius:var(--radius-lg); }
.btn--sm { padding:0.5rem 1.25rem; font-size:0.85rem; border-radius:var(--radius-sm); }

/* ===== SECTION HEADERS ===== */
.section-tag {
  display:inline-block; font-size:0.75rem; letter-spacing:0.3em;
  text-transform:uppercase; color:var(--color-primary); margin-bottom:1rem;
  position:relative; padding:0 20px;
}
.section-tag::before,.section-tag::after { content:''; position:absolute; top:50%; width:30px; height:1px; background:var(--color-primary-dark); }
.section-tag::before { right:100%; }
.section-tag::after { left:100%; }
.section-title { font-family:var(--font-display); font-size:clamp(1.75rem,3.5vw,2.75rem); font-weight:700; margin-bottom:0.75rem; color:var(--color-white); letter-spacing:-0.02em; }
.section-subtitle { font-size:1.05rem; color:var(--color-text-secondary); max-width:600px; margin:0 auto; }
.section-header { text-align:center; margin-bottom:3.5rem; }
.section-header .section-subtitle { margin:0 auto; }
.section-cta { text-align:center; margin-top:3rem; }

/* ===== CARDS GRID ===== */
.cards-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.5rem; }
.cards-grid--4 { grid-template-columns:repeat(4,1fr); }
.cards-grid--3 { grid-template-columns:repeat(3,1fr); }

.interview-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-lg); overflow:hidden;
  transition:all var(--transition-smooth); cursor:pointer;
}
.interview-card:hover { border-color:var(--color-primary); box-shadow:var(--shadow-card-hover); transform:translateY(-4px); }
.interview-card__img { position:relative; height:180px; overflow:hidden; }
.interview-card__img-placeholder {
  width:100%; height:100%;
  background:linear-gradient(135deg,var(--color-bg-alt),var(--color-surface));
  display:flex; align-items:center; justify-content:center;
  font-size:3rem; font-family:var(--font-display); font-weight:700; color:var(--color-primary-dark);
  transition:transform 0.5s cubic-bezier(0.16,1,0.3,1);
}
.interview-card:hover .interview-card__img-placeholder { transform:scale(1.05); }
.interview-card__category { position:absolute; top:12px; right:12px; padding:3px 10px; border-radius:20px; font-size:0.65rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; background:rgba(232,165,0,0.15); color:var(--color-primary-dark); }
.interview-card__body { padding:1.25rem; }
.interview-card__name { font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--color-white); margin-bottom:4px; }
.interview-card__role { font-size:0.82rem; color:var(--color-text-secondary); margin-bottom:6px; }
.interview-card__topic { font-size:0.9rem; color:var(--color-text); font-weight:500; line-height:1.4; margin-bottom:12px; }
.interview-card__read { display:inline-flex; align-items:center; gap:6px; font-size:0.8rem; color:var(--color-primary-dark); font-weight:600; letter-spacing:0.05em; }

/* ===== VOICES MAP ===== */
.wmap-fullscreen { padding:4rem 2rem; }
.wmap-card {
  max-width:1200px; margin:0 auto;
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-xl); overflow:hidden;
}
.wmap-card__header { padding:1.5rem 2rem; border-bottom:1px solid var(--color-border); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.wmap-card__title { font-family:var(--font-display); font-size:1.3rem; font-weight:600; color:var(--color-white); }
.wmap-card__stats { font-size:0.9rem; color:var(--color-primary-dark); font-weight:600; }
.wmap-card__body { padding:2rem; position:relative; min-height:420px; }
.wmap-svg { width:100%; height:400px; }
.wmap-svg--full { height:500px; }
.wmap-legend { display:flex; flex-wrap:wrap; gap:1.5rem; padding:1rem 2rem 1.5rem; border-top:1px solid var(--color-border); }
.wmap-legend__title { width:100%; font-size:0.8rem; font-weight:600; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:0.5rem; }
.wmap-legend__item { display:flex; align-items:center; gap:0.5rem; font-size:0.85rem; color:var(--color-text); }
.wmap-legend__color { width:14px; height:14px; border-radius:50%; }
.wmap-legend__item--other .wmap-legend__color { border-radius:2px; }
.wmap-fullscreen__hint { font-size:0.8rem; color:var(--color-text-muted); margin-top:1rem; text-align:center; }
.wmap-fullscreen__footer { text-align:center; margin-top:2rem; }

/* Loading spinner */
.loading { display:flex; align-items:center; justify-content:center; gap:1rem; padding:3rem; color:var(--color-text-muted); }
.loading__spinner { width:24px; height:24px; border:2px solid var(--color-border); border-top-color:var(--color-primary); border-radius:50%; animation:spin 0.8s linear infinite; }
@keyframes spin { to{transform:rotate(360deg)} }

/* Voice tooltip */
.vmap-tooltip {
  position:fixed; z-index:3000; pointer-events:none;
  opacity:0; transition:opacity 0.2s ease,transform 0.2s ease;
  transform:translateY(6px);
  max-width:300px; min-width:220px;
  background:rgba(255,252,242,0.97); backdrop-filter:blur(20px);
  border:1px solid rgba(232,165,0,0.35); border-radius:14px;
  padding:16px 20px; color:var(--color-text);
  font-family:var(--font-body);
  box-shadow:0 8px 40px rgba(120,90,10,0.22),0 0 60px rgba(232,165,0,0.12);
}
.vmap-tooltip.visible { opacity:1; transform:translateY(0); }
.vmap-tooltip.hidden { opacity:0; transform:translateY(8px); pointer-events:none; }
.vmap-tooltip__region { display:flex; align-items:center; gap:8px; margin-bottom:8px; font-size:11px; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:0.05em; }
.vmap-tooltip__dot { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--region-color,#f59e0b); box-shadow:0 0 8px var(--region-color,#f59e0b); }
.vmap-tooltip__name { font-family:var(--font-display); font-size:17px; font-weight:700; color:#2c2620; margin-bottom:2px; }
.vmap-tooltip__role { font-size:13px; color:#2c2620; margin-bottom:2px; }
.vmap-tooltip__tags { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.vmap-tooltip__tag { padding:2px 10px; border-radius:20px; font-size:11px; line-height:1.6; background:rgba(232,165,0,0.16); color:#a06b00; }
.vmap-tooltip__topic { font-size:12px; color:#6d6144; line-height:1.5; border-top:1px solid rgba(200,150,20,0.15); padding-top:6px; }

/* ===== VOICES GRID ===== */
.voices-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }
.voice-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:1rem 1.25rem; display:flex; align-items:center; gap:1rem;
  transition:all var(--transition-smooth); cursor:pointer;
}
.voice-card:hover { border-color:var(--color-primary); transform:translateX(6px); background:rgba(232,165,0,0.04); }
.voice-card__avatar {
  width:48px; height:48px; border-radius:50%;
  background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:1.1rem;
  color:var(--color-on-gold); flex-shrink:0;
}
.voice-card__info h4 { font-size:0.95rem; font-weight:600; color:var(--color-white); margin-bottom:2px; }
.voice-card__info .role { font-size:0.78rem; color:var(--color-primary-dark); margin-bottom:1px; }
.voice-card__info .country { font-size:0.75rem; color:var(--color-text-muted); }

/* ===== VOICE CARD SKELETON (lazy load) ===== */
.voice-card--placeholder {
  background:rgba(232,165,0,0.03); border:1px solid rgba(232,165,0,0.12);
  padding:1rem 1.25rem; display:flex; align-items:center; gap:1rem;
  min-height:72px; position:relative; overflow:hidden; border-radius:8px;
}
.voice-card--placeholder::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent,rgba(232,165,0,0.08),transparent);
  animation:skeleton Sweep 1.8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes skeletonSweep {
  0%{transform:translateX(-100%)} 100%{transform:translateX(100%)}
}
.voice-card--skeleton { display:flex; align-items:center; gap:1rem; width:100%; }
.skeleton {
  background:linear-gradient(90deg,
    rgba(232,165,0,0.10) 0%,
    rgba(232,165,0,0.35) 50%,
    rgba(232,165,0,0.10) 100%
  ); background-size:200% 100%; border-radius:4px;
  animation:shimmer 1.2s ease-in-out infinite;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.skeleton--avatar { width:48px; height:48px; border-radius:50%; flex-shrink:0; }
.skeleton--line { height:12px; border-radius:3px; }
.skeleton--name   { width:55%; }
.skeleton--role   { width:75%; margin-top:6px; }
.skeleton--country{ width:45%; margin-top:6px; }
/* Reveal — handled by JS, no CSS transition (prevents conflict with GSAP) */
.reveal { opacity:0; transform:translateY(30px); }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-left  { opacity:0; transform:translateX(-40px); }
.reveal-left.visible  { opacity:1; transform:translateX(0); }
.reveal-right { opacity:0; transform:translateX(40px); }
.reveal-right.visible { opacity:1; transform:translateX(0); }
.reveal-scale { opacity:0; transform:scale(0.94); }
.reveal-scale.visible { opacity:1; transform:scale(1); }

/* ===== COLUMNISTS ===== */
.columnists-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; }
.columnist-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2rem; text-align:center; transition:all var(--transition-smooth);
}
.columnist-card:hover { border-color:var(--color-primary); transform:translateY(-6px); box-shadow:var(--shadow-card-hover); }
.columnist-card__avatar {
  width:80px; height:80px; border-radius:50%;
  background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));
  margin:0 auto 1rem; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:2rem; font-weight:700; color:var(--color-on-gold);
  transition:transform var(--transition-bounce);
}
.columnist-card:hover .columnist-card__avatar { transform:scale(1.1) rotate(5deg); }
.columnist-card__name { font-family:var(--font-display); font-size:1.2rem; font-weight:700; color:var(--color-white); margin-bottom:4px; }
.columnist-card__org { font-size:0.85rem; color:var(--color-primary-dark); margin-bottom:4px; }
.columnist-card__field { font-size:0.8rem; color:var(--color-text-muted); margin-bottom:12px; }
.columnist-card__bio { font-size:0.9rem; color:var(--color-text-secondary); line-height:1.7; margin-bottom:16px; }

/* ===== PHILosophy ===== */
.philosophy-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:3rem; }
.philosophy-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2.5rem; text-align:center; transition:all var(--transition-smooth);
}
.philosophy-card:hover { border-color:var(--color-primary); transform:translateY(-4px); }
.philosophy-card__icon { font-size:2.5rem; margin-bottom:1rem; }
.philosophy-card h3 { font-family:var(--font-display); font-size:1.2rem; font-weight:700; color:var(--color-white); margin-bottom:0.75rem; }
.philosophy-card p { font-size:0.9rem; color:var(--color-text-secondary); line-height:1.7; }

/* ===== FORMAT CARDS ===== */
.format-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2rem; }
.format-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2rem; text-align:center; transition:all var(--transition-smooth);
}
.format-card:hover { border-color:var(--color-primary); transform:translateY(-4px); }
.format-card__img { font-size:3rem; margin-bottom:1rem; }
.format-card h3 { font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--color-white); margin-bottom:0.5rem; }
.format-card p { font-size:0.85rem; color:var(--color-text-secondary); }

/* ===== VIDEO WALL ===== */
.video-wall { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.5rem; }
.video-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-lg); overflow:hidden; transition:all var(--transition-smooth); cursor:pointer;
}
.video-card:hover { border-color:var(--color-primary); transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.video-card__thumb {
  height:160px; background:linear-gradient(135deg,var(--color-bg-alt),var(--color-surface));
  display:flex; align-items:center; justify-content:center; position:relative;
}
.video-card__play-btn {
  width:48px; height:48px; border-radius:50%;
  background:var(--color-primary); color:var(--color-on-gold);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; transition:transform 0.3s;
}
.video-card:hover .video-card__play-btn { transform:scale(1.15); }
.video-card__info { padding:1rem; }
.video-card__title { font-weight:600; font-size:0.9rem; color:var(--color-white); margin-bottom:6px; line-height:1.4; }
.video-card__meta { font-size:0.78rem; color:var(--color-text-muted); display:flex; gap:1rem; }

/* ===== SERVICES ===== */
.services-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.5rem; }
.service-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2rem; text-align:center; transition:all var(--transition-smooth);
}
.service-card:hover { border-color:var(--color-primary); transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.service-card__icon { font-size:2.5rem; margin-bottom:1rem; }
.service-card h3 { font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--color-white); margin-bottom:0.5rem; }
.service-card p { font-size:0.85rem; color:var(--color-text-secondary); }

/* ===== ANALYSIS / REVIEW ===== */
.featured-analysis { display:grid; grid-template-columns:1.5fr 1fr; gap:2rem; margin-bottom:3rem; }
.analysis-main {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  overflow:hidden; transition:all var(--transition-smooth);
}
.analysis-main:hover { border-color:var(--color-primary); }
.analysis-main__img { height:240px; background:linear-gradient(135deg,var(--color-bg-alt),var(--color-surface)); display:flex; align-items:center; justify-content:center; font-size:3rem; }
.analysis-main__body { padding:2rem; }
.analysis-main__category { display:inline-block; font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--color-primary-dark); background:rgba(232,165,0,0.15); padding:4px 12px; border-radius:20px; margin-bottom:1rem; }
.analysis-main__title { font-family:var(--font-display); font-size:1.5rem; font-weight:700; color:var(--color-white); margin-bottom:0.75rem; line-height:1.3; }
.analysis-main__excerpt { font-size:0.9rem; color:var(--color-text-secondary); line-height:1.7; margin-bottom:1rem; }
.analysis-main__meta { font-size:0.8rem; color:var(--color-text-muted); margin-bottom:1.5rem; display:flex; gap:1rem; flex-wrap:wrap; }

.analysis-side { display:flex; flex-direction:column; gap:1rem; }
.analysis-side-card {
  display:flex; gap:1rem; padding:1rem;
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-md); transition:all var(--transition-smooth); cursor:pointer;
}
.analysis-side-card:hover { border-color:var(--color-primary); transform:translateX(6px); }
.analysis-side-card__img { width:80px; height:60px; border-radius:var(--radius-sm); background:var(--color-surface); display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex-shrink:0; }
.analysis-side-card__body { flex:1; min-width:0; }
.analysis-side-card__title { font-weight:600; color:var(--color-white); font-size:0.9rem; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.analysis-side-card__date { font-size:0.75rem; color:var(--color-text-muted); }

.analysis-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.analysis-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-lg); overflow:hidden; transition:all var(--transition-smooth); cursor:pointer;
}
.analysis-card:hover { border-color:var(--color-primary); box-shadow:var(--shadow-card-hover); transform:translateY(-3px); }
.analysis-card__img { aspect-ratio:16/10; background:linear-gradient(135deg,var(--color-bg-alt),var(--color-surface)); display:flex; align-items:center; justify-content:center; font-size:2rem; }
.analysis-card__body { padding:1.25rem; }
.analysis-card__category { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--color-primary-dark); margin-bottom:8px; }
.analysis-card__title { font-family:var(--font-display); font-size:1rem; font-weight:600; color:var(--color-white); margin-bottom:8px; line-height:1.4; }
.analysis-card__excerpt { font-size:0.82rem; color:var(--color-text-secondary); line-height:1.6; margin-bottom:12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.analysis-card__meta { font-size:0.75rem; color:var(--color-text-muted); display:flex; gap:0.75rem; }

/* ===== CONNECTION ===== */
.connection-formats { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-bottom:3rem; }
.connection-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2rem; transition:all var(--transition-smooth); position:relative; overflow:hidden;
}
.connection-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--color-primary); transform:scaleX(0); transition:transform 0.4s cubic-bezier(0.16,1,0.3,1); }
.connection-card:hover { border-color:var(--color-primary); transform:translateY(-6px); box-shadow:var(--shadow-card-hover); }
.connection-card:hover::before { transform:scaleX(1); }
.connection-card__tag { display:inline-block; font-size:0.65rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--color-primary-dark); background:rgba(232,165,0,0.12); padding:4px 12px; border-radius:20px; margin-bottom:1rem; }
.connection-card h3 { font-family:var(--font-display); font-size:1.15rem; font-weight:700; color:var(--color-white); margin-bottom:0.75rem; }
.connection-card p { font-size:0.88rem; color:var(--color-text-secondary); line-height:1.7; margin-bottom:1.5rem; }
.connections-feed { display:flex; flex-direction:column; gap:1rem; }
.connection-feed-card {
  display:grid; grid-template-columns:70px 1fr auto; align-items:center; gap:1.5rem;
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:1rem 1.25rem; transition:all var(--transition-smooth); cursor:pointer;
}
.connection-feed-card:hover { border-color:var(--color-primary); transform:translateX(6px); }
.connection-feed-card__preview { width:70px; height:50px; background:linear-gradient(135deg,var(--color-bg-alt),var(--color-surface)); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.connection-feed-card__title { font-weight:600; font-size:0.95rem; color:var(--color-white); margin-bottom:4px; }
.connection-feed-card__guests { font-size:0.8rem; color:var(--color-text-secondary); }
.connection-feed-card__actions { display:flex; gap:0.5rem; flex-wrap:wrap; justify-content:flex-end; }

/* ===== PREMIUM ===== */
.premium-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:1.5rem; }
.premium-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  border-radius:var(--radius-lg); overflow:hidden; transition:all var(--transition-smooth);
}
.premium-card:hover { border-color:var(--color-primary); transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.premium-card__type { padding:0.5rem 1.25rem; font-size:0.65rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; }
.premium-card__type.strategic { background:rgba(231,76,94,0.12); color:#c0392b; }
.premium-card__type.policy { background:rgba(46,204,113,0.12); color:#0e9f6e; }
.premium-card__type.special { background:rgba(52,152,219,0.12); color:#2980b9; }
.premium-card__body { padding:1.5rem; }
.premium-card__title { font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--color-white); margin-bottom:0.5rem; }
.premium-card__question { font-size:0.85rem; color:var(--color-text-secondary); margin-bottom:1rem; line-height:1.6; }
.premium-card__meta { font-size:0.75rem; color:var(--color-text-muted); margin-bottom:1rem; display:flex; gap:1rem; }
.premium-card__actions { display:flex; gap:0.5rem; }

/* ===== EXPERTS ===== */
.experts-featured-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; margin-bottom:3rem; }
.expert-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:1.5rem; display:flex; gap:1rem; transition:all var(--transition-smooth); cursor:pointer;
}
.expert-card:hover { border-color:var(--color-primary); transform:translateY(-3px); }
.expert-card__avatar { width:64px; height:64px; border-radius:50%; background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary)); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1.5rem; font-weight:700; color:var(--color-on-gold); flex-shrink:0; }
.expert-card__info h4 { font-size:1rem; font-weight:600; color:var(--color-white); margin-bottom:2px; }
.expert-card__info .org { font-size:0.8rem; color:var(--color-primary-dark); margin-bottom:2px; }
.expert-card__info .field { font-size:0.75rem; color:var(--color-text-muted); }

.experts-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }

.join-network {
  background:linear-gradient(135deg,rgba(232,165,0,0.08),rgba(232,165,0,0.03));
  border:1px solid rgba(232,165,0,0.25); border-radius:var(--radius-xl);
  padding:3rem; text-align:center; margin-top:3rem;
}
.join-network h2 { font-family:var(--font-display); font-size:1.8rem; font-weight:700; color:var(--color-white); margin-bottom:1rem; }
.join-network p { font-size:0.95rem; color:var(--color-text-secondary); line-height:1.8; max-width:700px; margin:0 auto 1.5rem; }

/* ===== CONTACT ===== */
.contact-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:1.5rem; }
.contact-card {
  background:var(--color-bg-card); border:1px solid var(--color-border);
  padding:2rem; transition:all var(--transition-smooth);
}
.contact-card:hover { border-color:var(--color-primary); transform:translateY(-3px); box-shadow:var(--shadow-card-hover); }
.contact-card__icon { font-size:2rem; margin-bottom:1rem; }
.contact-card h3 { font-family:var(--font-display); font-size:1.2rem; font-weight:700; color:var(--color-white); margin-bottom:0.75rem; }
.contact-card p { font-size:0.88rem; color:var(--color-text-secondary); line-height:1.7; margin-bottom:1rem; }
.contact-card__email { display:block; font-size:0.9rem; color:var(--color-primary-dark); font-weight:600; margin-bottom:1rem; }
.contact-card__btns { display:flex; gap:0.75rem; flex-wrap:wrap; }

/* ===== PAGE HERO ===== */
.page-hero {
  position:relative; padding:5rem 2rem 3rem; text-align:center;
  background:linear-gradient(180deg,var(--color-bg-alt) 0%,var(--color-bg) 100%);
  border-bottom:1px solid var(--color-border); overflow:hidden;
}
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(245,158,11,0.06) 0%,transparent 70%); pointer-events:none; }
.page-hero__content h1 { font-family:var(--font-display); font-size:clamp(2rem,5vw,3.5rem); font-weight:700; color:var(--color-white); margin-bottom:0.75rem; }
.page-hero__content p { font-size:1.1rem; color:var(--color-text-secondary); }

/* ===== FILTERS ===== */
.filters { display:flex; flex-wrap:wrap; gap:2rem; margin-bottom:3rem; justify-content:center; }
.filter-group { display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap; }
.filter-label { font-size:0.85rem; font-weight:600; color:var(--color-text-secondary); }
.filter-btn {
  padding:6px 16px; border:1px solid var(--color-border-light);
  border-radius:20px; font-size:0.8rem; color:var(--color-text-secondary);
  background:var(--color-bg-card); transition:all var(--transition-fast);
}
.filter-btn:hover, .filter-btn.active { border-color:var(--color-primary); color:var(--color-on-gold); background:rgba(232,165,0,0.12); }

/* ===== PAGINATION ===== */
.pagination { display:flex; justify-content:center; gap:0.5rem; margin-top:2rem; }
.pagination button {
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--color-border); background:var(--color-bg-card);
  color:var(--color-text-secondary); font-size:0.85rem;
  transition:all var(--transition-fast);
}
.pagination button:hover, .pagination button.active { border-color:var(--color-primary); color:var(--color-on-gold); background:rgba(232,165,0,0.12); }

/* ===== NEWSLETTER ===== */
.newsletter {
  background:linear-gradient(135deg,rgba(232,165,0,0.06),rgba(232,165,0,0.02));
  border:1px solid rgba(232,165,0,0.2); border-radius:var(--radius-xl);
  padding:3rem; text-align:center; margin-top:4rem;
}
.newsletter h3 { font-family:var(--font-display); font-size:1.5rem; font-weight:700; color:var(--color-white); margin-bottom:0.5rem; }
.newsletter p { font-size:0.9rem; color:var(--color-text-secondary); margin-bottom:1.5rem; }
.newsletter__form { display:flex; gap:0.75rem; max-width:480px; margin:0 auto; }
.newsletter__form input { flex:1; padding:0.85rem 1.25rem; border:1px solid var(--color-border-light); border-radius:var(--radius-md); background:var(--color-bg-card); color:var(--color-text); font-size:0.95rem; outline:none; transition:border-color var(--transition-fast); }
.newsletter__form input:focus { border-color:var(--color-primary); }

/* ===== FOOTER ===== */
.site-footer { position:relative; z-index:1; border-top:1px solid var(--color-border); padding:4rem 0 2rem; background:var(--color-bg); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem; }
.footer-brand { display:flex; flex-direction:column; gap:0.75rem; }
.footer-logo { width:36px; height:36px; background:var(--color-primary); color:var(--color-on-gold); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:0.8rem; border-radius:8px; }
.footer-name { font-family:var(--font-display); font-size:1.2rem; font-weight:700; color:var(--color-white); letter-spacing:0.1em; }
.footer-brand p { font-size:0.85rem; color:var(--color-text-secondary); line-height:1.7; }
.footer-links h4 { font-size:0.8rem; font-weight:700; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:1rem; }
.footer-links a { display:block; font-size:0.88rem; color:var(--color-text-secondary); padding:0.3rem 0; transition:color var(--transition-fast); }
.footer-links a:hover { color:var(--color-primary-dark); }
.footer-social h4 { font-size:0.8rem; font-weight:700; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:1rem; }
.social-icons { display:flex; gap:0.75rem; }
.social-icon { width:36px; height:36px; border:1px solid var(--color-border-light); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--color-text-secondary); transition:all var(--transition-fast); }
.social-icon:hover { border-color:var(--color-primary); color:var(--color-primary-dark); background:rgba(232,165,0,0.08); }
.footer-bottom { display:flex; justify-content:space-between; padding-top:2rem; border-top:1px solid var(--color-border); font-size:0.8rem; color:var(--color-text-muted); flex-wrap:wrap; gap:0.5rem; }

/* Reveal handled by GSAP/JS — no CSS transition to prevent conflicts */

/* ===== D3 WORLD MAP STYLES ===== */
 continent-path { fill:var(--color-surface); stroke:var(--color-border-light); stroke-width:0.5px; transition:fill 0.3s; }
 continent-path.highlight-europe { fill:rgba(231,76,94,0.15); stroke:#e74c5e; stroke-width:1px; }
 continent-path.highlight-asia { fill:rgba(243,156,18,0.15); stroke:#f39c12; stroke-width:1px; }
 continent-path.highlight-americas { fill:rgba(46,204,113,0.15); stroke:#2ecc71; stroke-width:1px; }
 continent-path.highlight-africa { fill:rgba(52,152,219,0.15); stroke:#3498db; stroke-width:1px; }

 .person-dot { cursor:pointer; transition:r 0.15s ease, filter 0.15s ease; }
 .pulse-ring { pointer-events:none; }

 /* ===== RESPONSIVE ===== */
 @media (max-width:1024px) {
   .cards-grid--4 { grid-template-columns:repeat(2,1fr); }
   .cards-grid--3 { grid-template-columns:repeat(2,1fr); }
   .featured-analysis { grid-template-columns:1fr; }
   .analysis-grid { grid-template-columns:repeat(2,1fr); }
   .connection-formats { grid-template-columns:repeat(2,1fr); }
   .philosophy-grid { grid-template-columns:repeat(2,1fr); }
   .format-cards { grid-template-columns:repeat(2,1fr); }
   .footer-grid { grid-template-columns:1fr 1fr; }
   .main-nav__links { gap:0; }
   .nav-link { font-size:0.75rem; padding:0.35rem 0.5rem; }
 }

 @media (max-width:768px) {
   :root { --nav-height:60px; }
   .top-bar__left { display:none; }
   .top-bar__right { gap:0.5rem; font-size:0.7rem; }
   .top-bar__member-btn span { display:none; }
   .hamburger { display:flex; }
    /* #mobileMenuOverlay handled below */
    .main-nav__links { display:none !important; }

    /* Full-screen mobile menu overlay */
    #mobileMenuOverlay {
      position:fixed; top:100px; left:0; right:0; bottom:0;
      background:rgba(255,251,240,0.99); backdrop-filter:blur(24px);
      z-index:1200; display:none; flex-direction:column;
      align-items:stretch; padding:2rem 1.5rem; overflow-y:auto;
    }
    #mobileMenuOverlay.open { display:flex; }
    .mobile-menu-link {
      font-family:var(--font-display); font-size:1.2rem;
      color:var(--color-text); padding:1rem; text-align:center;
      border-bottom:1px solid var(--color-border);
      transition:color 0.3s, background 0.3s;
    }
    .mobile-menu-link:hover { color:var(--color-primary-dark); background:rgba(232,165,0,0.08); }
    .mobile-menu-cta { margin-top:2rem; width:100%; }
    .mobile-menu-cta .btn { width:100%; max-width:300px; }
   .newsletter__form { flex-direction:column; }
   .filters { flex-direction:column; align-items:flex-start; }
   .expert-featured-card { flex-direction:column; align-items:center; text-align:center; }
   .wmap-svg { height:280px; }
   .wmap-svg--full { height:320px; }
   /* Mobile world map tooltip */
   .vmap-tooltip {
     position:fixed !important; bottom:0 !important; left:0 !important; right:0 !important; top:auto !important;
     max-width:100% !important; border-radius:20px 20px 0 0 !important;
     padding:1.5rem !important; max-height:50vh !important; overflow-y:auto !important;
   }
 }

 @media (max-width:480px) {
   .hero__badge { font-size:0.7rem; padding:0.4rem 0.9rem; }
   .lang-switch { font-size:0.65rem; }
 }

 /* Hide custom cursor on touch devices */
 @media (hover:none) {
   #cursor-dot,#cursor-ring { display:none !important; }
   body { cursor:auto; }
   .btn,a,button,.interview-card,.analysis-card,.columnist-card,.service-card,.contact-card,.connection-feed-card,.premium-card,.expert-card,.format-card,.connection-card,.filter-btn,.social-icon,.nav-link,.hamburger { cursor:auto; }
 }
