/* ============================================
   PLANOS E PREÇOS - ControleNaMão
   Arquivo único da página. Navbar e footer
   trazem o próprio CSS via JS.
   ============================================ */

:root{
    --pp-laranja:#ff9d01;
    --pp-laranja-2:#ffb347;
    --pp-titulo:#0c272f;
    --pp-nome:#2b333b;
    --pp-texto:#334155;
    --pp-cinza:#94a3b8;
    --pp-borda:#e5e7eb;
    --pp-grafite:#3a434d;
    --pp-linha:rgba(255,255,255,.35);
    /* 1u = 1% da altura útil da tela (descontando a navbar de 80px).
       No desktop, fontes e espaçamentos acompanham a altura para
       planos + módulos caberem numa tela só. */
    --u:calc((100vh - 80px) / 100);
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--pp-texto);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto}
*:focus-visible{outline:2px solid var(--pp-laranja);outline-offset:2px}

/* Utilitários usados pelo footer.js */
.mb-1{margin-bottom:.25rem}
.img-fluid{max-width:100%;height:auto}

/* ===== ESTRUTURA ===== */
.pp-wrap{width:100%;max-width:1440px;margin:0 auto;padding:0 clamp(16px,2vw,32px)}
.pp-section{padding:clamp(10px,calc(var(--u) * 1.6),32px) 0 0;scroll-margin-top:80px}
.pp-titulo{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(24px,min(2.8vw,calc(var(--u) * 4)),44px);line-height:1.15;
    color:var(--pp-titulo);text-align:center;
    margin:0 0 clamp(10px,calc(var(--u) * 1.6),30px);
}

/* ===== CARDS DOS PLANOS ===== */
.pp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,22px);align-items:stretch}

.pp-card{
    position:relative;overflow:hidden;
    display:flex;flex-direction:column;
    background:#fff;border:1px solid var(--pp-borda);border-radius:18px;
    padding:clamp(14px,calc(var(--u) * 2),28px) clamp(14px,1.4vw,26px);
    box-shadow:0 4px 18px rgba(15,23,42,.05);
}
.pp-card--destaque{
    background:linear-gradient(160deg,var(--pp-laranja) 0%,var(--pp-laranja-2) 100%);
    border-color:var(--pp-laranja);
    box-shadow:0 14px 40px rgba(255,157,1,.35);
}

/* Faixa diagonal "Mais vendido" */
.pp-ribbon{
    position:absolute;top:24px;right:-48px;width:180px;
    padding:6px 0;transform:rotate(45deg);
    background:var(--pp-grafite);color:#fff;
    font-family:"Syne",sans-serif;font-size:11px;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;text-align:center;
    box-shadow:0 3px 10px rgba(0,0,0,.2);
}

.pp-nome{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(20px,min(2.1vw,calc(var(--u) * 3.4)),36px);line-height:1.1;
    color:var(--pp-nome);text-align:center;
    margin:0 0 clamp(6px,calc(var(--u) * .9),12px);
}

.pp-usuarios{
    display:flex;align-items:center;gap:5px;
    width:fit-content;margin:0 auto;
    padding:4px 14px;border:2px solid var(--pp-laranja);border-radius:999px;
    background:#fff4e2;color:var(--pp-laranja);
    font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap;
}
.pp-usuarios svg{display:block;flex-shrink:0}
.pp-ico-pc{width:19px;height:16px;margin-left:4px}
.pp-ico-cel{width:10px;height:16px}

.pp-preco{
    display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:4px;
    margin:clamp(8px,var(--u),20px) 0;padding:clamp(8px,var(--u),20px) 0;
    border-top:1px solid var(--pp-borda);border-bottom:1px solid var(--pp-borda);
}
.pp-valor{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(26px,min(2.8vw,calc(var(--u) * 4.6)),50px);line-height:1;letter-spacing:-.02em;
    color:var(--pp-laranja);white-space:nowrap;
}
.pp-periodo{font-size:14px;color:var(--pp-cinza)}

.pp-desc{
    text-align:center;
    font-size:clamp(13px,min(1.05vw,calc(var(--u) * 1.7)),16px);line-height:1.45;
    margin:0 0 clamp(8px,calc(var(--u) * 1.2),20px);min-height:2.9em;
}

.pp-recursos{
    list-style:none;padding:0;flex-grow:1;
    display:flex;flex-direction:column;gap:clamp(3px,calc(var(--u) * .55),10px);
    margin:0 0 clamp(10px,calc(var(--u) * 1.4),24px);
}
.pp-recursos li{
    position:relative;padding-left:26px;
    font-size:clamp(13px,min(1vw,calc(var(--u) * 1.55)),16px);line-height:1.35;
    color:#1e293b;
}
.pp-recursos li::before{
    content:"";position:absolute;left:5px;top:.18em;
    width:.4em;height:.72em;
    border:solid var(--pp-laranja);border-width:0 2.5px 2.5px 0;
    transform:rotate(45deg);
}

.pp-cta{
    display:block;text-align:center;
    padding:clamp(9px,calc(var(--u) * 1.2),14px) 16px;border-radius:12px;
    background:var(--pp-laranja);color:#fff;
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(14px,min(1.05vw,calc(var(--u) * 1.7)),16px);text-decoration:none;
    transition:transform .2s ease,box-shadow .2s ease;
}
.pp-cta:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(255,157,1,.4)}

/* Card em destaque: tudo em branco */
.pp-card--destaque .pp-nome,
.pp-card--destaque .pp-desc,
.pp-card--destaque .pp-valor,
.pp-card--destaque .pp-recursos li{color:#fff}
.pp-card--destaque .pp-periodo{color:rgba(255,255,255,.9)}
.pp-card--destaque .pp-usuarios{background:#fff;border-color:#fff}
.pp-card--destaque .pp-preco{border-color:rgba(255,255,255,.45)}
.pp-card--destaque .pp-recursos li::before{border-color:#fff}
.pp-card--destaque .pp-cta{background:#fff;color:#e68a00}
.pp-card--destaque .pp-cta:hover{box-shadow:0 6px 18px rgba(0,0,0,.18)}
.pp-card--destaque .pp-cta:focus-visible{outline-color:#fff}

/* ===== MÓDULOS ADICIONAIS (título + 5 módulos) ===== */
.pp-extras{
    display:grid;grid-template-columns:minmax(0,.65fr) repeat(5,minmax(0,1fr));
    align-items:start;
    margin-top:clamp(12px,calc(var(--u) * 1.8),40px);
    padding:clamp(14px,calc(var(--u) * 2),28px) clamp(16px,1.8vw,32px);
    border-radius:20px;
    background:linear-gradient(100deg,#2f3740 0%,#4b535c 45%,#7b8087 100%);
    color:#fff;
}
/* O título e os ícones se ajustam à largura da própria coluna */
.pp-extras__intro{
    container-type:inline-size;
    display:flex;flex-direction:column;align-items:center;text-align:center;
    padding:0 8px;align-self:center;
}
.pp-extras__titulo{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(18px,14cqi,32px);line-height:1.15;
    color:#fff;margin:0 0 clamp(8px,calc(var(--u) * 1.4),16px);
}
.pp-extras__icones{display:flex;flex-wrap:nowrap;justify-content:center;gap:6px}
.pp-extras__icones svg{
    flex-shrink:0;
    width:min(28px,calc((100cqi - 24px) / 5));
    height:min(28px,calc((100cqi - 24px) / 5));
    fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
}

/* Cada módulo vira um "container": o título se ajusta à largura da coluna */
.pp-modulo{container-type:inline-size;min-width:0;padding:2px clamp(8px,1vw,18px)}
.pp-modulo + .pp-modulo{border-left:1px solid var(--pp-linha)}
.pp-modulo__nome{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(13px,8.6cqi,21px);line-height:1.2;
    white-space:nowrap;
    color:#fff;text-align:center;margin:0 0 4px;
}
.pp-modulo__preco{
    font-family:"Syne",sans-serif;font-weight:700;
    font-size:clamp(11px,6cqi,16px);
    color:var(--pp-laranja);text-align:center;
    margin:0 0 clamp(6px,calc(var(--u) * 1.1),14px);
}

.pp-modulo ul{
    list-style:none;margin:0 auto;padding:0;width:fit-content;
    display:flex;flex-direction:column;gap:clamp(3px,calc(var(--u) * .5),8px);
}
.pp-modulo li{
    position:relative;padding-left:20px;
    font-size:clamp(12px,min(.85vw,calc(var(--u) * 1.45)),15px);line-height:1.35;color:#fff;
}
.pp-modulo li::before{
    content:"";position:absolute;left:3px;top:.15em;
    width:.38em;height:.7em;
    border:solid var(--pp-laranja);border-width:0 2.5px 2.5px 0;
    transform:rotate(45deg);
}
.pp-modulo .pp-lista-2col{
    display:grid;grid-auto-flow:column;grid-template-rows:repeat(4,auto);
    gap:clamp(3px,calc(var(--u) * .5),8px) clamp(10px,1vw,18px);
}

/* ===== NOTEBOOK (até 1360px): título dos módulos numa linha por cima ===== */
@media (max-width:1360px){
    .pp-extras{grid-template-columns:repeat(5,minmax(0,1fr));row-gap:clamp(10px,calc(var(--u) * 1.4),18px)}
    .pp-extras__intro{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px 18px}
    .pp-extras__titulo{margin:0}
    .pp-extras__titulo br{display:none}
}

/* ===== TABLET (até 1200px): planos 2x2, módulos 3 + 2 ===== */
@media (max-width:1200px){
    .pp-section{padding-top:28px}
    .pp-titulo{font-size:34px;margin-bottom:24px}
    .pp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
    .pp-card{padding:26px 24px}
    .pp-nome{font-size:30px;margin-bottom:10px}
    .pp-preco{margin:18px 0;padding:18px 0}
    .pp-valor{font-size:42px}
    .pp-desc{font-size:15px;margin-bottom:18px}
    .pp-recursos{gap:8px;margin-bottom:22px}
    .pp-recursos li{font-size:15px}
    .pp-cta{font-size:15px;padding:13px 16px}

    .pp-extras{grid-template-columns:repeat(6,minmax(0,1fr));gap:26px 0;margin-top:28px;padding:26px 24px}
    .pp-extras__titulo{font-size:28px}
    .pp-extras__icones{gap:10px}
    .pp-extras__icones svg{width:28px;height:28px}
    .pp-modulo{grid-column:span 2;padding:2px 16px}
    .pp-modulo:nth-of-type(4){grid-column:2/4}
    .pp-modulo:nth-of-type(5){grid-column:4/6}
    .pp-modulo + .pp-modulo{border-left:0}
    .pp-modulo:nth-of-type(2),
    .pp-modulo:nth-of-type(3),
    .pp-modulo:nth-of-type(5){border-left:1px solid var(--pp-linha)}
    .pp-modulo__preco{margin-bottom:12px}
    .pp-modulo ul,.pp-modulo .pp-lista-2col{gap:7px 18px}
    .pp-modulo li{font-size:14.5px}
}

/* ===== ATÉ 860px: módulos em 2 colunas, o último ocupa a linha toda ===== */
@media (max-width:860px){
    .pp-extras{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pp-modulo:nth-of-type(n){grid-column:auto;border-left:0}
    .pp-modulo:nth-of-type(even){border-left:1px solid var(--pp-linha)}
    .pp-modulo:nth-of-type(5){grid-column:1/-1;border-top:1px solid rgba(255,255,255,.25);padding-top:22px}
}

/* ===== CELULAR (até 700px): planos empilhados ===== */
@media (max-width:700px){
    .pp-section{padding-top:20px}
    .pp-titulo{font-size:28px;margin-bottom:20px}
    .pp-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto;gap:16px}
    .pp-card{padding:24px 22px}
    .pp-nome{font-size:28px}
    .pp-valor{font-size:40px}
    .pp-desc{min-height:0}
    .pp-extras{max-width:460px;margin-left:auto;margin-right:auto;padding:24px 18px;gap:22px 0}
    .pp-extras__titulo{font-size:24px}
    .pp-extras__icones svg{width:24px;height:24px}
    .pp-modulo{padding:2px 12px}
}

/* ===== CELULAR PEQUENO (até 560px): módulos em 1 coluna ===== */
@media (max-width:560px){
    .pp-extras{grid-template-columns:1fr;gap:0}
    .pp-extras__intro{flex-direction:column;margin-bottom:18px}
    .pp-modulo:nth-of-type(n){grid-column:auto;border-left:0;border-top:1px solid rgba(255,255,255,.25);padding:18px 4px}
}

@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ===== AVISO DE COOKIES (renderizado pelo main.js) =====
   Cópia do bloco do nova-home-min.css. Sem isso o banner
   aparece sem estilo nesta página. */
#cnm-cookie-banner{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);width:1140px;height:167px;flex-shrink:0;background:#fbfbfb;border-radius:12px;padding:20px 45px;display:flex;flex-direction:column;z-index:999999;box-shadow:0 10px 40px rgba(0,0,0,0.12);font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}#cnm-cookie-banner h3{width:1050px;height:17px;flex-shrink:0;color:#000;text-align:center;font-family:"Inter",sans-serif;font-size:16px;font-style:normal;font-weight:600;line-height:normal;margin:0 auto 10px auto}.cnm-content-wrapper{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;flex:1}.cnm-left{display:flex;flex-direction:column;gap:10px;flex:1}#cnm-cookie-banner p{width:719px;height:54px;color:rgba(0,0,0,0.56);font-family:"Inter",sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:normal;margin:0 auto}#cnm-cookie-banner p a{color:#316cf4;text-decoration:none}#cnm-cookie-banner p a:hover{text-decoration:underline}.cnm-cookie-options{display:flex;gap:24px;align-items:center;margin:0 auto;justify-content:center;width:719px}.cnm-check{display:flex;align-items:center;gap:6px;cursor:pointer;font-family:"Inter",sans-serif;font-size:14px;font-style:normal;font-weight:400;min-width:fit-content}.cnm-check.necessary{color:rgba(0,0,0,0.40)}.cnm-check:not(.necessary){color:rgba(0,0,0,0.56)}.cnm-check input[type="checkbox"]{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:17px;height:17px;border:2px solid #eabe6d;border-radius:3px;background:#fff;cursor:pointer;position:relative;flex-shrink:0;margin:0;vertical-align:middle}.cnm-check input[type="checkbox"]:checked{background:#eabe6d;border-color:#eabe6d}.cnm-check input[type="checkbox"]:checked::before{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.cnm-check.necessary input[type="checkbox"]:disabled{cursor:not-allowed;border-color:rgba(224,153,19,0.30);background:rgba(224,153,19,0.30);opacity:1}.cnm-check.necessary input[type="checkbox"]:disabled::before{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.cnm-buttons{display:flex;flex-direction:column;gap:7px;align-items:flex-end}.cnm-buttons-top{display:flex;gap:14px}.cnm-btn{border:0;cursor:pointer;font-family:"Inter",sans-serif;font-style:normal;border-radius:8px;transition:opacity .2s}.cnm-btn:hover{opacity:.9}.cnm-btn.reject-all{width:138px;height:33px;background:#D9D9D9B2;color:rgba(0,0,0,0.70);font-size:16px;font-weight:400}.cnm-btn.accept-all{width:138px;height:33px;background:rgba(224,153,19,0.61);color:#fff;font-size:16px;font-weight:600}.cnm-btn.accept-selection{width:290px;height:40px;background:#0000009C;color:#fff;font-size:16px;font-weight:600;text-align:center}@media(max-width:1200px){#cnm-cookie-banner{position:fixed !important;bottom:20px !important;top:auto !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;width:calc(100% - 40px);max-width:450px;height:auto;padding:16px 18px;margin:0 !important}#cnm-cookie-banner h3{width:100%;font-size:14px;margin-bottom:8px}.cnm-content-wrapper{flex-direction:column;gap:12px}.cnm-left{width:100%;gap:8px}#cnm-cookie-banner p{width:100%;height:auto;font-size:11px;line-height:1.4}.cnm-cookie-options{flex-wrap:nowrap;justify-content:flex-start;width:100%;gap:8px;overflow-x:auto;padding:4px 0}.cnm-check{gap:4px;font-size:10px;white-space:nowrap}.cnm-check input[type="checkbox"]{width:14px;height:14px;border-width:1.5px}.cnm-check input[type="checkbox"]:checked::before,.cnm-check.necessary input[type="checkbox"]:disabled::before{left:3px;top:0;width:3px;height:7px;border-width:0 1.5px 1.5px 0}.cnm-buttons{width:100%;align-items:stretch;gap:8px}.cnm-buttons-top{width:100%;justify-content:space-between;gap:8px}.cnm-btn.reject-all,.cnm-btn.accept-all{flex:1;height:36px;font-size:12px;border-radius:6px}.cnm-btn.accept-selection{width:100%;height:38px;font-size:12px;border-radius:6px}}@media(max-width:480px){#cnm-cookie-banner{position:fixed !important;bottom:15px !important;top:auto !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;width:calc(100% - 30px);padding:14px 16px;margin:0 !important}#cnm-cookie-banner h3{font-size:13px}#cnm-cookie-banner p{font-size:10px}.cnm-check{font-size:9px}.cnm-btn.reject-all,.cnm-btn.accept-all{font-size:11px;height:34px}.cnm-btn.accept-selection{font-size:11px;height:36px}}