:root {
  --bg: #05030a;
  --panel: rgba(255,255,255,0.075);
  --panel-strong: rgba(255,255,255,0.12);
  --border: rgba(255,255,255,0.16);
  --text: #f8fafc;
  --muted: #a1a1aa;
  --blue: #00d9ff;
  --pink: #ff3df2;
  --gold: #f7c948;
  --green: #33ff99;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(0,217,255,0.20), transparent 30%),
    radial-gradient(circle at bottom right, rgba(255,61,242,0.18), transparent 38%),
    radial-gradient(circle at center, rgba(247,201,72,0.06), transparent 28%),
    var(--bg);
  color: var(--text);
  font-family: Arial, Helvetica, sans-serif;
  overflow-x: hidden;
}

#canvas-bg {
  position: fixed;
  inset: 0;
  z-index: -3;
}

.mouse-light {
  position: fixed;
  width: 420px;
  height: 420px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(0,217,255,0.16), transparent 65%);
  filter: blur(20px);
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -2;
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 76px;
  padding: 0 7%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(5,3,10,0.72);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  z-index: 30;
}

.logo {
  font-weight: 900;
  letter-spacing: 2px;
  font-size: 1.05rem;
}

.logo span {
  color: var(--blue);
}

nav {
  display: flex;
  gap: 22px;
}

nav a {
  color: var(--muted);
  text-decoration: none;
  font-size: 0.95rem;
  transition: 0.25s;
}

nav a:hover {
  color: var(--blue);
}

.hero,
.section {
  min-height: 100vh;
  padding: 120px 7% 90px;
}

.hero {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 60px;
  align-items: center;
}

.eyebrow {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 2.4px;
  font-size: 0.78rem;
  margin-bottom: 18px;
}

h1 {
  font-size: clamp(3.4rem, 8vw, 7.4rem);
  line-height: 0.88;
  letter-spacing: -4px;
  margin-bottom: 24px;
}

h1 span {
  background: linear-gradient(90deg, var(--blue), var(--pink), var(--gold));
  -webkit-background-clip: text;
  color: transparent;
}

h2 {
  font-size: clamp(2.2rem, 5vw, 4.6rem);
  line-height: 0.98;
  letter-spacing: -2px;
  margin-bottom: 22px;
}

#typing {
  min-height: 42px;
  color: var(--blue);
  font-size: clamp(1.1rem, 3vw, 2rem);
  letter-spacing: 0;
}

.intro,
.project-card p,
.books-text p,
.book-item p,
.gallery-card p,
.contact p {
  color: var(--muted);
  line-height: 1.75;
}

.intro {
  max-width: 760px;
  font-size: 1.08rem;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 34px;
}

.btn {
  display: inline-flex;
  padding: 14px 22px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  transition: 0.25s;
}

.btn:hover {
  transform: translateY(-4px);
}

.primary {
  color: #020617;
  background: linear-gradient(90deg, var(--blue), var(--green), var(--gold));
  box-shadow: 0 16px 40px rgba(0,217,255,0.18);
}

.secondary {
  color: var(--text);
  background: var(--panel);
  border: 1px solid var(--border);
}

.hero-visual {
  position: relative;
  min-height: 580px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.image-frame {
  width: min(420px, 82vw);
  aspect-ratio: 0.76;
  padding: 12px;
  border-radius: 42px;
  background: linear-gradient(135deg, rgba(0,217,255,0.55), rgba(255,61,242,0.40), rgba(247,201,72,0.35));
  box-shadow: 0 40px 100px rgba(0,0,0,0.55);
  animation: float 6s ease-in-out infinite;
}

.image-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 32px;
  display: block;
}

.floating-card {
  position: absolute;
  padding: 18px 20px;
  min-width: 160px;
  border: 1px solid var(--border);
  background: rgba(5,3,10,0.72);
  backdrop-filter: blur(18px);
  border-radius: 22px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}

.floating-card strong {
  display: block;
  margin-bottom: 6px;
}

.floating-card span {
  color: var(--muted);
  font-size: 0.9rem;
}

.card-one {
  top: 80px;
  left: 0;
}

.card-two {
  bottom: 80px;
  right: 0;
}

.section-title {
  text-align: center;
  margin-bottom: 58px;
}

.project-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.project-card,
.book-item,
.gallery-card {
  border: 1px solid var(--border);
  background: var(--panel);
  backdrop-filter: blur(18px);
  border-radius: 28px;
  padding: 28px;
  transition: 0.25s;
}

.project-card:hover,
.book-item:hover,
.gallery-card:hover {
  transform: translateY(-8px);
  border-color: rgba(0,217,255,0.55);
  background: var(--panel-strong);
}

.project-card span {
  color: var(--blue);
  font-weight: 900;
}

.project-card h3,
.book-item h3 {
  margin: 16px 0 12px;
  font-size: 1.35rem;
}

.books {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 42px;
  align-items: center;
}

.book-list {
  display: grid;
  gap: 18px;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.gallery-card {
  padding: 12px;
  overflow: hidden;
}

.gallery-card img {
  width: 100%;
  aspect-ratio: 0.78;
  object-fit: cover;
  display: block;
  border-radius: 20px;
  margin-bottom: 14px;
  background: #111;
}

.gallery-card span {
  display: block;
  color: var(--gold);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  margin-bottom: 6px;
}

.gallery-card p {
  font-size: 0.85rem;
  word-break: break-word;
}

.contact {
  text-align: center;
  min-height: 70vh;
}

.contact .btn {
  margin-top: 28px;
}

footer {
  padding: 32px 7%;
  border-top: 1px solid var(--border);
  color: var(--muted);
  text-align: center;
}

.reveal {
  opacity: 0;
  transform: translateY(34px);
  transition: 0.8s ease;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

@keyframes float {
  0%, 100% {
    transform: translateY(0) rotate(-1deg);
  }

  50% {
    transform: translateY(-22px) rotate(2deg);
  }
}

@media (max-width: 1000px) {
  nav {
    display: none;
  }

  .hero,
  .books {
    grid-template-columns: 1fr;
  }

  .hero-visual {
    min-height: 460px;
  }

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

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

  h1 {
    letter-spacing: -2px;
  }
}

@media (max-width: 560px) {
  .header {
    padding: 0 5%;
  }

  .hero,
  .section {
    padding: 110px 5% 70px;
  }

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

  .floating-card {
    display: none;
  }
}

/* ============================================================
   AJUSTES SID.DEV.BR - TAMANHOS, IMAGENS E ACABAMENTO
   ============================================================ */

:root {
  --hero-image-width: min(360px, 78vw);
  --gallery-image-height: 260px;
  --gallery-image-height-mobile: 340px;
}

/* Reduz um pouco a imagem principal da abertura */
.image-frame {
  width: var(--hero-image-width);
  max-height: 520px;
}

/* Garante que a imagem principal fique elegante e sem deformar */
.image-frame img {
  object-fit: cover;
  object-position: center;
}

/* Deixa a area visual da abertura mais compacta */
.hero-visual {
  min-height: 500px;
}

/* Melhora o tamanho dos cards da galeria */
.gallery-card img {
  height: var(--gallery-image-height);
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center top;
}

/* Limita textos longos dos nomes de arquivos */
.gallery-card p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Cria um acabamento mais premium nos cards */
.project-card,
.book-item,
.gallery-card {
  position: relative;
  overflow: hidden;
}

.project-card::before,
.book-item::before,
.gallery-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,217,255,0.10), transparent 45%, rgba(255,61,242,0.08));
  opacity: 0;
  transition: 0.35s;
  pointer-events: none;
}

.project-card:hover::before,
.book-item:hover::before,
.gallery-card:hover::before {
  opacity: 1;
}

/* Melhora a leitura dos textos */
.intro,
.project-card p,
.books-text p,
.book-item p,
.gallery-card p,
.contact p {
  font-size: 1rem;
}

/* Deixa a home menos gigante em telas menores */
@media (max-width: 1000px) {
  .hero-visual {
    min-height: 420px;
  }

  .image-frame {
    width: min(330px, 82vw);
  }

  .gallery-card img {
    height: 300px;
  }
}

@media (max-width: 560px) {
  :root {
    --gallery-image-height: var(--gallery-image-height-mobile);
  }

  h1 {
    font-size: clamp(3rem, 17vw, 4.8rem);
  }

  h2 {
    font-size: clamp(2rem, 12vw, 3.4rem);
  }

  .intro {
    font-size: 1rem;
  }

  .gallery-card img {
    height: var(--gallery-image-height-mobile);
  }
}

/* ============================================================
   AJUSTE SID.DEV.BR - OCULTAR NOMES TECNICOS DAS IMAGENS
   ============================================================ */

/* Nao mostrar nomes como IMG_0121.PNG, IMG_0068.PNG etc. */
.gallery-card p {
  display: none !important;
}

/* Deixa o selo visual mais limpo */
.gallery-card span {
  margin-bottom: 0;
  color: var(--gold);
  font-size: 0.78rem;
  letter-spacing: 1.6px;
}

/* Ajusta o espaco do card depois de remover o nome do arquivo */
.gallery-card {
  padding-bottom: 18px;
}

/* Imagem mais protagonista dentro do card */
.gallery-card img {
  margin-bottom: 12px;
}


/* SID_START_9X16_LIGHTBOX */

/* Galeria em formato vertical 9:16 */
.gallery-grid {
  align-items: start;
}

.gallery-card {
  cursor: pointer;
}

.gallery-card img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 9 / 16 !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 22px;
  cursor: zoom-in;
}

/* Melhor proporcao da grade para imagens verticais */
@media (min-width: 1200px) {
  .gallery-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

@media (max-width: 1199px) and (min-width: 760px) {
  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 759px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 460px) {
  .gallery-grid {
    grid-template-columns: 1fr;
  }
}

/* Lightbox */
.sid-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(0, 0, 0, 0.86);
  backdrop-filter: blur(16px);
}

.sid-lightbox.active {
  display: flex;
}

.sid-lightbox-frame {
  position: relative;
  width: min(430px, 88vw);
  aspect-ratio: 9 / 16;
  border-radius: 28px;
  padding: 10px;
  background: linear-gradient(135deg, rgba(0,217,255,0.75), rgba(255,61,242,0.55), rgba(247,201,72,0.45));
  box-shadow: 0 30px 120px rgba(0,0,0,0.75);
}

.sid-lightbox-frame img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: #05030a;
  border-radius: 20px;
}

.sid-lightbox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 999px;
  background: rgba(5,3,10,0.90);
  color: white;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  transition: 0.25s;
}

.sid-lightbox-close:hover {
  transform: scale(1.08);
  border-color: rgba(0,217,255,0.75);
}

.sid-lightbox-hint {
  position: absolute;
  left: 50%;
  bottom: -38px;
  transform: translateX(-50%);
  color: rgba(255,255,255,0.66);
  font-size: 0.82rem;
  white-space: nowrap;
}

/* SID_END_9X16_LIGHTBOX */


/* SID_START_LIVRO_OFICIAL */

.books-official {
  grid-template-columns: 0.95fr 0.75fr;
}

.book-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 30px;
}

.official-book-card {
  justify-self: center;
  width: min(360px, 82vw);
  border-radius: 34px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(0,217,255,0.65), rgba(255,61,242,0.48), rgba(247,201,72,0.48));
  box-shadow: 0 34px 100px rgba(0,0,0,0.55);
  transition: 0.28s ease;
}

.official-book-card:hover {
  transform: translateY(-8px) rotate(1deg);
}

.official-book-card a {
  display: block;
  text-decoration: none;
}

.official-book-card img {
  width: 100%;
  aspect-ratio: 2 / 3;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: 24px;
  background: #05030a;
}

@media (max-width: 1000px) {
  .books-official {
    grid-template-columns: 1fr;
  }

  .official-book-card {
    margin-top: 26px;
  }
}

/* SID_END_LIVRO_OFICIAL */


/* SID_START_GITHUB_CSS */

.section-lead {
  max-width: 860px;
  margin: 0 auto;
  color: var(--muted);
  line-height: 1.75;
  font-size: 1.05rem;
}

.github-actions {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.github-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.github-card {
  min-height: 260px;
  border: 1px solid var(--border);
  background: var(--panel);
  backdrop-filter: blur(18px);
  border-radius: 28px;
  padding: 28px;
  transition: 0.25s;
  position: relative;
  overflow: hidden;
}

.github-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,217,255,0.10), transparent 45%, rgba(247,201,72,0.08));
  opacity: 0;
  transition: 0.35s;
  pointer-events: none;
}

.github-card:hover {
  transform: translateY(-8px);
  border-color: rgba(0,217,255,0.55);
  background: var(--panel-strong);
}

.github-card:hover::before {
  opacity: 1;
}

.github-card span {
  display: inline-flex;
  margin-bottom: 18px;
  color: var(--gold);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 1.6px;
}

.github-card h3 {
  font-size: 1.35rem;
  margin-bottom: 12px;
  word-break: break-word;
}

.github-card p {
  color: var(--muted);
  line-height: 1.65;
  margin-bottom: 18px;
}

.github-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 18px 0 20px;
}

.github-meta small {
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: var(--muted);
  border-radius: 999px;
  padding: 7px 10px;
}

.github-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.github-links a {
  color: #020617;
  background: linear-gradient(90deg, var(--blue), var(--green), var(--gold));
  text-decoration: none;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 0.9rem;
  font-weight: 800;
}

.github-links a.secondary-link {
  color: var(--text);
  background: rgba(255,255,255,0.08);
  border: 1px solid var(--border);
}

.github-empty {
  grid-column: 1 / -1;
}

@media (max-width: 1000px) {
  .github-grid {
    grid-template-columns: 1fr;
  }
}

/* SID_END_GITHUB_CSS */


/* SID_START_SPOTIFY_MUSICA */

.music-official {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 42px;
  align-items: center;
}

.music-content p {
  color: var(--muted);
  line-height: 1.75;
  font-size: 1.05rem;
  max-width: 720px;
}

.music-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 30px;
}

.spotify-card {
  width: 100%;
  max-width: 620px;
  justify-self: center;
  border-radius: 32px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(0,217,255,0.55), rgba(255,61,242,0.36), rgba(247,201,72,0.32));
  box-shadow: 0 34px 100px rgba(0,0,0,0.55);
}

.spotify-card iframe {
  display: block;
  width: 100%;
  border-radius: 22px;
  background: #05030a;
}

@media (max-width: 1000px) {
  .music-official {
    grid-template-columns: 1fr;
  }

  .spotify-card {
    margin-top: 20px;
  }
}

/* SID_END_SPOTIFY_MUSICA */


/* SID_START_CONTATO_OFICIAL */

.contact-official {
  text-align: center;
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-official p {
  max-width: 760px;
  margin: 0 auto;
  color: var(--muted);
  line-height: 1.75;
  font-size: 1.05rem;
}

.contact-links-official {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 32px;
}

.contact-links-official .btn {
  min-width: 150px;
}

@media (max-width: 560px) {
  .contact-links-official {
    flex-direction: column;
    align-items: center;
  }

  .contact-links-official .btn {
    width: min(100%, 320px);
  }
}

/* SID_END_CONTATO_OFICIAL */


/* SID_START_SPOTIFY_DESTAQUE */

.spotify-showcase {
  display: grid;
  grid-template-columns: 0.95fr 0.85fr;
  gap: 54px;
  align-items: center;
}

.spotify-text p {
  color: var(--muted);
  line-height: 1.75;
  font-size: 1.05rem;
  max-width: 860px;
}

.spotify-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 30px;
}

.spotify-visual {
  justify-self: center;
  width: 100%;
  max-width: 560px;
}

.spotify-glow-card {
  width: 100%;
  border-radius: 34px;
  padding: 12px;
  background: linear-gradient(
    135deg,
    rgba(0,217,255,0.70),
    rgba(255,61,242,0.52),
    rgba(247,201,72,0.45)
  );
  box-shadow: 0 34px 100px rgba(0,0,0,0.55);
  transition: 0.28s ease;
}

.spotify-glow-card:hover {
  transform: translateY(-8px) rotate(1deg);
}

.spotify-glow-card iframe {
  display: block;
  width: 100%;
  border-radius: 24px;
  background: #05030a;
}

@media (max-width: 1000px) {
  .spotify-showcase {
    grid-template-columns: 1fr;
  }

  .spotify-visual {
    max-width: 620px;
    margin-top: 26px;
  }
}

/* SID_END_SPOTIFY_DESTAQUE */

/* ============================================================
   SID_START_VISUAL_PREMIUM_20260612
   Ajustes visuais premium sem dependências externas
   ============================================================ */

/* Hero com atmosfera de laboratório digital */
.hero {
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: 5%;
  top: 18%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 35%,
      rgba(0, 217, 255, 0.34),
      rgba(102, 51, 255, 0.22) 38%,
      rgba(10, 74, 84, 0.16) 58%,
      transparent 72%);
  filter: blur(8px);
  opacity: 0.72;
  animation: sidOrbFloat 9s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}

.hero::after {
  content: "";
  position: absolute;
  width: 720px;
  height: 720px;
  left: -260px;
  bottom: -320px;
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(255, 61, 242, 0.18),
      rgba(0, 217, 255, 0.10) 42%,
      transparent 70%);
  filter: blur(18px);
  opacity: 0.62;
  pointer-events: none;
  z-index: 0;
}

.hero > * {
  position: relative;
  z-index: 1;
}

@keyframes sidOrbFloat {
  0%, 100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(-22px, -28px, 0) scale(1.06);
  }
}

/* Entrada mais refinada por tipo de bloco */
.hero-text.reveal:not(.active),
.books-text.reveal:not(.active),
.spotify-text.reveal:not(.active) {
  transform: translateX(-38px);
}

.hero-visual.reveal:not(.active),
.official-book-card.reveal:not(.active),
.spotify-visual.reveal:not(.active) {
  transform: translateX(38px) scale(0.98);
}

.section-title.reveal:not(.active) {
  transform: translateY(24px);
}

.project-card.reveal:not(.active),
.github-card.reveal:not(.active),
.gallery-card.reveal:not(.active) {
  transform: translateY(42px) scale(0.985);
}

/* Transições mais suaves */
.reveal {
  will-change: opacity, transform;
  transition:
    opacity 0.85s ease,
    transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Ritmo visual nos cards */
.project-card:nth-child(2),
.gallery-card:nth-child(2n) {
  transition-delay: 0.06s;
}

.project-card:nth-child(3),
.gallery-card:nth-child(3n) {
  transition-delay: 0.12s;
}

.project-card:nth-child(4),
.gallery-card:nth-child(4n) {
  transition-delay: 0.18s;
}

/* Acabamento premium nos cards técnicos */
.project-card,
.github-card,
.gallery-card,
.official-book-card,
.spotify-glow-card {
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.project-card:hover,
.github-card:hover,
.gallery-card:hover {
  transform: translateY(-10px);
  box-shadow:
    0 30px 90px rgba(0, 0, 0, 0.34),
    0 0 0 1px rgba(0, 217, 255, 0.18);
}

/* Hero image com presença mais cinematográfica */
.image-frame {
  box-shadow:
    0 34px 120px rgba(0, 0, 0, 0.48),
    0 0 80px rgba(0, 217, 255, 0.12);
}

.image-frame img {
  filter: contrast(1.05) saturate(1.06);
}

/* Cards flutuantes mais tecnológicos */
.floating-card {
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.38),
    0 0 36px rgba(0, 217, 255, 0.10);
}

/* Botões com presença maior, sem exagero */
.btn {
  position: relative;
  overflow: hidden;
}

.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.18), transparent);
  transform: translateX(-120%);
  transition: transform 0.55s ease;
}

.btn:hover::after {
  transform: translateX(120%);
}

/* Livro e Spotify com peso visual equivalente */
.official-book-card,
.spotify-glow-card {
  transform-origin: center;
}

.official-book-card:hover,
.spotify-glow-card:hover {
  box-shadow:
    0 42px 120px rgba(0, 0, 0, 0.58),
    0 0 70px rgba(255, 61, 242, 0.12);
}

/* Acessibilidade: respeita reduzir movimento */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }

  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }

  .hero::before {
    animation: none !important;
  }
}

/* Ajustes mobile */
@media (max-width: 700px) {
  .hero::before {
    width: 340px;
    height: 340px;
    right: -120px;
    top: 170px;
    opacity: 0.5;
  }

  .hero::after {
    width: 420px;
    height: 420px;
    left: -220px;
    bottom: -220px;
  }

  .project-card:hover,
  .github-card:hover,
  .gallery-card:hover,
  .official-book-card:hover,
  .spotify-glow-card:hover {
    transform: none;
  }
}

/* SID_END_VISUAL_PREMIUM_20260612 */


/* ============================================================
   SID_START_DARK_NEUMORPHIC_BUTTONS_20260612
   Botões preto fosco + azul estilo Soft UI / Neumorphism
   ============================================================ */

:root {
  --sid-matte-bg: #080b0f;
  --sid-matte-panel: #101720;
  --sid-matte-panel-soft: #151e29;
  --sid-blue: #00aaff;
  --sid-cyan: #00d9ff;
  --sid-blue-deep: #006dff;
  --sid-text-clear: #f4f7fb;
  --sid-text-muted: #8b96a8;
}

/* Base dos botões */
.btn,
.github-actions .btn,
.book-actions .btn,
.spotify-actions .btn,
.actions .btn {
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 999px;
  background:
    linear-gradient(145deg, #17212d, #0b1017);
  color: var(--sid-text-clear);
  box-shadow:
    10px 10px 24px rgba(0, 0, 0, 0.55),
    -6px -6px 18px rgba(255, 255, 255, 0.035),
    inset 1px 1px 0 rgba(255, 255, 255, 0.05);
  text-shadow: none;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease,
    border-color 0.22s ease,
    color 0.22s ease;
}

/* Botão principal azul */
.btn.primary,
.github-actions .btn.primary,
.book-actions .btn.primary,
.spotify-actions .btn.primary,
.actions .btn.primary {
  color: #ffffff;
  border-color: rgba(0, 217, 255, 0.42);
  background:
    linear-gradient(145deg, #00c8ff, #0077ff 48%, #0647b8);
  box-shadow:
    9px 9px 24px rgba(0, 0, 0, 0.58),
    -5px -5px 16px rgba(255, 255, 255, 0.035),
    0 0 24px rgba(0, 170, 255, 0.28),
    inset 1px 1px 0 rgba(255, 255, 255, 0.26),
    inset -2px -2px 8px rgba(0, 0, 0, 0.22);
}

/* Botão secundário preto fosco */
.btn.secondary,
.github-actions .btn.secondary,
.book-actions .btn.secondary,
.spotify-actions .btn.secondary,
.actions .btn.secondary {
  color: var(--sid-cyan);
  background:
    linear-gradient(145deg, #17202b, #090d13);
  border-color: rgba(0, 217, 255, 0.18);
  box-shadow:
    9px 9px 22px rgba(0, 0, 0, 0.58),
    -5px -5px 16px rgba(255, 255, 255, 0.032),
    inset 1px 1px 0 rgba(255, 255, 255, 0.04);
}

/* Hover: botão levanta e acende */
.btn:hover,
.github-actions .btn:hover,
.book-actions .btn:hover,
.spotify-actions .btn:hover,
.actions .btn:hover {
  transform: translateY(-3px);
  border-color: rgba(0, 217, 255, 0.58);
  box-shadow:
    13px 13px 32px rgba(0, 0, 0, 0.64),
    -6px -6px 18px rgba(255, 255, 255, 0.045),
    0 0 30px rgba(0, 217, 255, 0.22),
    inset 1px 1px 0 rgba(255, 255, 255, 0.08);
}

/* Clique: botão afunda */
.btn:active,
.github-actions .btn:active,
.book-actions .btn:active,
.spotify-actions .btn:active,
.actions .btn:active {
  transform: translateY(1px) scale(0.985);
  box-shadow:
    inset 7px 7px 16px rgba(0, 0, 0, 0.62),
    inset -4px -4px 12px rgba(255, 255, 255, 0.035),
    0 0 18px rgba(0, 217, 255, 0.16);
}

/* Menu superior com efeito fosco */
.header nav a {
  border-radius: 999px;
  padding: 10px 16px;
  color: rgba(244, 247, 251, 0.72);
  transition:
    background 0.22s ease,
    color 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.22s ease;
}

.header nav a:hover {
  color: #ffffff;
  background: linear-gradient(145deg, #151f2b, #090d13);
  box-shadow:
    6px 6px 16px rgba(0, 0, 0, 0.44),
    -3px -3px 10px rgba(255, 255, 255, 0.028),
    0 0 18px rgba(0, 217, 255, 0.14);
  transform: translateY(-1px);
}

/* Botões em telas pequenas */
@media (max-width: 700px) {
  .btn,
  .github-actions .btn,
  .book-actions .btn,
  .spotify-actions .btn,
  .actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .header nav a {
    padding: 8px 10px;
  }
}

/* Acessibilidade */
@media (prefers-reduced-motion: reduce) {
  .btn,
  .header nav a {
    transition: none !important;
  }
}

/* SID_END_DARK_NEUMORPHIC_BUTTONS_20260612 */


/* ============================================================
   SID_START_BOTOES_PRETO_FOSCO_AZUL_20260612
   Botões preto fosco + azul elétrico/ciano + efeito físico
   ============================================================ */

:root {
  --sid-btn-black: #070a0e;
  --sid-btn-black-soft: #101820;
  --sid-btn-black-top: #182431;
  --sid-btn-blue: #008cff;
  --sid-btn-cyan: #00d9ff;
  --sid-btn-cyan-soft: rgba(0, 217, 255, 0.32);
  --sid-btn-text: #f6fbff;
}

/* Base geral dos botões */
.btn,
.actions .btn,
.github-actions .btn,
.book-actions .btn,
.spotify-actions .btn {
  min-height: 48px;
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  background:
    linear-gradient(145deg, var(--sid-btn-black-top), var(--sid-btn-black));
  color: var(--sid-btn-text);
  font-weight: 850;
  letter-spacing: 0.075em;
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  box-shadow:
    10px 10px 24px rgba(0, 0, 0, 0.65),
    -5px -5px 14px rgba(255, 255, 255, 0.035),
    inset 1px 1px 0 rgba(255, 255, 255, 0.07),
    inset -2px -2px 8px rgba(0, 0, 0, 0.38);
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    border-color 0.22s ease,
    background 0.22s ease,
    color 0.22s ease;
}

/* Brilho deslizante sutil */
.btn::after,
.actions .btn::after,
.github-actions .btn::after,
.book-actions .btn::after,
.spotify-actions .btn::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(
      120deg,
      transparent 0%,
      rgba(255, 255, 255, 0.18) 45%,
      transparent 70%
    );
  transform: translateX(-130%);
  transition: transform 0.55s ease;
}

/* Botão primário: azul elétrico/ciano */
.btn.primary,
.actions .btn.primary,
.github-actions .btn.primary,
.book-actions .btn.primary,
.spotify-actions .btn.primary {
  color: #ffffff;
  border-color: rgba(0, 217, 255, 0.55);
  background:
    linear-gradient(145deg, #00d9ff 0%, #008cff 44%, #0346b8 100%);
  box-shadow:
    10px 10px 26px rgba(0, 0, 0, 0.68),
    -5px -5px 14px rgba(255, 255, 255, 0.035),
    0 0 26px rgba(0, 140, 255, 0.34),
    0 0 52px rgba(0, 217, 255, 0.12),
    inset 1px 1px 0 rgba(255, 255, 255, 0.30),
    inset -3px -3px 10px rgba(0, 0, 0, 0.30);
}

/* Botão secundário: preto fosco com borda ciano */
.btn.secondary,
.actions .btn.secondary,
.github-actions .btn.secondary,
.book-actions .btn.secondary,
.spotify-actions .btn.secondary {
  color: var(--sid-btn-cyan);
  border-color: rgba(0, 217, 255, 0.24);
  background:
    linear-gradient(145deg, #17222d 0%, #090d12 100%);
  box-shadow:
    10px 10px 24px rgba(0, 0, 0, 0.66),
    -5px -5px 14px rgba(255, 255, 255, 0.03),
    inset 1px 1px 0 rgba(255, 255, 255, 0.055),
    inset -2px -2px 8px rgba(0, 0, 0, 0.34);
}

/* Hover: botão levanta e acende */
.btn:hover,
.actions .btn:hover,
.github-actions .btn:hover,
.book-actions .btn:hover,
.spotify-actions .btn:hover {
  transform: translateY(-3px);
  border-color: rgba(0, 217, 255, 0.72);
  box-shadow:
    14px 14px 34px rgba(0, 0, 0, 0.72),
    -6px -6px 16px rgba(255, 255, 255, 0.045),
    0 0 28px rgba(0, 217, 255, 0.28),
    inset 1px 1px 0 rgba(255, 255, 255, 0.12);
}

.btn:hover::after,
.actions .btn:hover::after,
.github-actions .btn:hover::after,
.book-actions .btn:hover::after,
.spotify-actions .btn:hover::after {
  transform: translateX(130%);
}

/* Clique: botão afunda fisicamente */
.btn:active,
.actions .btn:active,
.github-actions .btn:active,
.book-actions .btn:active,
.spotify-actions .btn:active {
  transform: translateY(1px) scale(0.985);
  box-shadow:
    inset 7px 7px 16px rgba(0, 0, 0, 0.70),
    inset -4px -4px 12px rgba(255, 255, 255, 0.035),
    0 0 16px rgba(0, 217, 255, 0.18);
}

/* Menu superior com cápsulas foscas */
.header nav a {
  border-radius: 999px;
  padding: 10px 15px;
  color: rgba(246, 251, 255, 0.72);
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease,
    color 0.22s ease;
}

.header nav a:hover {
  color: #ffffff;
  background:
    linear-gradient(145deg, #17222d, #080c12);
  box-shadow:
    7px 7px 16px rgba(0, 0, 0, 0.50),
    -3px -3px 10px rgba(255, 255, 255, 0.030),
    0 0 20px rgba(0, 217, 255, 0.16),
    inset 1px 1px 0 rgba(255, 255, 255, 0.045);
  transform: translateY(-1px);
}

.header nav a:active {
  transform: translateY(1px) scale(0.985);
  box-shadow:
    inset 5px 5px 12px rgba(0, 0, 0, 0.62),
    inset -3px -3px 8px rgba(255, 255, 255, 0.030);
}

/* Cards flutuantes do hero com acabamento de botão físico */
.floating-card {
  border: 1px solid rgba(0, 217, 255, 0.18);
  background:
    linear-gradient(145deg, rgba(23, 34, 45, 0.92), rgba(7, 10, 14, 0.88));
  box-shadow:
    12px 12px 30px rgba(0, 0, 0, 0.58),
    -5px -5px 14px rgba(255, 255, 255, 0.032),
    0 0 24px rgba(0, 217, 255, 0.11),
    inset 1px 1px 0 rgba(255, 255, 255, 0.06);
}

.floating-card strong {
  color: #ffffff;
}

.floating-card span {
  color: var(--sid-btn-cyan);
}

/* Mobile */
@media (max-width: 700px) {
  .btn,
  .actions .btn,
  .github-actions .btn,
  .book-actions .btn,
  .spotify-actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .header nav a {
    padding: 8px 10px;
  }
}

/* Acessibilidade */
@media (prefers-reduced-motion: reduce) {
  .btn,
  .header nav a {
    transition: none !important;
  }

  .btn::after {
    display: none !important;
  }
}

/* SID_END_BOTOES_PRETO_FOSCO_AZUL_20260612 */


/* ============================================================
   SID_START_TESTE_BOTOES_NEUMORPH_DARK_20260612
   Teste: preto fosco + azul elétrico/ciano + botão pressionável
   ============================================================ */

:root {
  --sid-neu-black: #070a0e;
  --sid-neu-black-2: #101820;
  --sid-neu-black-3: #182431;
  --sid-neu-blue: #008cff;
  --sid-neu-cyan: #00d9ff;
  --sid-neu-text: #f6fbff;
}

.btn,
.actions .btn,
.github-actions .btn,
.book-actions .btn,
.spotify-actions .btn {
  min-height: 50px;
  padding: 14px 26px;
  border-radius: 999px;
  border: 1px solid rgba(0, 217, 255, 0.20);
  background: linear-gradient(145deg, #182431, #070a0e);
  color: var(--sid-neu-text);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 850;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  box-shadow:
    10px 10px 24px rgba(0, 0, 0, 0.68),
    -5px -5px 14px rgba(255, 255, 255, 0.035),
    inset 1px 1px 0 rgba(255, 255, 255, 0.075),
    inset -3px -3px 10px rgba(0, 0, 0, 0.35);
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    border-color 0.22s ease,
    background 0.22s ease,
    color 0.22s ease;
}

.btn.primary,
.actions .btn.primary,
.github-actions .btn.primary,
.book-actions .btn.primary,
.spotify-actions .btn.primary {
  background: linear-gradient(145deg, #00d9ff 0%, #008cff 48%, #0346b8 100%);
  border-color: rgba(0, 217, 255, 0.65);
  color: #ffffff;
  box-shadow:
    10px 10px 26px rgba(0, 0, 0, 0.70),
    -5px -5px 14px rgba(255, 255, 255, 0.035),
    0 0 28px rgba(0, 140, 255, 0.34),
    inset 1px 1px 0 rgba(255, 255, 255, 0.30),
    inset -3px -3px 10px rgba(0, 0, 0, 0.30);
}

.btn.secondary,
.actions .btn.secondary,
.github-actions .btn.secondary,
.book-actions .btn.secondary,
.spotify-actions .btn.secondary {
  background: linear-gradient(145deg, #17222d, #080c12);
  color: var(--sid-neu-cyan);
  border-color: rgba(0, 217, 255, 0.28);
}

.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.20), transparent);
  transform: translateX(-130%);
  transition: transform 0.55s ease;
}

.btn:hover {
  transform: translateY(-3px);
  border-color: rgba(0, 217, 255, 0.75);
  box-shadow:
    14px 14px 34px rgba(0, 0, 0, 0.74),
    -6px -6px 16px rgba(255, 255, 255, 0.045),
    0 0 30px rgba(0, 217, 255, 0.30),
    inset 1px 1px 0 rgba(255, 255, 255, 0.12);
}

.btn:hover::after {
  transform: translateX(130%);
}

.btn:active {
  transform: translateY(1px) scale(0.985);
  box-shadow:
    inset 8px 8px 18px rgba(0, 0, 0, 0.72),
    inset -4px -4px 12px rgba(255, 255, 255, 0.035),
    0 0 16px rgba(0, 217, 255, 0.18);
}

/* Menu superior estilo cápsula fosca */
.header nav a {
  border-radius: 999px;
  padding: 10px 15px;
  transition: 0.22s ease;
}

.header nav a:hover {
  color: #ffffff;
  background: linear-gradient(145deg, #17222d, #080c12);
  box-shadow:
    7px 7px 16px rgba(0, 0, 0, 0.50),
    -3px -3px 10px rgba(255, 255, 255, 0.030),
    0 0 20px rgba(0, 217, 255, 0.16),
    inset 1px 1px 0 rgba(255, 255, 255, 0.045);
  transform: translateY(-1px);
}

.header nav a:active {
  transform: translateY(1px) scale(0.985);
  box-shadow:
    inset 5px 5px 12px rgba(0, 0, 0, 0.62),
    inset -3px -3px 8px rgba(255, 255, 255, 0.030);
}

/* Mobile */
@media (max-width: 700px) {
  .btn,
  .actions .btn,
  .github-actions .btn,
  .book-actions .btn,
  .spotify-actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

/* SID_END_TESTE_BOTOES_NEUMORPH_DARK_20260612 */


/* ============================================================
   SID_START_BOTOES_NEUMORPH_FORCE_20260612
   Força visual preto fosco + azul elétrico/ciano
   ============================================================ */

.btn,
a.btn,
.actions a.btn,
.github-actions a.btn,
.book-actions a.btn,
.spotify-actions a.btn {
  background: linear-gradient(145deg, #1a2633, #05080c) !important;
  color: #f7fbff !important;
  border: 1px solid rgba(0, 217, 255, 0.34) !important;
  border-radius: 999px !important;
  padding: 15px 28px !important;
  min-height: 52px !important;
  letter-spacing: 0.11em !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
  box-shadow:
    12px 12px 28px rgba(0, 0, 0, 0.78),
    -6px -6px 16px rgba(255, 255, 255, 0.045),
    inset 1px 1px 0 rgba(255, 255, 255, 0.10),
    inset -4px -4px 12px rgba(0, 0, 0, 0.45) !important;
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease,
    border-color 0.22s ease !important;
}

/* Primário: azul físico aceso */
.btn.primary,
a.btn.primary,
.actions a.btn.primary,
.github-actions a.btn.primary,
.book-actions a.btn.primary,
.spotify-actions a.btn.primary {
  background:
    linear-gradient(145deg, #28e6ff 0%, #008cff 45%, #003b9f 100%) !important;
  color: #ffffff !important;
  border-color: rgba(0, 217, 255, 0.85) !important;
  box-shadow:
    12px 12px 30px rgba(0, 0, 0, 0.76),
    -6px -6px 16px rgba(255, 255, 255, 0.045),
    0 0 34px rgba(0, 140, 255, 0.52),
    0 0 70px rgba(0, 217, 255, 0.18),
    inset 2px 2px 0 rgba(255, 255, 255, 0.36),
    inset -5px -5px 14px rgba(0, 0, 0, 0.38) !important;
}

/* Secundário: preto fosco com ciano */
.btn.secondary,
a.btn.secondary,
.actions a.btn.secondary,
.github-actions a.btn.secondary,
.book-actions a.btn.secondary,
.spotify-actions a.btn.secondary {
  background:
    linear-gradient(145deg, #182431 0%, #05080c 100%) !important;
  color: #00d9ff !important;
  border-color: rgba(0, 217, 255, 0.42) !important;
}

/* Hover: levanta */
.btn:hover,
a.btn:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(0, 217, 255, 0.95) !important;
  box-shadow:
    16px 16px 38px rgba(0, 0, 0, 0.82),
    -7px -7px 18px rgba(255, 255, 255, 0.055),
    0 0 40px rgba(0, 217, 255, 0.36),
    inset 1px 1px 0 rgba(255, 255, 255, 0.16) !important;
}

/* Clique: afunda */
.btn:active,
a.btn:active {
  transform: translateY(2px) scale(0.975) !important;
  box-shadow:
    inset 9px 9px 20px rgba(0, 0, 0, 0.78),
    inset -5px -5px 14px rgba(255, 255, 255, 0.04),
    0 0 18px rgba(0, 217, 255, 0.20) !important;
}

/* Menu superior: cápsulas preto fosco */
.header nav a {
  border-radius: 999px !important;
  padding: 10px 16px !important;
}

.header nav a:hover {
  color: #ffffff !important;
  background: linear-gradient(145deg, #182431, #05080c) !important;
  box-shadow:
    8px 8px 18px rgba(0, 0, 0, 0.58),
    -4px -4px 12px rgba(255, 255, 255, 0.035),
    0 0 22px rgba(0, 217, 255, 0.18),
    inset 1px 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* SID_END_BOTOES_NEUMORPH_FORCE_20260612 */


/* ============================================================
   SID_START_BOTOES_NEUMORPH_DARK_V2_20260612
   Botões mais físicos: preto fosco + azul elétrico/ciano
   ============================================================ */

.btn,
a.btn,
.actions a.btn,
.github-actions a.btn,
.book-actions a.btn,
.spotify-actions a.btn {
  min-height: 58px !important;
  padding: 16px 32px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0, 217, 255, 0.42) !important;
  background:
    linear-gradient(145deg, #202d3a 0%, #0b1017 45%, #030507 100%) !important;
  color: #f8fcff !important;
  font-weight: 950 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 12px rgba(0, 217, 255, 0.28) !important;
  position: relative !important;
  overflow: hidden !important;

  box-shadow:
    0 18px 32px rgba(0, 0, 0, 0.78),
    0 8px 0 rgba(0, 0, 0, 0.42),
    -8px -8px 18px rgba(255, 255, 255, 0.035),
    0 0 0 1px rgba(0, 217, 255, 0.10),
    0 0 34px rgba(0, 217, 255, 0.14),
    inset 3px 3px 5px rgba(255, 255, 255, 0.11),
    inset -8px -8px 16px rgba(0, 0, 0, 0.52) !important;

  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease !important;
}

/* Reflexo superior tipo botão físico */
.btn::before,
a.btn::before {
  content: "" !important;
  position: absolute !important;
  left: 13% !important;
  right: 13% !important;
  top: 7px !important;
  height: 38% !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.24),
      rgba(255, 255, 255, 0.05),
      transparent
    ) !important;
  pointer-events: none !important;
}

/* Brilho deslizante */
.btn::after,
a.btn::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(
      115deg,
      transparent 0%,
      transparent 35%,
      rgba(255, 255, 255, 0.26) 47%,
      transparent 62%,
      transparent 100%
    ) !important;
  transform: translateX(-130%) !important;
  transition: transform 0.55s ease !important;
  pointer-events: none !important;
}

/* Primário azul elétrico */
.btn.primary,
a.btn.primary,
.actions a.btn.primary,
.github-actions a.btn.primary,
.book-actions a.btn.primary,
.spotify-actions a.btn.primary {
  background:
    linear-gradient(145deg, #42eeff 0%, #0099ff 42%, #0047c6 74%, #001d5c 100%) !important;
  border-color: rgba(0, 217, 255, 0.95) !important;
  color: #ffffff !important;
  box-shadow:
    0 20px 38px rgba(0, 0, 0, 0.80),
    0 8px 0 rgba(0, 48, 120, 0.72),
    0 0 34px rgba(0, 140, 255, 0.64),
    0 0 76px rgba(0, 217, 255, 0.24),
    inset 3px 3px 5px rgba(255, 255, 255, 0.34),
    inset -9px -9px 18px rgba(0, 0, 0, 0.38) !important;
}

/* Secundário preto fosco bem visível */
.btn.secondary,
a.btn.secondary,
.actions a.btn.secondary,
.github-actions a.btn.secondary,
.book-actions a.btn.secondary,
.spotify-actions a.btn.secondary {
  background:
    linear-gradient(145deg, #233140 0%, #0b1017 48%, #020406 100%) !important;
  color: #00e5ff !important;
  border-color: rgba(0, 217, 255, 0.56) !important;
  box-shadow:
    0 18px 32px rgba(0, 0, 0, 0.78),
    0 8px 0 rgba(0, 0, 0, 0.46),
    0 0 28px rgba(0, 217, 255, 0.16),
    inset 3px 3px 5px rgba(255, 255, 255, 0.12),
    inset -8px -8px 16px rgba(0, 0, 0, 0.56) !important;
}

/* Hover: levanta e acende */
.btn:hover,
a.btn:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(0, 240, 255, 1) !important;
  box-shadow:
    0 26px 44px rgba(0, 0, 0, 0.86),
    0 10px 0 rgba(0, 0, 0, 0.50),
    0 0 46px rgba(0, 217, 255, 0.42),
    inset 3px 3px 6px rgba(255, 255, 255, 0.16),
    inset -9px -9px 18px rgba(0, 0, 0, 0.54) !important;
}

.btn:hover::after,
a.btn:hover::after {
  transform: translateX(130%) !important;
}

/* Clique: afunda fisicamente */
.btn:active,
a.btn:active {
  transform: translateY(5px) scale(0.985) !important;
  box-shadow:
    inset 10px 10px 22px rgba(0, 0, 0, 0.82),
    inset -5px -5px 12px rgba(255, 255, 255, 0.045),
    0 0 18px rgba(0, 217, 255, 0.18) !important;
}

/* SID_END_BOTOES_NEUMORPH_DARK_V2_20260612 */


/* ============================================================
   SID_START_BOTOES_SOFT_DARK_V3_20260612
   V3: cápsula preta fosca + camada ciano + botão pressionável
   ============================================================ */

/* Base geral: cápsula preta fosca */
.btn,
a.btn,
.actions a.btn,
.github-actions a.btn,
.book-actions a.btn,
.spotify-actions a.btn {
  min-height: 54px !important;
  padding: 15px 30px !important;
  border-radius: 999px !important;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;

  background:
    linear-gradient(145deg, #19232e 0%, #0a0f15 52%, #030507 100%) !important;

  border: 1px solid rgba(0, 217, 255, 0.26) !important;
  color: #f7fbff !important;

  font-weight: 850 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-shadow: none !important;

  box-shadow:
    0 14px 26px rgba(0, 0, 0, 0.68),
    0 5px 0 rgba(0, 0, 0, 0.38),
    -5px -5px 13px rgba(255, 255, 255, 0.035),
    inset 2px 2px 4px rgba(255, 255, 255, 0.075),
    inset -7px -7px 14px rgba(0, 0, 0, 0.52) !important;

  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease !important;
}

/* Reflexo superior discreto */
.btn::after,
a.btn::after {
  content: "" !important;
  position: absolute !important;
  left: 14% !important;
  right: 14% !important;
  top: 7px !important;
  height: 34% !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.16),
      rgba(255, 255, 255, 0.035),
      transparent
    ) !important;
  transform: none !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

/* VER PROJETOS: preto fosco + camada/bolinha ciano à esquerda */
.btn.primary,
a.btn.primary,
.actions a.btn.primary,
.github-actions a.btn.primary,
.book-actions a.btn.primary,
.spotify-actions a.btn.primary {
  padding-left: 68px !important;
  background:
    linear-gradient(145deg, #1d2a36 0%, #0b1016 50%, #030507 100%) !important;

  color: #ffffff !important;
  border-color: rgba(0, 217, 255, 0.46) !important;

  box-shadow:
    0 16px 30px rgba(0, 0, 0, 0.72),
    0 6px 0 rgba(0, 0, 0, 0.42),
    0 0 26px rgba(0, 217, 255, 0.14),
    -5px -5px 13px rgba(255, 255, 255, 0.035),
    inset 2px 2px 4px rgba(255, 255, 255, 0.085),
    inset -7px -7px 14px rgba(0, 0, 0, 0.54) !important;
}

/* Bolinha/camada ciano */
.btn.primary::before,
a.btn.primary::before,
.actions a.btn.primary::before,
.github-actions a.btn.primary::before,
.book-actions a.btn.primary::before,
.spotify-actions a.btn.primary::before {
  content: "" !important;
  position: absolute !important;
  width: 38px !important;
  height: 38px !important;
  left: 9px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;

  background:
    radial-gradient(circle at 35% 28%,
      #8ff7ff 0%,
      #00d9ff 32%,
      #008cff 68%,
      #003b80 100%) !important;

  box-shadow:
    0 0 20px rgba(0, 217, 255, 0.42),
    inset 2px 2px 4px rgba(255, 255, 255, 0.40),
    inset -5px -5px 10px rgba(0, 0, 0, 0.34) !important;

  pointer-events: none !important;
  z-index: -1 !important;
}

/* VER IMAGENS: cápsula preta mais escura, texto ciano, borda suave */
.btn.secondary,
a.btn.secondary,
.actions a.btn.secondary,
.github-actions a.btn.secondary,
.book-actions a.btn.secondary,
.spotify-actions a.btn.secondary {
  background:
    linear-gradient(145deg, #111a23 0%, #05080d 56%, #010203 100%) !important;

  color: #00e5ff !important;
  border-color: rgba(0, 217, 255, 0.34) !important;

  box-shadow:
    0 14px 26px rgba(0, 0, 0, 0.72),
    0 5px 0 rgba(0, 0, 0, 0.45),
    0 0 18px rgba(0, 217, 255, 0.10),
    -5px -5px 13px rgba(255, 255, 255, 0.03),
    inset 2px 2px 4px rgba(255, 255, 255, 0.055),
    inset -7px -7px 14px rgba(0, 0, 0, 0.58) !important;
}

/* Remove bolinha do secundário */
.btn.secondary::before,
a.btn.secondary::before {
  display: none !important;
}

/* Hover: leve elevação, glow ciano discreto */
.btn:hover,
a.btn:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(0, 217, 255, 0.72) !important;

  box-shadow:
    0 20px 34px rgba(0, 0, 0, 0.78),
    0 7px 0 rgba(0, 0, 0, 0.42),
    0 0 30px rgba(0, 217, 255, 0.22),
    -5px -5px 14px rgba(255, 255, 255, 0.04),
    inset 2px 2px 5px rgba(255, 255, 255, 0.10),
    inset -8px -8px 16px rgba(0, 0, 0, 0.54) !important;
}

/* Clique: afunda fisicamente */
.btn:active,
a.btn:active {
  transform: translateY(5px) scale(0.985) !important;

  box-shadow:
    inset 9px 9px 18px rgba(0, 0, 0, 0.78),
    inset -4px -4px 10px rgba(255, 255, 255, 0.035),
    0 0 12px rgba(0, 217, 255, 0.14) !important;
}

/* Ajuste mobile */
@media (max-width: 700px) {
  .btn.primary,
  a.btn.primary {
    padding-left: 68px !important;
  }
}

/* SID_END_BOTOES_SOFT_DARK_V3_20260612 */


/* ============================================================
   SID_START_HERO_VIDEO_20260612
   Vídeo principal no lugar da imagem do Hero
   ============================================================ */

.hero-video-frame {
  overflow: hidden;
}

.hero-video {
  width: 100%;
  height: 100%;
  min-height: 420px;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: 24px;
  filter: contrast(1.05) saturate(1.08);
}

@media (max-width: 1000px) {
  .hero-video {
    min-height: 360px;
  }
}

@media (max-width: 700px) {
  .hero-video {
    min-height: 320px;
  }
}

/* SID_END_HERO_VIDEO_20260612 */


/* ============================================================
   SID_START_HERO_VIDEO_FLUTUANTE_20260612
   Remove quadrante/moldura e deixa o vídeo flutuante
   ============================================================ */

.hero-video-frame,
.image-frame.hero-video-frame {
  width: min(440px, 82vw) !important;
  height: min(440px, 82vw) !important;
  min-height: 0 !important;
  max-height: none !important;

  padding: 0 !important;
  margin: 0 auto !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;

  overflow: visible !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Remove qualquer camada decorativa herdada do antigo card */
.hero-video-frame::before,
.hero-video-frame::after,
.image-frame.hero-video-frame::before,
.image-frame.hero-video-frame::after {
  display: none !important;
  content: none !important;
}

/* Vídeo como elemento solto/flutuante */
.hero-video {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;

  display: block !important;
  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 34px rgba(0, 217, 255, 0.20))
    drop-shadow(0 0 70px rgba(160, 80, 255, 0.18))
    saturate(1.08)
    contrast(1.04) !important;
}

/* Glow externo do orbe, sem quadrado */
.hero-visual {
  overflow: visible !important;
}

.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 88vw);
  height: min(520px, 88vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.14),
      rgba(122, 74, 255, 0.12) 42%,
      transparent 70%);
  filter: blur(24px);
  z-index: -1;
  pointer-events: none;
}

/* Mobile */
@media (max-width: 700px) {
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(330px, 86vw) !important;
    height: min(330px, 86vw) !important;
  }

  .hero-video {
    filter:
      drop-shadow(0 0 24px rgba(0, 217, 255, 0.18))
      drop-shadow(0 0 50px rgba(160, 80, 255, 0.14))
      saturate(1.06)
      contrast(1.03) !important;
  }
}

/* SID_END_HERO_VIDEO_FLUTUANTE_20260612 */


/* ============================================================
   SID_START_AJUSTE_HERO_VIDEO_SEM_CARDS_20260612
   Remove cards Atlas/Book Claw e ajusta vídeo flutuante
   ============================================================ */

/* Remove os cards flutuantes do Hero */
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

/* Área visual limpa */
.hero-visual {
  position: relative !important;
  min-height: 430px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
}

/* Remove completamente o visual de card/moldura */
.hero-video-frame,
.image-frame.hero-video-frame {
  width: min(620px, 42vw) !important;
  height: min(360px, 28vw) !important;
  min-height: 0 !important;
  max-height: none !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  overflow: visible !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Remove qualquer camada antiga da imagem */
.hero-video-frame::before,
.hero-video-frame::after,
.image-frame.hero-video-frame::before,
.image-frame.hero-video-frame::after {
  display: none !important;
  content: none !important;
}

/* Vídeo flutuante */
.hero-video {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;

  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 28px rgba(0, 217, 255, 0.22))
    drop-shadow(0 0 70px rgba(140, 80, 255, 0.18))
    saturate(1.08)
    contrast(1.04) !important;
}

/* Glow circular atrás do vídeo */
.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 42vw);
  height: min(520px, 42vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.12),
      rgba(122, 74, 255, 0.16) 38%,
      transparent 72%);
  filter: blur(26px);
  z-index: -1;
  pointer-events: none;
}

/* Mobile */
@media (max-width: 1000px) {
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(520px, 82vw) !important;
    height: min(320px, 54vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(360px, 88vw) !important;
    height: min(260px, 62vw) !important;
  }
}

/* SID_END_AJUSTE_HERO_VIDEO_SEM_CARDS_20260612 */


/* SID_START_HIDE_HERO_VIDEO_TEMP_20260612 */
.hero-video-frame,
.image-frame.hero-video-frame {
  display: none !important;
}
/* SID_END_HIDE_HERO_VIDEO_TEMP_20260612 */


/* ============================================================
   SID_START_ORBE_CSS_FLUTUANTE_SEM_XADREZ_20260612
   Orbe flutuante 100% CSS, sem vídeo e sem fundo xadrez
   ============================================================ */

.hero-visual {
  position: relative !important;
  overflow: visible !important;
  min-height: 520px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Remove qualquer vídeo/imagem anterior */
.hero-video-frame,
.image-frame.hero-video-frame,
.hero-video {
  display: none !important;
}

/* Remove cards flutuantes Atlas / Book Claw */
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

/* Palco transparente do orbe */
.sid-orb-stage {
  width: min(430px, 38vw);
  height: min(430px, 38vw);
  position: relative;
  display: grid;
  place-items: center;
  background: transparent;
  border: none;
  box-shadow: none;
  animation: sidOrbStageFloat 7s ease-in-out infinite;
  filter:
    drop-shadow(0 0 28px rgba(0, 217, 255, 0.25))
    drop-shadow(0 0 80px rgba(155, 85, 255, 0.24));
}

/* Glow atrás do orbe */
.sid-orb-stage::before {
  content: "";
  position: absolute;
  inset: -18%;
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.20),
      rgba(116, 70, 255, 0.17) 36%,
      rgba(255, 61, 242, 0.10) 55%,
      transparent 72%);
  filter: blur(28px);
  opacity: 0.95;
  z-index: -2;
}

/* Anel orbital */
.sid-orb-stage::after {
  content: "";
  position: absolute;
  width: 112%;
  height: 34%;
  border-radius: 50%;
  border: 1px solid rgba(0, 217, 255, 0.36);
  box-shadow:
    0 0 20px rgba(0, 217, 255, 0.18),
    inset 0 0 18px rgba(160, 80, 255, 0.12);
  transform: rotate(-18deg);
  animation: sidOrbRing 9s linear infinite;
  opacity: 0.75;
}

/* Orbe principal */
.sid-orb-float {
  width: 72%;
  height: 72%;
  position: relative;
  border-radius: 50%;
  overflow: hidden;

  background:
    radial-gradient(circle at 35% 28%,
      rgba(255, 255, 255, 0.78) 0%,
      rgba(0, 217, 255, 0.62) 8%,
      transparent 18%),
    radial-gradient(circle at 50% 52%,
      rgba(255, 255, 255, 0.90) 0%,
      rgba(0, 217, 255, 0.65) 8%,
      rgba(140, 80, 255, 0.42) 18%,
      transparent 34%),
    conic-gradient(
      from 140deg,
      #00e5ff,
      #7d5cff,
      #ff4de1,
      #00aaff,
      #00ffd5,
      #7d5cff,
      #00e5ff
    );

  box-shadow:
    inset 18px 18px 38px rgba(255, 255, 255, 0.16),
    inset -28px -24px 42px rgba(0, 0, 0, 0.45),
    0 0 42px rgba(0, 217, 255, 0.30),
    0 0 95px rgba(160, 80, 255, 0.24);

  animation:
    sidOrbSpin 18s linear infinite,
    sidOrbPulse 4.8s ease-in-out infinite;
}

/* Ondas internas */
.sid-orb-float::before {
  content: "";
  position: absolute;
  inset: -28%;
  border-radius: 44%;
  background:
    conic-gradient(
      from 80deg,
      transparent 0deg,
      rgba(255, 255, 255, 0.30) 38deg,
      rgba(0, 217, 255, 0.20) 78deg,
      transparent 118deg,
      rgba(255, 61, 242, 0.26) 180deg,
      transparent 260deg,
      rgba(0, 255, 213, 0.22) 320deg,
      transparent 360deg
    );
  mix-blend-mode: screen;
  filter: blur(4px);
  animation: sidOrbSwirl 8s ease-in-out infinite alternate;
}

/* Brilho frontal */
.sid-orb-float::after {
  content: "";
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 30%,
      rgba(255, 255, 255, 0.50),
      transparent 24%),
    radial-gradient(circle at 65% 70%,
      rgba(0, 217, 255, 0.20),
      transparent 36%);
  mix-blend-mode: screen;
}

/* Núcleo */
.sid-orb-core {
  position: absolute;
  width: 18%;
  height: 18%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, #ffffff, #00e5ff 40%, transparent 72%);
  box-shadow:
    0 0 28px rgba(255, 255, 255, 0.75),
    0 0 60px rgba(0, 217, 255, 0.58),
    0 0 90px rgba(255, 61, 242, 0.35);
  z-index: 3;
}

@keyframes sidOrbStageFloat {
  0%, 100% {
    transform: translateY(0) translateX(0) scale(1);
  }

  50% {
    transform: translateY(-18px) translateX(10px) scale(1.025);
  }
}

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

@keyframes sidOrbSwirl {
  0% {
    transform: rotate(0deg) scale(1);
  }

  100% {
    transform: rotate(95deg) scale(1.08);
  }
}

@keyframes sidOrbPulse {
  0%, 100% {
    filter: saturate(1.08) contrast(1.05);
  }

  50% {
    filter: saturate(1.28) contrast(1.10);
  }
}

@keyframes sidOrbRing {
  to {
    transform: rotate(342deg);
  }
}

@media (max-width: 1000px) {
  .sid-orb-stage {
    width: min(380px, 72vw);
    height: min(380px, 72vw);
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .sid-orb-stage {
    width: min(300px, 78vw);
    height: min(300px, 78vw);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sid-orb-stage,
  .sid-orb-stage::after,
  .sid-orb-float,
  .sid-orb-float::before {
    animation: none !important;
  }
}

/* SID_END_ORBE_CSS_FLUTUANTE_SEM_XADREZ_20260612 */


/* ============================================================
   SID_START_VIDEO_ORBE_REAL_SEM_MOLDURA_20260612
   Vídeo real do orbe, flutuante, sem moldura e sem cards
   ============================================================ */

/* Esconde o orbe CSS anterior */
.sid-orb-stage,
.sid-orb-float,
.sid-orb-core {
  display: none !important;
}

/* Remove cards Atlas / Book Claw */
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

/* Área visual limpa */
.hero-visual {
  position: relative !important;
  min-height: 500px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Remove moldura do antigo image-frame */
.orb-video-clean,
.hero-video-frame,
.image-frame.hero-video-frame {
  display: block !important;
  width: min(680px, 44vw) !important;
  height: min(420px, 32vw) !important;
  min-height: 0 !important;
  max-height: none !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  overflow: visible !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Vídeo solto/flutuante */
.orb-video,
.hero-video {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;

  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 34px rgba(0, 217, 255, 0.30))
    drop-shadow(0 0 85px rgba(155, 85, 255, 0.24))
    saturate(1.10)
    contrast(1.06) !important;
}

/* Glow atrás do vídeo */
.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 42vw);
  height: min(520px, 42vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.16),
      rgba(122, 74, 255, 0.16) 40%,
      transparent 72%);
  filter: blur(30px);
  z-index: -1;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .orb-video-clean,
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(560px, 84vw) !important;
    height: min(360px, 58vw) !important;
  }
}

@media (max-width: 700px) {
  .orb-video-clean,
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(360px, 90vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_VIDEO_ORBE_REAL_SEM_MOLDURA_20260612 */


/* ============================================================
   SID_START_BLACK_ORB_VIDEO_HERO_20260612
   Orbe real em vídeo: fundo preto removido visualmente com screen
   ============================================================ */

/* Remove orbe CSS antigo */
.sid-orb-stage,
.sid-orb-float,
.sid-orb-core {
  display: none !important;
}

/* Remove cards flutuantes Atlas / Book Claw */
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

/* Área visual do hero */
.hero-visual {
  position: relative !important;
  min-height: 520px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Frame sem moldura */
.black-orb-frame,
.hero-video-frame,
.image-frame.hero-video-frame {
  display: block !important;
  width: min(760px, 46vw) !important;
  height: min(430px, 28vw) !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Vídeo flutuante: o preto some sobre fundo escuro */
.black-orb-video,
.hero-video.black-orb-video {
  width: 100% !important;
  height: 100% !important;
  display: block !important;

  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  mix-blend-mode: screen !important;
  opacity: 0.96 !important;

  filter:
    drop-shadow(0 0 28px rgba(0, 217, 255, 0.18))
    drop-shadow(0 0 70px rgba(80, 120, 255, 0.16))
    saturate(1.12)
    contrast(1.08) !important;
}

/* Glow atrás do orbe */
.hero-visual::before {
  content: "";
  position: absolute;
  width: min(560px, 42vw);
  height: min(560px, 42vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.10),
      rgba(66, 90, 255, 0.15) 42%,
      transparent 72%);
  filter: blur(34px);
  z-index: -1;
  pointer-events: none;
}

/* Mobile */
@media (max-width: 1000px) {
  .black-orb-frame,
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(620px, 86vw) !important;
    height: min(360px, 56vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .black-orb-frame,
  .hero-video-frame,
  .image-frame.hero-video-frame {
    width: min(380px, 92vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_BLACK_ORB_VIDEO_HERO_20260612 */


/* ============================================================
   SID_START_HERO_ORB_WEBM_ALPHA_LOCAL_20260612
   Orbe WebM com alpha real, flutuante, sem retângulo
   ============================================================ */

.sid-orb-stage,
.sid-orb-float,
.sid-orb-core {
  display: none !important;
}

.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

.hero-visual {
  position: relative !important;
  min-height: 500px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-orb-video-wrap {
  width: min(640px, 42vw) !important;
  height: min(420px, 30vw) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.hero-orb-video {
  width: 100% !important;
  height: 100% !important;
  display: block !important;

  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 26px rgba(0, 217, 255, 0.24))
    drop-shadow(0 0 80px rgba(90, 130, 255, 0.20))
    saturate(1.10)
    contrast(1.06) !important;
}

.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 40vw);
  height: min(520px, 40vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.10),
      rgba(80, 110, 255, 0.16) 42%,
      transparent 72%);
  filter: blur(34px);
  z-index: -1;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .hero-orb-video-wrap {
    width: min(560px, 84vw) !important;
    height: min(360px, 56vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .hero-orb-video-wrap {
    width: min(360px, 92vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_HERO_ORB_WEBM_ALPHA_LOCAL_20260612 */


/* ============================================================
   SID_START_HERO_ORB_WEBM_ALPHA_CORRIGIDO_20260612
   Orbe WebM alpha corrigido, flutuante, sem retângulo
   ============================================================ */

.sid-orb-stage,
.sid-orb-float,
.sid-orb-core {
  display: none !important;
}

.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

.hero-visual {
  position: relative !important;
  min-height: 500px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-orb-video-wrap {
  width: min(620px, 42vw) !important;
  height: min(420px, 30vw) !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.hero-orb-video {
  width: 100% !important;
  height: 100% !important;

  display: block !important;
  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 26px rgba(0, 217, 255, 0.24))
    drop-shadow(0 0 80px rgba(90, 130, 255, 0.20))
    saturate(1.10)
    contrast(1.06) !important;
}

.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 40vw);
  height: min(520px, 40vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.10),
      rgba(80, 110, 255, 0.16) 42%,
      transparent 72%);
  filter: blur(34px);
  z-index: -1;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .hero-orb-video-wrap {
    width: min(560px, 84vw) !important;
    height: min(360px, 56vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .hero-orb-video-wrap {
    width: min(360px, 92vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_HERO_ORB_WEBM_ALPHA_CORRIGIDO_20260612 */


/* ============================================================
   SID_START_ORBISITE_HERO_FINAL_20260612
   Orbe orbisite.mp4 ajustado para o Hero
   ============================================================ */

.sid-orb-stage,
.sid-orb-float,
.sid-orb-core,
.hero-orb-video-wrap,
.black-orb-frame,
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

.hero-visual {
  position: relative !important;
  min-height: 500px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-orbisite-wrap {
  width: min(640px, 42vw) !important;
  height: min(420px, 30vw) !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
  border-radius: 36px !important;
}

.hero-orbisite-video {
  width: 100% !important;
  height: 100% !important;

  display: block !important;
  object-fit: contain !important;
  object-position: center !important;

  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  mix-blend-mode: screen !important;

  filter:
    drop-shadow(0 0 26px rgba(0, 217, 255, 0.24))
    drop-shadow(0 0 80px rgba(90, 130, 255, 0.20))
    saturate(1.10)
    contrast(1.06) !important;
}

.hero-visual::before {
  content: "";
  position: absolute;
  width: min(520px, 40vw);
  height: min(520px, 40vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.10),
      rgba(80, 110, 255, 0.16) 42%,
      transparent 72%);
  filter: blur(34px);
  z-index: -1;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .hero-orbisite-wrap {
    width: min(560px, 84vw) !important;
    height: min(360px, 56vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .hero-orbisite-wrap {
    width: min(360px, 92vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_ORBISITE_HERO_FINAL_20260612 */


/* ============================================================
   SID_START_ORBISITE_ALPHA_FINAL_20260612
   Orbe WebM com alpha real: sem quadro, sem moldura
   ============================================================ */

.sid-orb-stage,
.sid-orb-float,
.sid-orb-core,
.hero-orbisite-wrap,
.hero-orb-video-wrap,
.black-orb-frame,
.hero-visual .floating-card,
.hero-visual .card-one,
.hero-visual .card-two {
  display: none !important;
}

.hero-visual {
  position: relative !important;
  min-height: 500px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-orbisite-alpha-wrap {
  width: min(660px, 43vw) !important;
  height: min(440px, 31vw) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  overflow: visible !important;
}

.hero-orbisite-alpha-video {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  mix-blend-mode: normal !important;
  filter:
    drop-shadow(0 0 26px rgba(0, 217, 255, 0.26))
    drop-shadow(0 0 80px rgba(80, 120, 255, 0.22))
    saturate(1.12)
    contrast(1.08) !important;
}

.hero-visual::before {
  content: "";
  position: absolute;
  width: min(560px, 42vw);
  height: min(560px, 42vw);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(0, 217, 255, 0.11),
      rgba(80, 110, 255, 0.17) 42%,
      transparent 72%);
  filter: blur(36px);
  z-index: -1;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .hero-orbisite-alpha-wrap {
    width: min(560px, 84vw) !important;
    height: min(360px, 56vw) !important;
  }
}

@media (max-width: 700px) {
  .hero-visual {
    min-height: 360px !important;
  }

  .hero-orbisite-alpha-wrap {
    width: min(360px, 92vw) !important;
    height: min(260px, 64vw) !important;
  }
}

/* SID_END_ORBISITE_ALPHA_FINAL_20260612 */


/* ============================================================
   SID_START_ORBE_MAIS_ESQUERDA_MAIOR_20260612
   Ajuste final: orbe 40% maior e mais próximo do texto
   ============================================================ */

.hero-orbisite-alpha-wrap {
  width: min(925px, 60vw) !important;
  height: min(616px, 43vw) !important;

  transform: translateX(-150px) translateY(-8px) !important;
  overflow: visible !important;
}

.hero-orbisite-alpha-video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.hero-visual::before {
  width: min(720px, 52vw) !important;
  height: min(720px, 52vw) !important;
  transform: translateX(-150px) !important;
}

/* Notebook / telas médias */
@media (max-width: 1200px) {
  .hero-orbisite-alpha-wrap {
    width: min(820px, 58vw) !important;
    height: min(550px, 42vw) !important;
    transform: translateX(-95px) translateY(-4px) !important;
  }

  .hero-visual::before {
    transform: translateX(-95px) !important;
  }
}

/* Tablet */
@media (max-width: 1000px) {
  .hero-orbisite-alpha-wrap {
    width: min(620px, 86vw) !important;
    height: min(420px, 58vw) !important;
    transform: translateX(0) translateY(0) !important;
  }

  .hero-visual::before {
    transform: translateX(0) !important;
  }
}

/* Celular */
@media (max-width: 700px) {
  .hero-orbisite-alpha-wrap {
    width: min(430px, 94vw) !important;
    height: min(300px, 68vw) !important;
    transform: translateX(0) translateY(0) !important;
  }
}

/* SID_END_ORBE_MAIS_ESQUERDA_MAIOR_20260612 */


/* ============================================================
   SID_START_APAGAR_BRILHO_DIREITO_ORBE_20260612
   Remove visualmente o brilho/estrela da lateral direita do vídeo
   ============================================================ */

.hero-orbisite-alpha-video {
  clip-path: inset(0 13% 0 0) !important;
}

/* Mantém o vídeo centralizado mesmo com o corte lateral */
.hero-orbisite-alpha-wrap {
  overflow: visible !important;
}

/* SID_END_APAGAR_BRILHO_DIREITO_ORBE_20260612 */


/* ============================================================
   SID_START_AJUSTE_HERO_RECRUTADOR_20260612
   Ajuste textual do Hero para foco profissional/recrutador
   ============================================================ */

.hero-text .eyebrow,
.hero .eyebrow {
  letter-spacing: 0.22em !important;
}

.hero-text h2,
#typing {
  color: #00e5ff !important;
  max-width: 780px !important;
}

.hero-text .intro,
.hero .intro {
  max-width: 760px !important;
  line-height: 1.72 !important;
}

/* SID_END_AJUSTE_HERO_RECRUTADOR_20260612 */


/* ============================================================
   SID_START_KABBALAH_YOUTUBE_SECAO_20260612
   Seção própria Kabbalah Studio
   ============================================================ */

.kabbalah-showcase {
  position: relative;
  overflow: hidden;
}

.kabbalah-card {
  max-width: 980px;
  margin: 54px auto 0;
  padding: 44px;
  border-radius: 34px;
  background:
    linear-gradient(135deg, rgba(0, 217, 255, 0.10), rgba(255, 70, 220, 0.08)),
    rgba(10, 22, 32, 0.72);
  border: 1px solid rgba(0, 217, 255, 0.22);
  box-shadow:
    0 24px 90px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.kabbalah-content {
  max-width: 760px;
}

.kabbalah-label {
  display: inline-block;
  margin-bottom: 16px;
  color: #00e5ff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.kabbalah-card h3 {
  margin: 0 0 18px;
  font-size: clamp(2.2rem, 5vw, 4.8rem);
  line-height: 0.95;
  color: #ffffff;
}

.kabbalah-card p {
  margin: 0 0 28px;
  max-width: 720px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.75;
}

@media (max-width: 700px) {
  .kabbalah-card {
    padding: 30px 24px;
    border-radius: 26px;
  }
}

/* SID_END_KABBALAH_YOUTUBE_SECAO_20260612 */


/* ============================================================
   SID_START_SPOTIFY_CARD_PREMIUM_20260612
   Substitui embed cinza do Spotify por card premium autoral
   ============================================================ */

.spotify-premium-section {
  position: relative;
  overflow: hidden;
}

.spotify-premium-grid {
  width: min(1420px, calc(100% - 80px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.8fr);
  gap: clamp(42px, 6vw, 110px);
  align-items: center;
}

.spotify-premium-text {
  max-width: 760px;
}

.section-kicker {
  display: inline-block;
  margin-bottom: 20px;
  color: #d9b64c;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.spotify-premium-text h2 {
  margin: 0 0 24px;
  font-size: clamp(3.2rem, 7vw, 6.8rem);
  line-height: 0.94;
  color: #ffffff;
}

.spotify-premium-text p {
  max-width: 760px;
  margin: 0 0 34px;
  color: rgba(255, 255, 255, 0.70);
  line-height: 1.8;
}

.spotify-premium-card {
  position: relative;
  padding: 34px;
  border-radius: 34px;
  background:
    linear-gradient(145deg, rgba(0, 229, 255, 0.13), rgba(255, 70, 220, 0.10)),
    rgba(8, 18, 28, 0.76);
  border: 1px solid rgba(0, 229, 255, 0.24);
  box-shadow:
    0 30px 100px rgba(0, 0, 0, 0.42),
    0 0 80px rgba(0, 229, 255, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  overflow: hidden;
}

.spotify-premium-card::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, #00e5ff, #ff46dc, #d9b64c);
  opacity: 0.55;
  pointer-events: none;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

.spotify-orbit {
  position: absolute;
  right: -100px;
  top: -120px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 229, 255, 0.18), transparent 68%);
  filter: blur(10px);
  pointer-events: none;
}

.spotify-card-header {
  position: relative;
  display: flex;
  gap: 22px;
  align-items: center;
  margin-bottom: 34px;
}

.spotify-avatar {
  width: 94px;
  height: 94px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc);
  box-shadow:
    0 18px 50px rgba(0, 229, 255, 0.22),
    inset 0 1px 0 rgba(255,255,255,0.35);
}

.spotify-avatar span {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.spotify-label {
  display: inline-block;
  margin-bottom: 8px;
  color: #00e5ff;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.22em;
}

.spotify-card-header h3 {
  margin: 0 0 6px;
  color: #fff;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
}

.spotify-card-header p {
  margin: 0;
  color: rgba(255,255,255,0.68);
  line-height: 1.55;
}

.spotify-track-list {
  position: relative;
  display: grid;
  gap: 14px;
  margin-bottom: 30px;
}

.spotify-track {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255,255,255,0.055);
  border: 1px solid rgba(255,255,255,0.08);
}

.spotify-track span {
  color: #00e5ff;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.spotify-track strong {
  display: block;
  color: #fff;
  font-size: 0.98rem;
}

.spotify-track small {
  display: block;
  margin-top: 4px;
  color: rgba(255,255,255,0.56);
}

.spotify-open {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 28px;
  border-radius: 999px;
  color: #00e5ff;
  text-decoration: none;
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  background: rgba(0, 0, 0, 0.46);
  border: 1px solid rgba(0, 229, 255, 0.28);
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08);
}

.spotify-open:hover {
  transform: translateY(-2px);
  box-shadow:
    0 18px 50px rgba(0,0,0,0.45),
    0 0 34px rgba(0, 229, 255, 0.18);
}

@media (max-width: 980px) {
  .spotify-premium-grid {
    grid-template-columns: 1fr;
  }

  .spotify-premium-card {
    max-width: 680px;
  }
}

@media (max-width: 700px) {
  .spotify-premium-grid {
    width: min(100% - 32px, 1420px);
  }

  .spotify-premium-card {
    padding: 26px;
    border-radius: 28px;
  }

  .spotify-card-header {
    align-items: flex-start;
  }

  .spotify-avatar {
    width: 76px;
    height: 76px;
    border-radius: 22px;
  }
}

/* SID_END_SPOTIFY_CARD_PREMIUM_20260612 */


/* ============================================================
   SID_START_SPOTIFY_LAYOUT_CORRIGIDO_20260612
   Correção visual da seção Spotify: espaçamento, título e botões
   ============================================================ */

.spotify-premium-section {
  padding-top: clamp(90px, 10vw, 150px) !important;
  padding-bottom: clamp(90px, 10vw, 150px) !important;
}

.spotify-premium-grid {
  width: min(1360px, calc(100% - 120px)) !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: minmax(520px, 0.95fr) minmax(420px, 0.68fr) !important;
  gap: clamp(80px, 9vw, 150px) !important;
  align-items: center !important;
}

.spotify-premium-text {
  max-width: 720px !important;
}

.spotify-premium-text h2 {
  max-width: 720px !important;
  margin: 0 0 26px !important;

  font-size: clamp(3.2rem, 5.2vw, 5.6rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
}

.spotify-premium-text p {
  max-width: 680px !important;
  margin-bottom: 36px !important;
  font-size: 1rem !important;
  line-height: 1.82 !important;
}

.spotify-premium-text .hero-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  align-items: center !important;
  margin-top: 28px !important;
}

.spotify-premium-text .btn {
  min-width: 220px !important;
  width: auto !important;
  height: 58px !important;
  padding: 0 30px !important;

  white-space: nowrap !important;
  text-align: center !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.16em !important;
}

.spotify-premium-card {
  max-width: 500px !important;
  width: 100% !important;
  margin-left: auto !important;
  padding: 34px !important;
  border-radius: 34px !important;
}

.spotify-card-header {
  gap: 20px !important;
  margin-bottom: 28px !important;
}

.spotify-avatar {
  width: 84px !important;
  height: 84px !important;
  border-radius: 24px !important;
  flex: 0 0 auto !important;
}

.spotify-card-header h3 {
  font-size: clamp(2rem, 2.6vw, 2.7rem) !important;
  line-height: 1.05 !important;
}

.spotify-track {
  grid-template-columns: 42px 1fr !important;
  padding: 16px 18px !important;
}

.spotify-open {
  width: 100% !important;
  min-height: 56px !important;
  padding: 0 24px !important;

  white-space: nowrap !important;
  text-align: center !important;
}

/* Remove sensação de bloco grudado no texto */
.spotify-premium-card {
  transform: translateX(20px) !important;
}

/* Telas médias */
@media (max-width: 1200px) {
  .spotify-premium-grid {
    width: min(1180px, calc(100% - 70px)) !important;
    grid-template-columns: minmax(460px, 1fr) minmax(380px, 0.8fr) !important;
    gap: 70px !important;
  }

  .spotify-premium-text h2 {
    font-size: clamp(3rem, 5vw, 4.8rem) !important;
  }

  .spotify-premium-card {
    transform: none !important;
  }
}

/* Tablet e mobile */
@media (max-width: 980px) {
  .spotify-premium-grid {
    width: min(760px, calc(100% - 40px)) !important;
    grid-template-columns: 1fr !important;
    gap: 44px !important;
  }

  .spotify-premium-text {
    max-width: 100% !important;
  }

  .spotify-premium-text h2 {
    max-width: 100% !important;
    font-size: clamp(3rem, 10vw, 5rem) !important;
  }

  .spotify-premium-text .hero-actions {
    flex-direction: row !important;
  }

  .spotify-premium-card {
    max-width: 640px !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 640px) {
  .spotify-premium-text .hero-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .spotify-premium-text .btn {
    width: 100% !important;
  }

  .spotify-premium-card {
    padding: 26px !important;
  }

  .spotify-card-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

/* SID_END_SPOTIFY_LAYOUT_CORRIGIDO_20260612 */


/* ============================================================
   SID_START_MUSICA_LAYOUT_KABBALAH_20260612
   Música seguindo o mesmo padrão visual da seção Kabbalah
   ============================================================ */

.music-author-showcase {
  position: relative;
  overflow: hidden;
}

.music-author-card {
  max-width: 980px;
  margin: 54px auto 0;
  padding: 44px;
  border-radius: 34px;
  background:
    linear-gradient(135deg, rgba(0, 217, 255, 0.10), rgba(255, 70, 220, 0.08)),
    rgba(10, 22, 32, 0.72);
  border: 1px solid rgba(0, 217, 255, 0.22);
  box-shadow:
    0 24px 90px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.music-author-content {
  max-width: 760px;
}

.music-author-label {
  display: inline-block;
  margin-bottom: 16px;
  color: #00e5ff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.music-author-card h3 {
  margin: 0 0 18px;
  font-size: clamp(2.2rem, 5vw, 4.8rem);
  line-height: 0.95;
  color: #ffffff;
}

.music-author-card p {
  margin: 0 0 28px;
  max-width: 720px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.75;
}

.music-author-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.music-author-actions .btn {
  min-width: 220px;
  white-space: nowrap;
}

/* Apaga visual antigo do Spotify caso alguma regra anterior tente aparecer */
.spotify-premium-card,
.spotify-premium-grid,
.spotify-premium-text,
.spotify-open,
.spotify-track-list {
  all: unset;
}

@media (max-width: 700px) {
  .music-author-card {
    padding: 30px 24px;
    border-radius: 26px;
  }

  .music-author-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .music-author-actions .btn {
    width: 100%;
  }
}

/* SID_END_MUSICA_LAYOUT_KABBALAH_20260612 */


/* ============================================================
   SID_START_HERO_TITULO_GLASS_20260612
   Ajuste do título Hero: espaçamento + Portfolio em glass
   ============================================================ */

/* Linha pequena acima do título */
.hero-text .eyebrow,
.hero .eyebrow {
  display: block !important;
  max-width: 760px !important;
  margin-bottom: 28px !important;

  font-size: 0.72rem !important;
  line-height: 1.55 !important;
  letter-spacing: 0.22em !important;
  color: #d9b64c !important;
}

/* Título principal com mais respiro */
.hero-text h1,
.hero h1 {
  max-width: 780px !important;
  margin-top: 0 !important;
  margin-bottom: 26px !important;

  font-size: clamp(4.8rem, 8.3vw, 8.8rem) !important;
  line-height: 0.93 !important;
  letter-spacing: -0.065em !important;
}

/* Palavra Portfolio com efeito glass premium */
.hero-text h1 span,
.hero h1 span {
  position: relative !important;
  display: inline-block !important;

  padding: 0 0.04em 0.04em !important;

  background:
    linear-gradient(
      135deg,
      rgba(0, 229, 255, 0.96) 0%,
      rgba(120, 130, 255, 0.96) 35%,
      rgba(255, 70, 220, 0.95) 66%,
      rgba(255, 203, 95, 0.96) 100%
    ) !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;

  text-shadow:
    0 0 18px rgba(0, 229, 255, 0.18),
    0 0 38px rgba(255, 70, 220, 0.10) !important;

  filter:
    drop-shadow(0 0 14px rgba(0, 229, 255, 0.18))
    drop-shadow(0 0 28px rgba(255, 70, 220, 0.10)) !important;
}

/* Brilho sutil sobre a palavra Portfolio */
.hero-text h1 span::after,
.hero h1 span::after {
  content: "";
  position: absolute;
  left: 2%;
  right: 2%;
  top: 10%;
  height: 26%;

  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, 0.34),
      transparent
    );

  opacity: 0.36;
  transform: skewX(-16deg);
  pointer-events: none;
  mix-blend-mode: screen;
}

/* Subtítulo azul abaixo do título */
.hero-text h2,
#typing {
  margin-top: 0 !important;
  margin-bottom: 28px !important;

  font-size: clamp(1.45rem, 2vw, 2.1rem) !important;
  line-height: 1.25 !important;
  color: #00e5ff !important;
}

/* Parágrafo do Hero */
.hero-text .intro,
.hero .intro {
  max-width: 720px !important;
  margin-top: 0 !important;
  margin-bottom: 36px !important;
  line-height: 1.78 !important;
}

/* Botões um pouco mais afastados do texto */
.hero-actions {
  margin-top: 10px !important;
}

/* Telas menores */
@media (max-width: 1000px) {
  .hero-text h1,
  .hero h1 {
    font-size: clamp(4rem, 12vw, 6.8rem) !important;
  }

  .hero-text .eyebrow,
  .hero .eyebrow {
    margin-bottom: 22px !important;
    letter-spacing: 0.16em !important;
  }
}

@media (max-width: 700px) {
  .hero-text h1,
  .hero h1 {
    font-size: clamp(3.4rem, 15vw, 5.2rem) !important;
    line-height: 0.96 !important;
  }
}

/* SID_END_HERO_TITULO_GLASS_20260612 */


/* ============================================================
   SID_START_HERO_TITULO_LIMPO_PREMIUM_20260612
   Corrige o Hero: remove glass pesado e melhora espaçamento
   ============================================================ */

/* Linha pequena acima do título */
.hero-text .eyebrow,
.hero .eyebrow {
  display: block !important;
  max-width: 760px !important;
  margin-bottom: 24px !important;

  font-size: 0.72rem !important;
  line-height: 1.6 !important;
  letter-spacing: 0.24em !important;
  color: #d9b64c !important;
}

/* Título principal mais limpo */
.hero-text h1,
.hero h1 {
  max-width: 780px !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;

  font-size: clamp(4.6rem, 7.7vw, 8rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
}

/* Remove efeitos antigos exagerados do Portfolio */
.hero-text h1 span,
.hero h1 span {
  position: relative !important;
  display: inline-block !important;

  padding: 0 !important;
  background:
    linear-gradient(
      120deg,
      #00d9ff 0%,
      #7a7cff 36%,
      #ff48d7 67%,
      #ffcc5f 100%
    ) !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;

  text-shadow: none !important;
  filter: none !important;
  box-shadow: none !important;
}

/* Remove brilho/caixa do efeito anterior */
.hero-text h1 span::before,
.hero-text h1 span::after,
.hero h1 span::before,
.hero h1 span::after {
  display: none !important;
  content: none !important;
}

/* Subtítulo abaixo do título */
.hero-text h2,
#typing {
  margin-top: 0 !important;
  margin-bottom: 26px !important;

  min-height: 42px !important;
  max-width: 740px !important;

  font-size: clamp(1.42rem, 1.8vw, 1.95rem) !important;
  line-height: 1.28 !important;
  color: #00e5ff !important;
}

/* Parágrafo */
.hero-text .intro,
.hero .intro {
  max-width: 720px !important;
  margin-top: 0 !important;
  margin-bottom: 36px !important;
  line-height: 1.78 !important;
}

/* Botões */
.hero-actions {
  margin-top: 8px !important;
}

/* Mobile/tablet */
@media (max-width: 1000px) {
  .hero-text h1,
  .hero h1 {
    font-size: clamp(4rem, 11vw, 6.4rem) !important;
    line-height: 0.98 !important;
  }

  .hero-text .eyebrow,
  .hero .eyebrow {
    margin-bottom: 20px !important;
    letter-spacing: 0.16em !important;
  }
}

@media (max-width: 700px) {
  .hero-text h1,
  .hero h1 {
    font-size: clamp(3.3rem, 14vw, 5rem) !important;
    line-height: 1 !important;
  }
}

/* SID_END_HERO_TITULO_LIMPO_PREMIUM_20260612 */


/* ============================================================
   SID_START_PROJETOS_PREMIUM_20260612
   Seção Projetos premium, mais profissional e consistente
   ============================================================ */

.projects-premium {
  position: relative;
  overflow: hidden;
}

.projects-premium .section-heading {
  max-width: 980px;
  margin: 0 auto 64px;
  text-align: center;
}

.projects-premium .section-heading span {
  display: inline-block;
  margin-bottom: 18px;
  color: #d9b64c;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.projects-premium .section-heading h2 {
  margin: 0 0 22px;
  color: #ffffff;
  font-size: clamp(3.2rem, 6vw, 6.2rem);
  line-height: 0.96;
  letter-spacing: -0.055em;
}

.projects-premium .section-heading p {
  max-width: 760px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.75;
}

.projects-premium-grid {
  width: min(1420px, calc(100% - 90px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 24px;
}

.project-premium-card {
  position: relative;
  grid-column: span 2;
  min-height: 270px;
  padding: 34px;
  border-radius: 34px;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76);
  border: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow:
    0 24px 80px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  overflow: hidden;
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    background 0.35s ease;
}

.project-premium-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 12%, rgba(0, 229, 255, 0.16), transparent 34%),
    radial-gradient(circle at 86% 92%, rgba(255, 70, 220, 0.10), transparent 36%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.project-premium-card:hover {
  transform: translateY(-8px);
  border-color: rgba(0, 229, 255, 0.35);
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.38),
    0 0 60px rgba(0, 229, 255, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.10);
}

.project-premium-card:hover::before {
  opacity: 1;
}

.project-featured {
  grid-column: span 3;
  min-height: 300px;
  border-color: rgba(0, 229, 255, 0.26);
}

.project-number {
  position: relative;
  z-index: 1;
  margin-bottom: 28px;
  color: #00e5ff;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.18em;
}

.project-content {
  position: relative;
  z-index: 1;
}

.project-type {
  display: inline-block;
  margin-bottom: 14px;
  color: rgba(217, 182, 76, 0.92);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.20em;
  text-transform: uppercase;
}

.project-premium-card h3 {
  margin: 0 0 16px;
  color: #ffffff;
  font-size: clamp(1.7rem, 2.4vw, 2.5rem);
  line-height: 1.05;
}

.project-premium-card p {
  margin: 0 0 24px;
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.72;
}

.project-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.project-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  background: rgba(0, 229, 255, 0.075);
  border: 1px solid rgba(0, 229, 255, 0.18);
}

@media (max-width: 1180px) {
  .projects-premium-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .project-premium-card,
  .project-featured {
    grid-column: span 1;
  }
}

@media (max-width: 760px) {
  .projects-premium-grid {
    width: min(100% - 32px, 1420px);
    grid-template-columns: 1fr;
  }

  .project-premium-card {
    min-height: auto;
    padding: 28px;
    border-radius: 28px;
  }
}

/* SID_END_PROJETOS_PREMIUM_20260612 */


/* ============================================================
   SID_START_PACMAN_GITHUB_LOADING_20260612
   Loading do GitHub com animação Pac-Man
   ============================================================ */

.github-loading-pacman {
  position: relative;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.github-loading-label {
  display: inline-block;
  margin-bottom: 22px;
  color: #d9b64c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.github-loading-pacman h3 {
  margin: 0 0 12px;
  color: #ffffff;
  font-size: 1.45rem;
}

.github-loading-pacman p {
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  line-height: 1.6;
}

.pacman-scene {
  position: relative;
  width: 250px;
  height: 62px;
  margin: 0 0 28px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.pacman {
  position: relative;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #fff7a8 0 8%, #ffd84d 9% 100%);
  filter:
    drop-shadow(0 0 12px rgba(255, 216, 77, 0.42))
    drop-shadow(0 0 28px rgba(0, 229, 255, 0.14));
  animation: pacmanMove 2.2s linear infinite;
}

.pacman::before,
.pacman::after {
  content: "";
  position: absolute;
  right: -1px;
  width: 54%;
  height: 50%;
  background: rgba(10, 22, 32, 0.98);
  transform-origin: left center;
  z-index: 2;
}

.pacman::before {
  top: 0;
  animation: pacmanTopMouth 0.34s ease-in-out infinite alternate;
}

.pacman::after {
  bottom: 0;
  animation: pacmanBottomMouth 0.34s ease-in-out infinite alternate;
}

.pacman-dots {
  position: absolute;
  left: 82px;
  display: flex;
  gap: 24px;
  align-items: center;
}

.pacman-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 0 0 16px rgba(0, 229, 255, 0.65);
  animation: pacmanDotFade 2.2s linear infinite;
}

.pacman-dots span:nth-child(1) { animation-delay: 0.10s; }
.pacman-dots span:nth-child(2) { animation-delay: 0.28s; }
.pacman-dots span:nth-child(3) { animation-delay: 0.46s; }
.pacman-dots span:nth-child(4) { animation-delay: 0.64s; }
.pacman-dots span:nth-child(5) { animation-delay: 0.82s; }

@keyframes pacmanMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(188px);
  }
}

@keyframes pacmanTopMouth {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-42deg);
  }
}

@keyframes pacmanBottomMouth {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(42deg);
  }
}

@keyframes pacmanDotFade {
  0%, 20% {
    opacity: 1;
    transform: scale(1);
  }
  38%, 100% {
    opacity: 0.15;
    transform: scale(0.55);
  }
}

/* Card do carregamento com mais cara de projeto */
#github-projects .github-card,
.github-card.loading {
  min-height: 260px;
}

/* SID_END_PACMAN_GITHUB_LOADING_20260612 */


/* ============================================================
   SID_START_PACMAN_GITHUB_FORCE_20260612
   Pac-Man no carregamento dos projetos GitHub
   ============================================================ */

.github-pacman-card {
  min-height: 280px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 34px !important;
}

.github-loading-pacman {
  width: 100%;
  text-align: left;
}

.github-loading-label {
  display: inline-block;
  margin-bottom: 18px;
  color: #d9b64c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.github-loading-pacman h3 {
  margin: 0 0 10px;
  color: #ffffff;
  font-size: 1.45rem;
}

.github-loading-pacman p {
  margin: 0;
  color: rgba(255,255,255,0.62);
  line-height: 1.6;
}

.pacman-scene {
  position: relative;
  width: 260px;
  height: 72px;
  margin: 0 0 28px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.pacman {
  position: relative;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #fff9a8 0 8%, #ffd84d 9% 100%);
  filter:
    drop-shadow(0 0 14px rgba(255, 216, 77, 0.52))
    drop-shadow(0 0 32px rgba(0, 229, 255, 0.18));
  animation: sidPacmanMove 2.2s linear infinite;
}

.pacman::before,
.pacman::after {
  content: "";
  position: absolute;
  right: -2px;
  width: 56%;
  height: 50%;
  background: rgba(10, 22, 32, 0.98);
  transform-origin: left center;
  z-index: 2;
}

.pacman::before {
  top: 0;
  animation: sidPacmanTopMouth 0.34s ease-in-out infinite alternate;
}

.pacman::after {
  bottom: 0;
  animation: sidPacmanBottomMouth 0.34s ease-in-out infinite alternate;
}

.pacman-dots {
  position: absolute;
  left: 86px;
  display: flex;
  gap: 24px;
  align-items: center;
}

.pacman-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 0 0 16px rgba(0,229,255,0.70);
  animation: sidPacmanDotFade 2.2s linear infinite;
}

.pacman-dots span:nth-child(1) { animation-delay: 0.10s; }
.pacman-dots span:nth-child(2) { animation-delay: 0.28s; }
.pacman-dots span:nth-child(3) { animation-delay: 0.46s; }
.pacman-dots span:nth-child(4) { animation-delay: 0.64s; }
.pacman-dots span:nth-child(5) { animation-delay: 0.82s; }

@keyframes sidPacmanMove {
  0% { transform: translateX(0); }
  100% { transform: translateX(192px); }
}

@keyframes sidPacmanTopMouth {
  from { transform: rotate(0deg); }
  to { transform: rotate(-42deg); }
}

@keyframes sidPacmanBottomMouth {
  from { transform: rotate(0deg); }
  to { transform: rotate(42deg); }
}

@keyframes sidPacmanDotFade {
  0%, 20% {
    opacity: 1;
    transform: scale(1);
  }
  38%, 100% {
    opacity: 0.14;
    transform: scale(0.55);
  }
}

/* SID_END_PACMAN_GITHUB_FORCE_20260612 */


/* ============================================================
   SID_START_PACMAN_GITHUB_OBSERVER_20260612
   Pac-Man forçado no loading GitHub
   ============================================================ */

.sid-pacman-applied {
  min-height: 280px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 34px !important;
}

.sid-github-pacman-loading {
  width: 100%;
}

.sid-pacman-scene {
  position: relative;
  width: 270px;
  height: 72px;
  margin: 0 0 28px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.sid-pacman {
  position: relative;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #fff9a8 0 8%, #ffd84d 9% 100%);
  filter:
    drop-shadow(0 0 14px rgba(255, 216, 77, 0.52))
    drop-shadow(0 0 32px rgba(0, 229, 255, 0.18));
  animation: sidPacmanMoveForce 2.2s linear infinite;
}

.sid-pacman::before,
.sid-pacman::after {
  content: "";
  position: absolute;
  right: -2px;
  width: 56%;
  height: 50%;
  background: rgba(10, 22, 32, 0.98);
  transform-origin: left center;
  z-index: 2;
}

.sid-pacman::before {
  top: 0;
  animation: sidPacmanTopForce 0.34s ease-in-out infinite alternate;
}

.sid-pacman::after {
  bottom: 0;
  animation: sidPacmanBottomForce 0.34s ease-in-out infinite alternate;
}

.sid-pacman-dots {
  position: absolute;
  left: 86px;
  display: flex;
  gap: 24px;
  align-items: center;
}

.sid-pacman-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 0 0 16px rgba(0, 229, 255, 0.70);
  animation: sidPacmanDotForce 2.2s linear infinite;
}

.sid-pacman-dots span:nth-child(1) { animation-delay: 0.10s; }
.sid-pacman-dots span:nth-child(2) { animation-delay: 0.28s; }
.sid-pacman-dots span:nth-child(3) { animation-delay: 0.46s; }
.sid-pacman-dots span:nth-child(4) { animation-delay: 0.64s; }
.sid-pacman-dots span:nth-child(5) { animation-delay: 0.82s; }

.sid-github-loading-label {
  display: inline-block;
  margin-bottom: 18px;
  color: #d9b64c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.sid-github-pacman-loading h3 {
  margin: 0 0 10px;
  color: #ffffff;
  font-size: 1.45rem;
}

.sid-github-pacman-loading p {
  margin: 0;
  color: rgba(255,255,255,0.62);
  line-height: 1.6;
}

@keyframes sidPacmanMoveForce {
  0% { transform: translateX(0); }
  100% { transform: translateX(196px); }
}

@keyframes sidPacmanTopForce {
  from { transform: rotate(0deg); }
  to { transform: rotate(-42deg); }
}

@keyframes sidPacmanBottomForce {
  from { transform: rotate(0deg); }
  to { transform: rotate(42deg); }
}

@keyframes sidPacmanDotForce {
  0%, 20% {
    opacity: 1;
    transform: scale(1);
  }
  38%, 100% {
    opacity: 0.14;
    transform: scale(0.55);
  }
}

/* SID_END_PACMAN_GITHUB_OBSERVER_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_REAL_20260612
   Pac-Man real do GitHub no lugar do carregamento
   ============================================================ */

#github-projects {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  display: block !important;
}

.github-pacman-real-card {
  position: relative;
  width: 100%;
  padding: 34px;
  border-radius: 34px;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76);
  border: 1px solid rgba(0, 229, 255, 0.20);
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  overflow: hidden;
}

.github-pacman-kicker {
  display: inline-block;
  margin-bottom: 22px;
  color: #d9b64c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.github-pacman-real-frame {
  width: 100%;
  padding: 18px;
  border-radius: 24px;
  background: rgba(0, 0, 0, 0.24);
  border: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.github-pacman-real-frame img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.github-pacman-real-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 24px;
}

.github-pacman-real-footer p {
  margin: 0;
  color: rgba(255,255,255,0.66);
  line-height: 1.6;
}

.github-pacman-real-footer a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 26px;
  border-radius: 999px;
  color: #00e5ff;
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  background: rgba(0,0,0,0.48);
  border: 1px solid rgba(0,229,255,0.28);
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08);
  white-space: nowrap;
}

.github-pacman-real-footer a:hover {
  transform: translateY(-2px);
  box-shadow:
    0 18px 50px rgba(0,0,0,0.45),
    0 0 34px rgba(0,229,255,0.18);
}

@media (max-width: 760px) {
  #github-projects {
    width: min(100% - 32px, 1180px) !important;
  }

  .github-pacman-real-card {
    padding: 24px;
    border-radius: 28px;
  }

  .github-pacman-real-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .github-pacman-real-footer a {
    width: 100%;
  }
}

/* SID_END_GITHUB_PACMAN_REAL_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_STATIC_CARD_20260612
   Card estático com Pac-Man real do GitHub
   ============================================================ */

/* Esconde o bloco que o JS recria com "Carregando repositórios" */
#github-projects {
  display: none !important;
}

.github-pacman-static-card {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  padding: 34px !important;
  border-radius: 34px !important;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76) !important;
  border: 1px solid rgba(0, 229, 255, 0.20) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-pacman-static-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-pacman-static-frame {
  width: 100% !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.24) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-pacman-static-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-pacman-static-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

.github-pacman-static-footer p {
  margin: 0 !important;
  color: rgba(255,255,255,0.66) !important;
  line-height: 1.6 !important;
}

.github-pacman-static-footer a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .github-pacman-static-card {
    width: min(100% - 32px, 1180px) !important;
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .github-pacman-static-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .github-pacman-static-footer a {
    width: 100% !important;
  }
}

/* SID_END_GITHUB_PACMAN_STATIC_CARD_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_FINAL_FIX_20260612
   Pac-Man real do GitHub no lugar do carregamento
   ============================================================ */

#github-projects {
  display: none !important;
}

.github-pacman-static-card {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  padding: 34px !important;
  border-radius: 34px !important;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76) !important;
  border: 1px solid rgba(0, 229, 255, 0.20) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-pacman-static-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-pacman-static-frame {
  width: 100% !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.24) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-pacman-static-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-pacman-static-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

.github-pacman-static-footer p {
  margin: 0 !important;
  color: rgba(255,255,255,0.66) !important;
  line-height: 1.6 !important;
}

.github-pacman-static-footer a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .github-pacman-static-card {
    width: min(100% - 32px, 1180px) !important;
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .github-pacman-static-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .github-pacman-static-footer a {
    width: 100% !important;
  }
}

/* SID_END_GITHUB_PACMAN_FINAL_FIX_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_VISIVEL_20260612
   Pac-Man real visível antes do bloco GitHub antigo
   ============================================================ */

/* Esconde com força o bloco antigo que mostra "Carregando repositórios..." */
#github-projects,
body #github-projects,
main #github-projects,
div#github-projects,
[id="github-projects"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
}

.github-pacman-visible-card {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  padding: 34px !important;
  border-radius: 34px !important;

  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76) !important;

  border: 1px solid rgba(0, 229, 255, 0.20) !important;

  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-pacman-visible-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-pacman-visible-frame {
  width: 100% !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.24) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-pacman-visible-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-pacman-visible-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

.github-pacman-visible-footer p {
  margin: 0 !important;
  color: rgba(255,255,255,0.66) !important;
  line-height: 1.6 !important;
}

.github-pacman-visible-footer a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .github-pacman-visible-card {
    width: min(100% - 32px, 1180px) !important;
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .github-pacman-visible-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .github-pacman-visible-footer a {
    width: 100% !important;
  }
}

/* SID_END_GITHUB_PACMAN_VISIVEL_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_OVERRIDE_FINAL_20260612
   Pac-Man real forçado via JS externo
   ============================================================ */

#github-projects.sid-github-pacman-final-wrapper {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  display: block !important;
}

.sid-github-pacman-final-card {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 72px auto 0 !important;
  padding: 34px !important;
  border-radius: 34px !important;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.76) !important;
  border: 1px solid rgba(0, 229, 255, 0.20) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.sid-github-pacman-final-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.sid-github-pacman-final-frame {
  width: 100% !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.24) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.sid-github-pacman-final-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.sid-github-pacman-final-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

.sid-github-pacman-final-footer p {
  margin: 0 !important;
  color: rgba(255,255,255,0.66) !important;
  line-height: 1.6 !important;
}

.sid-github-pacman-final-footer a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .sid-github-pacman-final-card {
    width: min(100% - 32px, 1180px) !important;
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .sid-github-pacman-final-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .sid-github-pacman-final-footer a {
    width: 100% !important;
  }
}

/* SID_END_GITHUB_PACMAN_OVERRIDE_FINAL_20260612 */


/* ============================================================
   SID_START_AJUSTE_PACMAN_TAMANHO_POSICAO_20260612
   Ajuste final: Pac-Man maior e centralizado na seção GitHub
   ============================================================ */

/* Container geral do Pac-Man */
#github-projects,
#github-projects.sid-github-pacman-final-wrapper {
  width: min(980px, calc(100% - 120px)) !important;
  max-width: 980px !important;
  margin: 72px auto 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Card Pac-Man — pega qualquer versão que tenha ficado ativa */
.sid-github-pacman-final-card,
.github-pacman-visible-card,
.github-pacman-static-card,
.github-pacman-real-card {
  width: min(980px, calc(100vw - 120px)) !important;
  max-width: 980px !important;
  min-height: auto !important;

  margin: 72px auto 0 !important;
  padding: 34px 38px !important;

  border-radius: 34px !important;
  transform: translateX(80px) !important;

  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;

  border: 1px solid rgba(0, 229, 255, 0.22) !important;

  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

/* Título pequeno */
.sid-github-pacman-final-kicker,
.github-pacman-visible-kicker,
.github-pacman-static-kicker,
.github-pacman-kicker {
  display: block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

/* Moldura da imagem */
.sid-github-pacman-final-frame,
.github-pacman-visible-frame,
.github-pacman-static-frame,
.github-pacman-real-frame {
  width: 100% !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

/* SVG Pac-Man maior */
.sid-github-pacman-final-frame img,
.github-pacman-visible-frame img,
.github-pacman-static-frame img,
.github-pacman-real-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 130px !important;
  object-fit: contain !important;
  border-radius: 16px !important;
}

/* Rodapé do card */
.sid-github-pacman-final-footer,
.github-pacman-visible-footer,
.github-pacman-static-footer,
.github-pacman-real-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

/* Texto do rodapé */
.sid-github-pacman-final-footer p,
.github-pacman-visible-footer p,
.github-pacman-static-footer p,
.github-pacman-real-footer p {
  max-width: 560px !important;
  margin: 0 !important;
  color: rgba(255,255,255,0.66) !important;
  line-height: 1.6 !important;
}

/* Botão */
.sid-github-pacman-final-footer a,
.github-pacman-visible-footer a,
.github-pacman-static-footer a,
.github-pacman-real-footer a {
  min-width: 240px !important;
  min-height: 54px !important;
  white-space: nowrap !important;
}

/* Telas médias */
@media (max-width: 1200px) {
  .sid-github-pacman-final-card,
  .github-pacman-visible-card,
  .github-pacman-static-card,
  .github-pacman-real-card {
    transform: translateX(0) !important;
  }
}

/* Mobile */
@media (max-width: 760px) {
  #github-projects,
  #github-projects.sid-github-pacman-final-wrapper {
    width: min(100% - 32px, 980px) !important;
  }

  .sid-github-pacman-final-card,
  .github-pacman-visible-card,
  .github-pacman-static-card,
  .github-pacman-real-card {
    width: min(100% - 32px, 980px) !important;
    padding: 24px !important;
    border-radius: 28px !important;
    transform: none !important;
  }

  .sid-github-pacman-final-footer,
  .github-pacman-visible-footer,
  .github-pacman-static-footer,
  .github-pacman-real-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .sid-github-pacman-final-footer a,
  .github-pacman-visible-footer a,
  .github-pacman-static-footer a,
  .github-pacman-real-footer a {
    width: 100% !important;
  }
}

/* SID_END_AJUSTE_PACMAN_TAMANHO_POSICAO_20260612 */


/* ============================================================
   SID_START_PACMAN_CENTRALIZADO_FINAL_20260612
   Centralização real do card Pac-Man na seção GitHub
   ============================================================ */

.sid-github-pacman-final-card,
.github-pacman-visible-card,
.github-pacman-static-card,
.github-pacman-real-card {
  position: relative !important;

  width: min(980px, calc(100vw - 120px)) !important;
  max-width: 980px !important;

  left: 50% !important;
  transform: translateX(-50%) !important;

  margin-top: 72px !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
}

/* Mantém o conteúdo interno bem distribuído */
.sid-github-pacman-final-frame,
.github-pacman-visible-frame,
.github-pacman-static-frame,
.github-pacman-real-frame {
  width: 100% !important;
}

.sid-github-pacman-final-footer,
.github-pacman-visible-footer,
.github-pacman-static-footer,
.github-pacman-real-footer {
  width: 100% !important;
}

/* Mobile */
@media (max-width: 760px) {
  .sid-github-pacman-final-card,
  .github-pacman-visible-card,
  .github-pacman-static-card,
  .github-pacman-real-card {
    width: min(100% - 32px, 980px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

/* SID_END_PACMAN_CENTRALIZADO_FINAL_20260612 */


/* ============================================================
   SID_START_PACMAN_CENTRO_VIEWPORT_20260612
   Centraliza o card Pac-Man pelo viewport, não pelo container antigo
   ============================================================ */

#github-projects,
#github-projects.sid-github-pacman-final-wrapper {
  width: 100vw !important;
  max-width: none !important;
  margin: 72px 0 0 !important;
  padding: 0 !important;
  display: block !important;
}

.sid-github-pacman-final-card,
.github-pacman-visible-card,
.github-pacman-static-card,
.github-pacman-real-card {
  position: relative !important;

  width: 980px !important;
  max-width: calc(100vw - 120px) !important;

  left: auto !important;
  right: auto !important;
  transform: none !important;

  margin-top: 72px !important;
  margin-bottom: 0 !important;

  /* centro real da tela: 50vw - metade do card */
  margin-left: calc(50vw - 490px) !important;
  margin-right: 0 !important;
}

/* Ajuste fino em telas menores */
@media (max-width: 1100px) {
  .sid-github-pacman-final-card,
  .github-pacman-visible-card,
  .github-pacman-static-card,
  .github-pacman-real-card {
    width: min(100% - 48px, 980px) !important;
    max-width: min(100% - 48px, 980px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* SID_END_PACMAN_CENTRO_VIEWPORT_20260612 */


/* ============================================================
   SID_START_PACMAN_CENTRO_REAL_FLEX_20260612
   Centralização real do Pac-Man dentro da seção GitHub
   ============================================================ */

#github-projects,
#github-projects.sid-github-pacman-final-wrapper {
  width: 100% !important;
  max-width: none !important;

  margin: 52px auto 0 !important;
  padding: 0 !important;

  display: flex !important;
  justify-content: center !important;
  align-items: center !important;

  visibility: visible !important;
  opacity: 1 !important;
}

/* Card final centralizado, sem deslocamento lateral */
.sid-github-pacman-final-card,
.github-pacman-visible-card,
.github-pacman-static-card,
.github-pacman-real-card {
  position: relative !important;

  width: min(980px, calc(100vw - 160px)) !important;
  max-width: 980px !important;

  left: auto !important;
  right: auto !important;
  transform: none !important;

  margin: 0 auto !important;
}

/* Ajuste fino da imagem */
.sid-github-pacman-final-frame,
.github-pacman-visible-frame,
.github-pacman-static-frame,
.github-pacman-real-frame {
  padding: 18px !important;
}

/* Aproxima um pouco o card do cabeçalho */
.github-pacman-static-card,
.sid-github-pacman-final-card {
  margin-top: 0 !important;
}

/* Mobile */
@media (max-width: 760px) {
  #github-projects,
  #github-projects.sid-github-pacman-final-wrapper {
    margin-top: 42px !important;
  }

  .sid-github-pacman-final-card,
  .github-pacman-visible-card,
  .github-pacman-static-card,
  .github-pacman-real-card {
    width: min(100% - 32px, 980px) !important;
  }
}

/* SID_END_PACMAN_CENTRO_REAL_FLEX_20260612 */


/* ============================================================
   SID_START_GITHUB_PACMAN_SIDLOTO_LADO_20260612
   GitHub: Pac-Man + Sidloto lado a lado
   ============================================================ */

#github-projects.sid-github-showcase-wrapper,
#github-projects {
  width: min(1280px, calc(100% - 90px)) !important;
  max-width: 1280px !important;
  margin: 64px auto 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sid-github-showcase-grid {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

.sid-github-pacman-card,
.sid-github-sidloto-card {
  position: relative !important;
  margin: 0 !important;
  padding: 34px !important;
  border-radius: 34px !important;

  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;

  border: 1px solid rgba(0, 229, 255, 0.22) !important;

  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.sid-github-card-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.sid-github-pacman-frame {
  width: 100% !important;
  padding: 18px !important;
  margin-bottom: 28px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.sid-github-pacman-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.sid-github-pacman-card p,
.sid-github-sidloto-card p {
  margin: 0 0 26px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.sid-github-pacman-card a,
.sid-github-sidloto-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;

  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;

  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  white-space: nowrap !important;
}

.sid-sidloto-header {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 24px !important;
}

.sid-sidloto-icon {
  width: 74px !important;
  height: 74px !important;
  border-radius: 22px !important;

  display: grid !important;
  place-items: center !important;

  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;

  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc) !important;

  box-shadow:
    0 18px 50px rgba(0, 229, 255, 0.22),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

.sid-sidloto-header h3 {
  margin: 0 0 6px !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 1 !important;
}

.sid-sidloto-subtitle {
  margin: 0 !important;
  color: rgba(0, 229, 255, 0.82) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.sid-sidloto-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 28px !important;
}

.sid-sidloto-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: rgba(0, 229, 255, 0.075) !important;
  border: 1px solid rgba(0, 229, 255, 0.18) !important;
}

/* Responsivo */
@media (max-width: 1050px) {
  .sid-github-showcase-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  #github-projects.sid-github-showcase-wrapper,
  #github-projects {
    width: min(100% - 32px, 1280px) !important;
  }

  .sid-github-pacman-card,
  .sid-github-sidloto-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }
}

/* SID_END_GITHUB_PACMAN_SIDLOTO_LADO_20260612 */


/* ============================================================
   SID_START_GITHUB_FINAL_SHOWCASE_20260612
   GitHub final estático: Pac-Man + Sidloto lado a lado
   ============================================================ */

/* Esconde definitivamente o bloco antigo do JS */
#github-projects,
body #github-projects,
main #github-projects,
div#github-projects,
[id="github-projects"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Container final centralizado */
.github-final-showcase {
  width: min(1280px, calc(100% - 90px)) !important;
  margin: 64px auto 0 !important;

  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

/* Cards */
.github-final-card {
  position: relative !important;
  padding: 34px !important;
  border-radius: 34px !important;

  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;

  border: 1px solid rgba(0, 229, 255, 0.22) !important;

  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

/* Kicker */
.github-final-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

/* Pac-Man */
.github-final-pacman-frame {
  width: 100% !important;
  padding: 18px !important;
  margin-bottom: 28px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-final-pacman-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

/* Textos */
.github-final-card p {
  margin: 0 0 26px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

/* Botões */
.github-final-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;

  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;

  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  white-space: nowrap !important;
}

/* Sidloto */
.github-final-sidloto-head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 24px !important;
}

.github-final-sidloto-icon {
  width: 74px !important;
  height: 74px !important;
  border-radius: 22px !important;

  display: grid !important;
  place-items: center !important;

  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;

  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc) !important;

  box-shadow:
    0 18px 50px rgba(0, 229, 255, 0.22),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

.github-final-sidloto h3 {
  margin: 0 0 6px !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 1 !important;
}

.github-final-sidloto small {
  color: rgba(0, 229, 255, 0.82) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.github-final-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 28px !important;
}

.github-final-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: rgba(0, 229, 255, 0.075) !important;
  border: 1px solid rgba(0, 229, 255, 0.18) !important;
}

/* Responsivo */
@media (max-width: 1050px) {
  .github-final-showcase {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  .github-final-showcase {
    width: min(100% - 32px, 1280px) !important;
  }

  .github-final-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }
}

/* SID_END_GITHUB_FINAL_SHOWCASE_20260612 */


/* ============================================================
   SID_START_GITHUB_SECAO_FINAL_ESTATICA_20260612
   GitHub estático final: Pac-Man + Sidloto lado a lado
   ============================================================ */

.github-final-section {
  position: relative !important;
  overflow: hidden !important;
}

.github-final-section .section-heading {
  max-width: 980px !important;
  margin: 0 auto 64px !important;
  text-align: center !important;
}

.github-final-section .section-heading span {
  color: #d9b64c !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.28em !important;
}

.github-final-section .section-heading h2 {
  margin: 18px 0 22px !important;
  color: #ffffff !important;
  font-size: clamp(3.4rem, 6vw, 6.2rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
}

.github-final-section .section-heading p {
  max-width: 820px !important;
  margin: 0 auto 34px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.75 !important;
}

.github-final-section .hero-actions {
  justify-content: center !important;
}

.github-final-showcase {
  width: min(1280px, calc(100% - 90px)) !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

.github-final-card {
  padding: 34px !important;
  border-radius: 34px !important;

  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;

  border: 1px solid rgba(0, 229, 255, 0.22) !important;

  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-final-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-final-pacman-frame {
  width: 100% !important;
  padding: 18px !important;
  margin-bottom: 28px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-final-pacman-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-final-card p {
  margin: 0 0 26px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.github-final-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;

  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;

  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  white-space: nowrap !important;
}

.github-final-sidloto-head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 24px !important;
}

.github-final-sidloto-icon {
  width: 74px !important;
  height: 74px !important;
  border-radius: 22px !important;

  display: grid !important;
  place-items: center !important;

  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;

  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc) !important;

  box-shadow:
    0 18px 50px rgba(0, 229, 255, 0.22),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

.github-final-sidloto h3 {
  margin: 0 0 6px !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 1 !important;
}

.github-final-sidloto small {
  color: rgba(0, 229, 255, 0.82) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.github-final-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 28px !important;
}

.github-final-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: rgba(0, 229, 255, 0.075) !important;
  border: 1px solid rgba(0, 229, 255, 0.18) !important;
}

@media (max-width: 1050px) {
  .github-final-showcase {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  .github-final-showcase {
    width: min(100% - 32px, 1280px) !important;
  }

  .github-final-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }
}

/* SID_END_GITHUB_SECAO_FINAL_ESTATICA_20260612 */


/* ============================================================
   SID_START_CORRIGIR_GITHUB_PACMAN_TITULO_20260612
   Corrige título cortado e imagem Pac-Man quebrada
   ============================================================ */

/* Evita que o menu fixo cubra o título ao navegar por âncora */
#github,
.github-final-section {
  scroll-margin-top: 120px !important;
  padding-top: clamp(120px, 10vw, 160px) !important;
}

/* Corrige o título que estava entrando atrás do header */
.github-final-section .section-heading {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Garante que o título apareça inteiro */
.github-final-section .section-heading h2 {
  overflow: visible !important;
  padding-top: 8px !important;
}

/* Card geral */
.github-final-showcase {
  margin-top: 54px !important;
}

/* Moldura do Pac-Man */
.github-final-pacman-frame {
  min-height: 150px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Imagem Pac-Man */
.github-final-pacman-frame img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 120px !important;
  object-fit: contain !important;
}

/* Ajusta melhor o card Sidloto */
.github-final-sidloto {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* SID_END_CORRIGIR_GITHUB_PACMAN_TITULO_20260612 */


/* ============================================================
   SID_START_GITHUB_ULTRA_FINAL_20260612
   GitHub ultra final: Pac-Man Base64 + Sidloto lado a lado
   ============================================================ */

.github-ultra-section {
  position: relative !important;
  overflow: hidden !important;
  padding-top: clamp(145px, 11vw, 185px) !important;
  padding-bottom: clamp(100px, 9vw, 150px) !important;
  min-height: auto !important;
  scroll-margin-top: 120px !important;
}

.github-ultra-heading {
  max-width: 980px !important;
  margin: 0 auto 62px !important;
  text-align: center !important;
}

.github-ultra-heading span {
  display: inline-block !important;
  color: #d9b64c !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  margin-bottom: 18px !important;
}

.github-ultra-heading h2 {
  margin: 0 0 22px !important;
  color: #ffffff !important;
  font-size: clamp(3.4rem, 6vw, 6.2rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
}

.github-ultra-heading p {
  max-width: 820px !important;
  margin: 0 auto 34px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.75 !important;
}

.github-ultra-actions {
  justify-content: center !important;
}

.github-ultra-grid {
  width: min(1280px, calc(100% - 90px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

.github-ultra-card {
  padding: 34px !important;
  border-radius: 34px !important;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;
  border: 1px solid rgba(0, 229, 255, 0.22) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-ultra-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-ultra-pacman-frame {
  width: 100% !important;
  padding: 18px !important;
  margin-bottom: 28px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
}

.github-ultra-pacman-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-ultra-card p {
  margin: 0 0 26px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.github-ultra-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  box-shadow:
    0 12px 35px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  white-space: nowrap !important;
}

.github-ultra-sidloto {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.github-ultra-sidloto-head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 24px !important;
}

.github-ultra-sidloto-icon {
  width: 74px !important;
  height: 74px !important;
  border-radius: 22px !important;
  display: grid !important;
  place-items: center !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc) !important;
  box-shadow:
    0 18px 50px rgba(0, 229, 255, 0.22),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

.github-ultra-sidloto h3 {
  margin: 0 0 6px !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 1 !important;
}

.github-ultra-sidloto small {
  color: rgba(0, 229, 255, 0.82) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.github-ultra-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 28px !important;
}

.github-ultra-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: rgba(0, 229, 255, 0.075) !important;
  border: 1px solid rgba(0, 229, 255, 0.18) !important;
}

@media (max-width: 1050px) {
  .github-ultra-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  .github-ultra-grid {
    width: min(100% - 32px, 1280px) !important;
  }

  .github-ultra-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }
}

/* SID_END_GITHUB_ULTRA_FINAL_20260612 */


/* ============================================================
   SID_START_GITHUB_CLEAN_FINAL_20260612
   Seção GitHub limpa: Pac-Man inline + Sidloto
   ============================================================ */

.github-clean-section {
  position: relative !important;
  overflow: hidden !important;
  padding-top: clamp(145px, 11vw, 185px) !important;
  padding-bottom: clamp(100px, 9vw, 150px) !important;
  scroll-margin-top: 120px !important;
}

.github-clean-heading {
  max-width: 980px !important;
  margin: 0 auto 62px !important;
  text-align: center !important;
}

.github-clean-heading span {
  display: inline-block !important;
  margin-bottom: 18px !important;
  color: #d9b64c !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.28em !important;
}

.github-clean-heading h2 {
  margin: 0 0 22px !important;
  color: #ffffff !important;
  font-size: clamp(3.4rem, 6vw, 6.2rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
}

.github-clean-heading p {
  max-width: 820px !important;
  margin: 0 auto 34px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.75 !important;
}

.github-clean-actions {
  justify-content: center !important;
}

.github-clean-grid {
  width: min(1280px, calc(100% - 90px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

.github-clean-card {
  padding: 34px !important;
  border-radius: 34px !important;
  background:
    linear-gradient(145deg, rgba(0, 217, 255, 0.08), rgba(255, 70, 220, 0.045)),
    rgba(10, 22, 32, 0.78) !important;
  border: 1px solid rgba(0, 229, 255, 0.22) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.34),
    0 0 70px rgba(0, 229, 255, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.github-clean-kicker {
  display: inline-block !important;
  margin-bottom: 22px !important;
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.github-clean-pacman-frame {
  width: 100% !important;
  padding: 18px !important;
  margin-bottom: 28px !important;
  border-radius: 24px !important;
  background: rgba(0, 0, 0, 0.26) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  overflow: hidden !important;
}

.github-clean-pacman-frame svg {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
}

.github-clean-card p {
  margin: 0 0 26px !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.github-clean-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  color: #00e5ff !important;
  text-decoration: none !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  background: rgba(0,0,0,0.48) !important;
  border: 1px solid rgba(0,229,255,0.28) !important;
  white-space: nowrap !important;
}

.github-clean-sidloto {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.github-clean-sidloto-head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 24px !important;
}

.github-clean-sidloto-icon {
  width: 74px !important;
  height: 74px !important;
  border-radius: 22px !important;
  display: grid !important;
  place-items: center !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.95), transparent 18%),
    linear-gradient(135deg, #00e5ff, #233dff 46%, #ff46dc) !important;
}

.github-clean-sidloto h3 {
  margin: 0 0 6px !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 1 !important;
}

.github-clean-sidloto small {
  color: rgba(0,229,255,0.82) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.github-clean-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 28px !important;
}

.github-clean-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,0.82) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  background: rgba(0,229,255,0.075) !important;
  border: 1px solid rgba(0,229,255,0.18) !important;
}

@media (max-width: 1050px) {
  .github-clean-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  .github-clean-grid {
    width: min(100% - 32px, 1280px) !important;
  }

  .github-clean-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }
}

/* SID_END_GITHUB_CLEAN_FINAL_20260612 */


/* ============================================================
   SID_START_HIDE_GITHUB_LEGACY_DUPLICADO_20260612
   Esconde sobras antigas da seção GitHub duplicada
   ============================================================ */

#github-final-showcase,
.github-final-showcase,
.github-final-card,
.github-final-pacman,
.github-final-sidloto {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.github-ultra-section,
.github-clean-section {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* SID_END_HIDE_GITHUB_LEGACY_DUPLICADO_20260612 */


/* ============================================================
   SID_START_AJUSTE_ICONE_SIDLOTO_PADRAO_20260612
   Ajusta o ícone SL do Sidloto para o padrão visual do site
   ============================================================ */

.github-clean-sidloto-icon,
.github-ultra-sidloto-icon,
.github-final-sidloto-icon,
.sid-sidloto-icon {
  width: 62px !important;
  height: 62px !important;
  min-width: 62px !important;
  border-radius: 999px !important;

  display: grid !important;
  place-items: center !important;

  color: #ffffff !important;
  font-size: 0.88rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;

  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,0.95) 0 8%, transparent 18%),
    radial-gradient(circle at 45% 45%, #00e5ff 0%, #118dff 42%, #005d8f 72%, #001018 100%) !important;

  border: 1px solid rgba(0, 229, 255, 0.42) !important;

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.42),
    inset 0 -8px 18px rgba(0,0,0,0.38),
    0 0 22px rgba(0, 229, 255, 0.34),
    0 12px 32px rgba(0,0,0,0.42) !important;

  text-shadow: 0 0 10px rgba(255,255,255,0.42) !important;
}

/* Deixa o cabeçalho do Sidloto mais alinhado */
.github-clean-sidloto-head,
.github-ultra-sidloto-head,
.github-final-sidloto-head,
.sid-sidloto-header {
  align-items: center !important;
  gap: 20px !important;
}

/* Ajusta o botão ABRIR SIDLOTO para ficar no mesmo padrão premium */
.github-clean-sidloto a,
.github-ultra-sidloto a,
.github-final-sidloto a,
.sid-github-sidloto-card a {
  min-height: 56px !important;
  border-radius: 999px !important;

  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.98), rgba(0, 0, 0, 0.96)) !important;

  border: 1px solid rgba(0, 229, 255, 0.36) !important;

  color: #00e5ff !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;

  box-shadow:
    0 14px 34px rgba(0,0,0,0.42),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -10px 18px rgba(0,0,0,0.36),
    0 0 22px rgba(0,229,255,0.10) !important;
}

.github-clean-sidloto a:hover,
.github-ultra-sidloto a:hover,
.github-final-sidloto a:hover,
.sid-github-sidloto-card a:hover {
  transform: translateY(-2px) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,0.50),
    0 0 30px rgba(0,229,255,0.20),
    inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

/* SID_END_AJUSTE_ICONE_SIDLOTO_PADRAO_20260612 */


/* ============================================================
   SID_START_AJUSTE_PACMAN_SIDLOTO_FINAL_20260612
   Ajuste: janela Pac-Man maior + botão Sidloto no padrão
   ============================================================ */

/* Janela do Pac-Man maior e mais presente */
.github-clean-pacman-frame,
.github-ultra-pacman-frame,
.github-final-pacman-frame,
.github-final-pacman-frame,
.sid-github-pacman-frame {
  min-height: 190px !important;
  padding: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 26px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,229,255,0.06), transparent 62%),
    rgba(0,0,0,0.30) !important;

  border: 1px solid rgba(0,229,255,0.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -16px 34px rgba(0,0,0,0.34),
    0 0 38px rgba(0,229,255,0.07) !important;
}

/* Aumenta o conteúdo do Pac-Man dentro da janela */
.github-clean-pacman-frame svg,
.github-ultra-pacman-frame svg,
.github-final-pacman-frame svg,
.github-clean-pacman-frame img,
.github-ultra-pacman-frame img,
.github-final-pacman-frame img,
.sid-github-pacman-frame img {
  width: 116% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 150px !important;
  object-fit: contain !important;
  transform: scale(1.08) !important;
  transform-origin: center center !important;
}

/* Card Pac-Man com respiro melhor */
.github-clean-pacman,
.github-ultra-pacman,
.github-final-pacman,
.sid-github-pacman-card {
  padding: 38px !important;
}

/* Botão ABRIR SIDLOTO no padrão dos botões principais */
.github-clean-sidloto > a,
.github-ultra-sidloto > a,
.github-final-sidloto > a,
.sid-github-sidloto-card > a {
  position: relative !important;

  width: fit-content !important;
  min-width: 260px !important;
  max-width: 100% !important;
  min-height: 58px !important;

  padding: 0 30px 0 72px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #ffffff !important;
  background:
    linear-gradient(180deg, rgba(8,13,18,0.98), rgba(0,0,0,0.96)) !important;

  border: 1px solid rgba(0,229,255,0.36) !important;

  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-decoration: none !important;

  box-shadow:
    0 14px 34px rgba(0,0,0,0.46),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -12px 18px rgba(0,0,0,0.40),
    0 0 24px rgba(0,229,255,0.10) !important;

  overflow: hidden !important;
}

/* Bolinha ciano à esquerda do botão */
.github-clean-sidloto > a::before,
.github-ultra-sidloto > a::before,
.github-final-sidloto > a::before,
.sid-github-sidloto-card > a::before {
  content: "" !important;
  position: absolute !important;
  left: 13px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;

  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.95) 0 8%, transparent 18%),
    radial-gradient(circle at 42% 45%, #00e5ff 0%, #159cff 45%, #005b8e 74%, #001018 100%) !important;

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.42),
    inset 0 -8px 16px rgba(0,0,0,0.36),
    0 0 18px rgba(0,229,255,0.45) !important;
}

/* Hover igual ao padrão premium */
.github-clean-sidloto > a:hover,
.github-ultra-sidloto > a:hover,
.github-final-sidloto > a:hover,
.sid-github-sidloto-card > a:hover {
  transform: translateY(-2px) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,0.52),
    0 0 34px rgba(0,229,255,0.20),
    inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

/* Deixa o card Sidloto menos espremido */
.github-clean-sidloto,
.github-ultra-sidloto,
.github-final-sidloto,
.sid-github-sidloto-card {
  padding: 38px !important;
}

/* Em telas menores, botão ocupa largura total */
@media (max-width: 760px) {
  .github-clean-sidloto > a,
  .github-ultra-sidloto > a,
  .github-final-sidloto > a,
  .sid-github-sidloto-card > a {
    width: 100% !important;
  }

  .github-clean-pacman-frame,
  .github-ultra-pacman-frame,
  .github-final-pacman-frame,
  .sid-github-pacman-frame {
    min-height: 150px !important;
  }
}

/* SID_END_AJUSTE_PACMAN_SIDLOTO_FINAL_20260612 */


/* ============================================================
   SID_START_PACMAN_BOTAO_PADRAO_FINAL_20260612
   Pac-Man sem corte + botão Sidloto no padrão do Hero
   ============================================================ */

/* Dá mais largura para a área GitHub */
.github-clean-grid,
.github-ultra-grid,
.github-final-showcase {
  width: min(1440px, calc(100% - 80px)) !important;
  grid-template-columns: minmax(0, 1.55fr) minmax(360px, 0.75fr) !important;
  gap: 30px !important;
}

/* Card do Pac-Man mais largo */
.github-clean-pacman,
.github-ultra-pacman,
.github-final-pacman,
.sid-github-pacman-card {
  padding: 38px !important;
}

/* Janela do Pac-Man mais larga e sem cortar laterais */
.github-clean-pacman-frame,
.github-ultra-pacman-frame,
.github-final-pacman-frame,
.sid-github-pacman-frame {
  width: 100% !important;
  min-height: 190px !important;
  padding: 14px 18px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  overflow: hidden !important;
  border-radius: 26px !important;

  background:
    radial-gradient(circle at 50% 50%, rgba(0,229,255,0.055), transparent 62%),
    rgba(0,0,0,0.30) !important;

  border: 1px solid rgba(0,229,255,0.16) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -16px 34px rgba(0,0,0,0.34),
    0 0 38px rgba(0,229,255,0.07) !important;
}

/* Remove o zoom que estava cortando o Pac-Man nas margens */
.github-clean-pacman-frame svg,
.github-ultra-pacman-frame svg,
.github-final-pacman-frame svg,
.github-clean-pacman-frame img,
.github-ultra-pacman-frame img,
.github-final-pacman-frame img,
.sid-github-pacman-frame img {
  display: block !important;

  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;

  min-height: 0 !important;
  object-fit: contain !important;

  transform: none !important;
  scale: 1 !important;
  margin: 0 auto !important;
}

/* Botão ABRIR SIDLOTO igual ao padrão dos botões principais */
.github-clean-sidloto > a,
.github-ultra-sidloto > a,
.github-final-sidloto > a,
.sid-github-sidloto-card > a {
  position: relative !important;

  width: fit-content !important;
  min-width: 280px !important;
  min-height: 60px !important;

  padding: 0 34px 0 78px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.98), rgba(0, 0, 0, 0.98)) !important;

  border: 1px solid rgba(0, 229, 255, 0.38) !important;

  color: #ffffff !important;
  font-size: 0.82rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-decoration: none !important;

  box-shadow:
    0 16px 36px rgba(0,0,0,0.48),
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 -12px 20px rgba(0,0,0,0.42),
    0 0 24px rgba(0,229,255,0.12) !important;

  overflow: hidden !important;
}

/* Orbe do botão, igual ao Hero */
.github-clean-sidloto > a::before,
.github-ultra-sidloto > a::before,
.github-final-sidloto > a::before,
.sid-github-sidloto-card > a::before {
  content: "" !important;
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;

  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.96) 0 8%, transparent 18%),
    radial-gradient(circle at 42% 45%, #00e5ff 0%, #159cff 45%, #005b8e 74%, #001018 100%) !important;

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.44),
    inset 0 -8px 16px rgba(0,0,0,0.36),
    0 0 20px rgba(0,229,255,0.48) !important;
}

/* Efeito pressionável */
.github-clean-sidloto > a:hover,
.github-ultra-sidloto > a:hover,
.github-final-sidloto > a:hover,
.sid-github-sidloto-card > a:hover {
  transform: translateY(-2px) !important;
  box-shadow:
    0 20px 48px rgba(0,0,0,0.54),
    0 0 34px rgba(0,229,255,0.20),
    inset 0 1px 0 rgba(255,255,255,0.14) !important;
}

.github-clean-sidloto > a:active,
.github-ultra-sidloto > a:active,
.github-final-sidloto > a:active,
.sid-github-sidloto-card > a:active {
  transform: translateY(1px) !important;
  box-shadow:
    0 8px 18px rgba(0,0,0,0.48),
    inset 0 4px 12px rgba(0,0,0,0.58) !important;
}

/* Mobile */
@media (max-width: 1050px) {
  .github-clean-grid,
  .github-ultra-grid,
  .github-final-showcase {
    grid-template-columns: 1fr !important;
    width: min(100% - 48px, 1280px) !important;
  }
}

@media (max-width: 760px) {
  .github-clean-pacman-frame,
  .github-ultra-pacman-frame,
  .github-final-pacman-frame,
  .sid-github-pacman-frame {
    min-height: 135px !important;
    padding: 10px !important;
  }

  .github-clean-sidloto > a,
  .github-ultra-sidloto > a,
  .github-final-sidloto > a,
  .sid-github-sidloto-card > a {
    width: 100% !important;
  }
}

/* SID_END_PACMAN_BOTAO_PADRAO_FINAL_20260612 */


/* ============================================================
   SID_START_REMOVER_ICONE_SL_PACMAN_10_20260612
   Remove ícone SL e aumenta janela Pac-Man em 10%
   ============================================================ */

/* Apaga o ícone/bolinha SL sinalizado */
.github-clean-sidloto-icon,
.github-ultra-sidloto-icon,
.github-final-sidloto-icon,
.sid-sidloto-icon,
[class*="sidloto-icon"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Reorganiza o cabeçalho do Sidloto depois de remover o ícone */
.github-clean-sidloto-head,
.github-ultra-sidloto-head,
.github-final-sidloto-head,
.sid-sidloto-header {
  display: block !important;
  margin-bottom: 24px !important;
}

.github-clean-sidloto h3,
.github-ultra-sidloto h3,
.github-final-sidloto h3,
.sid-github-sidloto-card h3 {
  margin-left: 0 !important;
}

/* Dá mais espaço para o card do Pac-Man */
.github-clean-grid,
.github-ultra-grid,
.github-final-showcase {
  width: min(1480px, calc(100% - 72px)) !important;
  grid-template-columns: minmax(0, 1.72fr) minmax(340px, 0.68fr) !important;
  gap: 30px !important;
}

/* Janela do Pac-Man 10% mais larga */
.github-clean-pacman-frame,
.github-ultra-pacman-frame,
.github-final-pacman-frame,
.sid-github-pacman-frame {
  width: 110% !important;
  max-width: none !important;
  margin-left: -5% !important;
  margin-right: -5% !important;

  min-height: 190px !important;
  padding: 14px 18px !important;

  overflow: hidden !important;
}

/* Mantém o desenho dentro da janela, sem zoom extra */
.github-clean-pacman-frame svg,
.github-ultra-pacman-frame svg,
.github-final-pacman-frame svg,
.github-clean-pacman-frame img,
.github-ultra-pacman-frame img,
.github-final-pacman-frame img,
.sid-github-pacman-frame img {
  width: 100% !important;
  max-width: 100% !important;
  transform: none !important;
  scale: 1 !important;
  object-fit: contain !important;
}

/* Mobile volta para 100% para não quebrar */
@media (max-width: 1050px) {
  .github-clean-grid,
  .github-ultra-grid,
  .github-final-showcase {
    grid-template-columns: 1fr !important;
    width: min(100% - 48px, 1280px) !important;
  }

  .github-clean-pacman-frame,
  .github-ultra-pacman-frame,
  .github-final-pacman-frame,
  .sid-github-pacman-frame {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* SID_END_REMOVER_ICONE_SL_PACMAN_10_20260612 */


/* ============================================================
   SID_START_AJUSTE_JANELA_PACMAN_PROPORCAO_20260612
   Ajuste marcado: menos largura lateral + mais altura vertical
   ============================================================ */

/* Janela do Pac-Man: volta para dentro do card e ganha altura */
.github-clean-pacman-frame,
.github-ultra-pacman-frame,
.github-final-pacman-frame,
.sid-github-pacman-frame {
  width: 100% !important;
  max-width: 100% !important;

  margin-left: 0 !important;
  margin-right: 0 !important;

  min-height: 245px !important;
  height: 245px !important;

  padding: 18px 22px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  overflow: hidden !important;
  border-radius: 26px !important;

  background:
    radial-gradient(circle at 50% 45%, rgba(0,229,255,0.07), transparent 64%),
    rgba(0,0,0,0.30) !important;

  border: 1px solid rgba(0,229,255,0.16) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -18px 36px rgba(0,0,0,0.36),
    0 0 38px rgba(0,229,255,0.07) !important;
}

/* SVG/imagem do Pac-Man: centralizado, sem cortar e sem esticar para fora */
.github-clean-pacman-frame svg,
.github-ultra-pacman-frame svg,
.github-final-pacman-frame svg,
.github-clean-pacman-frame img,
.github-ultra-pacman-frame img,
.github-final-pacman-frame img,
.sid-github-pacman-frame img {
  display: block !important;

  width: 100% !important;
  max-width: 100% !important;

  height: 100% !important;
  max-height: 100% !important;

  object-fit: contain !important;

  transform: none !important;
  scale: 1 !important;

  margin: 0 auto !important;
}

/* Dá um pouco mais de corpo ao card do Pac-Man */
.github-clean-pacman,
.github-ultra-pacman,
.github-final-pacman,
.sid-github-pacman-card {
  padding: 38px !important;
}

/* Mantém a coluna do Pac-Man ampla, mas sem forçar a janela para fora */
.github-clean-grid,
.github-ultra-grid,
.github-final-showcase {
  width: min(1440px, calc(100% - 88px)) !important;
  grid-template-columns: minmax(0, 1.6fr) minmax(360px, 0.75fr) !important;
  gap: 30px !important;
}

/* Mobile */
@media (max-width: 1050px) {
  .github-clean-grid,
  .github-ultra-grid,
  .github-final-showcase {
    grid-template-columns: 1fr !important;
    width: min(100% - 48px, 1280px) !important;
  }

  .github-clean-pacman-frame,
  .github-ultra-pacman-frame,
  .github-final-pacman-frame,
  .sid-github-pacman-frame {
    height: 210px !important;
    min-height: 210px !important;
  }
}

@media (max-width: 760px) {
  .github-clean-pacman-frame,
  .github-ultra-pacman-frame,
  .github-final-pacman-frame,
  .sid-github-pacman-frame {
    height: 160px !important;
    min-height: 160px !important;
    padding: 10px !important;
  }
}

/* SID_END_AJUSTE_JANELA_PACMAN_PROPORCAO_20260612 */


/* ============================================================
   SID_START_BOTOES_GITHUB_PADRAO_HERO_20260612
   Botões da seção GitHub no mesmo padrão do Hero
   ============================================================ */

/* Base dos botões da seção GitHub */
.github-clean-card a,
.github-ultra-card a,
.github-final-card a {
  position: relative !important;

  min-height: 58px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.98), rgba(0, 0, 0, 0.98)) !important;

  border: 1px solid rgba(0, 229, 255, 0.36) !important;

  color: #00e5ff !important;
  text-decoration: none !important;

  font-size: 0.82rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;

  box-shadow:
    0 16px 36px rgba(0,0,0,0.48),
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 -12px 20px rgba(0,0,0,0.42),
    0 0 24px rgba(0,229,255,0.12) !important;

  overflow: hidden !important;
}

/* Botão ABRIR PERFIL GITHUB — padrão secundário igual ao VER GITHUB */
.github-clean-pacman > a,
.github-ultra-pacman > a,
.github-final-pacman > a,
.sid-github-pacman-card > a {
  min-width: 260px !important;
  padding: 0 34px !important;

  color: #00e5ff !important;
}

.github-clean-pacman > a::before,
.github-ultra-pacman > a::before,
.github-final-pacman > a::before,
.sid-github-pacman-card > a::before {
  display: none !important;
  content: none !important;
}

/* Botão ABRIR SIDLOTO — padrão primário igual ao VER PROJETOS */
.github-clean-sidloto > a,
.github-ultra-sidloto > a,
.github-final-sidloto > a,
.sid-github-sidloto-card > a {
  min-width: 285px !important;
  padding: 0 34px 0 80px !important;

  color: #ffffff !important;
}

/* Bolinha ciano do botão ABRIR SIDLOTO */
.github-clean-sidloto > a::before,
.github-ultra-sidloto > a::before,
.github-final-sidloto > a::before,
.sid-github-sidloto-card > a::before {
  content: "" !important;

  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;

  display: block !important;

  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.96) 0 8%, transparent 18%),
    radial-gradient(circle at 42% 45%, #00e5ff 0%, #159cff 45%, #005b8e 74%, #001018 100%) !important;

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.44),
    inset 0 -8px 16px rgba(0,0,0,0.36),
    0 0 20px rgba(0,229,255,0.48) !important;
}

/* Hover padrão premium */
.github-clean-card a:hover,
.github-ultra-card a:hover,
.github-final-card a:hover {
  transform: translateY(-2px) !important;

  box-shadow:
    0 20px 48px rgba(0,0,0,0.54),
    0 0 34px rgba(0,229,255,0.20),
    inset 0 1px 0 rgba(255,255,255,0.14) !important;
}

/* Clique físico */
.github-clean-card a:active,
.github-ultra-card a:active,
.github-final-card a:active {
  transform: translateY(1px) !important;

  box-shadow:
    0 8px 18px rgba(0,0,0,0.48),
    inset 0 4px 12px rgba(0,0,0,0.58) !important;
}

/* Alinhamento dos botões dentro dos cards */
.github-clean-pacman > a,
.github-ultra-pacman > a,
.github-final-pacman > a {
  margin-top: 8px !important;
}

.github-clean-sidloto > a,
.github-ultra-sidloto > a,
.github-final-sidloto > a {
  margin-top: 12px !important;
}

/* Mobile */
@media (max-width: 760px) {
  .github-clean-card a,
  .github-ultra-card a,
  .github-final-card a {
    width: 100% !important;
  }
}

/* SID_END_BOTOES_GITHUB_PADRAO_HERO_20260612 */


/* Ajuste fino: largura do botão ABRIR PERFIL GITHUB */
.github-clean-pacman > a,
.github-ultra-pacman > a,
.github-final-pacman > a {
  min-width: 300px !important;
  min-height: 60px !important;
  padding: 0 38px !important;
}


/* ============================================================
   SID_START_GALERIA_TEXTOS_PROFISSIONAIS_20260612
   Refinamento textual e visual da galeria
   ============================================================ */

#galeria .section-heading h2,
#gallery .section-heading h2 {
  letter-spacing: -0.045em !important;
}

#galeria .section-heading p,
#gallery .section-heading p {
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

#galeria h3,
#galeria h4,
#gallery h3,
#gallery h4 {
  color: #ffffff !important;
}

#galeria span,
#gallery span {
  letter-spacing: 0.16em;
}

/* SID_END_GALERIA_TEXTOS_PROFISSIONAIS_20260612 */


/* ============================================================
   SID_START_GALERIA_4_CARDS_CURADA_20260612
   Galeria curada com apenas 4 projetos visuais
   ============================================================ */

.sid-gallery-hidden-extra {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#galeria .section-heading,
#gallery .section-heading {
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

#galeria .section-heading h2,
#gallery .section-heading h2 {
  font-size: clamp(3rem, 5.8vw, 5.8rem) !important;
  letter-spacing: -0.055em !important;
}

#galeria .section-heading p,
#gallery .section-heading p {
  max-width: 840px !important;
  margin: 22px auto 0 !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.sid-gallery-curated-card h3 {
  color: #ffffff !important;
  font-size: 1.12rem !important;
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}

.sid-gallery-tag {
  color: #00e5ff !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

/* SID_END_GALERIA_4_CARDS_CURADA_20260612 */


/* ============================================================
   SID_START_GALERIA_4_FOTOS_ESCOLHIDAS_20260612
   Galeria com 4 imagens escolhidas
   ============================================================ */

.sid-gallery-hidden-extra {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.sid-gallery-curated-card img {
  width: 100% !important;
  height: 520px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.sid-gallery-curated-card h3 {
  color: #ffffff !important;
  font-size: 1.12rem !important;
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}

.sid-gallery-tag {
  color: #d9b64c !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

#galeria .section-heading p,
#gallery .section-heading p {
  max-width: 840px !important;
  margin: 22px auto 0 !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

@media (max-width: 760px) {
  .sid-gallery-curated-card img {
    height: 420px !important;
  }
}

/* SID_END_GALERIA_4_FOTOS_ESCOLHIDAS_20260612 */


/* ============================================================
   SID_START_AJUSTE_GALERIA_CRIACAO_DIGITAL_20260612
   Galeria: cards menores + texto Criação Digital
   ============================================================ */

/* Afasta a galeria das margens laterais */
#galeria,
#gallery {
  padding-left: clamp(42px, 6vw, 110px) !important;
  padding-right: clamp(42px, 6vw, 110px) !important;
}

/* Reduz a largura geral da grade */
#galeria .gallery-grid,
#galeria .media-grid,
#galeria .visual-grid,
#galeria .images-grid,
#gallery .gallery-grid,
#gallery .media-grid,
#gallery .visual-grid,
#gallery .images-grid {
  width: min(1180px, 100%) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 24px !important;
}

/* Cards da galeria um pouco menores e mais refinados */
.sid-gallery-curated-card,
#galeria article,
#gallery article {
  max-width: 300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 26px !important;
}

/* Imagens menores para não encostar na margem */
.sid-gallery-curated-card img,
#galeria article img,
#gallery article img {
  height: 440px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 20px !important;
}

/* Texto de categoria mais curto e elegante */
.sid-gallery-tag {
  color: #d9b64c !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  white-space: normal !important;
  line-height: 1.4 !important;
}

/* Título do card */
.sid-gallery-curated-card h3,
#galeria article h3,
#gallery article h3 {
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
}

/* Garante que o último texto fique como Criação Digital visualmente */
.sid-gallery-curated-card:nth-of-type(4) .sid-gallery-tag {
  font-size: 0.74rem !important;
}

/* Responsivo */
@media (max-width: 1100px) {
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 280px !important;
  }

  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 400px !important;
  }
}

@media (max-width: 760px) {
  #galeria,
  #gallery {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 100% !important;
  }

  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 380px !important;
  }
}

/* SID_END_AJUSTE_GALERIA_CRIACAO_DIGITAL_20260612 */


/* ============================================================
   SID_START_GALERIA_TEXTOS_QUADROS_LARGOS_20260612
   Corrige textos e deixa quadros da galeria mais largos
   ============================================================ */

.sid-gallery-hidden-extra {
  display: none !important;
}

/* Área da galeria com mais respiro lateral */
#galeria,
#gallery,
.sid-gallery-final-wide {
  padding-left: clamp(48px, 7vw, 130px) !important;
  padding-right: clamp(48px, 7vw, 130px) !important;
}

/* Deixa a grade mais equilibrada */
#galeria .gallery-grid,
#galeria .media-grid,
#galeria .visual-grid,
#galeria .images-grid,
#gallery .gallery-grid,
#gallery .media-grid,
#gallery .visual-grid,
#gallery .images-grid,
.sid-gallery-final-wide .gallery-grid,
.sid-gallery-final-wide .media-grid,
.sid-gallery-final-wide .visual-grid,
.sid-gallery-final-wide .images-grid {
  width: min(1320px, 100%) !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 28px !important;
}

/* Cards mais largos */
.sid-gallery-final-card,
.sid-gallery-curated-card,
#galeria article,
#gallery article {
  max-width: 360px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 28px !important;
}

/* Imagens sem corte */
.sid-gallery-final-card img,
.sid-gallery-curated-card img,
#galeria article img,
#gallery article img {
  width: 100% !important;
  height: 470px !important;

  object-fit: contain !important;
  object-position: center !important;

  background:
    radial-gradient(circle at 50% 45%, rgba(0,229,255,0.06), transparent 60%),
    rgba(0,0,0,0.55) !important;

  border-radius: 20px !important;
}

/* Categoria */
.sid-gallery-tag {
  display: block !important;
  color: #d9b64c !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
  margin: 14px 0 10px !important;
}

/* Títulos */
.sid-gallery-final-card h3,
.sid-gallery-curated-card h3,
#galeria article h3,
#gallery article h3 {
  color: #ffffff !important;
  font-size: 1.08rem !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

/* Reduz risco de texto quebrado estranho */
.sid-gallery-final-card,
.sid-gallery-curated-card {
  overflow: hidden !important;
}

/* Responsivo */
@media (max-width: 1250px) {
  .sid-gallery-final-card,
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 330px !important;
  }

  .sid-gallery-final-card img,
  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 440px !important;
  }
}

@media (max-width: 760px) {
  #galeria,
  #gallery,
  .sid-gallery-final-wide {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .sid-gallery-final-card,
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 100% !important;
  }

  .sid-gallery-final-card img,
  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 390px !important;
  }
}

/* SID_END_GALERIA_TEXTOS_QUADROS_LARGOS_20260612 */


/* ============================================================
   SID_START_GALERIA_LAYOUT_FINAL_PROFISSIONAL_20260612
   Galeria: cards mais largos, imagens proporcionais e textos corrigidos
   ============================================================ */

#galeria,
#gallery {
  scroll-margin-top: 130px !important;
  padding-top: clamp(130px, 10vw, 170px) !important;
  padding-left: clamp(42px, 5vw, 90px) !important;
  padding-right: clamp(42px, 5vw, 90px) !important;
}

#galeria .section-heading,
#gallery .section-heading {
  max-width: 980px !important;
  margin: 0 auto 58px !important;
  text-align: center !important;
}

#galeria .gallery-grid,
#galeria .media-grid,
#galeria .visual-grid,
#galeria .images-grid,
#gallery .gallery-grid,
#gallery .media-grid,
#gallery .visual-grid,
#gallery .images-grid,
.sid-gallery-final-wide .gallery-grid,
.sid-gallery-final-wide .media-grid,
.sid-gallery-final-wide .visual-grid,
.sid-gallery-final-wide .images-grid {
  width: min(1360px, 100%) !important;
  max-width: 1360px !important;
  margin-left: auto !important;
  margin-right: auto !important;

  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 30px !important;
  align-items: stretch !important;
}

.sid-gallery-final-card,
.sid-gallery-curated-card,
#galeria article,
#gallery article {
  width: 100% !important;
  max-width: 330px !important;
  min-width: 0 !important;

  margin-left: auto !important;
  margin-right: auto !important;

  padding: 14px 14px 22px !important;
  border-radius: 28px !important;

  background:
    linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.015)),
    rgba(35, 18, 39, 0.78) !important;

  border: 1px solid rgba(255,255,255,0.13) !important;

  box-shadow:
    0 24px 70px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  overflow: hidden !important;
}

.sid-gallery-final-card img,
.sid-gallery-curated-card img,
#galeria article img,
#gallery article img {
  width: 100% !important;
  height: 420px !important;

  object-fit: cover !important;
  object-position: center !important;

  border-radius: 20px !important;
  background: rgba(0,0,0,0.45) !important;

  display: block !important;
}

.sid-gallery-final-card:nth-of-type(1) img,
.sid-gallery-curated-card:nth-of-type(1) img,
#galeria article:nth-of-type(1) img {
  object-position: center center !important;
}

.sid-gallery-final-card:nth-of-type(2) img,
.sid-gallery-curated-card:nth-of-type(2) img,
#galeria article:nth-of-type(2) img {
  object-position: center top !important;
}

.sid-gallery-final-card:nth-of-type(3) img,
.sid-gallery-curated-card:nth-of-type(3) img,
#galeria article:nth-of-type(3) img {
  object-position: center center !important;
}

.sid-gallery-final-card:nth-of-type(4) img,
.sid-gallery-curated-card:nth-of-type(4) img,
#galeria article:nth-of-type(4) img {
  object-position: center center !important;
}

.sid-gallery-tag,
.sid-gallery-final-card p.sid-gallery-tag,
.sid-gallery-curated-card p.sid-gallery-tag {
  display: block !important;
  min-height: 34px !important;

  margin: 16px 0 8px !important;

  color: #d9b64c !important;
  font-size: 0.70rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.17em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
}

.sid-gallery-final-card h3,
.sid-gallery-curated-card h3,
#galeria article h3,
#gallery article h3 {
  color: #ffffff !important;
  font-size: 1.02rem !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

.sid-gallery-final-card:nth-of-type(3) h3,
.sid-gallery-curated-card:nth-of-type(3) h3,
#galeria article:nth-of-type(3) h3 {
  font-size: 0.95rem !important;
}

.sid-gallery-hidden-extra {
  display: none !important;
}

@media (max-width: 1280px) {
  #galeria .gallery-grid,
  #galeria .media-grid,
  #galeria .visual-grid,
  #galeria .images-grid,
  #gallery .gallery-grid,
  #gallery .media-grid,
  #gallery .visual-grid,
  #gallery .images-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  .sid-gallery-final-card,
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 300px !important;
  }

  .sid-gallery-final-card img,
  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 390px !important;
  }
}

@media (max-width: 980px) {
  #galeria .gallery-grid,
  #galeria .media-grid,
  #galeria .visual-grid,
  #galeria .images-grid,
  #gallery .gallery-grid,
  #gallery .media-grid,
  #gallery .visual-grid,
  #gallery .images-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .sid-gallery-final-card,
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 340px !important;
  }
}

@media (max-width: 620px) {
  #galeria,
  #gallery {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  #galeria .gallery-grid,
  #galeria .media-grid,
  #galeria .visual-grid,
  #galeria .images-grid,
  #gallery .gallery-grid,
  #gallery .media-grid,
  #gallery .visual-grid,
  #gallery .images-grid {
    grid-template-columns: 1fr !important;
  }

  .sid-gallery-final-card,
  .sid-gallery-curated-card,
  #galeria article,
  #gallery article {
    max-width: 100% !important;
  }

  .sid-gallery-final-card img,
  .sid-gallery-curated-card img,
  #galeria article img,
  #gallery article img {
    height: 390px !important;
  }
}

/* SID_END_GALERIA_LAYOUT_FINAL_PROFISSIONAL_20260612 */



/* ============================================================
   SID_START_GALERIA_APROVADA_4_FINAL_20260612
   Galeria aprovada: somente 4 imagens
   ============================================================ */

#galeria.sid-gallery-approved-section {
  scroll-margin-top: 130px !important;
  padding-top: clamp(130px, 10vw, 170px) !important;
  padding-left: clamp(38px, 6vw, 100px) !important;
  padding-right: clamp(38px, 6vw, 100px) !important;
}

#galeria .section-heading {
  max-width: 1050px !important;
  margin: 0 auto 60px !important;
  text-align: center !important;
}

#galeria .section-heading h2 {
  font-size: clamp(3.2rem, 5.7vw, 5.9rem) !important;
  letter-spacing: -0.055em !important;
  line-height: 0.95 !important;
}

#galeria .section-description {
  max-width: 850px !important;
  margin: 22px auto 0 !important;
  color: rgba(255,255,255,0.68) !important;
  line-height: 1.7 !important;
}

.sid-gallery-approved-grid {
  width: min(1380px, 100%) !important;
  max-width: 1380px !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 30px !important;
  align-items: stretch !important;
}

.sid-gallery-approved-card {
  width: 100% !important;
  max-width: 330px !important;
  margin: 0 auto !important;

  padding: 14px 14px 22px !important;
  border-radius: 28px !important;

  background:
    linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.015)),
    rgba(35, 18, 39, 0.78) !important;

  border: 1px solid rgba(255,255,255,0.13) !important;

  box-shadow:
    0 24px 70px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;

  overflow: hidden !important;
}

.sid-gallery-approved-card img {
  width: 100% !important;
  height: 420px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 20px !important;
  display: block !important;
  background: rgba(0,0,0,0.45) !important;
}

.sid-gallery-approved-card:nth-child(1) img {
  object-position: center center !important;
}

.sid-gallery-approved-card:nth-child(2) img {
  object-position: center top !important;
}

.sid-gallery-approved-card:nth-child(3) img {
  object-position: center center !important;
}

.sid-gallery-approved-card:nth-child(4) img {
  object-position: center center !important;
}

.sid-gallery-approved-tag {
  display: block !important;
  min-height: 34px !important;
  margin: 16px 0 8px !important;

  color: #d9b64c !important;
  font-size: 0.70rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.17em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
}

.sid-gallery-approved-card h3 {
  color: #ffffff !important;
  font-size: 1.02rem !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

.sid-gallery-approved-card:nth-child(3) h3 {
  font-size: 0.95rem !important;
}

@media (max-width: 1280px) {
  .sid-gallery-approved-grid {
    gap: 24px !important;
  }

  .sid-gallery-approved-card {
    max-width: 300px !important;
  }

  .sid-gallery-approved-card img {
    height: 390px !important;
  }
}

@media (max-width: 980px) {
  .sid-gallery-approved-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .sid-gallery-approved-card {
    max-width: 340px !important;
  }
}

@media (max-width: 620px) {
  #galeria.sid-gallery-approved-section {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .sid-gallery-approved-grid {
    grid-template-columns: 1fr !important;
  }

  .sid-gallery-approved-card {
    max-width: 100% !important;
  }

  .sid-gallery-approved-card img {
    height: 390px !important;
  }
}

/* SID_END_GALERIA_APROVADA_4_FINAL_20260612 */


/* =========================================================
   AJUSTE MOBILE FINAL - SID.DEV.BR
   Data: 20260613_120610
   Objetivo: melhorar primeira dobra no celular
========================================================= */

@media (max-width: 768px) {

  body {
    overflow-x: hidden;
  }

  .header {
    position: sticky;
    top: 0;
    padding: 22px 20px;
    min-height: 86px;
    backdrop-filter: blur(18px);
    z-index: 50;
  }

  .logo {
    font-size: 1.45rem;
    letter-spacing: 0.20em;
  }

  .header nav {
    display: none;
  }

  .hero {
    min-height: auto;
    padding: 42px 20px 70px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    text-align: center;
  }

  .hero-text {
    order: 1;
    max-width: 100%;
  }

  .hero-visual {
    order: 2;
    width: 100%;
    min-height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 6px;
  }

  .eyebrow {
    font-size: 0.72rem;
    line-height: 1.5;
    letter-spacing: 0.13em;
    margin-bottom: 14px;
  }

  .hero h1 {
    font-size: clamp(2rem, 10vw, 3.2rem);
    line-height: 1.05;
    margin-bottom: 10px;
  }

  .hero h2 {
    min-height: 32px;
    font-size: 1.15rem;
    margin-bottom: 14px;
  }

  .intro {
    font-size: 0.98rem;
    line-height: 1.7;
    max-width: 92vw;
    margin: 0 auto 22px;
  }

  .actions {
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
  }

  .btn {
    width: 100%;
    max-width: 260px;
    justify-content: center;
    text-align: center;
  }

  .hero-orbisite-alpha-wrap {
    width: min(78vw, 340px);
    height: min(78vw, 340px);
    max-width: 340px;
    max-height: 340px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 28px;
    background: transparent;
    box-shadow: 0 0 38px rgba(0, 217, 255, 0.20);
  }

  .hero-orbisite-alpha-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .floating-card {
    display: none;
  }

  section {
    scroll-margin-top: 100px;
  }
}

@media (max-width: 420px) {
  .header {
    padding: 20px 18px;
  }

  .logo {
    font-size: 1.28rem;
  }

  .hero {
    padding-top: 34px;
  }

  .hero-orbisite-alpha-wrap {
    width: 82vw;
    height: 82vw;
  }
}


/* =========================================================
   SID MOBILE FIX FORTE - PRIMEIRA DOBRA CELULAR
   Data: 20260613_124332
   Objetivo: impedir header/botões/orbe de esconderem o texto
========================================================= */

@media (max-width: 768px) {

  html,
  body {
    width: 100% !important;
    overflow-x: hidden !important;
  }

  .header {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    height: auto !important;
    min-height: 86px !important;
    padding: 28px 20px 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: rgba(5, 3, 10, 0.96) !important;
    border-bottom: 1px solid rgba(0, 217, 255, 0.20) !important;
    z-index: 50 !important;
  }

  .logo {
    font-size: clamp(1.55rem, 7vw, 2.15rem) !important;
    line-height: 1 !important;
    letter-spacing: 0.18em !important;
  }

  .header nav {
    display: none !important;
  }

  .hero {
    min-height: auto !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 24px !important;
    padding: 34px 20px 54px !important;
    text-align: center !important;
    overflow: visible !important;
  }

  .hero-text,
  .hero-text.reveal,
  .hero-text.reveal.active {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  .eyebrow {
    display: block !important;
    font-size: 0.66rem !important;
    line-height: 1.45 !important;
    letter-spacing: 0.12em !important;
    margin: 0 auto 12px !important;
    max-width: 92vw !important;
    color: var(--gold) !important;
  }

  .hero h1 {
    display: block !important;
    font-size: clamp(2rem, 11vw, 3rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -1.4px !important;
    margin: 0 auto 8px !important;
    max-width: 94vw !important;
  }

  .hero h2,
  #typing {
    display: block !important;
    min-height: 26px !important;
    font-size: 1.02rem !important;
    line-height: 1.3 !important;
    margin: 0 auto 12px !important;
  }

  .intro {
    display: block !important;
    font-size: 0.94rem !important;
    line-height: 1.58 !important;
    max-width: 90vw !important;
    margin: 0 auto 18px !important;
  }

  .actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 18px auto 0 !important;
  }

  .btn,
  a.btn,
  .actions .btn,
  .actions a.btn {
    width: min(84vw, 320px) !important;
    min-height: 48px !important;
    padding: 12px 18px !important;
    font-size: 0.86rem !important;
    letter-spacing: 0.12em !important;
    justify-content: center !important;
    text-align: center !important;
    box-shadow:
      0 10px 24px rgba(0, 0, 0, 0.55),
      inset 1px 1px 0 rgba(255, 255, 255, 0.10) !important;
  }

  .hero-visual,
  .hero-visual.reveal,
  .hero-visual.reveal.active {
    order: 2 !important;
    width: 100% !important;
    min-height: auto !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 10px auto 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .hero-orbisite-alpha-wrap {
    width: min(82vw, 340px) !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    max-width: 340px !important;
    max-height: 230px !important;
    margin: 0 auto !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .hero-orbisite-alpha-video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    mix-blend-mode: screen !important;
    background: transparent !important;
  }

  .floating-card {
    display: none !important;
  }

  .section {
    min-height: auto !important;
    padding: 58px 20px !important;
  }

  .section-heading,
  .section-title {
    text-align: center !important;
    margin-bottom: 28px !important;
  }
}

@media (max-width: 430px) {
  .header {
    padding: 24px 18px 22px !important;
    min-height: 78px !important;
  }

  .logo {
    font-size: 1.45rem !important;
    letter-spacing: 0.16em !important;
  }

  .hero {
    padding: 28px 18px 48px !important;
  }

  .hero h1 {
    font-size: clamp(1.9rem, 10.5vw, 2.65rem) !important;
  }

  .btn,
  a.btn,
  .actions .btn,
  .actions a.btn {
    width: min(88vw, 300px) !important;
  }

  .hero-orbisite-alpha-wrap {
    width: min(84vw, 320px) !important;
    max-height: 210px !important;
  }
}


/* =========================================================
   ORBI VISUAL FIX
   Data: 20260613_124413
========================================================= */

.hero-visual {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-orbisite-alpha-wrap {
  position: relative !important;
  width: min(36vw, 520px) !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  border-radius: 32px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at center,
      rgba(0, 210, 255, 0.14) 0%,
      rgba(0, 120, 200, 0.10) 28%,
      rgba(5, 10, 20, 0.12) 60%,
      rgba(0, 0, 0, 0) 100%) !important;
  border: 1px solid rgba(0, 217, 255, 0.16) !important;
  box-shadow:
    0 0 40px rgba(0, 217, 255, 0.10),
    0 18px 60px rgba(0, 0, 0, 0.38),
    inset 0 0 30px rgba(255, 255, 255, 0.03) !important;
  backdrop-filter: blur(4px) !important;
}

.hero-orbisite-alpha-wrap::before {
  content: "" !important;
  position: absolute !important;
  inset: 8% !important;
  border-radius: 50% !important;
  background: radial-gradient(
    circle,
    rgba(0, 217, 255, 0.16) 0%,
    rgba(0, 217, 255, 0.05) 35%,
    rgba(0, 217, 255, 0) 72%
  ) !important;
  filter: blur(10px) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.hero-orbisite-alpha-video,
.hero-orbisite-alpha-wrap img,
.hero-orbisite-alpha-wrap video {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  background: transparent !important;
  mix-blend-mode: screen !important;
  filter:
    contrast(1.05)
    saturate(1.08)
    brightness(1.02)
    drop-shadow(0 0 14px rgba(0, 217, 255, 0.20)) !important;
}

/* desktop: evita ficar exagerado */
@media (min-width: 769px) {
  .hero-orbisite-alpha-wrap {
    max-width: 460px !important;
    max-height: 460px !important;
  }
}

/* mobile */
@media (max-width: 768px) {
  .hero-orbisite-alpha-wrap {
    width: min(74vw, 300px) !important;
    max-width: 300px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 26px !important;
    margin: 10px auto 0 !important;
    box-shadow:
      0 0 26px rgba(0, 217, 255, 0.10),
      0 14px 34px rgba(0, 0, 0, 0.34) !important;
  }

  .hero-orbisite-alpha-video,
  .hero-orbisite-alpha-wrap img,
  .hero-orbisite-alpha-wrap video {
    object-fit: contain !important;
  }
}

@media (max-width: 430px) {
  .hero-orbisite-alpha-wrap {
    width: min(78vw, 280px) !important;
    max-width: 280px !important;
  }
}


/* =========================================================
   SID.DEV.BR - AJUSTE EXCLUSIVO PARA CELULAR
   Desktop permanece intacto.
   Data: 20260613_124604
========================================================= */

@media only screen and (max-width: 768px) {

  .header {
    position: relative !important;
    height: auto !important;
    min-height: 86px !important;
    padding: 28px 20px 24px !important;
    justify-content: flex-start !important;
  }

  .header nav {
    display: none !important;
  }

  .logo {
    font-size: clamp(1.55rem, 7vw, 2.2rem) !important;
    letter-spacing: 0.18em !important;
  }

  .hero {
    min-height: auto !important;
    height: auto !important;
    padding: 34px 20px 60px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 26px !important;
    text-align: center !important;
    align-items: center !important;
  }

  .hero-text {
    order: 1 !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .eyebrow {
    font-size: 0.66rem !important;
    line-height: 1.45 !important;
    letter-spacing: 0.12em !important;
    margin-bottom: 12px !important;
  }

  .hero h1 {
    font-size: clamp(2rem, 10.5vw, 3rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -1.2px !important;
    margin-bottom: 10px !important;
  }

  #typing,
  .hero h2 {
    min-height: 28px !important;
    font-size: 1.05rem !important;
    line-height: 1.3 !important;
    margin-bottom: 14px !important;
  }

  .intro {
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
    max-width: 90vw !important;
    margin: 0 auto 20px !important;
  }

  .actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    margin-top: 18px !important;
  }

  .actions .btn,
  .btn {
    width: min(84vw, 310px) !important;
    min-height: 46px !important;
    padding: 12px 18px !important;
    font-size: 0.84rem !important;
    letter-spacing: 0.11em !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .hero-visual {
    order: 2 !important;
    min-height: auto !important;
    width: 100% !important;
    margin-top: 8px !important;
    display: flex !important;
    justify-content: center !important;
  }

  .hero-orbisite-alpha-wrap {
    width: min(76vw, 300px) !important;
    max-width: 300px !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 auto !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 0 26px rgba(0, 217, 255, 0.10) !important;
  }

  .hero-orbisite-alpha-video {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
    background: transparent !important;
  }

  .floating-card {
    display: none !important;
  }

  .section {
    min-height: auto !important;
    padding: 58px 20px !important;
  }
}

@media only screen and (max-width: 430px) {
  .hero-orbisite-alpha-wrap {
    width: min(78vw, 280px) !important;
    max-width: 280px !important;
  }
}