/* =========================================
   PARCERIAS MAXXI — folha enxuta e responsiva
   ========================================= */

.jobs{
  /* tokens locais (herdam do tema quando existir) */
  --eyebrow:#9aa1ff;
  --kicker:#cbd2ff;
  --card-r:18px;

  --gap-xs:clamp(8px,2vw,16px);
  --gap-sm:clamp(12px,2vw,20px);
  --gap-md:clamp(14px,2.6vw,28px);

  /* fallbacks de vidro (caso o global não defina) */
  --glass-bg: color-mix(in oklab, #fff 6%, transparent);
  --glass-bd: color-mix(in oklab, #fff 12%, transparent);
  --blur-card: saturate(120%) blur(6px);
}

/* ---------- Hero ---------- */
@media (max-width:640px){
  .jobs .hero--internal .wrap{ padding-inline:1.25rem; }
}
.jobs .hero--internal + *{
  margin-block-start:clamp(8px,2.2vw,16px);
}

/* ---------- Títulos auxiliares ---------- */
.jobs .eyebrow{
  display:inline-block;
  font:700 12px/1 Sora,Inter,sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--eyebrow);
  opacity:.92;
  margin-block-end:.5rem;
}
.jobs .kicker{ color:var(--kicker); }

/* =========================================
   GRIDS (utilitário único com --cols)
   ========================================= */
.jobs :where(.grid-4,.grid-3,.benefits){
  --cols: 4;                    /* default p/ grid-4 & benefits */
  display:grid;
  gap:var(--gap-sm);
  grid-template-columns:repeat(var(--cols),minmax(0,1fr));
}
.jobs .grid-3{ --cols:3; }

/* breakpoints */
@media (max-width:1100px){
  .jobs :where(.grid-4,.benefits,.grid-3){ --cols:2; }
}
@media (max-width:640px){
  .jobs :where(.grid-4,.grid-3,.benefits){ --cols:1; }
}

/* =========================================
   ÍCONES (como funciona / benefícios)
   ========================================= */
.jobs :where(.how .icon,.benefit .icon){
  --icon:56px;
  inline-size:var(--icon);
  block-size:var(--icon);
  border-radius:16px;
  display:grid;
  place-items:center;
  font-size:26px;
  color:#fff;
  background:linear-gradient(180deg,var(--brand-1),var(--brand-2));
  box-shadow:0 8px 26px rgba(47,55,255,.28);
  margin-block-end:.5rem;
}
.jobs .benefit .icon{ --icon:54px; margin-block-end:.35rem; }

/* =========================================
   COMO FUNCIONA
   ========================================= */
.jobs .how .step{ text-align:left; }

/* =========================================
   DIRETRIZES
   ========================================= */
.jobs .guidelines .card h3{
  margin:0 0 6px;
  font-family:Sora,Inter,sans-serif;
  font-size:clamp(18px,2.2vw,22px);
}
.jobs .guidelines .bullet{
  margin:8px 0 0 0;
  padding:0 0 0 18px;
}
.jobs .guidelines .bullet li{
  margin:6px 0;
  color:#cfd5ff;
}

/* =========================================
   FORMULÁRIO DE PARCERIA
   ========================================= */
.jobs .partner-form{
  padding:clamp(18px,2.6vw,26px);
  border-radius:calc(var(--card-r) + 2px);
  background:var(--glass-bg);
  border:1px solid var(--glass-bd);
  backdrop-filter:var(--blur-card);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
@supports not (backdrop-filter:blur(1px)){
  .jobs .partner-form{ background:rgba(20,24,64,.6); }
}

/* grid do form */
.jobs .partner-form .form-grid{
  display:grid;
  gap:var(--gap-sm);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (max-width:860px){
  .jobs .partner-form .form-grid{ grid-template-columns:1fr; }
}

/* fields */
.jobs .partner-form .field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.jobs .partner-form label{
  font:600 14px/1.3 Inter,system-ui,sans-serif;
  color:#e8ebff;
}

/* inputs */
.jobs .partner-form :is(input,select,textarea){
  inline-size:100%;
  padding:12px 14px;
  color:#e7eaff;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.jobs .partner-form textarea{ resize:vertical; min-block-size:112px; }

.jobs .partner-form :is(input,textarea)::placeholder{
  color:#aab2ff; opacity:.75;
}

/* spans */
.jobs .partner-form .field--full{ grid-column:1 / -1; }

/* states */
.jobs .partner-form :is(input,select,textarea):focus-visible{
  border-color:rgba(132,146,255,.7);
  box-shadow:0 0 0 3px rgba(132,146,255,.22);
}
.jobs .partner-form :is(input,select):user-invalid{ border-color:#ff8899; }

/* footer do form */
.jobs .partner-form .form-foot{
  margin-block-start:clamp(12px,2vw,16px);
  display:grid;
  gap:12px;
}
.jobs .partner-form .check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:.95rem;
  color:#cfd5ff;
}
.jobs .partner-form .check input{ margin-block-start:3px; }

.jobs .partner-form .actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
@media (max-width:640px){
  .jobs .partner-form .actions > *{ flex:1 1 auto; }
}

/* ghost btn local */
.jobs .btn.btn-ghost{
  background:transparent;
  border:1px solid rgba(255,255,255,.14);
}

/* ===== SELECT customizado (aparência coerente com tema) ===== */
.jobs .partner-form select{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)),
    url("data:image/svg+xml,%3Csvg fill='%23cbd2ff' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.25 7.5l4.75 5 4.75-5H5.25z'/%3E%3C/svg%3E")
    no-repeat right 12px center / 16px;
  color:#e7eaff;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:12px 40px 12px 14px;
  font:500 15px/1.3 Inter,system-ui,sans-serif;
  cursor:pointer;
}

/* hover/focus */
.jobs .partner-form select:hover{
  background-color:rgba(255,255,255,.08);
}
.jobs .partner-form select:focus-visible{
  border-color:rgba(132,146,255,.7);
  box-shadow:0 0 0 3px rgba(132,146,255,.22);
}

/* opções dentro do menu (apenas browsers que suportam) */
.jobs .partner-form select option{
  background-color:#1d1f48;
  color:#e7eaff;
}


/* =========================================
   CTA FINAL / RITMO
   ========================================= */
.jobs .cta-wide{
  text-align:center;
  padding:clamp(20px,3vw,36px) 24px;
  border-radius:calc(var(--card-r) + 4px);
  background:var(--glass-bg);
  border:1px solid var(--glass-bd);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  backdrop-filter:var(--blur-card);
}
.jobs .cta-wide .emoji{
  font-size:42px;
  display:block;
  margin-block-end:6px;
}

/* ritmo geral */
.jobs .section{ padding-block:clamp(20px,5vw,40px); }
.jobs .section + .section{ margin-block-start:0; }
.jobs main > .section:last-of-type{ padding-block-end:clamp(24px,6vw,48px); }
@media (max-width:420px){
  .jobs .container{ padding-inline:16px; }
}

/* A11y motion */
@media (prefers-reduced-motion:reduce){
  .reveal, .reveal-group *{ animation:none !important; transition:none !important; }
}

/* Honeypot invisível */
.hp{
  position:absolute !important;
  inset-inline-start:-9999px !important;
  opacity:0 !important;
  pointer-events:none !important;
}