
/* shared performance + language switch */
.lang-switch-opt{position:fixed;top:18px;right:22px;z-index:2147483647;display:flex;align-items:center;gap:5px;padding:5px;border:1px solid rgba(20,22,26,.12);border-radius:999px;background:rgba(255,255,255,.96);box-shadow:0 10px 34px rgba(20,22,26,.12);backdrop-filter:blur(14px);font-family:Arial,sans-serif}
.lang-switch-opt a{height:34px;min-width:50px;padding:0 9px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:6px;color:#666;text-decoration:none;font-size:10px;font-weight:700;letter-spacing:.05em}
.lang-switch-opt a.active{background:#17191e;color:#fff}.lang-switch-opt .flag{font-size:18px}.lang-switch-opt .sep{width:1px;height:20px;background:#e5e5e2}
img[loading="lazy"]{content-visibility:auto}
@media(max-width:620px){.lang-switch-opt{top:12px;right:12px}.lang-switch-opt a{min-width:44px;height:32px;padding:0 7px}}


/* ===== Mobile UX v36 ===== */
button,a{-webkit-tap-highlight-color:transparent}
@media(max-width:700px){
  html{scroll-padding-top:72px}
  body{-webkit-text-size-adjust:100%}
  .lang-switch-opt{
    top:10px;
    right:60px;
    box-shadow:none;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(12px);
  }
  .lang-switch-opt a{
    min-width:38px;
    height:32px;
    padding:0 6px;
  }
  .lang-switch-opt .flag{font-size:15px}
  .lang-switch-opt .sep{height:18px}
}

/* ===== Dark mode v59 ===== */
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"],
html[data-theme="dark"] body{background:#111214!important;color:#f4f4f2!important}
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] strong{color:#f4f4f2!important}
html[data-theme="dark"] p,
html[data-theme="dark"] .intro,
html[data-theme="dark"] .intro-lead,
html[data-theme="dark"] .section-copy,
html[data-theme="dark"] .about-copy,
html[data-theme="dark"] .summary,
html[data-theme="dark"] .project-info p,
html[data-theme="dark"] .case-more-info p,
html[data-theme="dark"] small{color:#a8aab0!important}
html[data-theme="dark"] .project-card,
html[data-theme="dark"] .card,
html[data-theme="dark"] .step,
html[data-theme="dark"] .principle,
html[data-theme="dark"] .case-more-card,
html[data-theme="dark"] .site-sections,
html[data-theme="dark"] .site-scroll,
html[data-theme="dark"] .visit-site,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .skill,
html[data-theme="dark"] .tool,
html[data-theme="dark"] .education-card,
html[data-theme="dark"] .mobile-menu,
html[data-theme="dark"] .home-about-links a,
html[data-theme="dark"] .links a{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.28)!important
}
html[data-theme="dark"] .mobile-header,
html[data-theme="dark"] .lang-switch-opt,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .web-section,
html[data-theme="dark"] #sobre{
  background:#111214!important;
  border-color:rgba(255,255,255,.10)!important
}
html[data-theme="dark"] .intro-tags span,
html[data-theme="dark"] .skills span,
html[data-theme="dark"] .meta span,
html[data-theme="dark"] .tag{
  background:#1a1b1f!important;color:#f4f4f2!important;border-color:rgba(255,255,255,.10)!important
}
html[data-theme="dark"] .project-arrow,
html[data-theme="dark"] .case-portfolio-back,
html[data-theme="dark"] .portfolio-cv-back,
html[data-theme="dark"] .back{
  background:#1a1b1f!important;color:#fff!important;border-color:rgba(255,255,255,.10)!important
}
html[data-theme="dark"] .side-nav{
  background:rgba(24,25,29,.86)!important;border-color:rgba(255,255,255,.10)!important;box-shadow:0 12px 38px rgba(0,0,0,.25)!important
}
html[data-theme="dark"] .side-nav a{color:#8f9298!important}
html[data-theme="dark"] .side-nav a.is-active{color:#fff!important}
html[data-theme="dark"] .side-nav a::after{background:#fff!important}
html[data-theme="dark"] .video-dialog{background:#111!important}
html[data-theme="dark"] .resume{background:#111214!important}
html[data-theme="dark"] .sidebar{background:#17171b!important}
html[data-theme="dark"] .experience,
html[data-theme="dark"] .section{border-color:rgba(255,255,255,.10)!important}

.theme-toggle{
  position:fixed;z-index:2147483646;top:18px;right:136px;width:42px;height:42px;
  border:1px solid rgba(23,25,30,.10);border-radius:999px;background:rgba(255,255,255,.92);
  color:#17191e;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 26px rgba(18,20,24,.08);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.theme-toggle svg{width:18px;height:18px}.theme-toggle .sun{display:none}
html[data-theme="dark"] .theme-toggle{background:#1a1b1f;color:#fff;border-color:rgba(255,255,255,.12)}
html[data-theme="dark"] .theme-toggle .moon{display:none}
html[data-theme="dark"] .theme-toggle .sun{display:block}
@media(max-width:700px){.theme-toggle{top:11px;right:122px;width:36px;height:36px}.theme-toggle svg{width:16px;height:16px}}


/* ===== Theme toggle positioning v60 =====
   Mantém o seletor de tema lado a lado com o seletor de idioma,
   sem sobreposição. */
.theme-toggle{
  top:18px!important;
  right:178px!important;
}
@media(max-width:700px){
  .theme-toggle{
    top:11px!important;
    right:166px!important;
  }
}


/* ===== Dark mode refinements v63 ===== */

/* FM SVG: black in light mode, white in dark mode */
.fm-brand-intro img[src$="logo-fm.svg"],
.mobile-brand[src$="logo-fm.svg"],
img.fm-logo[src$="logo-fm.svg"]{
  filter:none!important;
  transition:filter .18s ease!important;
}
html[data-theme="dark"] .fm-brand-intro img[src$="logo-fm.svg"],
html[data-theme="dark"] .mobile-brand[src$="logo-fm.svg"],
html[data-theme="dark"] img.fm-logo[src$="logo-fm.svg"]{
  filter:invert(1) brightness(1.15)!important;
}

/* 2 — hello pill */
html[data-theme="dark"] .hello-pill{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .hello-pill span{
  background:#27b36a!important;
}

/* 3 — footer/navigation block on every case */
html[data-theme="dark"] .case-more{
  background:#111214!important;
  color:#f4f4f2!important;
  border-top-color:rgba(255,255,255,.10)!important;
}
html[data-theme="dark"] .case-more h2,
html[data-theme="dark"] .case-more-head,
html[data-theme="dark"] .case-more-all{
  color:#f4f4f2!important;
}
html[data-theme="dark"] .case-more-all{
  border-color:rgba(255,255,255,.35)!important;
}
html[data-theme="dark"] .case-more-card{
  background:#1a1b1f!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 16px 36px rgba(0,0,0,.26)!important;
}
html[data-theme="dark"] .case-more-info{
  background:#1a1b1f!important;
}
html[data-theme="dark"] .case-more-info h3{
  color:#f4f4f2!important;
}
html[data-theme="dark"] .case-more-info p{
  color:#a8aab0!important;
}

/* Web & UI direction / visual system cards */
html[data-theme="dark"] .direction-card,
html[data-theme="dark"] .direction .card,
html[data-theme="dark"] .direction > .card{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.10)!important;
}
html[data-theme="dark"] .direction-card small,
html[data-theme="dark"] .direction .card small{
  color:#96999f!important;
}
html[data-theme="dark"] .direction-card p,
html[data-theme="dark"] .direction .card p{
  color:#a8aab0!important;
}

/* 4 — Flowix Web/UI visual direction specifics */
html[data-theme="dark"] .type-sample{
  color:#f4f4f2!important;
}
html[data-theme="dark"] .swatch span{
  color:#a8aab0!important;
}
/* preserve actual palette colors while darkening their parent cards */
html[data-theme="dark"] .color{
  border-color:rgba(255,255,255,.12)!important;
}

/* 5 — page structure module in all Web & UI cases */
html[data-theme="dark"] .site-overview{
  color:#f4f4f2!important;
}
html[data-theme="dark"] .site-sections{
  background:#1a1b1f!important;
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:0 16px 36px rgba(0,0,0,.22)!important;
}
html[data-theme="dark"] .site-sections small{
  color:#a5a8ae!important;
}
html[data-theme="dark"] .site-sections li{
  background:#222328!important;
  color:#d5d6d9!important;
  border:1px solid rgba(255,255,255,.05)!important;
}
html[data-theme="dark"] .site-scroll{
  background:#17181c!important;
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.25)!important;
}
/* screenshots themselves must remain unchanged */
html[data-theme="dark"] .site-scroll img{
  filter:none!important;
}

/* 6 — detailed Web & UI case cards */
html[data-theme="dark"] .detail.text,
html[data-theme="dark"] .detail-card,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .feature,
html[data-theme="dark"] .showcase-card{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.22)!important;
}
html[data-theme="dark"] .detail.text h3,
html[data-theme="dark"] .detail-card h3,
html[data-theme="dark"] .feature h3,
html[data-theme="dark"] .feature-card h3{
  color:#f4f4f2!important;
}
html[data-theme="dark"] .detail.text p,
html[data-theme="dark"] .detail-card p,
html[data-theme="dark"] .feature p,
html[data-theme="dark"] .feature-card p{
  color:#a8aab0!important;
}
html[data-theme="dark"] .detail.visual{
  border:1px solid rgba(255,255,255,.08)!important;
}

/* Generic white panels used by Web/UI cases */
html[data-theme="dark"] .visual-card,
html[data-theme="dark"] .content-card,
html[data-theme="dark"] .story-card,
html[data-theme="dark"] .panel{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.10)!important;
}

/* Avoid white mobile full-page screenshot button */
html[data-theme="dark"] .mobile-site-open{
  background:#1a1b1f!important;
  color:#f4f4f2!important;
  border-color:rgba(255,255,255,.12)!important;
}

/* Case footer text */
html[data-theme="dark"] footer{
  color:#8f9298!important;
}

/* Light backgrounds hardcoded inline in some Web/UI cases */
html[data-theme="dark"] .page section,
html[data-theme="dark"] .case section{
  border-color:rgba(255,255,255,.08)!important;
}


/* ===== Outros cases — padrão único v64 ===== */
.case-more{
  width:100%!important;
  padding:78px 24px 86px!important;
  background:#f4f3f0!important;
  border-top:1px solid rgba(22,24,28,.09)!important;
  color:#17191e!important;
}
.case-more-inner{width:min(1120px,100%)!important;margin:0 auto!important}
.case-more-head{
  display:flex!important;align-items:flex-end!important;
  justify-content:space-between!important;gap:24px!important;
  margin-bottom:28px!important
}
.case-more-kicker{
  font-size:10px!important;font-weight:800!important;letter-spacing:.15em!important;
  text-transform:uppercase!important;color:#ff5a36!important;margin-bottom:10px!important
}
.case-more h2{
  margin:0!important;font-size:36px!important;line-height:1!important;
  letter-spacing:-.04em!important;color:#17191e!important
}
.case-more-all{
  color:#17191e!important;text-decoration:none!important;font-size:13px!important;
  font-weight:800!important;border-bottom:1px solid currentColor!important;
  padding-bottom:4px!important;white-space:nowrap!important
}
.case-more-grid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;align-items:stretch!important
}
.case-more-card{
  display:flex!important;flex-direction:column!important;min-width:0!important;
  overflow:hidden!important;border:1px solid rgba(22,24,28,.10)!important;
  border-radius:18px!important;background:#fff!important;color:#17191e!important;
  text-decoration:none!important;box-shadow:none!important
}
.case-more-media{
  width:100%!important;aspect-ratio:1.62 / 1!important;height:auto!important;
  overflow:hidden!important;background:#ecece9!important
}
.case-more-media img{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:cover!important;object-position:center!important
}
.case-more-info{
  flex:1!important;padding:20px 22px 22px!important;background:#fff!important
}
.case-more-type{
  display:block!important;margin-bottom:11px!important;color:#ff5a36!important;
  font-size:10px!important;line-height:1.2!important;font-weight:800!important;
  letter-spacing:.13em!important;text-transform:uppercase!important
}
.case-more-info h3{
  margin:0 0 8px!important;font-size:24px!important;line-height:1.05!important;
  letter-spacing:-.035em!important;color:#17191e!important
}
.case-more-info p{
  margin:0!important;font-size:13px!important;line-height:1.45!important;color:#6d7177!important
}

/* Dark */
html[data-theme="dark"] .case-more{
  background:#111214!important;color:#f4f4f2!important;
  border-top-color:rgba(255,255,255,.10)!important
}
html[data-theme="dark"] .case-more h2,
html[data-theme="dark"] .case-more-all{color:#f4f4f2!important}
html[data-theme="dark"] .case-more-card,
html[data-theme="dark"] .case-more-info{
  background:#1a1b1f!important;border-color:rgba(255,255,255,.10)!important
}
html[data-theme="dark"] .case-more-media{background:#222328!important}
html[data-theme="dark"] .case-more-info h3{color:#f4f4f2!important}
html[data-theme="dark"] .case-more-info p{color:#a8aab0!important}

/* Mobile */
@media(max-width:760px){
  .case-more{padding:58px 16px 64px!important}
  .case-more-head{
    flex-direction:column!important;align-items:flex-start!important;
    gap:16px!important
  }
  .case-more h2{font-size:34px!important}
  .case-more-grid{grid-template-columns:1fr!important;gap:14px!important}
  .case-more-media{aspect-ratio:1.55 / 1!important}
  .case-more-info{padding:18px 18px 20px!important}
}


/* ===== Hero gradient trail v66 ===== */
.intro-hero{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
}
.intro-hero > .wrap{
  position:relative;
  z-index:3;
}
.hero-gradient-trail{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
  opacity:0;
  transition:opacity .22s ease;
}
.intro-hero.is-pointer-active .hero-gradient-trail{
  opacity:1;
}
.hero-gradient-trail::before,
.hero-gradient-trail::after,
.hero-gradient-trail .trail-core{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  left:0;
  top:0;
  transform:translate3d(calc(var(--trail-x, 50%) - 260px), calc(var(--trail-y, 50%) - 260px), 0);
  border-radius:50%;
  filter:blur(54px);
  will-change:transform,opacity;
  pointer-events:none;
}
.hero-gradient-trail::before{
  background:
    radial-gradient(circle at 42% 42%,
      rgba(104,86,255,.24) 0%,
      rgba(82,149,255,.17) 28%,
      rgba(255,116,170,.10) 54%,
      rgba(255,255,255,0) 74%);
  opacity:.9;
}
.hero-gradient-trail::after{
  width:720px;
  height:720px;
  transform:translate3d(calc(var(--trail-x2, 50%) - 360px), calc(var(--trail-y2, 50%) - 360px), 0);
  background:
    radial-gradient(circle at 50% 50%,
      rgba(255,176,86,.12) 0%,
      rgba(142,92,255,.10) 34%,
      rgba(95,189,255,.08) 56%,
      rgba(255,255,255,0) 76%);
  filter:blur(72px);
  opacity:.72;
}
.hero-gradient-trail .trail-core{
  width:280px;
  height:280px;
  transform:translate3d(calc(var(--trail-x3, 50%) - 140px), calc(var(--trail-y3, 50%) - 140px), 0);
  background:
    radial-gradient(circle,
      rgba(255,255,255,.12) 0%,
      rgba(132,117,255,.15) 24%,
      rgba(93,161,255,.08) 52%,
      rgba(255,255,255,0) 75%);
  filter:blur(34px);
  opacity:.88;
}

/* Interação levemente mais presente no dark mode */
html[data-theme="dark"] .hero-gradient-trail::before{
  background:
    radial-gradient(circle at 42% 42%,
      rgba(113,93,255,.34) 0%,
      rgba(70,154,255,.24) 30%,
      rgba(255,94,173,.16) 56%,
      rgba(17,18,20,0) 76%);
}
html[data-theme="dark"] .hero-gradient-trail::after{
  background:
    radial-gradient(circle at 50% 50%,
      rgba(255,156,74,.16) 0%,
      rgba(157,103,255,.16) 34%,
      rgba(75,187,255,.13) 58%,
      rgba(17,18,20,0) 78%);
}
html[data-theme="dark"] .hero-gradient-trail .trail-core{
  background:
    radial-gradient(circle,
      rgba(255,255,255,.15) 0%,
      rgba(132,117,255,.20) 24%,
      rgba(83,165,255,.12) 50%,
      rgba(17,18,20,0) 75%);
}

/* Dá leve sensação de profundidade sem afetar layout */
.intro-copy,
.hero-photo-wrap{
  transition:transform .18s ease;
  will-change:transform;
}
.intro-hero.is-pointer-active .intro-copy{
  transform:translate3d(var(--copy-shift-x,0px),var(--copy-shift-y,0px),0);
}
.intro-hero.is-pointer-active .hero-photo-wrap{
  transform:translate3d(var(--photo-shift-x,0px),var(--photo-shift-y,0px),0);
}

/* Respeita acessibilidade e performance */
@media (prefers-reduced-motion: reduce){
  .hero-gradient-trail{display:none!important}
  .intro-copy,.hero-photo-wrap{transform:none!important;transition:none!important}
}
@media(max-width:900px){
  .hero-gradient-trail{
    display:none!important;
  }
  .intro-copy,.hero-photo-wrap{
    transform:none!important;
  }
}


/* ===== Hero video interaction v67 ===== */
@media(min-width:901px) and (prefers-reduced-motion:no-preference){
  .hero-photo-wrap{
    perspective:1100px;
  }

  .hero-photo-shell{
    position:relative!important;
    overflow:hidden!important;
    transform-style:preserve-3d;
    transition:
      transform .28s cubic-bezier(.2,.7,.2,1),
      box-shadow .28s ease,
      filter .28s ease!important;
    will-change:transform;
  }

  .hero-photo-shell::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    background:
      linear-gradient(120deg,
        rgba(255,255,255,.20),
        rgba(255,255,255,0) 30%,
        rgba(111,91,255,.10) 60%,
        rgba(255,255,255,0));
    mix-blend-mode:screen;
    transition:opacity .25s ease;
    z-index:4;
  }

  .hero-photo-shell.is-video-hover{
    box-shadow:0 30px 80px rgba(22,24,31,.18);
    filter:saturate(1.02);
  }

  html[data-theme="dark"] .hero-photo-shell.is-video-hover{
    box-shadow:0 34px 90px rgba(0,0,0,.42);
  }

  .hero-photo-shell.is-video-hover::after{
    opacity:1;
  }

  .hero-photo-shell > img{
    transition:transform .5s cubic-bezier(.2,.7,.2,1), opacity .32s ease!important;
    will-change:transform,opacity;
  }

  .hero-photo-shell.is-video-hover > img{
    transform:scale(1.025);
  }

  /* magnetic play */
  .video-play{
    z-index:8!important;
    transition:
      transform .22s cubic-bezier(.2,.7,.2,1),
      box-shadow .22s ease,
      background .22s ease!important;
    will-change:transform;
  }

  .video-play::before{
    content:"";
    position:absolute;
    inset:-12px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.52);
    opacity:0;
    transform:scale(.78);
    transition:opacity .2s ease, transform .28s ease;
    pointer-events:none;
  }

  .hero-photo-shell.is-video-hover .video-play{
    box-shadow:
      0 14px 34px rgba(0,0,0,.18),
      0 0 0 8px rgba(255,255,255,.08);
  }

  .hero-photo-shell.is-near-play .video-play{
    box-shadow:
      0 18px 40px rgba(0,0,0,.24),
      0 0 0 10px rgba(119,94,255,.10);
  }

  .hero-photo-shell.is-near-play .video-play::before{
    opacity:1;
    transform:scale(1);
  }

  /* optional YouTube hover preview */
  .hero-video-preview{
    position:absolute;
    inset:0;
    z-index:3;
    opacity:0;
    pointer-events:none;
    transition:opacity .30s ease;
    background:#000;
  }

  .hero-video-preview.show{
    opacity:1;
  }

  .hero-video-preview iframe{
    width:100%;
    height:100%;
    border:0;
    display:block;
    pointer-events:none;
  }
}

@media(max-width:900px), (prefers-reduced-motion:reduce){
  .hero-video-cursor,
  .hero-video-preview{
    display:none!important;
  }
}


/* ===== Existing play button refinement v68 ===== */
@media(min-width:901px) and (prefers-reduced-motion:no-preference){

  .hero-photo-shell .video-play{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translate(-50%,-50%)!important;
    width:68px!important;
    height:68px!important;
    border-radius:50%!important;
    z-index:9!important;
    overflow:visible!important;
    transition:
      transform .24s cubic-bezier(.2,.7,.2,1),
      box-shadow .24s ease,
      background .24s ease!important;
  }

  /* contorno principal */
  .hero-photo-shell .video-play::before{
    content:""!important;
    position:absolute!important;
    inset:-12px!important;
    border-radius:50%!important;
    border:1.5px solid rgba(255,255,255,.92)!important;
    opacity:.78!important;
    transform:scale(.92)!important;
    transition:
      transform .35s cubic-bezier(.2,.7,.2,1),
      opacity .25s ease!important;
    pointer-events:none!important;
  }

  /* segundo contorno, mais suave */
  .hero-photo-shell .video-play::after{
    content:""!important;
    position:absolute!important;
    inset:-23px!important;
    border-radius:50%!important;
    border:1px solid rgba(255,255,255,.34)!important;
    opacity:0!important;
    transform:scale(.82)!important;
    transition:
      transform .45s cubic-bezier(.2,.7,.2,1),
      opacity .3s ease!important;
    pointer-events:none!important;
  }

  .hero-photo-shell.is-video-hover .video-play{
    transform:translate(-50%,-50%) scale(1.05)!important;
    box-shadow:
      0 16px 38px rgba(0,0,0,.18),
      0 0 0 8px rgba(255,255,255,.06)!important;
  }

  .hero-photo-shell.is-video-hover .video-play::before{
    transform:scale(1.08)!important;
    opacity:1!important;
  }

  .hero-photo-shell.is-video-hover .video-play::after{
    transform:scale(1.08)!important;
    opacity:1!important;
  }

  /* animação quando o cursor chega perto do centro */
  .hero-photo-shell.is-near-play .video-play{
    transform:translate(-50%,-50%) scale(1.12)!important;
    box-shadow:
      0 18px 44px rgba(0,0,0,.24),
      0 0 0 10px rgba(255,255,255,.08)!important;
  }

  .hero-photo-shell.is-near-play .video-play::before{
    transform:scale(1.18)!important;
    opacity:1!important;
  }

  .hero-photo-shell.is-near-play .video-play::after{
    transform:scale(1.22)!important;
    opacity:.72!important;
  }

  /* pulso sutil só no anel externo */
  .hero-photo-shell.is-near-play .video-play::after{
    animation:play-ring-pulse-v68 1.8s ease-in-out infinite;
  }

  @keyframes play-ring-pulse-v68{
    0%,100%{transform:scale(1.05);opacity:.38}
    50%{transform:scale(1.28);opacity:.76}
  }

  .hero-photo-shell{
    cursor:pointer!important;
  }
}


/* ===== Web & UI mobile structure carousel v69 ===== */
@media(max-width:760px){

  /* Evita estouro lateral em toda a seção */
  .site-overview,
  .site-sections,
  .site-scroll{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    box-sizing:border-box!important;
  }

  .site-overview{
    display:block!important;
    margin-top:28px!important;
  }

  /* Navegação horizontal das seções */
  .site-sections{
    position:relative!important;
    top:auto!important;
    padding:18px 0 14px!important;
    border-radius:18px!important;
    overflow:hidden!important;
  }

  .site-sections small{
    display:block!important;
    padding:0 18px!important;
    margin:0 0 13px!important;
    font-size:10px!important;
    letter-spacing:.14em!important;
  }

  .site-sections ol{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:10px!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0 18px 8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:18px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  .site-sections ol::-webkit-scrollbar{
    display:none!important;
  }

  .site-sections li{
    flex:0 0 auto!important;
    width:auto!important;
    max-width:82vw!important;
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    white-space:nowrap!important;
    padding:10px 15px 10px 30px!important;
    border-radius:14px!important;
    font-size:11px!important;
    line-height:1.2!important;
    scroll-snap-align:start!important;
    scroll-snap-stop:always!important;
  }

  .site-sections li:before{
    left:14px!important;
  }

  /* Indicação de progresso do carrossel */
  .site-sections .mobile-section-progress{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:4px 18px 0!important;
    font-size:10px!important;
    color:#8a8d91!important;
  }

  .site-sections .mobile-section-progress .track{
    flex:1!important;
    height:2px!important;
    background:rgba(20,22,26,.10)!important;
    border-radius:999px!important;
    overflow:hidden!important;
  }

  .site-sections .mobile-section-progress .fill{
    display:block!important;
    width:0%;
    height:100%!important;
    background:var(--accent, var(--orange, #ff5a36))!important;
    border-radius:999px!important;
    transition:width .22s ease!important;
  }

  html[data-theme="dark"] .site-sections .mobile-section-progress{
    color:#9da0a6!important;
  }

  html[data-theme="dark"] .site-sections .mobile-section-progress .track{
    background:rgba(255,255,255,.12)!important;
  }

  /* Screenshot: viewport controlado e sem overflow horizontal */
  .site-scroll{
    position:relative!important;
    margin-top:18px!important;
    height:520px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    border-radius:20px!important;
    touch-action:pan-y!important;
  }

  .site-scroll img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    object-fit:contain!important;
    object-position:top center!important;
    margin:0!important;
  }

  /* Sombra/fade inferior para indicar continuação vertical */
  .site-scroll::after{
    content:""!important;
    position:sticky!important;
    display:block!important;
    left:0!important;
    bottom:0!important;
    width:100%!important;
    height:34px!important;
    margin-top:-34px!important;
    pointer-events:none!important;
    background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.78))!important;
    z-index:2!important;
  }

  html[data-theme="dark"] .site-scroll::after{
    background:linear-gradient(to bottom, rgba(17,18,20,0), rgba(17,18,20,.84))!important;
  }

  /* Botão mobile para abrir a imagem completa */
  .mobile-site-open{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:100%!important;
    min-height:46px!important;
    margin-top:10px!important;
    border-radius:14px!important;
    text-decoration:none!important;
    font-size:12px!important;
    font-weight:750!important;
  }
}

/* Desktop/tablet: progresso não aparece */
@media(min-width:761px){
  .mobile-section-progress{display:none!important}
}



/* ===== Hello status hover v80 ===== */

/* Preserve the original pill geometry and remove any inherited graphic/pseudo decorations */
.hello-pill{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}

.hello-pill::before,
.hello-pill::after,
.hello-pill .hello-text::before,
.hello-pill .hello-text::after{
  content:none!important;
  display:none!important;
}

/* The ONLY green dot */
.hello-pill > .hello-status-dot{
  display:block!important;
  width:7px!important;
  height:7px!important;
  min-width:7px!important;
  flex:0 0 7px!important;
  border-radius:50%!important;
  background:#27b36a!important;
  box-shadow:none!important;
}

/* Text occupies a single visual slot */
.hello-pill .hello-text{
  position:relative!important;
  display:inline-grid!important;
  align-items:center!important;
  min-width:0!important;
}

.hello-pill .hello-text-neutral,
.hello-pill .hello-text-hover{
  grid-area:1 / 1!important;
  display:block!important;
  white-space:nowrap!important;
  line-height:1!important;
  transition:
    opacity .18s ease,
    transform .22s cubic-bezier(.2,.8,.2,1)!important;
}

.hello-pill .hello-text-neutral{
  opacity:1!important;
  transform:translateY(0)!important;
}

.hello-pill .hello-text-hover{
  opacity:0!important;
  transform:translateY(6px)!important;
  color:#18A862!important;
}

.hello-pill:hover .hello-text-neutral,
.hello-pill.is-status-active .hello-text-neutral{
  opacity:0!important;
  transform:translateY(-6px)!important;
}

.hello-pill:hover .hello-text-hover,
.hello-pill.is-status-active .hello-text-hover{
  opacity:1!important;
  transform:translateY(0)!important;
}

/* Subtle status feedback only */
.hello-pill:hover,
.hello-pill.is-status-active{
  background:#F2FFF7!important;
  border-color:rgba(39,179,106,.30)!important;
  box-shadow:0 8px 22px rgba(39,179,106,.08)!important;
}

.hello-pill:hover > .hello-status-dot,
.hello-pill.is-status-active > .hello-status-dot{
  animation:hello-status-pulse-v80 1.55s ease-in-out infinite;
}

@keyframes hello-status-pulse-v80{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(39,179,106,.25)}
  50%{transform:scale(1.10);box-shadow:0 0 0 6px rgba(39,179,106,0)}
}

/* Dark mode */
html[data-theme="dark"] .hello-pill:hover,
html[data-theme="dark"] .hello-pill.is-status-active{
  background:#17241D!important;
  border-color:rgba(110,231,168,.28)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.16)!important;
}
html[data-theme="dark"] .hello-pill .hello-text-hover{
  color:#6EE7A8!important;
}

/* Touch devices */
@media(max-width:700px){
  .hello-pill{cursor:pointer!important}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  .hello-pill .hello-text-neutral,
  .hello-pill .hello-text-hover{
    transition:none!important;
  }
  .hello-pill:hover > .hello-status-dot,
  .hello-pill.is-status-active > .hello-status-dot{
    animation:none!important;
  }
}

/* ===== Hello status descendant reset v80.1 ===== */
/* Corrige a regra antiga ".hello-pill span { background:#27b36a!important; }":
   apenas o ponto deve ser verde. */
.hello-pill > span:not(.hello-status-dot),
.hello-pill .hello-text,
.hello-pill .hello-text-neutral,
.hello-pill .hello-text-hover{
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  border:0!important;
  width:auto!important;
  height:auto!important;
  border-radius:0!important;
}
.hello-pill > .hello-status-dot{
  background:#27b36a!important;
  background-color:#27b36a!important;
}


/* ===== Global interactive hover system v83 ===== */
:root{
  --hover-dark:#2A2D33;
  --hover-muted:#2F3338;
  --hover-light:#F1F2EE;
  --hover-border:rgba(21,23,27,.16);
  --hover-shadow:0 10px 26px rgba(21,23,27,.10);
}

html[data-theme="dark"]{
  --hover-dark:#343840;
  --hover-muted:#F4F4F2;
  --hover-light:#24262B;
  --hover-border:rgba(255,255,255,.16);
  --hover-shadow:0 12px 30px rgba(0,0,0,.24);
}

/* Base transition for interactive elements */
a,
button,
[role="button"],
.project-card,
.case-more-card,
.home-about-links a,
.links a,
.intro-primary,
.intro-link,
.visit-site a,
.case-more-all,
.project-arrow,
.lang-switch-opt a,
.side-nav a,
.mobile-menu a,
.back,
.case-portfolio-back,
.portfolio-cv-back,
.theme-toggle,
.video-play,
.tool,
.skill,
.chip{
  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease,
    opacity .2s ease!important;
}

/* 1) Negative / dark buttons */
.intro-primary,
.visit-site a,
.contact-actions a,
button:not(.theme-toggle):not(.video-play):not(.video-close),
a.button-dark,
.btn-dark{
  background:#15171B;
  color:#fff;
}

@media(hover:hover) and (pointer:fine){
  .intro-primary:hover,
  .visit-site a:hover,
  .contact-actions a:hover,
  button:not(.theme-toggle):not(.video-play):not(.video-close):hover,
  a.button-dark:hover,
  .btn-dark:hover{
    background:var(--hover-dark)!important;
    border-color:var(--hover-border)!important;
    box-shadow:var(--hover-shadow)!important;
    transform:translateY(-1px);
  }
}

/* 2) Tertiary / muted links and labels */
.intro-link,
.case-more-all,
.side-nav a,
.about-links a,
.home-about-links a,
.links a,
a.text-link{
  color:#565B62;
}

@media(hover:hover) and (pointer:fine){
  .intro-link:hover,
  .case-more-all:hover,
  .side-nav a:hover,
  .about-links a:hover,
  .home-about-links a:hover,
  .links a:hover,
  a.text-link:hover{
    color:var(--hover-muted)!important;
  }
}

/* 3) Positive / white buttons and pills */
.case-portfolio-back,
.portfolio-cv-back,
.back,
.theme-toggle,
.lang-switch-opt,
.home-about-links a,
.links a,
a.button-light,
.btn-light{
  background:#fff;
}

@media(hover:hover) and (pointer:fine){
  .case-portfolio-back:hover,
  .portfolio-cv-back:hover,
  .back:hover,
  .theme-toggle:hover,
  .home-about-links a:hover,
  .links a:hover,
  a.button-light:hover,
  .btn-light:hover{
    background:var(--hover-light)!important;
    border-color:var(--hover-border)!important;
    box-shadow:var(--hover-shadow)!important;
    transform:translateY(-1px);
  }
}

/* Cards */
@media(hover:hover) and (pointer:fine){
  .project-card:hover,
  .case-more-card:hover{
    border-color:var(--hover-border)!important;
    box-shadow:var(--hover-shadow)!important;
    transform:translateY(-2px);
  }

  .project-card:hover .project-media img,
  .case-more-card:hover .case-more-media img{
    transform:scale(1.02);
  }

  .project-card:hover .project-arrow{
    transform:translate(3px,-3px);
  }

  .case-more-card:hover h3{
    color:var(--hover-muted)!important;
  }
}

.project-card .project-media img,
.case-more-card .case-more-media img{
  transition:transform .3s cubic-bezier(.2,.7,.2,1)!important;
}

/* Language switch */
@media(hover:hover) and (pointer:fine){
  .lang-switch-opt a:hover{
    background:var(--hover-light)!important;
    color:#17191E!important;
  }
  html[data-theme="dark"] .lang-switch-opt a:hover{
    background:#2A2C31!important;
    color:#fff!important;
  }
}

/* Side nav */
@media(hover:hover) and (pointer:fine){
  .side-nav a:hover{
    transform:translateX(-2px);
  }
}

/* Tools / chips that are clickable or behave as controls */
@media(hover:hover) and (pointer:fine){
  a.tool:hover,
  button.tool:hover,
  a.skill:hover,
  button.skill:hover,
  a.chip:hover,
  button.chip:hover{
    background:var(--hover-light)!important;
    border-color:var(--hover-border)!important;
    color:var(--hover-muted)!important;
    transform:translateY(-1px);
  }
}

/* Dark mode surface overrides */
html[data-theme="dark"] .case-portfolio-back,
html[data-theme="dark"] .portfolio-cv-back,
html[data-theme="dark"] .back,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .home-about-links a,
html[data-theme="dark"] .links a{
  background:#1A1B1F!important;
}

@media(hover:hover) and (pointer:fine){
  html[data-theme="dark"] .case-portfolio-back:hover,
  html[data-theme="dark"] .portfolio-cv-back:hover,
  html[data-theme="dark"] .back:hover,
  html[data-theme="dark"] .theme-toggle:hover,
  html[data-theme="dark"] .home-about-links a:hover,
  html[data-theme="dark"] .links a:hover{
    background:var(--hover-light)!important;
    color:#F4F4F2!important;
  }
}

/* Footer/contact buttons with arrows */
@media(hover:hover) and (pointer:fine){
  a:hover .project-arrow,
  a:hover [aria-hidden="true"].arrow,
  button:hover .arrow{
    transform:translateX(3px);
  }
}

/* Mobile/touch: no hover simulation */
@media(hover:none), (pointer:coarse){
  a,
  button,
  [role="button"],
  .project-card,
  .case-more-card{
    transform:none!important;
  }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  a,
  button,
  [role="button"],
  .project-card,
  .case-more-card,
  .project-media img,
  .case-more-media img{
    transition:none!important;
    transform:none!important;
  }
}


/* ===== CTA hover refinement v84 ===== */

/* CTA inicial — Ver currículo / View résumé
   Light: mantém o estado neutro atual; hover roxo.
   Dark: roxo no estado neutro; hover branco com texto preto. */
html:not([data-theme="dark"]) .intro-primary{
  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease!important;
}

@media(hover:hover) and (pointer:fine){
  html:not([data-theme="dark"]) .intro-primary:hover{
    background:#5A4DF3!important;
    color:#FFFFFF!important;
    border-color:#5A4DF3!important;
    box-shadow:0 10px 26px rgba(90,77,243,.20)!important;
  }
}

html[data-theme="dark"] .intro-primary{
  background:#5A4DF3!important;
  color:#FFFFFF!important;
  border-color:#5A4DF3!important;
}

@media(hover:hover) and (pointer:fine){
  html[data-theme="dark"] .intro-primary:hover{
    background:#FFFFFF!important;
    color:#15171B!important;
    border-color:#FFFFFF!important;
    box-shadow:0 10px 26px rgba(255,255,255,.10)!important;
  }
}

/* CTA final — Me envie uma mensagem / Send me a message
   Estado neutro branco; hover roxo com texto branco. */
.contact-actions a,
a.contact-cta{
  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease!important;
}

@media(hover:hover) and (pointer:fine){
  .contact-actions a:hover,
  a.contact-cta:hover{
    background:#5A4DF3!important;
    color:#FFFFFF!important;
    border-color:#5A4DF3!important;
    box-shadow:0 10px 26px rgba(90,77,243,.20)!important;
  }
}

/* Dark mode: garante que o CTA final também respeite o hover roxo solicitado. */
@media(hover:hover) and (pointer:fine){
  html[data-theme="dark"] .contact-actions a:hover,
  html[data-theme="dark"] a.contact-cta:hover{
    background:#5A4DF3!important;
    color:#FFFFFF!important;
    border-color:#5A4DF3!important;
  }
}




/* ===== V86 — correção real da hello-pill no Dark Mode ===== */

/* Supera a regra antiga que aplicava fundo verde em TODOS os spans. */
html[data-theme="dark"] body .hello-pill span:not(.hello-status-dot),
html[data-theme="dark"] body .hello-pill .hello-text,
html[data-theme="dark"] body .hello-pill .hello-text-neutral,
html[data-theme="dark"] body .hello-pill .hello-text-hover{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border:0!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  border-radius:0!important;
}

/* A única forma verde permitida dentro da tag é este ponto. */
html[data-theme="dark"] body .hello-pill > .hello-status-dot{
  display:block!important;
  width:7px!important;
  height:7px!important;
  min-width:7px!important;
  flex:0 0 7px!important;
  border-radius:50%!important;
  background:#27B36A!important;
  background-color:#27B36A!important;
  background-image:none!important;
  box-shadow:none;
}

/* Cápsula neutra */
html[data-theme="dark"] body .hello-pill{
  background:#1A1B1F!important;
  background-image:none!important;
  color:#F4F4F2!important;
  border-color:rgba(255,255,255,.14)!important;
}

/* Hover/status */
html[data-theme="dark"] body .hello-pill:hover,
html[data-theme="dark"] body .hello-pill.is-status-active{
  background:#17241D!important;
  background-image:none!important;
  border-color:rgba(110,231,168,.28)!important;
}

html[data-theme="dark"] body .hello-pill .hello-text-hover{
  color:#6EE7A8!important;
}


/* ===== V87 — padrão global "Continue explorando" nos cases =====
   Product Design + Web & UI Design | Light + Dark | PT + EN */
.case-related .eyebrow,
.related-cases .eyebrow,
.more-cases .eyebrow,
.other-cases .eyebrow,
.continue-exploring .eyebrow,
.case-more .eyebrow,
.case-next .eyebrow,
section[id*="related"] .eyebrow,
section[class*="related"] .eyebrow{
  color:#5A4DF3!important;
}

/* Caso a label use classe própria em algum template */
.continue-label,
.continue-exploring-label,
.case-related-label{
  color:#5A4DF3!important;
}


/* ===== V88 — padronização global das labels de tipo nos cards de cases =====
   Cor padrão da identidade principal: #5A4DF3 */
.case-more-type,
.project-type,
.project-card .eyebrow,
.case-more-card .eyebrow,
.related-cases .eyebrow,
.case-related .eyebrow,
.more-cases .eyebrow,
.other-cases .eyebrow,
.continue-exploring .eyebrow,
.case-more-card [class*="type"],
.project-card [class*="type"]{
  color:#5A4DF3!important;
}

/* Dark mode mantém o mesmo roxo para consistência visual */
html[data-theme="dark"] .case-more-type,
html[data-theme="dark"] .project-type,
html[data-theme="dark"] .project-card .eyebrow,
html[data-theme="dark"] .case-more-card .eyebrow,
html[data-theme="dark"] .related-cases .eyebrow,
html[data-theme="dark"] .case-related .eyebrow,
html[data-theme="dark"] .more-cases .eyebrow,
html[data-theme="dark"] .other-cases .eyebrow,
html[data-theme="dark"] .continue-exploring .eyebrow{
  color:#5A4DF3!important;
}

.case-type-purple{color:#5A4DF3!important;}
html[data-theme="dark"] .case-type-purple{color:#5A4DF3!important;}


/* ===== V89 — tags internas dos cases voltam ao padrão neutro ===== */
.case-tags span,
.case-tags a,
.tags span,
.tags a,
.chip,
.skill-chip,
.case-chip,
.case-meta .tag,
.case-meta .chip,
.hero-tags span,
.hero-tags a{
  color:#4F5C54!important;
}

/* Dark mode: mantém leitura adequada sem usar o roxo de identidade */
html[data-theme="dark"] .case-tags span,
html[data-theme="dark"] .case-tags a,
html[data-theme="dark"] .tags span,
html[data-theme="dark"] .tags a,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .skill-chip,
html[data-theme="dark"] .case-chip,
html[data-theme="dark"] .case-meta .tag,
html[data-theme="dark"] .case-meta .chip,
html[data-theme="dark"] .hero-tags span,
html[data-theme="dark"] .hero-tags a{
  color:#AEB8B1!important;
}


/* ===== V89 — Aurora Bem Leve: identidade verde do case ===== */
body.aurora-case,
.aurora-case{
  --aurora-green:#244B2B;
  --aurora-green-2:#6FA33B;
  --aurora-green-soft:#EDF5E8;
}

/* Cards/boxes destacados do Aurora */
.aurora-case .highlight-card,
.aurora-case .feature-card,
.aurora-case .insight-card,
.aurora-case .case-card,
.aurora-case .result-card{
  background:var(--aurora-green-soft)!important;
  border-color:rgba(36,75,43,.18)!important;
}

/* Títulos/acentos */
.aurora-case .highlight-card .eyebrow,
.aurora-case .feature-card .eyebrow,
.aurora-case .insight-card .eyebrow,
.aurora-case .case-card .eyebrow,
.aurora-case .result-card .eyebrow{
  color:var(--aurora-green-2)!important;
}

/* CTA do Aurora */
.aurora-case .primary-cta,
.aurora-case .case-cta,
.aurora-case .visit-site a,
.aurora-case a.button-dark{
  background:var(--aurora-green)!important;
  color:#fff!important;
  border-color:var(--aurora-green)!important;
}

@media(hover:hover) and (pointer:fine){
  .aurora-case .primary-cta:hover,
  .aurora-case .case-cta:hover,
  .aurora-case .visit-site a:hover,
  .aurora-case a.button-dark:hover{
    background:var(--aurora-green-2)!important;
    color:#fff!important;
    border-color:var(--aurora-green-2)!important;
  }
}

html[data-theme="dark"] .aurora-case .highlight-card,
html[data-theme="dark"] .aurora-case .feature-card,
html[data-theme="dark"] .aurora-case .insight-card,
html[data-theme="dark"] .aurora-case .case-card,
html[data-theme="dark"] .aurora-case .result-card{
  background:#172018!important;
  border-color:rgba(111,163,59,.24)!important;
}


/* ===== V90 — escopo correto de cores de labels/tags ===== */

/* Tags/chips internas dos cases: padrão neutro */
.case .meta span,
.page .meta span,
.case-tags span,
.tags span,
.hero-tags span{
  color:#4F5C54!important;
}

/* Dark mode das tags internas */
html[data-theme="dark"] .case .meta span,
html[data-theme="dark"] .page .meta span,
html[data-theme="dark"] .case-tags span,
html[data-theme="dark"] .tags span,
html[data-theme="dark"] .hero-tags span{
  color:#AEB8B1!important;
}

/* SOMENTE labels de tipo nos cards de "Outros cases" ficam roxas */
.case-more-card .case-more-type,
.project-card .project-type{
  color:#5A4DF3!important;
}
html[data-theme="dark"] .case-more-card .case-more-type,
html[data-theme="dark"] .project-card .project-type{
  color:#5A4DF3!important;
}

/* NETLIFY_PRODUCTION_V92 */


/* ===== V93 — padrão único de controles no topo mobile =====
   Home, Currículo e todos os Cases:
   [esquerda: logo ou voltar] ........ [tema] [idioma]
*/
@media(max-width:760px){

  /* Idioma sempre no extremo direito */
  .lang-switch-opt{
    position:fixed!important;
    top:11px!important;
    right:14px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    z-index:2147483647!important;
  }

  /* Dark mode imediatamente à esquerda do idioma */
  .theme-toggle{
    position:fixed!important;
    top:11px!important;
    right:166px!important;
    left:auto!important;
    bottom:auto!important;
    width:36px!important;
    height:36px!important;
    margin:0!important;
    z-index:2147483646!important;
  }

  /* Botões de retorno das páginas internas no mesmo eixo vertical */
  .case-portfolio-back,
  .portfolio-cv-back{
    position:fixed!important;
    top:11px!important;
    left:12px!important;
    right:auto!important;
    bottom:auto!important;
    min-height:36px!important;
    max-width:156px!important;
    padding:0 12px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:11px!important;
    line-height:1!important;
    margin:0!important;
    z-index:2147483645!important;
  }

  /* Evita que regras específicas de cases reposicionem controles */
  .aurora-case .lang-switch-opt{
    top:11px!important;
    right:14px!important;
    left:auto!important;
  }
}

/* Em celulares muito estreitos, compacta levemente mantendo separação */
@media(max-width:390px){
  .lang-switch-opt{
    right:8px!important;
  }
  .lang-switch-opt a{
    min-width:36px!important;
    padding-left:5px!important;
    padding-right:5px!important;
  }
  .theme-toggle{
    right:151px!important;
  }
  .case-portfolio-back,
  .portfolio-cv-back{
    left:8px!important;
    max-width:142px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    font-size:10px!important;
  }
}

/* NETLIFY_PRODUCTION_V93 */

/* V94 — Figma-inspired hero */
.hero-photo-wrap{position:relative!important;overflow:visible!important}
.hero-figma-ui{position:absolute;inset:-5% -8%;z-index:8;pointer-events:none;font-family:inherit}
.fg-orbit{position:absolute;width:78%;aspect-ratio:1;border:1px dashed rgba(90,77,243,.24);border-radius:50%;left:11%;top:1%}
.fg-tool,.fg-panel{position:absolute;background:rgba(255,255,255,.95);border:1px solid rgba(21,23,27,.08);box-shadow:0 14px 34px rgba(21,23,27,.10);color:#15171b;transition:.35s cubic-bezier(.2,.8,.2,1);backdrop-filter:blur(10px)}
.fg-tool{width:62px;height:62px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:31px}
.fg-cursor{left:5%;top:20%;transform:rotate(-30deg)}.fg-pen{left:30%;top:7%;background:transparent;border:0;box-shadow:none;font-size:42px}.fg-text{right:25%;top:14%;background:transparent;border:0;box-shadow:none;font:500 37px Georgia}.fg-frame{right:5%;top:19%;font-size:36px;font-weight:300}
.fg-panel{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;font-size:10px;line-height:1.2}.fg-panel small{font-size:9px}
.fg-auto{right:0;top:2%;width:120px}.fg-layers{left:-2%;bottom:15%;width:110px}.fg-styles{right:-4%;bottom:9%;width:112px}
.fg-swatches{display:block;width:64px;height:18px;background:radial-gradient(circle at 9px 9px,#5a4df3 0 8px,transparent 8.5px),radial-gradient(circle at 32px 9px,#15171b 0 8px,transparent 8.5px),radial-gradient(circle at 55px 9px,#d9dadd 0 8px,transparent 8.5px)}
.fg-component{position:absolute;right:6%;top:45%;padding:7px 12px;border-radius:999px;background:#22b573;color:#fff;font-size:10px;font-weight:700;box-shadow:0 8px 20px rgba(34,181,115,.2)}
.fg-spark{position:absolute;font-size:22px}.fg-spark.a{right:12%;top:0;color:#f2b52b}.fg-spark.b{left:17%;bottom:7%;color:#ffd764}
.hero-photo-wrap:hover .fg-cursor{transform:translate(-7px,-5px) rotate(-38deg)}.hero-photo-wrap:hover .fg-auto{transform:translate(5px,-5px)}.hero-photo-wrap:hover .fg-layers{transform:translate(-5px,4px)}.hero-photo-wrap:hover .fg-styles{transform:translate(5px,4px)}
html[data-theme="dark"] .fg-tool,html[data-theme="dark"] .fg-panel{background:rgba(29,32,38,.95);color:#f6f6f7;border-color:rgba(255,255,255,.12);box-shadow:0 14px 34px rgba(0,0,0,.28)}
html[data-theme="dark"] .fg-pen,html[data-theme="dark"] .fg-text{background:transparent}html[data-theme="dark"] .fg-orbit{border-color:rgba(139,126,255,.32)}
@media(max-width:760px){.hero-figma-ui{inset:-2% -1%}.fg-panel,.fg-component{display:none}.fg-tool{width:52px;height:52px;transform:scale(.72)}.fg-cursor{left:0;top:20%;transform:scale(.72) rotate(-30deg)}.fg-pen{left:26%;top:2%;background:transparent}.fg-text{right:22%;top:8%;background:transparent}.fg-frame{right:0;top:20%}.fg-spark{font-size:15px}}

/* NETLIFY_PRODUCTION_V94 */

/* ===== V95B — Hero Figma refinado e estável ===== */

/* Oculta elementos da V94 que não serão mais usados */
.hero-figma-ui-v95 .fg-auto,
.hero-figma-ui-v95 .fg-layers,
.hero-figma-ui-v95 .fg-styles,
.hero-figma-ui-v95 .fg-component,
.hero-figma-ui-v95 .fg-pen{
  display:none!important;
}

/* Limpa heranças da versão anterior */
.hero-figma-ui-v95{
  position:absolute!important;
  inset:-4% -6%!important;
  z-index:8!important;
  pointer-events:none!important;
  font-family:inherit!important;
}

.hero-figma-ui-v95 .fg-orbit{
  position:absolute!important;
  width:78%!important;
  aspect-ratio:1!important;
  left:11%!important;
  top:2%!important;
  border:1px dashed rgba(90,77,243,.26)!important;
  border-radius:50%!important;
}

.hero-figma-ui-v95 .fg-tool{
  position:absolute!important;
  width:66px!important;
  height:66px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(21,23,27,.08)!important;
  box-shadow:0 14px 34px rgba(21,23,27,.10)!important;
  color:#15171b!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  transition:
    transform .34s cubic-bezier(.2,.8,.2,1),
    box-shadow .34s ease,
    background-color .22s ease!important;
}

/* Posicionamento sem sobreposição */
.hero-figma-ui-v95 .fg-cursor{
  left:3%!important;
  top:22%!important;
  transform:rotate(-8deg)!important;
}
.hero-figma-ui-v95 .fg-text{
  right:17%!important;
  top:12%!important;
  font:500 38px/1 Georgia,serif!important;
}
.hero-figma-ui-v95 .fg-frame{
  right:1%!important;
  top:49%!important;
}
.hero-figma-ui-v95 .fg-figma{
  left:2%!important;
  bottom:8%!important;
}

.hero-figma-ui-v95 .fg-cursor svg{
  width:38px!important;
  height:38px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

.hero-figma-ui-v95 .frame-box{
  position:relative!important;
  width:28px!important;
  height:28px!important;
  border:2px solid currentColor!important;
}
.hero-figma-ui-v95 .frame-box::before{
  content:""!important;
  position:absolute!important;
  inset:-5px!important;
  background:
    radial-gradient(circle at 0 0,currentColor 0 3px,transparent 3.5px),
    radial-gradient(circle at 100% 0,currentColor 0 3px,transparent 3.5px),
    radial-gradient(circle at 0 100%,currentColor 0 3px,transparent 3.5px),
    radial-gradient(circle at 100% 100%,currentColor 0 3px,transparent 3.5px)!important;
}

/* Marca Figma */
.hero-figma-ui-v95 .figma-mark{
  position:relative!important;
  width:31px!important;
  height:46px!important;
  display:block!important;
}
.hero-figma-ui-v95 .figma-mark i{
  position:absolute!important;
  width:16px!important;
  height:16px!important;
}
.hero-figma-ui-v95 .figma-mark i:nth-child(1){left:0!important;top:0!important;background:#F24E1E!important;border-radius:8px 0 0 8px!important}
.hero-figma-ui-v95 .figma-mark i:nth-child(2){left:15px!important;top:0!important;background:#FF7262!important;border-radius:0 8px 8px 0!important}
.hero-figma-ui-v95 .figma-mark i:nth-child(3){left:0!important;top:15px!important;background:#A259FF!important;border-radius:8px 0 0 8px!important}
.hero-figma-ui-v95 .figma-mark i:nth-child(4){left:15px!important;top:15px!important;background:#1ABCFE!important;border-radius:50%!important}
.hero-figma-ui-v95 .figma-mark i:nth-child(5){left:0!important;top:30px!important;background:#0ACF83!important;border-radius:8px 0 8px 8px!important}

/* Brilhos roxos */
.hero-figma-ui-v95 .fg-spark{
  position:absolute!important;
  color:#5A4DF3!important;
  line-height:1!important;
  text-shadow:0 4px 14px rgba(90,77,243,.16)!important;
  transition:transform .3s ease!important;
}
.hero-figma-ui-v95 .fg-spark-top{
  right:10%!important;
  top:2%!important;
  font-size:26px!important;
}
.hero-figma-ui-v95 .fg-spark-bottom{
  left:20%!important;
  bottom:1%!important;
  font-size:17px!important;
  opacity:.85!important;
}

.hero-figma-ui-v95 .fg-dots{
  position:absolute!important;
  width:38px!important;
  height:38px!important;
  right:0!important;
  bottom:12%!important;
  opacity:.42!important;
  background-image:radial-gradient(circle,#5A4DF3 1.5px,transparent 1.8px)!important;
  background-size:9px 9px!important;
}

/* Hover discreto */
@media(hover:hover) and (pointer:fine){
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-cursor{
    transform:translate(-5px,-4px) rotate(-13deg)!important;
  }
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-text{
    transform:translate(3px,-4px)!important;
  }
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-frame{
    transform:translate(5px,3px)!important;
  }
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-figma{
    transform:translate(-4px,4px)!important;
  }
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-spark{
    transform:scale(1.12) rotate(7deg)!important;
  }
}

/* Dark mode */
html[data-theme="dark"] .hero-figma-ui-v95 .fg-tool{
  background:rgba(28,30,35,.95)!important;
  color:#F5F5F3!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
}
html[data-theme="dark"] .hero-figma-ui-v95 .fg-orbit{
  border-color:rgba(126,113,255,.34)!important;
}
html[data-theme="dark"] .hero-figma-ui-v95 .fg-spark{
  color:#8F84FF!important;
}
html[data-theme="dark"] .hero-figma-ui-v95 .fg-dots{
  background-image:radial-gradient(circle,#8F84FF 1.5px,transparent 1.8px)!important;
}

/* Mobile simplificado */
@media(max-width:760px){
  .hero-figma-ui-v95{
    inset:-1% -1%!important;
  }
  .hero-figma-ui-v95 .fg-tool{
    width:48px!important;
    height:48px!important;
    border-radius:14px!important;
  }
  .hero-figma-ui-v95 .fg-cursor{
    left:0!important;
    top:23%!important;
    transform:rotate(-8deg) scale(.88)!important;
  }
  .hero-figma-ui-v95 .fg-text{
    right:15%!important;
    top:9%!important;
    font-size:28px!important;
  }
  .hero-figma-ui-v95 .fg-frame{
    right:0!important;
    top:52%!important;
    transform:scale(.84)!important;
  }
  .hero-figma-ui-v95 .fg-figma{
    left:2%!important;
    bottom:5%!important;
    transform:scale(.82)!important;
  }
  .hero-figma-ui-v95 .fg-dots{
    display:none!important;
  }
  .hero-figma-ui-v95 .fg-spark-top{
    right:5%!important;
    top:1%!important;
    font-size:18px!important;
  }
  .hero-figma-ui-v95 .fg-spark-bottom{
    left:22%!important;
    bottom:0!important;
    font-size:13px!important;
  }
}

/* NETLIFY_PRODUCTION_V95B */


/* ===== V96 — Hero refinado final ===== */

/* Logo Figma removido da composição */
.hero-figma-ui-v95 .fg-figma,
.hero-figma-ui-v95 .figma-mark{
  display:none!important;
}

/* Cursor sobe para não encostar nem sobrepor nenhum outro elemento */
.hero-figma-ui-v95 .fg-cursor{
  left:3%!important;
  top:13%!important;
  transform:rotate(-8deg)!important;
}

/* Text e frame com respiro */
.hero-figma-ui-v95 .fg-text{
  right:17%!important;
  top:12%!important;
}

.hero-figma-ui-v95 .fg-frame{
  right:1%!important;
  top:49%!important;
}

/* Mantém órbita limpa por trás, sem competir com os cards */
.hero-figma-ui-v95 .fg-orbit{
  z-index:-1!important;
}

/* Brilhos permanecem roxos */
.hero-figma-ui-v95 .fg-spark,
html[data-theme="dark"] .hero-figma-ui-v95 .fg-spark{
  color:#5A4DF3!important;
}

/* Garante que nenhum elemento decorativo se sobreponha visualmente a outro */
.hero-figma-ui-v95 .fg-tool{
  isolation:isolate!important;
}

/* Hover mantém o cursor dentro da sua área */
@media(hover:hover) and (pointer:fine){
  .hero-photo-wrap:hover .hero-figma-ui-v95 .fg-cursor{
    transform:translate(-4px,-3px) rotate(-12deg)!important;
  }
}

/* Mobile: menos elementos e mais respiro */
@media(max-width:760px){
  .hero-figma-ui-v95 .fg-cursor{
    left:1%!important;
    top:13%!important;
    transform:rotate(-8deg) scale(.86)!important;
  }

  .hero-figma-ui-v95 .fg-text{
    right:15%!important;
    top:8%!important;
  }

  .hero-figma-ui-v95 .fg-frame{
    right:1%!important;
    top:52%!important;
  }

  .hero-figma-ui-v95 .fg-dots{
    display:none!important;
  }
}

/* NETLIFY_PRODUCTION_V96 */
