@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');

/* Premium public-site override. Loaded after landing.css for home and rules pages. */
body.landing {
  --bg: #070809;
  --bg-2: #13151a;
  --bg-3: #1b1e24;
  --bg-card: rgba(20, 22, 27, 0.80);
  --bg-card-hover: rgba(27, 30, 36, 0.93);
  --border: rgba(54, 232, 117, 0.16);
  --border-strong: rgba(54, 232, 117, 0.40);
  --text: #eef3f0;
  --text-mute: #a6b2ad;
  --text-dim: #6c7a74;
  --accent: #36e875;
  --accent-2: #9effbd;
  --accent-deep: #0fa94d;
  --accent-glow: rgba(54, 232, 117, 0.34);
  --green: #2fd96d;
  --ink: #060708;
  --radius: 8px;
  --radius-lg: 8px;
  --shadow-lg: 0 26px 70px -34px rgba(0, 0, 0, 0.92);
  --font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display: 'Bricolage Grotesque', 'Manrope', sans-serif;
  background:
    linear-gradient(180deg, rgba(7, 8, 6, 0.88), rgba(7, 8, 6, 0.98) 620px),
    url('/img/landing/hero-banner.webp') center top / cover,
    #070806;
  overflow-x: clip;
}

body.landing::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(91,242,143,0.06), transparent 18%, transparent 82%, rgba(100,242,154,0.05));
  opacity: 0.55;
}

body.landing::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,0.48), transparent 24%, transparent 76%, rgba(0,0,0,0.62)),
    linear-gradient(180deg, transparent 0, rgba(7,8,6,0.75) 58%, #070806 100%);
}

.topbar {
  background: rgba(7, 8, 6, 0.76);
  border-bottom: 1px solid rgba(91, 242, 143, 0.2);
  backdrop-filter: blur(12px) saturate(118%);
}

.topbar.is-scrolled { background: rgba(7, 8, 6, 0.96); }

.topbar__brand-text strong,
.drawer__brand-text strong,
.footer__brand strong {
  font-family: var(--display);
  letter-spacing: 0.01em;
  background: none;
  color: var(--text);
}

.topbar__brand-text small,
.drawer__brand-sub,
.footer__brand small {
  color: var(--accent);
  letter-spacing: 0.26em;
}

.topbar__logo,
.footer__brand img,
.drawer__logo {
  filter: drop-shadow(0 14px 22px rgba(0,0,0,0.55));
}

.topbar__link {
  color: #9fc1a9;
  border: 1px solid transparent;
  border-radius: 999px;
  text-transform: none;
  letter-spacing: 0;
}

.topbar__link:hover {
  color: var(--text);
  background: rgba(91, 242, 143, 0.07);
  border-color: rgba(91, 242, 143, 0.16);
}

.topbar__link--active::after {
  background: var(--accent);
  box-shadow: none;
}

/* Trabalhe Conosco — destaque verde com dot pulsante */
.topbar__link--work{
  position:relative;
  display:inline-flex;align-items:center;gap:8px;
  color:#22ff66 !important;
  background:rgba(34,197,94,.08);
  border:1px solid rgba(34,197,94,.3);
  font-weight:700;
  padding-right:14px;
}
.topbar__link--work:hover{
  background:rgba(34,197,94,.18) !important;
  border-color:rgba(34,197,94,.55) !important;
  box-shadow:0 0 18px rgba(34,255,102,.25);
  transform:translateY(-1px);
}
.topbar__link-dot{
  width:7px;height:7px;border-radius:50%;
  background:#22ff66;box-shadow:0 0 10px #22ff66;
  animation:tcDot 1.6s ease-in-out infinite;
}
@keyframes tcDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.7)}}
.drawer__link--work{
  background:linear-gradient(135deg,rgba(34,197,94,.1),rgba(34,197,94,.03)) !important;
  border:1px solid rgba(34,197,94,.3) !important;
}
.drawer__link--work strong{color:#22ff66 !important}
.drawer__link--work .drawer__link-ico{color:#22ff66}

.btn {
  border-radius: 999px;
  font-family: var(--font);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 800;
}

.btn--primary {
  color: #04170b;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.24), transparent 42%),
    linear-gradient(135deg, #a8ffc4, #36e875 64%, #0fa94d);
  box-shadow: 0 18px 36px -24px rgba(54, 232, 117, 0.92);
}

.btn--ghost {
  color: var(--text);
  background: rgba(11, 12, 9, 0.58);
  border-color: rgba(91, 242, 143, 0.26);
}

.btn--ghost:hover {
  color: var(--accent-2);
  background: rgba(91, 242, 143, 0.08);
  border-color: rgba(91, 242, 143, 0.5);
}

.hero {
  min-height: calc(100vh - var(--header-h));
  padding-top: 48px;
  padding-bottom: 34px;
}

.hero__bg-grid {display:none}

.hero__bg-glow,
.hero__bg-streaks {
  display: none;
}

.hero__inner {
  grid-template-columns: minmax(420px, 0.98fr) minmax(260px, 0.74fr) minmax(300px, 0.72fr);
  gap: 28px;
  min-height: calc(100vh - var(--header-h) - 130px);
}

.hero__content {
  max-width: 650px;
  align-self: center;
}

.hero__badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 999px;
  color: #cff7dc;
  background: rgba(9, 10, 7, 0.68);
  border: 1px solid rgba(91, 242, 143, 0.28);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: none;
}

.hero__badge-dot {
  background: var(--green);
  box-shadow: 0 0 18px rgba(100,242,154,0.65);
}

.hero__title,
.section__title,
.cta__title {
  font-family: var(--display);
  letter-spacing: 0;
  text-transform: none;
}

.hero__title {
  margin-top: 22px;
  margin-bottom: 22px;
  font-size: clamp(48px, 6.6vw, 92px);
  line-height: 0.88;
  color: #f2fff5;
  text-shadow: 0 24px 48px rgba(0,0,0,0.5);
}

.hero__title-accent,
.accent {
  color: var(--accent-2);
  background: linear-gradient(95deg, #e2ffe9, #5bf28f 52%, #64f29a);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero__sub {
  max-width: 610px;
  color: #c6dfcc;
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.72;
}

.hero__safety {
  color: #c0dcc8;
  background: rgba(12, 13, 9, 0.58);
  border: 1px dashed rgba(91, 242, 143, 0.3);
  width: fit-content;
  max-width: 100%;
  padding: 9px 12px;
  border-radius: 8px;
}

.hero__safety svg { color: var(--green); }

.hero__trust {
  grid-template-columns: repeat(2, minmax(170px, 1fr));
  gap: 10px;
  max-width: 540px;
  margin-top: 18px;
}

.hero__trust li {
  padding: 12px;
  background: rgba(7, 8, 6, 0.62);
  border: 1px solid rgba(91, 242, 143, 0.16);
  border-radius: 8px;
}

.hero__trust-icon {
  color: var(--accent-2);
  background: rgba(91, 242, 143, 0.08);
  border-color: rgba(91, 242, 143, 0.28);
}

.hero__trust strong {
  font-family: var(--display);
  font-size: 16px;
  color: #effff2;
}

.hero__receipt {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  width: min(640px, 100%);
  margin-top: 18px;
  border: 1px solid rgba(91, 242, 143, 0.24);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(91, 242, 143, 0.18);
}

.hero__receipt span {
  min-width: 0;
  padding: 11px 10px;
  background: rgba(8, 9, 6, 0.78);
  color: #bcecca;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-align: center;
}

.hero__side {
  min-height: 560px;
  align-self: end;
}

.hero__side::before {
  width: 80%;
  height: 80%;
  background:
    linear-gradient(135deg, transparent 0 34%, rgba(91,242,143,0.18) 34% 35%, transparent 35% 64%, rgba(100,242,154,0.16) 64% 65%, transparent 65%),
    radial-gradient(ellipse 58% 72% at 50% 52%, rgba(91, 242, 143, 0.22), transparent 68%);
  filter: blur(24px);
  opacity: 0.9;
}

.hero__side::after {
  background:
    linear-gradient(180deg, rgba(214,255,225,0.11), transparent 36%),
    repeating-linear-gradient(90deg, transparent 0 22px, rgba(91,242,143,0.08) 22px 23px);
  opacity: 0.55;
}

.hero__char {
  max-width: 455px;
}

.hero__char img {
  filter:
    drop-shadow(0 38px 54px rgba(0,0,0,0.72))
    drop-shadow(0 0 55px rgba(91, 242, 143, 0.24));
}

.floatcard,
.topcard,
.card,
.modcard,
.step,
.faq__item,
.rank-table,
.live-card {
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.035), transparent 36%),
    rgba(11, 12, 9, 0.78);
  border-color: rgba(91, 242, 143, 0.2);
  box-shadow: 0 24px 56px -38px rgba(0,0,0,0.9);
}

.floatcard {
  backdrop-filter: blur(18px);
}

.floatcard__icon,
.topcard__trophy,
.card__icon,
.modcard__icon {
  color: #04170b;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.28), transparent 42%),
    linear-gradient(135deg, #baffcf, #1fa658);
  border-color: rgba(186, 255, 207, 0.3);
  filter: none;
}

.floatcard__label,
.modcard__badge,
.modcard__group-label,
.section__eyebrow,
.cta__eyebrow {
  color: var(--accent-2);
  letter-spacing: 0.13em;
}

.topcard {
  padding: 18px;
  align-self: center;
}

.topcard::before,
.card::before,
.modcard::after {
  background: linear-gradient(90deg, transparent, rgba(91,242,143,0.9), transparent);
}

.topcard__title,
.card__title,
.modcard__title,
.step__title {
  font-family: var(--display);
  letter-spacing: 0;
}

.topcard__skeleton-badge {
  color: #04170b;
  background: var(--accent-2);
}

.topcard__skeleton-foot {
  background: rgba(91, 242, 143, 0.07);
  border-color: rgba(91, 242, 143, 0.18);
}

.hero__features {
  max-width: var(--max);
  margin: 8px auto 0;
  border: 1px solid rgba(91,242,143,0.18);
  border-radius: 8px;
  background: rgba(7, 8, 6, 0.66);
  overflow: hidden;
}

.hero__feature {
  border-right: 1px solid rgba(91,242,143,0.14);
  background: transparent;
  border-radius: 0;
}

.hero__feature:last-child { border-right: 0; }
.hero__feature-icon { color: var(--accent-2); }
.hero__feature strong { color: #ebfff0; letter-spacing: 0.08em; }
.hero__feature span { color: #9fc1a9; }

.section {
  position: relative;
  padding-top: 96px;
  padding-bottom: 96px;
  background: linear-gradient(180deg, rgba(7,8,6,0.9), rgba(7,8,6,0.96));
}

.section--alt {
  background:
    linear-gradient(90deg, rgba(91,242,143,0.055), transparent 34%, transparent 68%, rgba(100,242,154,0.035)),
    rgba(10, 11, 8, 0.95);
}

.section__head {
  text-align: left;
  max-width: 820px;
  margin-left: 0;
  margin-right: auto;
}

.section__title {
  max-width: 760px;
  color: #effff3;
  line-height: 1.02;
}

.section__lead {
  max-width: 730px;
  color: #bdd8c4;
  font-size: 16px;
}

.cards--3 {
  grid-template-columns: 1.08fr 0.92fr 1fr;
}

.card {
  padding: 26px;
}

.card:hover,
.modcard:hover,
.step:hover,
.faq__item:hover {
  transform: translateY(-2px);
  border-color: rgba(91, 242, 143, 0.46);
  box-shadow: 0 28px 70px -42px rgba(0,0,0,0.95), 0 0 34px -24px rgba(91,242,143,0.9);
}

.modcard {
  min-height: 100%;
  padding: 22px;
  overflow: hidden;
}

.modcard::before {
  content: '';
  position: absolute;
  inset: auto 16px 16px 16px;
  height: 1px;
  background: linear-gradient(90deg, rgba(91,242,143,0.9), transparent);
  opacity: 0.5;
}

.modcard--destaque {
  background:
    linear-gradient(135deg, rgba(91,242,143,0.16), rgba(11,12,9,0.86) 42%),
    rgba(11,12,9,0.88);
}

.modcard__popular,
.modcard__novidade {
  border-radius: 999px;
  background: rgba(100,242,154,0.12);
  border: 1px solid rgba(100,242,154,0.42);
  color: var(--green);
}

.modcard__tagline,
.modcard__desc,
.card__text,
.step__text,
.faq__item p {
  color: #bdd8c4;
}

.modcard__chip {
  border-radius: 999px;
  color: #d6ffe1;
  background: rgba(91, 242, 143, 0.075);
  border-color: rgba(91, 242, 143, 0.18);
}

.modcard__chip--mode {
  color: #04170b;
  background: linear-gradient(135deg, #64f29a, #c7f9d8);
}

.modcard__cta {
  color: var(--accent-2);
  border-top-color: rgba(91, 242, 143, 0.18);
}

.steps {
  gap: 1px;
  background: rgba(91,242,143,0.16);
  border: 1px solid rgba(91,242,143,0.18);
  border-radius: 8px;
  overflow: hidden;
}

.step {
  border: 0;
  border-radius: 0;
  background: rgba(9, 10, 7, 0.82);
}

.step__num {
  font-family: var(--display);
  color: var(--accent-2);
  border-color: rgba(91,242,143,0.24);
  background: rgba(91,242,143,0.08);
}

.steps__note {
  color: #c6dfcc;
  background: rgba(100,242,154,0.07);
  border-color: rgba(100,242,154,0.25);
}

.cta {
  padding: 96px 24px;
  background:
    linear-gradient(180deg, rgba(7,8,6,0.98), rgba(7,8,6,0.92)),
    url('/img/landing/banner-3.webp') center / cover;
}

.cta__inner {
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(7,8,6,0.92), rgba(7,8,6,0.72)),
    linear-gradient(135deg, rgba(91,242,143,0.12), rgba(100,242,154,0.05));
  border-color: rgba(91, 242, 143, 0.32);
}

.cta__bg {
  background:
    repeating-linear-gradient(90deg, transparent 0 34px, rgba(91,242,143,0.08) 34px 35px),
    linear-gradient(90deg, rgba(91,242,143,0.18), transparent 42%);
}

.cta__content {
  max-width: 760px;
}

.cta__title {
  color: #effff3;
}

.faq__item summary {
  color: #ebfff1;
  font-family: var(--display);
  letter-spacing: 0;
}

.faq__item summary::after {
  color: #04170b;
  background: var(--accent-2);
}

.footer {
  background: #060705;
  border-top-color: rgba(91,242,143,0.18);
}

.footer__tag,
.footer__list a,
.footer__bottom {
  color: #9fbba8;
}

.socialbar,
.sticky-cta {
  border-radius: 999px;
  border-color: rgba(91,242,143,0.24);
  background: rgba(7,8,6,0.76);
}

.lightbox {
  background: rgba(2, 8, 4, 0.94);
}

.lightbox__img,
.lightbox__close,
.lightbox__nav {
  border-color: rgba(91,242,143,0.42);
}

@media (min-width: 1081px) {
  .hero {
    padding-top: 58px;
    padding-bottom: 42px;
  }

  .hero__inner {
    grid-template-columns: minmax(500px, 0.9fr) minmax(260px, 0.52fr) minmax(340px, 0.62fr);
    align-items: center;
    gap: 24px;
    min-height: calc(100vh - var(--header-h) - 118px);
  }

  .hero__content {
    max-width: 590px;
  }

  .hero__title {
    font-size: clamp(56px, 5.35vw, 80px) !important;
    line-height: 0.93 !important;
    margin-top: 18px;
    margin-bottom: 20px;
  }

  .hero__sub {
    max-width: 560px;
    font-size: 17px;
    line-height: 1.72;
  }

  .hero__cta {
    margin-bottom: 30px;
  }

  .hero__cta .btn {
    min-width: 206px;
  }

  .hero__side {
    min-height: 500px;
    align-self: end;
    transform: translateX(-18px);
  }

  .hero__char {
    max-width: 375px;
  }

  .floatcard {
    backdrop-filter: blur(16px);
  }

  .floatcard--top {
    top: 14%;
    left: 2%;
  }

  .floatcard--mid {
    top: 48%;
    right: -2%;
    left: auto;
  }

  .floatcard--bot {
    bottom: 9%;
    left: 8%;
  }

  .hero__trust {
    max-width: 500px;
  }

  .hero__trust li {
    min-height: 104px;
  }

  .topcard {
    max-width: 370px;
    justify-self: end;
  }

  .section {
    padding-top: 82px;
    padding-bottom: 82px;
  }
}

@media (max-width: 1280px) {
  .hero__inner {
    grid-template-columns: minmax(0, 1.05fr) minmax(260px, 0.78fr);
  }

  .hero__livearea {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .hero__livearea .topcard {
    max-width: 720px;
  }
}

@media (max-width: 1080px) {
  body.landing {
    background-attachment: scroll;
  }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .hero__content {
    max-width: 780px;
  }

  .hero__side {
    min-height: 420px;
    order: -1;
  }

  .hero__char {
    max-width: min(420px, 74vw);
  }

  .floatcard--top { left: 10%; }
  .floatcard--mid { right: 8%; }
  .floatcard--bot { left: 14%; }

  .hero__features {
    grid-template-columns: repeat(2, 1fr);
  }

  .hero__feature {
    border-right: 0;
    border-bottom: 1px solid rgba(91,242,143,0.14);
  }

  .cards--3,
  .cards--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  html,
  body.landing {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body.landing {
    padding-bottom: calc(86px + env(safe-area-inset-bottom));
  }

  .topbar__inner {
    padding-inline: 16px;
  }

  .topbar__brand {
    min-width: 0;
  }

  .topbar__brand-text strong {
    font-size: 16px;
  }

  .topbar__actions .btn {
    display: none;
  }

  .hero {
    width: 100%;
    padding: 20px 16px 104px;
    overflow: hidden;
  }

  .hero__inner,
  .hero__content,
  .section__inner {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .hero__title {
    max-width: calc(100vw - 32px);
    margin-top: 18px;
    margin-bottom: 18px;
    font-size: clamp(36px, 10.8vw, 46px) !important;
    line-height: 0.96 !important;
    overflow-wrap: normal;
  }

  .hero__title-accent {
    display: block;
  }

  .hero__sub {
    width: 100%;
    max-width: calc(100vw - 32px) !important;
    font-size: 15px;
    line-height: 1.62;
    overflow-wrap: break-word;
  }

  .hero__cta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-bottom: 28px;
    width: 100%;
    max-width: calc(100vw - 32px);
  }

  .hero__cta .btn {
    width: 100%;
    min-height: 52px;
    justify-content: center;
    padding-inline: 16px;
  }

  .hero__cta .btn--primary {
    display: none;
  }

  .hero__badge {
    white-space: normal;
  }

  .hero__trust {
    grid-template-columns: 1fr;
  }

  .hero__receipt {
    grid-template-columns: 1fr 1fr;
  }

  .hero__receipt span {
    font-size: 10px;
  }

  .hero__side {
    min-height: 340px;
    width: 100%;
    overflow: hidden;
  }

  .floatcard {
    transform: scale(0.9);
  }

  .hero__features,
  .cards--3,
  .cards--4,
  .steps {
    grid-template-columns: 1fr;
  }

  .section {
    padding: 64px 16px;
  }

  .section__title {
    font-size: clamp(31px, 10vw, 48px);
  }

  .section__head {
    margin-bottom: 28px;
  }

  .cta {
    padding: 64px 16px 88px;
  }

  .cta__inner {
    padding: 38px 20px;
  }

  .cta__title {
    font-size: clamp(34px, 12vw, 52px);
  }

  .sticky-cta {
    left: 14px;
    right: 14px;
    bottom: calc(10px + env(safe-area-inset-bottom));
    width: auto;
    min-height: 52px;
    max-width: calc(100vw - 28px);
    font-size: 14px;
    z-index: 120;
  }
}

@media (max-width: 480px) {
  .hero {
    padding-top: 12px;
  }

  .hero__title {
    font-size: clamp(38px, 12vw, 48px);
  }

  .hero__cta .btn {
    width: 100%;
  }

  .hero__receipt {
    grid-template-columns: 1fr;
  }

  .floatcard {
    display: none;
  }

  .hero__side {
    min-height: 300px;
    margin-inline: -10px;
  }

  .hero__char {
    max-width: min(88vw, 330px);
  }
}

/* ===== Sobre nos / equipe configuravel ===== */
.about-command {
  margin-top: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  gap: 18px;
  align-items: stretch;
  padding: clamp(22px, 4vw, 34px);
  border-radius: 22px;
  border: 1px solid rgba(246, 198, 106, .18);
  background:
    linear-gradient(135deg, rgba(246, 198, 106, .1), rgba(34, 255, 102, .055) 44%, rgba(54, 224, 255, .055)),
    rgba(255, 255, 255, .025);
  box-shadow: 0 26px 90px -52px rgba(246, 198, 106, .55);
  overflow: hidden;
  position: relative;
}

.about-command::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, rgba(0,0,0,.7), transparent 70%);
  opacity: .18;
}

.about-command__copy,
.about-command__metrics {
  position: relative;
  z-index: 1;
}

.about-command__label {
  display: inline-flex;
  margin-bottom: 12px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #f6c66a;
}

.about-command h3 {
  max-width: 720px;
  margin: 0 0 10px;
  font-size: clamp(26px, 4vw, 48px);
  line-height: .98;
  letter-spacing: 0;
  color: #fff;
}

.about-command p {
  max-width: 760px;
  color: rgba(232, 238, 231, .74);
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 1.7;
}

.about-command__metrics {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.about-metric {
  min-height: 86px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px;
  border-radius: 16px;
  background: rgba(0,0,0,.2);
  border: 1px solid rgba(255,255,255,.08);
}

.about-metric strong {
  font: 900 28px/1 var(--font-display, inherit);
  color: #fff;
}

.about-metric span {
  margin-top: 6px;
  color: rgba(232, 238, 231, .62);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.about-metric--green { border-color: rgba(34,255,102,.24); }
.about-metric--gold { border-color: rgba(246,198,106,.28); }
.about-metric--cyan { border-color: rgba(54,224,255,.24); }
.about-metric--purple { border-color: rgba(183,164,255,.24); }

.about-principles {
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.about-principle {
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.075);
}

.about-principle__num {
  display: inline-flex;
  margin-bottom: 18px;
  font: 900 11px/1 var(--font-mono, monospace);
  color: #22ff66;
  letter-spacing: .16em;
}

.about-principle h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 17px;
  letter-spacing: 0;
}

.about-principle p {
  margin: 0;
  color: rgba(232, 238, 231, .66);
  font-size: 13.5px;
  line-height: 1.6;
}

.team-showcase {
  margin-top: clamp(36px, 6vw, 70px);
}

.team-showcase__head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 18px;
}

.team-showcase__head h3 {
  margin: 8px 0 0;
  max-width: 760px;
  font-size: clamp(28px, 4.8vw, 56px);
  line-height: .96;
  color: #fff;
  letter-spacing: 0;
}

.team-showcase__head p {
  max-width: 360px;
  color: rgba(232, 238, 231, .64);
  font-size: 13.5px;
  line-height: 1.65;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.team-empty {
  grid-column: 1 / -1;
  padding: 24px;
  border-radius: 18px;
  border: 1px dashed rgba(246,198,106,.28);
  color: rgba(232,238,231,.7);
  background: rgba(255,255,255,.025);
}

.team-empty strong {
  display: block;
  color: #fff;
  font-size: 18px;
  margin-bottom: 4px;
}

.team-card {
  position: relative;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  padding: 18px;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 20% -10%, rgba(255,255,255,.13), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  box-shadow: 0 24px 80px -54px var(--team-accent, #22ff66);
}

.team-card--featured {
  grid-column: span 1;
  border-color: rgba(246,198,106,.36);
  box-shadow: 0 30px 90px -46px rgba(246,198,106,.58);
}

.team-card__shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(130deg, transparent 0 38%, rgba(255,255,255,.11) 48%, transparent 58%),
    radial-gradient(circle at 80% 10%, var(--team-accent, #22ff66), transparent 24%);
  opacity: .14;
}

.team-card__banner {
  position: absolute;
  inset: 0 0 auto 0;
  height: 140px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 0;
  filter: saturate(1.05);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 55%, rgba(0,0,0,.55) 78%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 0%, #000 55%, rgba(0,0,0,.55) 78%, transparent 100%);
}

.team-card__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.35) 60%, rgba(7,10,17,.85) 100%),
    radial-gradient(120% 80% at 80% 0%, color-mix(in srgb, var(--team-accent, #22ff66) 28%, transparent), transparent 60%);
}

.team-card--has-banner {
  padding-top: 120px;
}

.team-card--has-banner .team-card__avatar {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.22),
    0 0 0 3px rgba(8,10,16,.85),
    0 16px 34px -18px var(--team-accent, #22ff66);
}

.team-card__top,
.team-card__badges,
.team-card__bio,
.team-card__stats {
  position: relative;
  z-index: 1;
}

.team-card__top {
  display: flex;
  gap: 14px;
  align-items: center;
}

.team-card__avatar {
  width: 76px;
  height: 76px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  color: #06120a;
  font-weight: 950;
  font-size: 22px;
  background: linear-gradient(135deg, var(--team-accent, #22ff66), rgba(255,255,255,.18));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 16px 34px -22px var(--team-accent, #22ff66);
}

.team-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-card__identity {
  min-width: 0;
}

.team-card__identity h4 {
  margin: 6px 0 4px;
  color: #fff;
  font-size: 20px;
  line-height: 1.05;
  letter-spacing: 0;
}

.team-card__identity p {
  margin: 0;
  color: rgba(232,238,231,.72);
  font-size: 12.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.team-card__identity small {
  display: inline-flex;
  margin-top: 6px;
  color: rgba(232,238,231,.42);
  font: 800 11px/1 var(--font-mono, monospace);
}

.team-card__status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(0,0,0,.24);
  color: rgba(232,238,231,.7);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.team-card__status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #22ff66;
  box-shadow: 0 0 8px #22ff66;
}

.team-card__status--offline::before { background: #8b8f99; box-shadow: none; }
.team-card__status--ocupado::before { background: #f6c66a; box-shadow: 0 0 8px rgba(246,198,106,.8); }

.team-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 18px;
}

.team-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 7px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.055);
  color: rgba(232,238,231,.8);
  font-size: 10.5px;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.team-badge strong {
  font: 950 10px/1 var(--font-mono, monospace);
}

.team-badge--gold { color: #f6c66a; border-color: rgba(246,198,106,.28); background: rgba(246,198,106,.09); }
.team-badge--green { color: #22ff66; border-color: rgba(34,255,102,.24); background: rgba(34,255,102,.08); }
.team-badge--cyan { color: #36e0ff; border-color: rgba(54,224,255,.24); background: rgba(54,224,255,.08); }
.team-badge--purple { color: #b7a4ff; border-color: rgba(183,164,255,.24); background: rgba(183,164,255,.08); }
.team-badge--red { color: #ff9b9b; border-color: rgba(248,113,113,.24); background: rgba(248,113,113,.08); }
.team-badge--silver { color: #dfe7ef; border-color: rgba(223,231,239,.18); background: rgba(223,231,239,.07); }

.team-card__bio {
  margin: 18px 0 0;
  color: rgba(232,238,231,.7);
  font-size: 13.5px;
  line-height: 1.62;
}

.team-card__stats {
  margin-top: auto;
  padding-top: 18px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.team-card__stat {
  padding: 11px 10px;
  border-radius: 14px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.075);
}

.team-card__stat strong {
  display: block;
  color: #fff;
  font: 950 16px/1 var(--font-display, inherit);
}

.team-card__stat span {
  display: block;
  margin-top: 5px;
  color: rgba(232,238,231,.5);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .about-command,
  .team-showcase__head {
    grid-template-columns: 1fr;
  }

  .about-command {
    display: block;
  }

  .about-command__metrics {
    margin-top: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .about-principles,
  .team-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .about-command__metrics,
  .about-principles,
  .team-grid {
    grid-template-columns: 1fr;
  }

  .team-card {
    min-height: 0;
  }

  .team-card__avatar {
    width: 64px;
    height: 64px;
    border-radius: 17px;
  }

  .team-card__banner {
    height: 110px;
  }

  .team-card--has-banner {
    padding-top: 96px;
  }
}

/* ===== Showcase Sobre nos v2 ===== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.about-stage-section {
  position: relative;
  overflow: hidden;
}

.about-stage-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 480px at 82% 18%, rgba(34, 255, 102, .16), transparent 58%),
    radial-gradient(680px 420px at 12% 24%, rgba(34, 255, 102, .08), transparent 58%),
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.24));
}

.about-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(440px, .9fr);
  grid-template-areas:
    "copy visual"
    "structure structure"
    "team team";
  gap: clamp(18px, 3vw, 34px);
  min-height: 760px;
  padding-top: clamp(28px, 5vw, 70px);
  padding-bottom: clamp(28px, 5vw, 72px);
}

.about-stage__bg {
  position: absolute;
  inset: -20px;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(circle at 34% 30%, rgba(0,0,0,.8), transparent 72%);
  opacity: .14;
}

.about-stage__copy {
  grid-area: copy;
  position: relative;
  z-index: 2;
  align-self: center;
  max-width: 720px;
}

.about-stage__mark {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  margin-bottom: 14px;
  padding-left: 28px;
  color: #fff;
  font-size: clamp(18px, 2.4vw, 35px);
  font-weight: 950;
  line-height: 1;
  letter-spacing: 0;
}

.about-stage__mark::before {
  content: "";
  position: absolute;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 8px solid #22ff66;
  border-top-color: transparent;
  transform: rotate(-18deg);
  filter: drop-shadow(0 0 18px rgba(34, 255, 102, .64));
}

.about-stage__mark::after {
  content: "";
  position: absolute;
  left: 30px;
  bottom: -11px;
  width: 56px;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #22ff66, #36e0ff);
  box-shadow: 0 0 24px rgba(34, 255, 102, .42);
}

.about-stage__copy h2 {
  margin: 0 0 18px;
  max-width: 740px;
  color: #fff;
  font-size: clamp(44px, 6vw, 90px);
  line-height: .9;
  letter-spacing: 0;
  text-wrap: balance;
}

.about-stage__copy p {
  max-width: 640px;
  color: rgba(235, 239, 247, .82);
  font-size: clamp(15px, 1.45vw, 18px);
  line-height: 1.72;
  font-weight: 650;
}

.about-stage__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.about-stage__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  max-width: 690px;
  margin-top: 20px;
}

.about-stage__metric {
  min-height: 78px;
  padding: 13px 14px;
  border-radius: 15px;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.about-stage__metric strong {
  display: block;
  color: #fff;
  font-size: 22px;
  font-weight: 950;
  line-height: 1;
}

.about-stage__metric span {
  display: block;
  margin-top: 7px;
  color: rgba(235,239,247,.58);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.about-stage__metric--green { border-color: rgba(34,255,102,.25); }
.about-stage__metric--gold { border-color: rgba(246,198,106,.3); }
.about-stage__metric--cyan { border-color: rgba(54,224,255,.28); }
.about-stage__metric--purple { border-color: rgba(157,22,255,.34); }

.about-stage__rail {
  grid-area: rail;
  position: relative;
  z-index: 3;
  align-self: start;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(250px, 280px);
  gap: 12px;
  max-width: min(850px, 100%);
  overflow-x: auto;
  padding: 4px 4px 12px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}

.team-mini-card {
  position: relative;
  min-height: 108px;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  scroll-snap-align: start;
  overflow: hidden;
  padding: 10px 14px 10px 0;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--team-accent, #7c3cff) 84%, #0e1018), color-mix(in srgb, var(--team-accent, #7c3cff) 62%, #11131b) 62%, rgba(20,22,31,.88));
  box-shadow: 0 18px 48px -34px var(--team-accent, #7c3cff);
}

.team-mini-card--featured {
  border-color: rgba(246,198,106,.42);
}

.team-mini-card--empty {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 18px;
  background: rgba(255,255,255,.04);
  color: rgba(235,239,247,.7);
}

.team-mini-card__avatar {
  align-self: end;
  width: 104px;
  height: 104px;
  margin-left: 2px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  color: rgba(255,255,255,.9);
  font-weight: 950;
  font-size: 24px;
  filter: grayscale(.45) contrast(1.1);
}

.team-mini-card__avatar img {
  width: 112px;
  height: 112px;
  object-fit: cover;
  object-position: center top;
  border-radius: 9px;
  transform: translateY(12px);
}

.team-mini-card__avatar span {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  border-radius: 18px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.14);
}

.team-mini-card__body {
  min-width: 0;
  position: relative;
  z-index: 2;
}

.team-mini-card h3 {
  margin: 0 0 4px;
  color: #fff;
  font-size: 17px;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.team-mini-card p {
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.about-stage__visual {
  grid-area: visual;
  position: relative;
  z-index: 2;
  min-height: 620px;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: start;
  isolation: isolate;
}

.about-stage__visual::before {
  content: "";
  position: absolute;
  inset: 12% 2% 6% 14%;
  background:
    radial-gradient(circle at 62% 34%, rgba(34, 255, 102, .22), transparent 34%),
    linear-gradient(135deg, rgba(34, 255, 102, .18), rgba(54, 224, 255, .06) 48%, transparent 72%);
  filter: blur(22px);
  opacity: .9;
  z-index: 0;
}

.about-tactical-frame {
  position: absolute;
  width: min(560px, 42vw);
  height: min(560px, 42vw);
  z-index: 1;
  border: 1px solid rgba(34, 255, 102, .22);
  background:
    linear-gradient(90deg, rgba(34, 255, 102, .12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(34, 255, 102, .1) 1px, transparent 1px),
    radial-gradient(circle at 50% 38%, rgba(34, 255, 102, .16), transparent 56%);
  background-size: 54px 54px, 54px 54px, auto;
  clip-path: polygon(11% 0, 100% 0, 100% 78%, 83% 100%, 0 100%, 0 16%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    0 0 80px -42px rgba(34,255,102,.75);
}

.about-tactical-frame::before,
.about-tactical-frame::after,
.about-tactical-frame__line,
.about-tactical-frame__scan {
  content: "";
  position: absolute;
}

.about-tactical-frame::before {
  inset: 22px;
  border: 1px solid rgba(34,255,102,.18);
  clip-path: polygon(8% 0, 100% 0, 100% 82%, 82% 100%, 0 100%, 0 14%);
}

.about-tactical-frame::after {
  left: 11%;
  right: 11%;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(34,255,102,.5), transparent);
  opacity: .7;
}

.about-tactical-frame__line {
  width: 116px;
  height: 12px;
  border-radius: 99px;
  background: linear-gradient(90deg, #22ff66, rgba(34,255,102,.12));
  box-shadow: 0 0 28px rgba(34,255,102,.34);
}

.about-tactical-frame__line--top {
  top: 18px;
  right: 28px;
}

.about-tactical-frame__line--bottom {
  left: 28px;
  bottom: 24px;
  transform: rotate(180deg);
  opacity: .72;
}

.about-tactical-frame__scan {
  top: 0;
  bottom: 0;
  left: 24%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(34,255,102,.58), transparent);
  box-shadow: 0 0 18px rgba(34,255,102,.42);
}

.about-stage__char {
  position: relative;
  z-index: 3;
  width: min(560px, 45vw);
  max-height: 620px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 42px 80px rgba(0,0,0,.55));
  transform: translateY(18px);
}

.discord-badge-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}

.discord-badge-row--center {
  justify-content: flex-start;
}

.discord-badge {
  --badge-color: #22ff66;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--badge-color) 38%, rgba(255,255,255,.12));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--badge-color) 22%, rgba(255,255,255,.08)), rgba(255,255,255,.035)),
    rgba(0,0,0,.2);
  color: color-mix(in srgb, var(--badge-color) 78%, #fff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 26px -20px var(--badge-color);
  font-weight: 950;
  line-height: 1;
}

.discord-badge::before {
  content: none;
}

.discord-badge strong {
  display: inline-flex;
  max-width: 46px;
  overflow: hidden;
  color: inherit;
  font: 950 10px/1 var(--font-mono, monospace);
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.discord-badge img {
  width: 18px;
  height: 18px;
  display: block;
  object-fit: contain;
  border-radius: 4px;
}

.discord-badge small {
  display: inline-flex;
  max-width: 0;
  overflow: hidden;
  opacity: 0;
  margin-left: 0;
  color: rgba(255,255,255,.9);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  transition: max-width .2s ease, margin-left .2s ease, opacity .2s ease;
}

.team-card:hover .discord-badge small,
.team-card:focus-within .discord-badge small {
  max-width: 160px;
  margin-left: 7px;
  opacity: 1;
}

.discord-badge--gold { --badge-color: #f6c66a; }
.discord-badge--green { --badge-color: #22ff66; }
.discord-badge--cyan { --badge-color: #36e0ff; }
.discord-badge--blue { --badge-color: #60a5fa; }
.discord-badge--purple { --badge-color: #9d16ff; }
.discord-badge--red { --badge-color: #ff6464; }
.discord-badge--silver { --badge-color: #dfe7ef; }
.discord-badge--dark { --badge-color: #8b8f99; }

.about-command {
  grid-area: structure;
  margin-top: clamp(16px, 3vw, 34px);
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
}

.about-command__copy h3 {
  font-size: clamp(25px, 3vw, 42px);
}

.about-principles {
  margin-top: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.about-principle {
  border-radius: 16px;
  background: rgba(10, 12, 20, .55);
}

.about-principle h4 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0;
}

.team-showcase {
  grid-area: team;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: clamp(20px, 2.4vw, 32px);
  justify-content: center;
  align-items: stretch;
  max-width: 1500px;
  margin: 0 auto;
}

.team-card--v3 {
  max-width: 480px;
  width: 100%;
  margin-inline: auto;
}

/* stagger reveal por posição na grid pra feel cinematográfico */
.team-card--v3:nth-child(3n+2) { transform: translateY(0); }
.team-card--v3:nth-child(3n+2):not(:hover) { transform: translateY(-10px); }

@media (max-width: 1100px) {
  .team-card--v3:nth-child(3n+2):not(:hover) { transform: none; }
}

.team-card {
  border-radius: 18px;
  background:
    radial-gradient(circle at 15% 0%, color-mix(in srgb, var(--team-accent, #7c3cff) 24%, transparent), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
}

.team-card__insignias {
  margin-top: 18px;
}

.team-card__avatar {
  border-radius: 16px;
}

@media (max-width: 1120px) {
  .about-stage {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "visual"
      "structure"
      "team";
    min-height: 0;
  }

  .about-stage__visual {
    min-height: 500px;
    order: 2;
  }

  .about-tactical-frame {
    width: min(520px, 82vw);
    height: min(520px, 82vw);
  }

  .about-stage__char {
    width: min(560px, 82vw);
  }

  .about-command {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .about-stage__copy h2 {
    font-size: clamp(40px, 12vw, 58px);
  }

  .about-stage__metrics,
  .about-principles {
    grid-template-columns: 1fr;
  }

  .about-stage__visual {
    min-height: 360px;
  }

  .about-tactical-frame {
    width: min(360px, 82vw);
    height: min(360px, 82vw);
  }

  .about-stage__char {
    width: min(390px, 86vw);
  }

  .about-stage__rail {
    grid-auto-columns: minmax(238px, 82vw);
  }

  .team-mini-card {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .team-mini-card__avatar {
    width: 92px;
  }

  .team-showcase__head {
    display: block;
  }
}

/* =========================================================
   TEAM SHOWCASE INTRO — heading antes do grid
   ========================================================= */
.team-showcase__intro {
  margin: clamp(28px, 4vw, 56px) 0 clamp(20px, 3vw, 32px);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.team-showcase__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 14px;
  border-radius: 999px;
  border: 1px solid rgba(34,255,102,.28);
  background: rgba(34,255,102,.06);
  color: #98ffba;
  font: 950 10.5px/1 var(--font-mono, ui-monospace, monospace);
  letter-spacing: .22em;
  text-transform: uppercase;
}

.team-showcase__eyebrow::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #22ff66;
  box-shadow: 0 0 10px #22ff66;
}

.team-showcase__heading {
  margin: 4px 0 0;
  font-size: clamp(28px, 4.2vw, 48px);
  font-weight: 950;
  letter-spacing: -.02em;
  line-height: 1.05;
  background: linear-gradient(180deg, #ffffff 30%, rgba(34,255,102,.7));
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

.team-showcase__lead {
  max-width: 560px;
  margin: 6px 0 0;
  color: rgba(232,238,231,.6);
  font-size: 14.5px;
  line-height: 1.55;
}

/* =========================================================
   TEAM CARD V3 — premium / aurora / holographic
   ========================================================= */

.team-card--v3 {
  position: relative;
  isolation: isolate;
  min-height: 460px;
  padding: 0 22px 22px;
  border-radius: 26px;
  border: 1px solid color-mix(in srgb, var(--team-accent, #7c3cff) 22%, rgba(255,255,255,.08));
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--team-accent) 16%, transparent), transparent 55%),
    radial-gradient(120% 80% at 100% 100%, color-mix(in srgb, var(--team-accent) 10%, transparent), transparent 60%),
    linear-gradient(180deg, rgba(14,16,24,.92), rgba(8,10,16,.96));
  box-shadow:
    0 30px 90px -56px color-mix(in srgb, var(--team-accent) 80%, transparent),
    inset 0 1px 0 rgba(255,255,255,.04);
  overflow: hidden;
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s cubic-bezier(.22,1,.36,1), border-color .3s ease;
}

.team-card--v3:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--team-accent) 50%, rgba(255,255,255,.18));
  box-shadow:
    0 42px 110px -50px color-mix(in srgb, var(--team-accent) 95%, transparent),
    0 0 0 1px color-mix(in srgb, var(--team-accent) 36%, transparent),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.team-card--v3.team-card--featured {
  border-color: color-mix(in srgb, var(--team-accent) 42%, rgba(255,255,255,.16));
}

/* aurora rotating border */
.team-card__aura {
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  pointer-events: none;
  z-index: 0;
  background:
    conic-gradient(from var(--aura-angle, 0deg),
      transparent 0deg,
      color-mix(in srgb, var(--team-accent) 60%, transparent) 60deg,
      transparent 110deg,
      color-mix(in srgb, var(--team-accent) 25%, #ffffff) 200deg,
      transparent 260deg,
      color-mix(in srgb, var(--team-accent) 60%, transparent) 320deg,
      transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: .55;
  animation: teamCardAura 14s linear infinite;
}

.team-card--v3:hover .team-card__aura {
  opacity: 1;
  animation-duration: 6s;
}

@property --aura-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

@keyframes teamCardAura {
  to { --aura-angle: 360deg; }
}

@supports not (background: conic-gradient(from 0deg, red, blue)) {
  .team-card__aura { display: none; }
}

/* banner — always present, falls back to gradient mesh */
.team-card--v3 .team-card__banner {
  position: absolute;
  inset: 0 0 auto 0;
  height: 168px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 0;
  filter: saturate(1.08) contrast(1.02);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.6) 80%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.6) 80%, transparent 100%);
  transition: transform .8s cubic-bezier(.22,1,.36,1), filter .35s ease;
}

.team-card--v3.team-card--no-banner .team-card__banner {
  background:
    radial-gradient(60% 80% at 20% 10%, color-mix(in srgb, var(--team-accent) 80%, transparent), transparent 60%),
    radial-gradient(50% 70% at 85% 20%, color-mix(in srgb, var(--team-accent) 35%, #1f1740) 0%, transparent 65%),
    radial-gradient(120% 80% at 50% 105%, color-mix(in srgb, var(--team-accent) 25%, #0a0d18) 0%, transparent 55%),
    linear-gradient(135deg, #181a2e 0%, #0a0d18 55%, #06080f 100%);
}

/* film grain overlay no banner — sempre, dá textura premium */
.team-card--v3 .team-card__banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/></svg>");
  mix-blend-mode: overlay;
  opacity: .28;
  pointer-events: none;
  z-index: 0;
}

.team-card--v3:hover .team-card__banner {
  transform: scale(1.06);
  filter: saturate(1.18) contrast(1.05);
}

.team-card--v3 .team-card__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 80% at 80% 0%, color-mix(in srgb, var(--team-accent) 24%, transparent), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.32) 65%, rgba(8,10,16,.92) 100%);
}

.team-card__banner-foil {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg,
      transparent 30%,
      rgba(255,255,255,.16) 44%,
      color-mix(in srgb, var(--team-accent) 30%, rgba(255,255,255,.22)) 50%,
      rgba(255,255,255,.16) 56%,
      transparent 70%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.04) 0 1px, transparent 1px 5px);
  mix-blend-mode: screen;
  opacity: .35;
  pointer-events: none;
  transform: translateX(-30%);
  transition: transform 1.2s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}

.team-card--v3:hover .team-card__banner-foil {
  transform: translateX(30%);
  opacity: .65;
}

.team-card__banner-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(0deg, rgba(255,255,255,.05) 1px, transparent 1px) 0 0 / 32px 32px;
  -webkit-mask-image: radial-gradient(80% 70% at 50% 35%, #000 30%, transparent 75%);
          mask-image: radial-gradient(80% 70% at 50% 35%, #000 30%, transparent 75%);
  opacity: .35;
}

/* verified seal — chic hex w/ checkmark */
.team-card__seal {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 4;
  width: 46px;
  height: 46px;
  color: var(--team-accent, #22ff66);
  filter:
    drop-shadow(0 0 12px color-mix(in srgb, var(--team-accent) 70%, transparent))
    drop-shadow(0 8px 22px color-mix(in srgb, var(--team-accent) 55%, transparent));
  pointer-events: none;
  transition: transform .4s cubic-bezier(.22,1,.36,1), filter .35s ease;
}

.team-card__seal--gold {
  color: #f6c66a;
}

.team-card__seal-ring {
  width: 100%;
  height: 100%;
  transform-origin: center;
  animation: teamSealSpin 22s linear infinite;
}

.team-card__seal-hex {
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.5));
}

.team-card__seal-hex--inner {
  animation: teamSealPulse 3.4s ease-in-out infinite;
}

.team-card__seal-check {
  filter: drop-shadow(0 1px 2px color-mix(in srgb, var(--team-accent) 80%, transparent));
}

.team-card--v3:hover .team-card__seal {
  transform: scale(1.08) rotate(6deg);
}

.team-card__seal[data-serial]::after {
  content: attr(data-serial);
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--team-accent) 30%, rgba(255,255,255,.14));
  background: rgba(8,10,16,.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: rgba(255,255,255,.86);
  font: 950 9px/1 var(--font-mono, ui-monospace, monospace);
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease;
}

.team-card--v3:hover .team-card__seal[data-serial]::after {
  opacity: 1;
  transform: translateY(0);
}

@keyframes teamSealSpin {
  to { transform: rotate(360deg); }
}

@keyframes teamSealPulse {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}

/* serial stamp (legacy, unused after seal) */
.team-card__serial {
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 3;
  padding: 5px 10px 5px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--team-accent) 35%, rgba(255,255,255,.18));
  background: rgba(8,10,16,.62);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  font: 950 10px/1 var(--font-mono, ui-monospace, monospace);
  letter-spacing: .14em;
  text-transform: uppercase;
  box-shadow: 0 8px 26px -16px color-mix(in srgb, var(--team-accent) 60%, transparent);
}

/* crown removido — substituído por ribbon premium */
.team-card__crown { display: none; }

/* RIBBON diagonal premium pra featured */
.team-card__ribbon {
  position: absolute;
  top: 22px;
  right: -42px;
  z-index: 5;
  padding: 6px 48px;
  background: linear-gradient(180deg, #ffe48a 0%, #f6c66a 50%, #b58524 100%);
  color: #2a1a06;
  font: 950 9.5px/1 var(--font-mono, ui-monospace, monospace);
  letter-spacing: .22em;
  text-transform: uppercase;
  transform: rotate(45deg);
  box-shadow:
    0 10px 26px -10px rgba(0,0,0,.7),
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -1px 0 rgba(0,0,0,.18);
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
  pointer-events: none;
}

.team-card__ribbon::before,
.team-card__ribbon::after {
  content: "";
  position: absolute;
  bottom: -6px;
  width: 6px;
  height: 6px;
  background: #7a4f0e;
}
.team-card__ribbon::before { left: 4px; clip-path: polygon(0 0, 100% 0, 100% 100%); }
.team-card__ribbon::after  { right: 4px; clip-path: polygon(0 0, 100% 0, 0 100%); }

/* shine over content */
.team-card--v3 .team-card__shine {
  position: absolute;
  inset: 168px 0 0 0;
  pointer-events: none;
  background:
    radial-gradient(80% 60% at 50% -10%, color-mix(in srgb, var(--team-accent) 26%, transparent), transparent 70%);
  opacity: .65;
  z-index: 0;
}

/* layout — push everything below the banner */
.team-card--v3 .team-card__top,
.team-card--v3 .team-card__insignias,
.team-card--v3 .team-card__quote,
.team-card--v3 .team-card__bio,
.team-card--v3 .team-card__stats {
  position: relative;
  z-index: 1;
}

.team-card--v3 .team-card__top {
  margin-top: 116px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: end;
}

/* avatar wrap + ring + orb */
.team-card__avatar-wrap {
  position: relative;
  width: 92px;
  height: 92px;
}

.team-card__avatar-wrap::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -14px;
  width: 110%;
  height: 22px;
  transform: translateX(-50%);
  background: radial-gradient(50% 100% at 50% 0%, color-mix(in srgb, var(--team-accent, #22ff66) 75%, transparent), transparent 75%);
  filter: blur(10px);
  z-index: 0;
  pointer-events: none;
  opacity: .7;
}

.team-card--v3 .team-card__avatar {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 22px;
  overflow: hidden;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--team-accent) 80%, #fff), color-mix(in srgb, var(--team-accent) 30%, #ffffff));
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.16),
    0 0 0 4px rgba(8,10,16,.92),
    0 16px 36px -16px color-mix(in srgb, var(--team-accent) 90%, transparent);
  color: #06120a;
  font: 950 24px/1 var(--font-display, inherit);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

.team-card--v3 .team-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-card__avatar-ring {
  position: absolute;
  inset: -6px;
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  z-index: 1;
  pointer-events: none;
  transform: rotate(-90deg);
}

.team-card__avatar-ring circle {
  fill: none;
  stroke-width: 3;
  stroke-linecap: round;
}

.team-card__avatar-ring-bg {
  stroke: rgba(255,255,255,.07);
}

.team-card__avatar-ring-fg {
  stroke: var(--team-accent, #22ff66);
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--team-accent) 90%, transparent));
  transition: stroke-dasharray .8s cubic-bezier(.22,1,.36,1);
}

.team-card__orb {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: #22ff66;
  box-shadow:
    0 0 0 3px rgba(8,10,16,.96),
    0 0 12px color-mix(in srgb, #22ff66 80%, transparent);
  z-index: 3;
}

.team-card__orb::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.8), transparent 65%);
}

.team-card__orb--online,
.team-card__orb--ativo {
  background: #22ff66;
  box-shadow: 0 0 0 3px rgba(8,10,16,.96), 0 0 14px #22ff66;
  animation: teamOrbPulse 2.2s ease-in-out infinite;
}

.team-card__orb--ocupado {
  background: #f6c66a;
  box-shadow: 0 0 0 3px rgba(8,10,16,.96), 0 0 12px #f6c66a;
}

.team-card__orb--offline {
  background: #8b8f99;
  box-shadow: 0 0 0 3px rgba(8,10,16,.96);
}

@keyframes teamOrbPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}

/* identity stack */
.team-card--v3 .team-card__identity {
  min-width: 0;
}

.team-card--v3 .team-card__identity h4 {
  margin: 6px 0 4px;
  font-size: 24px;
  line-height: 1.15;
  background: linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--team-accent) 35%, #ffffff));
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.01em;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.team-card--v3 .team-card__identity h4 .team-card__name-text {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.team-card__name-text {
  display: inline-block;
  vertical-align: middle;
}

.team-card__name-emoji {
  display: inline-block;
  vertical-align: middle;
  width: .85em;
  height: .85em;
  margin-left: 0;
  flex: 0 0 auto;
  object-fit: contain;
  border-radius: 4px;
  -webkit-text-fill-color: initial;
  filter: drop-shadow(0 3px 8px color-mix(in srgb, var(--team-accent, #22ff66) 55%, transparent));
}

.team-card__name-emoji--text {
  font-size: .92em;
  line-height: 1;
  -webkit-text-fill-color: initial;
  color: #fff;
  vertical-align: baseline;
}

.team-card--v3 .team-card__identity p {
  margin: 0;
  color: rgba(232,238,231,.82);
  font-size: 11.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.team-card__tagline {
  display: inline-block;
  margin-top: 8px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--team-accent) 28%, rgba(255,255,255,.1));
  background: color-mix(in srgb, var(--team-accent) 12%, rgba(255,255,255,.04));
  color: color-mix(in srgb, var(--team-accent) 60%, #fff);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.team-card__meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  color: rgba(232,238,231,.52);
  font: 800 11px/1 var(--font-mono, monospace);
}

.team-card__meta i {
  font-style: normal;
  opacity: .4;
}

/* status pill on v3: HUD chip flutuante no rodapé do card, canto inferior direito */
.team-card--v3 .team-card__status {
  position: absolute;
  bottom: 18px;
  right: 18px;
  top: auto;
  left: auto;
  z-index: 4;
  padding: 6px 11px 6px 9px;
  gap: 7px;
  font-size: 10.5px;
  font-weight: 950;
  letter-spacing: .18em;
  border: 1px solid color-mix(in srgb, var(--team-accent) 45%, rgba(255,255,255,.12));
  background:
    linear-gradient(180deg, rgba(20,24,34,.78), rgba(8,10,16,.72));
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  color: #fff;
  text-shadow: 0 1px 0 rgba(0,0,0,.5);
  box-shadow:
    0 8px 22px -8px color-mix(in srgb, var(--team-accent) 75%, transparent),
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 0 1px rgba(0,0,0,.45);
}

.team-card--v3 .team-card__status::before {
  width: 7px;
  height: 7px;
  background: var(--team-accent, #22ff66);
  box-shadow:
    0 0 0 2px rgba(8,10,16,.85),
    0 0 10px color-mix(in srgb, var(--team-accent) 90%, transparent);
  animation: teamStatusPulse 2.4s ease-in-out infinite;
}

.team-card--v3 .team-card__status--offline::before { animation: none; }

@keyframes teamStatusPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.25); opacity: .78; }
}

/* quote — premium serif with decorative watermark */
.team-card__quote {
  position: relative;
  z-index: 1;
  margin: 18px 0 0;
  padding: 16px 18px 16px 44px;
  border-left: 2px solid color-mix(in srgb, var(--team-accent) 60%, transparent);
  border-radius: 0 14px 14px 0;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--team-accent) 10%, rgba(255,255,255,.04)), rgba(255,255,255,.02));
  color: rgba(232,238,231,.88);
  font: 400 14.5px/1.65 var(--font-display, Georgia, serif);
  font-style: italic;
  overflow: hidden;
}

.team-card__quote::before {
  content: "\201C";
  position: absolute;
  top: 14px;
  left: 8px;
  font: 950 56px/.6 Georgia, "Times New Roman", serif;
  color: color-mix(in srgb, var(--team-accent) 28%, transparent);
  pointer-events: none;
  z-index: 0;
}

.team-card__quote span {
  display: none;
}

.team-card--v3 .team-card__bio {
  margin: 18px 0 0;
  color: rgba(232,238,231,.75);
  font-size: 13.5px;
  line-height: 1.65;
}

/* insignias bar — chip row premium */
.team-card--v3 .team-card__insignias {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.team-card--v3 .team-card__insignias .discord-badge {
  margin-right: 0;
  height: 34px;
  min-width: 34px;
  padding: 0 10px;
  border-radius: 11px;
  border-color: color-mix(in srgb, var(--badge-color) 42%, rgba(8,10,16,.95));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 0 1px rgba(8,10,16,.7),
    0 14px 30px -22px var(--badge-color);
  transition: transform .25s ease, box-shadow .25s ease;
}

.team-card--v3 .team-card__insignias .discord-badge:hover {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 0 0 1px color-mix(in srgb, var(--badge-color) 50%, transparent),
    0 18px 36px -20px var(--badge-color);
}

/* insignia: click pra mostrar tooltip premium acima */
.team-card--v3 .team-card__insignias .discord-badge {
  cursor: pointer;
  position: relative;
}

.team-card--v3 .team-card__insignias .discord-badge small {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%) translateY(4px);
  padding: 6px 11px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--badge-color) 50%, rgba(8,10,16,.95));
  background: linear-gradient(180deg, rgba(20,24,34,.98), rgba(8,10,16,.98));
  color: #fff;
  font: 950 9.5px/1 var(--font-mono, ui-monospace, monospace);
  letter-spacing: .16em;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s cubic-bezier(.22,1,.36,1);
  z-index: 12;
  max-width: none;
  margin-left: 0;
  box-shadow:
    0 12px 28px -10px rgba(0,0,0,.7),
    0 0 0 1px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.team-card--v3 .team-card__insignias .discord-badge small::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-top-color: color-mix(in srgb, var(--badge-color) 50%, rgba(8,10,16,.98));
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.4));
}

.team-card--v3 .team-card__insignias .discord-badge.is-open small {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.team-card--v3 .team-card__insignias .discord-badge.is-open {
  transform: translateY(-2px);
  z-index: 11;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 0 0 1px color-mix(in srgb, var(--badge-color) 65%, transparent),
    0 20px 40px -16px var(--badge-color);
}

/* preview admin: força tooltip sempre visível pra user ver labels */
.ec-preview .team-card--v3 .team-card__insignias .discord-badge small {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* stat tiles + animated bars — pinned to bottom for uniform card heights */
.team-card--v3 .team-card__stats {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px dashed rgba(255,255,255,.08);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px;
}

.team-card--v3 .team-card__stat strong:empty,
.team-card--v3 .team-card__stat span:empty { display: none; }

.team-card--v3 .team-card__stat {
  position: relative;
  padding: 12px 12px 14px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.18));
  border: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
}

.team-card--v3 .team-card__stat strong {
  display: block;
  color: #fff;
  font: 950 18px/1 var(--font-display, inherit);
  letter-spacing: -.01em;
}

.team-card--v3 .team-card__stat span {
  display: block;
  margin-top: 6px;
  color: rgba(232,238,231,.55);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.team-card__stat-bar {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 6px;
  display: block;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--stat-color, var(--team-accent)), transparent);
  opacity: .7;
  transform-origin: left;
  animation: teamStatBar 2.6s cubic-bezier(.22,1,.36,1) infinite;
}

.team-card__stat--gold { --stat-color: #f6c66a; }
.team-card__stat--green { --stat-color: #22ff66; }
.team-card__stat--cyan { --stat-color: #36e0ff; }
.team-card__stat--purple { --stat-color: #b7a4ff; }

@keyframes teamStatBar {
  0%, 100% { transform: scaleX(.4); opacity: .55; }
  50% { transform: scaleX(1); opacity: 1; }
}

/* corner accent stripe + bottom holographic line */
.team-card__corner {
  position: absolute;
  right: -40px;
  bottom: -40px;
  width: 140px;
  height: 140px;
  background:
    conic-gradient(from 220deg at 50% 50%, transparent 0deg, color-mix(in srgb, var(--team-accent) 70%, transparent) 60deg, transparent 120deg);
  filter: blur(30px);
  pointer-events: none;
  z-index: 0;
  opacity: .9;
}

.team-card--v3::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 14px;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    color-mix(in srgb, var(--team-accent) 30%, transparent) 18%,
    color-mix(in srgb, var(--team-accent) 80%, #fff) 50%,
    color-mix(in srgb, var(--team-accent) 30%, transparent) 82%,
    transparent 100%);
  opacity: .55;
  pointer-events: none;
  z-index: 0;
}

/* responsive */
@media (max-width: 980px) {
  .team-card--v3 { min-height: 420px; padding: 0 18px 20px; }
  .team-card--v3 .team-card__banner { height: 150px; }
  .team-card--v3 .team-card__shine { inset: 150px 0 0 0; }
  .team-card--v3 .team-card__top { margin-top: 100px; }
}

@media (max-width: 720px) {
  .team-grid {
    grid-template-columns: 1fr;
    max-width: 460px;
    margin: 0 auto;
  }
}

@media (max-width: 640px) {
  .team-card--v3 {
    min-height: 0;
    padding: 0 16px 18px;
    border-radius: 22px;
  }
  .team-card--v3 .team-card__banner { height: 116px; }
  .team-card--v3 .team-card__shine { inset: 116px 0 0 0; }

  /* stack vertical: avatar centralizado em cima, identity centralizado embaixo */
  .team-card--v3 .team-card__top {
    margin-top: 64px;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 12px;
  }
  .team-card__avatar-wrap { width: 84px; height: 84px; }
  .team-card__avatar-wrap::after { display: none; }

  .team-card--v3 .team-card__identity { width: 100%; }
  .team-card--v3 .team-card__identity h4 {
    margin: 4px 0 4px;
    font-size: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: nowrap;
    white-space: nowrap;
    word-break: keep-all;
    max-width: 100%;
  }
  .team-card__name-text { overflow: hidden; text-overflow: ellipsis; }
  .team-card__name-emoji { margin-left: 0; flex: 0 0 auto; }
  .team-card--v3 .team-card__identity p {
    font-size: 10.5px;
    letter-spacing: .12em;
  }

  .team-card--v3 .team-card__status {
    bottom: 14px;
    right: 14px;
    top: auto;
    left: auto;
    padding: 5px 9px 5px 8px;
    font-size: 9.5px;
    letter-spacing: .16em;
  }
  .team-card__tagline { margin: 6px auto 0; }
  .team-card__meta { justify-content: center; }

  /* insignias centro, menores, sem cortar */
  .team-card--v3 .team-card__insignias {
    justify-content: center;
    gap: 6px;
    margin-top: 14px;
  }
  .team-card--v3 .team-card__insignias .discord-badge {
    height: 30px;
    min-width: 30px;
    padding: 0 8px;
    border-radius: 9px;
  }

  /* quote compacto */
  .team-card__quote {
    margin-top: 14px;
    padding: 12px 14px 12px 36px;
    font-size: 13px;
    line-height: 1.55;
  }
  .team-card__quote::before {
    font-size: 44px;
    top: 10px;
    left: 6px;
  }

  .team-card--v3 .team-card__bio { margin-top: 14px; font-size: 12.5px; }

  /* stats 2 col compactas */
  .team-card--v3 .team-card__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding-top: 14px;
  }
  .team-card--v3 .team-card__stat { padding: 10px 10px 12px; }
  .team-card--v3 .team-card__stat strong { font-size: 16px; }

  /* ribbon destaque menor */
  .team-card__ribbon {
    top: 16px;
    right: -44px;
    padding: 5px 46px;
    font-size: 9px;
    letter-spacing: .18em;
  }

  /* linha holográfica inferior mais curta */
  .team-card--v3::after { left: 16px; right: 16px; bottom: 10px; }
}

@media (max-width: 380px) {
  .team-card--v3 { padding: 0 13px 16px; }
  .team-card--v3 .team-card__banner { height: 100px; }
  .team-card--v3 .team-card__shine { inset: 100px 0 0 0; }
  .team-card--v3 .team-card__top { margin-top: 56px; gap: 10px; }
  .team-card__avatar-wrap { width: 74px; height: 74px; }
  .team-card--v3 .team-card__identity h4 { font-size: 19px; }
  .team-card--v3 .team-card__identity p { font-size: 10px; }
  .team-card--v3 .team-card__insignias .discord-badge {
    height: 28px;
    min-width: 28px;
    padding: 0 7px;
  }
  .team-card__quote {
    padding: 11px 12px 11px 32px;
    font-size: 12.5px;
  }
  .team-card__quote::before { font-size: 38px; }
  .team-card--v3 .team-card__stat strong { font-size: 15px; }
  .team-card--v3 .team-card__stat span { font-size: 9.5px; letter-spacing: .12em; }
}

/* =========================================================
   TOPCARD V3 — ranking compacto premium (mirrors team-card v3)
   ========================================================= */

.topcard {
  position: relative;
  isolation: isolate;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--accent, #22ff66) 22%, rgba(255,255,255,.08));
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--accent, #22ff66) 14%, transparent), transparent 55%),
    radial-gradient(120% 80% at 100% 100%, color-mix(in srgb, var(--accent, #22ff66) 9%, transparent), transparent 60%),
    linear-gradient(180deg, rgba(14,16,24,.92), rgba(8,10,16,.96));
  box-shadow:
    0 26px 80px -48px color-mix(in srgb, var(--accent, #22ff66) 70%, transparent),
    inset 0 1px 0 rgba(255,255,255,.04);
  padding: 18px;
  overflow: hidden;
}

.topcard::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  pointer-events: none;
  z-index: 0;
  background:
    conic-gradient(from var(--topcard-angle, 0deg),
      transparent 0deg,
      color-mix(in srgb, var(--accent, #22ff66) 55%, transparent) 60deg,
      transparent 120deg,
      color-mix(in srgb, var(--accent, #22ff66) 25%, #ffffff) 220deg,
      transparent 280deg,
      color-mix(in srgb, var(--accent, #22ff66) 50%, transparent) 340deg,
      transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: .45;
  animation: topcardAura 16s linear infinite;
}

@property --topcard-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

@keyframes topcardAura {
  to { --topcard-angle: 360deg; }
}

.topcard__header {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px dashed rgba(255,255,255,.08);
}

.topcard__trophy {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent, #22ff66) 70%, #fff), color-mix(in srgb, var(--accent, #22ff66) 25%, #fff));
  color: #06120a;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.22),
    0 8px 22px -10px color-mix(in srgb, var(--accent, #22ff66) 70%, transparent);
}

.topcard__title {
  margin: 0;
  font-size: 15px;
  font-weight: 950;
  letter-spacing: -.01em;
  background: linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--accent, #22ff66) 35%, #ffffff));
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

.topcard__title::before {
  content: "TEMPORADA";
  display: block;
  font-size: 9.5px;
  letter-spacing: .22em;
  font-weight: 900;
  color: color-mix(in srgb, var(--accent, #22ff66) 55%, #fff);
  -webkit-text-fill-color: initial;
  margin-bottom: 2px;
}

.topcard__see {
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent, #22ff66) 35%, rgba(255,255,255,.1));
  background: color-mix(in srgb, var(--accent, #22ff66) 8%, rgba(255,255,255,.02));
  color: color-mix(in srgb, var(--accent, #22ff66) 60%, #fff);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: transform .25s ease, background .25s ease, color .25s ease;
}

.topcard__see:hover {
  transform: translateX(2px);
  background: color-mix(in srgb, var(--accent, #22ff66) 18%, rgba(255,255,255,.02));
  color: #fff;
}

.topcard__list {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.topcard__row {
  display: block;
  position: relative;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.18));
  overflow: hidden;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.topcard__row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--row-accent, var(--accent, #22ff66)), transparent);
  opacity: .55;
}

.topcard__row:hover {
  transform: translateX(3px);
  border-color: color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 45%, rgba(255,255,255,.18));
  box-shadow: 0 18px 38px -28px color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 90%, transparent);
}

.topcard__row--top:nth-child(1) { --row-accent: #f6c66a; }
.topcard__row--top:nth-child(2) { --row-accent: #dfe7ef; }
.topcard__row--top:nth-child(3) { --row-accent: #cd7f32; }

.topcard__rowlink {
  display: grid;
  grid-template-columns: 28px 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 12px 9px 14px;
  text-decoration: none;
  color: inherit;
}

.topcard__pos {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  font: 950 12px/1 var(--font-mono, ui-monospace, monospace);
  color: color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 55%, #fff);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}

.topcard__medal {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  display: inline-block;
  box-shadow: 0 0 0 2px rgba(8,10,16,.95), 0 0 10px var(--row-accent, var(--accent, #22ff66));
}

.topcard__medal--gold { background: linear-gradient(135deg, #ffe48a, #f6c66a 60%, #b58524); }
.topcard__medal--silver { background: linear-gradient(135deg, #ffffff, #dfe7ef 60%, #8b97a8); }
.topcard__medal--bronze { background: linear-gradient(135deg, #f0b27a, #cd7f32 60%, #7a4a14); }

.topcard__avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 60%, #fff), rgba(255,255,255,.2));
  color: #06120a;
  font: 950 13px/1 var(--font-display, inherit);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.16),
    0 0 0 2px rgba(8,10,16,.95),
    0 8px 18px -10px color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 80%, transparent);
}

.topcard__avatar--img { padding: 0; }
.topcard__avatar img { width: 100%; height: 100%; object-fit: cover; }

.topcard__name {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.topcard__name strong {
  color: #fff;
  font: 900 13.5px/1 var(--font-display, inherit);
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.topcard__name small {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(232,238,231,.5);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: lowercase;
}

.topcard__wins {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  min-width: 52px;
  padding: 4px 8px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 28%, rgba(255,255,255,.08));
  background: color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 10%, rgba(255,255,255,.02));
}

.topcard__wins strong {
  color: #fff;
  font: 950 16px/1 var(--font-display, inherit);
  background: linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--row-accent, var(--accent, #22ff66)) 45%, #fff));
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

.topcard__wins small {
  margin-top: 3px;
  color: rgba(232,238,231,.55);
  font-size: 8.5px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}

@media (max-width: 640px) {
  .topcard { padding: 14px; border-radius: 18px; }
  .topcard__rowlink { grid-template-columns: 24px 36px minmax(0, 1fr) auto; gap: 8px; padding: 8px 10px 8px 12px; }
  .topcard__avatar { width: 36px; height: 36px; }
  .topcard__name strong { font-size: 12.5px; }
  .topcard__wins { min-width: 44px; padding: 3px 7px; }
  .topcard__wins strong { font-size: 14px; }
}

/* ===== Recrutamento (Mediadores) ===== */
.recruit{position:relative;overflow:hidden;padding:96px 0;isolation:isolate}
.recruit__bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.recruit__glow{position:absolute;top:50%;left:50%;width:760px;height:760px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(34,197,94,.18) 0%,rgba(34,197,94,.06) 35%,transparent 70%);filter:blur(40px)}
.recruit__grid{display:none}
.recruit__inner{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:center;position:relative;z-index:1}
.recruit__content{max-width:680px}
.recruit__eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.18em;color:#22ff66;padding:6px 14px;border-radius:99px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);margin-bottom:18px;text-transform:uppercase}
.recruit__title{font-size:clamp(34px,5vw,56px);font-weight:900;line-height:1.05;letter-spacing:-.02em;margin-bottom:18px}
.recruit__title .accent{background:linear-gradient(135deg,#22ff66 0%,#16c455 50%,#1de87f 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 24px rgba(34,255,102,.4))}
.recruit__sub{font-size:17px;line-height:1.6;color:#c0c4cc;margin-bottom:32px;max-width:600px}
.recruit__sub strong{color:#22ff66;font-weight:700}
.recruit__cols{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:32px}
.recruit__col{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:22px}
.recruit__col-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#fff;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.recruit__col-title::before{content:'';width:24px;height:2px;background:linear-gradient(90deg,#22ff66,transparent);border-radius:2px}
.recruit__perks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.recruit__perks li{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.5;color:#cfd2da}
.recruit__perk-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#22ff66;box-shadow:0 0 10px rgba(34,255,102,.6);margin-top:7px}
.recruit__cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:6px}
.recruit__btn{background:linear-gradient(135deg,#25d366 0%,#128c7e 100%) !important;color:#fff !important;border:none !important;box-shadow:0 12px 32px -8px rgba(37,211,102,.5),inset 0 1px 0 rgba(255,255,255,.2) !important;font-weight:800 !important;letter-spacing:.01em}
.recruit__btn:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 18px 40px -8px rgba(37,211,102,.6),inset 0 1px 0 rgba(255,255,255,.2) !important}
.recruit__live{display:inline-flex;align-items:center;gap:8px;font:700 12px/1 'JetBrains Mono',monospace;color:#22ff66;text-transform:uppercase;letter-spacing:.08em}
.recruit__live-dot{width:8px;height:8px;border-radius:50%;background:#22ff66;box-shadow:0 0 12px #22ff66;animation:liveBeat 1.6s ease-in-out infinite}
@keyframes liveBeat{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.85)}}
.recruit__warn{margin-top:18px;font-size:12.5px;color:#8b8f99;font-style:italic;padding:10px 14px;border-left:2px solid rgba(34,197,94,.4);background:rgba(34,197,94,.04);border-radius:0 8px 8px 0}
.recruit__warn strong{color:#22ff66;font-style:normal}
.recruit__visual{position:relative;display:flex;align-items:center;justify-content:center}
.recruit__ghost{width:100%;max-width:380px;height:auto;filter:drop-shadow(0 24px 48px rgba(0,0,0,.5)) drop-shadow(0 0 32px rgba(34,255,102,.25));transform:scaleX(-1) rotate(-4deg);animation:ghostFloat 5s ease-in-out infinite;position:relative;z-index:2}
@keyframes ghostFloat{0%,100%{transform:scaleX(-1) rotate(-4deg) translateY(0)}50%{transform:scaleX(-1) rotate(-4deg) translateY(-14px)}}
.recruit__halo{position:absolute;top:50%;left:50%;width:520px;height:520px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(34,255,102,.18) 0%,transparent 60%);filter:blur(60px);z-index:1;pointer-events:none}
@media (max-width:1000px){.recruit__inner{grid-template-columns:1fr;gap:48px;text-align:center}.recruit__content{margin:0 auto}.recruit__sub{margin-left:auto;margin-right:auto}.recruit__cols{grid-template-columns:1fr;text-align:left}.recruit__cta{justify-content:center}.recruit__visual{order:-1}.recruit__ghost{max-width:280px}.recruit__halo{width:380px;height:380px}}
@media (max-width:600px){.recruit{padding:64px 0}.recruit__col{padding:18px}}

/* Jogo responsavel / +18 */
.footer__responsible{max-width:var(--max,1200px);margin:40px auto 0;display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02)}
.footer__responsible p{margin:0;font-size:12.5px;line-height:1.55;color:#8b8f99}
.footer__age{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:30px;padding:0 9px;border-radius:8px;font:800 14px/1 'JetBrains Mono',monospace;letter-spacing:.02em;color:#0a0f0a;background:#22ff66;box-shadow:0 0 0 1px rgba(34,255,102,.3),0 6px 18px -8px rgba(34,255,102,.5)}
.cta__responsible{margin:22px auto 0;display:flex;align-items:center;justify-content:center;gap:10px;font-size:12.5px;letter-spacing:.04em;color:#9fbba8}
.cta__age{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:26px;padding:0 8px;border-radius:7px;font:800 13px/1 'JetBrains Mono',monospace;color:#0a0f0a;background:#22ff66;box-shadow:0 0 0 1px rgba(34,255,102,.3)}
@media (max-width:600px){.footer__responsible{margin-top:28px}.cta__responsible{flex-direction:column;gap:8px;text-align:center}}

/* Navbar online badge */
.topbar__online{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;border:1px solid rgba(34,255,102,.22);background:rgba(34,255,102,.06);color:#d7f5e3;text-decoration:none;font-size:13px;line-height:1;transition:border-color .2s,background .2s,transform .2s}
.topbar__online:hover{border-color:rgba(34,255,102,.45);background:rgba(34,255,102,.1);transform:translateY(-1px)}
.topbar__online strong{font:800 13px/1 'JetBrains Mono',monospace;color:#22ff66;letter-spacing:.01em}
.topbar__online-label{color:#9fbba8;text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:700}
.topbar__online-dot{width:8px;height:8px;border-radius:50%;background:#22ff66;box-shadow:0 0 10px #22ff66;animation:onlinePulse 1.8s ease-in-out infinite}
@keyframes onlinePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}
@media (prefers-reduced-motion:reduce){.topbar__online-dot{animation:none}}
@media (max-width:820px){.topbar__online-label{display:none}}
@media (max-width:600px){.topbar__online{padding:6px 10px}}

/* ============================================================
   VIBE GERAL v2 — polish global premium (2026-05-28)
   Escopo .landing (carrega por último, vence). Sem mudar markup.
   ============================================================ */

/* Fundo cinematográfico: glows ambientes verdes + base mais profunda */
body.landing{
  background:
    radial-gradient(ellipse 90% 55% at 50% -8%, rgba(34,255,102,.09), transparent 60%),
    radial-gradient(ellipse 70% 50% at 100% 4%, rgba(34,255,102,.05), transparent 55%),
    radial-gradient(ellipse 80% 60% at 0% 100%, rgba(34,255,102,.045), transparent 60%),
    #050805;
}

/* Eyebrow vira PILL premium em todas as seções (mudança visível geral) */
.landing .section__eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  padding:8px 18px;margin-bottom:22px;border-radius:999px;
  border:1px solid rgba(34,255,102,.24);
  background:linear-gradient(180deg,rgba(34,255,102,.1),rgba(34,255,102,.03));
  color:#8dffb4;font-size:11.5px;font-weight:800;letter-spacing:.22em;
  box-shadow:0 0 0 4px rgba(34,255,102,.025),0 10px 26px -14px rgba(34,255,102,.55);
}
.landing .section__eyebrow::before{
  content:'';flex-shrink:0;width:7px;height:7px;border-radius:50%;
  background:#22ff66;box-shadow:0 0 12px #22ff66;
  animation:onlinePulse 1.9s ease-in-out infinite;
}
.landing .section__eyebrow .dot{display:none}

/* Divisor neon decorativo acima do título de cada seção (ritmo) */
.landing .section__head{position:relative}
.landing .section__head::before{
  content:'';position:absolute;top:-38px;left:50%;transform:translateX(-50%);
  width:130px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(34,255,102,.55),transparent);
}

/* Títulos maiores + glow sutil; .accent mais vivo */
.landing .section__title{
  font-size:clamp(32px,4.8vw,58px);
  letter-spacing:-.03em;line-height:1.02;
  text-shadow:0 2px 50px rgba(34,255,102,.1);
}
.landing .section__lead{font-size:18px;line-height:1.65;color:#9fbcab}
.landing .accent{
  background:linear-gradient(180deg,#a6ffc8 0%,#22ff66 55%,#00b340 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 16px rgba(34,255,102,.4));
}

/* Respiro maior entre seções */
.landing .section{padding-top:112px;padding-bottom:112px}

/* Botão primário — verde mais fundo, brilho CONTROLADO (não estourar) */
.landing .btn--primary{
  background:linear-gradient(135deg,#19c95e 0%,#0a8c40 100%);
  color:#04210e;
  box-shadow:0 8px 22px -10px rgba(20,180,80,.45),0 0 0 1px rgba(20,180,80,.2),inset 0 1px 0 rgba(255,255,255,.18);
}
.landing .btn--primary:hover{
  transform:translateY(-2px);
  background:linear-gradient(135deg,#1fd968 0%,#0c9a47 100%);
  box-shadow:0 14px 32px -12px rgba(20,180,80,.55),0 0 0 1px rgba(20,180,80,.32),inset 0 1px 0 rgba(255,255,255,.24);
}

/* Cards com highlight de topo + hover mais forte (profundidade) */
.landing .modcard{box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 34px -22px rgba(0,0,0,.75)}
.landing .modcard:hover{box-shadow:0 34px 66px -22px rgba(0,0,0,.7),0 0 52px -10px var(--accent-glow)}

@media (max-width:768px){
  .landing .section{padding-top:80px;padding-bottom:80px}
  .landing .section__head::before{top:-28px;width:96px}
}

/* ============ HERO — fundo operador cinematográfico (2026-05-28) ============ */
.landing .hero__bg{
  background-image:
    linear-gradient(90deg,#050805 0%,rgba(5,8,5,.9) 30%,rgba(5,8,5,.35) 58%,transparent 100%),
    linear-gradient(0deg,#050805 0%,rgba(5,8,5,.35) 20%,transparent 46%),
    url('/img/landing/hero-operator.webp');
  background-size:cover,cover,cover;
  background-position:center,center,right center;
  background-repeat:no-repeat;
}
/* glow original mais discreto pra não lavar a foto */
.landing .hero__bg-glow{opacity:.28}
.landing .hero__bg-streaks{opacity:.4}
/* esconde personagem recortado, floatcards e coluna central vazia */
.landing .hero__char{display:none}
.landing .floatcard{display:none}
.landing .hero__side{display:none}

/* Layout: texto + RANKING empilhados na esquerda (área preta); operador livre à direita */
.landing .hero__inner{
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  grid-template-areas:"content op" "live op";
  align-items:start;
  min-height:auto;
}
.landing .hero__content{grid-area:content}
.landing .hero__livearea{grid-area:live;display:flex;justify-content:flex-start;margin-top:26px}

/* Ranking COMPACTO no hero (versão enxuta do topcard) */
.landing .hero__livearea .topcard{max-width:520px;width:100%;padding:14px}
.landing .hero__livearea .topcard__header{padding-bottom:10px;margin-bottom:10px}
.landing .hero__livearea .topcard__list{gap:6px}
.landing .hero__livearea .topcard__rowlink{grid-template-columns:24px 34px minmax(0,1fr) auto;gap:9px;padding:6px 10px 6px 12px}
.landing .hero__livearea .topcard__avatar{width:34px;height:34px;border-radius:10px;font-size:12px}
.landing .hero__livearea .topcard__pos{width:24px;height:24px;font-size:11px}
.landing .hero__livearea .topcard__name{gap:2px}
.landing .hero__livearea .topcard__name strong{font-size:12.5px}
.landing .hero__livearea .topcard__name small{font-size:9.5px}
.landing .hero__livearea .topcard__wins{min-width:46px;padding:3px 7px}
.landing .hero__livearea .topcard__wins strong{font-size:14px}

@media (max-width:1024px){
  /* mobile/tablet: foto vira camada de fundo escurecida, texto sempre na frente */
  .landing .hero__bg{
    background-image:
      linear-gradient(180deg,rgba(5,8,5,.82) 0%,rgba(5,8,5,.7) 45%,#050805 100%),
      url('/img/landing/hero-operator.webp');
    background-size:cover,cover;
    background-position:center,center right -40px;
  }
  .landing .hero__inner{grid-template-columns:1fr;grid-template-areas:"content" "live"}
  .landing .hero__livearea{justify-content:center;margin-top:20px}
  .landing .hero__livearea .topcard{max-width:560px}
}

/* ============ LANDING V3 - mediator premium refresh ============ */
body.landing{
  --gold:#f3c96b;
  --cyan:#74f7ff;
  --panel:rgba(3,10,6,.7);
  background:
    linear-gradient(180deg,rgba(3,8,5,.82),rgba(3,8,5,.98) 720px),
    url('/img/landing/hero-arena-premium.webp') center top / cover,
    #030604;
}

body.landing::before{
  background:
    radial-gradient(ellipse 58% 32% at 68% 4%, rgba(116,247,255,.08), transparent 68%),
    radial-gradient(ellipse 54% 36% at 12% 18%, rgba(243,201,107,.06), transparent 70%),
    linear-gradient(90deg, rgba(91,242,143,.07), transparent 22%, transparent 76%, rgba(116,247,255,.045));
  opacity:.95;
}

.landing .hero{
  min-height:calc(100vh - var(--header-h));
  padding-top:52px;
  padding-bottom:28px;
}

.landing .hero__bg{
  background-image:
    linear-gradient(90deg,rgba(3,8,5,.96) 0%,rgba(3,8,5,.84) 33%,rgba(3,8,5,.36) 66%,rgba(3,8,5,.78) 100%),
    linear-gradient(180deg,transparent 0%,rgba(3,8,5,.18) 56%,#030604 100%),
    url('/img/landing/hero-arena-premium.webp');
  background-size:cover,cover,cover;
  background-position:center,center,center top;
  background-repeat:no-repeat;
}

.landing .hero__inner{
  grid-template-columns:minmax(380px,.96fr) minmax(300px,.72fr) minmax(310px,.72fr);
  grid-template-areas:"content character live";
  align-items:center;
  gap:26px;
  min-height:calc(100vh - var(--header-h) - 150px);
}

.landing .hero__content{grid-area:content}
.landing .hero__side{
  grid-area:character;
  display:flex;
  min-height:610px;
  align-self:end;
}
.landing .hero__livearea{
  grid-area:live;
  display:flex;
  justify-content:flex-end;
  margin-top:0;
}

.landing .hero__badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  max-width:100%;
  padding:9px 13px;
  margin-bottom:16px;
  border-radius:999px;
  color:#dfffea;
  background:linear-gradient(180deg,rgba(126,255,168,.12),rgba(116,247,255,.035));
  border:1px solid rgba(126,255,168,.3);
  box-shadow:0 14px 38px -28px rgba(126,255,168,.9), inset 0 1px 0 rgba(255,255,255,.09);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.landing .hero__badge-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 16px rgba(243,201,107,.8);
  flex:0 0 auto;
}

.landing .hero__badge span:not(.hero__badge-dot) + span::before{
  content:'';
  display:inline-block;
  width:1px;
  height:12px;
  margin:0 10px 0 0;
  vertical-align:-2px;
  background:rgba(223,255,234,.22);
}

.landing .hero__title{
  max-width:680px;
  margin-top:0;
  font-size:clamp(50px,6.9vw,98px);
  line-height:.86;
  letter-spacing:-.018em;
}

.landing .hero__title-accent,
.landing .accent{
  background:linear-gradient(96deg,#f8ffe9 0%,#7effa8 42%,#74f7ff 74%,#f3c96b 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 10px 28px rgba(126,255,168,.28));
}

.landing .hero__sub{
  color:#cfe9d5;
  max-width:650px;
}

.landing .hero__safety{
  border-style:solid;
  border-color:rgba(116,247,255,.24);
  background:linear-gradient(90deg,rgba(116,247,255,.07),rgba(126,255,168,.055));
}

.landing .hero__trust li,
.landing .hero__receipt,
.landing .hero__feature,
.landing .topcard,
.landing .floatcard{
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),transparent 42%),
    rgba(3,10,6,.74);
  border-color:rgba(126,255,168,.22);
  box-shadow:0 24px 58px -42px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.055);
}

.landing .hero__trust li:nth-child(2n),
.landing .hero__feature:nth-child(2n){
  border-color:rgba(116,247,255,.18);
}

.landing .hero__receipt{
  background:linear-gradient(90deg,rgba(126,255,168,.22),rgba(116,247,255,.2),rgba(243,201,107,.18));
}

.landing .hero__receipt span{
  color:#dfffea;
  background:rgba(3,8,5,.84);
}

.landing .hero__char{
  display:flex;
  width:min(520px,100%);
  max-width:520px;
  transform:translateX(-8px);
}

.landing .hero__char img{
  width:100%;
  max-height:680px;
  object-fit:contain;
  object-position:center bottom;
  mix-blend-mode:screen;
  filter:
    drop-shadow(0 38px 68px rgba(0,0,0,.86))
    drop-shadow(0 0 48px rgba(126,255,168,.25))
    drop-shadow(0 0 20px rgba(116,247,255,.12));
  -webkit-mask-image:radial-gradient(ellipse 72% 92% at 50% 50%, #000 52%, transparent 100%);
  mask-image:radial-gradient(ellipse 72% 92% at 50% 50%, #000 52%, transparent 100%);
}

.landing .hero__side::before{
  width:92%;
  height:86%;
  left:4%;
  top:8%;
  background:
    radial-gradient(ellipse 48% 58% at 52% 46%, rgba(126,255,168,.32), transparent 70%),
    conic-gradient(from 220deg at 50% 50%, transparent 0 18%, rgba(116,247,255,.18) 19% 22%, transparent 23% 58%, rgba(243,201,107,.16) 59% 62%, transparent 63% 100%);
  filter:blur(24px);
  opacity:.92;
}

.landing .hero__side::after{
  width:86%;
  height:92%;
  opacity:.38;
  background:
    repeating-linear-gradient(90deg,transparent 0 24px,rgba(126,255,168,.085) 24px 25px),
    radial-gradient(ellipse at top,rgba(255,255,255,.1),transparent 44%);
}

.landing .floatcard{
  display:flex;
  border-radius:14px;
  backdrop-filter:blur(20px);
}

.landing .floatcard--top{top:13%;left:-2%}
.landing .floatcard--mid{top:42%;right:-6%;left:auto}
.landing .floatcard--bot{bottom:12%;left:5%}
.landing .floatcard__icon{background:linear-gradient(135deg,#7effa8,#74f7ff);color:#031008}
.landing .floatcard--mid .floatcard__icon{background:linear-gradient(135deg,#f3c96b,#7effa8)}

.landing .hero__livearea .topcard{
  max-width:390px;
  padding:18px;
  border-radius:18px;
  backdrop-filter:blur(20px);
}

.landing .topcard__trophy{
  background:linear-gradient(135deg,#f3c96b,#7effa8);
  color:#031008;
}

.landing .topcard__see{
  border-color:rgba(126,255,168,.34);
}

.landing .hero__features{
  margin-top:18px;
  border-color:rgba(126,255,168,.22);
  background:linear-gradient(90deg,rgba(3,10,6,.78),rgba(3,10,6,.54));
}

.landing .section--alt{
  background:
    radial-gradient(ellipse 60% 26% at 80% 8%,rgba(116,247,255,.045),transparent 70%),
    linear-gradient(90deg,rgba(126,255,168,.06),transparent 34%,transparent 68%,rgba(243,201,107,.035)),
    rgba(7,9,6,.96);
}

.landing .cta{
  background:
    linear-gradient(90deg,rgba(3,8,5,.94),rgba(3,8,5,.72)),
    url('/img/landing/hero-arena-premium.webp') center / cover;
}

.landing .cta__inner{
  border-color:rgba(126,255,168,.28);
  background:
    linear-gradient(110deg,rgba(3,8,5,.94),rgba(3,8,5,.7) 52%,rgba(116,247,255,.07)),
    rgba(3,8,5,.8);
}

.landing .about-stage__char,
.landing .recruit__ghost{
  mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 72% 88% at 50% 48%, #000 54%, transparent 100%);
  mask-image:radial-gradient(ellipse 72% 88% at 50% 48%, #000 54%, transparent 100%);
}

@media (max-width:1180px){
  .landing .hero__inner{
    grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);
    grid-template-areas:"content character" "live live";
    gap:20px;
  }
  .landing .hero__side{min-height:520px}
  .landing .hero__livearea{justify-content:center}
  .landing .hero__livearea .topcard{max-width:720px}
}

@media (max-width:820px){
  .landing .hero{
    padding-top:34px;
  }
  .landing .hero__bg{
    background-image:
      linear-gradient(180deg,rgba(3,8,5,.8),rgba(3,8,5,.72) 44%,#030604 88%),
      url('/img/landing/hero-arena-premium.webp');
    background-position:center top;
  }
  .landing .hero__inner{
    grid-template-columns:1fr;
    grid-template-areas:"content" "character" "live";
    min-height:0;
  }
  .landing .hero__content{
    text-align:left;
  }
  .landing .hero__title{
    font-size:clamp(42px,14vw,68px);
  }
  .landing .hero__side{
    min-height:440px;
    order:0;
  }
  .landing .hero__char{
    max-width:360px;
    transform:none;
  }
  .landing .floatcard--top{left:6%;top:5%}
  .landing .floatcard--mid{right:4%;top:36%}
  .landing .floatcard--bot{left:8%;bottom:4%}
  .landing .hero__badge{
    font-size:10.5px;
    flex-wrap:wrap;
    border-radius:16px;
  }
  .landing .hero__receipt{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:560px){
  .landing .hero__cta .btn{
    width:100%;
  }
  .landing .hero__trust{
    grid-template-columns:1fr;
  }
  .landing .hero__side{
    min-height:390px;
  }
  .landing .floatcard{
    transform:scale(.9);
  }
  .landing .floatcard--mid{
    top:44%;
    right:-2%;
  }
  .landing .hero__features{
    margin-top:10px;
  }
}

/* Mobile containment pass: keep the premium hero inside the viewport. */
@media (max-width:768px){
  html,
  body.landing{
    width:100%;
    max-width:100vw;
    overflow-x:hidden;
  }

  .landing .topbar{
    overflow:hidden;
  }

  .landing .topbar__inner{
    width:100%;
    max-width:100%;
    padding-inline:14px;
    gap:8px;
  }

  .landing .topbar__brand{
    flex:1 1 auto;
    min-width:0;
    gap:8px;
  }

  .landing .topbar__logo{
    width:34px;
    height:34px;
  }

  .landing .topbar__brand-text{
    min-width:0;
  }

  .landing .topbar__brand-text strong{
    font-size:15px;
  }

  .landing .topbar__actions{
    flex:0 0 auto;
    min-width:0;
    gap:8px;
  }

  .landing .topbar__actions .btn{
    display:none !important;
  }

  .landing .topbar__online{
    display:none;
  }

  .landing .topbar__online-dot{
    flex:0 0 7px;
    width:7px;
    height:7px;
  }

  .landing .topbar__online strong{
    font-size:12px;
  }

  .landing .topbar__burger{
    display:inline-flex;
    flex:0 0 40px;
    width:40px;
    height:40px;
  }

  .landing .hero{
    padding-inline:16px;
    overflow:hidden;
  }

  .landing .hero__inner{
    width:100%;
    max-width:100%;
    grid-template-columns:minmax(0,1fr) !important;
    overflow:hidden;
  }

  .landing .hero__content,
  .landing .hero__livearea,
  .landing .hero__livearea .topcard{
    width:100%;
    max-width:100% !important;
    min-width:0;
  }

  .landing .hero__content{
    overflow:hidden;
  }

  .landing .hero__title,
  .landing .hero__sub,
  .landing .hero__safety,
  .landing .hero__cta,
  .landing .hero__trust,
  .landing .hero__receipt{
    width:100%;
    max-width:100% !important;
    min-width:0;
  }

  .landing .hero__title{
    font-size:clamp(40px,12.2vw,54px) !important;
    overflow-wrap:break-word;
  }

  .landing .hero__sub,
  .landing .hero__safety{
    overflow-wrap:anywhere;
  }

  .landing .hero__receipt{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .landing .hero__receipt span{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .landing .hero__side{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }

  .landing .floatcard--mid{
    right:0;
    max-width:150px;
  }

  .landing .sticky-cta{
    left:16px;
    right:16px;
    width:auto;
    max-width:none;
  }
}

/* LANDING V4 - skull mascot art direction */
body.landing{
  background:
    linear-gradient(180deg,rgba(3,8,5,.78),rgba(3,8,5,.98) 760px),
    url('/img/landing/hero-skull-bg.webp') center top / cover,
    #030604;
}

.landing .hero__bg{
  background-image:
    linear-gradient(90deg,rgba(3,8,5,.97) 0%,rgba(3,8,5,.83) 35%,rgba(3,8,5,.26) 68%,rgba(3,8,5,.64) 100%),
    linear-gradient(180deg,transparent 0%,rgba(3,8,5,.12) 56%,#030604 100%),
    url('/img/landing/hero-skull-bg.webp');
  background-size:cover,cover,cover;
  background-position:center,center,center top;
}

.landing .hero__bg-glow,
.landing .hero__side::before{
  opacity:.48;
}

.landing .hero__char{
  width:min(640px,112%);
  max-width:640px;
  transform:translate(-44px,-52px) scale(1.24);
}

.landing .hero__char img{
  mix-blend-mode:normal;
  -webkit-mask-image:none;
  mask-image:none;
  filter:
    drop-shadow(0 34px 58px rgba(0,0,0,.78))
    drop-shadow(0 0 22px rgba(88,255,114,.22));
}

.landing .floatcard--top{
  top:30%;
  left:-36%;
}

.landing .floatcard--mid{
  top:50%;
  right:-8%;
}

.landing .floatcard--bot{
  bottom:7%;
  left:-8%;
}

.landing .about-stage__char,
.landing .recruit__ghost{
  mix-blend-mode:normal;
  -webkit-mask-image:none;
  mask-image:none;
  filter:
    drop-shadow(0 26px 52px rgba(0,0,0,.68))
    drop-shadow(0 0 20px rgba(88,255,114,.18));
}

.landing .cta{
  background:
    linear-gradient(90deg,rgba(3,8,5,.96),rgba(3,8,5,.74)),
    url('/img/landing/hero-skull-bg.webp') center / cover;
}

@media (max-width:820px){
  .landing .hero__bg{
    background-image:
      linear-gradient(180deg,rgba(3,8,5,.84),rgba(3,8,5,.72) 44%,#030604 88%),
      url('/img/landing/hero-skull-bg.webp');
    background-position:center top;
  }

  .landing .hero__char{
    max-width:380px;
    transform:none;
  }

  .landing .floatcard--top{left:6%;top:5%}
  .landing .floatcard--mid{right:4%;top:36%}
  .landing .floatcard--bot{left:8%;bottom:4%}
}

/* ============================================================
   PERFORMANCE — render off-screen sections lazily.
   O browser pula paint + pausa animacoes das secoes fora da
   viewport. Hero (above-the-fold) fica de fora de proposito.
   contain-intrinsic-size reserva altura p/ evitar pulo de scroll.
   ============================================================ */
.landing__main > .section,
.landing__main > .cta,
.landing__main > .recruit {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

/* Respeita usuarios que pedem menos movimento e poupa CPU:
   desliga as animacoes infinitas (auras, pulsos, spins). */
@media (prefers-reduced-motion: reduce) {
  .landing *,
  .landing *::before,
  .landing *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============ Ghost about + recruit (transparent PNG, 2026-05-31) ============ */
/* recruit v2 aponta pro conteúdo → remove o scaleX(-1) do base que inverteria o gesto */
.landing .recruit__ghost--v2{
  transform:rotate(-2deg);
  filter:
    drop-shadow(0 28px 54px rgba(0,0,0,.72))
    drop-shadow(0 0 34px rgba(54,232,117,.30))
    drop-shadow(0 0 16px rgba(54,232,117,.18));
}
.landing .about-stage__char{
  object-position:center bottom;
  filter:
    drop-shadow(0 30px 56px rgba(0,0,0,.7))
    drop-shadow(0 0 40px rgba(54,232,117,.26))
    drop-shadow(0 0 18px rgba(54,232,117,.14));
}

/* ============ HERO — Ghost operator (transparent PNG, 2026-05-31) ============ */
/* PNG já tem glow verde + fundo transparente → blend NORMAL, sem máscara que cortaria o corpo escuro. */
.landing .hero__char--ghost{
  display:flex;
  width:min(560px,100%);
  max-width:560px;
  transform:translateX(-6px);
  justify-content:center;
}
.landing .hero__char--ghost img{
  width:100%;
  max-height:720px;
  object-fit:contain;
  object-position:center bottom;
  mix-blend-mode:normal;          /* corrige: 'screen' apagaria o tático preto */
  -webkit-mask-image:none;
          mask-image:none;
  filter:
    drop-shadow(0 40px 64px rgba(0,0,0,.78))
    drop-shadow(0 0 60px rgba(54,232,117,.32))
    drop-shadow(0 0 26px rgba(54,232,117,.18));
  animation:ghostFloat 6.5s ease-in-out infinite;
  will-change:transform;
}
@keyframes ghostFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
/* halo de chão sob o Ghost */
.landing .hero__char--ghost::after{
  content:"";position:absolute;left:50%;bottom:2%;transform:translateX(-50%);
  width:62%;height:26px;border-radius:50%;z-index:-1;
  background:radial-gradient(ellipse at center, rgba(54,232,117,.45), transparent 72%);
  filter:blur(14px);opacity:.6;
}
@media (prefers-reduced-motion:reduce){
  .landing .hero__char--ghost img{animation:none}
}
@media (max-width:1024px){
  /* tablet/mobile: hero volta a 1 coluna na V3? char fica grande — limita */
  .landing .hero__char--ghost{max-width:420px;margin:0 auto}
  .landing .hero__char--ghost img{max-height:560px}
}

/* ════════════════════════════════════════════════════════════════
   PREMIUM FX v1 — 2026-06-03. Efeitos/animações da landing.
   Escopo .landing. Scroll-driven CSS puro (sem JS). Reduced-motion safe.
   ════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:no-preference){
  /* Hero — entrada cinematográfica escalonada */
  .landing .hero__badge{animation:fxUp .6s cubic-bezier(.21,.6,.36,1) both;animation-delay:.05s}
  .landing .hero__title{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.12s}
  .landing .hero__sub{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.20s}
  .landing .hero__cta{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.28s}
  .landing .hero__safety{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.34s}
  .landing .hero__trust{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.40s}
  .landing .hero__receipt{animation:fxUp .7s cubic-bezier(.21,.6,.36,1) both;animation-delay:.46s}
  .landing .hero__side{animation:fxFade 1.1s ease both;animation-delay:.30s}
  .landing .hero__livearea{animation:fxUp .8s cubic-bezier(.21,.6,.36,1) both;animation-delay:.5s}

  /* Ranking entra em cascata */
  .landing .topcard__row,.landing .topcard__skeleton-row{animation:fxRowIn .55s cubic-bezier(.21,.6,.36,1) both}
  .landing .topcard__row:nth-child(1),.landing .topcard__skeleton-row--1{animation-delay:.62s}
  .landing .topcard__row:nth-child(2),.landing .topcard__skeleton-row--2{animation-delay:.70s}
  .landing .topcard__row:nth-child(3),.landing .topcard__skeleton-row--3{animation-delay:.78s}
  .landing .topcard__row:nth-child(4){animation-delay:.86s}
  .landing .topcard__row:nth-child(5){animation-delay:.94s}
}
@keyframes fxUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fxFade{from{opacity:0}to{opacity:1}}
@keyframes fxRowIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}

/* Reveal ao rolar — scroll-driven CSS puro (sem suporte = sempre visível) */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    /* Seção: só opacidade (não cria containing-block → não quebra sticky/fixed) */
    .landing .section{animation:fxSection linear both;animation-timeline:view();animation-range:entry 0% entry 28%}
    /* Cards internos sobem ao entrar (stagger natural pelo scroll) */
    .landing .modcard,
    .landing .team-card--v3,
    .landing .faq__item,
    .landing .step,
    .landing .recruit__card{
      animation:fxCardIn linear both;animation-timeline:view();animation-range:entry 0% entry 32%;
    }
  }
}
@keyframes fxSection{from{opacity:0}to{opacity:1}}
@keyframes fxCardIn{from{opacity:0;transform:translateY(34px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Parallax do glow/streaks do hero ao rolar (decorativo, aria-hidden) */
@supports (animation-timeline: scroll()){
  @media (prefers-reduced-motion:no-preference){
    .landing .hero__bg-glow{animation:fxGlowPar linear both;animation-timeline:scroll(root);animation-range:0 700px}
    .landing .hero__bg-streaks{animation:fxStreakPar linear both;animation-timeline:scroll(root);animation-range:0 700px}
  }
}
@keyframes fxGlowPar{from{transform:translateY(0)}to{transform:translateY(90px)}}
@keyframes fxStreakPar{from{transform:translateY(0)}to{transform:translateY(-50px)}}

/* Micro-hover premium */
.landing .btn--primary{transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s ease,filter .2s ease}
.landing .btn--primary:hover{transform:translateY(-2px)}
.landing .floatcard{transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease}
.landing .floatcard:hover{transform:translateY(-4px) scale(1.03)}

/* Guard reduced-motion (entrada de hero/ranking) */
@media (prefers-reduced-motion:reduce){
  .landing .hero__badge,.landing .hero__title,.landing .hero__sub,.landing .hero__cta,
  .landing .hero__safety,.landing .hero__trust,.landing .hero__receipt,.landing .hero__side,
  .landing .hero__livearea,.landing .topcard__row,.landing .topcard__skeleton-row{animation:none !important}
}

/* ════════════════════════════════════════════════════════════════
   LANDING FACELIFT v2 — Cyber HUD + Cinematic Luxe (2026-06-03)
   Escopo .landing. Override aditivo. Respeita NÃO MEXER + reduced-motion.
   ════════════════════════════════════════════════════════════════ */
/* Conteúdo sempre acima dos overlays */
.landing .hero{position:relative;isolation:isolate}
.landing .hero__inner{position:relative;z-index:2}

/* CINEMATIC: vinheta dramática (foca o centro-direita onde está o ghost) */
.landing .hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(125% 95% at 68% 42%, transparent 38%, rgba(0,0,0,.5) 100%);
}
/* HUD: scanline sutil sobre o hero */
.landing .hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(180deg, rgba(120,255,170,.035) 0 1px, transparent 1px 5px);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 80%);
          mask-image:linear-gradient(180deg,#000,transparent 80%);
  animation:hudScan 9s linear infinite;
}
@keyframes hudScan{from{background-position:0 0}to{background-position:0 120px}}

/* HUD: badge vira moldura de colchete (cantos retos + mono + brackets) */
.landing .hero__badge{
  border-radius:6px !important;
  font-family:'JetBrains Mono',monospace !important;
  position:relative;
}
.landing .hero__badge::before,.landing .hero__badge::after{
  content:"";position:absolute;width:9px;height:9px;border:2px solid rgba(126,255,168,.75);
}
.landing .hero__badge::before{left:-3px;top:-3px;border-right:0;border-bottom:0;border-radius:4px 0 0 0}
.landing .hero__badge::after{right:-3px;bottom:-3px;border-left:0;border-top:0;border-radius:0 0 4px 0}

/* HUD: eyebrow das seções com cursor de terminal piscando */
.landing .section__eyebrow{border-radius:6px !important;font-family:'JetBrains Mono',monospace !important}
.landing .section__eyebrow::after{content:"_";color:var(--accent);margin-left:3px;animation:hudBlink 1.2s steps(1) infinite}
@keyframes hudBlink{50%{opacity:0}}

/* HUD: cards-chave com borda neon + glow */
.landing .modcard,.landing .topcard{
  border:1px solid rgba(126,255,168,.30) !important;
  box-shadow:0 30px 72px -40px rgba(0,0,0,.92), 0 0 22px -10px rgba(126,255,168,.35), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.landing .floatcard{
  font-family:'JetBrains Mono',monospace !important;
  border:1px solid rgba(126,255,168,.30) !important;
  box-shadow:0 0 24px -10px rgba(126,255,168,.45), 0 18px 40px -26px rgba(0,0,0,.9) !important;
}

/* CINEMATIC: título com presença maior + glow no branco */
.landing .hero__title{text-shadow:0 8px 40px rgba(0,0,0,.6)}

@media (prefers-reduced-motion:reduce){
  .landing .hero::after,.landing .section__eyebrow::after{animation:none !important}
}

/* ════════════════════════════════════════════════════════════════
   LANDING FACELIFT v3 — Graphite Gray-Green Pro (vibe Linear/Vercel)
   2026-06-03. Retona TOKENS = recolore tudo. Limpa excesso neon/HUD.
   NÃO toca background image do hero nem markup. Acento verde mantido.
   ════════════════════════════════════════════════════════════════ */
body.landing{
  --bg:#0a0c0e;
  --bg-2:#121519;
  --bg-3:#191d22;
  --bg-card:rgba(23,27,31,.80);
  --bg-card-hover:rgba(31,36,41,.92);
  --border:rgba(255,255,255,.08);
  --border-strong:rgba(255,255,255,.18);
  --text:#eef1f3;
  --text-mute:#9aa6ad;
  --text-dim:#6b7780;
  --accent-glow:rgba(54,232,117,.16);
}
/* Superfícies graphite + hairline neutro (menos flood verde, mais pro) */
.landing .modcard,.landing .topcard,.landing .floatcard,
.landing .hero__trust li,.landing .hero__receipt,.landing .hero__safety,
.landing .step,.landing .faq__item,.landing .recruit__card{
  border-color:rgba(255,255,255,.09) !important;
  box-shadow:0 24px 60px -42px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
/* Limpa o HUD — profissional clean, não terminal */
.landing .hero::after{display:none !important}
.landing .hero__badge{border-radius:999px !important;font-family:inherit !important}
.landing .hero__badge::before,.landing .hero__badge::after{display:none !important}
.landing .section__eyebrow::after{content:none !important}
/* Vinheta cinematográfica mais suave */
.landing .hero::before{background:radial-gradient(125% 95% at 66% 42%, transparent 48%, rgba(0,0,0,.40) 100%) !important}
/* Tipografia mais apertada/pro */
.landing .section__title,.landing .hero__title{letter-spacing:-.022em}