/* 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 */


/* ===== V97 — contraste do menu mobile no dark mode ===== */
@media(max-width:760px){
  html[data-theme="dark"] .mobile-menu,
  html[data-theme="dark"] .mobile-nav,
  html[data-theme="dark"] .mobile-menu-panel,
  html[data-theme="dark"] .mobile-nav-panel{
    background:#1B1D21!important;
    border-color:rgba(255,255,255,.14)!important;
  }

  html[data-theme="dark"] .mobile-menu .menu-label,
  html[data-theme="dark"] .mobile-nav .menu-label,
  html[data-theme="dark"] .mobile-menu .eyebrow,
  html[data-theme="dark"] .mobile-nav .eyebrow,
  html[data-theme="dark"] .mobile-menu small,
  html[data-theme="dark"] .mobile-nav small{
    color:#C9CBD0!important;
  }

  html[data-theme="dark"] .mobile-menu a,
  html[data-theme="dark"] .mobile-nav a,
  html[data-theme="dark"] .mobile-menu-panel a,
  html[data-theme="dark"] .mobile-nav-panel a{
    color:#F5F5F3!important;
    opacity:1!important;
  }

  html[data-theme="dark"] .mobile-menu a svg,
  html[data-theme="dark"] .mobile-nav a svg,
  html[data-theme="dark"] .mobile-menu a .arrow,
  html[data-theme="dark"] .mobile-nav a .arrow,
  html[data-theme="dark"] .mobile-menu-panel a svg,
  html[data-theme="dark"] .mobile-nav-panel a svg{
    color:#D8D9DD!important;
    stroke:currentColor!important;
    opacity:1!important;
  }

  html[data-theme="dark"] .mobile-menu li,
  html[data-theme="dark"] .mobile-nav li,
  html[data-theme="dark"] .mobile-menu-panel li,
  html[data-theme="dark"] .mobile-nav-panel li{
    border-color:rgba(255,255,255,.72)!important;
  }

  html[data-theme="dark"] .mobile-menu a:hover,
  html[data-theme="dark"] .mobile-nav a:hover,
  html[data-theme="dark"] .mobile-menu a:focus-visible,
  html[data-theme="dark"] .mobile-nav a:focus-visible{
    color:#8F84FF!important;
  }

  html[data-theme="dark"] .mobile-menu-close,
  html[data-theme="dark"] .mobile-nav-close,
  html[data-theme="dark"] .menu-close{
    color:#FFFFFF!important;
    background:#1B1D21!important;
    border-color:rgba(255,255,255,.18)!important;
  }
}
/* NETLIFY_PRODUCTION_V97 */

/* NETLIFY_PRODUCTION_V98 */

/* NETLIFY_PRODUCTION_V100_CLEAN */

/* V101 Design System category */
.design-system-section{padding:90px 0;background:#f0efff}
.design-system-section .section-head{margin-bottom:34px}
.design-system-card{display:grid;grid-template-columns:1.05fr .95fr;min-height:420px;background:#17191f;border-radius:26px;overflow:hidden;text-decoration:none;color:#fff;border:1px solid rgba(90,77,243,.18);transition:transform .25s ease,box-shadow .25s ease}
.design-system-card:hover{transform:translateY(-4px);box-shadow:0 18px 50px rgba(20,22,28,.12)}
.design-system-card-copy{padding:46px;display:flex;flex-direction:column;justify-content:flex-end}.design-system-card-copy .project-type{color:#8f84ff}.design-system-card-copy h3{font-size:42px;line-height:1;letter-spacing:-.05em;margin:10px 0}.design-system-card-copy p{color:#bcc1ca;font-size:15px;max-width:520px;margin:0}.design-system-card-media{background:#fff;overflow:hidden}.design-system-card-media img{width:100%;height:100%;object-fit:cover}
html[data-theme="dark"] .design-system-section{background:#13151a}html[data-theme="dark"] .design-system-card{border-color:#343840}
@media(max-width:760px){.design-system-section{padding:68px 0}.design-system-card{grid-template-columns:1fr}.design-system-card-copy{padding:28px}.design-system-card-copy h3{font-size:32px}.design-system-card-media{min-height:260px}}

/* V101 DESIGN SYSTEM CATEGORY */

/* NETLIFY_PRODUCTION_V101 */


/* ===== V102 — Design System live demo iframe ===== */
.ds-live-demo-section{padding-top:92px}
.ds-browser{
  margin-top:42px;
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 24px 70px rgba(20,22,28,.10);
}
.ds-browser-bar{
  height:54px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
  padding:0 16px;
  border-bottom:1px solid var(--line);
  background:#f7f7f9;
}
.ds-browser-dots{display:flex;gap:7px}
.ds-browser-dots span{
  width:10px;height:10px;border-radius:50%;
  background:#c8cbd2;
}
.ds-browser-url{
  justify-self:center;
  min-width:0;
  max-width:420px;
  width:100%;
  padding:7px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid #e0e2e7;
  color:#70757e;
  text-align:center;
  font-size:11px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ds-browser-open{
  color:#15171b;
  text-decoration:none;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.ds-browser-frame-wrap{
  position:relative;
  height:760px;
  background:#eef0f4;
}
.ds-live-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  background:#fff;
}
.ds-frame-fallback{
  position:absolute;
  inset:0;
  z-index:-1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:30px;
  text-align:center;
  background:#f4f5f8;
  color:#15171b;
}
.ds-frame-fallback strong{font-size:20px}
.ds-frame-fallback span{max-width:520px;color:#6f747c;font-size:13px}
.ds-frame-fallback a{
  margin-top:8px;
  display:inline-flex;
  padding:12px 16px;
  border-radius:12px;
  background:#5A4DF3;
  color:#fff;
  text-decoration:none;
  font-size:12px;
  font-weight:800;
}
html[data-theme="dark"] .ds-browser{background:#1a1d22;border-color:#30343d}
html[data-theme="dark"] .ds-browser-bar{background:#15181d;border-color:#30343d}
html[data-theme="dark"] .ds-browser-url{background:#20242b;border-color:#343944;color:#c1c5cd}
html[data-theme="dark"] .ds-browser-open{color:#f4f4f2}
html[data-theme="dark"] .ds-browser-frame-wrap{background:#101216}
@media(max-width:760px){
  .ds-browser{border-radius:18px}
  .ds-browser-bar{
    grid-template-columns:auto 1fr;
    height:50px;
  }
  .ds-browser-open{display:none}
  .ds-browser-url{justify-self:stretch}
  .ds-browser-frame-wrap{height:540px}
}

/* NETLIFY_PRODUCTION_V102 */


/* ===== V103 — Design System case refinado ===== */
.ds-embedded-demo{
  position:relative;
  height:780px;
  margin-top:42px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 24px 70px rgba(20,22,28,.10);
}
.ds-embedded-demo .ds-live-frame{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  border:0;
  background:#fff;
}
/* Esconde definitivamente a moldura simulada da V102 */
.ds-browser-bar,
.ds-browser-dots,
.ds-browser-url,
.ds-browser-open,
.ds-frame-fallback{display:none!important}

html[data-theme="dark"] .ds-embedded-demo{
  background:#101216;
  border-color:#30343d;
}
@media(max-width:760px){
  .ds-embedded-demo{
    height:600px;
    margin-top:30px;
    border-radius:18px;
  }
}
/* NETLIFY_PRODUCTION_V103 */

/* V104 Design System compact case */
.case-more-kicker{color:#5A4DF3!important}
.design-system-card-media img{object-fit:cover;object-position:center}
.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:760px){.hero-visual img{min-height:260px}}
/* NETLIFY_PRODUCTION_V104 */

/* NETLIFY_PRODUCTION_V105 */


/* ===== V106 — Design System / Outros Cases mobile ===== */
@media (max-width:760px){
  .ds-case-page .case-more{
    padding-left:0;
    padding-right:0;
    overflow:hidden;
  }
  .ds-case-page .case-more-inner{
    width:100%;
    max-width:none;
  }
  .ds-case-page .case-more-head{
    padding-left:16px;
    padding-right:16px;
  }
  .ds-case-page .case-more-grid{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    padding:0 16px 14px;
    scroll-snap-type:x mandatory;
    scroll-padding-left:16px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .ds-case-page .case-more-grid::-webkit-scrollbar{display:none}
  .ds-case-page .case-more-card{
    flex:0 0 84% !important;
    width:84% !important;
    min-width:84% !important;
    max-width:84% !important;
    scroll-snap-align:start;
  }
  .ds-case-page .case-more-media{
    height:180px;
  }
}
/* NETLIFY_PRODUCTION_V106 */

/* NETLIFY_PRODUCTION_V107 — play microinteraction unchanged */


/* ===== V108 — Scroll Reveal Animations (desktop + mobile) ===== */
[data-reveal]{
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:
    opacity .58s cubic-bezier(.22,.61,.36,1),
    transform .58s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;
}
[data-reveal="left"]{transform:translate3d(-26px,0,0)}
[data-reveal="right"]{transform:translate3d(26px,0,0)}
[data-reveal="scale"]{transform:scale(.975)}
[data-reveal].is-revealed{
  opacity:1;
  transform:none;
  will-change:auto;
}
[data-reveal-delay="1"]{transition-delay:.06s}
[data-reveal-delay="2"]{transition-delay:.12s}
[data-reveal-delay="3"]{transition-delay:.18s}
[data-reveal-delay="4"]{transition-delay:.24s}
[data-reveal-delay="5"]{transition-delay:.30s}

@media (max-width:760px){
  [data-reveal]{
    transform:translate3d(0,16px,0);
    transition-duration:.5s;
  }
  [data-reveal="left"]{transform:translate3d(-18px,0,0)}
  [data-reveal="right"]{transform:translate3d(18px,0,0)}
  [data-reveal="scale"]{transform:scale(.985)}
}

@media (prefers-reduced-motion: reduce){
  [data-reveal]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}
/* NETLIFY_PRODUCTION_V108 */


/* ===== V109 — Dark mode switch / mobile header / firefly cursor ===== */

/* Rebuild the existing theme control as a tactile wall switch */
.theme-toggle{
  width:58px!important;
  height:72px!important;
  padding:0!important;
  border:1px solid rgba(21,23,27,.12)!important;
  border-radius:15px!important;
  background:rgba(250,249,246,.96)!important;
  color:#15171b!important;
  box-shadow:0 10px 28px rgba(18,20,24,.10)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:fixed!important;
  top:auto!important;
  right:24px!important;
  bottom:28px!important;
  cursor:pointer!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.theme-toggle svg{display:none!important}
.theme-wall-plate{
  width:32px;height:47px;border:2px solid currentColor;border-radius:5px;
  display:flex;align-items:center;justify-content:center;
  background:#f5f4f0;box-shadow:inset 0 0 0 3px rgba(21,23,27,.05);
}
.theme-wall-rocker{
  width:13px;height:27px;border:2px solid currentColor;border-radius:3px;
  background:linear-gradient(to bottom,#fff 0 48%,#e6e5e1 48% 100%);
  box-shadow:0 2px 3px rgba(0,0,0,.18);
  transform:perspective(30px) rotateX(-7deg);
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
}
html[data-theme="dark"] .theme-toggle{
  background:#17191d!important;
  color:#f7f7f5!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 10px 32px rgba(0,0,0,.32),0 0 22px rgba(190,255,0,.07)!important;
}
html[data-theme="dark"] .theme-wall-plate{
  background:#22252a;box-shadow:inset 0 0 0 3px rgba(255,255,255,.04);
}
html[data-theme="dark"] .theme-wall-rocker{
  background:linear-gradient(to bottom,#555a61 0 48%,#f3f3ef 48% 100%);
  transform:perspective(30px) rotateX(7deg);
  box-shadow:0 -2px 3px rgba(0,0,0,.28),0 5px 15px rgba(190,255,0,.13);
}

/* Desktop home: switch becomes part of the lateral navigation card */
@media(min-width:761px){
  body.home-page-v109 .side-nav{
    padding-top:88px!important;
  }
  body.home-page-v109 .side-nav .theme-toggle{
    position:absolute!important;
    top:14px!important;
    right:50%!important;
    bottom:auto!important;
    transform:translateX(50%)!important;
    width:54px!important;
    height:62px!important;
    box-shadow:0 7px 18px rgba(18,20,24,.08)!important;
  }
  body.home-page-v109 .side-nav .theme-wall-plate{width:29px;height:42px}
  body.home-page-v109 .side-nav .theme-wall-rocker{width:12px;height:24px}
}

/* Mobile: language + hamburger in header; dark switch becomes bottom-right control */
@media(max-width:760px){
  .lang-switch-opt{
    top:11px!important;
    right:72px!important;
    left:auto!important;
    bottom:auto!important;
  }
  .mobile-menu-button{
    display:flex!important;
    position:fixed!important;
    top:11px!important;
    right:14px!important;
    left:auto!important;
    bottom:auto!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    border-radius:50%!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:2147483647!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1!important;
    background:#17191e!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.08)!important;
    box-shadow:0 8px 22px rgba(18,20,24,.16)!important;
  }
  .theme-toggle{
    position:fixed!important;
    top:auto!important;
    right:16px!important;
    bottom:18px!important;
    left:auto!important;
    width:62px!important;
    height:72px!important;
    border-radius:17px!important;
    z-index:2147483646!important;
    transform:none!important;
  }
  .theme-wall-plate{width:34px;height:49px}
  .theme-wall-rocker{width:14px;height:28px}
}
@media(max-width:390px){
  .lang-switch-opt{right:66px!important}
  .mobile-menu-button{right:8px!important}
  .theme-toggle{right:12px!important;bottom:14px!important}
}

/* Firefly cursor — dark mode, desktop/fine pointer only */
.firefly-cursor,.firefly-trail{
  position:fixed;pointer-events:none;z-index:2147483647;
  opacity:0;
}
@media(min-width:761px) and (hover:hover) and (pointer:fine){
  html[data-theme="dark"] body.firefly-enabled{
    cursor:none;
  }
  html[data-theme="dark"] body.firefly-enabled a,
  html[data-theme="dark"] body.firefly-enabled button,
  html[data-theme="dark"] body.firefly-enabled input,
  html[data-theme="dark"] body.firefly-enabled textarea,
  html[data-theme="dark"] body.firefly-enabled select,
  html[data-theme="dark"] body.firefly-enabled label,
  html[data-theme="dark"] body.firefly-enabled [role="button"],
  html[data-theme="dark"] body.firefly-enabled [tabindex]:not([tabindex="-1"]){
    cursor:pointer;
  }
  .firefly-cursor{
    width:8px;height:8px;border-radius:50%;
    background:#c8ff00;
    box-shadow:
      0 0 6px #c8ff00,
      0 0 15px rgba(200,255,0,.92),
      0 0 32px rgba(200,255,0,.55);
    transform:translate(-50%,-50%);
    transition:opacity .12s ease;
  }
  .firefly-cursor::before,
  .firefly-cursor::after{
    content:"";position:absolute;top:50%;width:9px;height:6px;
    border:1px solid rgba(255,255,255,.78);border-radius:70% 30% 65% 35%;
    filter:drop-shadow(0 0 3px rgba(255,255,255,.35));
  }
  .firefly-cursor::before{right:5px;transform:translateY(-50%) rotate(-24deg)}
  .firefly-cursor::after{left:5px;transform:translateY(-50%) scaleX(-1) rotate(-24deg)}
  .firefly-trail{
    width:6px;height:6px;border-radius:50%;
    background:#c8ff00;
    box-shadow:0 0 10px rgba(200,255,0,.8),0 0 22px rgba(200,255,0,.42);
    transform:translate(-50%,-50%);
    animation:fireflyFade .62s ease-out forwards;
  }
  html[data-theme="dark"] .firefly-cursor.is-visible{opacity:1}
}
@keyframes fireflyFade{
  0%{opacity:.72;transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(.15)}
}
@media(prefers-reduced-motion:reduce){
  .firefly-cursor,.firefly-trail{display:none!important}
  html[data-theme="dark"] body.firefly-enabled{cursor:auto!important}
}
/* NETLIFY_PRODUCTION_V109 */


/* ===== V110 — Side menu Day/Night interactive top ===== */
@media(min-width:761px){
  body.home-page-v109 .side-nav{
    width:210px!important;
    min-height:610px!important;
    padding:250px 24px 30px!important;
    overflow:hidden!important;
    border-radius:24px!important;
  }

  body.home-page-v109 .side-nav::before{
    content:"";
    position:absolute;
    inset:0 0 auto 0;
    height:215px;
    background-image:url("../images/theme/side-menu-day.jpg");
    background-size:cover;
    background-position:center top;
    border-radius:24px 24px 0 0;
    transition:
      background-image .35s ease,
      filter .35s ease,
      opacity .35s ease,
      transform .45s cubic-bezier(.22,.61,.36,1);
    z-index:0;
  }

  html[data-theme="dark"] body.home-page-v109 .side-nav::before{
    background-image:url("../images/theme/side-menu-night.jpg");
  }

  body.home-page-v109 .side-nav.theme-preview-active::before{
    background-image:url("../images/theme/side-menu-night.jpg");
    transform:scale(1.015);
  }

  html[data-theme="dark"] body.home-page-v109 .side-nav.theme-preview-active::before{
    background-image:url("../images/theme/side-menu-day.jpg");
  }

  body.home-page-v109 .side-nav > *{
    position:relative;
    z-index:1;
  }

  /* Larger and more prominent switch */
  body.home-page-v109 .side-nav .theme-toggle{
    top:72px!important;
    width:92px!important;
    height:118px!important;
    border-radius:28px!important;
    background:rgba(250,249,246,.82)!important;
    box-shadow:
      0 18px 34px rgba(18,20,24,.16),
      inset 0 0 0 1px rgba(255,255,255,.50)!important;
    backdrop-filter:blur(10px) saturate(120%);
    -webkit-backdrop-filter:blur(10px) saturate(120%);
    transition:
      transform .28s cubic-bezier(.22,.61,.36,1),
      box-shadow .28s ease,
      background .28s ease!important;
  }

  body.home-page-v109 .side-nav .theme-toggle:hover{
    transform:translateX(50%) translateY(-4px) scale(1.035)!important;
    box-shadow:
      0 22px 42px rgba(18,20,24,.20),
      0 0 0 7px rgba(255,255,255,.22)!important;
  }

  body.home-page-v109 .side-nav .theme-wall-plate{
    width:54px!important;
    height:78px!important;
    border-radius:11px!important;
    border-width:3px!important;
  }

  body.home-page-v109 .side-nav .theme-wall-rocker{
    width:23px!important;
    height:46px!important;
    border-radius:6px!important;
    border-width:3px!important;
  }

  html[data-theme="dark"] body.home-page-v109 .side-nav .theme-toggle{
    background:rgba(23,25,29,.80)!important;
    box-shadow:
      0 18px 38px rgba(0,0,0,.34),
      0 0 34px rgba(200,255,0,.08)!important;
  }

  html[data-theme="dark"] body.home-page-v109 .side-nav .theme-toggle:hover{
    box-shadow:
      0 24px 44px rgba(0,0,0,.42),
      0 0 42px rgba(200,255,0,.14)!important;
  }
}

/* Keep the mobile version exactly in the compact floating-switch pattern */
@media(max-width:760px){
  body.home-page-v109 .side-nav::before{display:none!important}
}

/* NETLIFY_PRODUCTION_V110 */


/* ===== V111 — rebuilt interactive Theme Menu (no reference images) ===== */
@media(min-width:761px){
  body.home-page-v109 .side-nav{
    width:184px!important;
    min-height:458px!important;
    padding:198px 18px 22px!important;
    gap:5px!important;
    overflow:hidden!important;
    border-radius:28px!important;
    background:rgba(248,247,244,.93)!important;
    border:1px solid rgba(20,22,26,.09)!important;
    box-shadow:0 20px 54px rgba(18,20,24,.11)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }

  /* Disable the V110 image-based top completely. */
  body.home-page-v109 .side-nav::before{
    content:none!important;
    display:none!important;
    background:none!important;
  }

  /* Scene is a real UI component, reconstructed with CSS. */
  body.home-page-v109 .theme-scene{
    position:absolute!important;
    z-index:0!important;
    top:0!important;
    left:0!important;
    width:100%!important;
    height:166px!important;
    overflow:hidden!important;
    border-radius:27px 27px 38px 38px!important;
    background:
      radial-gradient(circle at 79% 24%, rgba(255,255,255,.78) 0 8%, transparent 24%),
      linear-gradient(180deg,#8fdcf7 0%,#cfeefa 50%,#f2eee7 100%)!important;
    transition:background .48s ease,filter .48s ease!important;
  }
  body.home-page-v109 .theme-scene::before{
    content:""!important;
    position:absolute!important;
    right:20px!important;
    top:17px!important;
    width:48px!important;
    height:48px!important;
    border-radius:50%!important;
    background:radial-gradient(circle at 37% 34%,#fff9b6 0 17%,#ffd54a 45%,#ff8b2b 74%)!important;
    box-shadow:0 0 22px rgba(255,181,48,.46),0 0 46px rgba(255,213,74,.24)!important;
    transition:all .48s cubic-bezier(.22,.61,.36,1)!important;
  }
  body.home-page-v109 .theme-scene::after{
    content:""!important;
    position:absolute!important;
    left:-12%!important;
    right:-12%!important;
    bottom:-43px!important;
    height:97px!important;
    border-radius:50% 50% 0 0!important;
    background:linear-gradient(180deg,rgba(255,255,255,.88),#f7f5f1)!important;
    box-shadow:0 -12px 28px rgba(255,255,255,.24)!important;
    transition:background .48s ease!important;
  }

  /* Decorative stars only become visible in night preview/state. */
  body.home-page-v109 .theme-scene-stars{
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    opacity:0!important;
    transition:opacity .36s ease!important;
    background-image:
      radial-gradient(circle at 18% 24%,rgba(255,255,255,.92) 0 1.2px,transparent 1.7px),
      radial-gradient(circle at 33% 43%,rgba(255,255,255,.72) 0 1px,transparent 1.5px),
      radial-gradient(circle at 60% 20%,rgba(255,255,255,.80) 0 1px,transparent 1.5px),
      radial-gradient(circle at 76% 52%,rgba(255,255,255,.86) 0 1.3px,transparent 1.8px),
      radial-gradient(circle at 48% 61%,rgba(255,255,255,.62) 0 1px,transparent 1.5px)!important;
  }

  /* Actual dark state. */
  html[data-theme="dark"] body.home-page-v109 .theme-scene{
    background:
      radial-gradient(circle at 79% 22%,rgba(115,198,255,.12) 0 9%,transparent 28%),
      linear-gradient(180deg,#033b53 0%,#082c3d 48%,#17191d 100%)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .theme-scene::before{
    width:45px!important;
    height:45px!important;
    background:#f5f5ef!important;
    box-shadow:0 0 22px rgba(245,245,239,.42),0 0 52px rgba(160,214,255,.14)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .theme-scene::after{
    background:linear-gradient(180deg,rgba(32,35,40,.82),#17191d)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .theme-scene-stars{opacity:1!important}

  /* Hovering only the switch previews the opposite environment, without changing theme. */
  body.home-page-v109 .side-nav.theme-preview-active .theme-scene{
    background:
      radial-gradient(circle at 79% 22%,rgba(115,198,255,.12) 0 9%,transparent 28%),
      linear-gradient(180deg,#033b53 0%,#082c3d 48%,#17191d 100%)!important;
  }
  body.home-page-v109 .side-nav.theme-preview-active .theme-scene::before{
    width:45px!important;
    height:45px!important;
    background:#f5f5ef!important;
    box-shadow:0 0 22px rgba(245,245,239,.42),0 0 52px rgba(160,214,255,.14)!important;
  }
  body.home-page-v109 .side-nav.theme-preview-active .theme-scene::after{
    background:linear-gradient(180deg,rgba(32,35,40,.82),#17191d)!important;
  }
  body.home-page-v109 .side-nav.theme-preview-active .theme-scene-stars{opacity:1!important}

  html[data-theme="dark"] body.home-page-v109 .side-nav.theme-preview-active .theme-scene{
    background:
      radial-gradient(circle at 79% 24%,rgba(255,255,255,.78) 0 8%,transparent 24%),
      linear-gradient(180deg,#8fdcf7 0%,#cfeefa 50%,#f2eee7 100%)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .side-nav.theme-preview-active .theme-scene::before{
    width:48px!important;
    height:48px!important;
    background:radial-gradient(circle at 37% 34%,#fff9b6 0 17%,#ffd54a 45%,#ff8b2b 74%)!important;
    box-shadow:0 0 22px rgba(255,181,48,.46),0 0 46px rgba(255,213,74,.24)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .side-nav.theme-preview-active .theme-scene::after{
    background:linear-gradient(180deg,rgba(255,255,255,.88),#f7f5f1)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .side-nav.theme-preview-active .theme-scene-stars{opacity:0!important}

  /* Switch is integrated into and overlaps the scene; no duplicated background card. */
  body.home-page-v109 .side-nav .theme-toggle{
    position:absolute!important;
    z-index:3!important;
    top:92px!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    width:100px!important;
    height:112px!important;
    border-radius:30px!important;
    background:rgba(250,249,246,.94)!important;
    border:1px solid rgba(20,22,26,.12)!important;
    box-shadow:0 18px 34px rgba(18,20,24,.18),inset 0 0 0 1px rgba(255,255,255,.65)!important;
    transition:transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s ease,background .28s ease!important;
  }
  body.home-page-v109 .side-nav .theme-toggle:hover{
    transform:translateX(-50%) translateY(-4px) scale(1.045)!important;
    box-shadow:0 24px 42px rgba(18,20,24,.23),0 0 0 7px rgba(255,255,255,.22)!important;
  }
  body.home-page-v109 .side-nav .theme-wall-plate{
    width:58px!important;height:78px!important;border-radius:12px!important;border-width:4px!important;
  }
  body.home-page-v109 .side-nav .theme-wall-rocker{
    width:25px!important;height:47px!important;border-radius:7px!important;border-width:4px!important;
  }
  html[data-theme="dark"] body.home-page-v109 .side-nav{
    background:rgba(23,25,29,.95)!important;
    border-color:rgba(255,255,255,.08)!important;
    box-shadow:0 22px 60px rgba(0,0,0,.34)!important;
  }
  html[data-theme="dark"] body.home-page-v109 .side-nav .theme-toggle{
    background:rgba(27,30,35,.94)!important;
  }

  /* Navigation spacing rebuilt for the new component. */
  body.home-page-v109 .side-nav a{
    width:100%!important;
    min-height:38px!important;
    padding:0 31px 0 12px!important;
    font-size:12px!important;
  }
}

/* Mobile retains the V109 floating switch + header hamburger arrangement. */
@media(max-width:760px){
  .theme-scene{display:none!important}
}
/* NETLIFY_PRODUCTION_V111 */


/* ===== V112 — Side menu spacing / single-line navigation ===== */
@media(min-width:761px){
  body.home-page-v109 .side-nav{
    width:170px!important;
    min-height:438px!important;
    padding:188px 14px 20px!important;
  }

  /* Move switch upward so it clears the first navigation item. */
  body.home-page-v109 .side-nav .theme-toggle{
    top:72px!important;
    width:92px!important;
    height:104px!important;
  }

  body.home-page-v109 .side-nav .theme-wall-plate{
    width:53px!important;
    height:72px!important;
  }

  body.home-page-v109 .side-nav .theme-wall-rocker{
    width:23px!important;
    height:43px!important;
  }

  /* Keep navigation labels on a single line, as in the previous menu. */
  body.home-page-v109 .side-nav a{
    width:100%!important;
    min-height:38px!important;
    padding:0 9px!important;
    font-size:11px!important;
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    line-height:1.15!important;
  }
}
/* NETLIFY_PRODUCTION_V112 */


/* ===== V113 — Side navigation active state ===== */
@media(min-width:761px){
  /* Remove the old horizontal marker entirely. */
  body.home-page-v109 .side-nav a::before,
  body.home-page-v109 .side-nav a::after,
  body.home-page-v109 .side-nav a.active::before,
  body.home-page-v109 .side-nav a.active::after,
  body.home-page-v109 .side-nav a[aria-current="page"]::before,
  body.home-page-v109 .side-nav a[aria-current="page"]::after{
    content:none!important;
    display:none!important;
  }

  /* Neutral navigation state. */
  body.home-page-v109 .side-nav a{
    font-weight:600!important;
    opacity:.62!important;
    transform:none!important;
    text-decoration:none!important;
  }

  /* Current section: text-only emphasis. */
  body.home-page-v109 .side-nav a.active,
  body.home-page-v109 .side-nav a.is-active,
  body.home-page-v109 .side-nav a[aria-current="page"],
  body.home-page-v109 .side-nav a[aria-current="true"]{
    font-weight:800!important;
    opacity:1!important;
    transform:scale(1.035)!important;
  }
}
/* NETLIFY_PRODUCTION_V113 */


/* ===== V114 — preserve nav colors + restore scroll tracking + mobile hamburger header ===== */
@media(min-width:761px){
  /* Keep inactive items at the same visual strength they had before V113. */
  body.home-page-v109 .side-nav a{
    opacity:1!important;
    color:inherit!important;
    font-weight:600!important;
  }

  /* Active state remains text-only, without marker. */
  body.home-page-v109 .side-nav a.active,
  body.home-page-v109 .side-nav a.is-active,
  body.home-page-v109 .side-nav a[aria-current="true"]{
    opacity:1!important;
    font-weight:800!important;
    transform:none!important;
  }
}

/* Mobile: force hamburger into the header beside language controls. */
@media(max-width:760px){
  .mobile-menu-button{
    position:fixed!important;
    top:10px!important;
    right:12px!important;
    bottom:auto!important;
    left:auto!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    border-radius:50%!important;
    z-index:2147483647!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
  }

  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:70px!important;
    bottom:auto!important;
    left:auto!important;
    z-index:2147483646!important;
  }
}
/* NETLIFY_PRODUCTION_V114 */

/* NETLIFY_PRODUCTION_V115 */


/* ===== V116 — mobile header placement final override ===== */
@media(max-width:760px){
  .mobile-header{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    height:66px!important;
    z-index:2147483644!important;
  }

  .mobile-header .mobile-menu-button,
  .mobile-menu-button{
    position:absolute!important;
    top:10px!important;
    right:12px!important;
    bottom:auto!important;
    left:auto!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483647!important;
  }

  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:70px!important;
    bottom:auto!important;
    left:auto!important;
    z-index:2147483646!important;
  }

  .theme-toggle{
    position:fixed!important;
    top:auto!important;
    right:16px!important;
    bottom:18px!important;
    left:auto!important;
    z-index:2147483645!important;
  }
}
/* NETLIFY_PRODUCTION_V116 */


/* ===== V117 — mobile header: language selector beside hamburger ===== */
@media(max-width:760px){
  .mobile-header{
    display:flex!important;
    align-items:center!important;
  }

  /* Reserve the far-right slot exclusively for the hamburger. */
  .mobile-header .mobile-menu-button,
  .mobile-menu-button{
    position:absolute!important;
    top:10px!important;
    right:12px!important;
    left:auto!important;
    bottom:auto!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483647!important;
  }

  /* Language control sits immediately to its left with a safe gap. */
  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:70px!important;
    left:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:calc(100vw - 150px)!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483646!important;
  }
}

@media(max-width:390px){
  .mobile-header .mobile-menu-button,
  .mobile-menu-button{
    right:8px!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    max-width:44px!important;
  }

  .lang-switch-opt{
    right:60px!important;
    max-width:calc(100vw - 128px)!important;
  }
}
/* NETLIFY_PRODUCTION_V117 */


/* ===== V118 — definitive mobile header layout ===== */
@media(max-width:760px){
  /* Header becomes the positioning context for both controls. */
  .mobile-header,
  header{
    position:relative!important;
  }

  /* Hamburger occupies the far-right slot. */
  .mobile-header .mobile-menu-button,
  header .mobile-menu-button,
  .mobile-menu-button{
    position:absolute!important;
    top:10px!important;
    right:12px!important;
    bottom:auto!important;
    left:auto!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    margin:0!important;
    transform:none!important;
    z-index:30!important;
  }

  /* Language selector is anchored by JS immediately to the left of the hamburger. */
  .lang-switch-opt{
    position:absolute!important;
    top:10px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:29!important;
    max-width:none!important;
  }
}

@media(max-width:390px){
  .mobile-header .mobile-menu-button,
  header .mobile-menu-button,
  .mobile-menu-button{
    right:8px!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    max-width:44px!important;
  }
}
/* NETLIFY_PRODUCTION_V118 */


/* ===== V119 — mobile hamburger beside FM logo + CV theme locked ===== */
@media(max-width:760px){
  /* Keep the language selector alone on the far right. */
  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:14px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483646!important;
  }

  /* Hamburger now lives beside the FM logo on the left side of the header. */
  .mobile-header .mobile-menu-button,
  header .mobile-menu-button,
  .mobile-menu-button{
    position:absolute!important;
    top:10px!important;
    left:78px!important;
    right:auto!important;
    bottom:auto!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483647!important;
  }
}

@media(max-width:390px){
  .mobile-header .mobile-menu-button,
  header .mobile-menu-button,
  .mobile-menu-button{
    left:70px!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    max-width:44px!important;
  }

  .lang-switch-opt{
    right:8px!important;
  }
}

/* CV pages inherit the previously chosen theme, but never expose a theme control. */
body.cv-theme-locked .theme-toggle,
body.cv-theme-locked [data-theme-toggle],
body.cv-theme-locked .theme-switch,
body.cv-theme-locked .dark-mode-toggle{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
/* NETLIFY_PRODUCTION_V119 */


/* ===== V120 — Mobile tag navigation replacing hamburger ===== */
@media(max-width:760px){
  .mobile-menu-button{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:14px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483646!important;
  }

  .mobile-section-tags{
    position:sticky;
    top:66px;
    z-index:90;
    display:flex;
    gap:8px;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    padding:10px 14px 12px;
    background:rgba(248,247,244,.94);
    border-top:1px solid rgba(20,22,26,.06);
    border-bottom:1px solid rgba(20,22,26,.08);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    scrollbar-width:none;
    scroll-snap-type:x proximity;
  }
  .mobile-section-tags::-webkit-scrollbar{display:none}

  .mobile-section-tags a{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid rgba(20,22,26,.12);
    background:rgba(255,255,255,.88);
    color:#5f646d;
    text-decoration:none;
    font-size:13px;
    font-weight:650;
    white-space:nowrap;
    scroll-snap-align:center;
    transition:background .22s ease,color .22s ease,border-color .22s ease,transform .22s ease,box-shadow .22s ease;
  }

  .mobile-section-tags a:active{transform:scale(.97)}

  .mobile-section-tags a.active,
  .mobile-section-tags a.is-active,
  .mobile-section-tags a[aria-current="true"]{
    background:#15171b;
    color:#fff;
    border-color:#15171b;
    font-weight:800;
    box-shadow:0 6px 16px rgba(21,23,27,.16);
  }

  html[data-theme="dark"] .mobile-section-tags{
    background:rgba(18,20,24,.94);
    border-color:rgba(255,255,255,.08);
  }

  html[data-theme="dark"] .mobile-section-tags a{
    background:rgba(255,255,255,.05);
    color:rgba(255,255,255,.72);
    border-color:rgba(255,255,255,.12);
  }

  html[data-theme="dark"] .mobile-section-tags a.active,
  html[data-theme="dark"] .mobile-section-tags a.is-active,
  html[data-theme="dark"] .mobile-section-tags a[aria-current="true"]{
    background:#fff;
    color:#15171b;
    border-color:#fff;
  }
}
@media(min-width:761px){
  .mobile-section-tags{display:none!important}
}
/* NETLIFY_PRODUCTION_V120 */


/* ===== V121 — keep desktop side menu above project/media layers ===== */
@media(min-width:761px){
  body.home-page-v109 .side-nav{
    z-index:120!important;
    isolation:isolate!important;
  }

  /* Ensure the sticky/fixed sidebar remains in the foreground on shorter screens. */
  body.home-page-v109 .side-nav,
  body.home-page-v109 .side-nav *{
    backface-visibility:hidden;
  }

  /* Project/media layers must not overtake the navigation while scrolling. */
  body.home-page-v109 main,
  body.home-page-v109 main section,
  body.home-page-v109 .project-card,
  body.home-page-v109 .project-media,
  body.home-page-v109 .case-card,
  body.home-page-v109 .case-media,
  body.home-page-v109 img,
  body.home-page-v109 picture{
    z-index:auto;
  }
}

/* Extra protection for shorter desktop/laptop viewports. */
@media(min-width:761px) and (max-height:760px){
  body.home-page-v109 .side-nav{
    z-index:200!important;
  }
}
/* NETLIFY_PRODUCTION_V121 */


/* ===== V122 — hero media must render immediately ===== */
/* The first-fold video poster is intentionally excluded from scroll-reveal hiding.
   This avoids a blank hero while JS/IntersectionObserver initializes on mobile. */
.hero-photo-shell,
.hero-photo-shell.reveal,
.hero-photo-shell.scroll-reveal,
.hero-photo-shell[data-reveal],
.hero-photo-shell .reveal,
.hero-photo-shell .scroll-reveal{
  opacity:1!important;
  visibility:visible!important;
}

.hero-photo-shell,
.hero-photo-shell.reveal,
.hero-photo-shell.scroll-reveal,
.hero-photo-shell[data-reveal]{
  transform:none!important;
  transition:none!important;
}

.hero-photo-shell img{
  opacity:1!important;
  visibility:visible!important;
}
/* NETLIFY_PRODUCTION_V122 */


/* ===== V123 — definitive side-nav stacking fix ===== */
/* Legacy Home CSS enables the desktop side navigation from 701px,
   therefore the stacking protection must start at the same breakpoint. */
@media (min-width:701px){
  body.home-page-v109 .side-nav{
    position:fixed!important;
    z-index:2147483000!important;
    isolation:isolate!important;
    transform:translateY(-50%) translateZ(0)!important;
    -webkit-transform:translateY(-50%) translateZ(0)!important;
    will-change:transform!important;
  }

  /* Keep the menu itself in a compositor layer above transformed/revealed media. */
  body.home-page-v109 .side-nav::before,
  body.home-page-v109 .side-nav::after,
  body.home-page-v109 .side-nav > *{
    position:relative;
    z-index:2!important;
  }

  body.home-page-v109 .side-nav .theme-scene{
    position:absolute!important;
    z-index:1!important;
  }
}
/* NETLIFY_PRODUCTION_V123 */


/* ===== V124 — actual sidebar layer fix ===== */
/* Previous fixes were scoped to body.home-page-v109, but the current Home body
   has no such class. Target the real sidebar directly. */
@media (min-width:761px){
  .side-nav{
    position:fixed!important;
    left:28px!important;
    right:auto!important;
    top:50%!important;
    z-index:2147483640!important;
    transform:translate3d(0,-50%,0)!important;
    -webkit-transform:translate3d(0,-50%,0)!important;
    isolation:isolate!important;
    contain:layout paint!important;
    will-change:transform!important;
  }

  /* Explicitly keep all sidebar UI above its own decorative scene. */
  .side-nav > a,
  .side-nav > button,
  .side-nav .theme-toggle{
    position:relative!important;
    z-index:5!important;
  }
  .side-nav .theme-scene{
    z-index:1!important;
  }
}

/* Mobile uses the tag navigation only. */
@media (max-width:760px){
  .side-nav{display:none!important}
}
/* NETLIFY_PRODUCTION_V124 */


/* ===== V125 — sidebar detached from clipped hero stacking context ===== */
/* The sidebar originally lives inside .intro-hero, which uses overflow:hidden.
   JS now reparents .side-nav directly under <body>, so it is no longer clipped
   or composited behind project images while the hero scrolls away. */
@media (min-width:761px){
  body > .side-nav{
    position:fixed!important;
    left:auto!important;
    right:18px!important;
    top:50%!important;
    bottom:auto!important;
    z-index:2147483640!important;
    transform:translate3d(0,-50%,0)!important;
    -webkit-transform:translate3d(0,-50%,0)!important;
    isolation:isolate!important;
    contain:layout paint!important;
    will-change:transform!important;
  }
}
@media (max-width:760px){
  body > .side-nav{display:none!important}
}
/* NETLIFY_PRODUCTION_V125 */


/* ===== V126 — stable PT/EN selector across responsive resizing ===== */
/* One language selector stays in the DOM. Its layout is controlled only by CSS,
   so desktop -> mobile -> desktop resizing cannot leave it hidden/off-screen. */
.lang-switch-opt{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}

/* Desktop: restore normal desktop positioning and clear mobile geometry. */
@media (min-width:761px){
  .lang-switch-opt{
    position:absolute!important;
    top:24px!important;
    right:28px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483641!important;
  }
}

/* Mobile: same DOM element, only CSS changes its position. */
@media (max-width:760px){
  .lang-switch-opt{
    position:fixed!important;
    top:10px!important;
    right:14px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483646!important;
  }
}

@media (max-width:390px){
  .lang-switch-opt{
    right:8px!important;
  }
}
/* NETLIFY_PRODUCTION_V126 */