/* APEXCYBER cyber theme — ADDITIVE override. Nothing in the original CSS is modified. */
:root{
  --color-blue:#e53e3e;        /* VERMELHO primário */
  --color-dark-blue:#991b1b;
  --color-green:#4ade80;       /* verde (ton) */
  --color-red:#ff6b6b;         /* vermelho claro */
  --color-purple:#a78bfa;      /* roxo (ton) */
  --color-error:#ff2f2f;
  --header-color:#e53e3e;
  --color-off-white:#faf6f6;
  --color-dark-white:#f2e6e6;
  --color-grey-blue:#2b0a0a;
}
/* glow tonal (color-only, paint-safe) */
#header-right-talk-btn-text,
#header-right-menu-btn-text{color:var(--color-white)}
.header-menu-link-inner:hover span,
.header-menu-link-text-clone{color:var(--color-blue)}
#end-section-title-link,
#home-goal-title{color:var(--color-white)}

/* ===== APEXCYBER preloader writing animation (additive) ===== */
#preloader-word{position:absolute;left:0;right:0;top:36%;display:flex;justify-content:center;align-items:center;
  gap:clamp(4px,1vw,14px);pointer-events:none;z-index:210;mix-blend-mode:screen}
#preloader-word span{font-family:Aeonik,Helvetica,Arial,sans-serif;font-weight:500;
  font-size:clamp(1.9rem,5.2vw,4.2rem);line-height:1;color:#fff;
  text-shadow:0 0 18px rgba(0,224,255,.65),0 0 60px rgba(0,224,255,.35);
  opacity:0;animation:pex-write .5s cubic-bezier(.22,.9,.26,1) forwards}
#preloader-word span:nth-child(1){animation-delay:.20s}
#preloader-word span:nth-child(2){animation-delay:.32s}
#preloader-word span:nth-child(3){animation-delay:.44s}
#preloader-word span:nth-child(4){animation-delay:.56s}
#preloader-word span:nth-child(5){animation-delay:.68s}
#preloader-word span:nth-child(6){animation-delay:.80s}
#preloader-word span:nth-child(7){animation-delay:.92s}
#preloader-word span:nth-child(8){animation-delay:1.04s}
#preloader-word span:nth-child(9){animation-delay:1.16s}
@keyframes pex-write{0%{opacity:0;transform:translateY(16px) scale(1.3);filter:blur(8px)}
  55%{opacity:1}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}

/* ===== APEXCYBER cyber typography (additive font overrides) ===== */
@font-face{font-family:'Orbitron';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/orbitron_500.woff2) format('woff2')}
@font-face{font-family:'Orbitron';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts-apx/orbitron_700.woff2) format('woff2')}
@font-face{font-family:'Orbitron';font-style:normal;font-weight:900;font-display:block;src:url(/assets/fonts-apx/orbitron_900.woff2) format('woff2')}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/rajdhani_500.woff2) format('woff2')}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:600;font-display:block;src:url(/assets/fonts-apx/rajdhani_600.woff2) format('woff2')}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts-apx/rajdhani_700.woff2) format('woff2')}
@font-face{font-family:'Share Tech Mono';font-style:normal;font-weight:400;font-display:block;src:url(/assets/fonts-apx/share_tech_mono_400.woff2) format('woff2')}

/* repoint original mono identities to the cyber mono */
@font-face{font-family:APXMono;font-style:normal;font-weight:400;font-display:block;src:url(/assets/fonts-apx/share_tech_mono_400.woff2) format('woff2')}
@font-face{font-family:IBMPlexMono;font-style:normal;font-weight:400;font-display:block;src:url(/assets/fonts-apx/share_tech_mono_400.woff2) format('woff2')}
@font-face{font-family:IBMPlexMono;font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/share_tech_mono_400.woff2) format('woff2')}

/* face cyber */
body{font-family:'Rajdhani',Aeonik,Helvetica,Arial,sans-serif;font-weight:500}
h1,h2,h3,h4,h5{font-family:'Orbitron','Rajdhani',sans-serif;font-weight:700;letter-spacing:.02em}
#home-reel-title-line-1,#home-reel-title-line-2,
#home-goal-tunnel-title .home-goal-tunnel-title-line,
#end-section-title-link,#end-section-subtitle-text,
.about-award-header-title{font-family:'Orbitron',sans-serif;font-weight:700}
.preloader-percent-digit-num,#preloader-word span{font-family:'Orbitron',sans-serif;font-weight:700}
.header-menu-link-inner,.header-menu-link-text,.header-menu-link-text-clone,
.project-item-line-1,.project-item-line-2-inner{font-family:'Rajdhani',sans-serif}

/* ===== thumbnails dos cards de agentes ===== */
.project-item-image{overflow:hidden}
.project-item-image-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* ===== remoção dos vídeos extras (mantém apenas o reel do astronauta) ===== */
/* overlay de vídeo reativado com demo ApexCyber */

/* ===== VERMELHO VISÍVEL — tema preto/vermelho/branco ===== */
.home-hero-scroll-container-cross:before,.home-hero-scroll-container-cross:after,
.home-reel-video-container-cross:before,.home-reel-video-container-cross:after,
.end-section-content-cross:before,.end-section-content-cross:after,
.about-cross:before,.about-cross:after,
.scroll-nav-cross:before,.scroll-nav-cross:after
{background:#e53e3e !important;border-color:#e53e3e !important}
#preloader-word span{text-shadow:0 0 18px rgba(229,62,62,.75),0 0 60px rgba(229,62,62,.4)}
#end-section,#footer-section,#page-extra-sections{background:#0b0202}
#home-reel-cta-dot,#home-featured-cta-dot{background:#e53e3e !important}
#scroll-nav-next-bar-inner{background-color:#4ade80}
.header-menu-link-inner:hover span,.header-menu-link-text-clone{color:#e53e3e}

/* ===== FUNDO TUDO PRETO (onde estiver branco) ===== */
html,body{background:#000 !important}
#home-reel-cta,#home-featured-cta,#header-center-project-back-btn,
#project-details-launch-cta,#project-details-launch-cta-mobile{background:#000 !important;color:#fff !important;border:1px solid #e53e3e}
#header-menu-links,#header-menu-newsletter,#header-menu-talk{background:#07070a !important}
#header-menu-links{color:#fff !important}
html.is-white-bg #end-section{color:#fff !important;background:#000 !important}
html.is-white-bg .end-section-content-cross:before,html.is-white-bg .end-section-content-cross:after{background:#e53e3e !important}
html.is-white-bg #end-section-title-top-decoration,html.is-white-bg #end-section-title-bottom-left-decoration,html.is-white-bg #end-section-title-bottom-right-decoration{background:#e53e3e !important}
#project-details-preview,#project-details-preview-inner{background:#000 !important}
#end-section-title-link,#end-section-subtitle-text{color:#fff !important}

/* ===== CORES DAS FONTES (preto/vermelho/branco + tons) ===== */
:root{--cross-size:clamp(1rem,1.5vw,2.6rem)}
#home-reel-title-line-1, #end-section-title-link, #home-hero-scroll,
#home-goal-tunnel-title, .preloader-percent-digit-num, #end-bottom-text,
#home-featured-title, #footer-bottom-copyright, #header-menu-labs-text,
#header-menu-labs-text-clone, #about-who-team-number
{color:#e53e3e !important}
#footer-bottom-up svg path{fill:#e53e3e !important}
#home-reel-cta-text, #home-featured-cta-text{color:#fff}
#footer-enquires-link, #footer-business-link{color:#e53e3e !important}
#footer-enquires-header, #footer-business-header{color:#fff}
.header-menu-link-text, .header-menu-link-text-clone{color:#e53e3e !important}
#scroll-nav-subtitle, #scroll-nav-text, #scroll-nav-next-text{color:#fff}

/* ===== TEMA VERMELHO EM TODAS AS PÁGINAS ===== */
#home-hero-title{color:#e53e3e !important}
#about-who-subsection-we-are{color:#e53e3e !important}
#projects-main-title{color:#e53e3e !important}
#page-container h2{color:#e53e3e !important}
.about-award-header-title{color:#e53e3e !important}
#about-clients-title{color:#e53e3e !important}
#home-goal-title{color:#e53e3e !important}
#home-reel-desc{color:#f1f1f1}

/* ===== SCROLL: fluidez — encurta o "túnel" 3D do #home-goal (menos rolagem) =====
   Build original: #home-goal{padding-bottom: calc(var(--vh) * 4200)} => ~42 telas de scroll só aqui.
   Reduzido para 1500 (túnel ~15 telas). Toda a coreografia (GoalSectionRanges) é proporcional,
   então o efeito permanece coerente — apenas conclui com muito menos rolagem. */
#home-goal{padding-bottom:calc(var(--vh,1vh) * 520) !important}

/* ===== REMOVE o vídeo/botão do reel (trava) e coloca animação cyber ===== */
#home-reel-video-container video, #home-reel-video{display:block !important;width:100%;height:100%;object-fit:cover}
#home-reel-video-watch-btn{pointer-events:none;background:transparent;border:none;overflow:visible}
#home-reel-video-watch-btn-background,#home-reel-video-watch-btn-base,#home-reel-video-watch-btn-svg{display:none !important}
#home-reel-video-watch-btn{width:130px;height:130px;border-radius:50%;border:2px solid #e53e3e;
  background:radial-gradient(circle,rgba(229,62,62,.25),rgba(229,62,62,.03));position:relative}
#home-reel-video-watch-btn::before{content:"";position:absolute;inset:-12px;border-radius:50%;
  border:2px solid rgba(229,62,62,.55);animation:apexRing 2.2s ease-out infinite}
#home-reel-video-watch-btn::after{content:"APEXCYBER";position:absolute;inset:0;display:flex;
  align-items:center;justify-content:center;color:#fff;font-family:'Orbitron',sans-serif;
  font-size:12px;font-weight:700;letter-spacing:3px;text-shadow:0 0 14px rgba(229,62,62,.8);animation:apexPulse 1.6s ease-in-out infinite}
@keyframes apexRing{0%{transform:scale(.75);opacity:1}100%{transform:scale(1.55);opacity:0}}
@keyframes apexPulse{0%,100%{opacity:1}50%{opacity:.45}}

/* ===== FONTES PROFISSIONAIS (Inter + Space Grotesk + JetBrains Mono) ===== */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:block;src:url(/assets/fonts-apx/inter_400.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/inter_500.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:block;src:url(/assets/fonts-apx/inter_600.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts-apx/inter_700.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/space_grotesk_500.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:600;font-display:block;src:url(/assets/fonts-apx/space_grotesk_600.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts-apx/space_grotesk_700.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:block;src:url(/assets/fonts-apx/jetbrains_mono_400.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts-apx/jetbrains_mono_500.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts-apx/jetbrains_mono_700.woff2) format('woff2')}

/* mono -> JetBrains Mono (repoint, última declaração vence) */
@font-face{font-family:APXMono;src:url(/assets/fonts-apx/jetbrains_mono_400.woff2) format('woff2')}
@font-face{font-family:IBMPlexMono;font-weight:400;src:url(/assets/fonts-apx/jetbrains_mono_400.woff2) format('woff2')}
@font-face{font-family:IBMPlexMono;font-weight:500;src:url(/assets/fonts-apx/jetbrains_mono_500.woff2) format('woff2')}

/* famílias de uso */
body{font-family:'Inter','Rajdhani',Aeonik,Helvetica,Arial,sans-serif;font-weight:400;letter-spacing:.01em;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,#home-reel-title-line-1,#home-reel-title-line-2,
#home-goal-title,#home-goal-tunnel-title .home-goal-tunnel-title-line,
#end-section-title-link,#end-section-subtitle-text,
.about-award-header-title,#about-who-team-name-text,
#about-clients-title,#projects-main-title,#home-hero-title
{font-family:'Space Grotesk','Orbitron',sans-serif;font-weight:600;letter-spacing:-.01em}
.header-menu-link-inner,.header-menu-link-text,.header-menu-link-text-clone{font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:.04em}
.project-item-line-2-inner,.project-item-line-1{font-family:'Space Grotesk',sans-serif;font-weight:600}
#home-reel-cta,#home-featured-cta,#header-center-project-back-btn,#project-details-launch-cta{font-family:'Inter',sans-serif;font-weight:600;letter-spacing:.05em}
#preloader-word span{font-family:'Orbitron',sans-serif;font-weight:700}

/* ===== fundo preto apenas onde o design pede ===== */
html,body{background:#000}
#home-hero{background:#000 !important}

/* ===== placeholder do reel escondido (não cobre o vídeo do astronauta) ===== */
#home-reel-video-placeholder{display:none !important}

/* ══════════════════ APX SINGLE PAGE (2026-08) ══════════════════ */

/* ---- HERO: APEXCYBER ARMY gigante, fundo preto ---- */
#home-hero{background:#000 !important}
#home-hero-title{
  grid-column:1 / span 12 !important;
  font-family:'Orbitron','Space Grotesk',sans-serif !important;
  font-weight:900 !important;
  font-size:clamp(2.8rem,9vw,11rem) !important;
  line-height:.98 !important;
  letter-spacing:.01em !important;
  text-transform:uppercase !important;
  color:#fff !important;
  text-wrap:balance;
  margin:calc(var(--vh,1vh)*6) 0 0 !important;
  position:relative;z-index:2;
}
#home-hero-title::after{
  content:"";display:block;width:.9em;height:.08em;margin-top:.18em;
  background:#e53e3e;transform-origin:left;
}
#home-hero-visual-container{pointer-events:none !important}

/* ---- REEL -> MARQUEE 3D de pôsteres ---- */
#home-reel{
  background:#000 !important;display:block !important;
  padding:calc(var(--vh,1vh)*10) var(--base-padding-x,4vw) calc(var(--vh,1vh)*14) !important;
  overflow-x:hidden !important;
}
#home-reel-thumb-wrapper,#home-reel-container{display:none !important}
#home-reel-title{
  display:block !important;grid-column:auto !important;position:relative !important;
  left:0 !important;width:min(1280px,92vw) !important;
  font-size:clamp(2.4rem,7.5vw,6.5rem) !important;line-height:1 !important;
  letter-spacing:-.02em !important;text-align:left !important;
  margin:0 auto .4em !important;transform:none !important;will-change:auto !important;
}
#home-reel-title-inner{display:block !important}
#home-reel-title-inner>div{display:block !important;overflow:visible !important}
#home-reel-title-line-1{padding-left:0 !important}

#home-reel-content{
  display:block !important;grid-column:auto !important;position:relative;z-index:3;
  width:min(900px,90vw);margin:calc(var(--vh,1vh)*3) auto 0;
  text-align:center;font-size:clamp(1rem,1.3vw,1.25rem);line-height:1.6;
  color:#c9c9d2 !important;transform:none !important;will-change:auto !important;
}
#page-container #home-reel-desc{font-size:1em !important;margin:0;color:#c9c9d2 !important;font-weight:400 !important;line-height:1.65}
#home-reel-cta{
  display:inline-flex !important;float:none !important;position:relative;overflow:hidden;
  padding:0 1.6em;align-items:center;gap:.9em;border-radius:99em;
  font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;
  background:#fff;color:#0b0b0f;height:3.4em;width:auto;font-weight:600;
  margin:2.2em auto 0;opacity:1 !important;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
  transition:background .3s ease,color .3s ease;
}
#home-reel-cta:hover{background:#e53e3e !important;color:#fff !important}
#home-reel-cta:hover #home-reel-cta-dot{background:#e53e3e}

/* ---- Marquee 3D infinita ---- */
#apx-marquee{
  position:relative;left:50%;transform:translateX(-50%);
  width:100vw;margin-top:calc(var(--vh,1vh)*5);overflow:hidden;
  --mq-gap:clamp(14px,1.8vw,28px);
}
.apx-mq-head{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  width:min(1280px,92vw);margin:0 auto 20px;
}
.apx-mq-label{font-family:'Share Tech Mono',monospace;font-size:13px;letter-spacing:.25em;color:#e53e3e}
.apx-mq-hint{font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:.18em;color:#6f6f78;text-transform:uppercase}
#apx-marquee-viewport{
  position:relative;width:100%;overflow:hidden;
  perspective:1600px;perspective-origin:50% 50%;padding:34px 0 48px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
}
#apx-marquee-viewport:before,#apx-marquee-viewport:after{
  content:"";position:absolute;top:0;bottom:0;width:24%;pointer-events:none;z-index:2;
}
#apx-marquee-viewport:before{left:0;background:linear-gradient(90deg,#000,transparent)}
#apx-marquee-viewport:after{right:0;background:linear-gradient(270deg,#000,transparent)}
.apx-mq-track{
  display:flex;gap:var(--mq-gap);width:max-content;
  padding-right:var(--mq-gap);
  transform-style:preserve-3d;will-change:transform;
  animation:apx-mq-roll 64s linear infinite;
}
#apx-marquee:hover .apx-mq-track{animation-play-state:paused}
@keyframes apx-mq-roll{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
.apx-mq-item{
  position:relative;flex:0 0 auto;margin:0;
  height:clamp(190px,23vw,330px);
  border-radius:12px;overflow:hidden;background:#050507;
  border:1px solid #23232b;
  box-shadow:0 26px 60px rgba(0,0,0,.65);
  transform:rotateY(-15deg) rotateX(3deg) translateZ(0);
  transition:transform .55s cubic-bezier(.2,.6,.2,1),box-shadow .55s ease,border-color .55s ease;
  backface-visibility:hidden;
}
.apx-mq-item img{
  display:block;height:100%;width:auto;
  filter:grayscale(.2) brightness(.82) contrast(1.02);
  transition:filter .55s ease,transform .8s cubic-bezier(.2,.6,.2,1);
}
.apx-mq-item:hover{
  transform:rotateY(0deg) rotateX(0deg) translateZ(44px) scale(1.05);
  box-shadow:0 44px 110px rgba(229,62,62,.30);
  border-color:rgba(229,62,62,.6);z-index:6;
}
.apx-mq-item:hover img{filter:none;transform:scale(1.03)}
@media (max-width:760px){
  .apx-mq-hint{display:none}
  .apx-mq-item{height:180px}
  #apx-marquee-viewport{padding:22px 0 60px}
  .apx-mq-track{animation-duration:42s}
}
@media (prefers-reduced-motion:reduce){
  .apx-mq-track{animation:none}
}

/* ---- home-featured fora do fluxo da one-page ---- */
#home-featured{display:none !important}

/* ---- Footer: newsletter removida visualmente
   (mantida no DOM porque o FooterSection do bundle exige os IDs
    #footer-newsletter-header / #footer-newsletter-form — removê-los
    lançaria TypeError e quebraria o footer) ---- */
#footer-middle-newsletter{display:none !important}

/* ---- Seções novas: base ---- */
.apx-sec{position:relative;background:#000 !important;color:#fff;
  padding:calc(var(--vh,1vh)*12) var(--base-padding-x,4vw);
  min-height:118vh;display:flex;flex-direction:column;justify-content:center;
  font-family:'Space Grotesk',sans-serif;overflow:hidden}
#apx-about{min-height:130vh}
#apx-agents{min-height:112vh}
#apx-army{min-height:126vh}
#apx-platform{min-height:130vh}
.apx-sec-head{display:flex;align-items:center;gap:18px;margin-bottom:3.5em}
.apx-sec-label{font-family:'Share Tech Mono',monospace;font-size:13px;
  letter-spacing:.25em;color:#e53e3e;white-space:nowrap}
.apx-sec-line{flex:1;height:1px;background:linear-gradient(90deg,#e53e3e55,transparent)}
.apx-sec-count{font-family:'Share Tech Mono',monospace;font-size:13px;color:#888;letter-spacing:.2em}
.apx-sec-title{
  font-family:'Orbitron',sans-serif;font-weight:900;text-transform:uppercase;
  font-size:clamp(2rem,5.2vw,4.6rem);line-height:1.02;margin:0 0 .5em;color:#fff}
.apx-sec-sub{max-width:62ch;color:#a8a8b2;font-size:clamp(1rem,1.25vw,1.25rem);line-height:1.65;margin:0 0 2.5em}
.apx-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1)}
.apx-reveal.is-in{opacity:1;transform:none}

/* ---- About ---- */
.apx-about-cols{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.apx-lead{grid-column:1 / span 6;font-size:clamp(1.25rem,1.9vw,1.9rem);line-height:1.4;color:#f2f2f5;margin:0}
.apx-body{grid-column:8 / span 5;color:#a8a8b2;line-height:1.7;margin:0;font-size:1.05rem}
.apx-pillars{grid-column:8 / span 5;list-style:none;padding:0;margin:2.2em 0 0;display:flex;flex-direction:column;gap:1.1em}
.apx-pillars li{display:flex;gap:14px;align-items:baseline;color:#d5d5dc;font-size:.98rem;line-height:1.5;border-top:1px solid #23232b;padding-top:1.1em}
.apx-pillars li span{font-family:'Orbitron',sans-serif;color:#e53e3e;font-size:.85rem}
@media (max-width:900px){.apx-lead{grid-column:1 / span 12}.apx-body,.apx-pillars{grid-column:1 / span 12}}

/* ---- Carrossel de agentes (AMPLIADO) ---- */
.apx-agents-nav{display:flex;align-items:center;gap:14px;margin:0 0 26px}
.apx-agents-nav button{width:52px;height:52px;border-radius:50%;border:1px solid #33333d;
  background:#0c0c10;color:#fff;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:border-color .25s,background .25s}
.apx-agents-nav button:hover{border-color:#e53e3e;background:#1a1114}
#apx-agents-progress{flex:1;max-width:340px;height:2px;background:#26262e;position:relative}
#apx-agents-progress-fill{position:absolute;left:0;top:0;bottom:0;width:8%;background:#e53e3e;transition:width .15s linear}
#apx-agents-track{
  display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:4px var(--base-padding-x,4vw) 30px;margin:0 calc(-1 * var(--base-padding-x,4vw));
  cursor:grab;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
#apx-agents-track::-webkit-scrollbar{display:none}
#apx-agents-track.is-drag{cursor:grabbing;scroll-snap-type:none}
.apx-agent-card{
  position:relative;flex:0 0 auto;width:min(520px,82vw);scroll-snap-align:center;
  background:linear-gradient(165deg,#0b0b0f 0%,#12121a 100%);
  border:1px solid #26262e;border-radius:16px;overflow:hidden;
  transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.apx-agent-card:hover{border-color:#e53e3e88;box-shadow:0 24px 60px rgba(229,62,62,.12)}
.apx-agent-card-visual{aspect-ratio:3/2;overflow:hidden;background:#000}
.apx-agent-card-visual img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s cubic-bezier(.2,.6,.2,1)}
.apx-agent-card:hover .apx-agent-card-visual img{transform:scale(1.045)}
.apx-agent-card-meta{padding:20px 22px 24px}
.apx-agent-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.apx-agent-card-index{font-family:'Share Tech Mono',monospace;color:#666;font-size:13px;letter-spacing:.2em}
.apx-agent-card-tag{font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:.22em;
  color:#9a9aa4;border:1px solid #33333d;border-radius:3px;padding:3px 9px}
.apx-agent-card-tag.is-new{color:#e53e3e;border-color:#e53e3e66;background:rgba(229,62,62,.08)}
.apx-agent-card-name{font-family:'Orbitron',sans-serif;font-weight:700;font-size:1.5rem;
  letter-spacing:.04em;margin:0 0 6px;color:#fff}
.apx-agent-card-role{margin:0;color:#a0a0aa;font-size:.95rem}
.apx-agent-card-link{position:absolute;inset:0}

/* ---- Army ---- */
#apx-army{text-align:left}
.apx-army-title{font-family:'Orbitron',sans-serif;font-weight:900;text-transform:uppercase;
  font-size:clamp(3rem,9.5vw,10rem);line-height:.95;margin:0 0 .35em;color:#fff}
.apx-army-title br+*{}
.apx-army-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;
  background:#26262e;border:1px solid #26262e;margin:3em 0}
.apx-stat{background:#0b0b0f;padding:28px 26px;display:flex;flex-direction:column;gap:8px}
.apx-stat-n{font-family:'Orbitron',sans-serif;font-weight:900;font-size:clamp(2rem,3.4vw,3.2rem);color:#e53e3e}
.apx-stat-l{font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:.22em;color:#8a8a94}
.apx-army-ctas{display:flex;gap:16px;flex-wrap:wrap}
.apx-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:6px;
  border:1px solid #3a3a44;color:#fff;text-decoration:none;
  font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.03em;
  transition:border-color .25s,background .25s,transform .25s}
.apx-btn:hover{border-color:#fff;transform:translateY(-2px)}
.apx-btn-solid{background:#fff;color:#000;border-color:#fff}
.apx-btn-solid:hover{background:#e53e3e;border-color:#e53e3e;color:#fff}
.apx-btn-solid:hover svg path{stroke:#fff}

/* ---- Platform ---- */
.apx-mods-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1px;
  background:#26262e;border:1px solid #26262e}
.apx-mod{position:relative;background:#0b0b0f;padding:22px 20px 20px;text-decoration:none;
  display:flex;flex-direction:column;gap:6px;transition:background .25s;overflow:hidden}
.apx-mod:hover{background:#151119}
.apx-mod:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:transparent;transition:background .25s}
.apx-mod:hover:before{background:#e53e3e}
.apx-mod-idx{font-family:'Share Tech Mono',monospace;font-size:11px;color:#666;letter-spacing:.2em}
.apx-mod-name{font-family:'Orbitron',sans-serif;font-weight:700;font-size:1.02rem;color:#fff;letter-spacing:.03em}
.apx-mod-code{font-family:'Share Tech Mono',monospace;font-size:12px;color:#e53e3e}
.apx-mod-cat{font-family:'Share Tech Mono',monospace;font-size:10px;color:#8a8a94;letter-spacing:.18em;margin-top:4px}

/* ---- End section: só APEXCYBER ARMY ---- */
#end-section{color:#fff !important}
html.is-white-bg #end-section{color:#fff !important}



@media (max-width:812px){
  .apx-sec{padding:calc(var(--vh,1vh)*10) 5vw}
  .apx-agent-card{width:82vw}
  .apx-army-title{font-size:clamp(2.6rem,13vw,6rem)}
}

/* ---- About hero: a palavra animada (WebGL) agora é APEXCYBER —
       esconde o SVG estático que ficava por baixo (mantém layout p/ syncDom) ---- */
#about-who-title-main-logo{visibility:hidden!important}

/* ---- About: pacing das seções clients + award (rolagem mais lenta/legível) ---- */
#about-clients{padding-top:calc(var(--vh,1vh)*55)!important;padding-bottom:calc(var(--vh,1vh)*45)!important}
#about-award{min-height:calc(1250 / 1440 * 185vw)!important}