/* ==========================================================================
   CONFECAP · PÁGINA "CONTRIBUIR"  —  CSS específico
   Usa apenas os tokens de site.css. Navy + safira + dourado só como fio.
   ========================================================================== */

/* Layout principal: cartão do PIX + texto de destino ---------------------- */
.give{
  display:grid; gap:clamp(2rem,5vw,3.5rem);
  align-items:start;
}
@media (min-width:960px){
  .give{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
}

/* --- Cartão do PIX --------------------------------------------------------- */
.pixcard{padding:clamp(1.6rem,4vw,2.6rem)}
.pixcard__kicker{
  font-family:var(--font-display); font-weight:600; font-size:var(--t-eyebrow);
  letter-spacing:.2em; text-transform:uppercase; color:var(--gold-300);
  margin:0 0 .7rem;
}
.pixcard h2{font-size:var(--t-h3); color:#fff; margin-bottom:.6rem}
.pixcard__hint{
  margin:0 0 1.6rem; color:var(--on-dark-soft); font-size:var(--t-small); line-height:1.7;
}

/* linha da chave + botão copiar */
.keyrow{
  display:flex; flex-wrap:wrap; gap:.9rem; align-items:stretch;
}
.keybox{
  flex:1 1 15rem; min-width:0;
  display:flex; flex-direction:column; justify-content:center;
  background:#08182F; border:1px solid var(--hair-strong); border-radius:4px;
  padding:.85rem 1.05rem;
}
.keybox b{
  font-family:var(--font-display); font-size:.66rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--gold-300);
  margin-bottom:.28rem;
}
.keybox span{
  font-family:var(--font-display); font-weight:700; font-size:1.12rem;
  letter-spacing:.02em; color:#fff; word-break:break-all;
  -webkit-user-select:all; user-select:all;
}
.copybtn{flex:0 0 auto}
.copybtn[data-copied="1"]{background:var(--navy-700)}
.copybtn .copybtn__ok{display:none}
.copybtn[data-copied="1"] .copybtn__ok{display:inline}
.copybtn[data-copied="1"] .copybtn__default{display:none}

/* moldura reservada ao QR Code */
.qr{
  margin-top:1.6rem; display:flex; gap:1.1rem; align-items:center;
  padding-top:1.6rem; border-top:1px solid var(--hair);
}
.qr__frame{
  flex:0 0 auto; width:112px; height:112px; border-radius:4px;
  display:grid; place-items:center; text-align:center;
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,.04) 0 8px, transparent 8px 16px),
    #08182F;
  border:1px dashed var(--hair-strong);
  color:var(--on-dark-mute);
  font-family:var(--font-display); font-weight:600; font-size:.62rem;
  letter-spacing:.14em; text-transform:uppercase; line-height:1.5; padding:.5rem;
}
.qr__text{margin:0; color:var(--on-dark-soft); font-size:var(--t-small); line-height:1.7}

/* --- Coluna de confiança / destino ---------------------------------------- */
.trust h2{font-size:var(--t-h3); color:#fff}
.trust .rule-gold{margin-top:1.1rem}
.trust p{margin:1.4rem 0 0; color:var(--on-dark-soft); line-height:1.75}
.trust .lead{color:var(--on-dark); margin-top:1.4rem}

.usos{margin:1.9rem 0 0; display:grid; gap:.85rem}
.usos li{
  position:relative; padding-left:1.7rem; color:var(--on-dark-soft);
  font-size:var(--t-small); line-height:1.65;
}
.usos li::before{
  content:""; position:absolute; left:0; top:.5em; width:9px; height:9px;
  border-right:1.5px solid var(--gold-500); border-bottom:1.5px solid var(--gold-500);
  transform:rotate(-45deg);
}
.usos li b{color:#fff; font-weight:600}

/* --- Contas bancárias (seção clara) --------------------------------------- */
.accounts{
  display:grid; gap:1.25rem; margin-top:2.4rem;
}
@media (min-width:680px){.accounts{grid-template-columns:repeat(2,minmax(0,1fr))}}

.acct{
  background:var(--paper); border:1px solid var(--line); border-radius:6px;
  padding:clamp(1.5rem,3.4vw,2.1rem);
  box-shadow:0 24px 48px -34px rgba(10,31,68,.4);
}
.acct__bank{
  display:flex; align-items:baseline; gap:.6rem; margin:0 0 1.2rem;
  font-family:var(--font-display); font-weight:800; font-size:1.2rem;
  letter-spacing:-.01em; color:var(--ink-900);
}
.acct__bank em{
  font-style:normal; font-size:.7rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:#836810;
}
.acct dl{display:grid; gap:.9rem; margin:0}
.acct dl > div{
  display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  padding-bottom:.9rem; border-bottom:1px solid var(--line);
}
.acct dl > div:last-child{border-bottom:0; padding-bottom:0}
.acct dt{
  font-family:var(--font-display); font-size:.7rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-400);
}
.acct dd{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1.05rem;
  color:var(--ink-900); text-align:right;
}

/* Faixa do CNPJ */
.cnpjbar{
  display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem;
  margin-top:2.4rem; padding:1.1rem 1.4rem;
  background:var(--paper); border:1px solid var(--line); border-radius:6px;
}
.cnpjbar span{
  font-family:var(--font-display); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-400);
}
.cnpjbar strong{
  font-family:var(--font-display); font-weight:800; font-size:1.05rem;
  letter-spacing:.02em; color:var(--ink-900);
}