/* Generated from source CSS chunks. Regenerate with: node webapp/scripts/build-site-css.mjs */
/* - styles/base.css */
/* - styles/layout.css */
/* - styles/components.css */
/* - styles/responsive.css */
/* - styles/desktop-social-line.css */
/* - styles/fan-area-overrides.css */
/* - styles/fan-area-final-fixes.css */
/* - styles/hero-tuning.css */
/* - styles/final-polish.css */
/* - styles/about-section.css */
/* - styles/preloader.css */
/* - styles/logo-draw-effect.css */
/* - styles/hero-motion.css */
/* - styles/final-interaction-hotfixes.css */
/* - styles/about-wave-smoother.css */
/* - styles/modal-glass-fixes.css */
/* - styles/hero-guide-visibility.css */
/* - styles/desktop-hero-photo-test.css */
/* - styles/about-title-lock.css */
/* - styles/mobile-social-orbit.css */
/* - styles/mobile-social-orbit-light.css */
/* - styles/about-mobile-type-match.css */
/* - styles/mobile-social-background-fix.css */
/* - styles/mobile-social-cleanup.css */
/* - styles/mobile-social-orbit-visibility-tune.css */
/* - styles/mobile-social-orbit-path-fix.css */
/* - styles/about-mobile-card-inline.css */
/* - styles/about-section-polish.css */
/* - styles/about-section-mockup-correction.css */
/* - styles/mobile-social-active-polish.css */
/* - styles/mobile-social-orbit-drag.css */
/* - styles/mobile-social-orbit-selected-highlight.css */
/* - styles/mobile-about-social-divider-fix.css */
/* - styles/about-mobile-request-fixes.css */
/* - styles/motion-policy.css */

/* ===== styles/base.css ===== */

/* ===== CSS VARIABLES ===== */
:root {
  --bg: #08090d;
  --bg-soft: #111318;
  --text: #f1e9e2;
  --muted: #b9aca1;
  --brand: #f48a3f;
  --stroke: rgba(255,255,255,.10);
  --card-overlay: rgba(10,10,10,0.72);
  --card-text: #fff;
  --card-muted: rgba(255,255,255,0.65);
  --mobile-menu-bg: rgba(14,15,20,0.96);
  --nav-bg-scrolled: rgba(8,9,13,0.88);
  --footer-fade: rgba(8,9,13,0);
  --divider-color: rgba(244,138,63,0.22);
  --hero-bg: #05060a;
  --sections-bg: #08090d;
  --layout-gap-standard: 52px;
  --layout-inline-padding: 52px;
}

:root[data-theme="light"] {
  --bg: #f5eee4;
  --bg-soft: #ffffff;
  --text: #171513;
  --muted: #63584f;
  --brand: #d86d24;
  --stroke: rgba(23,21,19,.12);
  --card-overlay: rgba(255,255,255,0.88);
  --card-text: #171513;
  --card-muted: rgba(23,21,19,0.65);
  --mobile-menu-bg: rgba(255,255,255,0.96);
  --nav-bg-scrolled: rgba(245,238,228,0.90);
  --footer-fade: rgba(245,238,228,0);
  --divider-color: rgba(216,109,36,0.2);
  --hero-bg: #ede4d8;
  --sections-bg: #f5eee4;
}

/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; }
body { overflow-x: clip; scroll-behavior: smooth; }
a { color: inherit; text-decoration: none; }

body {
  margin: 0;
  font-family: Inter, system-ui, sans-serif;
  color: var(--text);
  background: var(--bg);
  transition: background-color 0.4s ease, color 0.4s ease;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  inset: -22% -20%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 24%, rgba(244,138,63,.18), transparent 38%),
    radial-gradient(circle at 84% 16%, rgba(90,122,255,.08), transparent 44%),
    radial-gradient(circle at 52% 84%, rgba(244,138,63,.10), transparent 42%);
  animation: bodyGlow 18s ease-in-out infinite alternate;
}


/* ===== REVEAL ANIMATIONS ===== */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1);
  transition-delay: var(--delay, 0ms);
}
.reveal.is-visible { opacity: 1; transform: none; }

.hero__copy > * { opacity: 0; animation: fadeInUp .75s ease forwards; }
.hero__copy h1 { animation-delay: .06s; }
.hero__copy p { animation-delay: .16s; }
.hero__ctas { animation-delay: .26s; }
.hero__guide { opacity: 0; animation: fadeInUp .75s ease .36s forwards; }


/* ===== KEYFRAMES ===== */
@keyframes bodyGlow {
  0% { transform: translate3d(-2%, -1%, 0) scale(1); opacity: .68; }
  100% { transform: translate3d(2%, 1%, 0) scale(1.08); opacity: 1; }
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pulseGlow {
  0%, 100% { transform: scale(1); opacity: .60; }
  50% { transform: scale(1.05); opacity: .80; }
}
@keyframes bounceArrow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(5px); }
}
@keyframes cardStagger {
  from { opacity: 0; transform: translateY(32px) scale(0.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Card stagger on fan area open */
.fan-card-enter {
  animation: cardStagger 0.5s cubic-bezier(.2,.8,.2,1) both;
}


/* ===== LIGHT MODE ===== */
:root[data-theme="light"] body::before {
  background:
    radial-gradient(circle at 18% 24%, rgba(216,109,36,.12), transparent 38%),
    radial-gradient(circle at 84% 16%, rgba(90,122,255,.06), transparent 44%),
    radial-gradient(circle at 52% 84%, rgba(216,109,36,.09), transparent 42%);
}
:root[data-theme="light"] .age-modal__backdrop { background: rgba(10,8,5,.78); }
:root[data-theme="light"] .legal-modal__backdrop { background: rgba(10,8,5,.72); }

/* ===== LEGAL PAGE (standalone) ===== */
.app-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  width: min(100% - 32px, 860px);
  margin-inline: auto;
  padding: 80px 0 40px;
}
.legal-page { gap: 40px; }
.legal-section { flex: 1; }
.section-header { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.section-header__title.legal-title { font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 700; margin: 0; text-transform: lowercase; }
.section-header__line { flex: 1; height: 1px; background: var(--stroke); }
.link-card {
  border: 1px solid var(--stroke);
  border-radius: 22px;
  padding: 32px;
  background: var(--bg-soft);
}
.legal-card { display: flex; flex-direction: column; gap: 14px; }
.legal-meta { font-size: 0.78rem; color: var(--brand); font-weight: 600; margin: 0; }
.link-card__meta { margin: 0; color: var(--muted); font-size: 0.92rem; line-height: 1.7; }
.link-card__meta strong { color: var(--text); }
.legal-back { align-self: flex-start; margin-top: 8px; }
.footer { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 20px 0; color: var(--muted); font-size: 0.78rem; }
.footer__links { display: flex; gap: 16px; }
.footer__link { color: var(--muted); transition: color 0.2s ease; }
.footer__link:hover { color: var(--brand); }


/* ===== styles/layout.css ===== */

/* ===== PAGE SHELL ===== */
.page-shell {
  width: 100%;
  margin-inline: auto;
  position: relative;
  z-index: 1;
}

/* Hero area gets darker bg, sections slightly lighter */
.hero-wrapper {
  background: var(--hero-bg);
  position: relative;
  transition: background 0.4s ease;
  overflow-x: clip;
}
/* Bottom-left gradient for text legibility on mobile */
.hero-wrapper::after {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 55%;
  background: linear-gradient(to top,
    rgba(5,6,10,0.85) 0%,
    rgba(5,6,10,0.55) 40%,
    transparent 100%);
  pointer-events: none;
  z-index: 3;
  display: none; /* shown only on mobile via responsive */
}

/* Se você tem um elemento .section-divider logo no início, zere a margem */
.hero + .section-divider, 
.section-divider:first-of-type {
  margin-top: 0 !important; /* Faz a linha do print subir e encostar no Hero */
}

.sections-wrapper {
  background: transparent;
  position: relative;
  transition: background 0.4s ease;
}

.inner-shell {
  width: min(100% - 48px, 1220px);
  margin-inline: auto;
  padding: 22px 0;
}

/* ===== TOP NAV - Transparent floating ===== */
.top-nav {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 9999;
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
  align-items: center;
  gap: 14px;
  padding: 0 min(4%, 44px);
  height: 70px;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 0.4s ease, border-color 0.4s ease, backdrop-filter 0.4s ease;
}
.top-nav.is-scrolled {
  background: var(--nav-bg-scrolled);
  backdrop-filter: blur(24px) saturate(1.5);
  -webkit-backdrop-filter: blur(24px) saturate(1.5);
  border-bottom-color: var(--stroke);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  letter-spacing: 0;
  font-size: .7rem;
  font-weight: 600;
  line-height: 1;
  color: var(--text);
  transition: opacity 0.2s ease;
}
.brand:hover { opacity: 0.8; }
.brand__mark { display: inline-flex; color: var(--brand); flex: 0 0 auto; }
.brand__mark svg { width: 28px; height: 28px; display: block; flex-shrink: 0; fill: currentColor; }

.menu {
  display: flex;
  justify-content: center;
  gap: 32px;
  text-transform: uppercase;
  font-size: .72rem;
  letter-spacing: 0;
}
.menu a {
  color: var(--text);
  opacity: 0.65;
  transition: color 0.2s ease, opacity 0.2s ease;
  position: relative;
  padding-bottom: 2px;
}
.menu a::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 1px;
  background: var(--brand);
  transition: width 0.25s ease;
}
.menu a:hover { color: var(--brand); opacity: 1; }
.menu a:hover::after { width: 100%; }

.actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }

.nav-mobile-controls {
  display: none;
  align-items: center;
  gap: 8px;
  justify-self: end;
}


/* ===== HERO ===== */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(0, 54%);
  align-items: center;
  gap: 24px;
  isolation: isolate;
  position: relative;
  min-height: clamp(620px, 82vh, 820px);
  z-index: 0;
  padding: 0 min(3%, 40px);
  padding-top: 70px;
  max-width: 1220px;
  margin-inline: auto;
  padding-bottom: 0 !important; /* Remove o espaço extra abaixo da foto e texto */
  margin-bottom: 0 !important;
  width: min(100% - 48px, 1220px);
}

.hero__copy { position: relative; z-index: 3; max-width: 400px; }

.hero h1 {
  font-size: clamp(2.6rem, 3.6vw, 3.9rem);
  line-height: .94;
  margin: 0;
  font-weight: 400;
  max-width: 13ch;
}
.hero h1 span, .hero h1 strong { display: block; }
.hero h1 strong {
  font-weight: 700;
  color: var(--brand);
  text-shadow: 0 0 48px rgba(244,138,63,0.28);
}
.hero p { color: var(--muted); max-width: 380px; font-size: .91rem; margin-top: 14px; line-height: 1.6; }

.hero__text { position: relative; padding-left: 18px; }

.hero__ctas { display: flex; gap: 12px; margin-top: 22px; flex-wrap: wrap; }

.hero__guide {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 22px;
  font-size: .74rem;
  letter-spacing: 0;
  text-transform: lowercase;
  color: var(--muted);
  opacity: .65;
  animation: bounceArrow 2.4s ease-in-out infinite;
}

/* ===== HERO VISUAL ===== */
.hero__visual {
  position: relative;
  align-self: stretch;
  z-index: 1;
  overflow: clip; /* clip, not hidden — doesn't create scroll container */
}

.hero-image-container {
  position: relative;
  align-self: stretch;
}

/* ===== HERO ASSETS - show only active theme ===== */
/* Default (dark theme) */
.hero__asset-img[data-theme-asset="light"] { display: none; }
.hero__asset-img[data-theme-asset="dark"]  { display: block; }
/* Light theme */
:root[data-theme="light"] .hero__asset-img[data-theme-asset="dark"]  { display: none; }
:root[data-theme="light"] .hero__asset-img[data-theme-asset="light"] { display: block; }

/* ===== HERO ASSETS CONTAINER ===== */
.hero__assets {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: clip;
}

/* Layered assets for parallax */
.hero__asset-img {
  position: absolute;
  will-change: transform;
  pointer-events: none;
  user-select: none;
  transition: transform 0.08s linear;
}

.hero__orb-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

/* Orbs */
.orb {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
}

/* Hide CSS orbs - replaced by image assets via JS */
.orb { display: none !important; }

/* Carousel - fill the full hero height, anchored bottom */
.hero__carousel {
  position: absolute;
  right: clamp(40px, 5vw, 80px);
  top: 0;
  bottom: 0;
  width: clamp(360px, 42vw, 540px);
  z-index: 2;
}

.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(.4,0,.2,1);
  transform: translateY(20px);
  pointer-events: none;
}
.hero__slide.is-active { opacity: 1; transform: translateY(0); pointer-events: auto; }
.hero__slide.is-exit { opacity: 0; transform: translateY(-20px); }

.hero__slide .profile-pic {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  display: block;
}

/* Pagination - bigger bullets */
.hero__pagination {
  position: absolute;
  right: clamp(8px, 5vw, 36px);
  top: 46%;
  transform: translateY(-50%);
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.pag-num {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  letter-spacing: 0;
  color: var(--muted);
  font-size: .75rem;
  opacity: .7;
  margin-bottom: 4px;
  font-weight: 500;
}
.pag-num strong { font-weight: 700; color: var(--brand); }
.pag-dots { display: flex; flex-direction: column; gap: 9px; }
.pag-dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--muted);
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.4;
  transition: opacity 0.25s ease, background 0.25s ease, transform 0.25s ease;
}
.pag-dot.is-active { background: var(--brand); opacity: 1; transform: scale(1.6); }
.pag-dot:hover { opacity: 0.8; }

/* Permite que os assets flutuem pela tela toda sem cortes */
/* layout.css */
@media (min-width: 901px) {
  .hero__visual, .hero__assets {
    /* Em vez de 100vw, usamos um tamanho fixo largo para manter a escala */
    width: 100% !important; 
    left: 0 !important;
    transform: none !important;
    max-width: none !important;
  }
  
  .hero {
    /* Devolvemos um respiro mínimo para não colar tudo */
    padding-bottom: 0px !important; 
  }
}

/* Carousel nav buttons REMOVED */
.carousel-btn { display: none !important; }


/* ===== SOCIAL SECTION ===== */
.social { margin-top: 0; }

.social__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  padding: 4px 0 8px;
}


/* ===== VIP BAND ===== */
.vip-band {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  z-index: 2;
  padding: 28px 32px;
  border-radius: 24px;
  border: 1px solid rgba(244,138,63,0.22);
  background: linear-gradient(135deg, rgba(22,22,28,1) 0%, rgba(12,12,16,1) 100%);
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 20px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.vip-band:hover { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(244,138,63,0.12); }
/* Always dark regardless of theme */
:root[data-theme="light"] .vip-band {
  background: linear-gradient(135deg, rgba(24,18,12,1) 0%, rgba(14,10,6,1) 100%);
  border-color: rgba(244,138,63,0.30);
}
.vip-band::before {
  content: "";
  position: absolute;
  left: -40px; top: 50%;
  transform: translateY(-50%);
  width: 220px; height: 220px;
  border-radius: 50%;
  pointer-events: none; z-index: 0;
  background: radial-gradient(circle, rgba(244,138,63,0.16) 0%, transparent 70%);
}
.vip-band::after {
  content: "";
  position: absolute;
  right: -40px; top: -40px;
  width: 200px; height: 200px;
  border-radius: 50%;
  pointer-events: none; z-index: 0;
  background: radial-gradient(circle, rgba(244,138,63,0.10) 0%, transparent 70%);
}
.vip-band__icon-wrap {
  position: relative; z-index: 1;
  width: 58px; height: 58px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, rgba(255,255,255,0.08));
  background: radial-gradient(circle at 28% 30%, rgba(244,138,63,0.28), rgba(244,138,63,0.07) 60%, transparent 100%);
  display: grid; place-items: center;
  color: var(--brand);
  box-shadow: 0 0 22px rgba(244,138,63,0.18);
  animation: pulseGlow 4s ease-in-out infinite;
}
.vip-band__content { position: relative; z-index: 1; }
.vip-band__content h3 {
  margin: 0;
  font-size: clamp(1.1rem, 2vw, 1.38rem);
  font-weight: 500;
  text-transform: lowercase;
  color: #f1e9e2;
}
.vip-band__content h3 span { color: var(--brand); font-weight: 700; }
.vip-band__content p { margin: 4px 0 0; color: rgba(255,255,255,0.55); font-size: 0.88rem; }
.vip-band__cta {
  position: relative; z-index: 1;
  white-space: nowrap;
  border-color: var(--brand) !important;
  color: var(--brand) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.vip-band__cta:hover {
  background: rgba(244,138,63,0.14) !important;
  box-shadow: 0 8px 24px rgba(244,138,63,0.22) !important;
}

/* ===== VIP LINKS SECTION ===== */
.vip-links { margin-top: 0; }
.vip-links .social__inner { margin-top: 0; }
.vip-links h2 {
  margin: 0 0 14px;
  font-size: clamp(1.5rem, 2.8vw, 2.4rem);
  line-height: 1.05;
  font-weight: 400;
}
.vip-links h2 strong { color: var(--brand); font-weight: 700; display: block; }


/* ===== FOOTER ===== */
.site-footer {
  position: relative;
  z-index: 2;
  padding: 20px min(4%, 44px);
  border-top: 1px solid var(--stroke);
  background: transparent;
}

.site-footer__row1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.site-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .68rem;
  letter-spacing: 0;
  font-weight: 600;
}

.site-footer__social { display: flex; gap: 16px; align-items: center; }
.site-footer__social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px;
  color: var(--muted);
  opacity: 0.65;
  transition: color 0.2s ease, opacity 0.2s ease;
}
.site-footer__social a:hover { color: var(--brand); opacity: 1; }
.site-footer__social a svg { width: 100%; height: 100%; display: block; }

.site-footer__center {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
}

.site-footer__copyright {
  margin: 0;
  color: var(--muted);
  font-size: .76rem;
  white-space: nowrap;
}

.site-footer__row2 {
  display: none;
}
.site-footer__bottom {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
}
.site-footer__bottom a {
  font-size: 0.78rem;
  color: var(--muted);
  padding: 0 12px;
  border-right: 1px solid var(--stroke);
  transition: color 0.2s ease;
  cursor: pointer;
}
.site-footer__bottom a:last-child { border-right: none; }
.site-footer__bottom a:hover { color: var(--brand); }

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0;
  color: var(--brand);
  font-size: 0.72rem;
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}
.social h2 {
  margin: 0 0 14px;
  font-size: clamp(1.5rem, 2.8vw, 2.4rem);
  line-height: 1.05;
  font-weight: 400;
}
.social h2 strong { color: var(--brand); font-weight: 700; display: block; }
.social__copy p {
  max-width: 30ch;
  color: var(--muted);
  font-size: 0.88rem;
  margin: 0 0 20px;
  line-height: 1.6;
}
.social__cta { margin-top: 4px; }
.social-card {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.07);
  background-color: transparent;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 12px;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
  cursor: pointer;
  text-decoration: none;
}
.social-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8,9,13,0.92) 0%, rgba(8,9,13,0.50) 55%, rgba(8,9,13,0.12) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
:root[data-theme="light"] .social-card { border-color: rgba(23,21,19,0.10); }
:root[data-theme="light"] .social-card::before {
  background: linear-gradient(to top, rgba(240,230,218,0.94) 0%, rgba(240,230,218,0.60) 50%, rgba(240,230,218,0.18) 100%);
}
.social-card > * { position: relative; z-index: 2; }
/* Background images - social */
.social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-dark-01.webp"); }
.social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-dark-02.webp"); }
.social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-dark-03.webp"); }
.social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-dark-04.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-light-01.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-light-02.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-light-03.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-light-04.webp"); }
/* VIP cards */
.vip-social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-dark-01.webp"); }
.vip-social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-dark-02.webp"); }
.vip-social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-dark-03.webp"); }
.vip-social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-dark-04.webp"); }
.vip-social-grid > .social-card:nth-child(5) { background-image: url("/assets/card-dark-01.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-light-01.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-light-02.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-light-03.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-light-04.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(5) { background-image: url("/assets/card-light-01.webp"); }
.social-card__icon { width: 30px; height: 30px; color: #fff; line-height: 0; flex-shrink: 0; }
:root[data-theme="light"] .social-card__icon { color: var(--text); }
.social-card__icon svg { width: 100%; height: 100%; display: block; }
/* ===== MOBILE RESPONSIVE ===== */


/* ===== styles/components.css ===== */

/* ===== SELECT ===== */
select {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--stroke);
  border-radius: 999px;
  padding: 6px 26px 6px 12px;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23f48a3f' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  color: var(--text);
  font-weight: 500;
  font-size: 0.75rem;
  cursor: pointer;
  transition: border-color 0.2s;
}
select:hover { border-color: var(--brand); }
:root[data-theme="light"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23d86d24' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
}

/* ===== THEME TOGGLE ===== */
.theme-toggle {
  border: 1px solid var(--stroke);
  border-radius: 999px;
  padding: 6px 10px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 0.85rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.theme-toggle svg { display: block; }
.theme-toggle:hover { border-color: var(--brand); color: var(--brand); }

/* ===== HAMBURGER ===== */
.menu-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 38px; height: 38px;
  border: 1px solid var(--stroke);
  border-radius: 10px;
  padding: 8px;
  background: color-mix(in srgb, var(--brand) 10%, rgba(7,8,11,0.36));
  color: var(--text);
  cursor: pointer;
  backdrop-filter: blur(16px) saturate(1.45);
  -webkit-backdrop-filter: blur(16px) saturate(1.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
:root[data-theme="light"] .menu-toggle {
  background: color-mix(in srgb, var(--brand) 12%, rgba(255,255,255,0.58));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.58), 0 10px 26px rgba(80,48,22,0.08);
}
.menu-toggle:hover { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 16%, rgba(7,8,11,0.38)); }
:root[data-theme="light"] .menu-toggle:hover { background: color-mix(in srgb, var(--brand) 18%, rgba(255,255,255,0.62)); }
.hamburger-bar {
  display: block;
  width: 18px; height: 1.5px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}
.menu-toggle.is-active .hamburger-bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.menu-toggle.is-active .hamburger-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.menu-toggle.is-active .hamburger-bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ===== BLUR BUTTON ===== */
.btn-blur {
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.18) !important;
}
:root[data-theme="light"] .btn-blur {
  background: rgba(255,255,255,0.55) !important;
  border-color: rgba(23,21,19,0.18) !important;
}
.btn-blur:hover { background: rgba(255,255,255,0.08) !important; }

/* ===== MOBILE MENU ===== */
.mobile-menu {
  display: none;
  position: fixed;
  top: 60px; right: 16px;
  width: min(260px, calc(100vw - 32px));
  background: color-mix(in srgb, var(--brand) 8%, rgba(8,9,13,0.48));
  backdrop-filter: blur(26px) saturate(1.65);
  -webkit-backdrop-filter: blur(26px) saturate(1.65);
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--stroke));
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,0.44);
  z-index: 9998;
  opacity: 0;
  transform: translateY(-10px) scale(0.97);
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
}
:root[data-theme="light"] .mobile-menu {
  background: color-mix(in srgb, var(--brand) 10%, rgba(255,248,239,0.62));
  border-color: color-mix(in srgb, var(--brand) 20%, rgba(23,21,19,0.12));
  box-shadow: 0 24px 60px rgba(80,48,22,0.16);
}
.mobile-menu.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.mobile-menu__links {
  display: grid;
  gap: 2px;
  margin-bottom: 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--brand) 16%, var(--stroke));
  padding-bottom: 12px;
}
.mobile-menu__links a {
  text-transform: uppercase;
  letter-spacing: 0;
  font-size: .73rem;
  color: var(--text);
  opacity: 0.7;
  display: block;
  padding: 10px 12px;
  border-radius: 10px;
  transition: color 0.2s ease, opacity 0.2s ease, background 0.2s ease;
}
.mobile-menu__links a:hover { color: var(--brand); opacity: 1; background: rgba(244,138,63,0.08); }
.mobile-menu__cta {
  width: 100%;
  justify-content: center;
  font-size: 0.82rem;
  padding: 10px 14px;
  margin-top: 4px;
}

/* ===== BUTTONS ===== */
.button {
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 0.88rem;
  padding: 10px 20px;
  transition: all 0.28s cubic-bezier(.2,.8,.2,1);
  cursor: pointer;
  gap: 8px;
  border: 1px solid var(--stroke);
  text-decoration: none;
  white-space: nowrap;
}
.button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.22); }

.btn-primary {
  border: none;
  background: var(--brand);
  color: #171513;
  font-weight: 700;
}
.btn-primary:hover {
  background: color-mix(in srgb, var(--brand) 88%, #fff 12%);
  box-shadow: 0 10px 24px rgba(244,138,63,0.36) !important;
}
.btn-ghost { background: transparent; color: var(--text); border-color: var(--stroke); }
:root[data-theme="light"] .btn-ghost { color: var(--text); border-color: var(--stroke); }
.lock-icon { width: 14px; height: 14px; color: var(--brand); flex: 0 0 auto; }

/* ===== SECTION DIVIDER ===== */
.section-divider {
  position: relative;
  height: 1px;
  margin: 60px auto;
  overflow: visible;
  width: min(100% - 48px, 1220px);
}
.section-divider::before {
  content: "";
  display: block;
  height: 1px;
  background: linear-gradient(to right,
    transparent 0%,
    var(--divider-color) 20%,
    rgba(244,138,63,0.55) 50%,
    var(--divider-color) 80%,
    transparent 100%);
}
.section-divider::after {
  content: "";
  position: absolute;
  top: -8px; left: 50%;
  transform: translateX(-50%);
  width: 60px; height: 16px;
  background: radial-gradient(ellipse at center, rgba(244,138,63,0.25) 0%, transparent 80%);
  pointer-events: none;
}


/* ===== SOCIAL GRID - Single row on desktop ===== */
.social-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
}


.social-card {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.07);
  background-color: transparent;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 12px;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
  cursor: pointer;
  text-decoration: none;
}



.social-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8,9,13,0.92) 0%, rgba(8,9,13,0.50) 55%, rgba(8,9,13,0.12) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
:root[data-theme="light"] .social-card { border-color: rgba(23,21,19,0.10); }
:root[data-theme="light"] .social-card::before {
  background: linear-gradient(to top, rgba(240,230,218,0.94) 0%, rgba(240,230,218,0.60) 50%, rgba(240,230,218,0.18) 100%);
}

.social-card > * { position: relative; z-index: 2; }

/* Background images - social */
.social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-dark-01.webp"); }
.social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-dark-02.webp"); }
.social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-dark-03.webp"); }
.social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-dark-04.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-light-01.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-light-02.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-light-03.webp"); }
:root[data-theme="light"] .social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-light-04.webp"); }

/* VIP cards */
.vip-social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-dark-01.webp"); }
.vip-social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-dark-02.webp"); }
.vip-social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-dark-03.webp"); }
.vip-social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-dark-04.webp"); }
.vip-social-grid > .social-card:nth-child(5) { background-image: url("/assets/card-dark-01.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(1) { background-image: url("/assets/card-light-01.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(2) { background-image: url("/assets/card-light-02.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(3) { background-image: url("/assets/card-light-03.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(4) { background-image: url("/assets/card-light-04.webp"); }
:root[data-theme="light"] .vip-social-grid > .social-card:nth-child(5) { background-image: url("/assets/card-light-01.webp"); }

.social-card__icon { width: 30px; height: 30px; color: #fff; line-height: 0; flex-shrink: 0; margin-bottom: 0; }
:root[data-theme="light"] .social-card__icon { color: var(--text); }
.social-card__icon svg { width: 100%; height: 100%; display: block; }


.social-card__body { flex: 1; }
.social-card__body h3 {
  margin: 0 0 4px;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: lowercase;
  color: #fff;
  line-height: 1.2;
}
:root[data-theme="light"] .social-card__body h3 { color: var(--text); }
.social-card__body p {
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.3;
  color: rgba(255,255,255,0.65);
}
:root[data-theme="light"] .social-card__body p { color: rgba(23,21,19,0.62); }

.social-card__arrow {
  position: absolute;
  right: 10px; top: 10px;
  color: var(--brand);
  font-size: 0.85rem;
  font-weight: 600;
  z-index: 3;
  transition: transform 0.25s ease;
}
.social-card:hover .social-card__arrow { transform: translate(2px, -2px); }
.social-card:hover {
  transform: translateY(-6px) scale(1.02);
  border-color: color-mix(in srgb, var(--brand) 38%, rgba(255,255,255,0.06));
  box-shadow: 0 24px 48px rgba(0,0,0,.38);
}


/* ===== VIP LINKS SECTION ===== */
.vip-links { margin-top: 0; }
.vip-links .social__inner { margin-top: 0; }
.vip-links h2 {
  margin: 0 0 14px;
  font-size: clamp(1.5rem, 2.8vw, 2.4rem);
  line-height: 1.05;
  font-weight: 400;
}
.vip-links h2 strong { color: var(--brand); font-weight: 700; display: block; }


/* ===== REVEAL ANIMATIONS ===== */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1);
  transition-delay: var(--delay, 0ms);
}
.reveal.is-visible { opacity: 1; transform: none; }

.hero__copy > * { opacity: 0; animation: fadeInUp .75s ease forwards; }
.hero__copy h1 { animation-delay: .06s; }
.hero__copy p { animation-delay: .16s; }
.hero__ctas { animation-delay: .26s; }
.hero__guide { opacity: 0; animation: fadeInUp .75s ease .36s forwards; }

/* ===== AGE MODAL ===== */
.age-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding:
    max(20px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}
.age-modal[hidden] { display: none !important; }
.age-modal.is-open { opacity: 1; pointer-events: auto; display: flex; }
.age-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.80);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.age-modal__card {
  position: relative;
  z-index: 1;
  width: min(480px, 100%);
  padding: 36px;
  border-radius: 28px;
  border: 1px solid var(--stroke);
  background: var(--bg-soft);
  box-shadow: 0 32px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(244,138,63,0.06);
  transform: translateY(30px) scale(0.96);
  transition: transform 0.4s cubic-bezier(.2,.8,.2,1), opacity 0.4s ease;
  opacity: 0;
}
.age-modal.is-open .age-modal__card { transform: translateY(0) scale(1); opacity: 1; }
.age-modal__card h3 { margin: 0 0 12px; color: var(--text); font-size: 1.2rem; font-weight: 700; }
.age-modal__card p { margin: 0; color: var(--muted); font-size: 0.92rem; line-height: 1.65; }
.age-modal__actions { display: flex; gap: 10px; margin-top: 26px; flex-wrap: wrap; }

/* ===== LEGAL MODAL ===== */
.legal-modal {
  position: fixed;
  inset: 0;
  z-index: 99998;
  display: flex;
  align-items: center;
  justify-content: center;
  padding:
    max(20px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}
.legal-modal[hidden] { display: none !important; }
.legal-modal.is-open { opacity: 1; pointer-events: auto; display: flex; }
.legal-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.legal-modal__card {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  max-height: 82vh;
  overflow-y: auto;
  padding: 36px;
  border-radius: 28px;
  border: 1px solid var(--stroke);
  background: var(--bg-soft);
  box-shadow: 0 32px 80px rgba(0,0,0,.50);
  transform: translateY(30px) scale(0.96);
  transition: transform 0.4s cubic-bezier(.2,.8,.2,1), opacity 0.4s ease;
  opacity: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--brand) transparent;
}
.legal-modal__card::-webkit-scrollbar { width: 4px; }
.legal-modal__card::-webkit-scrollbar-thumb { background: var(--brand); border-radius: 4px; }
.legal-modal.is-open .legal-modal__card { transform: translateY(0) scale(1); opacity: 1; }
.legal-modal__close {
  position: absolute;
  top: 20px; right: 20px;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid var(--stroke);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  transition: all 0.2s ease;
  line-height: 1;
}
.legal-modal__close:hover { border-color: var(--brand); color: var(--brand); background: rgba(244,138,63,0.08); }
.legal-modal__title {
  margin: 0 0 6px;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text);
  text-transform: lowercase;
}
.legal-modal__meta {
  font-size: 0.78rem;
  color: var(--brand);
  margin-bottom: 20px;
  display: block;
}
.legal-modal__divider { height: 1px; background: var(--stroke); margin: 16px 0; }
.legal-modal__body p { color: var(--muted); font-size: 0.90rem; line-height: 1.7; margin: 0 0 14px; }
.legal-modal__body p:last-child { margin-bottom: 0; }
.legal-modal__body strong { color: var(--text); }


/* ===== styles/responsive.css ===== */

@media (min-width: 901px) {
  .social__inner {
    grid-template-columns: minmax(0, 0.38fr) minmax(0, 1fr);
    gap: 40px;
    align-items: start;
  }
}
@media (min-width: 901px) {
  .social-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    max-width: none;
  }
}
@media (min-width: 901px) {
  .social-card {
    aspect-ratio: 3 / 4;
    min-height: 0;
    justify-content: space-between;
  }
}
@media (max-width: 900px) {
  .social-card {
    aspect-ratio: unset;
    min-height: 100px;
    flex-direction: row;
    align-items: center;
    padding: 12px 14px;
    gap: 12px;
    justify-content: flex-start;
    border-radius: 16px;
  }
}

@media (min-width: 901px) {
  #main-social-grid {
    display: none;
  }
}
@media (min-width: 901px) { .social-card__icon { margin-bottom: auto; margin-top: 0; } }
@media (max-width: 900px) { .social-card__icon { width: 26px; height: 26px; margin-bottom: 0; } }

/* Hero fan-area CTA: texto específico + brilho vertical, mantendo blur. */
.hero__ctas .btn-blur {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.hero__ctas .btn-blur span[data-i18n="navExclusive"] {
  font-size: 0;
}
.hero__ctas .btn-blur span[data-i18n="navExclusive"]::before {
  content: "fan area";
  font-size: .88rem;
}
.hero__ctas .btn-blur::after {
  content: "";
  position: absolute;
  inset: -45% auto -45% -35%;
  width: 32%;
  pointer-events: none;
  z-index: -1;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.34) 45%, rgba(244,138,63,0.22) 55%, transparent 100%);
  filter: blur(5px);
  transform: translateX(-130%) rotate(12deg);
  animation: fanAreaShine 4.8s ease-in-out infinite;
}
@keyframes fanAreaShine {
  0%, 54% { transform: translateX(-140%) rotate(12deg); opacity: 0; }
  64% { opacity: .72; }
  86% { transform: translateX(520%) rotate(12deg); opacity: 0; }
  100% { transform: translateX(520%) rotate(12deg); opacity: 0; }
}

@media (min-width: 901px) {
  .vip-social-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: none;
  }
  .vip-social-grid > .social-card:last-child:nth-child(odd) {
    grid-column: unset;
    aspect-ratio: 3 / 4;
  }

  /* Desktop: assets mais soltos no background, independentes da foto. */
  .hero__assets {
    overflow: visible;
    inset: 0 auto 0 -230px !important;
    width: min(76vw, 980px) !important;
    height: 100% !important;
    max-width: none !important;
  }
  .hero__asset-img {
    opacity: 0.98;
  }
  .hero__asset-img:nth-child(1),
  .hero__asset-img:nth-child(6) {
    width: 50% !important;
    top: 2% !important;
    left: 31% !important;
    right: auto !important;
  }
  .hero__asset-img:nth-child(2),
  .hero__asset-img:nth-child(7) {
    width: 38% !important;
    top: 15% !important;
    left: 38% !important;
    right: auto !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    width: 28% !important;
    top: 27% !important;
    left: 27% !important;
    right: auto !important;
  }
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 42% !important;
    top: 43% !important;
    left: 25% !important;
    right: auto !important;
  }
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    width: 27% !important;
    top: 49% !important;
    left: 68% !important;
    right: auto !important;
  }
}
@media (max-width: 900px) {
  body { padding-top: 0; }

  /* ===== ASSETS MOBILE - maiores, mais baixos e menos grudados na cabeça ===== */
  .hero__asset-img {
    opacity: 0.92;
    transform-origin: center;
    animation: heroMobileAssetFloat 6.5s ease-in-out infinite alternate;
  }
  .hero__asset-img:nth-child(2),
  .hero__asset-img:nth-child(7) {
    animation-duration: 7.8s;
    animation-delay: -1.2s;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    animation-duration: 5.9s;
    animation-delay: -2.1s;
  }
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    animation-duration: 8.6s;
    animation-delay: -1.8s;
  }
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    animation-duration: 7.1s;
    animation-delay: -2.8s;
  }
  .hero__asset-img:nth-child(1), .hero__asset-img:nth-child(6) {
    width: 72% !important;
    top: 12% !important;
    right: -16% !important;
    left: auto !important;
  }
  .hero__asset-img:nth-child(2), .hero__asset-img:nth-child(7) {
    width: 53% !important;
    top: 23% !important;
    right: 2% !important;
    left: auto !important;
  }
  .hero__asset-img:nth-child(3), .hero__asset-img:nth-child(8) {
    width: 36% !important;
    top: 35% !important;
    right: 22% !important;
    left: auto !important;
  }
  .hero__asset-img:nth-child(4), .hero__asset-img:nth-child(9) {
    width: 48% !important;
    top: 18% !important;
    right: 38% !important;
    left: auto !important;
    opacity: 0.58;
  }
  .hero__asset-img:nth-child(5), .hero__asset-img:nth-child(10) {
    width: 28% !important;
    top: 44% !important;
    right: -4% !important;
    left: auto !important;
    opacity: 0.68;
  }

  @keyframes heroMobileAssetFloat {
    0% { translate: 0 0; }
    50% { translate: 7px -8px; }
    100% { translate: -5px 5px; }
  }

  .inner-shell { width: min(100% - 24px, 1220px); padding: 14px 0; }

  .top-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    height: 56px;
    gap: 0;
  }
  .top-nav .brand { flex: 0 0 auto; }
  .menu    { display: none !important; }
  .actions { display: none !important; }
  .nav-mobile-controls {
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
  }
  .mobile-menu { display: block; }

  /* ========== HERO MOBILE ========== */
  .hero + .section-divider,
  .section-divider:first-of-type {
    margin-top: 0 !important;
  }

  .hero {
    display: flex;
    flex-direction: column;
    justify-content: flex-start !important;
    align-items: flex-start;
    position: relative;
    overflow: visible;
    padding: 60px 16px 18px !important;
    min-height: 88svh !important;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    box-sizing: border-box;
  }
  .hero__visual {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: clip;
  }
  .hero__assets {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: clip;
  }
  /* Foto mantém escala, sobe levemente e vai mais à direita para crop lateral. */
  .hero__carousel {
    top: 70px !important;
    bottom: 0 !important;
    width: 99vw !important;
    height: auto !important;
    right: -78px !important;
    opacity: 1 !important;
    z-index: 1 !important;
  }
  .hero__slide .profile-pic {
    object-fit: contain;
    object-position: right bottom;
  }
  .hero__copy {
    margin-top: 68px;
    z-index: 10 !important;
    text-shadow: none !important;
    max-width: min(70vw, 315px);
  }
  .hero__copy::before,
  .hero__text::before { display: none !important; }

  .hero h1 {
    font-size: clamp(1.55rem, 7vw, 2.16rem);
    line-height: 1.02;
    margin: 0 0 8px;
    max-width: 12ch;
  }
  .hero p {
    font-size: .80rem;
    max-width: 25ch;
    margin-top: 8px;
    line-height: 1.48;
    color: var(--muted);
  }
  .hero__ctas {
    gap: 8px;
    margin-top: 17px;
    flex-wrap: wrap;
    flex-direction: row;
  }
  .hero__ctas .button { padding: 9px 15px; font-size: .78rem; }
  .hero__ctas .btn-blur span[data-i18n="navExclusive"]::before { font-size: .78rem; }
  .hero__text { padding: 0; }
  .hero__text::before { display: none !important; }
  .hero__guide { display: none !important; }

  .hero__pagination {
    right: 12px !important;
    gap: 6px !important;
    top: 42%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: auto !important;
  }
  .pag-num {
    display: block !important;
    font-size: 0.7rem;
    margin-bottom: 4px;
  }
  .pag-dot {
    width: 6px !important;
    height: 6px !important;
    padding: 4px !important;
    margin: 0 !important;
    opacity: 0.3 !important;
  }
  .pag-dot.is-active { transform: scale(1.2) !important; opacity: 1 !important; }

  .section-divider { margin: 36px auto; }

  /* Mobile: degradê mais disperso e menos pesado. */
  .sections-wrapper {
    position: relative;
    background:
      radial-gradient(ellipse at 50% 0%, rgba(244,138,63,0.14) 0%, rgba(244,138,63,0.07) 30%, transparent 66%),
      linear-gradient(180deg, rgba(30,16,9,0.58) 0%, rgba(18,12,10,0.42) 150px, rgba(8,9,13,0) 420px);
  }
  .sections-wrapper::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 270px;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(180deg, rgba(244,138,63,0.10) 0%, rgba(244,138,63,0.045) 44%, transparent 100%);
  }
  :root[data-theme="light"] .sections-wrapper {
    background:
      radial-gradient(ellipse at 50% 0%, rgba(216,109,36,0.13) 0%, rgba(216,109,36,0.06) 32%, transparent 68%),
      linear-gradient(180deg, rgba(255,228,204,0.52) 0%, rgba(246,232,218,0.34) 160px, transparent 420px);
  }
  :root[data-theme="light"] .sections-wrapper::before {
    background: linear-gradient(180deg, rgba(216,109,36,0.10) 0%, rgba(216,109,36,0.04) 46%, transparent 100%);
  }
  .sections-wrapper > * {
    position: relative;
    z-index: 1;
  }

  .social { margin-top: 0; }
  .social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .social-card {
    aspect-ratio: unset;
    min-height: 100px;
    flex-direction: row;
    align-items: center;
    padding: 12px 14px;
    gap: 12px;
    justify-content: flex-start;
    border-radius: 16px;
  }
  .social-card__icon { width: 26px; height: 26px; flex-shrink: 0; margin-bottom: 0; }
  .social-card__body { flex: 1; }
  .social-card__body h3 { font-size: 0.82rem; }
  .social-card__body p { font-size: 0.68rem; }
  .social-card__arrow { position: static; margin-left: auto; flex-shrink: 0; font-size: 0.78rem; }
  .vip-social-grid > .social-card:last-child:nth-child(odd) { grid-column: unset; aspect-ratio: unset; }

  /* Fan area band - force light text on mobile for light theme */
  .vip-band {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px 14px;
    padding: 16px 16px;
    border-radius: 18px;
  }
  .vip-band__icon-wrap { width: 48px; height: 48px; }
  .vip-band__content h3 { white-space: nowrap; }
  .vip-band__cta { grid-column: 1 / -1; width: 100%; font-size: 0.84rem; padding: 10px 14px; }

  /* Footer mobile - 2 rows: row1 = brand+social, row2 = copyright+links */
  .site-footer { padding: 20px 14px; }
  .site-footer__row1 {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
  }
  .site-footer__center {
    order: 3;
  }
  .site-footer__copyright {
    text-align: center;
    order: 4;
    font-size: 0.74rem;
  }
  .site-footer__row2 { display: none; }
  .site-footer__bottom a { border-right: none; padding: 0 8px; }
}


/* ===== styles/desktop-social-line.css ===== */

@keyframes desktopCardEnter {
  from {
    opacity: 0;
    transform: translateY(32px) scale(0.92);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes desktopExpandedEnter {
  from {
    opacity: 0;
    transform: translateY(48px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes particleFloat {
  0% {
    opacity: 1;
    transform: translate(0, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(
      calc(var(--end-x) - var(--start-x)),
      calc(var(--end-y) - var(--start-y))
    ) scale(0);
  }
}

@media (min-width: 901px) {
  #social-grid {
    scroll-margin-top: 112px;
  }

  .social-desktop-line-wrap {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 34px;
    perspective: 1200px;
    --perspective-depth: 420px;
  }

  .social-desktop-line-rail {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    padding: 34px 0 28px;
    perspective: 1200px;
    transform-style: preserve-3d;
    position: relative;
  }

  .social-desktop-line-rail::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -10%;
    right: -10%;
    height: 2px;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(244,138,63,.18),
      rgba(244,138,63,.42),
      rgba(244,138,63,.18),
      transparent
    );
    transform: translateY(-50%) translateZ(-100px);
    z-index: -1;
    filter: blur(1px);
    box-shadow: 0 0 24px rgba(244,138,63,.22);
  }

  .social-desktop-line-rail::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 140%;
    height: 160%;
    background: radial-gradient(
      ellipse at center,
      rgba(244,138,63,.08) 0%,
      transparent 70%
    );
    transform: translate(-50%, -50%) translateZ(-200px);
    z-index: 0;
    filter: blur(32px);
  }

  .social-desktop-card {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 16px;
    border: 2px solid rgba(244,138,63,.22);
    background:
      radial-gradient(circle at 30% 28%, rgba(244,138,63,.08), transparent 40%),
      rgba(8,9,13,.40);
    display: grid;
    place-items: center;
    cursor: pointer;
    flex-shrink: 0;
    transform-style: preserve-3d;
    transition:
      transform .42s cubic-bezier(.2,.8,.2,1),
      border-color .3s ease,
      box-shadow .3s ease,
      background .3s ease;
    will-change: transform, box-shadow;
    backface-visibility: hidden;
    z-index: 1;
    animation: desktopCardEnter .68s cubic-bezier(.2,.8,.2,1) both;
  }

  .social-desktop-card:focus-visible {
    outline: 2px solid var(--brand);
    outline-offset: 5px;
    border-color: rgba(244,138,63,.72);
  }

  .social-desktop-card:nth-child(1) { animation-delay: 0ms; }
  .social-desktop-card:nth-child(2) { animation-delay: 100ms; }
  .social-desktop-card:nth-child(3) { animation-delay: 200ms; }
  .social-desktop-card:nth-child(4) { animation-delay: 300ms; }
  .social-desktop-card:nth-child(5) { animation-delay: 400ms; }

  .social-desktop-card:hover:not(.is-selected-social) {
    border-color: rgba(244,138,63,.38);
    box-shadow: 0 0 18px rgba(244,138,63,.12);
    transform: translateY(-4px) scale(1.08);
  }

  .social-desktop-card.is-selected-social {
    border-color: rgba(244,138,63,.72);
    background:
      radial-gradient(circle at 30% 28%, rgba(244,138,63,.24), transparent 30%),
      rgba(8,9,13,.64);
    box-shadow:
      0 0 42px rgba(244,138,63,.48),
      inset 0 0 32px rgba(244,138,63,.12),
      0 18px 42px rgba(0,0,0,.38);
    transform: translateY(-8px) scale(1.12);
  }

  .social-desktop-card.is-selected-social::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;
    width: 38px;
    height: 2px;
    border-radius: 999px;
    transform: translateX(-50%);
    background: var(--brand);
    box-shadow: 0 0 18px rgba(244,138,63,.72);
  }

  .social-desktop-card__icon {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 1.8rem;
    filter: drop-shadow(0 0 8px rgba(255,255,255,.08));
    transition: filter .3s ease;
  }

  .social-desktop-card.is-selected-social .social-desktop-card__icon {
    filter: drop-shadow(0 0 16px rgba(255,255,255,.18));
  }

  .social-desktop-card__icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .social-desktop-expanded {
    grid-column: 1 / -1;
    width: min(100%, 980px);
    margin: 34px auto 0;
    padding: 30px 34px 26px;
    border-radius: 16px;
    border: 1px solid rgba(244,138,63,.24);
    background:
      radial-gradient(circle at 92% 0%, rgba(244,138,63,.10), transparent 34%),
      linear-gradient(135deg, rgba(244,138,63,.055), rgba(255,255,255,.018)),
      rgba(8,9,13,.30);
    backdrop-filter: blur(14px) saturate(1.24);
    -webkit-backdrop-filter: blur(14px) saturate(1.24);
    min-height: 192px;
    box-shadow:
      0 28px 80px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.06);
    transition: border-color .3s ease, background .3s ease, box-shadow .3s ease;
    animation: desktopExpandedEnter .68s cubic-bezier(.2,.8,.2,1) .48s both;
  }

  .social-desktop-expanded__content {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .25s ease, transform .25s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 34px;
  }

  .social-desktop-expanded__content::before {
    content: "";
    align-self: stretch;
    width: 1px;
    order: 2;
    background: linear-gradient(180deg, transparent, rgba(244,138,63,.42), transparent);
  }

  .social-desktop-expanded__identity {
    min-width: 0;
    flex: 1 1 auto;
  }

  .social-desktop-expanded__content.is-visible {
    opacity: 1;
    transform: translateY(0);
  }

  .social-desktop-expanded__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
  }

  .social-desktop-expanded__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .social-desktop-expanded__meta span:first-child {
    color: var(--brand);
  }

  .social-desktop-expanded__icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--brand);
    flex-shrink: 0;
  }

  .social-desktop-expanded__icon svg {
    width: 100%;
    height: 100%;
  }

  .social-desktop-expanded__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--brand);
    text-decoration: none;
    font-size: 1.12rem;
    font-weight: 600;
    text-transform: lowercase;
    letter-spacing: 0;
    transition: gap .25s ease;
  }

  .social-desktop-expanded__link:hover {
    gap: 12px;
  }

  .social-desktop-expanded__arrow {
    font-size: 0.9rem;
  }

  .social-desktop-expanded__handle {
    display: block;
    color: var(--muted);
    font-size: 0.98rem;
    text-decoration: none;
    margin-bottom: 0;
    letter-spacing: 0;
    transition: color .25s ease;
  }

  .social-desktop-expanded__handle:hover {
    color: var(--brand);
  }

  .social-desktop-expanded__metrics {
    order: 3;
    min-width: 330px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
  }

  .social-desktop-expanded__metric strong {
    display: block;
    font-size: clamp(3.2rem, 8vw, 4.8rem);
    color: var(--text);
    line-height: .92;
    font-weight: 300;
    letter-spacing: 0;
  }

  .social-desktop-expanded__metric span {
    display: block;
    color: var(--brand);
    font-size: 1.04rem;
    margin-top: 8px;
    letter-spacing: 0;
  }

  .social-desktop-expanded__avatar {
    width: 126px;
    height: 126px;
    object-fit: cover;
    border-radius: 999px;
    border: 2px solid rgba(244,138,63,.48);
    box-shadow:
      0 24px 48px rgba(0,0,0,.32),
      0 0 32px rgba(244,138,63,.24);
    flex-shrink: 0;
    transition: transform .3s ease, box-shadow .3s ease;
  }

  .social-desktop-expanded__avatar:hover {
    transform: scale(1.04);
    box-shadow:
      0 28px 56px rgba(0,0,0,.38),
      0 0 42px rgba(244,138,63,.32);
  }

  .social-desktop-expanded__hint {
    display: block;
    margin-top: 18px;
    color: color-mix(in srgb, var(--muted) 78%, transparent);
    font-size: .74rem;
    letter-spacing: 0;
  }
}

@media (min-width: 901px) {
  :root[data-theme="light"] .social-desktop-card {
    border-color: rgba(23,21,19,.08);
    background:
      radial-gradient(circle at 30% 28%, rgba(244,138,63,.06), transparent 40%),
      rgba(240,230,218,.48);
  }

  :root[data-theme="light"] .social-desktop-card.is-selected-social {
    border-color: rgba(244,138,63,.58);
    background:
      radial-gradient(circle at 30% 28%, rgba(244,138,63,.18), transparent 30%),
      rgba(240,230,218,.78);
    box-shadow:
      0 0 42px rgba(244,138,63,.32),
      inset 0 0 32px rgba(244,138,63,.08),
      0 18px 42px rgba(0,0,0,.12);
  }

  :root[data-theme="light"] .social-desktop-expanded {
    border-color: rgba(216,109,36,.18);
    background:
      radial-gradient(circle at 92% 0%, rgba(216,109,36,.10), transparent 34%),
      linear-gradient(135deg, rgba(216,109,36,.055), rgba(255,255,255,.34)),
      rgba(255,250,243,.62);
    box-shadow:
      0 28px 80px rgba(80,48,22,.10),
      inset 0 1px 0 rgba(255,255,255,.64);
  }
}

@media (min-width: 901px) {
  #main-social-grid {
    display: none !important;
  }
}

@media (max-width: 900px) {
  .social-desktop-card {
    animation: none !important;
  }

  .social-desktop-expanded {
    animation: none !important;
  }

  [data-social-desktop-line],
  [data-social-desktop-expanded] {
    display: none !important;
  }
}

.social-desktop-particle {
  position: fixed;
  pointer-events: none;
  z-index: 997;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 0 8px rgba(244,138,63,.72);
  left: var(--start-x, 0);
  top: var(--start-y, 0);
  animation: particleFloat var(--duration, 1s) ease-out var(--delay, 0s) forwards;
}

.social-desktop-particle--glow {
  width: 8px;
  height: 8px;
  background: rgba(244,138,63,.96);
  box-shadow: 0 0 16px rgba(244,138,63,.96);
}

.social-desktop-sound-toggle {
  position: absolute;
  top: 22px;
  right: 24px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(244,138,63,.24);
  background: transparent;
  color: var(--brand);
  font-size: .98rem;
  cursor: pointer;
  opacity: .72;
  transition:
    border-color .3s ease,
    box-shadow .3s ease,
    transform .2s ease;
  display: grid;
  place-items: center;
}

.social-desktop-sound-toggle:hover {
  border-color: rgba(244,138,63,.48);
  box-shadow: 0 0 18px rgba(244,138,63,.18);
  opacity: 1;
}

.social-desktop-sound-toggle:active {
  transform: scale(0.95);
}

@media (min-width: 901px) and (max-width: 1080px) {
  .social-desktop-card {
    width: 104px;
    height: 104px;
  }

  .social-desktop-card__icon {
    width: 48px;
    height: 48px;
  }

  .social-desktop-expanded__content {
    gap: 24px;
  }

  .social-desktop-expanded__metrics {
    min-width: 280px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .social-desktop-card,
  .social-desktop-expanded,
  .social-desktop-expanded__content,
  .social-desktop-particle {
    animation: none !important;
    transition: none !important;
  }

  .social-desktop-particle {
    display: none !important;
  }
}


/* ===== styles/fan-area-overrides.css ===== */

/* ===== Hero / fan area overrides ===== */
.hero h1 {
  max-width: 12ch;
}
.hero h1 [data-hero-line="name"] {
  color: var(--text);
  font-weight: 400;
}
.hero h1 [data-hero-line="lab"] {
  color: var(--brand);
  font-weight: 800;
}
.hero p[data-i18n="heroSubtitle"] {
  max-width: 34ch;
}

.fan-area-star,
.sensitive-icon {
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: -0.12em;
  color: var(--brand);
  flex: 0 0 auto;
}
.hero-fan-cta,
.fan-band-cta,
.vip-band__cta {
  border-color: var(--brand) !important;
  color: #fff !important;
}
.hero-fan-cta .fan-star-icon,
.hero-fan-cta .lock-icon,
.fan-band-cta .lock-icon,
.vip-band__cta .lock-icon {
  color: var(--brand) !important;
}
.hero-fan-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.hero-fan-cta::after,
.hero__ctas .btn-blur::after {
  content: "";
  position: absolute;
  inset: -45% auto -45% -35%;
  width: 34%;
  pointer-events: none;
  z-index: -1;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.28) 45%, rgba(244,138,63,0.18) 55%, transparent 100%);
  filter: blur(6px);
  transform: translateX(-130%) rotate(12deg);
  animation: fanAreaShine 8.4s ease-in-out infinite;
}
@keyframes fanAreaShine {
  0%, 62% { transform: translateX(-145%) rotate(12deg); opacity: 0; }
  70% { opacity: .62; }
  90% { transform: translateX(520%) rotate(12deg); opacity: 0; }
  100% { transform: translateX(520%) rotate(12deg); opacity: 0; }
}

/* Header / hero light-mode button corrections */
:root[data-theme="light"] .actions .btn-blur {
  color: #171513 !important;
}
:root[data-theme="light"] .actions .btn-blur .lock-icon {
  color: var(--brand) !important;
}
:root[data-theme="light"] .hero__ctas .btn-primary {
  color: #fff !important;
}
:root[data-theme="light"] .hero__ctas .btn-primary svg {
  color: #fff !important;
  stroke: currentColor;
}

/* Dark hero fanarea glass: keep it readable and less milky. */
:root[data-theme="dark"] .hero-fan-cta,
:root[data-theme="dark"] .hero__ctas .btn-blur {
  background:
    radial-gradient(circle at 18% 42%, rgba(255,255,255,.16), transparent 32%),
    linear-gradient(135deg, rgba(10,10,13,.72), rgba(244,138,63,.16) 54%, rgba(10,10,13,.82)) !important;
  backdrop-filter: blur(18px) saturate(1.32) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.32) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 14px 36px rgba(0,0,0,.28) !important;
}

/* Locked fan-area banner */
.fan-locked-band {
  background: linear-gradient(135deg, rgba(19,17,19,1) 0%, rgba(10,10,13,1) 100%) !important;
}
.fan-locked-band::before,
.fan-locked-band::after {
  opacity: .38;
  z-index: 0;
}
.fan-locked-band .vip-band__icon-wrap {
  background: rgba(8,9,13,0.92) !important;
  border-color: rgba(244,138,63,0.42) !important;
  box-shadow: inset 0 0 0 1px rgba(244,138,63,0.12), 0 0 16px rgba(244,138,63,0.08) !important;
  color: var(--brand) !important;
  overflow: hidden;
}
.fan-locked-band .vip-band__icon-wrap::before,
.fan-locked-band .vip-band__icon-wrap::after {
  display: none !important;
}
.fan-locked-band .vip-band__content,
.fan-locked-band .vip-band__cta,
.fan-locked-band .vip-band__icon-wrap {
  position: relative;
  z-index: 2;
}
.fan-locked-band .vip-band__content h3 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.fan-locked-band .vip-band__content h3 .fan-area-star {
  font-size: .86em;
}
.fan-band-cta,
.vip-band__cta {
  overflow: hidden;
  background: rgba(255,255,255,0.035) !important;
  backdrop-filter: blur(12px) saturate(1.35);
  -webkit-backdrop-filter: blur(12px) saturate(1.35);
}

/* Locked fan-area banner - light theme */
:root[data-theme="light"] .fan-locked-band {
  background: linear-gradient(135deg, rgba(255,248,239,0.96) 0%, rgba(241,221,203,0.92) 100%) !important;
  border-color: rgba(216,109,36,0.34) !important;
  box-shadow: 0 24px 70px rgba(80,48,22,0.13), inset 0 1px 0 rgba(255,255,255,0.68) !important;
}
:root[data-theme="light"] .fan-locked-band::before,
:root[data-theme="light"] .fan-locked-band::after {
  opacity: .20;
}
:root[data-theme="light"] .fan-locked-band .vip-band__icon-wrap {
  background: rgba(255,250,244,0.78) !important;
  border-color: rgba(216,109,36,0.46) !important;
  box-shadow: inset 0 0 0 1px rgba(216,109,36,0.13), 0 12px 34px rgba(80,48,22,0.12) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content h3 {
  color: #171513 !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content h3 span,
:root[data-theme="light"] .fan-locked-band .fan-area-star {
  color: var(--brand) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content p {
  color: rgba(23,21,19,0.62) !important;
}
:root[data-theme="light"] .fan-band-cta,
:root[data-theme="light"] .vip-band__cta {
  background: rgba(23,21,19,0.72) !important;
  color: #fff !important;
  border-color: var(--brand) !important;
}

/* Age modal */
.age-modal__card h3 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.age-modal__card .sensitive-icon {
  font-size: 1.15em;
}

/* Expanded fan area */
.fan-area-expanded .social__copy {
  position: relative;
}
.fan-area-expanded .eyebrow {
  line-height: 1.35;
}
.fan-area-expanded h2 strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.fan-area-expanded__desc {
  margin-top: -4px !important;
  max-width: 34ch !important;
}
.fan-area-lock-btn {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid var(--brand);
  background: rgba(255,255,255,0.035);
  color: var(--brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  cursor: pointer;
  backdrop-filter: blur(12px) saturate(1.35);
  -webkit-backdrop-filter: blur(12px) saturate(1.35);
  transition: transform .25s ease, background .25s ease;
}
.fan-area-lock-btn:hover {
  transform: translateY(-2px);
  background: rgba(244,138,63,0.12);
}
.fan-area-lock-btn svg {
  width: 17px;
  height: 17px;
}

@media (min-width: 901px) {
  /* Solta os orbs do limite da foto: container mais largo e deslocado para trás. */
  .hero__assets {
    inset: -5% auto 0 -330px !important;
    width: min(92vw, 1220px) !important;
    height: 108% !important;
    overflow: visible !important;
  }
  .hero__asset-img:nth-child(1),
  .hero__asset-img:nth-child(6) {
    width: 58% !important;
    top: -1% !important;
    left: 30% !important;
  }
  .hero__asset-img:nth-child(2),
  .hero__asset-img:nth-child(7) {
    width: 42% !important;
    top: 14% !important;
    left: 39% !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    width: 31% !important;
    top: 25% !important;
    left: 23% !important;
  }
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 48% !important;
    top: 42% !important;
    left: 19% !important;
  }
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    width: 30% !important;
    top: 50% !important;
    left: 73% !important;
  }
}

@media (max-width: 900px) {
  .hero h1 {
    max-width: 10.8ch;
  }
  .hero p[data-i18n="heroSubtitle"] {
    max-width: 25ch;
  }

  /* Mobile dark: a little darker for readability. */
  :root[data-theme="dark"] .hero-fan-cta,
  :root[data-theme="dark"] .hero__ctas .btn-blur {
    background:
      radial-gradient(circle at 16% 42%, rgba(255,255,255,.13), transparent 30%),
      linear-gradient(135deg, rgba(7,8,11,.78), rgba(244,138,63,.16) 55%, rgba(7,8,11,.88)) !important;
  }

  /* Puxa um asset para respirar também na área preta à esquerda. */
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 54% !important;
    top: 19% !important;
    right: 52% !important;
    opacity: 0.62 !important;
  }
}


/* ===== styles/fan-area-final-fixes.css ===== */

/* ===== Final fan-area refinements ===== */
:root {
  --ls-light-dark: #171513;
}

/* Tipografia fanarea: fan normal + area bold/laranja. */
.fan-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
  white-space: nowrap;
}
.fan-wordmark__fan {
  color: currentColor;
  font-weight: 600;
}
.fan-wordmark__area {
  color: var(--brand);
  font-weight: 900;
}
.fan-wordmark + .fan-area-star {
  margin-left: 8px;
}

/* Header fan-area no modo claro: usar a cor escura do tema claro. */
:root[data-theme="light"] .actions .btn-blur,
:root[data-theme="light"] .mobile-menu__cta.btn-blur {
  color: var(--ls-light-dark) !important;
}
:root[data-theme="light"] .actions .btn-blur .fan-wordmark__fan,
:root[data-theme="light"] .mobile-menu__cta.btn-blur .fan-wordmark__fan {
  color: var(--ls-light-dark) !important;
}
:root[data-theme="light"] .actions .btn-blur .fan-wordmark__area,
:root[data-theme="light"] .mobile-menu__cta.btn-blur .fan-wordmark__area,
:root[data-theme="light"] .actions .btn-blur .lock-icon,
:root[data-theme="light"] .mobile-menu__cta.btn-blur .lock-icon {
  color: var(--brand) !important;
}

/* Explorar do hero no modo claro: texto e seta brancos. */
:root[data-theme="light"] .hero__ctas .btn-primary,
:root[data-theme="light"] .hero__ctas .btn-primary * {
  color: #fff !important;
}

/* Fan-area hero button no modo claro não pode ficar branco apagado. */
:root[data-theme="light"] .hero-fan-cta,
:root[data-theme="light"] .hero__ctas .btn-blur.hero-fan-cta {
  color: var(--ls-light-dark) !important;
  border-color: var(--brand) !important;
  background: rgba(255,255,255,0.46) !important;
}
:root[data-theme="light"] .hero-fan-cta .fan-wordmark__fan {
  color: var(--ls-light-dark) !important;
}
:root[data-theme="light"] .hero-fan-cta .fan-wordmark__area,
:root[data-theme="light"] .hero-fan-cta .fan-area-star {
  color: var(--brand) !important;
}

/* Banner fan area no modo claro: claro, quente e coerente. */
:root[data-theme="light"] .fan-locked-band {
  background: linear-gradient(135deg, rgba(255,250,244,0.96) 0%, rgba(244,226,207,0.88) 100%) !important;
  border-color: rgba(216,109,36,0.36) !important;
  box-shadow: 0 24px 70px rgba(80,48,22,0.12), inset 0 1px 0 rgba(255,255,255,0.72) !important;
}
:root[data-theme="light"] .fan-locked-band::before,
:root[data-theme="light"] .fan-locked-band::after {
  opacity: .18 !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__icon-wrap {
  background: rgba(255,252,247,0.82) !important;
  border-color: rgba(216,109,36,0.48) !important;
  color: var(--brand) !important;
  box-shadow: inset 0 0 0 1px rgba(216,109,36,0.14), 0 12px 34px rgba(80,48,22,0.10) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content h3,
:root[data-theme="light"] .fan-locked-band .vip-band__content .fan-wordmark__fan {
  color: var(--ls-light-dark) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content .fan-wordmark__area,
:root[data-theme="light"] .fan-locked-band .vip-band__content .fan-area-star {
  color: var(--brand) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content p {
  color: rgba(23,21,19,0.62) !important;
}

/* Botão acessar agora do banner: claro no light mode, não escuro. */
:root[data-theme="light"] .fan-band-cta,
:root[data-theme="light"] .vip-band__cta.fan-band-cta {
  background: rgba(255,255,255,0.48) !important;
  color: var(--ls-light-dark) !important;
  border-color: var(--brand) !important;
}
:root[data-theme="light"] .fan-band-cta .lock-icon,
:root[data-theme="light"] .vip-band__cta.fan-band-cta .lock-icon {
  color: var(--brand) !important;
}

@media (min-width: 901px) {
  /* Orbs menores e mais dispersos: deixam de acompanhar a caixa da foto. */
  .hero__visual {
    overflow: visible !important;
  }
  .hero__assets {
    inset: -7% auto 0 -360px !important;
    width: min(84vw, 1120px) !important;
    height: 112% !important;
    overflow: visible !important;
    max-width: none !important;
  }
  .hero__asset-img:nth-child(1),
  .hero__asset-img:nth-child(6) {
    width: 45% !important;
    top: 0% !important;
    left: 42% !important;
  }
  .hero__asset-img:nth-child(2),
  .hero__asset-img:nth-child(7) {
    width: 35% !important;
    top: 14% !important;
    left: 32% !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    width: 26% !important;
    top: 35% !important;
    left: 24% !important;
  }
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 39% !important;
    top: 50% !important;
    left: 35% !important;
  }
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    width: 23% !important;
    top: 43% !important;
    left: 76% !important;
  }
}

@media (max-width: 900px) {
  /* Reequilibra assets mobile: devolve o asset puxado demais e usa outro mais baixo/esquerda. */
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 48% !important;
    top: 20% !important;
    right: 42% !important;
    opacity: .60 !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    width: 39% !important;
    top: 39% !important;
    right: 36% !important;
    opacity: .74 !important;
  }
}


/* ===== styles/hero-tuning.css ===== */

/* ===== Hero tuning after creative lab rollout ===== */
@media (min-width: 901px) {
  .hero__copy {
    max-width: min(36vw, 520px) !important;
  }
  .hero h1 {
    font-size: clamp(3.25rem, 5vw, 5.15rem) !important;
    line-height: .96 !important;
    letter-spacing: 0;
    max-width: 11ch !important;
  }
  .hero p[data-i18n="heroSubtitle"] {
    font-size: clamp(1.02rem, 1.16vw, 1.22rem) !important;
    line-height: 1.55 !important;
    max-width: 34ch !important;
    margin-top: 18px !important;
  }
  .hero__ctas {
    gap: 14px !important;
    margin-top: 28px !important;
  }
  .hero__ctas .button {
    font-size: 1rem !important;
    padding: 13px 24px !important;
  }
  .hero__ctas .btn-primary svg,
  .hero__ctas .button .lock-icon,
  .hero__ctas .button .fan-area-star {
    width: 16px !important;
    height: 16px !important;
  }
  .hero__guide {
    font-size: .92rem !important;
    margin-top: 24px !important;
  }
}

@media (max-width: 900px) {
  /* Foto um pouco mais alta; copy levemente mais baixa para preservar sobreposição. */
  .hero__carousel {
    top: 48px !important;
  }
  .hero__copy {
    margin-top: 88px !important;
    margin-left: 10px !important;
  }

  /* Light mode: mais contraste nos assets claros sem pesar o fundo. */
  :root[data-theme="light"] .hero__asset-img {
    filter: saturate(1.26) contrast(1.13) brightness(.93) !important;
    opacity: .98 !important;
  }
  :root[data-theme="light"] .hero__asset-img:nth-child(4),
  :root[data-theme="light"] .hero__asset-img:nth-child(9) {
    opacity: .74 !important;
  }
  :root[data-theme="light"] .hero__asset-img:nth-child(3),
  :root[data-theme="light"] .hero__asset-img:nth-child(8) {
    opacity: .86 !important;
  }
}


/* ===== styles/final-polish.css ===== */

/* ===== Final polish: hero, fanarea, modals ===== */
.fan-wordmark {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 0 !important;
  white-space: nowrap !important;
  letter-spacing: 0;
}
.fan-wordmark__fan {
  font-weight: 400 !important;
}
.fan-wordmark__area {
  margin-left: -0.035em !important;
  font-weight: 900 !important;
  color: var(--brand) !important;
}
.fan-area-star {
  margin-left: 3px !important;
  transform: translateY(-0.08em) !important;
  vertical-align: -0.02em !important;
}

/* Menu central segue o peso padrão do menu, sem bold extra. */
.menu .fan-wordmark,
.mobile-menu__links .fan-wordmark {
  font-weight: inherit !important;
  letter-spacing: 0;
}
.menu .fan-wordmark__fan,
.menu .fan-wordmark__area,
.mobile-menu__links .fan-wordmark__fan,
.mobile-menu__links .fan-wordmark__area {
  font-weight: inherit !important;
}
.menu .fan-wordmark__area,
.mobile-menu__links .fan-wordmark__area {
  margin-left: -0.02em !important;
}

/* Hero button: fan regular + area bold/brand + star alinhada. */
.hero__ctas .button {
  min-height: 46px !important;
}
.hero-fan-cta {
  min-width: 132px !important;
  justify-content: center !important;
}
.hero-fan-cta .fan-wordmark__fan {
  font-weight: 400 !important;
}
.hero-fan-cta .fan-wordmark__area {
  font-weight: 900 !important;
  color: var(--brand) !important;
}
.hero-fan-cta .fan-area-star {
  width: 15px !important;
  height: 15px !important;
  margin-left: 4px !important;
  transform: translateY(-0.08em) !important;
}

/* Header/menu fanarea button: tudo junto, fan regular e area laranja em ambos os temas. */
.actions .btn-blur .fan-wordmark__fan,
.mobile-menu__cta .fan-wordmark__fan {
  font-weight: 400 !important;
}
.actions .btn-blur .fan-wordmark__area,
.mobile-menu__cta .fan-wordmark__area {
  font-weight: 900 !important;
  color: var(--brand) !important;
}
.actions .btn-blur .fan-area-star,
.mobile-menu__cta .fan-area-star {
  margin-left: 3px !important;
  transform: translateY(-0.08em) !important;
}

/* Banner modo escuro: fan em amarelo, area laranja, estrela próxima. */
.fan-locked-band .vip-band__content .fan-wordmark__fan {
  color: #f6c76a !important;
  font-weight: 400 !important;
}
.fan-locked-band .vip-band__content .fan-wordmark__area {
  color: var(--brand) !important;
  font-weight: 900 !important;
}
.fan-locked-band .vip-band__content h3 .fan-area-star {
  margin-left: 4px !important;
  transform: translateY(-0.08em) !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__content .fan-wordmark__fan {
  color: var(--ls-light-dark, #171513) !important;
}

/* Modais com blur/glass conforme tema. */
.age-modal__card,
.legal-modal__card {
  background: color-mix(in srgb, var(--bg-soft) 76%, transparent) !important;
  backdrop-filter: blur(24px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.45) !important;
  border-color: color-mix(in srgb, var(--brand) 16%, var(--stroke)) !important;
}
.age-modal__backdrop,
.legal-modal__backdrop {
  background: rgba(0,0,0,.64) !important;
  backdrop-filter: blur(10px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.2) !important;
}
:root[data-theme="light"] .age-modal__backdrop,
:root[data-theme="light"] .legal-modal__backdrop {
  background: rgba(246,232,218,.62) !important;
}
:root[data-theme="light"] .age-modal__card,
:root[data-theme="light"] .legal-modal__card {
  background: rgba(255,250,244,.74) !important;
  box-shadow: 0 28px 70px rgba(80,48,22,.16) !important;
}

/* Botão de cadeado da área aberta: estado selecionado. */
.fan-area-expanded .fan-area-lock-btn {
  background: color-mix(in srgb, var(--brand) 22%, rgba(255,255,255,.04)) !important;
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 1px rgba(244,138,63,.18), 0 12px 26px rgba(244,138,63,.16) !important;
}

@media (min-width: 901px) {
  /* Ajuste fino dos assets desktop: sem vazar na linha inferior. */
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    width: 19% !important;
    top: 41% !important;
    left: 70% !important;
  }
  .hero__asset-img:nth-child(1),
  .hero__asset-img:nth-child(6) {
    width: 43% !important;
    top: -1% !important;
    left: 41% !important;
  }
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    width: 36% !important;
    top: 42% !important;
    left: 35% !important;
  }
}

@media (max-width: 900px) {
  .hero__ctas .button {
    min-height: 48px !important;
  }
  .hero-fan-cta {
    min-width: 132px !important;
  }
  /* Descer os assets mais presentes à esquerda. */
  .hero__asset-img:nth-child(4),
  .hero__asset-img:nth-child(9) {
    top: 25% !important;
    right: 42% !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    top: 44% !important;
    right: 36% !important;
  }

  /* Fanarea aberta: respeitar respiro lateral geral. */
  .fan-area-expanded {
    width: min(100% - 32px, 1220px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .fan-area-expanded .social__copy {
    padding-left: 0 !important;
  }
  .fan-area-expanded h2 {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .fan-area-expanded h2 .fan-area-star {
    margin-left: 3px !important;
    transform: translateY(-0.08em) !important;
  }
  .fan-area-expanded h2 .fan-wordmark__fan {
    font-weight: 400 !important;
  }

  .fan-locked-band .vip-band__content h3 .fan-area-star,
  .fan-area-expanded h2 .fan-area-star {
    margin-left: 3px !important;
  }
}


/* ===== styles/about-section.css ===== */

/* ===== About / creative lab section ===== */
.about-lab {
  width: min(100% - 48px, 1220px);
  margin: 0 auto 64px;
  position: relative;
}
.about-lab__inner {
  display: grid;
  grid-template-columns: minmax(260px, .64fr) minmax(0, 1fr);
  gap: clamp(28px, 3.7vw, 58px);
  align-items: center;
}
.about-lab__visual {
  position: relative;
  min-height: clamp(252px, 29vw, 392px);
}
.about-lab__media-shell {
  position: relative;
  height: 100%;
  min-height: inherit;
  border-radius: 30px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid color-mix(in srgb, var(--brand) 20%, var(--stroke));
  background: rgba(255,255,255,.025);
  box-shadow: 0 24px 62px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
}
.about-lab__bg,
.about-lab__gif {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.about-lab__bg {
  z-index: 1;
  opacity: .88;
  transform: scale(1.01);
}
.about-lab__gif {
  z-index: 3;
  object-fit: contain;
  padding: 0;
  background: transparent;
  filter: drop-shadow(0 20px 34px rgba(0,0,0,.28));
  transform: scale(.8);
  transform-origin: center center;
}
.about-lab__gif--dark,
.about-lab__gif--light {
  object-position: center center;
}
.about-lab__halo {
  position: absolute;
  inset: auto 8% 8% 8%;
  height: 24%;
  z-index: 4;
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(244,138,63,.20) 0%, transparent 72%);
  filter: blur(12px);
  opacity: .78;
}
.about-lab__bg--light,
.about-lab__gif--light,
:root[data-theme="light"] .about-lab__bg--dark,
:root[data-theme="light"] .about-lab__gif--dark {
  display: none;
}
:root[data-theme="light"] .about-lab__bg--light,
:root[data-theme="light"] .about-lab__gif--light {
  display: block;
}
.about-lab__copy {
  position: relative;
  z-index: 2;
}
.about-lab__eyebrow {
  margin-bottom: 14px;
}
.about-lab__title {
  display: block;
  margin: 0 0 22px;
  max-width: none;
  width: max-content;
  font-size: clamp(3rem, 5.9vw, 6.1rem);
  line-height: .94;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--text);
  white-space: nowrap;
}
.about-lab__title span,
.about-lab__title strong {
  display: inline;
  white-space: nowrap;
}
.about-lab__title strong {
  color: var(--brand);
  font-weight: 900;
}
.about-lab__body {
  display: grid;
  gap: 18px;
  max-width: 66ch;
}
.about-lab__body p {
  margin: 0;
  color: var(--muted);
  font-size: clamp(.98rem, 1.08vw, 1.12rem);
  line-height: 1.72;
  text-align: justify;
  text-wrap: pretty;
}
.about-lab__body p:first-child {
  color: var(--text);
  font-weight: 700;
  font-size: clamp(1.05rem, 1.2vw, 1.24rem);
  text-align: left;
}
.about-lab__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  border: 1px solid color-mix(in srgb, var(--brand) 34%, var(--stroke));
  border-radius: 999px;
  padding: 9px 14px;
  color: var(--text);
  background: color-mix(in srgb, var(--brand) 7%, rgba(255,255,255,.035));
  backdrop-filter: blur(14px) saturate(1.35);
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  font-size: .78rem;
  letter-spacing: 0;
  text-transform: uppercase;
}
.about-lab__divider {
  margin-top: 16px !important;
}
:root[data-theme="light"] .about-lab__media-shell {
  background:
    linear-gradient(135deg, rgba(216,109,36,.10), rgba(255,255,255,.38)),
    rgba(255,255,255,.48);
  box-shadow: 0 24px 64px rgba(80,48,22,.11), inset 0 1px 0 rgba(255,255,255,.72);
}
:root[data-theme="light"] .about-lab__bg {
  opacity: .62;
  filter: saturate(.96) contrast(.96) sepia(.10) hue-rotate(-8deg);
}
:root[data-theme="light"] .about-lab__media-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(216,109,36,.16), transparent 48%, rgba(216,109,36,.08));
  mix-blend-mode: multiply;
  opacity: .28;
}
:root[data-theme="light"] .about-lab__gif {
  filter: drop-shadow(0 18px 32px rgba(80,48,22,.13));
}
:root[data-theme="light"] .about-lab__halo {
  background: radial-gradient(ellipse at center, rgba(216,109,36,.18) 0%, transparent 72%);
  opacity: .64;
}

@media (max-width: 900px) {
  .about-lab {
    width: min(100% - 32px, 1220px);
    margin-bottom: 48px;
  }
  .about-lab__inner {
    display: block;
    position: relative;
  }
  .about-lab__visual {
    position: absolute;
    top: 10px;
    right: -2px;
    width: min(42vw, 176px);
    min-height: min(42vw, 176px);
    z-index: 1;
    transform: rotate(4deg);
    transform-origin: center;
    pointer-events: none;
  }
  .about-lab__copy {
    position: relative;
    z-index: 2;
    min-height: min(44vw, 186px);
  }
  .about-lab__media-shell {
    border-radius: 22px;
    background-color: transparent !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
  }
  .about-lab__bg {
    opacity: .70;
  }
  .about-lab__gif {
    padding: 0;
    object-fit: contain;
    transform: scale(.8);
  }
  .about-lab__gif--dark,
  .about-lab__gif--light {
    transform: scale(.8);
  }
  .about-lab__title {
    font-size: clamp(1.55rem, 6.4vw, 2.55rem);
    margin-bottom: 20px;
    max-width: none;
    width: max-content;
    white-space: nowrap;
  }
  .about-lab__eyebrow {
    display: block;
    max-width: calc(100% - min(35vw, 150px));
  }
  .about-lab__body {
    gap: 15px;
    clear: both;
  }
  .about-lab__body p {
    font-size: .94rem;
    line-height: 1.68;
    text-align: justify;
  }
  .about-lab__body p:first-child {
    text-align: left;
  }
  .about-lab__badge {
    margin-top: 22px;
  }
  :root[data-theme="light"] .about-lab__bg {
    opacity: .54;
  }
  :root[data-theme="light"] .about-lab__media-shell {
    background:
      linear-gradient(135deg, rgba(216,109,36,.13), rgba(255,255,255,.32)),
      rgba(255,255,255,.44) !important;
  }
}


/* ===== styles/preloader.css ===== */

/* ===== Initial media preloader ===== */
html {
  scrollbar-gutter: stable;
}

body.is-preloading {
  overflow: hidden;
}
body.is-preloading .page-shell {
  opacity: 0;
}
body.has-preloaded .page-shell {
  animation: pageShellEnter .42s ease both;
}
/* Keep fixed nav outside transformed ancestors after preload. */
body.has-preloaded .page-shell,
body:not(.is-preloading) .page-shell {
  transform: none !important;
  filter: none !important;
}
.top-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  transform: none !important;
  z-index: 99999 !important;
}
.site-preloader {
  position: fixed;
  inset: 0;
  width: 100dvw;
  min-height: 100dvh;
  z-index: 99999;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 52%, rgba(244,138,63,.18), transparent 30%),
    var(--bg);
  transition: opacity .32s ease, visibility .32s ease;
  overflow: hidden;
}
.site-preloader__inner {
  display: grid;
  grid-template-areas:
    "mark"
    "text";
  place-items: center;
  row-gap: 16px;
  color: var(--text);
  transform: translate3d(0, -2px, 0);
}
.site-preloader__logo {
  grid-area: mark;
  position: relative;
  z-index: 2;
  width: 54px;
  height: 54px;
  color: var(--brand);
  filter: drop-shadow(0 0 18px rgba(244,138,63,.24));
}
.site-preloader__logo path,
.site-preloader__logo polygon {
  fill: currentColor;
  fill-opacity: 1;
  stroke: none !important;
}
.site-preloader__mark {
  grid-area: mark;
  position: relative;
  z-index: 1;
  width: 92px;
  height: 92px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 42%, var(--stroke));
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--bg-soft) 62%, transparent);
  box-shadow:
    0 18px 54px rgba(0,0,0,.24),
    0 0 38px rgba(244,138,63,.16),
    inset 0 0 28px rgba(244,138,63,.045);
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
}
.site-preloader__mark::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 999px;
  border: 2px solid transparent;
  border-top-color: var(--brand);
  border-right-color: color-mix(in srgb, var(--brand) 74%, transparent);
  opacity: .88;
  pointer-events: none;
  animation: sitePreloaderRing 2.4s ease-in-out infinite alternate;
}
.site-preloader__text {
  grid-area: text;
  margin-top: 2px;
  font-size: .68rem;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--muted);
}
body:not(.is-preloading) .site-preloader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes sitePreloaderRing {
  0% { transform: rotate(-28deg) scale(.98); opacity: .58; }
  100% { transform: rotate(332deg) scale(1.02); opacity: .96; }
}
@keyframes pageShellEnter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .site-preloader,
  .site-preloader__mark::before,
  body.has-preloaded .page-shell { transition: none; animation: none; }
}


/* ===== styles/logo-draw-effect.css ===== */

/* ===== Logo snake reveal effect ===== */

.site-preloader__logo {
  grid-area: mark;
  position: relative;
  z-index: 2;
  width: 54px;
  height: 54px;
  color: var(--brand);
  filter: drop-shadow(0 0 18px rgba(244,138,63,.24));
  animation: siteLogoSoftBreath 3.8s ease-in-out infinite alternate;
}

.site-preloader__logo .logo-shape,
.site-preloader__logo .logo-shape path,
.site-preloader__logo .logo-shape polygon,
.top-nav .brand__logo-animated .logo-shape,
.top-nav .brand__logo-animated .logo-shape path,
.top-nav .brand__logo-animated .logo-shape polygon {
  fill: currentColor !important;
  stroke: none !important;
  animation: none !important;
  clip-path: none !important;
  opacity: 1 !important;
}

.site-preloader__logo .mask-paint,
.top-nav .brand__logo-animated .mask-paint {
  fill: none !important;
  stroke: #fff !important;
  stroke-dasharray: 100;
  stroke-dashoffset: 0;
  animation: snakeLogoEraseReveal 3.2s linear infinite alternate !important;
}

@keyframes snakeLogoEraseReveal {
  0%, 8% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 100; }
}

@keyframes siteLogoSoftBreath {
  0% {
    transform: scale(.96);
    filter: drop-shadow(0 0 12px rgba(244,138,63,.12));
  }
  100% {
    transform: scale(1.025);
    filter: drop-shadow(0 0 24px rgba(244,138,63,.30));
  }
}

.top-nav .brand__mark {
  position: relative;
  isolation: isolate;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  color: var(--brand);
}

.top-nav .brand__logo-animated {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  color: currentColor;
  pointer-events: none;
  filter: drop-shadow(0 0 8px rgba(244,138,63,.34));
  transform: translateZ(0);
}

@media (prefers-reduced-motion: reduce) {
  .site-preloader__logo,
  .site-preloader__logo .mask-paint,
  .top-nav .brand__logo-animated .mask-paint {
    animation: none !important;
  }
  .site-preloader__logo .mask-paint,
  .top-nav .brand__logo-animated .mask-paint {
    stroke-dashoffset: 0 !important;
  }
}


/* ===== styles/hero-motion.css ===== */

/* ===== Hero motion layer ===== */
.hero__asset-img {
  will-change: transform;
  transform: translate3d(0,0,0);
  backface-visibility: hidden;
}
.hero h1 [data-hero-line="lab"] {
  background: linear-gradient(105deg, var(--brand) 0%, var(--brand) 32%, #c96925 42%, #ffb15e 50%, var(--brand) 62%, var(--brand) 100%);
  background-size: 260% 100%;
  background-position: 100% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  animation: creativeLabPulseColor 9.2s ease-in-out infinite;
}
.hero-fan-cta,
.hero__ctas .btn-blur {
  background:
    radial-gradient(circle at 18% 42%, rgba(255,255,255,.30), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.14), rgba(244,138,63,.13) 54%, rgba(255,255,255,.045)) !important;
  backdrop-filter: blur(18px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.45) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 14px 36px rgba(0,0,0,.18) !important;
}
body.has-preloaded .hero__copy {
  animation: heroCopyEnter .74s cubic-bezier(.22,.61,.36,1) both;
}
body.has-preloaded .hero__assets {
  animation: heroAssetsEnter .86s cubic-bezier(.22,.61,.36,1) both;
}
body.has-preloaded .hero__carousel {
  animation: heroPhotoEnter .82s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes creativeLabPulseColor {
  0%, 36% { background-position: 100% 50%; filter: saturate(1); }
  66% { background-position: 18% 50%; filter: saturate(1.14); }
  86%, 100% { background-position: 0% 50%; filter: saturate(1); }
}
@keyframes heroCopyEnter {
  from { opacity: 0; transform: translate3d(-10px, 12px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes heroAssetsEnter {
  from { opacity: 0; transform: translate3d(12px, 8px, 0) scale(.985); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes heroPhotoEnter {
  from { opacity: 0; transform: translate3d(12px, 16px, 0) scale(.992); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__asset-img,
  body.has-preloaded .hero__copy,
  body.has-preloaded .hero__assets,
  body.has-preloaded .hero__carousel {
    transform: none !important;
    animation: none !important;
  }
  .hero h1 [data-hero-line="lab"] {
    animation: none !important;
  }
}


/* ===== styles/final-interaction-hotfixes.css ===== */

/* ===== Final requested interaction/content fixes ===== */
.hero__guide {
  display: inline-flex !important;
  align-items: center;
  gap: 6px !important;
  white-space: nowrap;
}
.hero__guide::after {
  content: none !important;
}
.hero-guide-arrow {
  display: inline-block;
  color: var(--brand);
  line-height: 1;
  animation: scrollHintArrowFloat 1.35s ease-in-out infinite;
}
@keyframes scrollHintArrowFloat {
  0%, 100% { transform: translateY(-2px); }
  50% { transform: translateY(4px); }
}

.about-lab__wave {
  display: inline-block;
  transform-origin: 72% 72%;
  animation: aboutWaveHello 1.6s ease-in-out infinite;
  will-change: transform;
}
@keyframes aboutWaveHello {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-15deg); }
  50% { transform: rotate(0deg); }
  75% { transform: rotate(15deg); }
}

/* Legal/privacy/terms modals: glass restored for all themes and breakpoints. */
.legal-modal__backdrop {
  background:
    radial-gradient(circle at 50% 36%, rgba(244,138,63,.15), transparent 34%),
    rgba(0,0,0,.68) !important;
  backdrop-filter: blur(16px) saturate(1.32) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.32) !important;
}
.legal-modal__card {
  border: 1px solid color-mix(in srgb, var(--brand) 26%, var(--stroke)) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.085), rgba(244,138,63,.035) 42%, rgba(255,255,255,.028)),
    color-mix(in srgb, var(--bg-soft) 78%, transparent) !important;
  backdrop-filter: blur(28px) saturate(1.58) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.58) !important;
  box-shadow:
    0 34px 92px rgba(0,0,0,.54),
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 0 1px rgba(244,138,63,.045) !important;
}
.legal-modal__card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.13), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(244,138,63,.10), transparent 34%);
  opacity: .72;
}
.legal-modal__card > * {
  position: relative;
  z-index: 1;
}
.legal-modal__close {
  backdrop-filter: blur(16px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.35) !important;
  background: rgba(255,255,255,.045) !important;
}
.legal-modal__divider {
  background: color-mix(in srgb, var(--brand) 22%, var(--stroke)) !important;
}
:root[data-theme="light"] .legal-modal__backdrop {
  background:
    radial-gradient(circle at 50% 34%, rgba(216,109,36,.15), transparent 34%),
    rgba(241,231,217,.64) !important;
  backdrop-filter: blur(18px) saturate(1.22) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.22) !important;
}
:root[data-theme="light"] .legal-modal__card {
  border-color: color-mix(in srgb, var(--brand) 34%, rgba(23,21,19,.13)) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.76), rgba(216,109,36,.08) 46%, rgba(255,248,239,.58)),
    rgba(255,248,239,.62) !important;
  box-shadow:
    0 34px 86px rgba(80,48,22,.18),
    inset 0 1px 0 rgba(255,255,255,.72),
    0 0 0 1px rgba(216,109,36,.055) !important;
}
:root[data-theme="light"] .legal-modal__card::before {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.64), transparent 34%),
    radial-gradient(circle at 88% 10%, rgba(216,109,36,.13), transparent 34%);
  opacity: .66;
}
:root[data-theme="light"] .legal-modal__close {
  background: rgba(255,255,255,.52) !important;
}

@media (max-width: 900px) {
  .legal-modal {
    padding: 16px !important;
    align-items: center !important;
  }
  .legal-modal__card {
    width: min(100%, 560px) !important;
    max-height: min(82vh, 720px) !important;
    padding: 28px 24px !important;
    border-radius: 24px !important;
    backdrop-filter: blur(24px) saturate(1.52) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.52) !important;
  }
}

@media (max-width: 900px) {
  .hero {
    position: relative !important;
  }
  .hero__guide {
    position: absolute !important;
    left: 26px !important;
    bottom: 18px !important;
    z-index: 12;
    margin: 0 !important;
    font-size: .68rem !important;
    letter-spacing: 0;
    text-transform: lowercase !important;
    color: var(--muted);
    opacity: .62;
    pointer-events: none;
  }
}

/* Header fanarea button: restore compact glass sizing and theme colors. */
.actions .btn-blur {
  min-height: 42px !important;
  padding: 10px 15px !important;
  gap: 8px !important;
}
.actions .btn-blur .fan-wordmark {
  letter-spacing: 0;
}
.actions .btn-blur .fan-wordmark__fan {
  color: #fff !important;
  font-weight: 400 !important;
}
.actions .btn-blur .fan-wordmark__area {
  color: var(--brand) !important;
  font-weight: 900 !important;
  margin-left: -0.04em !important;
}
:root[data-theme="light"] .actions .btn-blur .fan-wordmark__fan {
  color: #171513 !important;
}
.actions .btn-blur .lock-icon {
  width: 16px !important;
  height: 16px !important;
  color: var(--brand) !important;
}
.actions .btn-blur .lock-icon svg {
  width: 100% !important;
  height: 100% !important;
}

/* Hero fan CTA: restore desktop alignment with explorar. */
.hero__ctas .btn-blur span[data-i18n="navExclusive"] {
  font-size: inherit !important;
  display: inline-flex !important;
  align-items: baseline !important;
}
.hero__ctas .btn-blur span[data-i18n="navExclusive"]::before {
  content: none !important;
  display: none !important;
}
.hero__ctas .button {
  font-size: .88rem !important;
  font-weight: 700 !important;
}
@media (min-width: 901px) {
  .hero__ctas {
    align-items: center !important;
  }
  .hero__ctas .button {
    height: 48px !important;
    min-height: 48px !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .hero__ctas .btn-primary,
  .hero__ctas .hero-fan-cta {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .hero-fan-cta {
    min-width: 140px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    gap: 7px !important;
  }
}
.hero-fan-cta .fan-wordmark,
.hero__ctas .btn-blur span[data-i18n="navExclusive"] .fan-wordmark {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 0 !important;
  white-space: nowrap !important;
  letter-spacing: 0;
  font-size: inherit !important;
  line-height: 1 !important;
}
.hero-fan-cta .fan-wordmark__fan {
  color: #fff !important;
  font-weight: 400 !important;
}
.hero-fan-cta .fan-wordmark__area {
  color: var(--brand) !important;
  font-weight: 900 !important;
  margin-left: -0.045em !important;
}
:root[data-theme="light"] .hero-fan-cta .fan-wordmark__fan {
  color: #171513 !important;
}
.hero-fan-cta .fan-area-star {
  width: 16px !important;
  height: 16px !important;
  margin-left: 3px !important;
  transform: translateY(-0.04em) !important;
}

/* About section content rhythm. */
.about-lab__title {
  letter-spacing: 0;
  line-height: .95 !important;
}
.about-lab__title [data-about-i18n="titleBefore"],
.about-lab__title strong {
  display: block !important;
}
.about-lab__title strong {
  color: var(--brand) !important;
  font-weight: 900 !important;
}
.about-lab__body {
  gap: 12px !important;
}
.about-lab__body p {
  line-height: 1.56 !important;
}
.about-lab__triangle {
  color: var(--brand) !important;
  font-weight: 400 !important;
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
}
.about-lab__badge {
  text-transform: lowercase !important;
  letter-spacing: 0;
}

/* Harmonize social text with about text. */
.social__copy p {
  font-size: clamp(.98rem, 1.08vw, 1.12rem) !important;
  line-height: 1.56 !important;
}

/* Fan locked banner details. */
.fan-locked-band .vip-band__content .fan-wordmark__fan {
  color: #fff !important;
}
.fan-locked-band .vip-band__content h3 {
  gap: 0 !important;
}
.fan-locked-band .vip-band__content h3 .fan-area-star {
  margin-left: 3px !important;
  width: .72em !important;
  height: .72em !important;
  transform: translateY(-0.08em) !important;
}
.vip-band__icon-wrap svg {
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__icon-wrap {
  background: var(--brand) !important;
  color: #fff !important;
}
:root[data-theme="light"] .fan-locked-band .vip-band__icon-wrap svg,
:root[data-theme="light"] .fan-locked-band .vip-band__icon-wrap path {
  color: #fff !important;
  fill: currentColor !important;
}

/* New lock icon consistency without making banner icon gigantic. */
.lock-icon svg,
.fan-area-lock-btn svg {
  width: 100%;
  height: 100%;
  display: block;
}
.lock-icon path,
.fan-area-lock-btn path,
.vip-band__icon-wrap path {
  fill: currentColor;
}

@media (min-width: 901px) {
  /* Desktop: reduzir em 50% os dois assets indicados nos prints. */
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    width: 13% !important;
    left: 30% !important;
  }
  .hero__asset-img:nth-child(5),
  .hero__asset-img:nth-child(10) {
    width: 9.5% !important;
  }
}

@media (max-width: 900px) {
  /* Header mobile mais curto, como a composição anterior. */
  .hero {
    min-height: 80svh !important;
    padding-bottom: 0 !important;
    overflow: clip !important;
  }
  .hero__guide {
    display: inline-flex !important;
    left: 26px !important;
    bottom: 22px !important;
    z-index: 20 !important;
    opacity: .64 !important;
  }

  /* Ajustes finos dos assets do hero no mobile. */
  .hero__asset-img:nth-child(2),
  .hero__asset-img:nth-child(7) {
    top: 26% !important;
    right: -3% !important;
  }
  .hero__asset-img:nth-child(3),
  .hero__asset-img:nth-child(8) {
    top: 39% !important;
  }

  /* Restore mobile hero CTA dimensions/flow to the previous responsive layout. */
  .hero__ctas {
    gap: 8px !important;
    margin-top: 17px !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    align-items: center !important;
  }
  .hero__ctas .button {
    height: auto !important;
    min-height: 0 !important;
    padding: 9px 15px !important;
    font-size: .78rem !important;
  }
  .hero-fan-cta {
    min-width: 118px !important;
    padding-left: 13px !important;
    padding-right: 13px !important;
    gap: 6px !important;
  }
  .hero-fan-cta .fan-area-star {
    width: 14px !important;
    height: 14px !important;
    margin-left: 2px !important;
  }
  .about-lab__title {
    font-size: clamp(2.75rem, 12.2vw, 4.15rem) !important;
    line-height: .94 !important;
    max-width: 8.6ch !important;
  }
  .about-lab__body {
    gap: 12px !important;
  }
  .about-lab__body p {
    line-height: 1.56 !important;
  }
}


/* ===== styles/about-wave-smoother.css ===== */

/* ===== Smoother hello wave emoji ===== */
.about-lab__wave {
  display: inline-block;
  transform-origin: 72% 72%;
  animation: aboutWaveHelloSmooth 1.05s ease-in-out infinite !important;
  will-change: transform;
}

@keyframes aboutWaveHelloSmooth {
  0% { transform: rotate(-14deg); }
  50% { transform: rotate(14deg); }
  100% { transform: rotate(-14deg); }
}

@media (prefers-reduced-motion: reduce) {
  .about-lab__wave {
    animation: none !important;
  }
}


/* ===== styles/modal-glass-fixes.css ===== */

/* ===== Modal glass refinements + fanarea aligned with scrolled navbar ===== */

/* Baseado no glass da .top-nav.is-scrolled: mesmo blur/saturação e superfície por tema. */
.age-modal__backdrop,
.legal-modal__backdrop {
  background: rgba(0, 0, 0, .56) !important;
  backdrop-filter: blur(24px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
}

.age-modal__card,
.legal-modal__card {
  position: relative !important;
  border: 1px solid var(--stroke) !important;
  background: var(--nav-bg-scrolled) !important;
  backdrop-filter: blur(24px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
  box-shadow:
    0 30px 80px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
  overflow: hidden;
}

.age-modal__card::before,
.legal-modal__card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.055), transparent 30%),
    radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--brand) 8%, transparent), transparent 34%);
  opacity: .72;
}

.age-modal__card > *,
.legal-modal__card > * {
  position: relative;
  z-index: 1;
}

/* Keep legal modal scroll without clipping the close button into the content flow. */
.legal-modal__card {
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.legal-modal__close {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  left: auto !important;
  z-index: 3 !important;
  background: var(--nav-bg-scrolled) !important;
  border-color: var(--stroke) !important;
  backdrop-filter: blur(24px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
}

.legal-modal__title,
.legal-modal__meta,
.legal-modal__divider,
.legal-modal__body {
  position: relative;
  z-index: 1;
}

.legal-modal__divider {
  background: var(--stroke) !important;
}

/* Light theme: usa o mesmo fundo da navbar rolada no light. */
:root[data-theme="light"] .age-modal__backdrop,
:root[data-theme="light"] .legal-modal__backdrop {
  background: rgba(245,238,228,.56) !important;
  backdrop-filter: blur(24px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
}

:root[data-theme="light"] .age-modal__card,
:root[data-theme="light"] .legal-modal__card {
  border-color: var(--stroke) !important;
  background: var(--nav-bg-scrolled) !important;
  backdrop-filter: blur(24px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
  box-shadow:
    0 30px 78px rgba(80,48,22,.16),
    inset 0 1px 0 rgba(255,255,255,.62) !important;
}

:root[data-theme="light"] .age-modal__card::before,
:root[data-theme="light"] .legal-modal__card::before {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.46), transparent 34%),
    radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--brand) 8%, transparent), transparent 34%);
  opacity: .56;
}

:root[data-theme="light"] .legal-modal__close {
  background: var(--nav-bg-scrolled) !important;
  border-color: var(--stroke) !important;
}

/* Header/hero fanarea buttons: mesmo nível de blur da navbar, porém translúcido o suficiente para ver o fundo. */
.actions .btn-blur,
.hero-fan-cta,
.hero__ctas .btn-blur,
.mobile-menu__cta.btn-ghost {
  backdrop-filter: blur(22px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.45) !important;
}

:root[data-theme="dark"] .actions .btn-blur,
:root[data-theme="dark"] .mobile-menu__cta.btn-ghost {
  background: var(--nav-bg-scrolled) !important;
  border-color: color-mix(in srgb, var(--brand) 34%, var(--stroke)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    0 14px 34px rgba(0,0,0,.28) !important;
}

:root[data-theme="dark"] .hero-fan-cta,
:root[data-theme="dark"] .hero__ctas .btn-blur.hero-fan-cta {
  background:
    radial-gradient(circle at 18% 42%, rgba(255,255,255,.11), transparent 31%),
    linear-gradient(135deg, rgba(8,9,13,.70), rgba(8,9,13,.54) 48%, rgba(8,9,13,.74)) !important;
  border-color: color-mix(in srgb, var(--brand) 52%, rgba(255,255,255,.12)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 14px 34px rgba(0,0,0,.26) !important;
}

:root[data-theme="light"] .actions .btn-blur,
:root[data-theme="light"] .mobile-menu__cta.btn-ghost {
  background: var(--nav-bg-scrolled) !important;
  border-color: color-mix(in srgb, var(--brand) 32%, var(--stroke)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.56),
    0 14px 34px rgba(80,48,22,.10) !important;
}

:root[data-theme="light"] .hero-fan-cta,
:root[data-theme="light"] .hero__ctas .btn-blur.hero-fan-cta {
  background:
    radial-gradient(circle at 18% 42%, rgba(255,255,255,.54), transparent 34%),
    linear-gradient(135deg, rgba(255,250,244,.58), rgba(255,238,222,.38) 52%, rgba(255,250,244,.54)) !important;
  border-color: color-mix(in srgb, var(--brand) 48%, rgba(23,21,19,.13)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.62),
    inset 0 -1px 0 rgba(216,109,36,.08),
    0 14px 34px rgba(80,48,22,.10) !important;
}

/* Mobile: mantém a mesma receita, só ajusta encaixe e X. */
@media (max-width: 900px) {
  .age-modal,
  .legal-modal {
    padding: 16px !important;
  }

  .age-modal__card,
  .legal-modal__card {
    border-radius: 24px !important;
    backdrop-filter: blur(24px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.5) !important;
  }

  .legal-modal__card {
    padding: 30px 24px 26px !important;
    max-height: min(82vh, 720px) !important;
  }

  .legal-modal__close {
    top: 16px !important;
    right: 16px !important;
    left: auto !important;
  }

  :root[data-theme="dark"] .actions .btn-blur,
  :root[data-theme="dark"] .mobile-menu__cta.btn-ghost {
    background: rgba(8,9,13,.92) !important;
  }

  :root[data-theme="dark"] .hero-fan-cta,
  :root[data-theme="dark"] .hero__ctas .btn-blur.hero-fan-cta {
    background:
      radial-gradient(circle at 18% 42%, rgba(255,255,255,.10), transparent 31%),
      linear-gradient(135deg, rgba(8,9,13,.74), rgba(8,9,13,.58) 48%, rgba(8,9,13,.78)) !important;
  }
}


/* ===== styles/hero-guide-visibility.css ===== */

/* ===== Hero scroll hint visibility ===== */
.hero__guide {
  --hero-guide-scroll-opacity: 1;
  --hero-guide-scroll-y: 0px;
  opacity: calc(.66 * var(--hero-guide-scroll-opacity)) !important;
  visibility: visible !important;
  transform: translateY(var(--hero-guide-scroll-y)) !important;
  animation: none !important;
  transition:
    opacity .18s linear,
    transform .18s linear,
    visibility 0s linear 0s !important;
  will-change: opacity, transform;
  pointer-events: none !important;
}

.hero__guide.is-hidden-by-scroll {
  visibility: hidden !important;
  transition:
    opacity .18s linear,
    transform .18s linear,
    visibility 0s linear .18s !important;
}

@media (min-width: 901px) {
  .hero__guide {
    margin-top: 34px !important;
  }
}

@media (max-width: 900px) {
  .hero__guide {
    bottom: 28px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero__guide,
  .hero__guide.is-hidden-by-scroll {
    transition: none !important;
    transform: none !important;
  }
}


/* ===== styles/desktop-hero-photo-test.css ===== */

/* ===== Desktop-only hero photo enlargement test ===== */
@media (min-width: 901px) {
  .hero__carousel {
    top: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    overflow: clip !important;
  }

  .hero__slide {
    overflow: clip !important;
  }

  .hero__slide .profile-pic {
    height: 125% !important;
    object-fit: contain !important;
    object-position: center top !important;
  }

  /* Mantém os assets exatamente no comportamento/área anterior. */
  .hero__visual {
    overflow: visible !important;
  }

  .hero__assets {
    overflow: visible !important;
  }
}


/* ===== styles/about-title-lock.css ===== */

/* ===== About title single-line lock ===== */
.about-lab__title {
  display: block !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
}

.about-lab__title [data-about-i18n="titleBefore"],
.about-lab__title strong,
.about-lab__title [data-about-i18n="titleLeo"] {
  display: inline !important;
  white-space: nowrap !important;
}

.about-lab__title strong {
  color: var(--brand) !important;
  font-weight: 900 !important;
}

@media (max-width: 900px) {
  .about-lab__title {
    font-size: clamp(1.42rem, 5.9vw, 2.28rem) !important;
    line-height: .98 !important;
    letter-spacing: 0;
  }
}


/* ===== styles/mobile-social-orbit.css ===== */

/* ===== Mobile social orbit redesign ===== */
@media (max-width: 900px) {
  .social--mobile-orbit-ready {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: -104px;
    min-height: 804px;
    overflow: hidden;
    padding: 162px 0 28px;
    isolation: isolate;
  }

  .social--mobile-orbit-ready::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
      radial-gradient(circle at 96% 48%, rgba(244,138,63,.22), transparent 25%),
      radial-gradient(circle at 10% 0%, rgba(244,138,63,.10), transparent 42%),
      linear-gradient(180deg, rgba(25,13,9,0) 0%, rgba(30,17,12,.16) 10%, rgba(22,13,11,.48) 24%, rgba(6,7,10,.94) 50%, rgba(8,9,13,.98) 100%);
  }

  .social--mobile-orbit-ready::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
      linear-gradient(90deg, rgba(8,9,13,.18), transparent 48%, rgba(244,138,63,.08)),
      repeating-linear-gradient(90deg, rgba(255,255,255,.024) 0 1px, transparent 1px 78px);
    opacity: .50;
    mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
  }

  .social--mobile-orbit-ready .social__inner {
    display: block !important;
    width: min(100% - 56px, 520px);
    margin: 0 auto;
    position: relative;
  }

  .social--mobile-orbit-ready .social__copy {
    position: relative;
    z-index: 5;
    max-width: 285px;
  }

  .social--mobile-orbit-ready .social__copy .eyebrow {
    margin-bottom: 18px;
  }

  .social--mobile-orbit-ready .social__copy h2 {
    margin-bottom: 22px;
    font-size: clamp(2.55rem, 13vw, 4.6rem);
    line-height: .98;
    letter-spacing: 0;
  }

  .social--mobile-orbit-ready .social__copy h2 span,
  .social--mobile-orbit-ready .social__copy h2 strong {
    display: block;
  }

  .social--mobile-orbit-ready .social__copy p {
    max-width: 230px;
    font-size: .98rem !important;
    line-height: 1.78 !important;
    color: var(--muted);
  }

  .social--mobile-orbit-ready .social__cta {
    margin-top: 26px;
    min-height: 54px;
    padding: 0 32px !important;
    border-radius: 999px;
    font-size: .98rem !important;
    background: rgba(8,9,13,.42) !important;
    border-color: rgba(244,138,63,.48) !important;
    box-shadow:
      0 18px 46px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.08),
      0 0 32px rgba(244,138,63,.08) !important;
  }

  .social--mobile-orbit-ready .social-grid {
    display: none !important;
  }

  .mobile-social-orbit {
    display: block;
    position: relative;
    z-index: 3;
    min-height: 360px;
    margin-top: 12px;
  }

  .mobile-social-orbit__wheel-wrap {
    position: absolute;
    top: -292px;
    right: -348px;
    width: 540px;
    height: 540px;
    pointer-events: none;
  }

  .mobile-social-orbit__wheel {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    animation: mobileSocialWheelSpin 42s linear infinite;
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
    filter: drop-shadow(0 0 28px rgba(244,138,63,.20));
  }

  .mobile-social-orbit.is-paused-by-user .mobile-social-orbit__wheel {
    animation-play-state: paused;
    will-change: auto;
  }

  .mobile-social-orbit__ring {
    position: absolute;
    border-radius: 50%;
    inset: 0;
    border: 1px solid rgba(244,138,63,.30);
    box-shadow:
      inset 0 0 28px rgba(244,138,63,.08),
      0 0 34px rgba(244,138,63,.10);
  }

  .mobile-social-orbit__ring--inner {
    inset: 68px;
    border-width: 2px;
    border-color: rgba(244,138,63,.58);
    box-shadow:
      inset 0 0 36px rgba(244,138,63,.12),
      0 0 40px rgba(244,138,63,.18);
  }

  .mobile-social-orbit__planet {
    position: absolute;
    inset: 108px;
    border-radius: 50%;
    background:
      radial-gradient(circle at 30% 28%, rgba(255,168,93,.30), transparent 22%),
      radial-gradient(circle at 50% 50%, rgba(244,138,63,.36), rgba(96,38,13,.18) 45%, rgba(4,5,8,.98) 70%);
    border: 1px solid rgba(244,138,63,.35);
    box-shadow:
      inset 0 0 42px rgba(244,138,63,.14),
      0 0 46px rgba(244,138,63,.22);
  }

  .mobile-social-orbit__node {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color: #fff;
    text-decoration: none;
    transform-origin: center;
    pointer-events: auto;
  }

  .mobile-social-orbit__node span {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    transform: rotate(calc(-1 * var(--node-rotation, 0deg)));
  }

  .mobile-social-orbit__node svg {
    width: 30px;
    height: 30px;
    display: block;
    filter: drop-shadow(0 0 12px rgba(255,255,255,.08));
  }

  .mobile-social-orbit__node::before {
    content: "";
    position: absolute;
    inset: -9px;
    border-radius: 24px;
    border: 1px solid rgba(244,138,63,.16);
    background: rgba(244,138,63,.03);
    opacity: .0;
  }

  .mobile-social-orbit__node--1 { --node-rotation: 198deg; transform: translate(-50%, -50%) rotate(198deg) translateX(205px) rotate(-198deg); }
  .mobile-social-orbit__node--2 { --node-rotation: 224deg; transform: translate(-50%, -50%) rotate(224deg) translateX(205px) rotate(-224deg); }
  .mobile-social-orbit__node--3 { --node-rotation: 250deg; transform: translate(-50%, -50%) rotate(250deg) translateX(205px) rotate(-250deg); }
  .mobile-social-orbit__node--4 { --node-rotation: 276deg; transform: translate(-50%, -50%) rotate(276deg) translateX(205px) rotate(-276deg); }

  .mobile-social-orbit__active {
    position: absolute;
    left: 0;
    top: 94px;
    width: 100%;
    min-height: 230px;
    padding-left: 34px;
    opacity: 1;
    transform: translateY(0);
  }

  .mobile-social-orbit__active-content {
    animation: mobileSocialInfoFadeIn .42s ease both;
  }

  .mobile-social-orbit__active-content:not(.is-fading-in) {
    animation: none;
  }

  .mobile-social-orbit__line {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 20px;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--brand) 14%, var(--brand) 82%, transparent);
  }

  .mobile-social-orbit__line::before {
    content: "";
    position: absolute;
    top: 14px;
    left: 50%;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: var(--brand);
    box-shadow: 0 0 18px rgba(244,138,63,.55);
  }

  .mobile-social-orbit__network {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    color: var(--brand);
    text-decoration: none;
    font-size: 1.08rem;
    letter-spacing: 0;
    text-transform: lowercase;
  }

  .mobile-social-orbit__network-arrow {
    font-size: 1.26rem;
    line-height: 1;
  }

  .mobile-social-orbit__handle {
    display: block;
    width: max-content;
    max-width: 100%;
    margin-top: 12px;
    color: var(--muted);
    font-size: .95rem;
    letter-spacing: 0;
    text-decoration: none;
  }

  .mobile-social-orbit__handle:hover {
    color: var(--text);
  }

  .mobile-social-orbit__metric-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-top: 34px;
  }

  .mobile-social-orbit__metric strong {
    display: block;
    color: var(--text);
    font-size: clamp(4rem, 22vw, 6.8rem);
    line-height: .82;
    font-weight: 300;
    letter-spacing: 0;
  }

  .mobile-social-orbit__metric span {
    display: block;
    margin-top: 14px;
    color: var(--brand);
    font-size: 1.04rem;
    letter-spacing: 0;
  }

  .mobile-social-orbit__avatar {
    width: 96px;
    height: 96px;
    object-fit: cover;
    border-radius: 999px;
    border: 1px solid rgba(244,138,63,.72);
    transform: translateY(-7px);
    filter: none;
    box-shadow:
      0 18px 42px rgba(0,0,0,.30),
      0 0 18px rgba(244,138,63,.16);
  }

  .mobile-social-modal {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: grid;
    place-items: end center;
    padding: 16px;
  }

  .mobile-social-modal[hidden] {
    display: none;
  }

  .mobile-social-modal__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    padding: 0;
    background: rgba(0,0,0,.62);
    backdrop-filter: blur(18px) saturate(1.35);
    -webkit-backdrop-filter: blur(18px) saturate(1.35);
    opacity: 0;
    transition: opacity .26s ease;
  }

  .mobile-social-modal__card {
    position: relative;
    z-index: 1;
    width: min(100%, 520px);
    max-height: 78dvh;
    overflow: auto;
    border-radius: 30px;
    border: 1px solid rgba(244,138,63,.32);
    background:
      radial-gradient(circle at 18% 0%, rgba(255,255,255,.10), transparent 32%),
      rgba(8,9,13,.97);
    backdrop-filter: blur(24px) saturate(1.5);
    -webkit-backdrop-filter: blur(24px) saturate(1.5);
    padding: 24px 18px 18px;
    box-shadow: 0 34px 86px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08);
    transform: translateY(18px);
    opacity: 0;
    transition: opacity .26s ease, transform .26s ease;
  }

  .mobile-social-modal.is-open .mobile-social-modal__backdrop,
  .mobile-social-modal.is-open .mobile-social-modal__card {
    opacity: 1;
    transform: translateY(0);
  }

  .mobile-social-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1px solid var(--stroke);
    background: var(--nav-bg-scrolled);
    color: var(--text);
    font-size: 1.35rem;
  }

  .mobile-social-modal__header {
    display: grid;
    gap: 8px;
    margin: 2px 48px 18px 4px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(244,138,63,.18);
  }

  .mobile-social-modal__eyebrow {
    display: block;
    color: var(--brand);
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: .68rem;
    font-weight: 800;
    margin: 0;
  }

  .mobile-social-modal__card h3 {
    margin: 0;
    color: var(--text);
    font-size: 1.62rem;
    letter-spacing: 0;
    line-height: 1;
  }

  .mobile-social-modal__list {
    display: grid;
    gap: 10px;
  }

  .mobile-social-modal__item {
    display: grid;
    grid-template-columns: 42px 1fr auto 18px;
    align-items: center;
    gap: 12px;
    min-height: 74px;
    padding: 12px;
    border-radius: 20px;
    border: 1px solid rgba(244,138,63,.16);
    background: rgba(255,255,255,.035);
    text-decoration: none;
    color: var(--text);
  }

  .mobile-social-modal__icon {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    background: rgba(244,138,63,.10);
    color: var(--brand);
  }

  .mobile-social-modal__icon svg {
    width: 22px;
    height: 22px;
  }

  .mobile-social-modal__body,
  .mobile-social-modal__metric {
    display: grid;
    gap: 3px;
  }

  .mobile-social-modal__body strong,
  .mobile-social-modal__metric strong {
    font-size: .96rem;
    letter-spacing: 0;
    text-transform: lowercase;
  }

  .mobile-social-modal__body small,
  .mobile-social-modal__metric small {
    color: var(--muted);
    font-size: .74rem;
  }

  .mobile-social-modal__metric {
    text-align: right;
  }

  .mobile-social-modal__arrow {
    color: var(--brand);
  }

  body.has-mobile-social-modal {
    overflow: hidden;
  }

  body.has-mobile-social-modal .social--mobile-orbit-ready .social__copy {
    z-index: 1 !important;
  }

  body.has-mobile-social-modal .mobile-social-orbit {
    z-index: 100002 !important;
  }

  @keyframes mobileSocialWheelSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(-360deg); }
  }

  @keyframes mobileSocialInfoFadeIn {
    from { opacity: .18; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .mobile-social-orbit__wheel,
    .mobile-social-orbit__active-content {
      animation: none !important;
    }
  }
}

@media (min-width: 901px) {
  .mobile-social-orbit {
    display: none !important;
  }
}


/* ===== styles/mobile-social-orbit-light.css ===== */

/* ===== Mobile social orbit light theme ===== */
@media (max-width: 900px) {
  :root[data-theme="light"] .social--mobile-orbit-ready::before {
    background:
      radial-gradient(circle at 96% 48%, rgba(216,109,36,.18), transparent 27%),
      radial-gradient(circle at 12% 0%, rgba(216,109,36,.10), transparent 42%),
      linear-gradient(180deg, rgba(252,246,238,0) 0%, rgba(251,244,235,.18) 10%, rgba(249,239,225,.56) 24%, rgba(248,244,238,.96) 50%, rgba(244,238,228,.98) 100%);
  }

  :root[data-theme="light"] .social--mobile-orbit-ready::after {
    background:
      linear-gradient(90deg, rgba(255,255,255,.30), transparent 48%, rgba(216,109,36,.08)),
      repeating-linear-gradient(90deg, rgba(90,54,28,.055) 0 1px, transparent 1px 78px);
    opacity: .58;
    mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
  }

  :root[data-theme="light"] .social--mobile-orbit-ready .social__copy p {
    color: color-mix(in srgb, var(--text) 66%, #7a6455);
  }

  :root[data-theme="light"] .social--mobile-orbit-ready .social__cta {
    color: var(--text) !important;
    background:
      linear-gradient(135deg, rgba(255,255,255,.58), rgba(255,255,255,.26)),
      rgba(255,255,255,.34) !important;
    border-color: rgba(216,109,36,.42) !important;
    box-shadow:
      0 18px 46px rgba(80,48,22,.10),
      inset 0 1px 0 rgba(255,255,255,.72),
      0 0 28px rgba(216,109,36,.10) !important;
    backdrop-filter: blur(18px) saturate(1.35);
    -webkit-backdrop-filter: blur(18px) saturate(1.35);
  }

  :root[data-theme="light"] .mobile-social-orbit__wheel {
    filter: drop-shadow(0 0 24px rgba(216,109,36,.16));
  }

  :root[data-theme="light"] .mobile-social-orbit__ring {
    border-color: rgba(216,109,36,.28);
    box-shadow:
      inset 0 0 24px rgba(216,109,36,.07),
      0 0 28px rgba(216,109,36,.08);
  }

  :root[data-theme="light"] .mobile-social-orbit__ring--inner {
    border-color: rgba(216,109,36,.52);
    box-shadow:
      inset 0 0 34px rgba(216,109,36,.10),
      0 0 34px rgba(216,109,36,.14);
  }

  :root[data-theme="light"] .mobile-social-orbit__planet {
    background:
      radial-gradient(circle at 32% 28%, rgba(255,255,255,.62), transparent 22%),
      radial-gradient(circle at 50% 50%, rgba(216,109,36,.30), rgba(255,226,194,.28) 42%, rgba(248,239,227,.92) 70%);
    border-color: rgba(216,109,36,.30);
    box-shadow:
      inset 0 0 38px rgba(216,109,36,.10),
      0 0 38px rgba(216,109,36,.16);
  }

  :root[data-theme="light"] .mobile-social-orbit__node {
    color: color-mix(in srgb, var(--text) 88%, #000);
  }

  :root[data-theme="light"] .mobile-social-orbit__node svg {
    filter: drop-shadow(0 4px 12px rgba(80,48,22,.12));
  }

  :root[data-theme="light"] .mobile-social-orbit__node::before {
    border-color: rgba(216,109,36,.18);
    background: rgba(255,255,255,.10);
  }

  :root[data-theme="light"] .mobile-social-orbit__line {
    background: linear-gradient(180deg, transparent, var(--brand) 14%, var(--brand) 82%, transparent);
  }

  :root[data-theme="light"] .mobile-social-orbit__line::before {
    background: var(--brand);
    box-shadow: 0 0 16px rgba(216,109,36,.36);
  }

  :root[data-theme="light"] .mobile-social-orbit__handle {
    color: color-mix(in srgb, var(--text) 58%, #8a6f5b);
  }

  :root[data-theme="light"] .mobile-social-orbit__handle:hover {
    color: var(--text);
  }

  :root[data-theme="light"] .mobile-social-orbit__metric strong {
    color: var(--text);
    text-shadow: 0 10px 30px rgba(80,48,22,.08);
  }

  :root[data-theme="light"] .mobile-social-orbit__avatar {
    border-color: rgba(216,109,36,.58);
    box-shadow:
      0 18px 36px rgba(80,48,22,.14),
      0 0 18px rgba(216,109,36,.14),
      inset 0 1px 0 rgba(255,255,255,.42);
  }

  :root[data-theme="light"] .mobile-social-modal__backdrop {
    background: rgba(255,248,240,.60);
    backdrop-filter: blur(18px) saturate(1.25);
    -webkit-backdrop-filter: blur(18px) saturate(1.25);
  }

  :root[data-theme="light"] .mobile-social-modal__card {
    border-color: rgba(216,109,36,.26);
    background:
      radial-gradient(circle at 18% 0%, rgba(255,255,255,.74), transparent 34%),
      rgba(255,250,243,.97);
    box-shadow:
      0 34px 86px rgba(80,48,22,.18),
      inset 0 1px 0 rgba(255,255,255,.70);
  }

  :root[data-theme="light"] .mobile-social-modal__close {
    background: color-mix(in srgb, var(--nav-bg-scrolled) 84%, rgba(255,255,255,.36));
    color: var(--text);
    border-color: rgba(216,109,36,.18);
  }

  :root[data-theme="light"] .mobile-social-modal__item {
    border-color: rgba(216,109,36,.16);
    background: rgba(255,255,255,.42);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.48);
  }

  :root[data-theme="light"] .mobile-social-modal__icon {
    background: rgba(216,109,36,.10);
    color: var(--brand);
  }

  :root[data-theme="light"] .mobile-social-modal__body small,
  :root[data-theme="light"] .mobile-social-modal__metric small {
    color: color-mix(in srgb, var(--text) 58%, #8a6f5b);
  }
}


/* ===== styles/about-mobile-type-match.css ===== */

/* ===== About mobile typography aligned with social orbit ===== */
@media (max-width: 900px) {
  .about-lab__title {
    font-size: clamp(2.55rem, 13vw, 4.6rem) !important;
    line-height: .98 !important;
    letter-spacing: 0;
    width: min-content !important;
    max-width: calc(100% - min(35vw, 150px)) !important;
    white-space: normal !important;
    text-wrap: balance !important;
  }

  .about-lab__title [data-about-i18n="titleBefore"],
  .about-lab__title strong,
  .about-lab__title [data-about-i18n="titleLeo"] {
    display: inline !important;
    white-space: normal !important;
  }

  .about-lab__body p {
    max-width: 230px;
    font-size: .98rem !important;
    line-height: 1.78 !important;
  }

  .about-lab__body p:first-child {
    font-size: .98rem !important;
    line-height: 1.78 !important;
  }
}


/* ===== styles/mobile-social-background-fix.css ===== */

/* ===== Mobile continuous background between about and social ===== */
@media (max-width: 900px) {
  .social--mobile-orbit-ready {
    background: transparent !important;
  }

  .social--mobile-orbit-ready::before {
    top: -220px !important;
    bottom: 0 !important;
    height: auto !important;
    background:
      radial-gradient(circle at 96% 52%, rgba(244,138,63,.22), transparent 25%),
      radial-gradient(circle at 10% 0%, rgba(244,138,63,.08), transparent 46%),
      linear-gradient(180deg,
        rgba(25,13,9,0) 0%,
        rgba(25,13,9,0) 24%,
        rgba(30,17,12,.08) 34%,
        rgba(22,13,11,.34) 48%,
        rgba(6,7,10,.88) 70%,
        rgba(8,9,13,.98) 100%) !important;
  }

  .social--mobile-orbit-ready::after {
    top: -220px !important;
    bottom: 0 !important;
    height: auto !important;
    mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 52%, #000 100%) !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 52%, #000 100%) !important;
  }

  :root[data-theme="light"] .social--mobile-orbit-ready::before {
    background:
      radial-gradient(circle at 96% 52%, rgba(216,109,36,.18), transparent 27%),
      radial-gradient(circle at 12% 0%, rgba(216,109,36,.08), transparent 46%),
      linear-gradient(180deg,
        rgba(252,246,238,0) 0%,
        rgba(252,246,238,0) 24%,
        rgba(251,244,235,.08) 34%,
        rgba(249,239,225,.34) 48%,
        rgba(248,244,238,.88) 70%,
        rgba(244,238,228,.98) 100%) !important;
  }

  :root[data-theme="light"] .social--mobile-orbit-ready::after {
    mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 52%, #000 100%) !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 52%, #000 100%) !important;
  }
}


/* ===== styles/mobile-social-cleanup.css ===== */

/* ===== Mobile social final cleanup ===== */
@media (max-width: 900px) {
  .sections-wrapper {
    isolation: isolate;
    background:
      radial-gradient(circle at 88% 48%, rgba(244,138,63,.12), transparent 28%),
      radial-gradient(circle at 16% 76%, rgba(244,138,63,.06), transparent 34%),
      linear-gradient(180deg,
        rgba(34,18,11,.56) 0%,
        rgba(27,15,12,.52) 18%,
        rgba(18,12,12,.68) 42%,
        rgba(10,9,12,.90) 68%,
        rgba(8,9,13,.98) 100%) !important;
  }

  :root[data-theme="light"] .sections-wrapper {
    background:
      radial-gradient(circle at 88% 48%, rgba(216,109,36,.11), transparent 29%),
      radial-gradient(circle at 16% 76%, rgba(216,109,36,.06), transparent 34%),
      linear-gradient(180deg,
        rgba(249,239,225,.70) 0%,
        rgba(248,244,238,.78) 30%,
        rgba(246,240,232,.92) 64%,
        rgba(244,238,228,.98) 100%) !important;
  }

  .about-lab,
  .social--mobile-orbit-ready,
  .sections-wrapper > .inner-shell {
    background: transparent !important;
  }

  .about-lab {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .social--mobile-orbit-ready {
    margin-top: -36px !important;
    padding-top: 94px !important;
    padding-bottom: 68px !important;
  }

  .social--mobile-orbit-ready::before {
    top: -180px !important;
    bottom: 0 !important;
    height: auto !important;
    background:
      radial-gradient(circle at 96% 54%, rgba(244,138,63,.22), transparent 26%),
      radial-gradient(circle at 12% 8%, rgba(244,138,63,.045), transparent 42%) !important;
    mask-image: linear-gradient(180deg, transparent 0%, #000 44%, #000 100%) !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 44%, #000 100%) !important;
  }

  .social--mobile-orbit-ready::after {
    top: -180px !important;
    bottom: 0 !important;
    height: auto !important;
    opacity: .36 !important;
    mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 62%, #000 100%) !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 30%, #000 62%, #000 100%) !important;
  }

  :root[data-theme="light"] .social--mobile-orbit-ready::before {
    background:
      radial-gradient(circle at 96% 54%, rgba(216,109,36,.18), transparent 27%),
      radial-gradient(circle at 12% 8%, rgba(216,109,36,.05), transparent 42%) !important;
  }

  .mobile-social-orbit__wheel {
    animation: none !important;
    transform: none !important;
  }

  .mobile-social-orbit__node {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    animation: mobileSocialNodeArc 18.4s linear infinite !important;
    will-change: transform, opacity;
  }

  .mobile-social-orbit.is-paused-by-user .mobile-social-orbit__node {
    animation-play-state: paused !important;
  }

  .mobile-social-orbit__node span {
    transform: none !important;
  }

  .mobile-social-orbit__node--1 { animation-delay: 0s !important; }
  .mobile-social-orbit__node--2 { animation-delay: -4.6s !important; }
  .mobile-social-orbit__node--3 { animation-delay: -9.2s !important; }
  .mobile-social-orbit__node--4 { animation-delay: -13.8s !important; }

  .mobile-social-orbit__active {
    overflow: visible !important;
    padding-left: 0 !important;
    min-height: 250px !important;
    width: calc(100% - 24px) !important;
  }

  .mobile-social-orbit__active-content {
    position: relative;
    min-height: 250px;
    padding-left: 34px;
    opacity: 1;
    transform: none;
    animation: none !important;
  }

  .mobile-social-orbit__active.is-transitioning .mobile-social-orbit__active-content {
    opacity: .62;
    transform: translateY(2px);
    transition: opacity .18s ease, transform .18s ease;
  }

  .mobile-social-orbit__active.is-fading-in .mobile-social-orbit__active-content {
    animation: mobileSocialInfoFadeInClean .82s cubic-bezier(.22,.61,.36,1) both !important;
  }

  .mobile-social-orbit__active-content .mobile-social-orbit__line {
    left: 0;
  }

  .mobile-social-orbit__network,
  .mobile-social-orbit__handle {
    max-width: min(250px, calc(100vw - 168px)) !important;
  }

  .mobile-social-orbit__handle {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-social-orbit__metric-row {
    position: relative;
    display: block !important;
    min-height: 140px;
    margin-top: 30px !important;
  }

  .mobile-social-orbit__metric {
    width: calc(100vw - 210px);
    min-width: 0;
  }

  .mobile-social-orbit__metric strong {
    font-size: clamp(3.85rem, 19vw, 5.9rem) !important;
    letter-spacing: 0;
    max-width: 100%;
    white-space: nowrap;
  }

  .mobile-social-orbit__avatar {
    position: absolute;
    right: 0;
    bottom: 30px;
    width: 92px !important;
    height: 92px !important;
    transform: none !important;
  }

  @keyframes mobileSocialNodeArc {
    0% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(300deg) translateX(205px) rotate(-300deg);
    }
    8% {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(286deg) translateX(205px) rotate(-286deg);
    }
    72% {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(198deg) translateX(205px) rotate(-198deg);
    }
    86% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(182deg) translateX(205px) rotate(-182deg);
    }
    100% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(300deg) translateX(205px) rotate(-300deg);
    }
  }

  @keyframes mobileSocialInfoFadeInClean {
    from { opacity: .35; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .mobile-social-orbit__node,
    .mobile-social-orbit__active.is-fading-in .mobile-social-orbit__active-content {
      animation: none !important;
    }
  }
}


/* ===== styles/mobile-social-orbit-visibility-tune.css ===== */

/* ===== Mobile social orbit visibility tuning ===== */
@media (max-width: 900px) {
  .mobile-social-orbit__wheel-wrap {
    top: -276px !important;
    right: -342px !important;
    height: 500px !important;
  }

  .mobile-social-orbit__active {
    top: 52px !important;
  }

  .mobile-social-orbit__line {
    top: 4px !important;
    bottom: 72px !important;
    opacity: .82;
  }

  .mobile-social-orbit__line::before {
    top: 12px !important;
    width: 12px !important;
    height: 12px !important;
  }

  .mobile-social-orbit__metric-row {
    margin-top: 26px !important;
  }

  .mobile-social-orbit__node {
    animation-name: mobileSocialNodeArcCompact !important;
    animation-duration: 22s !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
  }

  .mobile-social-orbit__node--1 { animation-delay: 0s !important; }
  .mobile-social-orbit__node--2 { animation-delay: -5.5s !important; }
  .mobile-social-orbit__node--3 { animation-delay: -11s !important; }
  .mobile-social-orbit__node--4 { animation-delay: -16.5s !important; }

  @keyframes mobileSocialNodeArcCompact {
    0% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(292deg) translateX(205px) rotate(-292deg);
    }
    5% {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(282deg) translateX(205px) rotate(-282deg);
    }
    84% {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(198deg) translateX(205px) rotate(-198deg);
    }
    94% {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(186deg) translateX(205px) rotate(-186deg);
    }
    97% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(182deg) translateX(205px) rotate(-182deg);
    }
    100% {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(292deg) translateX(205px) rotate(-292deg);
    }
  }
}


/* ===== styles/mobile-social-orbit-path-fix.css ===== */

@media (max-width: 900px) {
  .mobile-social-orbit__wheel-wrap {
    top: -286px !important;
    right: -352px !important;
    height: 560px !important;
  }

  .mobile-social-orbit__node {
    animation-name: mobileSocialNodeArcExtended !important;
    animation-duration: 27.2s !important;
  }

  .mobile-social-orbit__node--1 { animation-delay: 0s !important; }
  .mobile-social-orbit__node--2 { animation-delay: -6.8s !important; }
  .mobile-social-orbit__node--3 { animation-delay: -13.6s !important; }
  .mobile-social-orbit__node--4 { animation-delay: -20.4s !important; }

  .mobile-social-orbit:has(.mobile-social-orbit__node:hover) .mobile-social-orbit__node,
  .mobile-social-orbit:focus-within .mobile-social-orbit__node {
    animation-play-state: paused !important;
  }

  @keyframes mobileSocialNodeArcExtended {
    0% {
      opacity: 0;
      pointer-events: none;
      transform: translate3d(-50%, -50%, 0) rotate(252deg) translateX(205px) rotate(-252deg);
    }
    4% {
      opacity: 0;
      pointer-events: none;
      transform: translate3d(-50%, -50%, 0) rotate(249deg) translateX(205px) rotate(-249deg);
    }
    6% {
      opacity: 1;
      pointer-events: auto;
      transform: translate3d(-50%, -50%, 0) rotate(248deg) translateX(205px) rotate(-248deg);
    }
    88% {
      opacity: 1;
      pointer-events: auto;
      transform: translate3d(-50%, -50%, 0) rotate(198deg) translateX(205px) rotate(-198deg);
    }
    96% {
      opacity: 1;
      pointer-events: auto;
      transform: translate3d(-50%, -50%, 0) rotate(186deg) translateX(205px) rotate(-186deg);
    }
    98% {
      opacity: 0;
      pointer-events: none;
      transform: translate3d(-50%, -50%, 0) rotate(182deg) translateX(205px) rotate(-182deg);
    }
    100% {
      opacity: 0;
      pointer-events: none;
      transform: translate3d(-50%, -50%, 0) rotate(252deg) translateX(205px) rotate(-252deg);
    }
  }
}


/* ===== styles/about-mobile-card-inline.css ===== */

@media (max-width: 900px) {
  .about-lab {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    padding: 54px 0 28px !important;
  }

  .about-lab__inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  .about-lab__copy {
    display: contents !important;
    min-height: 0 !important;
  }

  .about-lab__eyebrow,
  .about-lab__title,
  .about-lab__body,
  .about-lab__badge {
    margin-left: 52px !important;
    margin-right: 52px !important;
    position: relative !important;
    z-index: 4 !important;
  }

  .about-lab__eyebrow {
    order: 1;
    max-width: none !important;
    margin-bottom: 20px !important;
  }

  .about-lab__title {
    order: 2;
    width: min-content !important;
    max-width: calc(100vw - 104px) !important;
    margin-bottom: 18px !important;
    font-size: clamp(3.45rem, 15vw, 5.65rem) !important;
    line-height: .89 !important;
    letter-spacing: 0;
    white-space: normal !important;
  }

  .about-lab__title span,
  .about-lab__title strong {
    display: block !important;
    white-space: normal !important;
  }

  .about-lab__visual {
    order: 3;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: min(82vw, 360px) !important;
    min-height: 0 !important;
    height: clamp(176px, 45vw, 228px) !important;
    margin: 4px -18px 30px auto !important;
    z-index: 2 !important;
    transform: rotate(2.5deg) !important;
    transform-origin: center !important;
    pointer-events: none !important;
  }

  .about-lab__media-shell {
    height: 100% !important;
    min-height: 0 !important;
    border-radius: 30px !important;
    overflow: hidden !important;
    background: color-mix(in srgb, var(--brand) 7%, rgba(255,255,255,.035)) !important;
    box-shadow: 0 22px 58px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }

  .about-lab__bg {
    opacity: .64 !important;
    transform: scale(1.02) !important;
  }

  .about-lab__gif,
  .about-lab__gif--dark,
  .about-lab__gif--light {
    object-fit: contain !important;
    transform: scale(.74) !important;
    transform-origin: center center !important;
  }

  .about-lab__body {
    order: 4;
    display: grid !important;
    gap: 18px !important;
    max-width: none !important;
    clear: none !important;
  }

  .about-lab__body p {
    font-size: 1rem !important;
    line-height: 1.72 !important;
    text-align: left !important;
    letter-spacing: 0;
  }

  .about-lab__body p:first-child {
    font-size: 1.12rem !important;
    line-height: 1.35 !important;
  }

  .about-lab__badge {
    order: 5;
    width: max-content !important;
    max-width: calc(100vw - 104px) !important;
    margin-top: 28px !important;
  }

  :root[data-theme="light"] .about-lab__media-shell {
    background: linear-gradient(135deg, rgba(216,109,36,.12), rgba(255,255,255,.38)), rgba(255,255,255,.50) !important;
    box-shadow: 0 22px 56px rgba(80,48,22,.14), inset 0 1px 0 rgba(255,255,255,.72) !important;
  }
}


/* ===== styles/about-section-polish.css ===== */

/* ===== Polished about section: mobile + desktop ===== */
.about-lab--polished {
  position: relative;
}

.about-lab--polished .about-lab__media-shell {
  position: relative;
  border-radius: clamp(28px, 4vw, 44px);
  overflow: hidden;
  isolation: isolate;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  border-color: rgba(244, 138, 63, .42);
  background: rgba(15, 10, 9, .72);
  box-shadow:
    0 28px 74px rgba(0,0,0,.30),
    0 0 0 1px rgba(244,138,63,.12),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.about-lab--polished .about-lab__media-shell::before,
.about-lab--polished .about-lab__media-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 6;
}

.about-lab--polished .about-lab__media-shell::before {
  border: 1px solid rgba(244,138,63,.52);
  box-shadow:
    0 0 30px rgba(244,138,63,.18),
    inset 0 0 34px rgba(244,138,63,.08);
}

.about-lab--polished .about-lab__media-shell::after {
  width: 72px;
  height: 72px;
  inset: auto auto 10% 8%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255,184,95,.95), rgba(244,138,63,.34) 34%, transparent 70%);
  filter: blur(8px);
  mix-blend-mode: screen;
  animation: aboutBorderSpark 6.8s linear infinite;
}

.about-lab--polished .about-lab__bg,
.about-lab--polished .about-lab__halo {
  display: none !important;
}

.about-lab--polished .about-lab__gif,
.about-lab--polished video.about-lab__gif {
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  object-fit: cover;
  object-position: center center;
  border-radius: inherit;
  clip-path: inset(0 round clamp(28px, 4vw, 44px));
  display: block;
  transform: translateZ(0) scale(1.01) !important;
  filter: none;
  background: transparent;
}

.about-lab__name-row {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.about-lab__name-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--stroke));
  border-radius: 999px;
  color: var(--muted);
  background: color-mix(in srgb, var(--brand) 7%, rgba(255,255,255,.035));
  font-size: .72rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
  text-transform: lowercase;
  vertical-align: middle;
}

.about-lab__areas {
  margin-top: 30px;
  padding: 22px;
  border: 1px solid rgba(244,138,63,.20);
  border-radius: 26px;
  background: rgba(14, 10, 9, .54);
  box-shadow:
    0 18px 54px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(12px) saturate(1.2);
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
}

.about-lab__areas-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  color: var(--brand);
  font-size: .78rem;
  letter-spacing: 0;
  text-transform: uppercase;
  font-weight: 800;
}

.about-lab__areas-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.about-lab__area-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 9px 16px;
  border: 1px solid rgba(244,138,63,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: var(--text);
  font-size: .98rem;
  letter-spacing: 0;
}

.about-lab__area-icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  color: var(--text);
}

.about-lab__area-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

@keyframes aboutBorderSpark {
  0% { left: 7%; bottom: 9%; opacity: .15; transform: scale(.82); }
  12% { left: 12%; bottom: 3%; opacity: .95; transform: scale(1); }
  34% { left: 70%; bottom: 3%; opacity: .65; }
  50% { left: 94%; bottom: 28%; opacity: .95; }
  70% { left: 94%; bottom: 82%; opacity: .55; }
  88% { left: 24%; bottom: 94%; opacity: .85; }
  100% { left: 7%; bottom: 9%; opacity: .15; transform: scale(.82); }
}

@media (min-width: 901px) {
  .about-lab--polished {
    padding-top: 30px;
  }

  .about-lab--polished .about-lab__inner {
    grid-template-columns: minmax(0, .9fr) minmax(340px, .72fr);
    align-items: start;
  }

  .about-lab--polished .about-lab__visual {
    grid-column: 2;
    grid-row: 1;
    min-height: clamp(360px, 42vw, 560px);
    transform: rotate(1.4deg);
  }

  .about-lab--polished .about-lab__copy {
    grid-column: 1;
    grid-row: 1;
    padding-top: 20px;
  }

  .about-lab--polished .about-lab__title {
    width: min-content;
    max-width: 12ch;
    white-space: normal;
    font-size: clamp(4.4rem, 6.8vw, 7rem);
    line-height: .86;
  }

  .about-lab--polished .about-lab__title span,
  .about-lab--polished .about-lab__title strong {
    display: block;
    white-space: normal;
  }

  .about-lab--polished .about-lab__title .about-lab__name-row {
    display: inline-flex;
    align-items: center;
  }

  .about-lab--polished .about-lab__title .about-lab__name-row strong {
    display: inline;
  }

  .about-lab--polished .about-lab__body {
    max-width: 64ch;
  }
}

@media (max-width: 900px) {
  .about-lab--polished {
    padding-top: 54px !important;
  }

  .about-lab--polished .about-lab__eyebrow,
  .about-lab--polished .about-lab__title,
  .about-lab--polished .about-lab__body,
  .about-lab--polished .about-lab__areas,
  .about-lab--polished .about-lab__badge {
    margin-left: 52px !important;
    margin-right: 52px !important;
  }

  .about-lab--polished .about-lab__title {
    font-size: clamp(3.55rem, 14.9vw, 5.55rem) !important;
    line-height: .86 !important;
    margin-bottom: 22px !important;
  }

  .about-lab--polished .about-lab__name-row {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .about-lab--polished .about-lab__name-badge {
    min-height: 26px;
    padding: 4px 9px;
    font-size: .64rem;
  }

  .about-lab--polished .about-lab__visual {
    order: 4;
    width: calc(100vw - 104px) !important;
    height: min(108vw, 420px) !important;
    margin: 4px 52px 34px !important;
    transform: none !important;
  }

  .about-lab--polished .about-lab__media-shell {
    border-radius: 34px !important;
  }

  .about-lab--polished .about-lab__gif,
  .about-lab--polished video.about-lab__gif {
    clip-path: inset(0 round 34px);
  }

  .about-lab--polished .about-lab__body {
    order: 5;
    gap: 22px !important;
  }

  .about-lab--polished .about-lab__body p {
    font-size: 1.02rem !important;
    line-height: 1.62 !important;
  }

  .about-lab__areas {
    order: 6;
    margin-top: 30px !important;
    padding: 18px !important;
    border-radius: 22px;
  }

  .about-lab__areas-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
  }

  .about-lab__area-pill {
    justify-content: center;
    padding: 9px 14px;
    font-size: .92rem;
  }

  .about-lab--polished .about-lab__badge {
    order: 7;
  }
}

:root[data-theme="light"] .about-lab--polished .about-lab__media-shell {
  background: rgba(255, 249, 241, .70);
  border-color: rgba(216,109,36,.32);
  box-shadow:
    0 26px 70px rgba(80,48,22,.12),
    0 0 0 1px rgba(216,109,36,.08),
    inset 0 1px 0 rgba(255,255,255,.72);
}

:root[data-theme="light"] .about-lab__areas {
  background: rgba(255,255,255,.56);
  border-color: rgba(216,109,36,.20);
  box-shadow: 0 18px 54px rgba(80,48,22,.10), inset 0 1px 0 rgba(255,255,255,.72);
}


/* ===== styles/about-section-mockup-correction.css ===== */

@media (max-width: 900px) {
  .about-lab--polished {
    padding-top: 54px !important;
  }

  .about-lab--polished .about-lab__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(128px, 44vw) !important;
    column-gap: 16px !important;
    row-gap: 0 !important;
    align-items: start !important;
    padding-inline: 52px !important;
  }

  .about-lab--polished .about-lab__copy {
    display: contents !important;
  }

  .about-lab--polished .about-lab__eyebrow,
  .about-lab--polished .about-lab__title,
  .about-lab--polished .about-lab__subtitle,
  .about-lab--polished .about-lab__body,
  .about-lab--polished .about-lab__areas,
  .about-lab--polished .about-lab__badge {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .about-lab--polished .about-lab__eyebrow {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    margin-bottom: 24px !important;
  }

  .about-lab--polished .about-lab__title {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: min-content !important;
    max-width: 7.5ch !important;
    margin: 0 0 14px !important;
    font-size: clamp(3.8rem, 15.6vw, 5.25rem) !important;
    line-height: .86 !important;
    letter-spacing: 0;
    white-space: normal !important;
  }

  .about-lab--polished .about-lab__title span,
  .about-lab--polished .about-lab__title strong {
    display: block !important;
    white-space: normal !important;
  }

  .about-lab--polished .about-lab__subtitle {
    grid-column: 1 !important;
    grid-row: 3 !important;
    margin: 0 0 30px !important;
    max-width: 21ch !important;
    font-size: 1.02rem !important;
    line-height: 1.45 !important;
  }

  .about-lab--polished .about-lab__visual {
    grid-column: 2 !important;
    grid-row: 2 / 4 !important;
    align-self: start !important;
    justify-self: end !important;
    width: 44vw !important;
    max-width: 206px !important;
    min-height: 0 !important;
    height: clamp(230px, 58vw, 318px) !important;
    margin: 0 -8px 0 0 !important;
    transform: rotate(1.2deg) !important;
    z-index: 2 !important;
  }

  .about-lab--polished .about-lab__media-shell {
    border-radius: 30px !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  .about-lab--polished .about-lab__gif {
    object-fit: cover !important;
    object-position: center center !important;
    transform: none !important;
  }

  .about-lab--polished .about-lab__body {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    margin-top: 0 !important;
    gap: 22px !important;
  }

  .about-lab--polished .about-lab__body p {
    font-size: 1.02rem !important;
    line-height: 1.62 !important;
    max-width: 100% !important;
  }

  .about-lab--polished .about-lab__areas {
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
    margin-top: 30px !important;
  }

  .about-lab--polished .about-lab__badge {
    grid-column: 1 / -1 !important;
    grid-row: 6 !important;
    margin-top: 30px !important;
  }
}

@media (max-width: 390px) {
  .about-lab--polished .about-lab__inner {
    grid-template-columns: minmax(0, 1fr) minmax(116px, 40vw) !important;
    padding-inline: 34px !important;
  }

  .about-lab--polished .about-lab__title {
    font-size: clamp(3.15rem, 15vw, 4.4rem) !important;
  }

  .about-lab--polished .about-lab__visual {
    width: 40vw !important;
    height: clamp(208px, 54vw, 280px) !important;
  }

  .about-lab--polished .about-lab__areas-list {
    grid-template-columns: 1fr 1fr;
  }
}


/* ===== styles/mobile-social-active-polish.css ===== */

@media (max-width: 900px) {
  .mobile-social-orbit__network {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .mobile-social-orbit__active-icon {
    width: 18px !important;
    height: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--brand) !important;
    flex: 0 0 18px !important;
  }

  .mobile-social-orbit__active-icon svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
  }

  .mobile-social-orbit__metric-row {
    min-height: 136px !important;
  }

  .mobile-social-orbit__avatar {
    bottom: 56px !important;
  }
}


/* ===== styles/mobile-social-orbit-drag.css ===== */

@media (max-width: 900px) {
  .mobile-social-orbit__wheel-wrap,
  .mobile-social-orbit__wheel {
    pointer-events: auto;
    touch-action: none;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
  }

  .mobile-social-orbit.is-manual-orbit-control .mobile-social-orbit__wheel-wrap,
  .mobile-social-orbit.is-manual-orbit-control .mobile-social-orbit__wheel {
    cursor: grabbing;
  }

  .mobile-social-orbit.is-manual-orbit-control .mobile-social-orbit__node {
    animation: none !important;
    transition: opacity .16s linear;
    will-change: transform, opacity;
    transform: translate3d(0, 0, 0);
  }

  .mobile-social-orbit.is-orbit-coasting .mobile-social-orbit__node {
    transition: opacity .22s ease-out;
  }
}


/* ===== styles/mobile-social-orbit-selected-highlight.css ===== */

@media (max-width: 900px) {
  .mobile-social-orbit__node {
    border-radius: 28px !important;
  }

  .mobile-social-orbit__node::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 72px;
    height: 58px;
    border-radius: 18px;
    transform: translate(-50%, -50%) scale(.82) rotate(-10deg);
    background:
      radial-gradient(circle at 18% 82%, rgba(255,174,86,.72), transparent 30%),
      linear-gradient(135deg, rgba(244,138,63,.42), rgba(244,138,63,.10));
    border: 1px solid rgba(244,138,63,.62);
    box-shadow:
      0 0 24px rgba(244,138,63,.34),
      inset 0 1px 0 rgba(255,255,255,.16);
    opacity: 0;
    pointer-events: none;
    transition: opacity .42s ease, transform .42s ease;
  }

  .mobile-social-orbit__node.is-selected-social::before {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1) rotate(-10deg);
    will-change: opacity, transform;
    backface-visibility: hidden;
  }

  .mobile-social-orbit__node.is-selected-social span {
    position: relative;
    z-index: 2;
    filter: drop-shadow(0 0 10px rgba(255,255,255,.22));
  }

  .mobile-social-orbit.is-manual-orbit-control .mobile-social-orbit__node::before {
    transition-duration: .18s;
  }

  .mobile-social-orbit.is-manual-orbit-control .mobile-social-orbit__node.is-selected-social::before {
    opacity: 1 !important;
    transition-duration: .18s;
  }
}


/* ===== styles/mobile-about-social-divider-fix.css ===== */

@media (max-width: 900px) {
  .about-lab {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .about-lab__badge {
    margin-bottom: 30px !important;
  }

  .about-lab__divider {
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 42px !important;
    margin: 14px 0 8px !important;
    border: 0 !important;
    opacity: 1 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  .about-lab--polished .about-lab__divider {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .about-lab__divider::before,
  .about-lab__divider::after {
    content: none !important;
    display: none !important;
  }

  .social--mobile-orbit-ready {
    margin-top: 0 !important;
    padding-top: calc(var(--layout-gap-standard) + 10px) !important;
    padding-bottom: 74px !important;
    background: transparent !important;
  }

  .social--mobile-orbit-ready::before,
  .social--mobile-orbit-ready::after {
    top: -150px !important;
  }

  .social--mobile-orbit-ready + .section-divider {
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 34px !important;
    margin: 8px 0 18px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    overflow: hidden !important;
  }

  .social--mobile-orbit-ready + .section-divider::before,
  .social--mobile-orbit-ready + .section-divider::after {
    content: none !important;
    display: none !important;
  }

  .vip-band + .section-divider {
    display: block !important;
    width: 100% !important;
    height: 28px !important;
    margin: 14px 0 10px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    overflow: hidden !important;
  }

  .vip-band + .section-divider::before,
  .vip-band + .section-divider::after {
    content: none !important;
    display: none !important;
  }
}


/* ===== styles/about-mobile-request-fixes.css ===== */

@media (max-width: 900px) {
  .hero {
    min-height: min(760px, 86svh) !important;
  }

  .hero__copy {
    max-width: min(58vw, 228px) !important;
    margin-top: clamp(72px, 17svh, 112px) !important;
  }

  .hero h1 {
    max-width: 10.5ch !important;
  }

  .hero p {
    max-width: 22ch !important;
  }

  .hero__ctas {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 15px !important;
    width: min(38vw, 150px) !important;
  }

  .hero__ctas .button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;
    justify-content: center !important;
    padding-inline: 13px !important;
  }

  .hero-fan-cta {
    min-width: 0 !important;
    background: color-mix(in srgb, var(--bg) 68%, transparent) !important;
  }

  .hero__carousel {
    right: clamp(-108px, -23vw, -74px) !important;
    top: 42px !important;
  }

  .hero__guide {
    display: inline-flex !important;
    position: absolute !important;
    left: 26px !important;
    bottom: 30px !important;
    z-index: 11 !important;
    width: auto !important;
    max-width: calc(100vw - 52px) !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    border: 1px solid rgba(244, 138, 63, .22) !important;
    border-radius: 999px !important;
    background: rgba(8, 9, 13, .42) !important;
    color: rgba(241, 233, 226, .76) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18) !important;
    backdrop-filter: blur(12px) saturate(1.18) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.18) !important;
    letter-spacing: 0;
    white-space: nowrap !important;
    opacity: calc(.84 * var(--hero-guide-scroll-opacity, 1)) !important;
  }

  .hero-guide-text {
    white-space: nowrap !important;
  }

  :root[data-theme="light"] .hero__guide {
    background: rgba(255, 249, 241, .52) !important;
    border-color: rgba(216, 109, 36, .22) !important;
    color: rgba(72, 58, 47, .78) !important;
    box-shadow: 0 12px 28px rgba(80, 48, 22, .12) !important;
  }

  .about-lab--polished .about-lab__title {
    max-width: calc(100vw - 92px) !important;
    margin-bottom: 14px !important;
  }

  .about-lab--polished .about-lab__name-row {
    display: grid !important;
    grid-template-columns: minmax(0, max-content);
    justify-items: start;
    gap: 8px !important;
    transform: translateY(-2px);
  }

  .about-lab--polished .about-lab__name-badge {
    grid-row: 2;
    justify-self: start !important;
    width: fit-content !important;
    inline-size: max-content !important;
    max-width: min(40vw, 156px) !important;
    min-height: 22px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    font-size: clamp(.64rem, 2.65vw, .74rem) !important;
    line-height: 1 !important;
    letter-spacing: 0;
    white-space: nowrap !important;
    background: rgba(14, 10, 9, .56) !important;
    border-color: rgba(244, 138, 63, .42) !important;
    box-shadow:
      0 8px 22px rgba(0, 0, 0, .18),
      inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    backdrop-filter: blur(10px) saturate(1.12);
    -webkit-backdrop-filter: blur(10px) saturate(1.12);
    transform: translateY(-1px);
  }

  .about-lab--polished .about-lab__title .about-lab__name-badge {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    white-space: nowrap !important;
  }

  .about-lab--polished .about-lab__media-shell {
    overflow: hidden !important;
    border-radius: 30px !important;
    clip-path: inset(0 round 30px) !important;
    -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
    mask-image: radial-gradient(white, black) !important;
    isolation: isolate !important;
    transform: translateZ(0) !important;
  }

  .about-lab--polished .about-lab__gif,
  .about-lab--polished video.about-lab__gif {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: inherit !important;
    clip-path: inset(0 round 30px) !important;
    display: block !important;
    transform: translateZ(0) scale(1.015) !important;
    background: transparent !important;
  }

  .about-lab--polished .about-lab__subtitle {
    text-transform: lowercase !important;
  }

  .about-lab--polished .about-lab__badge {
    display: none !important;
  }

  .about-lab--polished .about-lab__areas {
    padding: 16px 14px !important;
  }

  .about-lab--polished .about-lab__areas-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    justify-content: space-between !important;
  }

  .about-lab--polished .about-lab__area-pill {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 38px !important;
    padding: 8px 7px !important;
    gap: 5px !important;
    font-size: clamp(.66rem, 2.55vw, .82rem) !important;
    letter-spacing: 0;
    justify-content: center !important;
    white-space: nowrap !important;
  }

  .about-lab--polished .about-lab__area-icon {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
  }
}

:root[data-theme="light"] .about-lab--polished .about-lab__media-shell {
  overflow: hidden !important;
  clip-path: inset(0 round 30px) !important;
}

:root[data-theme="light"] .about-lab--polished .about-lab__name-badge {
  color: #5d4635 !important;
  background: rgba(255, 249, 241, .74) !important;
  border-color: rgba(216, 109, 36, .34) !important;
  box-shadow:
    0 8px 20px rgba(80, 48, 22, .10),
    inset 0 1px 0 rgba(255, 255, 255, .78) !important;
}

:root[data-theme="light"] .about-lab--polished .about-lab__title .about-lab__name-badge {
  color: #5d4635 !important;
  background: rgba(255, 249, 241, .74) !important;
  border-color: rgba(216, 109, 36, .34) !important;
}

@media (max-width: 390px) {
  .about-lab--polished .about-lab__title {
    max-width: calc(100vw - 84px) !important;
  }

  .about-lab--polished .about-lab__name-badge {
    font-size: clamp(.62rem, 2.55vw, .7rem) !important;
    padding-inline: 8px !important;
  }

  .about-lab--polished .about-lab__area-pill {
    font-size: clamp(.61rem, 2.45vw, .75rem) !important;
    padding-inline: 5px !important;
    gap: 4px !important;
  }

  .about-lab--polished .about-lab__area-icon {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
  }
}

@media (max-width: 390px) {
  .hero__ctas {
    width: min(42vw, 144px) !important;
  }
}

.hero h1,
.about-lab__title {
  letter-spacing: 0;
  text-rendering: geometricPrecision;
}

.hero__slide .profile-pic,
.hero__asset-img,
.about-lab__bg,
.about-lab__gif {
  image-rendering: auto;
  backface-visibility: hidden;
}

:root[data-theme="light"] .hero__asset-img,
:root[data-theme="light"] .about-lab__bg {
  filter: none !important;
}


/* ===== styles/motion-policy.css ===== */

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }

  .hero-guide-arrow,
  .about-lab__wave,
  .hero__asset-img,
  .hero__slide,
  .site-preloader__logo,
  .site-preloader__mark {
    animation: none !important;
  }

  .mobile-social-orbit__node {
    animation: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .mobile-social-orbit__node--1 {
    transform: translate(-50%, -50%) rotate(248deg) translateX(205px) rotate(-248deg) !important;
  }

  .mobile-social-orbit__node--2 {
    transform: translate(-50%, -50%) rotate(226deg) translateX(205px) rotate(-226deg) !important;
  }

  .mobile-social-orbit__node--3 {
    transform: translate(-50%, -50%) rotate(204deg) translateX(205px) rotate(-204deg) !important;
  }

  .mobile-social-orbit__node--4 {
    transform: translate(-50%, -50%) rotate(182deg) translateX(205px) rotate(-182deg) !important;
  }
}