:root{
  --bg:#020806;
  --bg-soft:#07140f;
  --panel:rgba(9,28,20,.86);
  --panel-2:rgba(5,18,13,.95);
  --green:#58f0aa;
  --green-2:#1fd587;
  --cyan:#73e5df;
  --gold:#d5b97c;
  --white:#f5fff9;
  --text:#bdd0c4;
  --muted:#83998d;
  --line:rgba(88,240,170,.16);
  --shadow:0 30px 90px rgba(0,0,0,.48);
  --radius:24px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:Inter,Segoe UI,Arial,sans-serif;
  background:
    radial-gradient(circle at 12% 8%,rgba(31,213,135,.13),transparent 27%),
    radial-gradient(circle at 88% 22%,rgba(115,229,223,.08),transparent 27%),
    linear-gradient(180deg,#020806,#04110c 52%,#010604);
  min-height:100vh;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:
    linear-gradient(rgba(88,240,170,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(88,240,170,.04) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,#000,transparent 94%);
}
a{color:inherit}
img{max-width:100%}
button,input{font:inherit}
.container{width:min(1240px,calc(100% - 36px));margin:auto;position:relative;z-index:2}

.site-header{
  position:sticky;top:0;z-index:50;
  border-bottom:1px solid var(--line);
  background:rgba(2,8,6,.84);
  backdrop-filter:blur(18px);
}
.nav{
  min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.brand{
  display:flex;align-items:center;gap:12px;text-decoration:none;
  font-family:Oxanium,Segoe UI,sans-serif;font-weight:900;letter-spacing:.03em;
  color:var(--white);
}
.brand-mark{
  width:38px;height:38px;display:grid;place-items:center;
  border:1px solid rgba(88,240,170,.28);
  border-radius:12px;
  background:linear-gradient(145deg,rgba(88,240,170,.18),rgba(7,20,15,.9));
  color:var(--green);box-shadow:0 0 24px rgba(88,240,170,.12);
}
.nav-links{display:flex;align-items:center;gap:8px}
.nav-links a{
  padding:10px 13px;border-radius:11px;text-decoration:none;
  color:#a9bcae;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
}
.nav-links a:hover,.nav-links a.active{
  color:#021009;background:linear-gradient(100deg,var(--green-2),var(--cyan));
}
.menu-toggle{
  display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;
  color:var(--white);background:rgba(255,255,255,.03);cursor:pointer;
}

.hero{
  min-height:760px;display:grid;align-items:center;position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(2,8,6,.98),rgba(2,8,6,.86) 46%,rgba(2,8,6,.35) 73%,rgba(2,8,6,.86)),
    linear-gradient(180deg,rgba(2,8,6,.05),rgba(2,8,6,.96)),
    url("../img/tercetri/background.webp") center/cover no-repeat;
  filter:saturate(.72) contrast(1.06);transform:scale(1.03);
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 70% 40%,rgba(88,240,170,.15),transparent 25%);
}
.hero-content{position:relative;z-index:2;width:min(830px,100%);padding:100px 0}
.kicker{
  display:inline-flex;align-items:center;gap:9px;padding:9px 14px;
  border:1px solid rgba(88,240,170,.26);border-radius:999px;
  background:rgba(4,18,13,.67);color:var(--green);
  font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
}
.kicker::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--green);
  box-shadow:0 0 14px var(--green);
}
h1,h2,h3{font-family:Oxanium,Segoe UI,sans-serif;color:var(--white)}
.hero h1{
  margin:24px 0 22px;font-size:clamp(58px,8vw,114px);line-height:.88;
  letter-spacing:-.07em;text-transform:uppercase;
}
.hero h1 span{
  display:block;color:transparent;
  background:linear-gradient(105deg,#fff,#c5ffea 37%,var(--green) 70%,var(--gold));
  -webkit-background-clip:text;background-clip:text;
}
.hero p{max-width:760px;margin:0;font-size:clamp(17px,1.9vw,21px);line-height:1.78;color:#c6d9cd}
.actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:32px}
.btn{
  min-height:54px;display:inline-flex;align-items:center;justify-content:center;padding:0 23px;
  border:1px solid var(--line);border-radius:14px;text-decoration:none;
  font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  transition:.3s ease;
}
.btn:hover{transform:translateY(-4px)}
.btn-primary{
  color:#021009;background:linear-gradient(100deg,var(--green-2),var(--cyan));
  border-color:transparent;box-shadow:0 16px 40px rgba(31,213,135,.2);
}
.btn-secondary{color:var(--white);background:rgba(4,17,13,.72)}
.btn-secondary:hover{border-color:var(--green)}

.section{padding:96px 0;position:relative}
.section+.section{border-top:1px solid rgba(88,240,170,.07)}
.section-head{
  display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px;
}
.eyebrow{
  display:block;margin-bottom:10px;color:var(--green);
  font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
}
.section h2{margin:0;font-size:clamp(34px,4.5vw,58px);line-height:1.04;letter-spacing:-.04em}
.section-head p{max-width:520px;margin:0;color:var(--muted);line-height:1.75}

.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.game-card{
  overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(145deg,var(--panel),var(--panel-2));
  box-shadow:var(--shadow);transition:.35s ease;
}
.game-card:hover{transform:translateY(-8px);border-color:rgba(88,240,170,.32)}
.game-image{height:260px;overflow:hidden;position:relative;background:#06100c}
.game-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.game-card:hover .game-image img{transform:scale(1.04)}
.game-image::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(2,8,6,.74),transparent 55%)}
.game-body{padding:24px}
.game-status{
  display:inline-flex;padding:7px 10px;border:1px solid rgba(88,240,170,.18);
  border-radius:999px;color:var(--green);font-size:9px;font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;
}
.game-card h3{margin:14px 0 10px;font-size:23px}
.game-card p{margin:0;color:#99ada1;font-size:13px;line-height:1.72}
.game-card .btn{width:100%;margin-top:21px}

.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.feature{
  padding:27px;border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(145deg,rgba(8,27,20,.76),rgba(3,13,10,.9));
}
.feature strong{display:block;color:var(--green);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.feature h3{margin:13px 0 10px;font-size:20px}
.feature p{margin:0;color:#91a79a;font-size:13px;line-height:1.7}

.page-hero{padding:105px 0 70px;border-bottom:1px solid var(--line)}
.page-hero h1{margin:10px 0 14px;font-size:clamp(48px,7vw,86px);letter-spacing:-.06em}
.page-hero p{max-width:760px;margin:0;color:#aebfb5;line-height:1.8}

.placeholder{
  min-height:360px;display:grid;place-items:center;padding:35px;text-align:center;
  border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(145deg,var(--panel),var(--panel-2));box-shadow:var(--shadow);
}
.placeholder h2{margin:0 0 12px}
.placeholder p{max-width:650px;margin:0;color:var(--muted);line-height:1.8}

.footer{
  padding:46px 18px;text-align:center;border-top:1px solid var(--line);color:var(--muted);
}
.footer strong{color:var(--green)}
.footer small{display:block;margin-top:7px}

@media(max-width:950px){
  .game-grid,.feature-grid{grid-template-columns:1fr 1fr}
  .section-head{align-items:flex-start;flex-direction:column}
}
@media(max-width:720px){
  .nav{min-height:66px}
  .menu-toggle{display:grid;place-items:center}
  .nav-links{
    display:none;position:absolute;top:66px;left:18px;right:18px;padding:12px;
    flex-direction:column;align-items:stretch;border:1px solid var(--line);
    border-radius:17px;background:rgba(3,13,10,.97);box-shadow:var(--shadow);
  }
  .nav-links.open{display:flex}
  .nav-links a{text-align:center}
  .hero{min-height:680px}
  .hero::before{
    background:
      linear-gradient(180deg,rgba(2,8,6,.22),rgba(2,8,6,.98) 70%),
      url("../img/tercetri/background.webp") center/cover no-repeat;
  }
  .hero-content{padding:310px 0 68px;text-align:center}
  .hero h1{font-size:50px;line-height:.96}
  .actions{flex-direction:column}.btn{width:100%}
  .game-grid,.feature-grid{grid-template-columns:1fr}
  .section{padding:72px 0}
  .game-image{height:230px}
}


/* ================================================================
   ETAPA 3 — CATÁLOGO E PÁGINAS INDIVIDUAIS DOS JOGOS
================================================================ */

.catalog-hero{
  padding:110px 0 82px;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.catalog-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 76% 36%,rgba(88,240,170,.12),transparent 28%),
    linear-gradient(180deg,rgba(2,8,6,.2),rgba(2,8,6,.94));
}
.catalog-hero .container{position:relative;z-index:2}
.catalog-hero h1{
  max-width:900px;
  margin:10px 0 18px;
  font-size:clamp(54px,8vw,100px);
  line-height:.92;
  letter-spacing:-.065em;
  text-transform:uppercase;
}
.catalog-hero h1 span{
  display:block;
  color:transparent;
  background:linear-gradient(105deg,#fff,#c8ffec 38%,var(--green) 72%,var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
}
.catalog-hero p{
  max-width:760px;
  margin:0;
  color:#adbbb3;
  font-size:17px;
  line-height:1.8;
}

.filter-bar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:32px;
}
.filter-btn{
  min-height:43px;
  padding:0 17px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:#adc0b4;
  cursor:pointer;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:.3s ease;
}
.filter-btn:hover,
.filter-btn.active{
  color:#021009;
  border-color:transparent;
  background:linear-gradient(100deg,var(--green-2),var(--cyan));
  box-shadow:0 13px 34px rgba(31,213,135,.18);
}

.catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.catalog-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(145deg,var(--panel),var(--panel-2));
  box-shadow:var(--shadow);
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease;
}
.catalog-card:hover{
  transform:translateY(-8px);
  border-color:rgba(88,240,170,.32);
  box-shadow:0 36px 95px rgba(0,0,0,.56);
}
.catalog-card.hidden{display:none}
.catalog-cover{
  position:relative;
  height:290px;
  overflow:hidden;
  background:#06100c;
}
.catalog-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .65s ease,filter .35s ease;
}
.catalog-card:hover .catalog-cover img{
  transform:scale(1.045);
  filter:saturate(1.06) contrast(1.03);
}
.catalog-cover::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top,rgba(2,8,6,.82),transparent 56%);
}
.catalog-platform{
  position:absolute;
  z-index:2;
  left:17px;
  top:17px;
  padding:7px 10px;
  border:1px solid rgba(88,240,170,.2);
  border-radius:999px;
  background:rgba(3,15,11,.78);
  color:var(--green);
  font-size:9px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
}
.catalog-body{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:25px;
}
.catalog-body h2{
  margin:0 0 11px;
  font-size:25px;
  line-height:1.05;
}
.catalog-body p{
  margin:0;
  color:#98aca0;
  font-size:13px;
  line-height:1.74;
}
.catalog-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:18px;
}
.catalog-tags span{
  padding:7px 9px;
  border:1px solid rgba(88,240,170,.12);
  border-radius:999px;
  background:rgba(88,240,170,.035);
  color:#9ccfb6;
  font-size:9px;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.catalog-body .btn{
  width:100%;
  margin-top:auto;
  padding-top:0;
}
.catalog-spacer{height:23px}

.detail-hero{
  min-height:720px;
  display:grid;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.detail-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,8,6,.98),rgba(2,8,6,.86) 44%,rgba(2,8,6,.3) 74%,rgba(2,8,6,.86)),
    linear-gradient(180deg,rgba(2,8,6,.04),rgba(2,8,6,.96)),
    var(--detail-cover) center/cover no-repeat;
  filter:saturate(.82) contrast(1.07);
  transform:scale(1.035);
}
.detail-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 70% 42%,rgba(88,240,170,.14),transparent 25%);
}
.detail-hero-content{
  position:relative;
  z-index:2;
  width:min(850px,100%);
  padding:105px 0 90px;
}
.detail-hero h1{
  margin:22px 0 18px;
  font-size:clamp(52px,8vw,108px);
  line-height:.89;
  letter-spacing:-.068em;
  text-transform:uppercase;
}
.detail-hero h1 span{
  display:block;
  color:transparent;
  background:linear-gradient(105deg,#fff,#c8ffec 36%,var(--green) 70%,var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
}
.detail-hero p{
  max-width:760px;
  margin:0;
  color:#c3d6ca;
  font-size:clamp(16px,1.8vw,20px);
  line-height:1.78;
}
.detail-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:25px;
}
.detail-badges span{
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  color:#adbbb3;
  font-size:9px;
  letter-spacing:.075em;
  text-transform:uppercase;
}

.detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);
  gap:24px;
}
.detail-panel{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(145deg,var(--panel),var(--panel-2));
  box-shadow:var(--shadow);
}
.detail-copy{padding:38px}
.detail-copy h2{margin:0 0 17px;font-size:30px}
.detail-copy p{
  margin:0;
  color:#aec1b5;
  font-size:15px;
  line-height:1.9;
}
.detail-copy p+p{margin-top:17px}
.detail-copy strong{color:var(--green)}
.detail-quote{
  margin-top:24px;
  padding:18px 19px;
  border-left:3px solid var(--green);
  border-radius:0 14px 14px 0;
  background:rgba(88,240,170,.045);
  color:#c9f5dc;
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:14px;
  line-height:1.65;
}

.spec-list{
  display:grid;
  gap:11px;
  padding:20px;
}
.spec-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 16px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.spec-row span{
  color:var(--muted);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.spec-row strong{
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:12px;
  text-align:right;
}

.detail-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.detail-feature{
  min-height:205px;
  padding:27px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(8,27,20,.76),rgba(3,13,10,.9));
  transition:transform .35s ease,border-color .35s ease;
}
.detail-feature:hover{
  transform:translateY(-7px);
  border-color:rgba(88,240,170,.32);
}
.detail-feature i{
  width:47px;
  height:47px;
  display:grid;
  place-items:center;
  margin-bottom:23px;
  border-radius:13px;
  color:#021009;
  background:linear-gradient(135deg,var(--green),var(--gold));
  font-family:Oxanium,Segoe UI,sans-serif;
  font-style:normal;
  font-weight:900;
}
.detail-feature h3{margin:0 0 9px;font-size:18px}
.detail-feature p{margin:0;color:#90a69a;font-size:13px;line-height:1.7}

.detail-gallery{
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:18px;
}
.gallery-main,
.gallery-stack > div{
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:#06100c;
}
.gallery-main{min-height:500px}
.gallery-stack{
  display:grid;
  grid-template-rows:repeat(2,1fr);
  gap:18px;
}
.gallery-main img,
.gallery-stack img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.gallery-caption{
  position:absolute;
  z-index:2;
  left:18px;
  right:18px;
  bottom:16px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-shadow:0 4px 16px rgba(0,0,0,.85);
}
.gallery-main::after,
.gallery-stack > div::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top,rgba(2,8,6,.72),transparent 50%);
}

.callout{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:30px;
  align-items:center;
  padding:38px;
  border:1px solid rgba(88,240,170,.2);
  border-radius:var(--radius);
  background:
    radial-gradient(circle at 82% 40%,rgba(88,240,170,.09),transparent 26%),
    linear-gradient(145deg,rgba(8,28,20,.92),rgba(2,10,7,.98));
  box-shadow:var(--shadow);
}
.callout h2{margin:0 0 11px;font-size:clamp(27px,3vw,40px)}
.callout p{max-width:740px;margin:0;color:#9fb2a7;line-height:1.75}
.callout .btn{min-width:230px}

.notice{
  padding:18px 20px;
  border:1px solid rgba(213,185,124,.16);
  border-radius:15px;
  background:rgba(213,185,124,.035);
  color:#b9ad90;
  font-size:12px;
  line-height:1.75;
}
.notice strong{color:#ead7a8}

.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:19px;
  color:#8da095;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.breadcrumb a{text-decoration:none;color:var(--green)}
.breadcrumb span::before{content:"/";margin-right:8px;color:#52655b}

@media(max-width:1000px){
  .catalog-grid{grid-template-columns:1fr 1fr}
  .detail-grid{grid-template-columns:1fr}
  .detail-feature-grid{grid-template-columns:1fr 1fr}
  .detail-gallery{grid-template-columns:1fr}
  .gallery-main{min-height:430px}
  .gallery-stack{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .gallery-stack > div{aspect-ratio:16/10}
  .callout{grid-template-columns:1fr}
  .callout .btn{width:100%}
}
@media(max-width:720px){
  .catalog-hero{padding:85px 0 62px}
  .catalog-hero h1{font-size:50px}
  .filter-bar{display:grid;grid-template-columns:1fr 1fr}
  .filter-btn{width:100%}
  .catalog-grid{grid-template-columns:1fr}
  .catalog-cover{height:245px}
  .detail-hero{min-height:680px}
  .detail-hero::before{
    background:
      linear-gradient(180deg,rgba(2,8,6,.18),rgba(2,8,6,.98) 70%),
      var(--detail-cover) center/cover no-repeat;
  }
  .detail-hero-content{padding:310px 0 70px;text-align:center}
  .detail-hero h1{font-size:47px;line-height:.96}
  .detail-badges{justify-content:center}
  .detail-copy{padding:25px 21px}
  .detail-feature-grid{grid-template-columns:1fr}
  .detail-feature{min-height:180px}
  .gallery-main{min-height:290px}
  .gallery-stack{grid-template-columns:1fr}
  .callout{padding:27px 22px}
  .spec-row{align-items:flex-start;flex-direction:column}
  .spec-row strong{text-align:left}
}


/* ================================================================
   ETAPA 4 — PÁGINA JOGOS CINEMATOGRÁFICA
================================================================ */

.games-showcase-hero{
  min-height:720px;
  display:grid;
  align-items:end;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}

.games-showcase-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,8,6,.98) 0%,rgba(2,8,6,.84) 43%,rgba(2,8,6,.2) 75%,rgba(2,8,6,.78) 100%),
    linear-gradient(180deg,rgba(2,8,6,.08),rgba(2,8,6,.96)),
    url("../img/tercetri/background.webp") center/cover no-repeat;
  filter:saturate(.76) contrast(1.08);
  transform:scale(1.035);
}

.games-showcase-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 72% 39%,rgba(88,240,170,.16),transparent 25%),
    linear-gradient(112deg,transparent 0 55%,rgba(115,229,223,.055) 56%,transparent 57%);
}

.games-showcase-content{
  width:min(900px,100%);
  position:relative;
  z-index:2;
  padding:105px 0 90px;
}

.games-showcase-content h1{
  margin:24px 0 22px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:clamp(60px,9vw,126px);
  font-weight:800;
  line-height:.86;
  letter-spacing:-.074em;
  text-transform:uppercase;
  text-shadow:0 24px 72px rgba(0,0,0,.64);
}

.games-showcase-content h1 span{
  display:block;
  color:transparent;
  background:linear-gradient(105deg,#fff 0%,#c7ffea 34%,var(--green) 68%,var(--gold) 88%,#fff 100%);
  -webkit-background-clip:text;
  background-clip:text;
}

.games-showcase-content p{
  max-width:760px;
  margin:0;
  color:#c6d8cd;
  font-size:clamp(17px,1.9vw,21px);
  line-height:1.78;
}

.games-showcase-stats{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:29px;
}

.games-showcase-stats span{
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  color:#a9bbb0;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.games-intro{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:24px;
  margin-bottom:34px;
}

.games-intro-copy{
  padding:36px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(8,27,20,.82),rgba(3,13,10,.94));
  box-shadow:var(--shadow);
}

.games-intro-copy h2{
  margin:0 0 15px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:clamp(30px,3.5vw,46px);
}

.games-intro-copy p{
  margin:0;
  color:#a9bdb1;
  font-size:14px;
  line-height:1.85;
}

.games-intro-side{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}

.games-intro-stat{
  padding:22px;
  border:1px solid rgba(88,240,170,.14);
  border-radius:20px;
  background:rgba(255,255,255,.025);
}

.games-intro-stat strong{
  display:block;
  color:var(--green);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:30px;
}

.games-intro-stat span{
  display:block;
  margin-top:7px;
  color:#8fa397;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.games-filter-shell{
  position:sticky;
  top:90px;
  z-index:20;
  margin:0 0 34px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(3,13,10,.88);
  backdrop-filter:blur(16px);
  box-shadow:0 18px 45px rgba(0,0,0,.28);
}

.games-filter-shell .filter-bar{
  margin:0;
}

.games-cinematic-list{
  display:grid;
  gap:28px;
}

.game-cinematic{
  min-height:520px;
  display:grid;
  grid-template-columns:minmax(360px,.92fr) minmax(0,1.08fr);
  overflow:hidden;
  position:relative;
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(8,28,20,.9),rgba(2,10,7,.98));
  box-shadow:0 34px 95px rgba(0,0,0,.5);
  transition:transform .4s ease,border-color .35s ease,box-shadow .35s ease;
}

.game-cinematic:hover{
  transform:translateY(-8px);
  border-color:rgba(88,240,170,.32);
  box-shadow:0 42px 110px rgba(0,0,0,.58),0 0 36px rgba(88,240,170,.06);
}

.game-cinematic.hidden{
  display:none;
}

.game-cinematic-media{
  min-height:520px;
  position:relative;
  overflow:hidden;
  background:#06100c;
}

.game-cinematic-media img{
  width:100%;
  height:100%;
  min-height:520px;
  object-fit:cover;
  transition:transform .75s ease,filter .4s ease;
}

.game-cinematic:hover .game-cinematic-media img{
  transform:scale(1.045);
  filter:saturate(1.06) contrast(1.04);
}

.game-cinematic-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(to top,rgba(2,8,6,.84),transparent 50%),
    linear-gradient(90deg,transparent 68%,rgba(2,8,6,.72));
}

.game-cinematic-number{
  position:absolute;
  z-index:2;
  left:21px;
  bottom:18px;
  color:rgba(255,255,255,.18);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:80px;
  font-weight:900;
  line-height:1;
}

.game-cinematic-platform{
  position:absolute;
  z-index:2;
  left:20px;
  top:20px;
  padding:8px 11px;
  border:1px solid rgba(88,240,170,.22);
  border-radius:999px;
  background:rgba(3,15,11,.8);
  color:var(--green);
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  backdrop-filter:blur(9px);
}

.game-cinematic-body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:46px;
}

.game-cinematic-kicker{
  color:var(--green);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.game-cinematic-title{
  margin:11px 0 15px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:clamp(32px,4vw,53px);
  line-height:1.02;
  letter-spacing:-.035em;
}

.game-cinematic-description{
  margin:0;
  color:#adc0b4;
  font-size:15px;
  line-height:1.85;
}

.game-cinematic-details{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:25px;
}

.game-cinematic-detail{
  padding:14px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.game-cinematic-detail small{
  display:block;
  color:var(--muted);
  font-size:9px;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.game-cinematic-detail strong{
  display:block;
  margin-top:5px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:12px;
}

.game-cinematic-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:20px;
}

.game-cinematic-tags span{
  padding:7px 10px;
  border:1px solid rgba(88,240,170,.12);
  border-radius:999px;
  background:rgba(88,240,170,.04);
  color:#9ed2b8;
  font-size:9px;
  letter-spacing:.065em;
  text-transform:uppercase;
}

.game-cinematic-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:27px;
}

.game-cinematic-actions .btn{
  min-width:180px;
}

.game-cinematic.reverse{
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
}

.game-cinematic.reverse .game-cinematic-media{
  order:2;
}

.game-cinematic.reverse .game-cinematic-body{
  order:1;
}

.game-cinematic.reverse .game-cinematic-media::after{
  background:
    linear-gradient(to top,rgba(2,8,6,.84),transparent 50%),
    linear-gradient(270deg,transparent 68%,rgba(2,8,6,.72));
}

.games-future-card{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  overflow:hidden;
  border:1px solid rgba(88,240,170,.2);
  border-radius:28px;
  background:
    radial-gradient(circle at 78% 40%,rgba(88,240,170,.11),transparent 28%),
    linear-gradient(145deg,rgba(8,28,20,.94),rgba(2,10,7,.99));
  box-shadow:0 38px 100px rgba(0,0,0,.55);
}

.games-future-copy{
  padding:48px;
}

.games-future-copy h2{
  margin:0 0 16px;
  font-size:clamp(31px,3.7vw,49px);
}

.games-future-copy p{
  margin:0;
  color:#a7bbb0;
  line-height:1.84;
}

.games-future-points{
  display:grid;
  gap:10px;
  margin-top:24px;
}

.games-future-points div{
  padding:15px 17px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  background:rgba(255,255,255,.025);
  color:#9daf9f;
  font-size:12px;
  line-height:1.65;
}

.games-future-points strong{
  color:var(--green);
}

.games-future-mark{
  min-height:390px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  border-left:1px solid var(--line);
}

.games-future-mark::before{
  content:"RTS";
  position:absolute;
  color:rgba(88,240,170,.055);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:180px;
  font-weight:900;
  line-height:1;
}

.games-future-mark div{
  position:relative;
  z-index:2;
  text-align:center;
}

.games-future-mark b{
  display:block;
  color:var(--green);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.games-future-mark strong{
  display:block;
  margin-top:12px;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:25px;
}

.games-future-mark span{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:12px;
}

@media(max-width:1000px){
  .games-intro{
    grid-template-columns:1fr;
  }

  .game-cinematic,
  .game-cinematic.reverse{
    grid-template-columns:1fr;
  }

  .game-cinematic-media,
  .game-cinematic-media img{
    min-height:430px;
  }

  .game-cinematic.reverse .game-cinematic-media,
  .game-cinematic.reverse .game-cinematic-body{
    order:initial;
  }

  .game-cinematic-media::after,
  .game-cinematic.reverse .game-cinematic-media::after{
    background:linear-gradient(to top,rgba(2,8,6,.86),transparent 52%);
  }

  .games-future-card{
    grid-template-columns:1fr;
  }

  .games-future-mark{
    min-height:280px;
    border-left:0;
    border-top:1px solid var(--line);
  }
}

@media(max-width:720px){
  .games-showcase-hero{
    min-height:680px;
  }

  .games-showcase-hero::before{
    background:
      linear-gradient(180deg,rgba(2,8,6,.2),rgba(2,8,6,.98) 70%),
      url("../img/tercetri/background.webp") center/cover no-repeat;
  }

  .games-showcase-content{
    padding:310px 0 70px;
    text-align:center;
  }

  .games-showcase-content h1{
    font-size:51px;
    line-height:.95;
  }

  .games-showcase-stats{
    justify-content:center;
  }

  .games-intro-copy{
    padding:27px 22px;
  }

  .games-intro-side{
    grid-template-columns:1fr 1fr;
  }

  .games-filter-shell{
    position:static;
  }

  .game-cinematic-media,
  .game-cinematic-media img{
    min-height:300px;
  }

  .game-cinematic-body{
    padding:27px 22px;
  }

  .game-cinematic-details{
    grid-template-columns:1fr;
  }

  .game-cinematic-actions{
    flex-direction:column;
  }

  .game-cinematic-actions .btn{
    width:100%;
  }

  .games-future-copy{
    padding:27px 22px;
  }

  .games-future-mark{
    min-height:240px;
  }
}


/* ================================================================
   ETAPA 5 — LANÇAMENTOS E SOBRE
================================================================ */

/* LANÇAMENTOS */
.release-hero{
  min-height:700px;
  display:grid;
  align-items:end;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.release-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,8,6,.98),rgba(2,8,6,.86) 46%,rgba(2,8,6,.24) 76%,rgba(2,8,6,.82)),
    linear-gradient(180deg,rgba(2,8,6,.05),rgba(2,8,6,.96)),
    url("../img/arqvium/capa.webp") center/cover no-repeat;
  filter:saturate(.72) contrast(1.07);
  transform:scale(1.04);
}
.release-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 73% 38%,rgba(88,240,170,.15),transparent 26%),
    linear-gradient(112deg,transparent 0 56%,rgba(115,229,223,.045) 57%,transparent 58%);
}
.release-hero-content{
  width:min(920px,100%);
  position:relative;
  z-index:2;
  padding:110px 0 88px;
}
.release-hero h1{
  margin:22px 0 20px;
  font-size:clamp(58px,9vw,122px);
  line-height:.86;
  letter-spacing:-.074em;
  text-transform:uppercase;
}
.release-hero h1 span{
  display:block;
  color:transparent;
  background:linear-gradient(105deg,#fff,#c8ffec 34%,var(--green) 68%,var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
}
.release-hero p{
  max-width:760px;
  margin:0;
  color:#c4d6cb;
  font-size:clamp(17px,1.8vw,20px);
  line-height:1.8;
}
.release-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:13px;
  margin-top:30px;
  max-width:720px;
}
.release-summary div{
  padding:15px 17px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:15px;
  background:rgba(4,16,12,.64);
  backdrop-filter:blur(10px);
}
.release-summary strong{
  display:block;
  color:var(--green);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:22px;
}
.release-summary span{
  display:block;
  margin-top:5px;
  color:#92a59a;
  font-size:9px;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.release-board{
  display:grid;
  gap:22px;
}
.release-entry{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:25px;
  background:linear-gradient(145deg,rgba(8,28,20,.87),rgba(2,10,7,.98));
  box-shadow:var(--shadow);
  transition:transform .35s ease,border-color .35s ease;
}
.release-entry:hover{
  transform:translateY(-6px);
  border-color:rgba(88,240,170,.3);
}
.release-date{
  min-height:275px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:29px;
  position:relative;
  overflow:hidden;
  border-right:1px solid var(--line);
  background:
    linear-gradient(180deg,rgba(2,8,6,.3),rgba(2,8,6,.9)),
    var(--release-image) center/cover no-repeat;
}
.release-date::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 30%,rgba(88,240,170,.1),transparent 40%);
}
.release-date > *{position:relative;z-index:2}
.release-date small{
  color:var(--green);
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.release-date strong{
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:26px;
  line-height:1.05;
}
.release-content{
  padding:32px 34px;
}
.release-topline{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.release-content h2{
  margin:0;
  font-size:clamp(25px,3vw,38px);
}
.release-status{
  flex:0 0 auto;
  padding:8px 11px;
  border:1px solid rgba(88,240,170,.2);
  border-radius:999px;
  color:var(--green);
  background:rgba(88,240,170,.045);
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.release-content > p{
  margin:14px 0 0;
  color:#a7bbb0;
  line-height:1.78;
}
.release-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:19px;
}
.release-meta span{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:999px;
  color:#94a89d;
  background:rgba(255,255,255,.025);
  font-size:9px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.release-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:23px;
}
.release-actions .btn{
  min-width:180px;
}
.release-update{
  margin-top:22px;
  border-top:1px solid rgba(88,240,170,.1);
  padding-top:17px;
}
.release-update details{
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  background:rgba(255,255,255,.022);
}
.release-update summary{
  padding:15px 17px;
  cursor:pointer;
  color:#c1d4c8;
  font-size:11px;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
  list-style:none;
}
.release-update summary::-webkit-details-marker{display:none}
.release-update summary::after{
  content:"+";
  float:right;
  color:var(--green);
  font-size:17px;
  line-height:1;
}
.release-update details[open] summary::after{content:"–"}
.release-update div{
  padding:0 17px 17px;
  color:#8fa398;
  font-size:12px;
  line-height:1.75;
}
.roadmap{
  position:relative;
  padding-left:35px;
}
.roadmap::before{
  content:"";
  position:absolute;
  left:8px;
  top:8px;
  bottom:8px;
  width:1px;
  background:linear-gradient(var(--green),rgba(88,240,170,.08));
}
.roadmap-item{
  position:relative;
  padding:0 0 35px 24px;
}
.roadmap-item:last-child{padding-bottom:0}
.roadmap-item::before{
  content:"";
  position:absolute;
  left:-31px;
  top:7px;
  width:13px;
  height:13px;
  border:3px solid #06130e;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 20px rgba(88,240,170,.55);
}
.roadmap-item.future::before{
  background:#4d6156;
  box-shadow:none;
}
.roadmap-item small{
  color:var(--green);
  font-size:9px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.roadmap-item.future small{color:#84978c}
.roadmap-item h3{
  margin:7px 0 8px;
  font-size:21px;
}
.roadmap-item p{
  margin:0;
  color:#95a99e;
  font-size:13px;
  line-height:1.7;
}

/* SOBRE */
.about-hero{
  min-height:760px;
  display:grid;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.about-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,8,6,.99),rgba(2,8,6,.88) 48%,rgba(2,8,6,.32) 75%,rgba(2,8,6,.84)),
    linear-gradient(180deg,rgba(2,8,6,.02),rgba(2,8,6,.96)),
    var(--about-photo) 78% 32%/cover no-repeat;
  filter:saturate(.78) contrast(1.04);
  transform:scale(1.03);
}
.about-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 72% 42%,rgba(88,240,170,.13),transparent 26%),
    linear-gradient(115deg,transparent 0 58%,rgba(115,229,223,.05) 59%,transparent 60%);
}
.about-hero-content{
  position:relative;
  z-index:2;
  width:min(790px,100%);
  padding:110px 0 92px;
}
.about-hero h1{
  margin:22px 0 20px;
  font-size:clamp(55px,8vw,112px);
  line-height:.88;
  letter-spacing:-.07em;
  text-transform:uppercase;
}
.about-hero h1 span{
  display:block;
  color:transparent;
  background:linear-gradient(105deg,#fff,#c8ffec 35%,var(--green) 70%,var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
}
.about-hero p{
  max-width:730px;
  margin:0;
  color:#c4d7cb;
  font-size:clamp(17px,1.8vw,20px);
  line-height:1.8;
}
.about-badges{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:27px;
}
.about-badges span{
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  color:#a9bcb1;
  background:rgba(255,255,255,.03);
  font-size:9px;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.about-story-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr);
  gap:24px;
}
.about-story{
  padding:40px;
  border:1px solid var(--line);
  border-radius:25px;
  background:linear-gradient(145deg,rgba(8,28,20,.85),rgba(2,10,7,.98));
  box-shadow:var(--shadow);
}
.about-story h2{
  margin:0 0 18px;
  font-size:clamp(31px,3.5vw,48px);
}
.about-story p{
  margin:0;
  color:#aec1b5;
  font-size:15px;
  line-height:1.92;
}
.about-story p+p{margin-top:17px}
.about-story strong{color:var(--green)}
.about-portrait{
  min-height:560px;
  overflow:hidden;
  position:relative;
  border:1px solid var(--line);
  border-radius:25px;
  background:#06100c;
  box-shadow:var(--shadow);
}
.about-portrait img{
  width:100%;
  height:100%;
  min-height:560px;
  object-fit:cover;
  object-position:center 28%;
}
.about-portrait::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(2,8,6,.88),transparent 55%);
}
.about-portrait-caption{
  position:absolute;
  z-index:2;
  left:24px;
  right:24px;
  bottom:22px;
}
.about-portrait-caption strong{
  display:block;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:22px;
}
.about-portrait-caption span{
  display:block;
  margin-top:5px;
  color:var(--green);
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.achievement-card{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(213,185,124,.22);
  border-radius:25px;
  background:
    radial-gradient(circle at 15% 45%,rgba(213,185,124,.12),transparent 30%),
    linear-gradient(145deg,rgba(26,24,15,.82),rgba(5,13,9,.98));
  box-shadow:var(--shadow);
}
.achievement-rank{
  min-height:300px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  border-right:1px solid rgba(213,185,124,.14);
}
.achievement-rank::before{
  content:"2º";
  color:rgba(213,185,124,.11);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:128px;
  font-weight:900;
}
.achievement-rank strong{
  position:absolute;
  color:var(--gold);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:28px;
}
.achievement-copy{
  padding:42px;
  align-self:center;
}
.achievement-copy h2{
  margin:0 0 14px;
  font-size:clamp(28px,3.3vw,43px);
}
.achievement-copy p{
  margin:0;
  color:#b8b19d;
  line-height:1.82;
}
.values-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.value-card{
  min-height:220px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:21px;
  background:linear-gradient(145deg,rgba(8,27,20,.78),rgba(3,13,10,.94));
}
.value-card span{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:23px;
  border-radius:14px;
  color:#021009;
  background:linear-gradient(135deg,var(--green),var(--gold));
  font-family:Oxanium,Segoe UI,sans-serif;
  font-weight:900;
}
.value-card h3{
  margin:0 0 10px;
  font-size:20px;
}
.value-card p{
  margin:0;
  color:#91a69a;
  font-size:13px;
  line-height:1.72;
}
.about-timeline{
  display:grid;
  gap:14px;
}
.about-timeline-item{
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:22px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.022);
}
.about-timeline-item strong{
  color:var(--green);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:18px;
}
.about-timeline-item h3{
  margin:0 0 7px;
  font-size:18px;
}
.about-timeline-item p{
  margin:0;
  color:#91a59a;
  font-size:13px;
  line-height:1.7;
}
.contact-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:30px;
  padding:40px;
  border:1px solid rgba(88,240,170,.2);
  border-radius:25px;
  background:
    radial-gradient(circle at 80% 40%,rgba(88,240,170,.1),transparent 27%),
    linear-gradient(145deg,rgba(8,28,20,.94),rgba(2,10,7,.99));
  box-shadow:var(--shadow);
}
.contact-panel h2{
  margin:0 0 12px;
  font-size:clamp(29px,3.5vw,45px);
}
.contact-panel p{
  margin:0;
  color:#a4b8ac;
  line-height:1.78;
}
.contact-panel .btn{
  min-width:230px;
}

@media(max-width:980px){
  .release-entry{grid-template-columns:1fr}
  .release-date{
    min-height:260px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .about-story-grid{grid-template-columns:1fr}
  .about-portrait{min-height:520px}
  .values-grid{grid-template-columns:1fr 1fr}
  .contact-panel{grid-template-columns:1fr}
  .contact-panel .btn{width:100%}
}
@media(max-width:720px){
  .release-hero,
  .about-hero{min-height:680px}
  .release-hero::before{
    background:
      linear-gradient(180deg,rgba(2,8,6,.22),rgba(2,8,6,.98) 70%),
      url("../img/arqvium/capa.webp") center/cover no-repeat;
  }
  .about-hero::before{
    background:
      linear-gradient(180deg,rgba(2,8,6,.2),rgba(2,8,6,.98) 69%),
      var(--about-photo) center 24%/cover no-repeat;
  }
  .release-hero-content,
  .about-hero-content{
    padding:310px 0 68px;
    text-align:center;
  }
  .release-hero h1,
  .about-hero h1{
    font-size:49px;
    line-height:.95;
  }
  .release-summary{
    grid-template-columns:1fr;
    max-width:none;
  }
  .about-badges{justify-content:center}
  .release-content{padding:26px 22px}
  .release-topline{flex-direction:column}
  .release-actions{flex-direction:column}
  .release-actions .btn{width:100%}
  .about-story{padding:28px 22px}
  .about-portrait,
  .about-portrait img{min-height:460px}
  .achievement-card{grid-template-columns:1fr}
  .achievement-rank{
    min-height:190px;
    border-right:0;
    border-bottom:1px solid rgba(213,185,124,.14);
  }
  .achievement-copy{padding:28px 22px}
  .values-grid{grid-template-columns:1fr}
  .about-timeline-item{grid-template-columns:1fr;gap:8px}
  .contact-panel{padding:28px 22px}
}


/* ================================================================
   ETAPA 6 — IDENTIDADE FINAL, ACESSIBILIDADE E SEO
================================================================ */
.skip-link{
  position:fixed;
  z-index:9999;
  left:18px;
  top:-90px;
  padding:12px 16px;
  border-radius:11px;
  color:#021009;
  background:linear-gradient(100deg,var(--green-2),var(--cyan));
  font-weight:900;
  text-decoration:none;
  transition:top .2s ease;
}
.skip-link:focus{top:18px}

.brand-logo{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:block;
  border-radius:13px;
  box-shadow:0 0 28px rgba(88,240,170,.12);
}
.brand-copy{
  display:flex;
  flex-direction:column;
  line-height:1;
}
.brand-copy strong{
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:15px;
  letter-spacing:.035em;
}
.brand-copy small{
  margin-top:5px;
  color:var(--green);
  font-size:8px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.footer-brand{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:11px;
}
.footer-logo{
  width:34px;
  height:34px;
  border-radius:10px;
}

:focus-visible{
  outline:3px solid rgba(115,229,223,.82);
  outline-offset:4px;
}
::selection{
  color:#021009;
  background:var(--green);
}
img{height:auto}

.error-page{
  min-height:100vh;
  display:grid;
  align-items:center;
  padding:90px 0;
  position:relative;
  overflow:hidden;
}
.error-page::before{
  content:"404";
  position:absolute;
  right:-2vw;
  top:50%;
  transform:translateY(-50%);
  color:rgba(88,240,170,.035);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:min(42vw,520px);
  font-weight:900;
  line-height:1;
}
.error-card{
  width:min(760px,100%);
  position:relative;
  z-index:2;
  padding:52px;
  border:1px solid var(--line);
  border-radius:28px;
  background:
    radial-gradient(circle at 80% 30%,rgba(88,240,170,.09),transparent 28%),
    linear-gradient(145deg,rgba(8,28,20,.94),rgba(2,10,7,.99));
  box-shadow:var(--shadow);
}
.error-card img{
  width:76px;
  height:76px;
  border-radius:22px;
  margin-bottom:24px;
}
.error-card h1{
  margin:0 0 14px;
  font-size:clamp(42px,7vw,78px);
  line-height:.96;
  letter-spacing:-.055em;
}
.error-card p{
  max-width:630px;
  margin:0;
  color:#a8bbb0;
  font-size:16px;
  line-height:1.8;
}
@media(max-width:720px){
  .brand-copy small{display:none}
  .brand-copy strong{font-size:13px}
  .brand-logo{width:38px;height:38px;flex-basis:38px}
  .error-card{padding:34px 24px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}


/* ================================================================
   ETAPA 8 — EXPERIÊNCIA VISUAL INSPIRADA NO BLOGGER
================================================================ */
:root{
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-smooth:cubic-bezier(.22,.61,.36,1);
}
html{background:#020806}
body{overflow-x:hidden}
body::before{
  animation:satGridDrift 24s linear infinite;
}
body.sat-ready main,
body.sat-ready .site-header,
body.sat-ready .footer{opacity:1}
body:not(.sat-ready) main,
body:not(.sat-ready) .site-header,
body:not(.sat-ready) .footer{opacity:0}
main,.site-header,.footer{transition:opacity .45s ease}

/* PRELOADER */
.sat-preloader{
  position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
  background:
    radial-gradient(circle at 50% 45%,rgba(33,245,154,.12),transparent 24%),
    #020806;
  transition:opacity .65s ease,visibility .65s ease;
}
.sat-preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.sat-preloader-inner{text-align:center}
.sat-preloader-orbit{
  width:128px;height:128px;display:grid;place-items:center;position:relative;margin:auto;
}
.sat-preloader-orbit::before,
.sat-preloader-orbit::after{
  content:"";position:absolute;inset:7px;border:1px solid rgba(88,240,170,.38);border-radius:50%;
  animation:satOrbit 2.8s linear infinite;
}
.sat-preloader-orbit::after{inset:18px;border-color:rgba(213,185,124,.34);animation-direction:reverse;animation-duration:2s}
.sat-preloader-orbit img{width:76px;height:76px;border-radius:22px;filter:drop-shadow(0 0 24px rgba(88,240,170,.32))}
.sat-preloader strong{display:block;margin-top:18px;color:var(--white);font:800 13px/1 Oxanium,Segoe UI,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.sat-preloader span{display:block;margin-top:8px;color:var(--green);font-size:9px;letter-spacing:.16em;text-transform:uppercase}

/* AMBIENTE */
.sat-ambient{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#sat-particles{position:absolute;inset:0;width:100%;height:100%;opacity:.7}
.sat-noise{position:absolute;inset:-40%;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");animation:satNoise 1s steps(2) infinite}
.sat-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.14;animation:satOrbFloat 18s ease-in-out infinite alternate}
.sat-orb.one{width:420px;height:420px;left:-170px;top:12%;background:#21f59a}
.sat-orb.two{width:360px;height:360px;right:-150px;top:42%;background:#4fe3e6;animation-delay:-7s}
.sat-orb.three{width:300px;height:300px;left:38%;bottom:-180px;background:#d5b97c;animation-delay:-12s}
.sat-lasers{position:absolute;inset:0;overflow:hidden;opacity:.28}
.sat-lasers i{position:absolute;top:-30vh;width:1px;height:160vh;background:linear-gradient(to bottom,transparent,rgba(88,240,170,.55),transparent);animation:satLaserFall 12s linear infinite}
.sat-lasers i:nth-child(1){left:12%;animation-delay:-3s}.sat-lasers i:nth-child(2){left:37%;animation-delay:-8s;opacity:.45}.sat-lasers i:nth-child(3){left:64%;animation-delay:-5s}.sat-lasers i:nth-child(4){left:88%;animation-delay:-10s;opacity:.35}
.sat-spores{position:absolute;inset:0}
.sat-spores i{position:absolute;width:4px;height:4px;border-radius:50%;background:rgba(157,255,211,.55);box-shadow:0 0 10px rgba(88,240,170,.38);animation:satSpore 14s linear infinite}
.sat-spores i:nth-child(1){left:8%;top:92%;animation-delay:-2s}.sat-spores i:nth-child(2){left:17%;top:80%;animation-delay:-8s}.sat-spores i:nth-child(3){left:29%;top:95%;animation-delay:-5s}.sat-spores i:nth-child(4){left:43%;top:88%;animation-delay:-11s}.sat-spores i:nth-child(5){left:56%;top:93%;animation-delay:-4s}.sat-spores i:nth-child(6){left:67%;top:82%;animation-delay:-9s}.sat-spores i:nth-child(7){left:78%;top:96%;animation-delay:-6s}.sat-spores i:nth-child(8){left:91%;top:86%;animation-delay:-12s}
.sat-cursor-glow{position:fixed;z-index:2;left:-500px;top:-500px;width:340px;height:340px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(33,245,154,.09),rgba(33,245,154,.025) 34%,transparent 70%);transform:translate(-50%,-50%);mix-blend-mode:screen}

/* CABEÇALHO */
.site-header{transition:background .3s ease,border-color .3s ease,box-shadow .3s ease,opacity .45s ease}
.site-header.sat-scrolled{background:rgba(1,7,4,.94);border-color:rgba(88,240,170,.2);box-shadow:0 18px 55px rgba(0,0,0,.38)}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--green),var(--cyan),var(--gold),transparent);background-size:220% 100%;animation:satHeaderFlow 8s linear infinite;opacity:.72}
.nav-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.search-toggle{min-height:42px;display:inline-flex;align-items:center;gap:9px;padding:0 11px;border:1px solid rgba(88,240,170,.18);border-radius:12px;color:#b8cbbf;background:rgba(255,255,255,.025);cursor:pointer;position:relative;overflow:hidden;transition:.25s ease}
.search-toggle:hover{color:var(--white);border-color:rgba(88,240,170,.4);background:rgba(88,240,170,.08);box-shadow:0 0 24px rgba(88,240,170,.1)}
.search-toggle svg,.search-field svg,.search-page-field svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.search-toggle span{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.search-toggle kbd{padding:4px 6px;border:1px solid rgba(255,255,255,.08);border-radius:6px;color:#7f9387;background:rgba(0,0,0,.22);font:700 8px/1 Inter,Segoe UI,sans-serif}
.menu-toggle{position:relative;display:none;align-content:center;justify-items:center;gap:5px}
.menu-toggle span{width:20px;height:2px;border-radius:2px;background:currentColor;transition:.25s ease}
.menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* HERO VIVO */
.hero,.games-showcase-hero,.detail-hero,.release-hero,.about-hero{--hero-x:50%;--hero-y:50%}
.hero::after,.games-showcase-hero::after,.detail-hero::after,.release-hero::after,.about-hero::after{background:radial-gradient(circle at var(--hero-x) var(--hero-y),rgba(88,240,170,.17),transparent 28%);transition:background-position .25s ease}
.hero-content,.games-showcase-content,.detail-hero-content,.release-hero-content,.about-hero-content{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.hero-content.is-visible,.games-showcase-content.is-visible,.detail-hero-content.is-visible,.release-hero-content.is-visible,.about-hero-content.is-visible{opacity:1;transform:none}
.hero h1 span,.games-showcase-content h1 span,.detail-hero h1 span,.release-hero h1 span,.about-hero h1 span,.search-page-hero h1 span{background-size:220% 100%;animation:satTitleShimmer 7s linear infinite}
.hero-live-line{display:flex;align-items:center;gap:10px;margin-top:22px;color:#91a89c;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.hero-live-line::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(88,240,170,.5);animation:satPulse 2s ease-out infinite}
.hero-live-line strong{color:var(--green);min-width:170px}

/* REVEAL */
.sat-reveal{opacity:0;transform:translateY(34px);transition:opacity .75s var(--ease-out) var(--sat-delay,0ms),transform .75s var(--ease-out) var(--sat-delay,0ms)}
.sat-reveal.sat-from-left{transform:translateX(-38px)}
.sat-reveal.sat-from-right{transform:translateX(38px)}
.sat-reveal.is-visible{opacity:1;transform:none}

/* CARDS: VIVOS, SEM TRANSFORMAR O CONTAINER GRANDE */
.game-card,.feature,.catalog-card,.detail-panel,.detail-feature,.release-entry,.value-card,.contact-panel,.games-future-card,.game-cinematic{transition:border-color .32s ease,box-shadow .32s ease,background .32s ease}
.game-card:hover,.feature:hover,.catalog-card:hover,.detail-panel:hover,.detail-feature:hover,.release-entry:hover,.value-card:hover,.contact-panel:hover,.games-future-card:hover,.game-cinematic:hover{border-color:rgba(88,240,170,.36);box-shadow:0 28px 80px rgba(0,0,0,.52),0 0 30px rgba(88,240,170,.075)}
.game-card,.feature,.catalog-card,.detail-panel,.detail-feature,.release-entry,.value-card,.contact-panel,.games-future-card,.game-cinematic{transform:none!important;contain:layout paint}
.game-card:hover,.feature:hover,.catalog-card:hover,.detail-panel:hover,.detail-feature:hover,.release-entry:hover,.value-card:hover,.contact-panel:hover,.games-future-card:hover,.game-cinematic:hover{transform:none!important}
.game-cinematic-media,.game-cinematic-body,.games-filter-shell{transform:none!important;backface-visibility:visible!important}
.game-cinematic::before,.game-cinematic::after,.games-filter-shell::before,.games-filter-shell::after{display:none!important;content:none!important}
.game-cinematic-media img,.game-image img,.catalog-cover img,.gallery-main img,.gallery-stack img{transition:transform .75s var(--ease-out),filter .4s ease}
.game-cinematic:hover .game-cinematic-media img,.game-card:hover .game-image img,.catalog-card:hover .catalog-cover img{transform:scale(1.035);filter:saturate(1.08) contrast(1.03)}
.game-cinematic-title,.game-card h3,.catalog-body h2{transition:color .28s ease,text-shadow .28s ease}
.game-cinematic:hover .game-cinematic-title,.game-card:hover h3,.catalog-card:hover h2{color:#d7fff0;text-shadow:0 0 18px rgba(88,240,170,.1)}
.game-status,.catalog-platform,.game-cinematic-platform,.release-status{animation:satBadgeGlow 3.8s ease-in-out infinite}
.filter-btn,.btn{position:relative;overflow:hidden;isolation:isolate}
.filter-btn::before,.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 120%,rgba(255,255,255,.18),transparent 48%);opacity:0;transition:opacity .25s ease;pointer-events:none}
.filter-btn:hover::before,.btn:hover::before{opacity:1}
.filter-btn::after,.btn::after,.search-toggle::after{display:none!important;content:none!important}

/* SEARCH */
.is-search-open{overflow:hidden}
.search-modal{position:fixed;z-index:500;inset:0;display:grid;place-items:start center;padding:8vh 18px 28px;visibility:hidden;opacity:0;transition:.25s ease}
.search-modal.open{visibility:visible;opacity:1}
.search-backdrop{position:absolute;inset:0;background:rgba(0,5,3,.82);backdrop-filter:blur(14px)}
.search-dialog{width:min(880px,100%);max-height:84vh;overflow:auto;position:relative;z-index:2;padding:28px;border:1px solid rgba(88,240,170,.24);border-radius:25px;background:radial-gradient(circle at 82% 10%,rgba(88,240,170,.09),transparent 25%),linear-gradient(145deg,rgba(7,25,18,.99),rgba(2,10,7,.995));box-shadow:0 45px 150px rgba(0,0,0,.76);transform:translateY(-24px) scale(.975);transition:transform .36s var(--ease-out)}
.search-modal.open .search-dialog{transform:none}
.search-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.search-dialog-header h2{margin:3px 0 0;font-size:clamp(28px,4vw,43px)}
.search-close{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:13px;color:var(--white);background:rgba(255,255,255,.03);cursor:pointer;font-size:26px;transition:.25s ease}.search-close:hover{color:#021009;border-color:transparent;background:var(--green);transform:rotate(6deg)}
.search-field{min-height:62px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;margin-top:24px;padding:0 17px;border:1px solid rgba(88,240,170,.2);border-radius:17px;background:rgba(0,0,0,.2);color:var(--green)}
.search-field:focus-within{border-color:rgba(88,240,170,.52);box-shadow:0 0 0 4px rgba(88,240,170,.07)}
.search-field input{min-width:0;width:100%;border:0;outline:0;color:var(--white);background:transparent;font-size:17px}.search-field input::placeholder{color:#71877a}.search-field kbd{padding:6px 8px;border:1px solid rgba(255,255,255,.08);border-radius:7px;color:#7f9387;background:rgba(255,255,255,.025);font:700 9px/1 Inter,Segoe UI,sans-serif}
.search-dialog-meta{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:13px 2px 22px;color:#71877a;font-size:10px;letter-spacing:.055em;text-transform:uppercase}.search-dialog-meta a{color:var(--green);text-decoration:none}
.search-results{display:grid;gap:10px}.search-results-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:3px;padding:0 3px}.search-results-heading strong{color:#c9dace;font:800 12px/1 Oxanium,Segoe UI,sans-serif;letter-spacing:.07em;text-transform:uppercase}.search-results-heading span{color:#71877a;font-size:10px}
.search-result-card{display:grid;grid-template-columns:82px minmax(0,1fr) auto;align-items:center;gap:17px;min-height:88px;padding:8px 15px 8px 8px;border:1px solid rgba(255,255,255,.055);border-radius:16px;color:inherit;background:rgba(255,255,255,.022);text-decoration:none;opacity:0;transform:translateY(9px);animation:satSearchIn .38s var(--ease-out) forwards;animation-delay:var(--search-delay,0ms);transition:.25s ease}.search-result-card:hover{border-color:rgba(88,240,170,.27);background:rgba(88,240,170,.045)}
.search-result-image{width:82px;height:70px;overflow:hidden;border-radius:12px;background:#07140f}.search-result-image img{width:100%;height:100%;object-fit:cover}.search-result-copy{min-width:0;display:flex;flex-direction:column}.search-result-copy small{color:var(--green);font-size:8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.search-result-copy strong{margin-top:4px;overflow:hidden;color:var(--white);font:800 15px/1.2 Oxanium,Segoe UI,sans-serif;text-overflow:ellipsis;white-space:nowrap}.search-result-copy span{margin-top:5px;overflow:hidden;color:#8fa398;font-size:11px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.search-result-arrow{color:var(--green);font-size:20px}.search-empty{padding:42px 24px;border:1px dashed rgba(88,240,170,.16);border-radius:18px;text-align:center}.search-empty span{color:var(--green);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.search-empty h3{margin:9px 0 7px}.search-empty p{max-width:520px;margin:auto;color:#83998d;font-size:12px;line-height:1.7}
.search-page-hero{padding:120px 0 80px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.search-page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 73% 30%,rgba(88,240,170,.13),transparent 27%),linear-gradient(180deg,rgba(2,8,6,.05),rgba(2,8,6,.92)),url("../img/tercetri/background.webp") center/cover no-repeat;opacity:.7}.search-page-hero .container{position:relative;z-index:2}.search-page-hero h1{margin:22px 0 16px;font-size:clamp(50px,8vw,100px);line-height:.91;letter-spacing:-.065em;text-transform:uppercase}.search-page-hero h1 span{display:block;color:transparent;-webkit-background-clip:text;background-clip:text}.search-page-hero p{max-width:720px;margin:0;color:#b7c9be;font-size:17px;line-height:1.8}
.search-page-panel{padding:28px;border:1px solid var(--line);border-radius:25px;background:linear-gradient(145deg,rgba(8,28,20,.9),rgba(2,10,7,.98));box-shadow:var(--shadow)}.search-page-field{min-height:68px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:0 18px;border:1px solid rgba(88,240,170,.23);border-radius:17px;color:var(--green);background:rgba(0,0,0,.2)}.search-page-field input{min-width:0;width:100%;border:0;outline:0;color:var(--white);background:transparent;font-size:17px}.search-page-field button{width:36px;height:36px;border:0;border-radius:10px;color:#8ba095;background:rgba(255,255,255,.035);cursor:pointer;font-size:23px}.search-page-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:13px 3px 26px;color:#7c9185;font-size:10px;letter-spacing:.05em;text-transform:uppercase}.search-results-page{grid-template-columns:repeat(2,minmax(0,1fr))}.search-results-page .search-results-heading{grid-column:1/-1}.search-results-page .search-result-card{grid-template-columns:92px minmax(0,1fr) auto}

/* SCROLL */
.sat-scroll-progress{position:fixed;z-index:1000;left:0;top:0;width:100%;height:3px;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,var(--green-2),var(--cyan),var(--gold));box-shadow:0 0 16px rgba(88,240,170,.45)}
.back-to-top{width:46px;height:46px;display:grid;place-items:center;position:fixed;z-index:180;right:20px;bottom:20px;border:1px solid rgba(88,240,170,.23);border-radius:14px;color:var(--green);background:rgba(3,15,11,.9);backdrop-filter:blur(10px);box-shadow:0 16px 45px rgba(0,0,0,.35);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(14px);transition:.3s var(--ease-out)}.back-to-top.visible{opacity:1;visibility:visible;transform:none}.back-to-top:hover{color:#021009;border-color:transparent;background:var(--green);transform:translateY(-4px)}

@keyframes satOrbit{to{transform:rotate(360deg)}}
@keyframes satNoise{0%{transform:translate(0,0)}25%{transform:translate(3%,-2%)}50%{transform:translate(-2%,3%)}75%{transform:translate(2%,2%)}100%{transform:translate(0,0)}}
@keyframes satOrbFloat{0%{transform:translate3d(-4%,-3%,0) scale(.92)}100%{transform:translate3d(8%,7%,0) scale(1.08)}}
@keyframes satLaserFall{0%{transform:translateY(-25%) scaleY(.8);opacity:0}15%{opacity:.7}85%{opacity:.45}100%{transform:translateY(35%) scaleY(1.1);opacity:0}}
@keyframes satSpore{0%{transform:translateY(0) scale(.8);opacity:0}15%{opacity:.65}80%{opacity:.45}100%{transform:translateY(-115vh) translateX(30px) scale(1.3);opacity:0}}
@keyframes satGridDrift{to{background-position:72px 72px}}
@keyframes satHeaderFlow{to{background-position:220% 0}}
@keyframes satTitleShimmer{to{background-position:220% 0}}
@keyframes satPulse{0%{box-shadow:0 0 0 0 rgba(88,240,170,.5)}75%,100%{box-shadow:0 0 0 11px rgba(88,240,170,0)}}
@keyframes satBadgeGlow{0%,100%{box-shadow:0 0 0 rgba(88,240,170,0)}50%{box-shadow:0 0 18px rgba(88,240,170,.11)}}
@keyframes satSearchIn{to{opacity:1;transform:none}}

@media(max-width:1040px){.search-toggle{width:42px;justify-content:center;padding:0}.search-toggle span,.search-toggle kbd{display:none}}
@media(max-width:720px){
  .menu-toggle{display:grid}.nav-actions{gap:7px}.sat-lasers{opacity:.15}.sat-orb{opacity:.09}.sat-cursor-glow{display:none}
  .search-modal{padding:14px 10px}.search-dialog{max-height:calc(100vh - 28px);padding:20px 14px;border-radius:19px}.search-dialog-header h2{font-size:27px}.search-field{min-height:57px;padding:0 12px}.search-field input{font-size:15px}.search-field kbd{display:none}.search-dialog-meta{align-items:flex-start;flex-direction:column;margin-bottom:17px}.search-result-card{grid-template-columns:68px minmax(0,1fr) auto;gap:12px}.search-result-image{width:68px;height:62px}.search-result-copy span{display:none}.search-page-hero{padding:100px 0 66px}.search-page-hero h1{font-size:48px}.search-page-panel{padding:18px 12px}.search-page-field{min-height:59px;padding:0 12px}.search-page-meta{align-items:flex-start;flex-direction:column}.search-results-page{grid-template-columns:1fr}.back-to-top{right:14px;bottom:14px}.hero-live-line{justify-content:center;flex-wrap:wrap}.hero-live-line strong{min-width:0}
}
@media(prefers-reduced-motion:reduce){
  body::before,.sat-preloader-orbit::before,.sat-preloader-orbit::after,.sat-noise,.sat-orb,.sat-lasers i,.sat-spores i,.site-header::after,.hero h1 span,.games-showcase-content h1 span,.detail-hero h1 span,.release-hero h1 span,.about-hero h1 span,.game-status,.catalog-platform,.game-cinematic-platform,.release-status{animation:none!important}
  .sat-reveal,.hero-content,.games-showcase-content,.detail-hero-content,.release-hero-content,.about-hero-content,.search-result-card{opacity:1!important;transform:none!important}
}


/* ================================================================
   ETAPA 8.1 — IMAGENS DOS CARDS DE LANÇAMENTOS
================================================================ */
.release-date{
  isolation:isolate;
  background:#03110b !important;
}

.release-date-image{
  width:100%;
  height:100%;
  position:absolute;
  z-index:0;
  inset:0;
  display:block;
  object-fit:cover;
  object-position:center;
  opacity:.82;
  filter:saturate(.92) contrast(1.06) brightness(.78);
  transform:scale(1.002);
  transition:
    transform .65s cubic-bezier(.16,1,.3,1),
    filter .4s ease,
    opacity .4s ease;
}

.release-date::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(2,8,6,.08),rgba(2,8,6,.84)),
    linear-gradient(90deg,rgba(2,8,6,.18),transparent 60%);
}

.release-date::after{
  z-index:1 !important;
  pointer-events:none;
}

.release-date > :not(.release-date-image){
  position:relative;
  z-index:2;
}

.release-entry:hover .release-date-image{
  opacity:.94;
  filter:saturate(1.04) contrast(1.08) brightness(.9);
  transform:scale(1.055);
}

/* Ajustes específicos de enquadramento. */
.release-entry:nth-child(1) .release-date-image{
  object-position:center 42%;
}

.release-entry:nth-child(2) .release-date-image{
  object-position:center 48%;
}

.release-entry:nth-child(3) .release-date-image{
  object-position:center 42%;
}

@media(max-width:980px){
  .release-date-image{
    object-position:center 38%;
  }

  .release-entry:nth-child(2) .release-date-image{
    object-position:center 45%;
  }
}


/* ================================================================
   ETAPA 8.2 — FILTROS DA PÁGINA JOGOS
================================================================ */
.game-cinematic{
  transition:
    opacity .18s ease,
    transform .18s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.game-cinematic.filter-leave{
  opacity:0 !important;
  transform:translateY(8px) scale(.992) !important;
  pointer-events:none;
}

.game-cinematic.hidden{
  display:none !important;
}

.filter-btn[aria-pressed="true"]{
  color:#021009;
  border-color:transparent;
  background:linear-gradient(100deg,var(--green-2),var(--cyan));
  box-shadow:0 12px 30px rgba(31,213,135,.16);
}

@media(prefers-reduced-motion:reduce){
  .game-cinematic.filter-leave{
    transition:none !important;
  }
}


/* ================================================================
   ETAPA 8.3 — CABEÇALHOS ÚNICOS POR PÁGINA
================================================================ */
.header-unique{
  --header-accent:var(--green);
  --header-accent-2:var(--cyan);
  --header-glow:rgba(88,240,170,.18);
  min-height:78px;
  border-bottom-color:color-mix(in srgb,var(--header-accent) 30%,transparent);
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--header-accent) 5%,transparent),transparent 36%),
    rgba(1,8,5,.91);
}

.header-unique::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 13% 50%,var(--header-glow),transparent 22%),
    linear-gradient(90deg,transparent 48%,color-mix(in srgb,var(--header-accent) 4%,transparent),transparent 75%);
  opacity:.8;
}

.header-unique::after{
  background:linear-gradient(
    90deg,
    transparent,
    var(--header-accent),
    var(--header-accent-2),
    transparent
  );
}

.header-unique .nav{
  min-height:78px;
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);
  align-items:center;
  gap:24px;
}

.header-unique .nav-links{
  justify-self:center;
}

.header-unique .nav-links a.active{
  color:#021009;
  background:linear-gradient(100deg,var(--header-accent),var(--header-accent-2));
  box-shadow:0 10px 28px var(--header-glow);
}

.header-unique .nav-actions{
  justify-self:end;
}

.header-section-brand,
.header-person,
.header-game-identity{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  z-index:2;
  color:inherit;
  text-decoration:none;
}

.header-section-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  line-height:1.05;
}

.header-section-copy small{
  overflow:hidden;
  color:var(--header-accent);
  font-size:8px;
  font-weight:900;
  letter-spacing:.14em;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}

.header-section-copy strong{
  max-width:230px;
  margin-top:6px;
  overflow:hidden;
  color:var(--white);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-size:15px;
  letter-spacing:.015em;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.header-emblem{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--header-accent) 35%,transparent);
  border-radius:15px;
  color:var(--header-accent);
  background:
    radial-gradient(circle,color-mix(in srgb,var(--header-accent) 17%,transparent),transparent 67%),
    rgba(255,255,255,.025);
  box-shadow:0 0 28px var(--header-glow);
  font-family:Oxanium,Segoe UI,sans-serif;
  font-weight:900;
}

.header-emblem-number::after{
  content:"";
  position:absolute;
  right:-10px;
  bottom:-10px;
  width:27px;
  height:27px;
  border:1px solid var(--header-accent);
  transform:rotate(45deg);
  opacity:.35;
}

.header-emblem-radar i{
  position:absolute;
  border:1px solid currentColor;
  border-radius:50%;
  opacity:.48;
  animation:headerRadar 2.8s ease-out infinite;
}

.header-emblem-radar i:nth-child(1){width:10px;height:10px}
.header-emblem-radar i:nth-child(2){width:24px;height:24px;animation-delay:.5s}
.header-emblem-radar i:nth-child(3){width:38px;height:38px;animation-delay:1s}

.header-emblem-search svg{
  width:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
}

.header-chip,
.header-live{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 11px;
  border:1px solid color-mix(in srgb,var(--header-accent) 23%,transparent);
  border-radius:999px;
  color:color-mix(in srgb,var(--header-accent) 78%,white);
  background:color-mix(in srgb,var(--header-accent) 5%,transparent);
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
}

.header-live i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--header-accent);
  box-shadow:0 0 13px var(--header-accent);
  animation:headerStatusPulse 1.8s ease-out infinite;
}

.header-avatar,
.header-game-thumb{
  width:48px;
  height:48px;
  flex:0 0 48px;
  overflow:hidden;
  position:relative;
  border:1px solid color-mix(in srgb,var(--header-accent) 40%,transparent);
  border-radius:15px;
  background:#06100c;
  box-shadow:0 0 26px var(--header-glow);
}

.header-avatar img,
.header-game-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.header-avatar img{object-position:center 25%}

.header-back{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--header-accent) 25%,transparent);
  border-radius:11px;
  color:var(--header-accent);
  background:rgba(255,255,255,.025);
  text-decoration:none;
  transition:.25s ease;
}

.header-back:hover{
  color:#021009;
  border-color:transparent;
  background:var(--header-accent);
  transform:translateX(-3px);
}

.header-game-cta{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border:1px solid transparent;
  border-radius:11px;
  color:#021009;
  background:linear-gradient(100deg,var(--header-accent),var(--header-accent-2));
  box-shadow:0 12px 28px var(--header-glow);
  font-size:9px;
  font-weight:900;
  letter-spacing:.07em;
  text-decoration:none;
  text-transform:uppercase;
  transition:.25s ease;
  white-space:nowrap;
}

.header-game-cta:hover{
  transform:translateY(-3px);
  filter:brightness(1.08);
}

/* INÍCIO — identidade institucional */
.header-home{
  --header-accent:#58f0aa;
  --header-accent-2:#d5b97c;
  --header-glow:rgba(88,240,170,.17);
}

.header-home .header-home-brand{
  position:relative;
}

.header-home .header-home-brand::after{
  content:"STUDIO";
  position:absolute;
  left:54px;
  bottom:-9px;
  color:rgba(213,185,124,.45);
  font-size:7px;
  font-weight:900;
  letter-spacing:.34em;
}

/* JOGOS — interface de catálogo */
.header-catalog{
  --header-accent:#5ff0cf;
  --header-accent-2:#6ec9ff;
  --header-glow:rgba(95,240,207,.19);
  background:
    linear-gradient(90deg,rgba(95,240,207,.07),transparent 30%),
    repeating-linear-gradient(90deg,transparent 0 75px,rgba(95,240,207,.018) 76px),
    rgba(1,8,6,.93);
}

.header-catalog .header-emblem{
  clip-path:polygon(14% 0,100% 0,100% 72%,72% 100%,0 100%,0 14%);
}

/* LANÇAMENTOS — radar e cronologia */
.header-releases{
  --header-accent:#e3bf76;
  --header-accent-2:#58f0aa;
  --header-glow:rgba(227,191,118,.18);
  background:
    linear-gradient(90deg,rgba(227,191,118,.07),transparent 34%),
    rgba(7,8,4,.94);
}

.header-releases::before{
  background:
    repeating-linear-gradient(90deg,transparent 0 104px,rgba(227,191,118,.025) 105px),
    radial-gradient(circle at 13% 50%,rgba(227,191,118,.14),transparent 22%);
}

.header-live-gold{
  border-color:rgba(227,191,118,.25);
  color:#e7cf9f;
  background:rgba(227,191,118,.045);
}

/* SOBRE — perfil humano */
.header-about{
  --header-accent:#9ce8c8;
  --header-accent-2:#d5b97c;
  --header-glow:rgba(156,232,200,.17);
  background:
    linear-gradient(90deg,rgba(156,232,200,.065),transparent 34%),
    rgba(2,9,6,.93);
}

.header-about .header-avatar{
  border-radius:50%;
}

.header-about .header-avatar::after{
  content:"";
  position:absolute;
  inset:2px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
}

/* BUSCA — navegação global */
.header-search{
  --header-accent:#b99aff;
  --header-accent-2:#65e5de;
  --header-glow:rgba(185,154,255,.18);
  background:
    linear-gradient(90deg,rgba(185,154,255,.07),transparent 34%),
    rgba(5,4,12,.94);
}

/* PÁGINAS DOS JOGOS */
.header-game{
  min-height:82px;
}

.header-game .nav{
  min-height:82px;
  grid-template-columns:minmax(300px,1fr) auto minmax(280px,1fr);
}

.header-game-valkyrie{
  --header-accent:#59c9ff;
  --header-accent-2:#58f0aa;
  --header-glow:rgba(89,201,255,.2);
  background:
    linear-gradient(90deg,rgba(89,201,255,.09),transparent 33%),
    rgba(2,7,15,.95);
}

.header-game-valkyrie::before{
  background:
    linear-gradient(90deg,rgba(3,12,27,.1),transparent 45%),
    repeating-linear-gradient(90deg,transparent 0 88px,rgba(89,201,255,.022) 89px);
}

.header-game-tercetri{
  --header-accent:#55e5ce;
  --header-accent-2:#d5b97c;
  --header-glow:rgba(85,229,206,.19);
  background:
    linear-gradient(90deg,rgba(85,229,206,.08),transparent 36%),
    rgba(2,11,8,.95);
}

.header-game-tercetri .header-game-thumb{
  border-radius:50% 50% 14px 14px;
}

.header-game-observer{
  --header-accent:#ff768a;
  --header-accent-2:#67dacf;
  --header-glow:rgba(255,118,138,.18);
  background:
    linear-gradient(90deg,rgba(255,118,138,.075),transparent 35%),
    repeating-linear-gradient(0deg,transparent 0 7px,rgba(255,118,138,.013) 8px),
    rgba(10,3,6,.96);
}

.header-game-observer .header-section-copy strong{
  letter-spacing:.06em;
}

.header-game-observer .header-game-thumb{
  filter:grayscale(.15) contrast(1.08);
}

/* Estados ao rolar */
.header-unique.sat-scrolled{
  background-color:rgba(1,7,4,.975);
}

@keyframes headerRadar{
  0%{transform:scale(.35);opacity:.85}
  100%{transform:scale(1.12);opacity:0}
}

@keyframes headerStatusPulse{
  0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--header-accent) 55%,transparent)}
  75%,100%{box-shadow:0 0 0 9px transparent}
}

/* TABLET */
@media(max-width:1120px){
  .header-unique .nav{
    grid-template-columns:minmax(210px,1fr) auto minmax(170px,1fr);
    gap:14px;
  }

  .header-chip,
  .header-live{
    display:none;
  }

  .header-game .nav{
    grid-template-columns:minmax(260px,1fr) auto minmax(150px,1fr);
  }

  .header-game-cta{
    display:none;
  }
}

/* MENU COMPACTO ANTES DO CELULAR */
@media(max-width:920px){
  .header-unique .nav{
    min-height:72px;
    display:flex;
  }

  .header-unique .nav-links{
    display:none;
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    right:0;
    padding:12px;
    flex-direction:column;
    align-items:stretch;
    border:1px solid color-mix(in srgb,var(--header-accent) 25%,transparent);
    border-radius:17px;
    background:rgba(2,12,8,.985);
    box-shadow:0 28px 75px rgba(0,0,0,.55);
  }

  .header-unique .nav-links.open{
    display:flex;
  }

  .header-unique .nav-links a{
    text-align:center;
  }

  .header-unique .nav-actions{
    margin-left:auto;
  }

  .header-unique .menu-toggle{
    display:grid;
  }
}

/* CELULAR */
@media(max-width:620px){
  .header-unique,
  .header-game{
    min-height:66px;
  }

  .header-unique .nav,
  .header-game .nav{
    min-height:66px;
    gap:9px;
  }

  .header-section-copy small,
  .header-home .brand-copy small{
    display:none;
  }

  .header-section-copy strong{
    max-width:150px;
    margin-top:0;
    font-size:12px;
  }

  .header-home .header-home-brand::after{
    display:none;
  }

  .header-emblem,
  .header-avatar,
  .header-game-thumb{
    width:40px;
    height:40px;
    flex-basis:40px;
    border-radius:12px;
  }

  .header-home .brand-logo{
    width:38px;
    height:38px;
  }

  .header-back{
    width:32px;
    height:32px;
    flex-basis:32px;
  }

  .header-game-identity{
    gap:7px;
  }

  .header-game .header-section-copy strong{
    max-width:115px;
  }

  .header-unique .search-toggle{
    width:40px;
    min-width:40px;
    min-height:40px;
  }

  .header-unique .menu-toggle{
    width:40px;
    height:40px;
  }
}

@media(prefers-reduced-motion:reduce){
  .header-emblem-radar i,
  .header-live i{
    animation:none!important;
  }
}