.elementor-625 .elementor-element.elementor-element-c33ebda{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:90px;--padding-bottom:90px;--padding-left:32px;--padding-right:32px;}.elementor-625 .elementor-element.elementor-element-c33ebda:not(.elementor-motion-effects-element-type-background), .elementor-625 .elementor-element.elementor-element-c33ebda > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );background-image:url("https://xdfpsoficial.com/wp-content/uploads/2026/03/DESKTOP-XP.webp");background-position:top center;background-repeat:no-repeat;background-size:cover;}.elementor-625 .elementor-element.elementor-element-4f3c134{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-625 .elementor-element.elementor-element-4f3c134.e-con{--align-self:center;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );color:var( --e-global-color-primary );}.elementor-625 .elementor-element.elementor-element-45c5d93{text-align:center;}.elementor-625 .elementor-element.elementor-element-45c5d93 .elementor-heading-title{font-family:"Big Shoulders Display", Sans-serif;font-size:3rem;font-weight:900;text-transform:uppercase;line-height:1em;letter-spacing:-0.01em;color:var( --e-global-color-text );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-625 .elementor-element.elementor-element-72f5eeb{text-align:center;font-family:var( --e-global-typography-8d74397-font-family ), Sans-serif;font-size:var( --e-global-typography-8d74397-font-size );font-weight:var( --e-global-typography-8d74397-font-weight );line-height:var( --e-global-typography-8d74397-line-height );letter-spacing:var( --e-global-typography-8d74397-letter-spacing );color:var( --e-global-color-bac444d );}.elementor-625 .elementor-element.elementor-element-72f5eeb p{margin-block-end:0px;}.elementor-625 .elementor-element.elementor-element-574baa5.elementor-element{--align-self:center;}.elementor-625 .elementor-element.elementor-element-c4b4dac{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-625 .elementor-element.elementor-element-03297da.elementor-element{--align-self:center;}.elementor-625 .elementor-element.elementor-element-9c7a4fd{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}body.elementor-page-625:not(.elementor-motion-effects-element-type-background), body.elementor-page-625 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}@media(max-width:1366px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-625 .elementor-element.elementor-element-72f5eeb{font-size:var( --e-global-typography-8d74397-font-size );line-height:var( --e-global-typography-8d74397-line-height );letter-spacing:var( --e-global-typography-8d74397-letter-spacing );}}@media(max-width:1024px){.elementor-625 .elementor-element.elementor-element-c33ebda{--padding-top:64px;--padding-bottom:64px;--padding-left:32px;--padding-right:32px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-625 .elementor-element.elementor-element-45c5d93 .elementor-heading-title{font-size:2.2rem;}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-625 .elementor-element.elementor-element-72f5eeb{font-size:var( --e-global-typography-8d74397-font-size );line-height:var( --e-global-typography-8d74397-line-height );letter-spacing:var( --e-global-typography-8d74397-letter-spacing );}}@media(max-width:767px){.elementor-625 .elementor-element.elementor-element-c33ebda:not(.elementor-motion-effects-element-type-background), .elementor-625 .elementor-element.elementor-element-c33ebda > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://xdfpsoficial.com/wp-content/uploads/2026/03/MOBILE-XP1.webp");}.elementor-625 .elementor-element.elementor-element-c33ebda{--gap:20px 0px;--row-gap:20px;--column-gap:0px;--padding-top:40px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-625 .elementor-element.elementor-element-4f3c134{--gap:16px 0px;--row-gap:16px;--column-gap:0px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-625 .elementor-element.elementor-element-45c5d93{width:var( --container-widget-width, 340px );max-width:340px;--container-widget-width:340px;--container-widget-flex-grow:0;}.elementor-625 .elementor-element.elementor-element-45c5d93.elementor-element{--align-self:center;}.elementor-625 .elementor-element.elementor-element-45c5d93 .elementor-heading-title{font-size:30px;}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-625 .elementor-element.elementor-element-72f5eeb{width:var( --container-widget-width, 300px );max-width:300px;--container-widget-width:300px;--container-widget-flex-grow:0;font-size:var( --e-global-typography-8d74397-font-size );line-height:var( --e-global-typography-8d74397-line-height );letter-spacing:var( --e-global-typography-8d74397-letter-spacing );}.elementor-625 .elementor-element.elementor-element-72f5eeb.elementor-element{--align-self:center;}}@media(min-width:768px){.elementor-625 .elementor-element.elementor-element-4f3c134{--width:66%;}}/* Start custom CSS for heading, class: .elementor-element-45c5d93 */.azul-highlight{
    
    color: #1a6dff;
}

.elementor-625 .elementor-element.elementor-element-45c5d93{
    
    text-wrap: balance;
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-72f5eeb */.elementor-625 .elementor-element.elementor-element-72f5eeb{
    
    text-wrap: balance;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-574baa5 */.color-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #00C700;
  color: #f2f6ff;
  padding: 16px 40px;
  font-family: 'Big Shoulders Display', sans-serif;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: box-shadow .25s, transform .18s;
  box-shadow: 0 0 40px rgba(26,109,255,.25), 0 4px 20px rgba(26,109,255,.12);
}

.xd-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 60px rgba(26,109,255,.5), 0 8px 36px rgba(26,109,255,.22);
  color: white;
}

.xd-btn::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.11), transparent);
  transition: left .5s;
}

.xd-btn:hover::before { left: 100%; }

.xd-btn-arrow {
  transition: transform .2s;
}

.xd-btn:hover .xd-btn-arrow {
  transform: translateX(4px);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2324189 *//* ═══════════════════════════════════════════════════
   XD FPS — S5 PERFORMANCE PANEL
   Estrutura: .s5-wrap > .s5-col (vídeo + painel)
═══════════════════════════════════════════════════ */

/* ── WRAPPER GERAL ── */
.s5-wrap {
  display: grid;
  grid-template-columns: 1fr 80px 1fr;
  align-items: start;
  max-width: 1280px;
  margin: 0 auto;
  width: 100%;
}

/* ── COLUNA ── */
.s5-col {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ── VÍDEO ── */
.s5-vid-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 0 16px;
}

.s5-vid-label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: 'Big Shoulders Display', sans-serif;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(242,246,255,.82);
  text-shadow: 0 0 18px rgba(0,0,0,.9);
}

.s5-vid-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.s5-vid-dot--red   { background: #ff4444; box-shadow: 0 0 8px rgba(255,68,68,.8); }
.s5-vid-dot--green { background: #22e56a; box-shadow: 0 0 8px rgba(34,229,106,.8); }

@media (max-width: 600px) {
  .s5-vid-label { font-size: 13px; }
}

.s5-vid-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 2px;
  border: 1px solid rgba(255,255,255,.06);
}

.s5-vid-wrap--before .s5-vid-frame {
  border-color: rgba(255,68,68,.2);
  box-shadow: 0 0 20px rgba(255,68,68,.08);
}
.s5-vid-wrap--after .s5-vid-frame {
  border-color: rgba(34,229,106,.2);
  box-shadow: 0 0 20px rgba(34,229,106,.08);
}

.s5-vid-frame video {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}

/* badge FPS no vídeo */
.s5-vid-fps {
  position: absolute;
  bottom: 10px; right: 10px;
  display: flex;
  align-items: baseline;
  gap: 3px;
  background: rgba(3,5,8,.75);
  border: 1px solid rgba(255,255,255,.08);
  padding: 5px 9px;
  backdrop-filter: blur(6px);
  border-radius: 2px;
  z-index: 4; /* acima do canvas overlay (z-index 2) e do glitch (z-index 2) */
  pointer-events: none;
}
.s5-vid-fps-num {
  font-family: 'Big Shoulders Display', sans-serif;
  font-weight: 900;
  font-size: 22px;
  line-height: 1;
}
.s5-vid-fps-lbl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; font-weight: 700;
  letter-spacing: .14em;
  opacity: .5;
}
.s5-vid-fps--bad  .s5-vid-fps-num { color: #ff4444; text-shadow: 0 0 10px rgba(255,68,68,.4); }
.s5-vid-fps--good .s5-vid-fps-num { color: #22e56a; text-shadow: 0 0 10px rgba(34,229,106,.4); }

/* scanline */
.s5-vid-scanline {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.12) 50%, transparent);
  pointer-events: none;
  opacity: 0;
  animation: s5-scan 4s linear infinite;
}
.s5-vid-wrap--before .s5-vid-scanline { animation-delay: 0s; }
.s5-vid-wrap--after  .s5-vid-scanline { animation-delay: 2s; }
@keyframes s5-scan {
  0%   { top: 0%;   opacity: 0; }
  5%   { opacity: 1; }
  95%  { opacity: 1; }
  100% { top: 100%; opacity: 0; }
}

/* glitch no "antes" */
#s5VidBefore {
  filter: blur(0.6px) saturate(.6) contrast(1.05);
  transform: scale(1.04);
  image-rendering: pixelated;
}
.s5-vid-glitch {
  position: absolute; inset: 0;
  pointer-events: none; z-index: 2;
  background: repeating-linear-gradient(
    0deg,
    transparent, transparent 2px,
    rgba(0,0,0,.22) 2px, rgba(0,0,0,.22) 3px
  );
  animation: s5-glitch-flicker 4s steps(1) infinite;
}
@keyframes s5-glitch-flicker {
  0%,100% { opacity: 1;   transform: translateX(0); }
  8%      { opacity: .55; transform: translateX(-3px); }
  9%      { opacity: 1;   transform: translateX(0); }
  32%     { opacity: .7;  transform: translateX(2px); }
  33%     { opacity: 1;   transform: translateX(0); }
  57%     { opacity: .5;  transform: translateX(-2px) scaleY(1.01); }
  58%     { opacity: 1;   transform: translateX(0); }
  74%     { opacity: .8;  transform: translateX(1px); }
  75%     { opacity: 1;   transform: translateX(0); }
}

/* ── PAINEL ── */
.s5-panel {
  background: #070b10;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.s5-panel::after {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(
    0deg,
    rgba(0,0,0,.022) 0px, rgba(0,0,0,.022) 1px,
    transparent 1px, transparent 5px
  );
  pointer-events: none; z-index: 0;
}
.s5-panel > * { position: relative; z-index: 1; }

.s5-panel--before {
  border: 1px solid rgba(255,255,255,.06);
  border-top: 2px solid rgba(255,51,51,.3);
  border-right: none;
}
.s5-panel--after {
  border: 1px solid rgba(255,255,255,.06);
  border-top: 2px solid rgba(0,200,100,.3);
  border-left: none;
}

/* topo */
.s5-panel-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 28px;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.s5-status { display: flex; align-items: center; gap: 9px; }
.s5-status-dot {
  width: 6px; height: 6px;
  border-radius: 50%; flex-shrink: 0;
}
.s5-panel--before .s5-status-dot {
  background: #ff3333;
  box-shadow: 0 0 7px rgba(255,51,51,.6);
  animation: s5-blink 1.2s ease-in-out infinite;
}
.s5-panel--after .s5-status-dot {
  background: #00c864;
  box-shadow: 0 0 7px rgba(0,200,100,.6);
}
@keyframes s5-blink {
  0%,100% { opacity: 1; }
  50%     { opacity: .2; }
}
.s5-status-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase;
}
.s5-panel--before .s5-status-text { color: rgba(255,80,80,.65); }
.s5-panel--after  .s5-status-text { color: rgba(0,200,100,.65); }
.s5-sys-id {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.12);
}

/* gráfico */
.s5-chart-section {
  padding: 16px 28px 14px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  display: flex; flex-direction: column; gap: 10px;
}
.s5-chart-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.s5-chart-key {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,255,255,.2);
}
.s5-chart-live {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .1em; font-weight: 500;
  transition: color .3s;
}
.s5-chart-canvas {
  display: block; width: 100%; height: 100px;
}

/* número FPS */
.s5-fps-block {
  padding: 24px 28px 20px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  display: flex; align-items: flex-end; gap: 12px;
}
.s5-fps-num {
  font-family: 'Big Shoulders Display', sans-serif;
  font-weight: 900; font-size: 88px;
  line-height: .88; letter-spacing: -.02em;
  transition: color .5s;
}
.s5-panel--before .s5-fps-num { color: #ff3333; }
.s5-panel--after  .s5-fps-num { color: #00c864; }
.s5-fps-stack {
  padding-bottom: 7px;
  display: flex; flex-direction: column; gap: 4px;
}
.s5-fps-unit {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.25);
}
.s5-fps-sub {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.12);
}

/* telemetria */
.s5-telem {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.s5-telem-cell {
  padding: 16px 28px;
  display: flex; flex-direction: column; gap: 6px;
}
.s5-telem-cell:first-child { border-right: 1px solid rgba(255,255,255,.05); }
.s5-telem-key {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,255,255,.22);
}
.s5-telem-val {
  font-family: 'JetBrains Mono', monospace;
  font-size: 28px; font-weight: 700;
  line-height: 1; letter-spacing: .02em;
  transition: color .4s;
}
.s5-panel--before .s5-telem-val { color: rgba(255,80,80,.85); }
.s5-panel--after  .s5-telem-val { color: rgba(0,200,100,.85); }
.s5-telem-unit {
  font-size: 12px; font-weight: 400;
  opacity: .35; margin-left: 2px;
}

/* barras */
.s5-bars {
  padding: 20px 28px;
  display: flex; flex-direction: column; gap: 16px;
}
.s5-bar-row { display: flex; flex-direction: column; gap: 6px; }
.s5-bar-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.s5-bar-name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.22);
}
.s5-bar-pct {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .1em; font-weight: 500;
  transition: color .4s;
}
.s5-panel--before .s5-bar-pct { color: rgba(255,80,80,.65); }
.s5-panel--after  .s5-bar-pct { color: rgba(0,200,100,.65); }
.s5-bar-track {
  height: 2px;
  background: rgba(255,255,255,.06);
  position: relative; overflow: hidden;
}
.s5-bar-fill {
  height: 100%;
  position: absolute; left: 0; top: 0;
  width: 0%;
  transition: width 1.1s cubic-bezier(0.22, 1, 0.36, 1);
  border-radius: 0 2px 2px 0;
}
.s5-panel--before .s5-bar-fill { background: rgba(255,60,60,.55); }
.s5-panel--after  .s5-bar-fill { background: rgba(0,200,100,.55); }

/* ── DIVISOR CENTRAL ── */
.s5-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 32px; /* alinha com o painel, abaixo dos vídeos */
}
.s5-div-line {
  flex: 1; width: 1px;
  background: linear-gradient(180deg,
    transparent,
    rgba(26,109,255,.15) 30%,
    rgba(26,109,255,.22) 50%,
    rgba(26,109,255,.15) 70%,
    transparent
  );
}
.s5-div-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; font-weight: 700;
  letter-spacing: .28em; text-transform: uppercase;
  color: rgba(26,109,255,.35);
  white-space: nowrap;
  padding: 0 12px;
}

/* ── MOBILE ── */
@media (max-width: 768px) {
  .s5-wrap {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* divisor vira horizontal */
  .s5-divider {
    flex-direction: row;
    padding: 0;
    height: 24px;
  }
  .s5-div-line {
    flex: 1; width: auto; height: 1px;
    background: linear-gradient(90deg,
      transparent,
      rgba(26,109,255,.22) 30%,
      rgba(26,109,255,.22) 70%,
      transparent
    );
  }

  /* remove bordas que assumem vizinhos lado a lado */
  .s5-panel--before {
    border-right: 1px solid rgba(255,255,255,.06);
    border-top: 2px solid rgba(255,51,51,.3);
  }
  .s5-panel--after {
    border-left: 1px solid rgba(255,255,255,.06);
    border-top: 2px solid rgba(0,200,100,.3);
  }

  .s5-fps-num  { font-size: 64px; }
  .s5-telem-val { font-size: 22px; }
  .s5-panel-top { padding: 14px 18px; }
  .s5-fps-block { padding: 18px 18px 16px; }
  .s5-telem-cell { padding: 14px 18px; }
  .s5-bars      { padding: 16px 18px; }
  .s5-chart-section { padding: 14px 18px 12px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-03297da */.color-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #00C700;
  color: #f2f6ff;
  padding: 16px 40px;
  font-family: 'Big Shoulders Display', sans-serif;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: box-shadow .25s, transform .18s;
  box-shadow: 0 0 40px rgba(26,109,255,.25), 0 4px 20px rgba(26,109,255,.12);
}

.xd-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 60px rgba(26,109,255,.5), 0 8px 36px rgba(26,109,255,.22);
  color: white;
}

.xd-btn::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.11), transparent);
  transition: left .5s;
}

.xd-btn:hover::before { left: 100%; }

.xd-btn-arrow {
  transition: transform .2s;
}

.xd-btn:hover .xd-btn-arrow {
  transform: translateX(4px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c33ebda */.elementor-625 .elementor-element.elementor-element-c33ebda {
  background:
    radial-gradient(ellipse 60% 50% at 20% 50%, rgba(26,109,255,.06) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 80% 50%, rgba(26,109,255,.04) 0%, transparent 70%),
    #030508;
}/* End custom CSS */