/* /precos em abas (26/09/2026). Só a view precos-abas carrega este arquivo; precos.css segue valendo
   para tabelas e faixas (também usadas no .es). Tokens do tema em rgb(var(--pb-*)). */

/* Topo: período e nota lado a lado no desktop. */
.pr-hero-controls { margin-top: 22px; display: grid; gap: 10px; max-width: 64rem; }
.pr-hero-period { max-width: 36rem; scroll-margin-top: 8rem; }
.pr-hero-note { font-size: 13px; line-height: 1.55; color: rgb(var(--pb-muted)); max-width: 40rem; }
.pr-hero-note a { font-weight: 600; color: rgb(var(--pb-accent)); }
@media (min-width: 1024px) {
    .pr-hero-controls { grid-template-columns: minmax(0, 36rem) minmax(0, 1fr); align-items: center; gap: 24px; }
}

/* Barra de abas: fixa abaixo do cabeçalho, rola na horizontal no celular. */
.pr-tabbar { position: sticky; top: 4rem; z-index: 40; border-bottom: 1px solid rgb(var(--pb-line)); background: rgb(var(--pb-surface) / .96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.pr-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 10px 0; scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth; }
.pr-tabs::-webkit-scrollbar { display: none; }
.pr-tabs a { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 40px; padding: 8px 16px; border: 1px solid rgb(var(--pb-line)); border-radius: 999px; background: rgb(var(--pb-surface)); font-size: 14px; font-weight: 700; color: rgb(var(--pb-fg)); text-decoration: none; white-space: nowrap; transition: border-color .15s, background-color .15s, color .15s; }
.pr-tabs a:hover { border-color: rgb(var(--pb-accent) / .5); color: rgb(var(--pb-accent)); }
.pr-tabs a[aria-selected="true"] { border-color: rgb(var(--pb-accent)); background: rgb(var(--pb-accent)); color: #fff; }
.pr-tabs a:focus-visible { outline: 2px solid rgb(var(--pb-accent)); outline-offset: 2px; }

/* Painéis e seções de família. */
.pr-panels { background: rgb(var(--pb-bg)); }
.pr-sec { padding: 36px 0 44px; scroll-margin-top: 8.5rem; }
.pr-sec + .pr-sec { border-top: 1px solid rgb(var(--pb-line)); }
.pr-sec__head { max-width: 48rem; }
.pr-sec__title { margin-top: 6px; font-size: 1.6rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: rgb(var(--pb-fg)); }
.pr-sec__sub { margin-top: 10px; font-size: 15px; line-height: 1.6; color: rgb(var(--pb-muted)); }
.pr-sec__meta { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; font-weight: 600; color: rgb(var(--pb-muted)); }
.pr-sec__meta a { color: rgb(var(--pb-accent)); }
.pr-sec__meta a:hover { text-decoration: underline; }
@media (min-width: 640px) { .pr-sec__title { font-size: 2rem; } .pr-sec { padding: 44px 0 52px; } }

.pr-cards { margin-top: 24px; display: grid; gap: 18px; }
@media (min-width: 768px) { .pr-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .pr-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.pr-h3 { margin-top: 32px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: rgb(var(--pb-fg)); }
.pr-h3-sub { margin-top: 4px; max-width: 48rem; font-size: 14px; line-height: 1.55; color: rgb(var(--pb-muted)); }
.pr-h3-sub a, .pr-more__body p a { font-weight: 600; color: rgb(var(--pb-accent)); }
.pr-h3 + .pr-list, .pr-h3-sub + .pr-list { margin-top: 12px; }

.pr-colnotes { margin-top: 28px; display: grid; gap: 14px; }
.pr-colnotes h3 { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: rgb(var(--pb-fg)); }
.pr-colnotes p { margin-top: 4px; font-size: 14px; line-height: 1.5; color: rgb(var(--pb-muted)); }
@media (min-width: 768px) { .pr-colnotes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
.pr-colnotes + .pr-matrix { margin-top: 14px; }

/* Faixas de desconto numa linha, dentro da aba. */
.pr-tierline { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 13px; color: rgb(var(--pb-muted)); }
.pr-tierline b { font-weight: 700; color: rgb(var(--pb-fg)); margin-right: 2px; }
.pr-tierline span { display: inline-flex; gap: 5px; padding: 3px 10px; border: 1px solid rgb(var(--pb-line)); border-radius: 999px; background: rgb(var(--pb-surface)); white-space: nowrap; color: rgb(var(--pb-fg)); }
.pr-tierline em { font-style: normal; font-weight: 800; color: rgb(var(--pb-accent)); }
.pr-tierline small { flex-basis: 100%; font-size: 12px; }

/* "Mais opções": uma linha por variação, abre no lugar. */
.pr-more-group { margin-top: 32px; }
.pr-more-group__title { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: rgb(var(--pb-fg)); }
.pr-more { margin-top: 10px; border: 1px solid rgb(var(--pb-line)); border-radius: 14px; background: rgb(var(--pb-surface)); }
.pr-more[open] { border-color: rgb(var(--pb-accent) / .45); }
.pr-more summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 14px; padding: 14px 44px 14px 18px; cursor: pointer; list-style: none; position: relative; }
.pr-more summary::-webkit-details-marker { display: none; }
.pr-more summary::after { content: ""; position: absolute; right: 18px; top: 50%; width: 9px; height: 9px; margin-top: -6px; border-right: 2px solid rgb(var(--pb-muted)); border-bottom: 2px solid rgb(var(--pb-muted)); transform: rotate(45deg); transition: transform .15s; }
.pr-more[open] summary::after { transform: rotate(225deg); margin-top: -2px; }
.pr-more summary h3 { grid-column: 1; font-size: 16px; font-weight: 700; color: rgb(var(--pb-fg)); }
.pr-more__hint { grid-column: 1; font-size: 13px; color: rgb(var(--pb-muted)); }
.pr-more__price { grid-column: 2; grid-row: 1 / span 2; font-size: 14px; font-weight: 800; color: rgb(var(--pb-accent)); white-space: nowrap; }
.pr-more summary:focus-visible { outline: 2px solid rgb(var(--pb-accent)); outline-offset: 2px; border-radius: 14px; }
.pr-more__body { padding: 0 18px 18px; }
.pr-more__body > p { font-size: 14px; line-height: 1.55; color: rgb(var(--pb-muted)); max-width: 52rem; }
.pr-more__body .pr-matrix, .pr-more__body .pr-list { margin-top: 14px; }
@media (max-width: 639px) {
    .pr-more summary { grid-template-columns: 1fr; }
    .pr-more__price { grid-column: 1; grid-row: auto; margin-top: 4px; }
}

/* Faixas de fundo das seções depois das abas. */
.pr-band { padding: 48px 0; border-top: 1px solid rgb(var(--pb-line)); background: rgb(var(--pb-surface)); scroll-margin-top: 8rem; }
.pr-band--alt { background: rgb(var(--pb-bg)); }
@media (min-width: 640px) { .pr-band { padding: 56px 0; } }

.pr-volume { margin-top: 20px; display: grid; gap: 18px; }
.pr-volume h3 { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: rgb(var(--pb-fg)); }
.pr-volume .pr-tiers { margin-top: 8px; }
.pr-volume__foot { margin-top: 18px; max-width: 44rem; font-size: 14px; line-height: 1.55; color: rgb(var(--pb-muted)); }
.pr-volume__foot a { font-weight: 600; color: rgb(var(--pb-accent)); }

.pr-uses { margin-top: 22px; display: grid; border: 1px solid rgb(var(--pb-line)); border-radius: 16px; background: rgb(var(--pb-surface)); overflow: hidden; }
.pr-use { padding: 16px 18px; border-top: 1px solid rgb(var(--pb-line)); }
.pr-use:first-child { border-top: 0; }
.pr-use h3 { font-size: 15px; font-weight: 700; color: rgb(var(--pb-fg)); }
.pr-use p { margin-top: 4px; font-size: 14px; line-height: 1.5; color: rgb(var(--pb-muted)); }
.pr-use a { display: inline-block; margin-top: 6px; font-size: 13px; font-weight: 700; color: rgb(var(--pb-accent)); }
@media (min-width: 768px) {
    .pr-uses { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pr-use:nth-child(2) { border-top: 0; }
    .pr-use:nth-child(even) { border-left: 1px solid rgb(var(--pb-line)); }
}
@media (min-width: 1100px) {
    .pr-uses { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pr-use:nth-child(3) { border-top: 0; }
    .pr-use:nth-child(even) { border-left: 0; }
    .pr-use:not(:nth-child(3n+1)) { border-left: 1px solid rgb(var(--pb-line)); }
}

.pr-help { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 18px 20px; border: 1px solid rgb(var(--pb-accent) / .35); border-radius: 16px; background: rgb(var(--pb-accent-soft)); }
.pr-help b { display: block; font-size: 16px; color: rgb(var(--pb-fg)); }
.pr-help span { display: block; margin-top: 2px; font-size: 14px; color: rgb(var(--pb-muted)); }
.pr-help__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.pr-disclaimer { margin-top: 12px; font-size: 12px; color: rgb(var(--pb-muted)); }

/* ---- 27/09/2026: seletor de tipo de proxy (uma escolha só no topo) e prazo junto dos preços ---- */
.pr-picker-sentinel { height: 1px; }
.pr-picker { position: sticky; top: 4rem; z-index: 40; background: rgb(var(--pb-surface) / .97); border-bottom: 1px solid rgb(var(--pb-line)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.pr-picker__list { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 14px; scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth; }
.pr-picker__list::-webkit-scrollbar { display: none; }
.pr-pick { flex: 1 0 auto; min-width: 150px; display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 11px 16px; border: 1px solid rgb(var(--pb-line)); border-radius: 14px; background: rgb(var(--pb-surface)); color: rgb(var(--pb-fg)); text-decoration: none; transition: border-color .15s, background-color .15s, box-shadow .15s, padding .15s; }
.pr-pick b { font-size: 15px; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.pr-pick small { font-size: 12.5px; line-height: 1.3; color: rgb(var(--pb-muted)); white-space: nowrap; }
.pr-pick:hover { border-color: rgb(var(--pb-accent) / .5); }
.pr-pick[aria-selected="true"] { border-color: rgb(var(--pb-accent)); box-shadow: inset 0 0 0 1px rgb(var(--pb-accent)); background: rgb(var(--pb-accent-soft)); }
.pr-pick[aria-selected="true"] b { color: rgb(var(--pb-accent)); }
.pr-pick:focus-visible { outline: 2px solid rgb(var(--pb-accent)); outline-offset: 2px; }
.pr-picker.is-stuck .pr-picker__list { padding: 8px 0; }
.pr-picker.is-stuck .pr-pick { padding: 7px 14px; border-radius: 999px; min-width: 0; flex-grow: 0; }
.pr-picker.is-stuck .pr-pick small { display: none; }
@media (min-width: 1024px) {
    .pr-picker__list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); overflow: visible; }
    .pr-pick { min-width: 0; }
    .pr-picker.is-stuck .pr-picker__list { display: flex; }
}

/* Prazo de pagamento: controle pequeno, logo acima dos preços que ele muda. */
.pr-period { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; scroll-margin-top: 9rem; }
.pr-period__label { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: rgb(var(--pb-muted)); }
.pr-period__opts { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid rgb(var(--pb-line)); border-radius: 12px; background: rgb(var(--pb-surface-2)); }
.pr-period__opts a { display: inline-flex; align-items: baseline; gap: 5px; padding: 7px 13px; border-radius: 9px; font-size: 13.5px; font-weight: 700; color: rgb(var(--pb-muted)); text-decoration: none; white-space: nowrap; transition: background-color .15s, color .15s; }
.pr-period__opts a em { font-style: normal; font-size: 11.5px; font-weight: 800; color: rgb(var(--pb-accent)); }
.pr-period__opts a:hover { color: rgb(var(--pb-fg)); }
.pr-period__opts a[aria-current="true"] { background: rgb(var(--pb-surface)); color: rgb(var(--pb-fg)); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.pr-period__opts a:focus-visible { outline: 2px solid rgb(var(--pb-accent)); outline-offset: 1px; }
.pr-period__note { font-size: 12.5px; color: rgb(var(--pb-muted)); }
@media (max-width: 639px) {
    .pr-period__label { flex-basis: 100%; }
    .pr-period__opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
    .pr-period__opts a { flex-direction: column; align-items: center; gap: 1px; padding: 7px 4px; font-size: 13px; }
    .pr-period__opts a em { font-size: 11px; }
}

.pr-panels.is-loading .pr-panel:not([hidden]) { opacity: .55; transition: opacity .15s; pointer-events: none; }

/* Selos do topo: no celular, uma linha que rola de lado, para a escolha do proxy aparecer na primeira tela. */
.pr-trust { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
@media (max-width: 639px) {
    .pr-trust { flex-wrap: nowrap; overflow-x: auto; gap: 8px; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
    .pr-trust::-webkit-scrollbar { display: none; }
    .pr-trust > div { flex-wrap: nowrap; }
    .pr-trust .pb-chip, .pr-trust > a { flex-shrink: 0; white-space: nowrap; }
}