/* JobPlay — Home (carregado só na página inicial) */

.jp-section{padding:104px 0 0}
.jp-sechead{text-align:center;max-width:780px;margin:0 auto 52px;display:flex;flex-direction:column;align-items:center;gap:18px}
.jp-sechead h2{font-size:clamp(32px,4.6vw,58px);letter-spacing:-.04em}
.jp-sechead p{font-size:18px;color:var(--muted);max-width:60ch}
.jp-center{text-align:center;margin-top:40px}
[hidden]{display:none!important}

/* ============ HERO ============ */
.jp-hero{position:relative;padding:76px 0 40px;text-align:center;overflow:hidden;margin-top:-78px;padding-top:150px}
.jp-hero__bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.jp-hero__bg .g1,.jp-hero__bg .g2{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55}
.jp-hero__bg .g1{width:620px;height:620px;left:-140px;top:-120px;background:radial-gradient(circle,#BCD0FF,transparent 70%)}
.jp-hero__bg .g2{width:560px;height:560px;right:-120px;top:-60px;background:radial-gradient(circle,#FFD3BC,transparent 70%)}
.jp-hero__bg .dots{position:absolute;inset:0;background-image:radial-gradient(circle,#C5CCE0 1px,transparent 1.3px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse 75% 70% at 50% 28%,#000 25%,transparent 78%);mask-image:radial-gradient(ellipse 75% 70% at 50% 28%,#000 25%,transparent 78%)}
.jp-hero__in{display:flex;flex-direction:column;align-items:center}
.jp-hero h1{margin-top:26px;font-size:clamp(40px,7vw,88px);font-weight:800;letter-spacing:-.05em;line-height:1.02;max-width:980px}
.jp-hero h1 .jp-hl{padding:.02em .2em .12em}
.jp-hero__lead{margin-top:26px;max-width:640px;font-size:clamp(16px,1.6vw,19px);line-height:1.6;color:var(--muted)}
.jp-hero__lead strong{color:var(--ink)}
.jp-quick{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:18px;font-size:13.5px;color:var(--faint)}
.jp-quick a{padding:6px 13px;border-radius:99px;background:rgba(255,255,255,.8);border:1px solid var(--line);color:var(--ink-2);font-weight:600;transition:all .15s}
.jp-quick a:hover{border-color:var(--ink);background:#fff}
.jp-checks{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-top:22px;font-size:13.5px;font-weight:600;color:var(--muted)}
.jp-checks li{display:inline-flex;align-items:center;gap:8px}
.jp-checks .jp-i{font-size:17px;color:var(--green)}

/* palco com cards, órbitas e selos */
.jp-stage{position:relative;width:100%;max-width:1040px;height:470px;margin-top:64px}
.jp-orbit{position:absolute;left:50%;top:48%;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.jp-orbit--1{width:560px;height:560px;border:1.5px dashed #BFC8E2;animation:jp-spin 90s linear infinite}
.jp-orbit--2{width:860px;height:860px;border:1.5px dotted #D3D9EA;animation:jp-spin 140s linear infinite reverse}
.jp-orbit span{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px;display:grid;place-items:center;border-radius:13px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);color:var(--blue);transform:rotate(var(--a)) translateY(calc(var(--r,280px) * -1)) rotate(calc(var(--a) * -1))}
.jp-orbit--2 span{--r:430px;color:var(--orange)}
.jp-orbit span .jp-i{font-size:19px}
.jp-mini{position:absolute;left:50%;top:18px;width:330px;margin-left:-165px;padding:9px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2);text-align:left;transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform}
.jp-mini__img{display:block;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:#E9EDF8}
.jp-mini__img img{width:100%;height:100%;object-fit:cover}
.jp-mini__tx{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 8px 8px}
.jp-mini__tx b{font-size:15px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.jp-mini__tx .jp-money{font-size:17px}
.jp-mini--c{z-index:3;transform:translateY(0)}
.jp-mini--l{z-index:2;transform:translate(-318px,46px) rotate(-7deg) scale(.94)}
.jp-mini--r{z-index:2;transform:translate(318px,46px) rotate(7deg) scale(.94)}
.jp-mini--c:hover{transform:translateY(-8px)}
.jp-mini--l:hover{transform:translate(-318px,34px) rotate(-5deg) scale(.96)}
.jp-mini--r:hover{transform:translate(318px,34px) rotate(5deg) scale(.96)}
.jp-float{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:9px;padding:11px 16px;border-radius:15px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:var(--sh-2);font-size:13.5px;font-weight:650;color:var(--ink-2);animation:jp-bob 6s ease-in-out infinite}
.jp-float .jp-i{font-size:18px;color:var(--green)}
.jp-float--a{left:0;top:4%}
.jp-float--b{right:-1%;top:6%;animation-delay:-2s}
.jp-float--c{left:4%;bottom:6%;animation-delay:-4s}
.jp-float--d{right:3%;bottom:2%;animation-delay:-1s}
.jp-float--b .jp-i{color:var(--blue-2)}.jp-float--d .jp-i{color:var(--orange)}
.jp-note--stage{position:absolute;z-index:5;left:50%;bottom:-6px;margin-left:200px;transform:rotate(-4deg);font-size:26px;text-align:left}
.jp-note--stage svg{position:absolute;left:-70px;top:-28px;width:70px;height:46px;transform:scaleX(-1) rotate(-12deg);color:#38405F}
@keyframes jp-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes jp-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ============ TECNOLOGIAS ============ */
.jp-tech{padding:34px 0 0;text-align:center}
.jp-tech>p{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--faint);margin-bottom:22px}
.jp-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.jp-marquee ul{list-style:none;display:flex;gap:14px;width:max-content;animation:jp-marq 46s linear infinite}
.jp-marquee li{display:inline-flex;align-items:center;gap:10px;padding:11px 20px;border-radius:99px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:650;color:var(--ink-2);box-shadow:0 1px 1px rgba(11,16,32,.03)}
.jp-marquee li::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--blue-2),var(--orange))}
@keyframes jp-marq{to{transform:translateX(-50%)}}

/* ============ NÚMEROS ============ */
.jp-nodes-sec{padding-top:72px}
.jp-nodes{display:flex;flex-direction:column;align-items:center;position:relative}
.jp-nodes>.jp-eyebrow{position:relative;z-index:2}
.jp-nodes>.jp-eyebrow::after{content:"";position:absolute;left:50%;top:100%;height:36px;border-left:2px dashed #C3CBE2}
.jp-nodes__row{position:relative;width:100%;margin-top:36px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.jp-nodes__row::before{content:"";position:absolute;left:12.5%;right:12.5%;top:-18px;border-top:2px dashed #C3CBE2}
.jp-node{position:relative;padding:26px 24px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1)}
.jp-node::before{content:"";position:absolute;left:50%;top:-18px;height:18px;border-left:2px dashed #C3CBE2}
.jp-node::after{content:"";position:absolute;left:50%;top:-22px;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:#fff;border:2px solid var(--blue-2)}
.jp-node b{display:block;font-size:clamp(34px,4vw,50px);letter-spacing:-.045em;font-weight:800;line-height:1;background:linear-gradient(135deg,var(--blue-2),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
.jp-node span{display:block;margin-top:10px;font-size:14px;line-height:1.45;color:var(--muted)}

/* ============ PASSOS ============ */
.jp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.jp-step{position:relative;padding:12px 12px 26px;border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);transition-delay:var(--d,0s)}
.jp-step h3{display:flex;align-items:center;gap:12px;margin:24px 14px 0;font-size:22px}
.jp-step h3 span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--ink);color:#fff;font-size:14px;font-weight:750}
.jp-step p{margin:10px 14px 0;font-size:15px;line-height:1.6;color:var(--muted)}
.jp-note--step{margin:14px 14px 0;color:var(--blue);font-size:24px;transform:rotate(-2deg)}
.jp-ui{height:272px;border-radius:20px;background:linear-gradient(180deg,#F7F9FF,#ECF0FA);border:1px solid var(--line);overflow:hidden}
.jp-ui__bar{display:flex;align-items:center;gap:6px;height:38px;padding:0 14px;background:#fff;border-bottom:1px solid var(--line);font-size:12px;font-weight:650;color:var(--faint)}
.jp-ui__bar i{width:9px;height:9px;border-radius:50%;background:#E3E6F0}
.jp-ui__bar i:nth-child(1){background:#FF8A7A}.jp-ui__bar i:nth-child(2){background:#FFD36B}.jp-ui__bar i:nth-child(3){background:#7BDC9A}
.jp-ui__bar span{margin-left:10px}
.jp-ui__row{display:flex;align-items:center;gap:10px;margin:10px 14px 0;padding:12px 13px;border-radius:13px;background:#fff;border:1px solid var(--line);font-size:13px}
.jp-ui__row.is-on{border-color:var(--blue-2);box-shadow:0 0 0 4px rgba(47,107,255,.12)}
.jp-ui__row b{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}
.jp-ui__row .jp-money{font-size:13px}
.jp-ui__dot{width:10px;height:10px;border-radius:50%;background:var(--accent,var(--blue));flex:none}
.jp-ui__sum{display:flex;align-items:center;justify-content:space-between;margin:14px 14px 0;padding:14px;border-radius:13px;background:#fff;border:1px solid var(--line);font-size:13px;color:var(--muted)}
.jp-ui__sum .jp-money{font-size:20px}
.jp-ui__methods{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 14px 0}
.jp-ui__methods span{display:flex;align-items:center;justify-content:center;gap:6px;height:40px;border-radius:11px;background:#fff;border:1px solid var(--line);font-size:12.5px;font-weight:650;color:var(--muted)}
.jp-ui__methods span.is-on{border-color:var(--blue-2);color:var(--blue);box-shadow:0 0 0 3px rgba(47,107,255,.12)}
.jp-ui__methods .jp-i{font-size:15px}
.jp-ui__btn{display:flex;align-items:center;justify-content:center;gap:8px;height:44px;margin:12px 14px 0;border-radius:12px;background:linear-gradient(180deg,#FF8244,#FF5A1F);color:#1A0A02;font-size:13.5px;font-weight:700}
.jp-ui__t{display:flex;align-items:center;gap:12px;margin:10px 14px 0;padding:12px 13px;border-radius:13px;background:#fff;border:1px solid var(--line);font-size:13px}
.jp-ui__t .jp-i{font-size:22px;color:var(--faint);flex:none}
.jp-ui__t.is-done .jp-i{color:var(--green)}
.jp-ui__t b{display:block;font-weight:650}
.jp-ui__t small{color:var(--faint);font-size:12px}

/* ============ CATEGORIAS ============ */
.jp-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;grid-auto-flow:dense}
.jp-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:178px;padding:24px;border-radius:26px;background:radial-gradient(130% 120% at 100% 0,color-mix(in srgb,var(--c) 13%,transparent),transparent 58%),#fff;border:1px solid var(--line);box-shadow:var(--sh-1);overflow:hidden;transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s,border-color .28s;transition-delay:var(--d,0s)}
.jp-tile:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--c)}
.jp-tile__ic{position:absolute;left:24px;top:24px;display:grid;place-items:center;width:50px;height:50px;border-radius:16px;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c)}
.jp-tile__ic .jp-i{font-size:25px}
.jp-tile__go{position:absolute;right:20px;top:20px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--soft);color:var(--ink-2);transition:all .25s}
.jp-tile:hover .jp-tile__go{background:var(--c);color:#fff;transform:rotate(45deg)}
.jp-tile strong{font-size:19px;letter-spacing:-.025em;line-height:1.2}
.jp-tile small{margin-top:5px;font-size:13px;color:var(--faint);font-weight:600}
.jp-tile--wide{grid-column:span 2;min-height:178px}
.jp-tile--wide strong{font-size:24px}
.jp-tile--wide::after{content:"";position:absolute;right:-30px;bottom:-30px;width:210px;height:210px;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--c) 40%,transparent);box-shadow:0 0 0 34px color-mix(in srgb,var(--c) 6%,transparent)}

/* ============ SERVIÇOS ============ */
.jp-catbar{justify-content:center;flex-wrap:wrap;overflow:visible;margin-bottom:30px}
.jp-empty{margin-top:24px;text-align:center;color:var(--muted)}

/* ============ COMPARATIVO ============ */
.jp-vs{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:980px;margin:0 auto}
.jp-vs__col{padding:34px;border-radius:28px;transition-delay:var(--d,0s)}
.jp-vs__col h3{font-size:22px;margin-bottom:22px}
.jp-vs__col ul{list-style:none;display:grid;gap:14px}
.jp-vs__col li{display:flex;align-items:center;gap:13px;font-size:16px;font-weight:550}
.jp-vs__col li .jp-i{width:28px;height:28px;padding:6px;border-radius:9px;flex:none}
.jp-vs__col--bad{background:#fff;border:1px solid var(--line);color:var(--muted)}
.jp-vs__col--bad li .jp-i{background:#FDECEC;color:#C62828}
.jp-vs__col--good{color:#fff;background:radial-gradient(90% 90% at 100% 0,rgba(47,107,255,.4),transparent 60%),linear-gradient(160deg,#0B1020,#17224A);box-shadow:var(--sh-2)}
.jp-vs__col--good h3{color:#fff}
.jp-vs__col--good li .jp-i{background:rgba(75,214,130,.18);color:#5BE08F}

/* ============ GARANTIAS ============ */
.jp-trustgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.jp-tg{display:flex;flex-direction:column;gap:10px;padding:26px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);transition:transform .28s,box-shadow .28s,border-color .28s;transition-delay:var(--d,0s)}
.jp-tg:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.jp-tg__ic{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:var(--blue-soft);color:var(--blue);margin-bottom:6px}
.jp-tg__ic .jp-i{font-size:24px}
.jp-tg h3{font-size:19px}
.jp-tg p{font-size:14.5px;line-height:1.6;color:var(--muted)}
.jp-tg em{margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:6px;font-style:normal;font-size:13px;font-weight:650;color:var(--blue)}

/* ============ FAQ ============ */
.jp-faq{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.jp-faq__side{position:sticky;top:110px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.jp-faq__side h2{font-size:clamp(32px,4vw,50px)}
.jp-faq__side p{font-size:17px;color:var(--muted)}
.jp-faq__list{display:grid;gap:10px}
.jp-q{border-radius:20px;background:#fff;border:1px solid var(--line);transition:box-shadow .2s,border-color .2s}
.jp-q[open]{box-shadow:var(--sh-1);border-color:var(--line-2)}
.jp-q summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;cursor:pointer;list-style:none;font-size:17px;font-weight:650;letter-spacing:-.015em}
.jp-q summary::-webkit-details-marker{display:none}
.jp-q summary i{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--soft);flex:none;transition:transform .25s,background .25s,color .25s}
.jp-q[open] summary i{transform:rotate(45deg);background:var(--ink);color:#fff}
.jp-q p{padding:0 24px 24px;font-size:15.5px;line-height:1.7;color:var(--muted);max-width:68ch}

/* ============ Responsivo ============ */
@media (max-width:1100px){
  .jp-bento{grid-template-columns:repeat(3,1fr)}
  .jp-trustgrid{grid-template-columns:repeat(2,1fr)}
  .jp-mini--l{transform:translate(-250px,46px) rotate(-7deg) scale(.9)}
  .jp-mini--r{transform:translate(250px,46px) rotate(7deg) scale(.9)}
  .jp-mini--l:hover{transform:translate(-250px,34px) rotate(-5deg) scale(.92)}
  .jp-mini--r:hover{transform:translate(250px,34px) rotate(5deg) scale(.92)}
}
@media (max-width:900px){
  .jp-steps{grid-template-columns:1fr}
  .jp-nodes__row{grid-template-columns:1fr 1fr}
  .jp-nodes__row::before,.jp-node::before,.jp-node::after{display:none}
  .jp-vs{grid-template-columns:1fr}
  .jp-faq{grid-template-columns:1fr;gap:34px}
  .jp-faq__side{position:static}
  .jp-section{padding-top:80px}
}
@media (max-width:760px){
  .jp-hero{padding-top:128px}
  .jp-search{flex-wrap:wrap;padding:12px;gap:10px}
  .jp-search__ic{display:none}
  .jp-search input[type=search]{flex:1 1 100%;background:var(--soft);border-radius:13px;height:50px}
  .jp-search .jp-btn{flex:1 1 100%}
  .jp-stage{height:360px;margin-top:44px}
  .jp-orbit--1{width:420px;height:420px}.jp-orbit--1 span{--r:210px}
  .jp-orbit--2{display:none}
  .jp-mini{width:250px;margin-left:-125px}
  .jp-mini--l{transform:translate(-120px,40px) rotate(-8deg) scale(.88)}
  .jp-mini--r{transform:translate(120px,40px) rotate(8deg) scale(.88)}
  .jp-mini--l:hover,.jp-mini--r:hover{transform:none}
  .jp-float--c,.jp-float--d,.jp-note--stage{display:none}
  .jp-float--a{left:0;top:2%}.jp-float--b{right:0;top:6%}
  .jp-bento{grid-template-columns:1fr 1fr}
  .jp-tile--wide{grid-column:span 2}
  .jp-trustgrid{grid-template-columns:1fr}
}
@media (max-width:460px){
  .jp-bento{grid-template-columns:1fr}.jp-tile--wide{grid-column:auto}
  .jp-nodes__row{grid-template-columns:1fr}
}

/* tile final de categorias (CTA) */
.jp-tile--cta{background:radial-gradient(120% 120% at 100% 0,rgba(47,107,255,.45),transparent 60%),linear-gradient(160deg,#0B1020,#17224A);border-color:#0B1020;color:#fff}
.jp-tile--cta .jp-tile__ic{background:rgba(255,255,255,.12);color:#fff}
.jp-tile--cta .jp-tile__go{background:rgba(255,255,255,.14);color:#fff}
.jp-tile--cta small{color:#AEB8DD}
.jp-tile--cta:hover{border-color:var(--orange)}
@media (max-width:640px){.jp-hero h1 .jp-hl{display:inline;transform:none;padding:.02em .16em .1em;-webkit-box-decoration-break:clone;box-decoration-break:clone}}
