/* ===== Página "Principais Contatos" — CRECI-MG =====
   assets/css/crc-contatos.css
   Carrega só no template page-contato-setores.php.
   .crc-ct-form = cartão do formulário (Contact Form 7)
   .crc-ct-setores / .crc-ct-delegacias = lista de contatos */

.crc-ct{
  --azul:#00619c; --azul-esc:#0a3f66; --azul-claro:#eaf3fa;
  --laranja:#f28b00; --borda:#e2e8ee; --campo:#cfd8e1; --texto:#2b3641; --suave:#5a6672;
  --erro:#b3261e;

  max-width:1080px; margin:28px auto 64px; padding:0 20px;
  color:var(--texto); font-size:15px; line-height:1.6;
}
.crc-ct [hidden]{ display:none !important; }

/* ---------- CARTÃO DO FORMULÁRIO ---------- */
.crc-ct-form{
  background:#fff; border:1px solid var(--borda); border-radius:16px;
  padding:30px 32px 32px; box-shadow:0 6px 20px rgba(10,63,102,.04);
  scroll-margin-top:100px;   /* link #formulario: o header fixo não cobre o topo do cartão */
}
/* topo do cartão: ícone + título */
.crc-ct-topo{ display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.crc-ct-topo-ico{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:var(--azul);
  display:flex; align-items:center; justify-content:center;
}
.crc-ct-topo-ico svg{ width:24px; height:24px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.crc-ct .crc-ct-titulo{ font-size:22px; font-weight:700; line-height:1.3; color:var(--texto); margin:0; padding:0; text-align:left; text-transform:none; letter-spacing:0; }

/* texto de abertura (o padrão do template ou o escrito no editor) */
.crc-ct-form > p{ margin:0 0 20px; font-size:15.5px; color:var(--suave); max-width:820px; }

/* uma linha separa o topo do formulário */
.crc-ct-form .wpcf7{ border-top:1px solid var(--borda); padding-top:22px; }

/* o CF7 embrulha os campos em <p> e põe <br> depois dos rótulos: neutraliza */
.crc-ct-form .wpcf7 form p{ margin:0; }
.crc-ct-form .wpcf7 form br{ display:none; }

.crc-ct-linha{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.crc-ct-campo{ margin-bottom:18px; min-width:0; }

.crc-ct-campo label,
.crc-ct-rotulo{
  display:block; width:auto; height:auto; margin:0 0 6px;
  font-size:14px; font-weight:600; color:var(--texto); line-height:1.4;
}
.crc-ct-campo em{ font-style:normal; color:#cb011b; }

.crc-ct-form .wpcf7-form-control-wrap{ display:block; }

.crc-ct .crc-ct-form input[type="text"],
.crc-ct .crc-ct-form input[type="email"],
.crc-ct .crc-ct-form input[type="tel"],
.crc-ct .crc-ct-form select,
.crc-ct .crc-ct-form textarea{
  display:block; width:100%; height:48px; margin:0; padding:0 14px; box-sizing:border-box;
  font:inherit; font-size:15px; font-weight:400; letter-spacing:0; color:var(--texto); line-height:1.4;
  background:#fff; border:1px solid var(--campo); border-radius:10px; box-shadow:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.crc-ct .crc-ct-form textarea{ height:170px !important; padding:12px 14px; resize:vertical; }
.crc-ct .crc-ct-form select{
  /* o tema pai tem select{color:#878787!important}: aqui o texto volta à cor normal */
  color:var(--texto) !important;
  -webkit-appearance:none; appearance:none; padding-right:42px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300619c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:18px;
}
.crc-ct .crc-ct-form select:disabled{ background-color:#f4f6f8; color:#8a96a3 !important; cursor:not-allowed; }
.crc-ct .crc-ct-form input:focus,
.crc-ct .crc-ct-form select:focus,
.crc-ct .crc-ct-form textarea:focus{ outline:0; border-color:var(--azul); box-shadow:0 0 0 3px rgba(0,97,156,.15); }

/* ---------- SETOR ou DELEGACIA: dois cartões ---------- */
.crc-ct-form .wpcf7-radio{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.crc-ct-form .wpcf7-radio .wpcf7-list-item{ margin:0; display:block; }
.crc-ct-form .wpcf7-radio label{
  display:flex; align-items:center; gap:12px; width:auto; height:auto; margin:0;
  padding:15px 16px; border:1px solid var(--campo); border-radius:12px; background:#fff;
  font-size:15px; font-weight:600; color:var(--texto); cursor:pointer;
  transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.crc-ct-form .wpcf7-radio label:hover{ border-color:var(--azul); }
.crc-ct-form .wpcf7-radio label.crc-ct-marcado{
  border-color:var(--azul); background:var(--azul-claro); box-shadow:0 0 0 1px var(--azul);
}
.crc-ct-form .wpcf7-radio input[type="radio"]{
  order:3; flex:0 0 auto; width:18px; height:18px; margin:0 0 0 auto; accent-color:var(--azul);
}
/* ícone de cada cartão: prédio (sede) e marcador de mapa (delegacia) */
.crc-ct-form .wpcf7-radio label::before{
  content:""; flex:0 0 auto; width:26px; height:26px;
  background:var(--azul) no-repeat center / contain;
  -webkit-mask:var(--ico) no-repeat center / contain; mask:var(--ico) no-repeat center / contain;
}
.crc-ct-form .wpcf7-radio .first label{
  --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16M16 9h2a2 2 0 0 1 2 2v10M2 21h20M8 7h4M8 11h4M8 15h4'/%3E%3C/svg%3E");
}
.crc-ct-form .wpcf7-radio .last label{
  --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.1 7-11.5A7 7 0 0 0 5 9.5C5 14.9 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E");
}

/* ---------- BOTÃO, ERROS E RESPOSTA ---------- */
.crc-ct-form .wpcf7-submit{
  display:inline-flex; align-items:center; justify-content:center;
  width:auto !important; min-width:200px; height:48px; margin:4px 0 0; padding:0 28px;
  font:inherit; font-size:15px; font-weight:600; letter-spacing:0; text-transform:none; line-height:1;
  color:#fff; background:var(--azul); border:0; border-radius:10px; cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.crc-ct-form .wpcf7-submit:hover,
.crc-ct-form .wpcf7-submit:focus{ background:var(--azul-esc); color:#fff; }
.crc-ct-form .wpcf7-submit:disabled{ opacity:.6; cursor:default; }
.crc-ct-form .wpcf7-spinner{ vertical-align:middle; margin:0 0 0 12px; }

.crc-ct-form .wpcf7-not-valid{ border-color:var(--erro) !important; }
.crc-ct-form .wpcf7-not-valid-tip{ display:block; margin-top:5px; font-size:13px; font-weight:500; color:var(--erro); }
.crc-ct-form .wpcf7 form .wpcf7-response-output{
  margin:18px 0 0; padding:13px 16px; border:1px solid var(--campo); border-radius:10px;
  font-size:14.5px; color:var(--texto); background:#f6f8fa;
}
.crc-ct-form .wpcf7 form.sent .wpcf7-response-output{ border-color:#9fd4b4; background:#edf8f1; color:#1d5c38; }
.crc-ct-form .wpcf7 form.invalid .wpcf7-response-output,
.crc-ct-form .wpcf7 form.unaccepted .wpcf7-response-output{ border-color:#f7d9a4; background:#fff8ec; color:#5c4410; }
.crc-ct-form .wpcf7 form.failed .wpcf7-response-output,
.crc-ct-form .wpcf7 form.aborted .wpcf7-response-output,
.crc-ct-form .wpcf7 form.spam .wpcf7-response-output{ border-color:#f3d2cf; background:#fdf1f0; color:#7a1f1a; }

/* ---------- LISTA DE CONTATOS ---------- */
.crc-ct-sec{ margin-top:46px; }
.crc-ct .crc-ct-h{ font-size:22px; font-weight:700; line-height:1.3; color:var(--texto); margin:0 0 6px; padding:0; text-align:left; text-transform:none; }
.crc-ct-barra{ width:44px; height:3px; background:var(--laranja); border-radius:2px; display:block; margin-bottom:20px; }

.crc-ct-setores{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.crc-ct-setor,
.crc-ct-del{
  background:#fff; border:1px solid var(--borda); border-radius:14px; padding:18px 20px; min-width:0;
  box-shadow:0 6px 20px rgba(10,63,102,.04);
}
/* setor com responsáveis por assunto (a Secretaria) ocupa a linha inteira */
.crc-ct-setor-largo{ grid-column:1 / -1; }

.crc-ct .crc-ct-setor h3,
.crc-ct .crc-ct-del h3{ font-size:16px; font-weight:700; line-height:1.35; color:var(--azul-esc); margin:0 0 4px; padding:0; text-align:left; text-transform:none; }
.crc-ct-email{ display:block; font-size:14px; font-weight:600; color:var(--azul); text-decoration:none; overflow-wrap:anywhere; }
.crc-ct-email:hover,.crc-ct-email:focus{ color:var(--azul-esc); text-decoration:underline; }
.crc-ct .crc-ct-temas{ margin:8px 0 0; font-size:13px; color:var(--suave); line-height:1.5; }

.crc-ct .crc-ct-resp{ list-style:none; margin:14px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0 28px; border-top:1px solid var(--borda); }
.crc-ct .crc-ct-resp li{ list-style:none; padding:11px 0; border-bottom:1px solid var(--borda); font-size:14px; min-width:0; }
.crc-ct-resp span{ display:block; color:var(--texto); line-height:1.4; }
.crc-ct-resp a{ color:var(--azul); font-weight:600; text-decoration:none; overflow-wrap:anywhere; }
.crc-ct-resp a:hover,.crc-ct-resp a:focus{ text-decoration:underline; }

.crc-ct-delegacias{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.crc-ct-del{ padding:16px 18px; }
.crc-ct-del .crc-ct-email{ font-size:13px; font-weight:500; }
.crc-ct-tel{ display:inline-block; margin-top:5px; font-size:14px; font-weight:600; color:var(--texto); text-decoration:none; }
.crc-ct-tel:hover,.crc-ct-tel:focus{ color:var(--azul); }

.crc-ct a:focus-visible{ outline:2px solid var(--laranja); outline-offset:2px; }

/* ---------- RESPONSIVO ---------- */
@media (max-width:980px){
  .crc-ct-setores{ grid-template-columns:repeat(2,1fr); }
  .crc-ct-delegacias{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:700px){
  .crc-ct{ margin-top:20px; }
  .crc-ct-form{ padding:22px 18px 24px; }
  .crc-ct-topo{ gap:12px; }
  .crc-ct-topo-ico{ width:40px; height:40px; }
  .crc-ct .crc-ct-titulo{ font-size:19px; }
  .crc-ct-linha,
  .crc-ct-form .wpcf7-radio,
  .crc-ct .crc-ct-resp{ grid-template-columns:1fr; }
  .crc-ct-linha{ gap:0; }
  .crc-ct-form .wpcf7-radio{ gap:10px; }
  .crc-ct-form .wpcf7-submit{ width:100% !important; }
  .crc-ct-setores{ grid-template-columns:1fr; }
  .crc-ct-delegacias{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .crc-ct .crc-ct-h{ font-size:19px; }
  .crc-ct-sec{ margin-top:38px; }
}
@media (max-width:420px){
  .crc-ct-delegacias{ grid-template-columns:1fr; }
}