/* Torres Eco Solar — experiência cinematográfica com foto v2 */
.hero.tph-hero.tsm-hero {
  --tsm-scale: 1.035; --tsm-x: 0px; --tsm-y: 0px;
  --tsm-light-x: -18vw; --tsm-light-opacity: .24;
  --tsm-content-y: 0px; --tsm-case-y: 0px; --tsm-case-scale: 1;
  --tsm-energy: 0; --tsm-focus: 0; --tsm-progress: 0;
  position: relative !important; display: block !important;
  height: 244svh !important; min-height: 0 !important;
  padding: 0 !important; overflow: visible !important;
  isolation: isolate; background: #020d16;
}
.tsm-stage {
  position: sticky; top: 88px; width: 100%;
  height: calc(100svh - 88px); min-height: 620px;
  display: flex; align-items: center; overflow: clip;
  isolation: isolate; background: #020d16;
}
.tsm-stage .tph-hero__image {
  z-index: 0 !important; transform-origin: 57% 53%;
  transform: translate3d(var(--tsm-x), var(--tsm-y), 0) scale(var(--tsm-scale)) !important;
  backface-visibility: hidden;
  filter: saturate(1.05) contrast(1.06) brightness(.93);
}
.tsm-hero.is-motion-active .tph-hero__image,
.tsm-hero.is-motion-active .tph-content,
.tsm-hero.is-motion-active .tph-case,
.tsm-hero.is-motion-active .tsm-light { will-change: transform; }
.tsm-stage .tph-hero__veil {
  z-index: 1 !important;
  background:
    linear-gradient(90deg, rgba(1,10,17,.97) 0%, rgba(1,10,17,.79) 34%, rgba(1,10,17,.25) 68%, rgba(1,10,17,.13) 100%),
    linear-gradient(180deg, rgba(1,10,17,.08), rgba(1,10,17,.38)) !important;
}
.tsm-stage .tph-hero__glow {
  z-index: 2 !important; opacity: var(--tsm-light-opacity);
  background: radial-gradient(circle at 58% 72%, rgba(255,176,0,.40), transparent 29%) !important;
  transform: translate3d(var(--tsm-light-x), 0, 0);
}
.tsm-depth,.tsm-light,.tsm-focus,.tsm-energy-map,.tsm-vignette {
  position: absolute; pointer-events: none;
}
.tsm-depth {
  inset: 0; z-index: 2; opacity: calc(.06 + var(--tsm-focus) * .12);
  background-image: linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: linear-gradient(90deg,transparent 0%,#000 48%,#000 100%);
  mask-image: linear-gradient(90deg,transparent 0%,#000 48%,#000 100%);
  transform: perspective(900px) rotateX(64deg) translate3d(0,35%,0) scale(1.28);
  transform-origin: 50% 100%;
}
.tsm-light {
  inset: 0; z-index: 3; opacity: var(--tsm-light-opacity);
  background: radial-gradient(circle at 50% 70%,rgba(255,195,55,.36),rgba(255,176,0,.08) 24%,transparent 50%);
  transform: translate3d(var(--tsm-light-x),0,0); mix-blend-mode: screen;
}
.tsm-vignette {
  inset: 0; z-index: 3;
  box-shadow: inset 0 0 150px rgba(0,0,0,.42),inset 0 -120px 120px rgba(1,10,17,.30);
}
.tsm-energy-map {
  inset: 0; z-index: 3; width: 100%; height: 100%;
  opacity: calc(var(--tsm-focus) * .88);
  filter: drop-shadow(0 0 7px rgba(255,176,0,.65));
}
.tsm-energy-map path {
  fill: none; stroke: #ffc447; stroke-width: .28;
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--tsm-energy));
}
.tsm-energy-map circle {
  fill: #fff4cc; opacity: var(--tsm-focus);
  filter: drop-shadow(0 0 5px #ffb000);
}
.tsm-focus {
  left: 31%; top: 31%; z-index: 3; width: 39%; height: 47%;
  opacity: var(--tsm-focus);
  border: 1px solid rgba(255,190,49,.56);
  background:
    linear-gradient(90deg,#ffb000 0 28px,transparent 28px) 0 0/62px 2px no-repeat,
    linear-gradient(#ffb000 0 28px,transparent 28px) 0 0/2px 62px no-repeat,
    linear-gradient(270deg,#ffb000 0 28px,transparent 28px) 100% 0/62px 2px no-repeat,
    linear-gradient(#ffb000 0 28px,transparent 28px) 100% 0/2px 62px no-repeat,
    linear-gradient(90deg,#ffb000 0 28px,transparent 28px) 0 100%/62px 2px no-repeat,
    linear-gradient(0deg,#ffb000 0 28px,transparent 28px) 0 100%/2px 62px no-repeat,
    linear-gradient(270deg,#ffb000 0 28px,transparent 28px) 100% 100%/62px 2px no-repeat,
    linear-gradient(0deg,#ffb000 0 28px,transparent 28px) 100% 100%/2px 62px no-repeat;
  box-shadow: inset 0 0 60px rgba(255,176,0,.08),0 0 40px rgba(255,176,0,.08);
  transform: scale(calc(.96 + var(--tsm-focus) * .04));
}
.tsm-stage .tph-shell { position: relative; z-index: 5 !important; }
.tsm-stage .tph-content { transform: translate3d(0,var(--tsm-content-y),0); }
.tsm-stage .tph-case {
  transform: translate3d(0,var(--tsm-case-y),0) scale(var(--tsm-case-scale));
  transform-origin: 100% 50%;
  border-color: rgba(255,194,55,calc(.24 + var(--tsm-focus) * .42)) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.30),0 0 42px rgba(255,176,0,calc(var(--tsm-focus) * .10));
}
.tsm-chapters {
  position: absolute; top: 28px;
  right: max(32px,calc((100vw - 1440px)/2 + 32px));
  z-index: 6; width: min(330px,24vw); pointer-events: none;
}
.tsm-chapter {
  position: absolute; top: 0; right: 0; width: 100%; padding: 14px 18px;
  display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center;
  opacity: 0; transform: translate3d(0,12px,0);
  border-top: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.72);
  transition: opacity .28s ease,transform .38s cubic-bezier(.2,.8,.2,1);
}
.tsm-chapter.is-active { opacity: 1; transform: none; }
.tsm-chapter>span { color: #ffb000; font-size: .72rem; font-weight: 900; letter-spacing: .12em; }
.tsm-chapter strong { display: block; color: #fff; font-size: .92rem; letter-spacing: -.01em; }
.tsm-chapter small { display: block; margin-top: 2px; font-size: .75rem; line-height: 1.35; }
.tsm-storyline {
  position: absolute; left: 50%; bottom: 24px; z-index: 6;
  width: min(720px,calc(100% - 96px)); transform: translateX(-50%);
  pointer-events: none;
}
.tsm-storyline__track {
  position: absolute; left: 0; right: 0; top: 5px; height: 1px;
  background: rgba(255,255,255,.20);
}
.tsm-storyline__fill {
  display: block; width: 100%; height: 2px;
  transform: scaleX(var(--tsm-progress)); transform-origin: 0 50%;
  background: linear-gradient(90deg,#ffb000,#ffe29a);
  box-shadow: 0 0 18px rgba(255,176,0,.42);
}
.tsm-storyline__steps { position: relative; display: grid; grid-template-columns: repeat(3,1fr); }
.tsm-step { color: rgba(255,255,255,.46); font-size: .67rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.tsm-step:nth-child(2) { text-align: center; }
.tsm-step:nth-child(3) { text-align: right; }
.tsm-step::before {
  content: ''; display: block; width: 11px; height: 11px; margin-bottom: 10px;
  border: 2px solid rgba(255,255,255,.42); border-radius: 50%; background: #061722;
  transition: background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.tsm-step:nth-child(2)::before { margin-inline: auto; }
.tsm-step:nth-child(3)::before { margin-left: auto; }
.tsm-step.is-active { color: #fff; }
.tsm-step.is-active::before {
  border-color: #ffb000; background: #ffb000;
  box-shadow: 0 0 0 5px rgba(255,176,0,.14),0 0 18px rgba(255,176,0,.32);
}
@media (max-width:1100px) {
  .tsm-chapters { display: none; }
  .tsm-focus { left: 35%; width: 44%; }
}
@media (max-width:900px) {
  .hero.tph-hero.tsm-hero { height: auto !important; min-height: 0 !important; padding: 0 !important; overflow: hidden !important; }
  .tsm-stage { position: relative; top: auto; height: auto; min-height: calc(100svh - 74px); padding: 54px 0 34px; overflow: hidden; }
  .tsm-stage .tph-hero__image { transform-origin: 62% 45%; }
  .tsm-stage .tph-hero__veil { background: linear-gradient(90deg,rgba(2,12,20,.92),rgba(2,12,20,.50)),linear-gradient(180deg,rgba(2,12,20,.14),rgba(2,12,20,.80)) !important; }
  .tsm-depth { opacity: .06; background-size: 48px 48px; }
  .tsm-focus,.tsm-energy-map,.tsm-chapters,.tsm-storyline { display: none; }
}
@media (max-width:600px) {
  .hero.tph-hero.tsm-hero { padding: 0 !important; }
  .tsm-stage { padding: 46px 0 32px; }
}
@media (max-width:360px) { .tsm-stage { padding-top: 40px; } }
@media (prefers-reduced-motion:reduce) {
  .hero.tph-hero.tsm-hero { height: auto !important; overflow: hidden !important; }
  .tsm-stage { position: relative; top: auto; height: auto; min-height: calc(100svh - 88px); }
  .tsm-stage .tph-hero__image { transform: scale(1.035) !important; will-change: auto; }
  .tsm-stage .tph-content,.tsm-stage .tph-case,.tsm-stage .tph-hero__glow,.tsm-light { transform: none !important; will-change: auto; }
  .tsm-focus,.tsm-energy-map,.tsm-chapters,.tsm-storyline { display: none; }
}