/* Trabalhe Conosco no layout novo (Figma: node 507:1427) — trabalhe-conosco.php.
   Base (tokens, menu, rodapé, botões, cards, processo, depoimentos) vem de ecom.css. */

/* ---------- Hero ---------- */
.cv-copy{ width: 620px; }
.cv-benefits{ display: flex; flex-wrap: wrap; gap: 8px 24px; padding-top: 8px; }
.cv-benefits li{ display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: rgba(25,25,25,.78); white-space: nowrap; }
.cv-benefits img{ border-radius: 50%; animation: pulseDot 2.4s ease-in-out infinite; }
.cv-benefits li:nth-child(2) img{ animation-delay: .5s; }
.cv-benefits li:nth-child(3) img{ animation-delay: 1s; }

/* Composição 500×500 do Figma; --u = 1px do Figma. */
.cv-visual{ width: min(500px, 100%); aspect-ratio: 1; }
.cv-visual > *{ --u: calc(100cqw / 500); }
.cv-card{
  left: calc(60 * var(--u)); top: calc(40 * var(--u)); width: calc(440 * var(--u));
  display: flex; flex-direction: column; gap: calc(24 * var(--u));
  padding: calc(32 * var(--u)); border-radius: calc(28 * var(--u));
  background: var(--preto); color: var(--branco);
  filter: drop-shadow(0 calc(24 * var(--u)) calc(24 * var(--u)) rgba(13,13,13,.14));
}
.cv-card-top{ display: flex; align-items: center; justify-content: space-between; }
.cv-card-label{ font-size: calc(15 * var(--u)); font-weight: 500; color: rgba(255,255,255,.78); }
.cv-card-badge{
  display: inline-flex; align-items: center; gap: calc(6 * var(--u));
  padding: calc(6 * var(--u)) calc(12 * var(--u)); border-radius: 999px; background: var(--roxo);
  font-size: calc(12 * var(--u)); font-weight: 600; white-space: nowrap;
}
.cv-live{ width: calc(6 * var(--u)); height: calc(6 * var(--u)); border-radius: 50%; background: var(--branco); animation: livePulse 1.6s ease-in-out infinite; }
.cv-card-count{ font-size: calc(44 * var(--u)); font-weight: 700; letter-spacing: -.03em; line-height: normal; white-space: nowrap; }
.cv-card-list li{ border-top: 1px solid rgba(255,255,255,.1); }
.cv-card-list a{
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: calc(14 * var(--u)) 0; white-space: nowrap;
  transition: padding .4s var(--ease-out);
}
.cv-card-list a::before{
  content: ""; position: absolute; inset: 2px calc(-12 * var(--u)); border-radius: calc(10 * var(--u)); z-index: -1;
  background: rgba(255,255,255,.07); opacity: 0; transform: scale(.96); transition: opacity .3s, transform .4s var(--ease-out);
}
.cv-card-list{ position: relative; isolation: isolate; }
.cv-card-job{ font-size: calc(15 * var(--u)); font-weight: 500; color: rgba(255,255,255,.78); transition: color .3s; }
.cv-card-area{ font-size: calc(13 * var(--u)); color: var(--superficie); transition: color .3s; }
.cv-card-list a:hover, .cv-card-list li.is-active a{ padding-left: calc(8 * var(--u)); }
.cv-card-list a:hover::before, .cv-card-list li.is-active a::before{ opacity: 1; transform: none; }
.cv-card-list a:hover .cv-card-job, .cv-card-list li.is-active .cv-card-job{ color: var(--branco); }
.cv-card-list a:hover .cv-card-area, .cv-card-list li.is-active .cv-card-area{ color: #D97016; }

.cv-local{
  left: 0; top: calc(400 * var(--u));
  display: flex; align-items: center; gap: calc(12 * var(--u));
  padding: calc(16 * var(--u)) calc(20 * var(--u)) calc(16 * var(--u)) calc(16 * var(--u));
  border-radius: calc(20 * var(--u)); background: var(--branco);
  filter: drop-shadow(0 calc(24 * var(--u)) calc(24 * var(--u)) rgba(13,13,13,.14));
  transition: translate .6s var(--ease-out), scale .4s var(--ease-spring);
}
.cv-local:hover{ scale: 1.04; }
.cv-local-icon{ width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: calc(12 * var(--u)); background: var(--superficie); display: grid; place-items: center; }
.cv-local-icon img{ width: calc(20 * var(--u)); height: calc(20 * var(--u)); animation: pinBounce 2.8s ease-in-out infinite; }
.cv-local-text{ display: flex; flex-direction: column; gap: calc(2 * var(--u)); white-space: nowrap; }
.cv-local-text strong{ font-size: calc(15 * var(--u)); font-weight: 600; }
.cv-local-text span{ font-size: calc(13 * var(--u)); color: var(--texto-64); }

.js .cv-card{ animation: windowIn 1.1s var(--ease-out) .25s backwards; }
.js .cv-local{ animation: popIn .8s var(--ease-spring) .9s backwards, floatY 6s ease-in-out 1.8s infinite; }
.js .cv-card-list li{ animation: revealLeft .6s var(--ease-out) backwards; animation-delay: calc(var(--i) * 100ms + .7s); }

/* ---------- Valores ---------- */
.values-title{ max-width: 720px; }
.values-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.value-card{ min-height: 290px; padding: 32px 28px; }
.value-card .sol-title{ font-size: 21px; }
.value-card .sol-text{ font-size: 15px; }
.value-card .sol-icon{ color: var(--roxo); }
.value-svg{ width: 24px; height: 24px; }
.value-card.is-featured .sol-icon{ color: var(--branco); }
.value-card.is-featured .sol-icon img{ filter: brightness(0) invert(1); }
.value-card:hover .sol-icon{ color: var(--branco); }

/* ---------- Vagas ---------- */
.jobs{ background: var(--fundo-suave); }
.jobs .section-head{ margin-bottom: 48px; }
.jobs-title{ max-width: 860px; }
.jobs-title .lead{ max-width: 640px; }
/* título em 2 linhas: "Encontre sua próxima" / "oportunidade." (<br> antes da última palavra) */
@media (min-width: 721px){ .jobs-title .h2{ white-space: nowrap; } }
.jobs-filters{ display: flex; flex-wrap: wrap; gap: 8px; flex: 0 0 auto; }
.chip{
  padding: 10px 18px; border-radius: 999px; cursor: pointer;
  background: var(--branco); border: 1px solid rgba(25,25,25,.12); color: var(--preto);
  font-size: 14px; font-weight: 600; line-height: normal; white-space: nowrap;
  transition: background-color .3s, color .3s, border-color .3s, transform .35s var(--ease-spring);
}
.chip:hover{ border-color: var(--preto); transform: translateY(-2px); }
.chip.is-active{ background: var(--preto); border-color: var(--preto); color: var(--branco); }

.jobs-list{
  background: var(--branco); border: 1px solid rgba(25,25,25,.08); border-radius: 24px; overflow: hidden;
}
.job{
  position: relative; display: flex; align-items: center; gap: 32px; padding: 28px 32px;
  transition: background-color .35s;
}
.job:not([hidden]) ~ .job{ border-top: 1px solid rgba(25,25,25,.08); }
.job::before{ /* barra roxa à esquerda no hover */
  content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px; border-radius: 0 3px 3px 0;
  background: var(--roxo); transform: scaleY(0); transition: transform .4s var(--ease-out);
}
.job:hover{ background: var(--fundo-suave); }
.job:hover::before{ transform: scaleY(1); }
.job.is-filtered-in{ animation: revealUp .5s var(--ease-out) backwards; animation-delay: calc(var(--n, 0) * 70ms); }
.job-info{ flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.job-title-row{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.job-title{ font-size: 22px; font-weight: 600; letter-spacing: -.01em; line-height: normal; transition: color .3s; }
.job:hover .job-title{ color: var(--roxo); }
.job-area{ padding: 5px 12px; border-radius: 999px; background: var(--superficie); color: var(--roxo); font-size: 12px; font-weight: 600; white-space: nowrap; }
.job-desc{ font-size: 15px; color: var(--texto-64); }
.job-meta{ display: flex; align-items: center; gap: 24px; flex: 0 0 auto; }
.job-meta span{ display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: rgba(25,25,25,.78); white-space: nowrap; }
.job-meta img{ opacity: .9; }
.job-btn{ flex: 0 0 auto; border-color: rgba(25,25,25,.2); color: var(--preto); }
.job-btn .arrow-light{ display: none; }
.job.is-featured .job-btn, .job:hover .job-btn{ background: var(--roxo); border-color: var(--roxo); color: var(--branco); }
.job.is-featured .job-btn .arrow-dark, .job:hover .job-btn .arrow-dark{ display: none; }
.job.is-featured .job-btn .arrow-light, .job:hover .job-btn .arrow-light{ display: block; }
.job:hover .job-btn{ box-shadow: 0 12px 26px -12px rgba(13,13,13,.6); }
.jobs-list:hover .job.is-featured:not(:hover) .job-btn{ background: transparent; border-color: rgba(25,25,25,.2); color: var(--preto); box-shadow: none; }
.jobs-list:hover .job.is-featured:not(:hover) .job-btn .arrow-dark{ display: block; }
.jobs-list:hover .job.is-featured:not(:hover) .job-btn .arrow-light{ display: none; }

.talent{
  --mx: 50%; --my: 50%;
  position: relative; isolation: isolate; overflow: hidden;
  margin-top: 48px; display: flex; align-items: center; justify-content: space-between; gap: 32px;
  padding: 28px 32px; border-radius: 24px; background: var(--superficie);
}
.talent::before{
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .35s;
  background: radial-gradient(420px circle at var(--mx) var(--my), rgba(13,13,13,.14), transparent 60%);
}
.talent:hover::before{ opacity: 1; }
.talent-copy{ display: flex; flex-direction: column; gap: 6px; max-width: 620px; }
.talent-title{ font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
.talent-text{ font-size: 15px; color: var(--texto-64); }

/* ---------- Processo seletivo (4 etapas) ---------- */
@media (min-width: 1025px){ .steps-4{ grid-template-columns: repeat(4, 1fr); } }
#processo-seletivo{ background: var(--branco); }

/* ---------- Formulário ---------- */
.apply{ background: var(--branco); }
.apply-inner{ display: flex; align-items: flex-start; justify-content: space-between; gap: 56px; }
.apply-context{ width: 420px; flex: 0 0 auto; display: flex; flex-direction: column; gap: 28px; position: sticky; top: 120px; }
.apply-info{ padding-top: 8px; }
.apply-info li{ display: flex; align-items: flex-start; gap: 16px; padding: 20px 0; border-bottom: 1px solid rgba(25,25,25,.08); }
.apply-info-icon{
  width: 44px; height: 44px; flex: 0 0 auto; border-radius: 12px; background: var(--superficie);
  display: grid; place-items: center; transition: background-color .3s, transform .45s var(--ease-spring);
}
.apply-info-icon img{ transition: filter .3s; }
.apply-info li:hover .apply-info-icon{ background: var(--roxo); transform: rotate(-8deg) scale(1.06); }
.apply-info li:hover .apply-info-icon img{ filter: brightness(0) invert(1); }
.apply-info-text{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.apply-info-text strong{ font-size: 16px; font-weight: 600; }
.apply-info-text span{ font-size: 14px; line-height: 1.45; color: var(--texto-64); }
.apply-info-text a{ font-size: 14px; line-height: 1.45; color: var(--roxo); overflow-wrap: anywhere; }
.apply-info-text a:hover{ text-decoration: underline; text-underline-offset: 3px; }

.apply-card{
  width: 680px; max-width: 100%; flex: 0 1 auto;
  padding: 44px; border-radius: 28px; background: var(--fundo-suave); border: 1px solid rgba(25,25,25,.07);
  transition: box-shadow .5s var(--ease-out);
}
.apply-card:focus-within{ box-shadow: 0 30px 60px -36px rgba(13,13,13,.35); }
.apply-form{ display: flex; flex-direction: column; gap: 28px; }
.apply-header{ display: flex; flex-direction: column; gap: 6px; padding-bottom: 24px; border-bottom: 1px solid rgba(25,25,25,.08); }
.apply-title{ font-size: 24px; font-weight: 600; letter-spacing: -.01em; line-height: normal; }
.apply-subtitle{ font-size: 14px; color: var(--texto-64); }
.req{ color: var(--roxo); }
.apply-fields{ display: flex; flex-direction: column; gap: 28px; position: relative; }
.apply-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.apply-field{ display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.apply-field > label, .apply-label{ font-size: 14px; font-weight: 600; transition: color .2s; }
.apply-field input:not([type="file"]), .apply-field select, .apply-field textarea{
  width: 100%; height: 52px; padding: 0 16px; border-radius: 12px;
  background: var(--branco); border: 1px solid rgba(25,25,25,.12); color: var(--preto);
  font: inherit; font-size: 15px; outline: none;
  transition: border-color .25s, box-shadow .25s;
}
.apply-field textarea{ height: 132px; padding: 14px 16px; resize: vertical; line-height: 1.5; }
.apply-field ::placeholder{ color: rgba(25,25,25,.45); }
.apply-field input:hover, .apply-field select:hover, .apply-field textarea:hover{ border-color: rgba(25,25,25,.3); }
.apply-field input:focus, .apply-field select:focus, .apply-field textarea:focus{ border-color: var(--roxo); box-shadow: 0 0 0 4px rgba(13,13,13,.12); }
.apply-field:focus-within > label{ color: var(--roxo); }
.apply-select{ position: relative; }
.apply-select select{ appearance: none; -webkit-appearance: none; padding-right: 44px; cursor: pointer; }
.apply-select select:invalid{ color: rgba(25,25,25,.45); }
.apply-select option{ color: var(--preto); }
.apply-select-chev{ position: absolute; right: 16px; top: 50%; translate: 0 -50%; pointer-events: none; transition: transform .3s var(--ease-out); }
.apply-select:focus-within .apply-select-chev{ transform: rotate(180deg); }
.apply-select select.is-picked{ animation: picked 1.2s var(--ease-out); }

.apply-upload{
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  padding: 28px 24px; border-radius: 16px; border: 1.5px dashed var(--roxo); background: var(--branco);
  text-align: center; cursor: pointer;
  transition: background-color .3s, transform .35s var(--ease-out), border-color .3s;
}
.apply-upload:hover{ background: #FDFAFF; }
.apply-upload.is-dragover{ background: var(--superficie); transform: scale(1.01); border-style: solid; }
.apply-upload-icon{
  width: 48px; height: 48px; border-radius: 50%; background: var(--superficie);
  display: grid; place-items: center; transition: transform .45s var(--ease-spring), background-color .3s;
}
.apply-upload-icon img{ transition: filter .3s; }
.apply-upload:hover .apply-upload-icon, .apply-upload.is-dragover .apply-upload-icon{ transform: translateY(-4px); background: var(--roxo); }
.apply-upload:hover .apply-upload-icon img, .apply-upload.is-dragover .apply-upload-icon img{ filter: brightness(0) invert(1); }
.apply-upload-title{ font-size: 15px; font-weight: 600; color: var(--roxo); overflow-wrap: anywhere; }
.apply-upload-hint{ font-size: 13px; color: var(--texto-64); }
.apply-upload input[type="file"]{ position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.apply-upload:focus-within{ box-shadow: 0 0 0 4px rgba(13,13,13,.12); }

.apply-hp{ position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

.apply-field.is-invalid > label, .apply-field.is-invalid .apply-label{ color: #C4320A; }
.apply-field.is-invalid input, .apply-field.is-invalid select, .apply-field.is-invalid textarea{ border-color: #D92D20; box-shadow: 0 0 0 4px rgba(217,45,32,.1); }
.apply-field.is-invalid .apply-upload{ border-color: #D92D20; }
.apply-field.is-invalid{ animation: shake .4s ease; }

.apply-footer{ display: flex; flex-direction: column; gap: 20px; }
.apply-terms{ font-size: 14px; line-height: 1.5; color: var(--texto-64); }
.apply-terms a{ color: var(--preto); text-decoration: underline; text-underline-offset: 3px; transition: color .2s; }
.apply-terms a:hover{ color: var(--roxo); }
.apply-status{ font-size: 14px; font-weight: 600; }
.apply-status:empty{ display: none; }
.apply-status.is-error{ color: #C4320A; }
.apply-status.is-success{ color: #1F7A3A; padding: 12px 16px; border-radius: 12px; background: #E9F7EE; }
.apply-submit{ width: 100%; padding: 18px 26px; }
.apply-submit:disabled{ opacity: .7; cursor: progress; }

@keyframes livePulse{ 0%, 100%{ opacity: 1; transform: scale(1); } 50%{ opacity: .35; transform: scale(.7); } }
@keyframes pinBounce{ 0%, 70%, 100%{ transform: translateY(0); } 80%{ transform: translateY(-3px); } 90%{ transform: translateY(0); } }
@keyframes picked{ 0%{ box-shadow: 0 0 0 0 rgba(13,13,13,.45); border-color: var(--roxo); } 100%{ box-shadow: 0 0 0 10px rgba(13,13,13,0); } }
@keyframes shake{ 0%, 100%{ transform: none; } 25%{ transform: translateX(-4px); } 75%{ transform: translateX(4px); } }

/* ---------- Responsivo ---------- */
@media (max-width: 1180px){
  .cv-copy{ width: 100%; }
  .apply-inner{ flex-direction: column; align-items: stretch; gap: 40px; }
  .apply-context{ position: static; width: 100%; max-width: 560px; }
  .apply-card{ width: 100%; }
  .job{ flex-wrap: wrap; gap: 16px 32px; }
  .job-info{ flex-basis: 100%; }
}
@media (max-width: 1024px){
  .values-grid{ grid-template-columns: repeat(2, 1fr); }
  .value-card{ min-height: 0; }
}
@media (max-width: 768px){
  .values-grid{ grid-template-columns: 1fr; }
  .cv-benefits{ gap: 8px 18px; }
  .jobs-filters{ flex-wrap: nowrap; overflow-x: auto; max-width: 100%; padding-bottom: 4px; scrollbar-width: none; }
  .jobs-filters::-webkit-scrollbar{ display: none; }
  .job{ padding: 24px 20px; flex-direction: column; align-items: stretch; }
  .job-meta{ flex-wrap: wrap; gap: 8px 20px; }
  .job-btn{ justify-content: center; }
  .job-title{ font-size: 20px; }
  .talent{ flex-direction: column; align-items: stretch; padding: 24px; }
  .talent .btn{ white-space: normal; text-align: center; }
  .apply-card{ padding: 28px 20px; border-radius: 24px; }
  .apply-row{ grid-template-columns: 1fr; gap: 28px; }
  .apply-title{ font-size: 22px; }
}

/* =====================================================================
   TEMA — mesma linha de budadigital.com.br (ver o fim de ecom.css)
   ===================================================================== */
.cv-benefits li{ color: rgba(255,255,255,.8); font-weight: 400; }
.cv-card{ background: var(--card-escuro); border: 1px solid var(--borda-escura); }
.cv-card-area{ font-family: var(--mono); color: var(--roxo-claro); }
.cv-card-badge{ background: var(--roxo); }
.cv-local-icon{ background: var(--fundo-suave); }

.value-card .sol-text{ font-weight: 300; }

.jobs-list{ border-color: var(--borda-card); }
.job-title{ font-weight: 700; letter-spacing: -.025em; }
.job-desc{ font-weight: 300; }
.job-area{ background: var(--fundo-suave); font-family: var(--mono); font-weight: 500; font-size: 11px; }
.job-btn{ border-color: var(--preto); }
.job.is-featured .job-btn, .job:hover .job-btn{ background: var(--preto); border-color: var(--preto); box-shadow: none; }
.job:hover .job-btn:hover{ background: var(--roxo); border-color: var(--roxo); }
.jobs-list:hover .job.is-featured:not(:hover) .job-btn{ border-color: var(--preto); }
.chip{ font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; border-color: var(--borda-card); }
.chip:hover{ border-color: var(--preto); }
.talent{ background: #fff; border: 1px solid var(--borda-card); }
.talent-title{ font-weight: 700; letter-spacing: -.025em; }
.talent-text{ font-weight: 300; }

.apply-card{ border-color: var(--borda-card); }
.apply-title{ font-weight: 700; letter-spacing: -.025em; }
.apply-field > label, .apply-label{ font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.apply-info-icon{ background: var(--fundo-suave); }
.apply-info-text span{ font-weight: 300; }
.apply-upload-title{ font-weight: 700; }
.cv-local{ color: var(--preto); }
#nosso-time{ background: var(--fundo-suave); }
#nosso-time .quote{ background: #fff; border-color: #fff; }
#nosso-time .quote:hover{ border-color: var(--preto); }

/* ícones inline (site_icon): seguem a cor do texto via currentColor */
.apply-info-icon, .apply-upload-icon, .cv-local-icon{ color: var(--preto); }
.apply-info-icon svg, .apply-upload-icon svg{ transition: color .3s; }
.apply-info li:hover .apply-info-icon, .apply-upload:hover .apply-upload-icon, .apply-upload.is-dragover .apply-upload-icon{ color: #fff; }
.cv-local-icon svg{ width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
.cv-benefits svg{ color: var(--amarelo); border-radius: 50%; }