/* =========================================================
   SERVENTIAX CONECTA — APPROVED UI V2.1
   Correção visual específica da área comercial / ProtocoloX.
   Carregar depois de serventiax-approved-ui-v2.css.
   ========================================================= */

.sx-conecta-overlay{
  --cx-midnight:#0D1B2A;
  --cx-deep:#061421;
  --cx-gold:#C99A5D;
  --cx-gold-dark:#92602D;
  --cx-gold-soft:#FBF2E6;
  --cx-teal:#0EA5A8;
  --cx-teal-dark:#087D80;
  --cx-teal-soft:#E8F7F7;
  --cx-graphite:#1F2328;
  --cx-ivory:#F7F6F2;
  --cx-ivory-deep:#EFEAE2;
  --cx-line:#E5DED5;
  --cx-muted:#69737D;
  --cx-shadow:0 14px 38px rgba(13,27,42,.065);
  background:
    radial-gradient(circle at 96% 15%,transparent 0 130px,rgba(201,154,93,.16) 131px 132px,transparent 133px),
    radial-gradient(circle at 3% 92%,transparent 0 150px,rgba(14,165,168,.10) 151px 152px,transparent 153px),
    linear-gradient(180deg,#FCFBF8 0%,var(--cx-ivory) 100%)!important;
  color:var(--cx-graphite)!important;
  font-family:'Manrope Variable','Manrope',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
}

.sx-conecta-shell{min-height:100%!important}

/* Cabeçalho institucional */
.sx-conecta-topbar{
  min-height:88px!important;
  padding:13px clamp(20px,4vw,58px)!important;
  background:
    linear-gradient(rgba(201,154,93,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(201,154,93,.05) 1px,transparent 1px),
    radial-gradient(circle at 12% 0,rgba(201,154,93,.12),transparent 27%),
    linear-gradient(110deg,var(--cx-deep) 0%,var(--cx-midnight) 72%,#12334B 100%)!important;
  background-size:84px 84px,84px 84px,auto,auto!important;
  border-bottom:2px solid var(--cx-gold)!important;
  box-shadow:0 9px 26px rgba(13,27,42,.09)!important;
  backdrop-filter:none!important;
}
.sx-conecta-brand{gap:14px!important}
.sx-conecta-brand img{
  content:url('/serventiax-symbol.svg')!important;
  width:42px!important;
  height:54px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.23))!important;
}
.sx-conecta-brand strong{
  color:#F8F6F1!important;
  font-size:27px!important;
  font-weight:620!important;
  letter-spacing:-1px!important;
  line-height:1.05!important;
}
.sx-conecta-brand strong span{color:var(--cx-gold)!important}
.sx-conecta-brand small{
  margin-top:5px!important;
  color:#BFC9D0!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:.12em!important;
}
.sx-conecta-actions button,
.sx-conecta-back{
  min-height:42px!important;
  padding:10px 15px!important;
  border:1px solid rgba(201,154,93,.45)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.055)!important;
  color:#F8F6F1!important;
  font-size:12px!important;
  font-weight:750!important;
  box-shadow:none!important;
}
.sx-conecta-actions button:hover,
.sx-conecta-back:hover{
  border-color:var(--cx-gold)!important;
  background:rgba(201,154,93,.11)!important;
}

/* Página inicial */
.sx-conecta-main{
  width:min(1260px,calc(100% - 44px))!important;
  margin:0 auto!important;
  padding:52px 0 62px!important;
  color:var(--cx-graphite)!important;
}
.sx-conecta-hero{
  grid-template-columns:minmax(0,1fr) minmax(300px,390px)!important;
  gap:42px!important;
  align-items:center!important;
  margin-bottom:32px!important;
}
.sx-conecta-stage{
  padding:7px 11px!important;
  background:var(--cx-gold-soft)!important;
  border:1px solid #E7D2B5!important;
  color:var(--cx-gold-dark)!important;
  font-size:10.5px!important;
  font-weight:850!important;
  letter-spacing:.12em!important;
}
.sx-conecta-hero h1{
  max-width:760px!important;
  margin:16px 0 12px!important;
  color:var(--cx-midnight)!important;
  font-size:clamp(39px,4.5vw,59px)!important;
  line-height:1.03!important;
  font-weight:680!important;
  letter-spacing:-2.6px!important;
}
.sx-conecta-hero h1 span{color:var(--cx-gold)!important}
.sx-conecta-hero p{
  max-width:760px!important;
  color:#5F6B76!important;
  font-size:15px!important;
  line-height:1.68!important;
}
.sx-conecta-guardrail{
  padding:21px 22px!important;
  border:1px solid #CDE9E9!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,#F4FBFB 0%,#ECF8F8 100%)!important;
  color:#49636A!important;
  box-shadow:var(--cx-shadow)!important;
  font-size:12px!important;
  line-height:1.65!important;
}
.sx-conecta-guardrail:before{
  content:'✓'!important;
  display:grid!important;
  place-items:center!important;
  width:32px!important;
  height:32px!important;
  margin-bottom:13px!important;
  border-radius:999px!important;
  background:#DDF2F2!important;
  color:var(--cx-teal-dark)!important;
  font-weight:900!important;
}
.sx-conecta-guardrail strong{
  color:var(--cx-midnight)!important;
  font-size:13px!important;
  margin-bottom:5px!important;
}

.sx-conecta-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}
.sx-conecta-action{
  position:relative!important;
  min-height:238px!important;
  padding:23px!important;
  overflow:hidden!important;
  border:1px solid var(--cx-line)!important;
  border-radius:15px!important;
  background:#FFF!important;
  color:var(--cx-graphite)!important;
  box-shadow:var(--cx-shadow)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
.sx-conecta-action:before{
  content:''!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:3px!important;
  background:linear-gradient(90deg,#DDB270,var(--cx-gold),#A77038)!important;
}
.sx-conecta-action:nth-child(2):before{background:linear-gradient(90deg,#65CACC,var(--cx-teal),#087D80)!important}
.sx-conecta-action:nth-child(3):before{background:linear-gradient(90deg,#8395A4,#536575,var(--cx-midnight))!important}
.sx-conecta-action:hover:not([disabled]){
  transform:translateY(-3px)!important;
  border-color:rgba(201,154,93,.55)!important;
  box-shadow:0 19px 42px rgba(13,27,42,.10)!important;
}
.sx-conecta-action.primary{border-color:#DDC6A5!important}
.sx-conecta-action>span{
  width:44px!important;
  height:44px!important;
  border-radius:11px!important;
  background:var(--cx-gold-soft)!important;
  color:#B9782C!important;
  font-size:18px!important;
}
.sx-conecta-action:nth-child(2)>span{background:var(--cx-teal-soft)!important;color:var(--cx-teal-dark)!important}
.sx-conecta-action:nth-child(3)>span{background:#EEF1F3!important;color:#526371!important}
.sx-conecta-action h3{
  margin:17px 0 8px!important;
  color:var(--cx-midnight)!important;
  font-size:19px!important;
  font-weight:720!important;
  letter-spacing:-.35px!important;
}
.sx-conecta-action p{
  color:#66727D!important;
  font-size:12.5px!important;
  line-height:1.6!important;
}
.sx-conecta-action b{
  padding-top:20px!important;
  color:var(--cx-teal-dark)!important;
  font-size:12px!important;
  font-weight:800!important;
}
.sx-conecta-action.primary b{color:#A5682C!important}
.sx-conecta-action[disabled]{
  opacity:1!important;
  cursor:default!important;
  background:#F9F8F5!important;
  box-shadow:none!important;
}
.sx-conecta-action[disabled] h3{color:#53616C!important}
.sx-conecta-action[disabled] p{color:#879099!important}
.sx-conecta-action[disabled] b{color:#9A8A76!important}
.sx-conecta-footer-note{
  margin-top:25px!important;
  color:#7C8790!important;
  font-size:11px!important;
}

/* ProtocoloX / escolha de título */
.sx-protocol-head{margin-bottom:26px!important}
.sx-protocol-head h2{
  margin:10px 0 7px!important;
  color:var(--cx-midnight)!important;
  font-size:32px!important;
  font-weight:690!important;
  letter-spacing:-1.2px!important;
}
.sx-protocol-head p{color:#66727D!important;font-size:13.5px!important}
.sx-protocol-head .sx-conecta-back{
  border-color:#DED6CC!important;
  background:#FFF!important;
  color:var(--cx-midnight)!important;
  box-shadow:0 5px 15px rgba(13,27,42,.035)!important;
}
.sx-protocol-head .sx-conecta-back:hover{border-color:var(--cx-gold)!important;background:#FFF8ED!important}
.sx-protocol-progress span{
  background:#FFF!important;
  border:1px solid var(--cx-line)!important;
  color:#6E7881!important;
  font-size:10.5px!important;
}
.sx-protocol-progress span.active{
  background:var(--cx-teal-soft)!important;
  border-color:#BFE4E4!important;
  color:var(--cx-teal-dark)!important;
}
.sx-title-grid{gap:14px!important}
.sx-title-option{
  min-height:144px!important;
  padding:18px!important;
  border:1px solid var(--cx-line)!important;
  border-radius:13px!important;
  background:#FFF!important;
  color:var(--cx-graphite)!important;
  box-shadow:0 7px 22px rgba(13,27,42,.04)!important;
}
.sx-title-option:hover{
  border-color:rgba(201,154,93,.65)!important;
  box-shadow:0 12px 28px rgba(13,27,42,.07)!important;
}
.sx-title-option strong{color:var(--cx-midnight)!important;font-size:14px!important}
.sx-title-option small{color:#6B7680!important;font-size:11.5px!important}
.sx-title-option em{color:var(--cx-teal-dark)!important;font-size:10.5px!important}

/* Checklist de compra e venda */
.sx-sale-layout{gap:18px!important}
.sx-precheck,.sx-readiness,.sx-unknown-box{
  border:1px solid var(--cx-line)!important;
  border-radius:15px!important;
  background:#FFF!important;
  color:var(--cx-graphite)!important;
  box-shadow:var(--cx-shadow)!important;
  padding:22px!important;
}
.sx-precheck h3,.sx-readiness h3,.sx-unknown-box h3{
  color:var(--cx-midnight)!important;
  font-size:18px!important;
}
.sx-precheck>p,.sx-readiness>p,.sx-unknown-box>p{color:#69747E!important}
.sx-check-row{border-top-color:#EEE8E0!important}
.sx-check-row strong{color:var(--cx-midnight)!important}
.sx-check-row small{color:#76818A!important}
.sx-tristate button{
  border:1px solid #DDD7CF!important;
  background:#FAF9F6!important;
  color:#58656F!important;
}
.sx-tristate button:hover{border-color:var(--cx-gold)!important;background:#FFF8ED!important}
.sx-tristate button.active.yes{background:#E7F4EB!important;border-color:#91C3A1!important;color:#2F6F46!important}
.sx-tristate button.active.maybe{background:#FFF3DE!important;border-color:#DDBB78!important;color:#7D5A22!important}
.sx-tristate button.active.no{background:#FFF0EE!important;border-color:#D8A09A!important;color:#8B3F3B!important}
.sx-readiness{top:108px!important}
.sx-meter{background:#ECE8E2!important}
.sx-readiness-score strong{color:var(--cx-midnight)!important}
.sx-readiness-score span{color:#7A858E!important}
.sx-status-pill.red{background:#FFF0EE!important;color:#8B3F3B!important}
.sx-status-pill.yellow{background:#FFF3DE!important;color:#7D5A22!important}
.sx-status-pill.green{background:#E7F4EB!important;color:#2F6F46!important}
.sx-readiness ul{color:#66727D!important}
.sx-legal-note{
  border-left-color:var(--cx-gold)!important;
  background:#FFF8ED!important;
  color:#655746!important;
}
.sx-legal-note strong{color:var(--cx-midnight)!important}
.sx-unknown-box textarea{
  border:1px solid #DCD6CE!important;
  background:#FFF!important;
  color:var(--cx-graphite)!important;
}
.sx-unknown-box textarea:focus{outline:none!important;border-color:var(--cx-gold)!important;box-shadow:0 0 0 3px rgba(201,154,93,.13)!important}
.sx-unknown-box button{
  background:linear-gradient(100deg,#087D80,#0EA5A8)!important;
  color:#FFF!important;
}
.sx-path-result{
  background:var(--cx-teal-soft)!important;
  color:#49636A!important;
  border:1px solid #CBE8E8!important;
}
.sx-path-result strong{color:var(--cx-midnight)!important}

@media(max-width:900px){
  .sx-conecta-main{width:min(100% - 28px,760px)!important;padding-top:34px!important}
  .sx-conecta-hero{grid-template-columns:1fr!important;gap:20px!important}
  .sx-conecta-grid,.sx-title-grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:600px){
  .sx-conecta-topbar{min-height:74px!important;padding:10px 14px!important}
  .sx-conecta-brand img{width:34px!important;height:43px!important}
  .sx-conecta-brand strong{font-size:20px!important}
  .sx-conecta-brand small{font-size:8px!important}
  .sx-conecta-main{width:min(100% - 20px,520px)!important;padding:28px 0 40px!important}
  .sx-conecta-hero h1{font-size:37px!important;letter-spacing:-1.7px!important}
  .sx-conecta-grid,.sx-title-grid{grid-template-columns:1fr!important}
  .sx-conecta-action{min-height:208px!important}
  .sx-protocol-head h2{font-size:27px!important}
}