/**
 * Página de planos (/planos): herói, abas, cards, adicional, tabela, dúvidas e CTA final.
 *
 * Refeita em 17/09/2026 linha a linha pelo `design_handoff_morro_guia/telas/Planos Morro Guia.dc.html`
 * (computador, 1440px) e pelo bloco PLANOS do `Mobile Telas Morro Guia.dc.html` (390px). Os números
 * entre parênteses são as linhas do HTML de computador. Classes mg-* porque o Tailwind do site é
 * pré-compilado. Carregado só em /planos (templates/front/planos.php).
 *
 * Desvios de propósito: fonte Inter (manual) no lugar de Plus Jakarta Sans; botão do WhatsApp em
 * #13804f em vez de #22a06b (texto branco no #22a06b fica em 2,6:1), como no resto do site.
 *
 * @package GuiaWP
 * @since 2.5.450 - Valoar - 2026-09-14
 */

.mg-planos {
	--pl-azul: #0f5132;
	--pl-azul-hover: #0b3f27;
	--pl-marinho: #0b3a25;
	--pl-verde: #22a06b;
	--pl-verde-botao: #13804f;
	--pl-laranja: #ff7a00;
	--pl-texto: #3d4a43;
	--pl-texto2: #5a6660;
	--pl-borda: #e5e0d6;
	--pl-div: #f0ece4;
	background: #f9f6f1;
	color: var(--pl-texto);
	font-family: var(--mg-fonte, Poppins, system-ui, sans-serif);
	padding-bottom: 0;
}
.mg-planos *, .mg-planos *::before, .mg-planos *::after { box-sizing: border-box; }
.mg-planos :where(p, h1, h2, h3, ul) { margin: 0; }
.mg-planos :where(ul) { padding: 0; list-style: none; }
.mg-planos svg { display: block; flex: none; }
.mg-pl-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.mg-pl-so-movel { display: none; }
.mg-planos a:focus-visible, .mg-planos button:focus-visible, .mg-planos summary:focus-visible,
.mg-pl-tabela__rolo:focus-visible { outline: 3px solid var(--pl-azul); outline-offset: 2px; border-radius: 8px; }
/* A migalha fica dentro do herói, como nas páginas de turismo; a faixa do tema sai para não duplicar. */
body:has(.mg-planos) .gcep-migalha { display: none; }

/* ── Herói (51-74) ───────────────────────────────────────────────────────── */

.mg-pl-hero { position: relative; overflow: hidden; min-height: 330px; background: linear-gradient(120deg, #eaf2fb 0%, #dceaf6 30%, #b9cfde 52%, #9fb98e 72%, #c9a063 100%); }
.mg-pl-hero__foto { position: absolute; top: 0; right: 0; bottom: 0; width: 58%; background-size: cover; background-position: center; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 40%); mask-image: linear-gradient(90deg, transparent 0%, #000 40%); }
.mg-pl-hero__veu { position: absolute; inset: 0; background: linear-gradient(90deg, #f9f7f2 0%, rgba(246, 249, 253, .96) 44%, rgba(246, 249, 253, .55) 62%, rgba(246, 249, 253, .15) 82%, rgba(246, 249, 253, .05) 100%); }
.mg-pl-hero__in { position: relative; padding-block: 30px; }
.mg-pl-migalha { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 18px; font-size: 13.5px; line-height: 1.4; color: var(--pl-texto2); }
.mg-planos .mg-pl-migalha a { color: var(--pl-texto2); text-decoration: none; }
.mg-planos .mg-pl-migalha a:hover { color: var(--pl-azul); text-decoration: underline; text-underline-offset: 3px; }
.mg-pl-migalha span[aria-hidden] { opacity: .6; }
.mg-pl-migalha [aria-current] { color: var(--pl-marinho); font-weight: 700; }
.mg-pl-eyebrow { display: inline-block; margin-bottom: 16px; padding: 9px 13px; border: 1px solid #d6e3f5; border-radius: 7px; background: #fff; font-size: 10.5px; font-weight: 700; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--pl-marinho); }
.mg-pl-hero h1 { max-width: 560px; margin: 0 0 14px; font-size: 38px; font-weight: 800; line-height: 1.18; letter-spacing: -.025em; color: var(--pl-marinho); }
.mg-pl-hero__sub { max-width: 480px; margin: 0 0 26px; font-size: 14px; font-weight: 500; line-height: 1.6; color: var(--pl-texto); }
.mg-pl-beneficios { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 34px; }
.mg-pl-beneficios li { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; line-height: 1.4; color: var(--pl-texto); }
.mg-pl-beneficios svg { width: 20px; height: 20px; stroke-width: 1.9; }
.mg-pl-beneficios li:first-child svg { stroke-width: 2.4; }
.mg-pl-beneficios__verde svg { color: var(--pl-verde); }
.mg-pl-beneficios__azul svg { color: var(--pl-azul); }
.mg-pl-manuscrito { position: absolute; z-index: 1; right: 52px; top: 34px; transform: rotate(-7deg); font-family: Caveat, "Segoe Print", "Bradley Hand", cursive; font-size: 19px; font-weight: 700; line-height: 1.3; text-align: center; color: var(--pl-marinho); text-shadow: 0 0 10px #fff, 0 0 18px rgba(255, 255, 255, .95); }
.mg-pl-traco { width: 118px; height: 12px; margin: 2px auto 0; }

/* ── Abas (76-97) ────────────────────────────────────────────────────────── */

.mg-pl-abas { padding-top: 22px; }
.mg-pl-abas__lista { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 16px; }
.mg-planos .mg-pl-aba { display: flex; align-items: center; gap: 14px; padding: 16px 20px; border: 1px solid var(--pl-borda); border-radius: 12px; background: #fff; color: var(--pl-marinho); text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.mg-planos .mg-pl-aba:hover { border-color: #b9dcc8; box-shadow: 0 6px 20px rgba(11, 58, 37, .08); }
.mg-pl-aba__ico { display: flex; flex: none; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; background: #f0f7f2; color: var(--pl-azul); }
.mg-pl-aba--verde .mg-pl-aba__ico { background: #e9f7f0; color: var(--pl-verde); }
.mg-pl-aba__ico svg { width: 20px; height: 20px; }
.mg-pl-aba__txt { display: flex; flex-direction: column; min-width: 0; }
.mg-pl-aba__rot { font-size: 14px; font-weight: 800; line-height: 1; }
.mg-pl-aba__sub { margin-top: 6px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--pl-texto2); }
.mg-planos .mg-pl-aba[aria-selected="true"], .mg-planos .mg-pl-aba[aria-current="true"] { padding: 17px 20px; border-color: var(--pl-azul); background: var(--pl-azul); color: #fff; }
.mg-planos .mg-pl-aba[aria-selected="true"]:hover, .mg-planos .mg-pl-aba[aria-current="true"]:hover { background: var(--pl-azul-hover); border-color: var(--pl-azul-hover); }
.mg-pl-aba[aria-selected="true"] .mg-pl-aba__ico, .mg-pl-aba[aria-current="true"] .mg-pl-aba__ico { background: rgba(255, 255, 255, .2); color: #fff; }
.mg-pl-aba[aria-selected="true"] .mg-pl-aba__sub, .mg-pl-aba[aria-current="true"] .mg-pl-aba__sub { color: #d3e4fa; }

/* ── Cabeçalho da categoria (99-114) ─────────────────────────────────────── */

.mg-pl-painel { padding-top: 22px; }
.mg-pl-js .mg-pl-painel.is-inativo, .mg-pl-js .mg-pl-tabela.is-inativo { display: none; }
.mg-pl-cab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px; padding: 18px 22px; border: 1px solid var(--pl-borda); border-radius: 14px; background: #fff; }
.mg-pl-cab__id { display: flex; align-items: center; gap: 14px; min-width: 0; }
.mg-pl-cab__ico { display: flex; flex: none; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 11px; background: var(--pl-verde); color: #fff; }
.mg-pl-cab__ico svg { width: 22px; height: 22px; }
.mg-pl-cab h2 { margin: 0 0 7px; font-size: 19px; font-weight: 800; line-height: 1.2; letter-spacing: -.015em; color: var(--pl-marinho); }
.mg-pl-cab p { font-size: 12.5px; font-weight: 400; line-height: 1.4; color: var(--pl-texto2); }
.mg-pl-ciclo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.mg-pl-ciclo[hidden] { display: none; }
.mg-pl-ciclo__grupo { display: flex; padding: 4px; border-radius: 99px; background: #f1efe8; }
.mg-pl-ciclo__grupo button { padding: 11px 22px; border: 0; border-radius: 99px; background: transparent; font-family: inherit; font-size: 12.5px; font-weight: 600; line-height: 1; color: var(--pl-texto2); cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.mg-pl-ciclo__grupo button:hover { color: var(--pl-marinho); }
.mg-pl-ciclo__grupo button[aria-pressed="true"] { background: var(--pl-azul); font-weight: 700; color: #fff; }
.mg-pl-economia { padding: 9px 13px; border-radius: 99px; background: #e9f7f0; font-size: 11px; font-weight: 700; line-height: 1; color: #0a6b42; }
.mg-pl-js .mg-pl-painel[data-ciclo="mensal"] [data-ciclo-card="anual"],
.mg-pl-js .mg-pl-painel[data-ciclo="anual"] [data-ciclo-card="mensal"],
.mg-pl-js .mg-pl-painel[data-ciclo="mensal"] [data-so-ciclo="anual"],
.mg-pl-js .mg-pl-painel[data-ciclo="anual"] [data-so-ciclo="mensal"],
.mg-pl-js .mg-pl-tabela[data-ciclo="mensal"] [data-ciclo-card="anual"],
.mg-pl-js .mg-pl-tabela[data-ciclo="anual"] [data-ciclo-card="mensal"] { display: none !important; }

/* ── Cards (116-219) ─────────────────────────────────────────────────────── */

.mg-pl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); align-items: stretch; gap: 18px; padding-top: 20px; }
.mg-pl-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 22px; border: 1px solid var(--pl-borda); border-radius: 15px; background: #fff; }
.mg-pl-card__topo { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.mg-pl-card__ico { display: flex; flex: none; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 11px; background: #eff3f8; color: var(--pl-texto2); }
.mg-pl-card__ico svg { width: 21px; height: 21px; }
.mg-pl-card__nome { min-width: 0; }
.mg-pl-card h3 { font-size: 17px; font-weight: 800; line-height: 1.1; color: var(--pl-marinho); overflow-wrap: anywhere; }
.mg-pl-card__promessa { margin-top: 6px !important; font-size: 11.5px; font-weight: 500; line-height: 1.35; color: var(--pl-texto2); }
.mg-pl-preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-bottom: 20px !important; }
.mg-pl-preco__valor { font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -.02em; color: var(--pl-marinho); white-space: nowrap; }
.mg-pl-preco__per { font-size: 12px; font-weight: 500; line-height: 1; color: var(--pl-texto2); }
.mg-pl-preco__extra { margin: -12px 0 16px !important; font-size: 11.5px; font-weight: 600; line-height: 1.5; color: #0a6b42; }
.mg-pl-lista { display: flex; flex: 1; flex-direction: column; gap: 11px; padding-top: 18px; border-top: 1px solid var(--pl-div); }
.mg-pl-lista li { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 500; line-height: 1.4; color: var(--pl-texto); }
.mg-pl-lista li.is-nao { color: #a5aea8; }
.mg-pl-ico { width: 16px; height: 16px; }
.mg-pl-lista li:not(.is-d) { display: none; }
.mg-pl-card .mg-pl-btn { margin-top: 20px; }
.mg-pl-nota { margin-top: 12px !important; font-size: 11px; font-weight: 400; line-height: 1.5; text-align: center; color: var(--pl-texto2); }
.mg-pl-atual { display: inline-flex; align-self: flex-start; align-items: center; gap: 6px; margin: -8px 0 14px !important; padding: 5px 10px; border-radius: 99px; background: #e9f7f0; font-size: 11px; font-weight: 700; color: #0a6b42; }
.mg-pl-atual svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.mg-pl-card--indisp { opacity: .7; }

/* Selos (167, 189) */
.mg-pl-selo { position: absolute; top: -13px; right: 18px; display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 99px; background: var(--pl-marinho); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .06em; text-transform: uppercase; color: #fff; white-space: nowrap; }
.mg-pl-selo svg { width: 11px; height: 11px; }
.mg-pl-selo--ouro { background: #d99a16; }

/* Variantes */
.mg-pl-card--gratis .mg-pl-card__ico { background: #eff3f8; color: var(--pl-texto2); }
.mg-pl-card--bronze { border-color: #f6dec4; background: #fffaf5; }
.mg-pl-card--bronze .mg-pl-card__ico { background: #ffeedc; color: #e07c1e; }
.mg-pl-card--bronze h3 { color: #c2650f; }
.mg-pl-card--bronze .mg-pl-card__promessa { color: #a0724a; }
.mg-pl-card--bronze .mg-pl-lista { border-top-color: #f2e3d2; }
.mg-pl-card--rec { border: 2px solid var(--pl-azul); background: #f5f9ff; box-shadow: 0 8px 24px rgba(15, 81, 50, .14); }
.mg-pl-card--rec .mg-pl-card__ico { background: #e2eefd; color: var(--pl-azul); }
.mg-pl-card--rec h3 { color: var(--pl-azul); }
.mg-pl-card--rec .mg-pl-lista { border-top-color: #dcede2; }
.mg-pl-card--ouro { border-color: #f0dfad; background: #fffcf2; }
.mg-pl-card--ouro .mg-pl-card__ico { background: #fbf0ce; color: #c08a0e; }
.mg-pl-card--ouro h3 { color: #b8860b; }
.mg-pl-card--ouro .mg-pl-card__promessa { color: #8a6b2e; }
.mg-pl-card--ouro .mg-pl-lista { border-top-color: #f0e6c8; }
.mg-pl-card--atual:not(.mg-pl-card--rec) { box-shadow: 0 0 0 1px #0a6b42; }
.mg-pl-card--gratis .mg-pl-card__ico--verde { background: #e9f7f0; color: var(--pl-verde); }

/* ── Botões ──────────────────────────────────────────────────────────────── */

.mg-planos .mg-pl-btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 15px 16px; border: 0; border-radius: 9px; background: var(--pl-azul); font-size: 13px; font-weight: 700; line-height: 1; text-align: center; text-decoration: none; color: #fff; transition: background-color .15s ease, filter .15s ease; }
.mg-planos .mg-pl-btn:hover { background: var(--pl-azul-hover); color: #fff; }
.mg-planos .mg-pl-btn svg { width: 15px; height: 15px; }
.mg-planos .mg-pl-btn--contorno { padding: 14px 16px; border: 1.6px solid var(--pl-azul); background: #fff; color: var(--pl-azul); }
.mg-planos .mg-pl-btn--contorno:hover { background: #f0f7f2; color: var(--pl-azul); }
.mg-planos .mg-pl-btn--laranja { background: var(--pl-laranja); color: #fff; }
.mg-planos .mg-pl-btn--laranja:hover { background: var(--pl-laranja); color: #fff; filter: brightness(.94); }
.mg-planos .mg-pl-btn--atual { padding: 14px 16px; border: 1.6px solid #0a6b42; background: #fff; color: #0a6b42; }
.mg-planos .mg-pl-btn--atual:hover { background: #e9f7f0; color: #0a6b42; }
.mg-planos .mg-pl-btn--roxo { width: auto; flex: none; padding: 15px 24px; background: #7b3fd0; color: #fff; }
.mg-planos .mg-pl-btn--roxo:hover { background: #6a32bd; color: #fff; }
.mg-planos .mg-pl-btn--zap { padding: 15px 16px; background: var(--pl-verde-botao); font-size: 13.5px; }
.mg-planos .mg-pl-btn--zap:hover { background: #0f6b42; }
.mg-planos .mg-pl-btn--zap svg { width: 18px; height: 18px; }
.mg-planos .mg-pl-btn--final { width: auto; flex: none; margin-right: 210px; padding: 15px 24px; border-radius: 10px; background: var(--pl-laranja); font-size: 13.5px; color: #fff; }
.mg-planos .mg-pl-btn--final:hover { background: var(--pl-laranja); color: #fff; filter: brightness(.94); }
.mg-planos .mg-pl-btn--auto { display: inline-flex; width: auto; padding-inline: 24px; }
.mg-planos .mg-pl-btn[aria-disabled="true"] { background: #f5f2ec; color: var(--pl-texto2); cursor: not-allowed; }
.mg-pl-comparar { display: none; }

/* ── Adicional (221-238) ─────────────────────────────────────────────────── */

.mg-pl-adicionais { display: grid; gap: 18px; padding-top: 22px; }
.mg-pl-adicional { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 26px; padding: 22px; border: 1px solid #dcd2f5; border-radius: 15px; background: #f7f4fe; }
.mg-pl-adicional__arte { width: 150px; height: 132px; overflow: hidden; border-radius: 13px; background: linear-gradient(150deg, #b14bc8, #6a3fc8); }
.mg-pl-adicional__arte img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mg-pl-adicional__selo { display: inline-block; margin-bottom: 12px; padding: 7px 10px; border-radius: 6px; background: #7b3fd0; font-size: 9.5px; font-weight: 700; line-height: 1; letter-spacing: .1em; text-transform: uppercase; color: #fff; }
.mg-pl-adicional h2 { margin-bottom: 8px; font-size: 21px; font-weight: 800; line-height: 1.2; color: var(--pl-marinho); }
.mg-pl-adicional__desc { margin-bottom: 14px !important; font-size: 12.5px; font-weight: 500; line-height: 1.5; color: var(--pl-texto2); }
.mg-pl-adicional .mg-pl-preco { margin-bottom: 0 !important; }
.mg-pl-adicional .mg-pl-preco__valor { font-size: 26px; color: #7b3fd0; }
.mg-pl-adicional .mg-pl-nota { text-align: left; }
.mg-pl-adicional__lista { display: flex; flex-direction: column; gap: 10px; }
.mg-pl-adicional__lista li { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 500; line-height: 1.4; color: var(--pl-texto); }
.mg-pl-adicional__lista svg { width: 14px; height: 14px; }

/* ── Tabela + dúvidas (240-331) ──────────────────────────────────────────── */

.mg-pl-inferior { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 20px; padding-top: 22px; }
.mg-pl-inferior:not(:has(.mg-pl-tabela:not(.is-inativo))) { grid-template-columns: minmax(0, 1fr); }
.mg-pl-inferior__tabelas:not(:has(.mg-pl-tabela:not(.is-inativo))) { display: none; }
.mg-pl-tabela { padding: 22px; border: 1px solid var(--pl-borda); border-radius: 15px; background: #fff; scroll-margin-top: 130px; }
.mg-pl-tabela h2 { margin-bottom: 18px; font-size: 18px; font-weight: 800; line-height: 1.1; letter-spacing: -.015em; color: var(--pl-marinho); }
.mg-pl-tabela__rolo { position: relative; overflow-x: auto; border: 1px solid #eae5db; border-radius: 11px; -webkit-overflow-scrolling: touch; }
.mg-pl-tabela table { width: 100%; min-width: calc(9rem + var(--cols, 4) * 5rem); border-collapse: collapse; }
.mg-pl-tabela th, .mg-pl-tabela td { padding: 13px 8px; border-top: 1px solid var(--pl-div); font-size: 11.5px; font-weight: 500; line-height: 1.2; text-align: center; vertical-align: middle; color: var(--pl-texto2); }
.mg-pl-tabela thead th { border-top: 0; background: #f9f7f2; font-weight: 700; color: var(--pl-texto2); }
.mg-pl-tabela tbody th { width: 30%; padding: 13px 14px; font-weight: 600; text-align: left; color: var(--pl-texto); }
.mg-pl-tabela th:first-child { position: sticky; left: 0; z-index: 1; background: #fff; }
.mg-pl-tabela thead th:first-child { background: #f9f7f2; }
.mg-pl-tabela thead th.is-bronze { color: #c2650f; }
.mg-pl-tabela thead th.is-rec { color: var(--pl-azul); }
.mg-pl-tabela thead th.is-ouro { color: #b8860b; }
.mg-pl-tabela thead th.is-neutro { color: var(--pl-marinho); }
.mg-pl-tab-sim { width: 15px; height: 15px; margin: 0 auto; }
.mg-pl-tab-nao { color: #a9b7c9; }
/* Pedido do dono (17/09): recolhida na altura da coluna ao lado; o script mede e grava --pl-tab-max. */
.mg-pl-tabela.is-recolhida .mg-pl-tabela__rolo { max-height: var(--pl-tab-max, 420px); overflow-y: hidden; -webkit-mask-image: linear-gradient(#000 calc(100% - 56px), transparent); mask-image: linear-gradient(#000 calc(100% - 56px), transparent); }
.mg-pl-tabela__mais { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; margin-top: 12px; padding: 11px 0; border: 1px solid #eae5db; border-radius: 10px; background: #f9f7f2; font: inherit; font-size: 12.5px; font-weight: 700; line-height: 1; color: var(--pl-azul); cursor: pointer; }
.mg-pl-tabela__mais[hidden] { display: none; }
.mg-pl-tabela__mais:hover { background: #f0f7f2; }
.mg-pl-tabela__mais:focus-visible { outline: 3px solid var(--pl-azul); outline-offset: 2px; }
.mg-pl-tabela__mais svg { width: 14px; height: 14px; transition: transform .2s; }
.mg-pl-tabela__mais[aria-expanded="true"] svg { transform: rotate(180deg); }

.mg-pl-duvidas { display: flex; flex-direction: column; gap: 20px; }
.mg-pl-inferior:not(:has(.mg-pl-tabela:not(.is-inativo))) .mg-pl-duvidas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.mg-pl-ajuda, .mg-pl-faq { padding: 22px; border: 1px solid var(--pl-borda); border-radius: 15px; background: #fff; }
.mg-pl-ajuda__topo { display: flex; gap: 14px; margin-bottom: 16px; }
.mg-pl-ajuda__ico { display: flex; flex: none; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 11px; background: #f0f7f2; color: var(--pl-azul); }
.mg-pl-ajuda__ico svg { width: 22px; height: 22px; }
.mg-pl-ajuda h2 { margin-bottom: 8px; font-size: 17px; font-weight: 800; line-height: 1.2; color: var(--pl-marinho); }
.mg-pl-ajuda p { font-size: 12.5px; font-weight: 400; line-height: 1.6; color: var(--pl-texto2); }
.mg-pl-ajuda .mg-pl-ajuda__nota { margin-top: 12px; font-size: 11px; line-height: 1.5; text-align: center; }
.mg-pl-faq__topo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.mg-pl-faq h2 { font-size: 17px; font-weight: 800; line-height: 1; letter-spacing: -.015em; color: var(--pl-marinho); }
.mg-planos .mg-pl-faq__todas { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; line-height: 1; text-decoration: none; color: var(--pl-azul); }
.mg-pl-faq__todas svg { width: 13px; height: 13px; stroke-width: 2.4; }
.mg-pl-faq__lista { display: flex; flex-direction: column; gap: 9px; }
.mg-pl-faq__item { border: 1px solid var(--pl-borda); border-radius: 10px; }
.mg-pl-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; list-style: none; cursor: pointer; font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--pl-texto); }
.mg-pl-faq__item summary::-webkit-details-marker { display: none; }
.mg-pl-faq__item summary svg { width: 13px; height: 13px; color: #8fa1bb; stroke-width: 2.6; transition: transform .2s ease; }
.mg-pl-faq__item[open] summary svg { transform: rotate(180deg); }
.mg-pl-faq__item summary:hover { color: var(--pl-azul); }
.mg-pl-faq__resposta { padding: 0 16px 14px; font-size: 12.5px; line-height: 1.6; color: var(--pl-texto2); }

/* ── Vazio ───────────────────────────────────────────────────────────────── */

.mg-pl-vazio { margin-top: 22px; padding: 40px 22px; border: 1px dashed #b9dcc8; border-radius: 15px; background: #fff; text-align: center; }
.mg-pl-vazio h2 { font-size: 19px; font-weight: 800; color: var(--pl-marinho); }
.mg-pl-vazio p { margin: 8px 0 18px; line-height: 1.6; color: var(--pl-texto2); }

/* ── CTA final (333-352) ─────────────────────────────────────────────────── */

.mg-pl-final { position: relative; overflow: hidden; height: 184px; margin-top: 26px; background: linear-gradient(110deg, #0b3a25 0%, #14447c 40%, #4c7a8e 68%, #8fa97c 100%); }
.mg-pl-final__foto { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; background-size: cover; background-position: center; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%); mask-image: linear-gradient(90deg, transparent 0%, #000 45%); }
.mg-pl-final__veu { position: absolute; inset: 0; background: linear-gradient(90deg, #0b3a25 0%, rgba(11, 58, 37, .96) 40%, rgba(11, 58, 37, .55) 70%, rgba(11, 58, 37, .35) 100%); }
.mg-pl-final__in { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 30px; height: 100%; padding-block: 32px; }
.mg-pl-final h2 { margin-bottom: 10px; font-size: 25px; font-weight: 800; line-height: 1.25; letter-spacing: -.02em; color: #fff; }
.mg-pl-final p { max-width: 390px; font-size: 13.5px; font-weight: 400; line-height: 1.6; color: #d3e2f2; }
.mg-pl-manuscrito--final { right: 26px; top: 34px; transform: rotate(-5deg); font-size: 16px; color: #fff; text-shadow: 0 1px 8px rgba(11, 58, 37, .9); }
.mg-pl-manuscrito--final .mg-pl-traco { width: 102px; height: 11px; }
.mg-pl-final a:focus-visible { outline-color: #fff; }

/* ── Até 1280: o que não cabe em 4 colunas ───────────────────────────────── */

@media (max-width: 1279.98px) {
	.mg-pl-adicional { grid-template-columns: auto 1fr; }
	.mg-pl-adicional__lista, .mg-pl-adicional .mg-pl-btn--roxo { grid-column: 1 / -1; }
	.mg-pl-adicional .mg-pl-btn--roxo { width: 100%; }
	.mg-pl-manuscrito { display: none; }
	.mg-planos .mg-pl-btn--final { margin-right: 0; }
}
@media (max-width: 1023.98px) {
	.mg-pl-inferior, .mg-pl-inferior:not(:has(.mg-pl-tabela:not(.is-inativo))) .mg-pl-duvidas { grid-template-columns: minmax(0, 1fr); }
	.mg-pl-abas__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── Celular (Mobile Telas, bloco PLANOS) ────────────────────────────────── */

@media (max-width: 767.98px) {
	.mg-pl-so-desktop, .mg-pl-so-desktop-bloco { display: none !important; }
	.mg-pl-so-desktop-flex { display: none !important; }
	.mg-pl-so-movel { display: block; }

	.mg-pl-hero { min-height: 0; background: linear-gradient(150deg, #eaf2fb, #dceaf6 42%, #c3d6c2 78%, #d8be92 100%); }
	.mg-pl-hero__foto { width: 100%; opacity: .35; }
	.mg-pl-hero__veu { background: linear-gradient(180deg, rgba(246, 249, 253, .9) 0%, rgba(246, 249, 253, .75) 100%); }
	.mg-pl-hero__in { padding-block: 22px 20px; }
	.mg-pl-migalha { margin-bottom: 14px; font-size: 12.5px; }
	.mg-pl-eyebrow { margin-bottom: 14px; padding: 8px 11px; font-size: 9.5px; }
	.mg-pl-hero h1 { margin-bottom: 11px; font-size: 25px; line-height: 1.22; }
	.mg-pl-hero__sub { margin-bottom: 16px; font-size: 12.5px; }
	.mg-pl-beneficios { flex-direction: column; align-items: flex-start; gap: 10px; }
	.mg-pl-beneficios li { gap: 9px; font-size: 11.5px; line-height: 1; }
	.mg-pl-beneficios br { display: none; }

	.mg-pl-abas { padding-top: 16px; }
	.mg-pl-abas__lista { display: flex; gap: 9px; margin-inline: -16px; padding: 0 16px 2px; overflow-x: auto; scrollbar-width: none; }
	.mg-pl-abas__lista::-webkit-scrollbar { display: none; }
	.mg-planos .mg-pl-aba, .mg-planos .mg-pl-aba[aria-selected="true"], .mg-planos .mg-pl-aba[aria-current="true"] { flex: none; gap: 8px; padding: 11px 15px; border-radius: 10px; }
	.mg-planos .mg-pl-aba[aria-selected="true"], .mg-planos .mg-pl-aba[aria-current="true"] { padding: 12px 15px; }
	.mg-pl-aba__ico, .mg-pl-aba[aria-selected="true"] .mg-pl-aba__ico, .mg-pl-aba[aria-current="true"] .mg-pl-aba__ico { width: auto; height: auto; background: none; }
	.mg-pl-aba__ico svg { width: 16px; height: 16px; }
	.mg-pl-aba__rot { font-size: 11.5px; font-weight: 600; white-space: nowrap; }
	.mg-pl-aba[aria-selected="true"] .mg-pl-aba__rot, .mg-pl-aba[aria-current="true"] .mg-pl-aba__rot { font-weight: 700; }
	.mg-pl-aba__sub { display: none; }

	.mg-pl-painel { padding-top: 16px; }
	.mg-pl-cab { display: block; padding: 16px; border-radius: 13px; }
	.mg-pl-cab__id { gap: 11px; margin-bottom: 0; }
	.mg-pl-cab__ico { width: 38px; height: 38px; border-radius: 10px; }
	.mg-pl-cab__ico svg { width: 20px; height: 20px; }
	.mg-pl-cab h2 { margin-bottom: 6px; font-size: 14.5px; line-height: 1.25; }
	.mg-pl-cab p { font-size: 11px; line-height: 1.2; }
	.mg-pl-ciclo { display: block; margin-top: 14px; }
	.mg-pl-ciclo__grupo button { flex: 1; padding: 11px 0; font-size: 12px; }
	.mg-pl-economia { display: block; margin-top: 9px; padding: 9px 0; border-radius: 8px; font-size: 10.5px; text-align: center; }

	.mg-pl-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; padding-top: 14px; }
	.mg-pl-card { padding: 18px; border-radius: 14px; }
	.mg-pl-card--gratis { order: 9; }
	.mg-pl-selo { top: -12px; right: 16px; padding: 7px 11px; font-size: 9.5px; }
	.mg-pl-card__topo { gap: 11px; margin-bottom: 14px; }
	.mg-pl-card__ico { width: 38px; height: 38px; border-radius: 10px; }
	.mg-pl-card h3 { font-size: 16px; }
	.mg-pl-card__promessa { font-size: 11px; }
	.mg-pl-preco { gap: 4px 7px; margin-bottom: 16px !important; }
	.mg-pl-preco__valor { font-size: 27px; }
	.mg-pl-preco__per { font-size: 11.5px; }
	.mg-pl-lista { flex: none; gap: 10px; padding-top: 14px; }
	.mg-pl-lista li { gap: 9px; font-size: 11.5px; }
	.mg-pl-lista li.is-d { display: none; }
	.mg-pl-lista li.is-m { display: flex; }
	.mg-pl-card .mg-pl-btn { margin-top: 16px; padding: 14px 16px; font-size: 12.5px; }
	.mg-pl-card .mg-pl-btn--contorno { padding: 13px 16px; }
	.mg-pl-card .mg-pl-nota { display: none; }
	.mg-planos .mg-pl-comparar { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; padding: 14px 0; border: 1.5px solid #c9e2d3; border-radius: 9px; background: #fff; font-size: 12.5px; font-weight: 700; line-height: 1; text-decoration: none; color: var(--pl-azul); }
	.mg-pl-comparar svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.4; }

	.mg-pl-adicionais { padding-top: 16px; }
	.mg-pl-adicional { display: grid; grid-template-columns: 64px 1fr; gap: 14px 13px; padding: 18px; border-radius: 14px; }
	.mg-pl-adicional__arte { width: 64px; height: 64px; border-radius: 12px; }
	.mg-pl-adicional__selo { margin-bottom: 9px; padding: 6px 9px; font-size: 9px; border-radius: 5px; }
	.mg-pl-adicional h2 { margin-bottom: 0; font-size: 17px; }
	.mg-pl-adicional__desc { margin: 6px 0 0 !important; font-size: 11px; line-height: 1.4; }
	.mg-pl-adicional .mg-pl-preco { grid-column: 1 / -1; margin: 0 !important; }
	.mg-pl-adicional__txt { display: contents; }
	.mg-pl-adicional__txt > .mg-pl-adicional__selo, .mg-pl-adicional__txt > h2, .mg-pl-adicional__txt > .mg-pl-adicional__desc { grid-column: 2; }
	.mg-pl-adicional .mg-pl-preco__valor { font-size: 22px; }
	.mg-pl-adicional__lista { display: none; }
	.mg-pl-adicional .mg-pl-btn--roxo { grid-column: 1 / -1; padding: 14px 0; font-size: 12.5px; }

	.mg-pl-inferior { gap: 16px; padding-top: 16px; }
	.mg-pl-tabela { padding: 16px; border-radius: 14px; }
	.mg-pl-tabela h2 { margin-bottom: 14px; font-size: 15px; }
	.mg-pl-tabela tbody th { min-width: 8.5rem; }
	.mg-pl-duvidas { gap: 16px; }
	.mg-pl-ajuda, .mg-pl-faq { padding: 18px; border-radius: 14px; }
	.mg-pl-ajuda__ico { display: none; }
	.mg-pl-ajuda__topo { margin-bottom: 14px; }
	.mg-pl-ajuda h2 { margin-bottom: 9px; font-size: 15px; }
	.mg-pl-ajuda p { font-size: 11.5px; }
	.mg-pl-ajuda .mg-pl-btn--zap { padding: 14px 0; font-size: 12.5px; }
	.mg-pl-ajuda .mg-pl-ajuda__nota { display: none; }
	.mg-pl-faq__topo { margin-bottom: 14px; }
	.mg-pl-faq h2 { font-size: 15px; }
	.mg-pl-faq__item summary { padding: 13px; font-size: 11.5px; line-height: 1.4; }
	.mg-pl-faq__item.is-extra-movel { display: none; }

	.mg-pl-final { height: auto; margin-top: 16px; }
	.mg-pl-final__foto { width: 100%; opacity: .5; }
	.mg-pl-final__veu { background: rgba(11, 58, 37, .9); }
	.mg-pl-final__in { flex-direction: column; align-items: stretch; gap: 16px; padding-block: 26px; }
	.mg-pl-final h2 { font-size: 20px; }
	.mg-pl-final p { font-size: 12.5px; }
	.mg-planos .mg-pl-btn--final { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.mg-planos * { transition: none !important; }
}

/* 17/09/2026 - Valoar: pedido do dono depois de ver no ar. Bronze e Ouro ficam brancos, sem selo e com
   botão de contorno: o único card em destaque é o indicado (Prata), para puxar a escolha para ele. */
.mg-pl-card--bronze, .mg-pl-card--ouro { border-color: var(--pl-borda); background: #fff; }
.mg-pl-card--bronze .mg-pl-card__ico, .mg-pl-card--ouro .mg-pl-card__ico { background: #eff3f8; color: var(--pl-texto2); }
.mg-pl-card--bronze h3, .mg-pl-card--ouro h3 { color: var(--pl-marinho); }
.mg-pl-card--bronze .mg-pl-card__promessa, .mg-pl-card--ouro .mg-pl-card__promessa { color: var(--pl-texto2); }
.mg-pl-card--bronze .mg-pl-lista, .mg-pl-card--ouro .mg-pl-lista { border-top-color: var(--pl-div); }
.mg-pl-tabela thead th.is-bronze, .mg-pl-tabela thead th.is-ouro { color: var(--pl-texto2); }

/* 17/09/2026: a ilustração de redes sociais do adicional (SVG em planos.php) no lugar do quadrado roxo. */
.mg-pl-adicional__arte--ilustra { background: none; border-radius: 0; overflow: visible; }
.mg-pl-adicional__arte--ilustra svg { width: 100%; height: 100%; }
@media (max-width: 767.98px) {
	.mg-pl-adicional { grid-template-rows: auto auto auto; row-gap: 0; }
	.mg-pl-adicional__arte { grid-column: 1; grid-row: 1 / span 3; align-self: center; }
	.mg-pl-adicional__txt > .mg-pl-adicional__selo { grid-row: 1; justify-self: start; align-self: end; }
	.mg-pl-adicional__txt > h2 { grid-row: 2; }
	.mg-pl-adicional__txt > .mg-pl-adicional__desc { grid-row: 3; align-self: start; }
	.mg-pl-adicional .mg-pl-preco { margin-top: 14px !important; }
	.mg-pl-adicional .mg-pl-btn--roxo { margin-top: 14px; }
}

/* 17/09/2026 - Valoar: "Tudo do Bronze, mais:" antes da lista escrita à mão (`=` na descrição do plano). */
.mg-pl-lead { margin: 0; padding-top: 18px; border-top: 1px solid var(--pl-div); font-size: 12px; font-weight: 700; line-height: 1.4; color: var(--pl-marinho); }
.mg-pl-card--rec .mg-pl-lead { border-top-color: #dcede2; color: var(--pl-azul); }
.mg-pl-lista.mg-pl-lista--lead { padding-top: 11px; border-top: 0; }
@media (max-width: 767px) {
	.mg-pl-lead { padding-top: 14px; font-size: 11.5px; }
	.mg-pl-lista.mg-pl-lista--lead { padding-top: 10px; }
}
