/* TR Software: typography, live code and a clear developer identity. */
html { background: #070a08; }
body { margin: 0; }
button,a,summary { touch-action: manipulation; }
.site-header { position: fixed; inset: 0 0 auto; background: transparent; backdrop-filter: none; border-color: #a4e4bd18; transition: background .35s,backdrop-filter .35s; }
.site-header.past-intro { background: color-mix(in srgb,var(--bg) 90%,transparent); backdrop-filter: blur(18px); }
.site-header:not(.past-intro) { --text: #f3f7f2; --muted: #c6cec7; --muted-2: #a3b1a5; --line: #92bd9d28; }
.site-header:not(.past-intro) .brand-logo { border-color: #94d8a035; background: #080d0a; }
.tr-cinema { position: relative; height: 240svh; color: #eff6ed; background: #070a08; }
.tr-cinema-view { position: sticky; top: 0; height: 100svh; min-height: 650px; overflow: hidden; isolation: isolate; background: #050a07; }
.tr-matrix-stage,.tr-matrix-shade { position: absolute; inset: 0; pointer-events: none; }
.tr-matrix-canvas { width: 100%; height: 100%; display: block; }
.tr-matrix-fallback { position: absolute; top: 36%; right: 8%; color: #6cf7a1; opacity: .7; font: 500 clamp(130px,20vw,340px)/1 'DM Mono',monospace; letter-spacing: -.12em; }
.tr-matrix-stage.is-ready .tr-matrix-fallback { display: none; }
.tr-matrix-shade { background: linear-gradient(90deg,#050a07df 0%,#050a07c7 25%,#050a0770 45%,transparent 66%),linear-gradient(0deg,#070a08 0%,transparent 22%,transparent 77%,#050a07b8); }
.tr-film-act { position: absolute; z-index: 4; inset: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 100px max(48px,calc((100% - 1320px)/2)) 100px; pointer-events: none; will-change: opacity,transform; }
.tr-film-kicker { font: 400 12px/1.6 'DM Mono',monospace; letter-spacing: .035em; color: #b9c8bc; }
.tr-film-kicker span { margin: 0 8px; color: #57bb76; }
.tr-film-act h1 { margin: 28px 0 0; font: 600 clamp(76px,8.3vw,139px)/.98 'Manrope',sans-serif; letter-spacing: -.067em; text-wrap: nowrap; }
.tr-film-act h1 em { font-style: normal; color: #baff55; }
.tr-film-act p { margin: 31px 0 0; font-size: 16px; line-height: 1.8; color: #b5c2b9; letter-spacing: -.01em; }
.tr-film-act p strong { font-weight: 500; color: #ecf4e9; }
.tr-film-link { display: inline-flex; align-items: center; justify-content: center; pointer-events: auto; min-height: 50px; padding: 0 24px; margin-top: 29px; background: #baff55; color: #102009; border: 1px solid #baff55; border-radius: 4px; font-size: 14px; font-weight: 650; transition: background .25s,box-shadow .25s; }
.tr-film-link:hover { background: #d0ff8e; box-shadow: 0 0 35px #baff551b; }
.tr-film-destination { opacity: 0; }
.tr-film-destination h2 { margin: 28px 0 0; font: 550 clamp(58px,5.5vw,94px)/1.07 'Manrope',sans-serif; letter-spacing: -.063em; text-wrap: nowrap; }
.tr-film-destination h2 em { font-style: normal; color: #baff55; }
.tr-code-window { position: absolute; z-index: 3; top: 50%; left: 56%; width: min(560px,40vw); border: 1px solid #79dc9640; border-radius: 10px; background: #07130ff2; box-shadow: 0 35px 130px #000b,0 0 80px #60e9970b; opacity: 0; transform: translateY(-50%); pointer-events: none; will-change: transform,opacity; }
.tr-code-tab { display: flex; justify-content: space-between; padding: 19px 24px; border-bottom: 1px solid #78ce8f24; background: #17291b66; color: #d8e8dc; font: 400 12px/1.3 'DM Mono',monospace; }
.tr-code-tab span:last-child { color: #778e80; }
.tr-code-content { padding: 27px 20px; font: 400 clamp(11px,.95vw,15px)/2.05 'DM Mono',monospace; color: #c9e2d3; }
.tr-code-line { display: flex; white-space: pre; }
.tr-code-line b { width: 40px; flex: 0 0 40px; color: #3c5d48; font-weight: 400; user-select: none; }
.tr-code-line i { font-style: normal; color: #648a72; }
.tr-code-line .kw { color: #8be3ab; }
.tr-code-line .str { color: #c5ec98; }
.tr-code-line .punct { color: #dde6d8; }
.tr-code-foot { display: flex; justify-content: space-between; padding: 15px 24px; border-top: 1px solid #79ce8f20; font: 400 11px/1.5 'DM Mono',monospace; color: #9db0a3; }
.tr-code-foot span { font-family: 'Manrope',sans-serif; }
.tr-cinema-footer { position: absolute; z-index: 5; bottom: 35px; left: max(48px,calc((100% - 1320px)/2)); right: max(48px,calc((100% - 1320px)/2)); display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #becdc0; }
.tr-scroll-cue { padding: 0; display: inline-flex; align-items: center; gap: 15px; background: none; border: none; color: inherit; font: 400 14px 'Manrope',sans-serif; cursor: pointer; min-height: 44px; }
.tr-scroll-line { height: 30px; width: 1px; background: linear-gradient(0deg,#baff55,#baff5520); }
.tr-film-caption { font: 400 12px 'DM Mono',monospace; letter-spacing: .045em; color: #839a88; }
.tr-film-caption i { font-style: normal; margin: 0 12px; color: #416947; }
.tr-film-controls { display: flex; align-items: center; gap: 27px; }
.tr-motion-toggle,.tr-skip-intro { min-height: 44px; display: inline-flex; align-items: center; padding: 0; border: none; background: none; color: #b6c8bb; font: 400 14px 'Manrope',sans-serif; cursor: pointer; }
.tr-motion-toggle:hover,.tr-skip-intro:hover { color: #e4ffd8; }
.tr-film-progress { position: absolute; bottom: 0; left: 0; right: 0; z-index: 6; height: 1px; background: #ffffff10; }
.tr-film-progress i { display: block; height: 100%; width: 100%; transform: scaleX(0); transform-origin: left; background: #baff55; }
.tr-cinema.is-visible .tr-film-act[data-act='0'] h1 { animation: tr-arrive .95s cubic-bezier(.2,.65,.2,1) both; }
.tr-cinema.is-visible .tr-film-act[data-act='0'] p,.tr-cinema.is-visible .tr-film-act[data-act='0'] .tr-film-link { animation: tr-arrive 1.05s .12s both; }
@keyframes tr-arrive { from { opacity: 0; transform: translateY(25px); filter: blur(7px); } to { opacity: 1; transform: translateY(0); filter: blur(0); } }
.tr-cinema + .trai-home-section { margin-top: 36px; }
.trai-home-section { scroll-margin-top: 110px; }
.trai-home-section .trai-home-copy p { font-size: 16px; }
.reviews-proof { margin-bottom: 0; }
a:focus-visible,button:focus-visible { outline: 2px solid #baff55; outline-offset: 6px; }
@media(max-width:1100px) { .tr-film-act { padding-inline: 32px; } .tr-cinema-footer { left: 32px; right: 32px; } .tr-film-caption { display: none; } .tr-film-kicker { font-size: 12px; max-width: 320px; } .tr-code-content { padding-inline: 12px; } .tr-code-line b { width: 29px; flex-basis: 29px; } }
@media(max-width:700px) {
  .tr-cinema { height: 225svh; }
  .tr-cinema-view { min-height: 620px; }
  .tr-film-act { justify-content: flex-start; padding: 132px 24px 80px; }
  .tr-film-kicker { font-size: 12px; max-width: 290px; line-height: 1.7; letter-spacing: .005em; }
  .tr-film-kicker span { margin: 0 4px; }
  .tr-film-act h1 { font-size: clamp(57px,15.5vw,96px); margin-top: 22px; letter-spacing: -.065em; }
  .tr-film-act p { font-size: 16px; margin-top: 23px; max-width: 340px; line-height: 1.6; }
  .tr-film-link { margin-top: 23px; min-height: 46px; padding-inline: 20px; }
  .tr-matrix-shade { background: linear-gradient(0deg,#070a08 0%,#050a0710 22%,#050a0750 43%,#050a07d9 60%,#050a07b0 100%); }
  .tr-matrix-fallback { top: 62%; left: 20%; right: auto; font-size: 150px; }
  .tr-film-destination { padding-top: 132px; }
  .tr-film-destination h2 { font-size: clamp(43px,11.6vw,67px); line-height: 1.08; margin-top: 21px; }
  .tr-film-destination p { max-width: 310px; }
  .tr-film-destination p br { display: none; }
  .tr-code-window { left: 24px; right: 24px; top: auto; bottom: 107px; width: auto; border-radius: 7px; }
  .tr-code-tab { padding: 10px 14px; font-size: 11px; }
  .tr-code-content { padding: 12px 14px; font-size: 9px; line-height: 1.8; }
  .tr-code-line b { width: 23px; flex-basis: 23px; }
  .tr-code-foot { padding: 10px 14px; font-size: 9px; }
  .tr-code-foot span { font-size: 10px; }
  .tr-cinema-footer { left: 24px; right: 24px; bottom: 24px; gap: 10px; }
  .tr-scroll-cue { gap: 10px; font-size: 12px; }
  .tr-film-controls { gap: 17px; }
  .tr-motion-toggle,.tr-skip-intro { font-size: 12px; }
  .tr-cinema + .trai-home-section { margin-top: 20px; }
  .trai-home-section .trai-home-copy p { font-size: 15px; }
  .site-header:not(.past-intro) .main-nav.is-open { background: #0a110c; }
}
@media(max-height:760px) and (max-width:700px) { .tr-film-act { padding-top: 105px; } .tr-film-destination h2 { font-size: 41px; margin-top: 14px; } .tr-film-destination p { margin-top: 16px; } .tr-film-destination .tr-film-link { margin-top: 15px; } .tr-code-window { bottom: 78px; } .tr-code-content { padding-block: 8px; line-height: 1.55; } }
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .tr-cinema { height: 100svh; min-height: 620px; }
  .tr-cinema-view { position: relative; height: 100%; min-height: 620px; }
  .tr-film-destination,.tr-code-window,.tr-film-progress,.tr-motion-toggle { display: none; }
  .tr-cinema.is-visible .tr-film-act[data-act='0'] > * { animation: none; }
  .tr-film-link,.site-header { transition: none; }
}

@media(max-height:760px) and (max-width:700px) { .tr-code-content > .tr-code-line:nth-child(2),.tr-code-content > .tr-code-line:nth-child(9),.tr-code-foot { display: none; } }

/* Original opening copy and every original action, inside a deeper code scene. */
.tr-cinema { height: 255svh; }
.tr-cinema-view { min-height: 740px; }
.tr-film-act.tr-original-copy { padding-top: 110px; padding-bottom: 100px; }
.tr-original-copy .availability { margin: 14px 0 0; color: #b7ceba; font-size: 12px; line-height: 1.5; letter-spacing: .03em; text-transform: none; }
.tr-original-copy .availability > span { width: 6px; height: 6px; flex: 0 0 6px; }
.tr-film-act.tr-original-copy h1 { margin-top: 22px; font-size: clamp(62px,5.9vw,96px); line-height: .98; letter-spacing: -.061em; }
.tr-film-act.tr-original-copy .hero-lead { max-width: min(570px,45vw); font-size: 17px; line-height: 1.65; margin-top: 25px; color: #b4c4b9; }
.tr-film-act.tr-original-copy .hero-lead strong { color: #eef8ef; font-weight: 600; }
.tr-original-copy .hero-actions { display: grid; grid-template-columns: 1.05fr 1fr; width: min(560px,45vw); gap: 10px; margin-top: 27px; pointer-events: auto; }
.tr-original-copy .hero-actions .btn { min-height: 49px; font-size: 14px; padding: 10px 16px; border-radius: 5px; line-height: 1.4; }
.tr-original-copy .hero-actions .btn-primary { color: #102009; background: #baff55; }
.tr-original-copy .hero-actions .btn-secondary { color: #edf5e9; border-color: #92c69755; background: #0a1c137a; backdrop-filter: blur(6px); }
.tr-original-copy .hero-actions .btn-secondary:hover { background: #183a238c; border-color: #a7ee936b; }
.tr-original-copy .hero-actions .btn-whatsapp { color: #bff6cf; border-color: #64e88c59; background: #0e391d99; backdrop-filter: blur(6px); }
.tr-original-copy .hero-actions .btn-whatsapp:hover { color: #062410; background: #78f59f; }
.tr-original-copy .hero-proof { width: min(560px,45vw); gap: 20px; margin-top: 25px; padding-top: 17px; border-top: 1px solid #7cc89124; }
.tr-original-copy .hero-proof div { display: grid; grid-template-columns: 1fr; gap: 4px; }
.tr-original-copy .hero-proof strong { color: #dfeee0; font-size: 14px; font-weight: 650; }
.tr-original-copy .hero-proof span { color: #9baf9f; font-size: 12px; line-height: 1.4; }
.tr-matrix-shade { background: linear-gradient(90deg,#030805ed 0%,#030805d4 27%,#0308057a 46%,transparent 64%),linear-gradient(0deg,#070a08 0%,transparent 19%,transparent 79%,#050a07a8); }
.site-header .nav-wrap { min-height: 82px; gap: 20px; }
.site-header .main-nav { gap: clamp(15px,1.45vw,23px); }
.site-header .main-nav a { white-space: nowrap; font-size: 13px; }
.site-header .main-nav .nav-private { display: block; font-size: 11px; }
@media(min-width:701px) and (max-height:830px) {
  .tr-film-act.tr-original-copy { padding-top: 100px; padding-bottom: 83px; }
  .tr-film-act.tr-original-copy h1 { font-size: clamp(56px,5.1vw,73px); margin-top: 16px; }
  .tr-original-copy .availability { margin-top: 9px; }
  .tr-film-act.tr-original-copy .hero-lead { font-size: 16px; margin-top: 18px; line-height: 1.55; }
  .tr-original-copy .hero-actions { margin-top: 20px; }
  .tr-original-copy .hero-actions .btn { min-height: 45px; }
  .tr-original-copy .hero-proof { margin-top: 19px; padding-top: 12px; }
  .tr-cinema-footer { bottom: 23px; }
}
@media(max-width:1199px) {
  .site-header .nav-wrap { min-height: 72px; }
  .site-header .nav-toggle { order: 3; width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: transparent; }
  .site-header .nav-toggle span { grid-area: 1/1; width: 16px; height: 1px; background: var(--text); transition: transform .25s ease; }
  .site-header .nav-toggle span:first-child { transform: translateY(-3px); }
  .site-header .nav-toggle span:last-child { transform: translateY(3px); }
  .site-header .nav-toggle.is-open span:first-child { transform: rotate(45deg); }
  .site-header .nav-toggle.is-open span:last-child { transform: rotate(-45deg); }
  .site-header .main-nav { position: absolute; top: 72px; right: 0; left: 0; display: none; padding: 18px 24px 24px; border-bottom: 1px solid var(--line); background: var(--bg); }
  .site-header .main-nav.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 2px; max-height: calc(100svh - 72px); overflow-y: auto; }
  .site-header:not(.past-intro) .main-nav.is-open { background: #09130d; }
  .site-header .main-nav a,.site-header .main-nav .nav-private { display: block; padding: 10px 8px; font-size: 15px; }
  .site-header .main-nav a::after { display: none; }
  .site-header .nav-actions { margin-left: auto; }
}
@media(max-width:700px) {
  .tr-cinema { height: auto; }
  .tr-cinema-view { position: relative; height: auto; min-height: 0; }
  .tr-film-act.tr-original-copy { position: relative; padding: 112px 24px 345px; opacity: 1!important; transform: none!important; }
  .tr-film-act.tr-original-copy h1 { font-size: clamp(51px,14vw,83px); margin-top: 22px; line-height: .99; }
  .tr-original-copy .availability { margin-top: 13px; font-size: 12px; }
  .tr-film-act.tr-original-copy .hero-lead { max-width: 100%; margin-top: 24px; font-size: 16px; line-height: 1.65; }
  .tr-original-copy .hero-actions { width: 100%; grid-template-columns: 1fr 1fr; margin-top: 25px; gap: 9px; }
  .tr-original-copy .hero-actions .btn { width: 100%; min-height: 56px; padding: 10px; font-size: 13px; gap: 6px; }
  .tr-original-copy .hero-actions .btn span { font-size: 14px; }
  .tr-original-copy .hero-proof { width: 100%; margin-top: 25px; padding-top: 19px; grid-template-columns: 1fr; gap: 11px; }
  .tr-original-copy .hero-proof div { grid-template-columns: 116px 1fr; gap: 10px; align-items: baseline; }
  .tr-original-copy .hero-proof span { font-size: 12px; }
  .tr-film-destination,.tr-code-window { display: none; }
  .tr-matrix-shade { background: linear-gradient(0deg,#070a08 0%,transparent 20%,#050a07b8 35%,#050a07d6 100%); }
  .tr-cinema-footer { bottom: 25px; }
  .site-header .nav-wrap { gap: 8px; }
  .site-header .nav-actions { gap: 7px; }
  .site-header .nav-actions .theme-toggle { display: grid; width: 30px; height: 32px; flex: 0 0 30px; }
  .site-header .brand { gap: 7px; }
  .site-header .brand-logo { width: 32px; height: 32px; }
  .site-header .brand .brand-copy strong { font-size: 11px; }
  .site-header .brand .brand-copy small { display: none; }
  .site-header .nav-toggle { width: 34px; height: 34px; flex: 0 0 34px; }
  .site-header .nav-actions .btn { min-height: 35px; padding-inline: 10px; font-size: 11px; }
}
@media(prefers-reduced-motion:reduce) {
  .tr-original-copy .availability > span { animation: none; }
  .tr-cinema { height: auto; }
  .tr-cinema-view { position: relative; height: auto; min-height: 740px; }
  .tr-film-act.tr-original-copy { position: relative; }
}
@media(max-width:700px) and (prefers-reduced-motion:reduce) { .tr-cinema-view { min-height: 0; } }

.tr-cinema.is-paused .availability > span { animation-play-state: paused; }
