/* Página "Instalar o app PlayTVi" (06/10/2026) — complementa acesso-remoto.css */
.ia-hero h1 { font-size: clamp(2rem, 4.2vw, 3.2rem); }
.ia-badge-warn { background: rgba(245, 158, 11, .12); border-color: rgba(245, 158, 11, .4); color: #fcd34d; }
.ia-badge-warn .ar-dot { background: #f59e0b; box-shadow: none; animation: none; }
.ia-hero-dev { position: relative; max-width: 600px; margin: 0 auto; width: 100%; }
.ia-hero-dev .ar-dev { transform: rotate(-2deg); }
.ia-hero-dev .ar-chip { position: absolute; }
.ia-hero-dev .ar-chip.c1 { left: -4%; top: -7%; }
.ia-hero-dev .ar-chip.c2 { right: -3%; bottom: -8%; }
.ia-x { position: absolute; right: 6%; top: 8%; z-index: 3; padding: .35rem .7rem; border-radius: 999px; background: #ef4444; color: #fff; font-weight: 800; font-size: .78rem; box-shadow: 0 8px 24px rgba(239,68,68,.45); }

/* resumo em 3 passos com âncoras */
.ia-steps .ar-step a { color: var(--primary-light); font-weight: 600; font-size: .92rem; display: inline-block; margin-top: .8rem; }
.ia-why { max-width: 900px; margin: 2.2rem auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ia-why div { padding: 1.1rem 1.2rem; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); color: var(--text-secondary); font-size: .93rem; }
.ia-why div strong { display: block; color: var(--text-primary); margin-bottom: .3rem; }

/* outros avisos */
.ia-avisos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.ia-aviso { padding: 1.4rem; border-radius: var(--radius-lg); background: var(--bg-card); border: 1px solid rgba(255,255,255,.06); }
.ia-aviso .q { font-family: Roboto, "Segoe UI", Arial, sans-serif; background: #eef1f6; color: #1f1f1f; border-radius: 12px; padding: .8rem .9rem; font-size: .88rem; margin-bottom: 1rem; line-height: 1.4; }
.ia-aviso .q b { display: block; font-weight: 600; margin-bottom: .2rem; }
.ia-aviso h3 { font-size: 1.05rem; margin: 0 0 .4rem; }
.ia-aviso p { margin: 0; color: var(--text-secondary); font-size: .93rem; }

/* ---------- telas simuladas novas ---------- */
.sx-fundo { background: linear-gradient(160deg, #e9edf3, #cfd6e2); }
.sx-plogo { width: 2.2em; height: 2.2em; border-radius: 22%; display: inline-grid; place-items: center; background: linear-gradient(135deg, #7c3aed, #9333ea); color: #fff; font-weight: 800; flex-shrink: 0; }
.sx-nota { padding: 1.6% 5%; font-size: .8em; color: #b3261e; font-style: italic; }
.sx-bloq { width: 66%; background: #f8f9fb; color: #1f1f1f; border-radius: 1.1em; padding: 4% 4.5% 3%; box-shadow: 0 1em 3em rgba(0,0,0,.35); animation: sxIn .35s ease; }
.sx-bloq .pp { display: flex; align-items: center; gap: .4em; font-size: .72em; color: #444746; }
.sx-bloq .pp i { width: 1.2em; height: 1.2em; display: grid; place-items: center; color: #01875f; }
.sx-bloq .pp i svg { width: 100%; height: 100%; }
.sx-bloq h4 { margin: 2.5% 0 3%; font-size: 1.12em; font-weight: 500; line-height: 1.25; color: #1f1f1f; font-family: inherit; }
.sx-bloq .app { display: flex; align-items: center; gap: .6em; padding: 2.4% 3%; border-radius: .7em; background: #dde3ef; font-size: .9em; }
.sx-bloq .app .sx-plogo { width: 1.7em; height: 1.7em; font-size: .9em; }
.sx-bloq p { margin: 3% 0; font-size: .8em; line-height: 1.45; color: #444746; }
.sx-bloq .sx-btns span.f { background: #d3e3fd; color: #0b57d0; }

/* Google Play (atual) */
.sx-ps { position: absolute; inset: 0; display: grid; grid-template-columns: 9% 1fr; background: #131314; }
.sx-ps .rail { display: flex; flex-direction: column; align-items: center; gap: 7%; padding-top: 4%; font-size: .95em; }
.sx-ps .rail span { display: flex; flex-direction: column; align-items: center; color: #c4c7c5; }
.sx-ps .rail small { font-size: .6em; margin-top: .2em; }
.sx-ps .rail .lg { color: #34a853; font-size: 1.3em; margin-bottom: 8%; }
.sx-ps .rail .on { color: #a8c7fa; }
.sx-ps .body { padding: 2% 3% 0 1%; }
.sx-ps .top { display: flex; align-items: center; gap: 3%; height: 9%; }
.sx-ps .top .sp { flex: 1; }
.sx-ps .av, .sx-acct .av, .sx-drawer .av { width: 2em; height: 2em; border-radius: 50%; display: inline-grid; place-items: center; background: #3b82f6; color: #fff; font-weight: 700; font-size: .85em; flex-shrink: 0; transition: all .25s; }
.sx-ps .top .av.f { box-shadow: 0 0 0 .25em #a8c7fa; transform: scale(1.12); }
.sx-ps .hero { margin-top: 2%; height: 46%; border-radius: 1em; background: linear-gradient(120deg, #0b3d2e, #12523d 60%, #1d6b4f); display: flex; flex-direction: column; justify-content: flex-end; padding: 3.5%; }
.sx-ps .hero b { font-size: 1.35em; font-weight: 500; }
.sx-ps .hero small { color: #c4c7c5; font-size: .8em; }
.sx-ps .row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5%; margin-top: 4%; }
.sx-ps .row i { aspect-ratio: 1.6; border-radius: .7em; background: #232427; }
.sx-acct { position: absolute; left: 34%; top: 7%; width: 40%; background: #282a2c; border-radius: 1.2em; padding: 1.5% 1.6%; box-shadow: 0 1em 3em rgba(0,0,0,.6); animation: sxIn .3s ease; font-size: .82em; }
.sx-acct .em { display: flex; align-items: center; gap: .6em; justify-content: center; padding: 2.5% 0 4%; color: #e3e3e3; position: relative; }
.sx-acct .em .x { position: absolute; right: 2%; }
.sx-acct .op { display: flex; align-items: center; gap: .8em; padding: 3.4% 5%; margin-top: 1.2%; border-radius: .8em; background: #1f2022; color: #e3e3e3; transition: all .25s; }
.sx-acct .op .ic { width: 1.2em; display: grid; place-items: center; }
.sx-acct .op .ic svg { width: 1.1em; height: 1.1em; }
.sx-acct .op.hl { background: #a8c7fa; color: #062e6f; transform: scale(1.04); }

/* Play Protect */
.sx-prot { position: absolute; inset: 0; background: #f8f9fb; color: #1f1f1f; display: flex; flex-direction: column; }
.sx-prot.dk { background: #131314; color: #e3e3e3; }
.sx-prot .bar { display: flex; align-items: center; gap: 3%; padding: 3.5% 4%; font-size: 1.05em; }
.sx-prot .bar b { font-weight: 500; }
.sx-prot .bar .sp { flex: 1; }
.sx-prot .gear { width: 2em; height: 2em; border-radius: 50%; display: grid; place-items: center; transition: all .25s; }
.sx-prot .gear.f { background: #d3e3fd; color: #0b57d0; box-shadow: 0 0 0 .25em rgba(11,87,208,.35); transform: scale(1.15); }
.sx-prot .shield { margin: 2% auto 0; text-align: center; display: flex; flex-direction: column; align-items: center; }
.sx-prot .shield i { width: 5.5em; height: 5.5em; border-radius: 50%; display: grid; place-items: center; background: #c4eed0; color: #146c2e; margin-bottom: 4%; }
.sx-prot .shield i svg { width: 55%; height: 55%; }
.sx-prot .shield b { font-size: 1.3em; font-weight: 500; }
.sx-prot .shield small { color: #5f6368; font-size: .8em; margin-top: 2%; }
.sx-prot.dk .shield small { color: #9aa0a6; }
.sx-prot .btn { margin: 5% auto 0; padding: .6em 2em; border-radius: 2em; background: #0b57d0; color: #fff; font-size: .9em; }
.sx-it .i svg { width: 60%; height: 60%; }

/* instalador e download */
.sx-inst { width: 58%; background: #f8f9fb; color: #1f1f1f; border-radius: 1.1em; padding: 4% 4.5% 3%; box-shadow: 0 1em 3em rgba(0,0,0,.3); animation: sxIn .35s ease; }
.sx-inst .app { display: flex; align-items: center; gap: .6em; font-size: 1.05em; }
.sx-inst p { margin: 5% 0; font-size: .9em; color: #444746; }
.sx-inst p.ok { color: #146c2e; font-weight: 500; }
.sx-inst .sx-btns span { color: #0b57d0; }
.sx-inst .sx-btns span.f { background: #0b57d0; color: #fff; }
.sx-dl { padding: 4% 6%; }
.sx-dl .card { display: flex; align-items: center; gap: 4%; padding: 4%; border-radius: 1em; background: #fff; box-shadow: 0 .3em 1.2em rgba(0,0,0,.08); }
.sx-dl .card div { flex: 1; }
.sx-dl .card small { display: block; color: #5f6368; font-size: .8em; }
.sx-dl .card .b { padding: .5em 1.4em; border-radius: 2em; background: #9333ea; color: #fff; font-weight: 600; font-size: .85em; }
.sx-snack { position: absolute; left: 5%; right: 5%; bottom: 5%; display: flex; justify-content: space-between; align-items: center; padding: 2.4% 4%; border-radius: .7em; background: #303134; color: #e8eaed; font-size: .85em; animation: sxIn .4s ease; }
.sx-snack b { color: #a8c7fa; padding: .2em .8em; border-radius: 1em; background: rgba(168,199,250,.18); }

/* Google Play antiga (☰) */
.sx-search { margin: 3% 4% 0; display: flex; align-items: center; gap: 3%; padding: 2.2% 3%; border-radius: .5em; background: #fff; box-shadow: 0 .15em .6em rgba(0,0,0,.15); font-size: .9em; color: #5f6368; }
.sx-search .ham { width: 1.8em; height: 1.8em; border-radius: 50%; display: grid; place-items: center; color: #1f1f1f; transition: all .25s; }
.sx-search .ham.f { background: #01875f; color: #fff; transform: scale(1.2); }
.sx-search .mic { margin-left: auto; }
.sx-ps-old .hero { margin: 4% 4% 0; height: 34%; border-radius: .6em; background: linear-gradient(120deg, #01875f, #0b8043); }
.sx-ps-old .row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2%; margin: 4% 4% 0; }
.sx-ps-old .row i { aspect-ratio: 1; border-radius: 22%; background: #dfe3e8; }
.sx-drawer { position: absolute; left: 0; top: 0; bottom: 0; width: 42%; background: #fff; box-shadow: .5em 0 2em rgba(0,0,0,.3); animation: sxDr .3s ease; font-size: .85em; }
@keyframes sxDr { from { transform: translateX(-100%); } to { transform: none; } }
.sx-drawer .hd { display: flex; align-items: center; gap: .7em; padding: 7% 7% 5%; background: #01875f; color: #fff; }
.sx-drawer .hd small { display: block; opacity: .85; font-size: .8em; }
.sx-drawer > div:not(.hd) { padding: 3.6% 8%; color: #1f1f1f; }
.sx-drawer > div.hl { background: #e6f4ea; color: #01875f; font-weight: 600; box-shadow: inset .3em 0 0 #01875f; }

/* menu do perfil na Google Play da TV */
.sx-tvmenu { position: absolute; right: 4%; top: 15%; width: 38%; background: #282a2c; border-radius: .8em; padding: 1.5% 0; box-shadow: 0 1em 3em rgba(0,0,0,.6); animation: sxIn .3s ease; font-size: .9em; }
.sx-tvmenu div { display: flex; align-items: center; gap: .5em; padding: 4% 7%; color: #e3e3e3; }
.sx-tvmenu div svg { width: 1em; height: 1em; }
.sx-tvmenu div.f { background: #e8eaed; color: #111; transform: scale(1.04); border-radius: .4em; }

/* vídeo */
.ia-video-soon { max-width: 980px; margin: 0 auto; aspect-ratio: 16 / 9; border-radius: 20px; border: 1px dashed var(--ar-line); display: grid; place-items: center; color: var(--text-muted); }

@media (max-width: 1024px) {
  .ia-avisos { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .ia-why, .ia-avisos { grid-template-columns: 1fr; }
  .ia-hero-dev .ar-chip.c1 { left: 0; top: -10%; }
  .ia-hero-dev .ar-chip.c2 { right: 0; bottom: -10%; }
}
.cta-box a.ar-link { color: #fff; text-decoration: underline; }
