/* =========================================================
   +MARGEM — Simulador de Pressão Bancária
   Bloco de entrada (Raio-X gratuito) + ranking de faixas.
   Usa as variáveis de assets/style.css
   ========================================================= */

.pressao{
  background:var(--navy);color:#fff;
  padding:0 0 96px;position:relative;overflow:hidden;
}
.pressao::before{
  content:"";position:absolute;left:-190px;top:-160px;
  width:520px;height:520px;border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 0 0 60px rgba(255,255,255,.025);
  pointer-events:none;
}
.pressao-grid{
  display:grid;grid-template-columns:1fr 1.05fr;gap:60px;align-items:center;
  position:relative;z-index:2;
}

/* ---------- Coluna de texto ---------- */
.pressao-copy h2{
  color:#fff;font-size:clamp(2.2rem,4.3vw,3.4rem);
  line-height:1.08;margin-bottom:.4em;max-width:14ch;
}
.pressao-copy h2 em{
  font-style:italic;color:var(--copper-light);display:block;
}
.pressao-copy p{color:rgba(255,255,255,.72);max-width:46ch;font-size:1.02rem}
.pressao-tags{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:30px 0 0;padding:0}
.pressao-tags li{
  border:1px solid rgba(255,255,255,.22);border-radius:22px;
  padding:8px 16px;font-size:.78rem;color:rgba(255,255,255,.78);
}

/* ---------- Cartão de entrada ---------- */
.pressao-card{
  background:var(--cream);color:var(--ink);
  border-radius:6px;box-shadow:var(--shadow);padding:34px 32px;
}
.pc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.pc-head .eyebrow{margin-bottom:0}
.pc-time{
  background:var(--cream-dark);color:var(--muted);border-radius:20px;
  padding:6px 13px;font-size:.72rem;font-weight:600;white-space:nowrap;
}
.pressao-card h3{margin:14px 0 26px;max-width:18ch}

.pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pc-grid .pc-field--full{grid-column:1/-1}
.pc-field label{
  display:block;font-size:.8rem;font-weight:600;color:var(--ink);margin-bottom:8px;
}
.pc-money{
  display:flex;align-items:center;height:52px;background:#fff;
  border:1px solid rgba(14,32,56,.2);border-radius:var(--radius);transition:.16s;
}
.pc-money:focus-within{border-color:var(--copper);box-shadow:0 0 0 3px rgba(193,112,63,.14)}
.pc-money > span{padding:0 4px 0 14px;color:var(--copper);font-size:.86rem;font-weight:700}
.pc-money input{
  width:100%;min-width:0;border:0;outline:0;background:none;
  font-family:var(--sans);font-size:1.05rem;font-weight:600;color:var(--ink);
  padding:0 14px 0 8px;
}
.pc-money input::placeholder{color:rgba(14,32,56,.34);font-weight:400}
.pc-hint{font-size:.76rem;color:var(--muted);margin:7px 0 0;line-height:1.45}

.pc-submit{
  width:100%;justify-content:space-between;margin-top:26px;border:0;
  font-size:.95rem;padding:19px 26px;
}
.pc-submit .arrow{font-size:1.1rem;line-height:1}
.pc-note{font-size:.74rem;color:var(--muted);text-align:center;margin:14px 0 0}
.pc-error{
  display:none;background:rgba(178,86,86,.1);border-left:2px solid #B25656;
  color:#8E3C3C;font-size:.82rem;padding:11px 14px;margin-top:18px;border-radius:var(--radius);
}
.pc-error.show{display:block}

/* ---------- Resultado ---------- */
.pc-result{padding-top:4px}
.pc-result-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pc-index{
  font-family:var(--serif);font-size:clamp(3rem,7vw,4rem);line-height:1;
  font-variant-numeric:tabular-nums;margin:0;
}
.pc-index small{font-size:1.4rem;color:var(--muted)}
.pc-badge{
  border-radius:20px;padding:8px 15px;font-size:.76rem;font-weight:700;
  color:#fff;white-space:nowrap;
}
.pc-formula{
  font-size:.76rem;color:var(--muted);margin:12px 0 0;line-height:1.5;
}
.pc-formula b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.pc-verdict{font-size:.92rem;margin:18px 0 0;line-height:1.55}

/* Ranking de faixas */
.pc-ranking{list-style:none;margin:26px 0 0;padding:0;border-top:1px solid var(--line)}
.pc-ranking li{
  display:grid;grid-template-columns:8px 108px 1fr auto;gap:14px;align-items:center;
  padding:13px 12px 13px 8px;border-bottom:1px solid var(--line);
  border-left:2px solid transparent;font-size:.86rem;color:var(--muted);
}
.pc-ranking .dot{width:8px;height:8px;border-radius:50%;background:currentColor}
.pc-ranking .faixa{font-variant-numeric:tabular-nums;color:var(--ink)}
.pc-ranking .rotulo{font-weight:600}
.pc-ranking .marcador{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:0}
.pc-ranking li.atual{
  background:#fff;border-left-color:currentColor;
  box-shadow:0 6px 20px rgba(8,21,39,.07);
}
.pc-ranking li.atual .marcador{opacity:1}
.pc-ranking li.atual .rotulo,.pc-ranking li.atual .faixa{color:inherit}

/* Cores por faixa */
.f-critico{color:#A8443F}
.f-risco{color:#BE6141}
.f-atencao{color:#C1703F}
.f-equilibrio{color:#4F8A73}
.f-conforto{color:#2D7D62}
.pc-badge.f-critico{background:#A8443F}
.pc-badge.f-risco{background:#BE6141}
.pc-badge.f-atencao{background:#C1703F}
.pc-badge.f-equilibrio{background:#4F8A73}
.pc-badge.f-conforto{background:#2D7D62}

.pc-cenario{
  background:#fff;border-left:2px solid var(--copper);border-radius:var(--radius);
  padding:16px 18px;margin-top:22px;font-size:.84rem;line-height:1.55;color:var(--muted);
}
.pc-cenario b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

.pc-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.pc-actions .btn{flex:1;justify-content:center;min-width:190px}
.pc-restart{
  background:none;border:0;color:var(--muted);text-decoration:underline;
  font-family:var(--sans);font-size:.8rem;cursor:pointer;padding:10px 0 0;display:block;
  margin:0 auto;
}
.pc-restart:hover{color:var(--copper)}

/* ---------- Responsivo ---------- */
@media (max-width:1050px){
  .pressao-grid{grid-template-columns:1fr;gap:40px}
  .pressao-copy h2{max-width:20ch}
}
@media (max-width:760px){
  .pressao{padding-bottom:76px}
  .pressao-card{padding:26px 22px}
  .pc-grid{grid-template-columns:1fr}
  .pc-ranking li{grid-template-columns:8px 100px 1fr;row-gap:2px}
  .pc-ranking .marcador{grid-column:2/-1}
  .pc-actions .btn{min-width:0;width:100%}
}
@media (max-width:400px){
  .pressao-card{padding:22px 18px}
  .pc-ranking li{grid-template-columns:8px 1fr;gap:10px}
  .pc-ranking .faixa{grid-column:2}
  .pc-ranking .rotulo{grid-column:2}
  .pc-ranking .marcador{grid-column:2}
}

@media (prefers-reduced-motion:reduce){
  .pc-money,.pc-ranking li{transition:none}
}