/* IAGO GAMES V16 — vidro cinematografico / vibracao contida / mobile-first */
:root {
  --ig-amber:#ffa51e;
  --ig-gold:#ffbf36;
  --ig-plum:#16021d;
  --ig-pink:#ea52cc;
  --ig-edge:rgba(242,103,234,.34);
}

/* Brilho de vitrine: ao passar o cursor, uma pelicula de vidro cruza a arte. */
.cover-art { isolation:isolate; position:relative; overflow:hidden; }
.cover-art img:not(.iago-fill) { position:relative; z-index:1; }
.cover-art::before {
  content:""; position:absolute; z-index:3; pointer-events:none;
  inset:-20% -105%;
  background:linear-gradient(108deg,
     transparent 37%,rgba(255,255,255,.025) 42%,
     rgba(255,255,255,.30) 49%,rgba(255,224,185,.08) 52%,transparent 58%);
  transform:translate3d(-60%,0,0) skewX(-10deg);
  transition:transform .75s cubic-bezier(.2,.75,.15,1);
}
.cover-art::after {
  content:""; position:absolute; z-index:2; pointer-events:none; inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,245,255,.15),inset 0 14px 25px rgba(255,255,255,.055),inset 0 -24px 34px rgba(4,0,12,.27);
}
.catalog-card:hover .cover-art::before,
.cover-card:hover .cover-art::before,
.catalog-card:focus-within .cover-art::before,
.cover-card:focus-within .cover-art::before { transform:translate3d(60%,0,0) skewX(-10deg); }

/* Capa horizontal: fundo difuso discreto sem amputar o material original. */
.cover-art img.iago-fill {
  position:absolute!important;z-index:0!important;inset:-14px;
  width:calc(100% + 28px)!important;height:calc(100% + 28px)!important;
  object-fit:cover!important;object-position:center!important;
  filter:blur(17px) brightness(.42) saturate(1.18)!important;
  transform:scale(1.08)!important;pointer-events:none;
}
.cover-art.iago-has-fill { background:#210b2a; }
.cover-art.iago-has-fill img:not(.iago-fill) {
  box-shadow:0 6px 20px rgba(0,0,0,.23);object-fit:contain;
}

/* Volume e sombras nas bordas, preservando os tons originais da marca. */
.catalog-card {
  --ig-rx:0deg;--ig-ry:0deg;
  transform:perspective(1000px) rotateX(var(--ig-rx)) rotateY(var(--ig-ry));
  border:1px solid rgba(236,114,231,.34);
  background:linear-gradient(150deg,rgba(68,15,70,.80),rgba(25,5,34,.97) 55%,rgba(19,5,30,.98));
  box-shadow:inset 0 1px 0 rgba(255,226,255,.09),0 10px 24px rgba(9,0,15,.3);
  transition:transform .25s ease, border-color .28s ease, box-shadow .32s ease;
  will-change:auto;
}
.catalog-card:hover,.catalog-card:focus-within {
  transform:perspective(1000px) rotateX(var(--ig-rx)) rotateY(var(--ig-ry)) translateY(-5px);
  border-color:rgba(255,153,229,.75);
  box-shadow:0 0 0 1px rgba(255,154,225,.2),0 0 24px rgba(207,52,214,.24),0 23px 39px rgba(8,0,13,.52);
}
.cover-card {
  --ig-rx:0deg;--ig-ry:0deg;
  transform:perspective(950px) rotateX(var(--ig-rx)) rotateY(var(--ig-ry));
  border:1px solid rgba(242,92,239,.83);
  box-shadow:inset 0 0 0 1px rgba(255,226,255,.14),0 0 12px rgba(203,63,216,.40),0 10px 23px rgba(5,0,9,.5);
  transition:transform .24s ease, border-color .25s ease, box-shadow .3s ease;
}
.cover-card:hover,.cover-card:focus-within {
  transform:perspective(950px) rotateX(var(--ig-rx)) rotateY(var(--ig-ry)) translateY(-5px);
  border-color:#ffbd59;
  box-shadow:inset 0 0 0 1px rgba(255,245,255,.27),0 0 18px rgba(238,77,225,.6),0 12px 29px rgba(7,0,12,.65);
}
.card-media .cover-art,.cover-card .cover-art {
  background:linear-gradient(155deg,#34143b,#15051d);
  border:1px solid rgba(255,255,255,.07);
}
.card-meta { color:#ffbe51; }
.card-foot button { box-shadow:0 3px 12px rgba(255,161,26,.13); }
.card-foot button:hover { box-shadow:0 0 17px rgba(255,166,41,.42); }

/* Molduras 'cristal fumê' nos benefícios e ícones desenhados para a marca. */
.benefit {
  justify-content:flex-start;gap:13px;
  position:relative;overflow:hidden; isolation:isolate;
  padding:13px 16px;min-height:78px;
  border:1px solid rgba(243,110,220,.42);
  background:linear-gradient(135deg,rgba(65,17,65,.82),rgba(23,4,34,.96));
  box-shadow:inset 0 1px 0 rgba(255,236,255,.13),0 7px 24px rgba(7,0,15,.26),0 0 15px rgba(215,52,180,.13);
  backdrop-filter:blur(12px);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.benefit::before {
  content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.065),transparent 35%,transparent 65%,rgba(229,92,236,.07));
}
.benefit:hover {
  transform:translateY(-3px);
  border-color:rgba(255,185,113,.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 20px rgba(240,100,213,.22),0 13px 29px rgba(7,0,15,.37);
}
.benefit-icon {
  flex:0 0 49px;width:49px;height:49px;border-radius:14px;
  display:grid;place-items:center;
  color:#ffbc61;
  border:1px solid rgba(255,183,106,.30);
  background:linear-gradient(145deg,rgba(255,180,44,.13),rgba(96,32,77,.2));
  box-shadow:inset 0 1px 0 rgba(255,233,200,.16),0 3px 12px rgba(5,0,12,.25);
  filter:none!important;
}
.benefit:nth-child(2) .benefit-icon {
  color:#f8caff; border-color:rgba(235,137,255,.33);
  background:linear-gradient(145deg,rgba(186,52,251,.15),rgba(88,23,92,.16));
}
.benefit:nth-child(3) .benefit-icon { color:#ffc04e; }
.benefit:nth-child(4) .benefit-icon {
  color:#f3c4e8; border-color:rgba(249,150,228,.3);
  background:linear-gradient(145deg,rgba(250,70,203,.13),rgba(78,22,91,.14));
}
.benefit-icon .iago-service-svg {width:30px!important;height:30px!important;stroke-width:1.7;display:block;filter:drop-shadow(0 0 6px rgba(244,144,208,.21));}
.benefit strong {font-size:17px;line-height:1.1;font-weight:800;}
.benefit small {margin-top:5px;color:#d8c2da;font-size:11px;}

/* Refinamentos de luz nos botoes e secoes, sem excesso. */
.button-orange,.header-cta {
  box-shadow:0 5px 18px rgba(246,143,16,.32),inset 0 1px 0 rgba(255,255,255,.28);
}
.button-orange:hover,.header-cta:hover {
  box-shadow:0 5px 24px rgba(255,167,36,.50),inset 0 1px 0 rgba(255,255,255,.34);
}
.search:focus-within {border-color:rgba(255,191,73,.75);box-shadow:0 0 0 3px rgba(255,170,32,.10),0 0 17px rgba(237,71,217,.28);}
.release-feature,.wide-promo {
  box-shadow:inset 0 1px 0 rgba(255,241,255,.12),0 15px 38px rgba(8,0,12,.32),0 0 24px rgba(211,53,200,.14);
}

@media (max-width:760px) {
  .benefit { min-height:66px;gap:9px;padding:9px; }
  .benefit-icon {flex-basis:38px;width:38px;height:38px;border-radius:11px;}
  .benefit-icon .iago-service-svg {width:25px!important;height:25px!important;}
  .benefit strong{font-size:12px;}
  .benefit small{font-size:9px;}
}
@media (hover:none), (pointer:coarse) {
  .catalog-card,.catalog-card:hover,.cover-card,.cover-card:hover {
    transform:none!important;will-change:auto;
  }
  .cover-art::before{display:none;}
}
@media (prefers-reduced-motion:reduce){
  .cover-art::before{transition:none!important;}
  .catalog-card,.cover-card,.benefit{transition:none!important;transform:none!important;}
}
