/* Explorador de Produtos — efeito pré-3D sem alterar posição, tamanho ou geometria da peça */
@media (min-width:768px){
  body.home .tpe-stage{
    --tpe-depth-shadow:rgba(18,18,18,.20);
    --tpe-depth-shadow-soft:rgba(18,18,18,.08);
    --tpe-depth-x:0px;
    --tpe-depth-y:18px;
    --tpe-depth-soft-x:0px;
    --tpe-depth-soft-y:30px;
    --tpe-light-x:50%;
    --tpe-light-y:42%;
    --tpe-shadow-shift-x:0px;
    --tpe-turn-x:0deg;
    --tpe-turn-y:0deg;
  }

  /* Halo traseiro: cria separação do fundo e sensação de volume. */
  body.home .tpe-stage::before{
    content:'';
    position:absolute;
    z-index:0;
    left:50%;
    top:50%;
    width:58%;
    height:58%;
    transform:translate(-50%,-46%);
    border-radius:50%;
    background:radial-gradient(circle at var(--tpe-light-x) var(--tpe-light-y),rgba(255,255,255,.22) 0%,var(--tpe-depth-shadow-soft) 26%,rgba(18,18,18,.035) 48%,transparent 74%);
    filter:blur(24px);
    opacity:.64;
    pointer-events:none;
    transition:opacity .2s ease;
  }

  /* Sombra de contato: reage à posição do cursor, mas a peça permanece centrada. */
  body.home .tpe-stage::after{
    content:'';
    position:absolute;
    z-index:0;
    left:50%;
    bottom:8%;
    width:44%;
    height:7%;
    border-radius:50%;
    background:radial-gradient(ellipse,var(--tpe-depth-shadow) 0%,rgba(18,18,18,.09) 42%,transparent 74%);
    filter:blur(16px);
    opacity:.50;
    transform:translateX(calc(-50% + var(--tpe-shadow-shift-x)));
    pointer-events:none;
    transition:transform .16s ease-out,opacity .18s ease;
  }

  body.home .tpe-image-wrap{
    z-index:2!important;
    isolation:isolate;
    perspective:1200px;
  }

  /* Brilho metálico móvel. É apenas luz, não desloca nem redimensiona a imagem. */
  body.home .tpe-image-wrap::before{
    content:'';
    position:absolute;
    z-index:5;
    inset:8% 10%;
    border-radius:36%;
    background:
      radial-gradient(circle at var(--tpe-light-x) var(--tpe-light-y),rgba(255,255,255,.34) 0%,rgba(255,255,255,.13) 12%,rgba(255,255,255,0) 35%),
      linear-gradient(118deg,transparent 30%,rgba(255,255,255,.08) 48%,transparent 64%);
    mix-blend-mode:soft-light;
    opacity:.24;
    filter:blur(7px);
    pointer-events:none;
    transition:opacity .18s ease;
  }

  /* Profundidade principal: sombras + um início de giro quase imperceptível. */
  body.home .tpe-image-wrap img{
    position:relative!important;
    z-index:2!important;
    transform-style:preserve-3d!important;
    backface-visibility:hidden!important;
    transform-origin:50% 52%!important;
    filter:
      saturate(1.025)
      contrast(1.018)
      drop-shadow(var(--tpe-depth-x) var(--tpe-depth-y) 14px rgba(0,0,0,.14))
      drop-shadow(var(--tpe-depth-soft-x) var(--tpe-depth-soft-y) 30px rgba(0,0,0,.10))!important;
    transition:transform .18s cubic-bezier(.22,.61,.36,1),filter .14s ease-out,opacity .18s ease!important;
    will-change:transform,filter!important;
  }

  body.home .tpe-image-wrap.is-pre3d-active::before{opacity:.34}
  body.home .tpe-image-wrap.is-pre3d-active img{
    filter:
      saturate(1.04)
      contrast(1.025)
      drop-shadow(var(--tpe-depth-x) var(--tpe-depth-y) 16px rgba(0,0,0,.18))
      drop-shadow(var(--tpe-depth-soft-x) var(--tpe-depth-soft-y) 34px rgba(0,0,0,.13))!important;
  }

  html[data-bs-theme="dark"] body.home .tpe-stage{
    --tpe-depth-shadow:rgba(0,0,0,.62);
    --tpe-depth-shadow-soft:rgba(0,0,0,.30);
  }
  html[data-bs-theme="dark"] body.home .tpe-stage::before{opacity:.74}
  html[data-bs-theme="dark"] body.home .tpe-stage::after{opacity:.62}
  html[data-bs-theme="dark"] body.home .tpe-image-wrap::before{
    mix-blend-mode:screen;
    opacity:.13;
  }
  html[data-bs-theme="dark"] body.home .tpe-image-wrap.is-pre3d-active::before{opacity:.20}
  html[data-bs-theme="dark"] body.home .tpe-image-wrap img{
    filter:
      brightness(1.015)
      saturate(1.035)
      contrast(1.025)
      drop-shadow(var(--tpe-depth-x) var(--tpe-depth-y) 16px rgba(0,0,0,.38))
      drop-shadow(var(--tpe-depth-soft-x) var(--tpe-depth-soft-y) 34px rgba(0,0,0,.30))!important;
  }
  html[data-bs-theme="dark"] body.home .tpe-image-wrap.is-pre3d-active img{
    filter:
      brightness(1.035)
      saturate(1.05)
      contrast(1.03)
      drop-shadow(var(--tpe-depth-x) var(--tpe-depth-y) 18px rgba(0,0,0,.45))
      drop-shadow(var(--tpe-depth-soft-x) var(--tpe-depth-soft-y) 38px rgba(0,0,0,.36))!important;
  }

  @media (prefers-reduced-motion:reduce){
    body.home .tpe-stage::after,
    body.home .tpe-image-wrap::before,
    body.home .tpe-image-wrap img{transition:none!important}
  }
}

/*
 * Modo escuro: devolve o hover/seleção suave que existe no modo claro.
 * Somente estados visuais dos chips do Explorador. Nenhum layout é alterado.
 */
html[data-bs-theme="dark"] body.home .tpe-line-tab:hover{
  background:rgba(239,123,48,.075)!important;
  color:#ff9854!important;
}
html[data-bs-theme="dark"] body.home .tpe-line-tab.is-active{
  background:rgba(239,123,48,.11)!important;
  color:#ff9854!important;
  box-shadow:inset 0 0 0 1px rgba(239,123,48,.10),0 6px 18px rgba(0,0,0,.14)!important;
}
html[data-bs-theme="dark"] body.home .tpe-option:hover{
  background:rgba(239,123,48,.075)!important;
  border-color:rgba(239,123,48,.42)!important;
  color:#ff9854!important;
}
html[data-bs-theme="dark"] body.home .tpe-option.is-active{
  background:rgba(239,123,48,.11)!important;
  border-color:rgba(239,123,48,.62)!important;
  color:#ff9854!important;
  box-shadow:inset 0 0 0 1px rgba(239,123,48,.055),0 5px 14px rgba(0,0,0,.10)!important;
}