/* ===========================================================
   Mafra Talents — site institucional (v2, 02/10/2026)
   A linguagem é a do site da Mafra Business Consulting, "o nome como
   arquitetura" (Akufen / MILL3), com UMA troca de marca: o preto da MBC
   vira o vinho da Mafra Talents (#25000E). O preto fica exclusivo da
   consultoria; o vinho é a assinatura da empresa de recrutamento.

   As três regras continuam valendo. Quebre uma e o site volta a ser template:
   1. O ACENTO É RACIONADO. Latão só em rótulo pequeno e sublinhado de link,
      nunca em título, número ou preenchimento.
   2. CONTRASTE DE ESCALA BRUTAL. O nome gigante contra o texto de 16px.
   3. NADA CENTRALIZADO, nada em card arredondado. A página é feita de fios,
      margens e tipo. As únicas coisas redondas são a .tag e o ponto de "novo".
   Piso de 15px em qualquer texto.
   =========================================================== */
:root{
  --paper:#FBFAF8;
  --paper-2:#F2EFEA;
  --ink:#26282C;
  --ink-2:#3A3D42;
  --dim:#64676C;
  --rule:#DFD9D0;
  --rule-2:#CFC7BB;
  --campo:#8E877C;          /* borda de campo: 3,41:1 no papel (WCAG 1.4.11) */
  --accent:#7F5D22;
  --accent-hi:#C9A253;
  --dark:#25000E;          /* vinho: superfícies escuras */
  --marca:#25000E;         /* vinho: preenchimentos (botões, números) */
  --marca-2:#45081F;       /* vinho, hover */
  --on-ink:#FBFAF8;
  --on-ink-dim:rgba(251,250,248,.62);
  --erro:#9B2C2C;--erro-bg:#F6E9E6;--erro-line:#DDB5AE;
  --ok:#3D6B3A;--ok-bg:#EEF2EA;--ok-line:#BFCDB9;

  --f-micro:15px;
  --f-small:15px;
  --f-body:16px;
  --f-lead:clamp(1.06rem,1.34vw,1.24rem);
  --f-h3:clamp(1.28rem,2.3vw,2rem);
  --f-h2:clamp(2rem,4.2vw,3.6rem);         /* títulos de coluna (formulários) */
  --f-display:clamp(2.3rem,6.6vw,6rem);
  --f-mega:clamp(2.8rem,7.8vw,7rem);       /* fecho da página e números */
  /* escala completa: 15 / 16 / lead / h3 / h2 / display / mega. Nada fora dela. */

  --font:'Onest',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --pad:clamp(20px,6vw,112px);
  --sec:clamp(88px,11.5vw,184px);
  --gap:clamp(28px,5vw,96px);
  --block:clamp(56px,7.5vw,120px);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--dark)}
body{background:var(--paper);color:var(--ink);font-family:var(--font);font-size:var(--f-body);
  font-weight:400;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
svg{display:block;flex-shrink:0}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
::selection{background:var(--marca);color:var(--paper)}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--marca);color:var(--paper);padding:10px 16px;font-weight:700}
.pular:focus{left:8px}

.wrap{padding-left:var(--pad);padding-right:var(--pad)}
h1,h2,h3{font-weight:800;letter-spacing:-.03em;line-height:.94;text-wrap:balance}
p{text-wrap:pretty}

.tag{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:0 10px;line-height:1.5;white-space:nowrap;
  transition:background .25s var(--ease),color .25s var(--ease)}
a.tag:hover{background:var(--marca);border-color:var(--marca);color:var(--paper)}
.micro{font-size:var(--f-micro);font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.7;color:var(--accent)}
.dim{color:var(--dim)}

/* ---------- link com fio de latão ---------- */
.lnk{display:inline-flex;align-items:baseline;gap:9px;font-weight:700;font-size:var(--f-body);
  border-bottom:2px solid var(--accent);padding-bottom:2px;transition:border-color .3s}
.lnk:hover{border-bottom-color:var(--ink)}
.lnk .arw{transition:transform .35s var(--ease)}
.lnk:hover .arw{transform:translateX(5px)}
.escuro .lnk,.lnk.on-ink{border-bottom-color:var(--accent-hi)}
.escuro .lnk:hover,.lnk.on-ink:hover{border-bottom-color:var(--on-ink)}

/* ---------- botão: quadrado, vinho ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:14px 26px;
  border:1px solid var(--marca);background:var(--marca);color:var(--paper);font:inherit;font-size:var(--f-small);
  font-weight:700;letter-spacing:.04em;cursor:pointer;white-space:nowrap;transition:background .2s var(--ease),border-color .2s var(--ease),color .2s}
.btn:hover{background:var(--marca-2);border-color:var(--marca-2)}
.btn .arw{transition:transform .35s var(--ease)}
.btn:hover .arw{transform:translateX(4px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--marca)}
.btn.ghost:hover{background:var(--marca);color:var(--paper)}
.escuro .btn{background:var(--paper);border-color:var(--paper);color:var(--dark)}
.escuro .btn:hover{background:transparent;color:var(--paper)}

/* ===========================================================
   Navegação
   =========================================================== */
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:12px;line-height:1}
.brand .simbolo{display:block;width:auto;height:28px;flex-shrink:0}
.foot-grid .brand .simbolo{height:34px}
.brand b{display:block;font-size:16px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.brand small{display:block;margin-top:5px;font-size:15px;font-weight:500;letter-spacing:.02em;opacity:.66}
.nav-links{display:flex;align-items:baseline;gap:clamp(18px,2.6vw,40px);flex-wrap:wrap}
.nav-links a{position:relative;font-size:var(--f-micro);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding-bottom:3px;white-space:nowrap}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.nav-links a[aria-current]::after{background:var(--accent-hi)}
.nav-links .cta{border:1px solid currentColor;padding:8px 14px;letter-spacing:.08em}
.nav-links .cta::after{display:none}
.nav-links .cta:hover{background:var(--on-ink);color:var(--dark)}
.menu-bt{display:none;background:none;border:1px solid currentColor;color:inherit;font:inherit;font-size:15px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:8px 14px;cursor:pointer}
@media(max-width:900px){
  .menu-bt{display:inline-block}
  .nav-links{display:none;flex-basis:100%;flex-direction:column;gap:0;padding-top:12px}
  .nav-links.aberto{display:flex}
  .nav-links a{padding:14px 0;border-top:1px solid rgba(251,250,248,.16)}
  .nav-links .cta{border:0;border-top:1px solid rgba(251,250,248,.16);padding:14px 0}
}

/* cabeçalho das páginas internas: faixa vinho, com foto apagada por baixo
   (o mesmo tratamento do herói: preto e branco, escurecida, o vinho por cima) */
.topo{position:relative;isolation:isolate;overflow:hidden;background:var(--dark);color:var(--on-ink)}
.topo>.wrap{position:relative;z-index:2}
.topo-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.topo-bg img{width:100%;height:100%;object-fit:cover;object-position:center 35%;
  filter:grayscale(1) sepia(.2) brightness(.5) contrast(1.15);transform:scale(1.04)}
.topo-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(37,0,14,.96) 0%,rgba(37,0,14,.86) 48%,rgba(37,0,14,.62) 100%),
    radial-gradient(90% 90% at 92% 10%,rgba(201,162,83,.16),rgba(201,162,83,0) 60%)}
@media(max-width:760px){.topo-bg::after{background:linear-gradient(180deg,rgba(37,0,14,.9),rgba(37,0,14,.94))}}
.topo header{padding:clamp(22px,2.6vw,36px) 0}
.topo .pg-hd{padding:clamp(48px,7vw,104px) 0 clamp(48px,6vw,88px);border-top:1px solid rgba(251,250,248,.18)}
.topo .pg-hd .micro{color:var(--accent-hi)}
.topo .pg-hd h1{font-size:var(--f-display);margin-top:18px;max-width:16ch}
.topo .pg-hd h1 .apagado{color:rgba(251,250,248,.42)}
.topo .pg-hd .intro{max-width:56ch;margin-top:clamp(24px,3vw,40px);font-size:var(--f-lead);line-height:1.66;color:rgba(251,250,248,.82)}

/* ===========================================================
   Herói da home: o nome é a peça inteira
   =========================================================== */
.hero{position:relative;background:var(--dark);color:var(--on-ink);isolation:isolate;overflow:hidden}
.hero .wrap{position:relative;z-index:2;container-type:inline-size}
.hero header{padding-top:clamp(26px,3vw,44px)}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%;
  filter:grayscale(1) sepia(.2) brightness(.42) contrast(1.2);transform:scale(1.06);will-change:transform}
.hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(37,0,14,.88) 0%,rgba(37,0,14,.6) 42%,rgba(37,0,14,.97) 100%),
    radial-gradient(115% 80% at 78% 8%,rgba(201,162,83,.14),rgba(201,162,83,0) 62%)}
.name{position:relative;margin-top:clamp(28px,5vh,64px);font-size:min(15rem,15.4cqi);font-weight:800;line-height:.74;
  letter-spacing:-.04em;padding-right:.05em;text-align:justify;text-align-last:justify;white-space:nowrap;color:var(--on-ink)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .name{background-image:linear-gradient(180deg,rgba(251,250,248,.62),rgba(251,250,248,.82)),url("img/expansion.jpg");
    background-size:cover,150% auto;background-position:center,var(--bgx,50%) var(--bgy,62%);background-repeat:no-repeat;
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
    filter:grayscale(1) contrast(1.05);transition:background-position .5s var(--ease)}
}
.sub{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;
  border-top:1px solid rgba(251,250,248,.32);margin-top:clamp(14px,1.6vw,22px);padding-top:clamp(12px,1.2vw,16px)}
.sub b{font-size:var(--f-micro);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--on-ink)}
.sub span{font-size:var(--f-micro);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--on-ink-dim)}
.hero .micro{color:var(--accent-hi)}
.hero .tag{border-color:rgba(251,250,248,.6)}
.hero a.tag:hover{background:var(--on-ink);color:var(--dark);border-color:var(--on-ink)}
.hero-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(40px,7vw,140px);
  align-items:end;margin-top:clamp(56px,10vh,128px)}
.intro{max-width:52ch;font-size:var(--f-lead);line-height:1.66;color:rgba(251,250,248,.84)}
.intro p+p{margin-top:1.1em}
.hero-foot{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;
  margin-top:clamp(56px,10vh,120px);padding-bottom:clamp(48px,8vh,104px)}
.hero-foot .acoes{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px}
@media(max-width:980px){.hero-body{grid-template-columns:1fr;align-items:start}}

/* "Open now": as vagas vivas do Jobs Board no lugar dos relógios da MBC */
.agora .micro{display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(251,250,248,.32)}
.agora .micro .lt{color:var(--on-ink-dim);font-weight:500}
.agora ol{list-style:none}
.agora li a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 18px;align-items:baseline;padding:14px 0;
  border-bottom:1px solid rgba(251,250,248,.12);transition:color .3s var(--ease)}
.agora li b{font-weight:700;color:var(--on-ink);line-height:1.3}
.agora li span{font-size:15px;color:var(--on-ink-dim)}
.agora li .arw{color:var(--on-ink-dim);transition:transform .35s var(--ease),color .3s}
.agora li a:hover .arw{transform:translateX(4px);color:var(--accent-hi)}
.agora li a:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.agora .todas{display:inline-block;margin-top:18px}
.agora .vazia{padding:14px 0;color:var(--on-ink-dim);border-bottom:1px solid rgba(251,250,248,.12)}
.ponto{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent-hi);margin-right:8px;vertical-align:2px}

/* ===========================================================
   Seções
   =========================================================== */
.sec{padding-block:var(--sec);border-top:1px solid var(--ink)}
.hero+.sec,.topo+.sec{border-top:0}
.sec-hd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:var(--gap);align-items:start}
.sec-hd h2{font-size:var(--f-display)}
.sec-hd .note{max-width:52ch;color:var(--dim);margin-top:clamp(20px,2.4vw,32px);font-size:var(--f-lead);line-height:1.6}
@media(max-width:860px){.sec-hd{grid-template-columns:1fr;gap:22px}}
.sec{scroll-margin-top:40px}

/* credenciais: palavras entre dois fios */
.creds{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px clamp(16px,2.2vw,32px);
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:clamp(22px,2.4vw,32px) 0}
.creds span{font-size:clamp(15px,1.25vw,16px);font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;
  transition:opacity .35s var(--ease)}
@media(hover:hover){.creds:hover span{opacity:.3}.creds span:hover{opacity:1}}

/* ---------- acordeão: a ficha que escurece ao abrir (vinho) ---------- */
.acc{position:relative;isolation:isolate;margin-inline:calc(-1 * var(--pad));padding-inline:var(--pad);
  background:linear-gradient(var(--rule),var(--rule)) var(--pad) 0 / calc(100% - 2 * var(--pad)) 1px no-repeat}
.acc:first-of-type{background:none}
.acc::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--dark);transform:scaleY(0);transform-origin:top;
  transition:transform .6s var(--ease)}
.acc[open]::before{transform:scaleY(1)}
.acc[open]+.acc{background:none}
.acc-hd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:var(--gap);align-items:start;padding:clamp(30px,3.8vw,54px) 0}
.acc-ttl{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(18px,3vw,40px)}
.acc-n{display:inline-grid;place-items:center;width:46px;height:46px;margin-top:-6px;font-size:var(--f-micro);font-weight:700;
  letter-spacing:.1em;background:var(--marca);color:var(--on-ink);transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease)}
.acc-hd:hover .acc-n{transform:translateX(6px)}
.acc[open] .acc-n{background:var(--on-ink);color:var(--dark)}
.acc-hd h3{font-size:var(--f-h3);max-width:34ch;transition:color .4s var(--ease)}
.acc-hd:hover h3{color:var(--accent)}
.acc[open] .acc-hd h3{color:var(--on-ink)}
.acc[open] .acc-hd:hover h3{color:var(--accent-hi)}
.plus{width:20px;height:20px;position:relative;flex:none;margin-top:6px}
.plus::before,.plus::after{content:"";position:absolute;background:var(--ink);transition:transform .4s var(--ease),background .3s var(--ease)}
.plus::before{left:0;right:0;top:9px;height:2px}
.plus::after{top:0;bottom:0;left:9px;width:2px}
.acc[open] .plus::after{transform:scaleY(0)}
.acc[open] .plus::before,.acc[open] .plus::after{background:var(--on-ink)}
.acc-bd{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.acc[open] .acc-bd{grid-template-rows:1fr}
.acc-bd>div{overflow:hidden}
.acc-in{padding:0 0 clamp(44px,5.5vw,84px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:var(--gap)}
.acc-in .body{max-width:66ch}
.acc-in .body>p{margin-bottom:24px}
.acc[open] .acc-in .body p,.acc[open] .acc-in li{color:rgba(251,250,248,.82)}
.acc[open] :focus-visible{outline-color:var(--on-ink)}
.acc .micro.k{color:var(--accent)}
.acc[open] .micro.k{color:var(--accent-hi)}
/* lista de funções: duas colunas de fios */
.funcoes{list-style:none;columns:2;column-gap:var(--gap)}
.funcoes li{break-inside:avoid;padding:12px 0;border-top:1px solid var(--rule)}
.acc[open] .funcoes li{border-top-color:rgba(251,250,248,.16)}
.funcoes li:first-child b,.funcoes li b{font-weight:700}
@media(max-width:860px){.acc-in{grid-template-columns:1fr;gap:20px}.acc-hd{grid-template-columns:auto minmax(0,1fr);gap:16px}
  .acc-n{width:40px;height:40px}.funcoes{columns:1}}
@media(prefers-reduced-motion:reduce){.acc::before,.acc-n,.acc-bd{transition:none}}

/* ---------- linhas de mandato (md) ---------- */
.md{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:var(--gap);padding:clamp(28px,3vw,44px) 0;border-top:1px solid var(--rule)}
.md:last-of-type{border-bottom:1px solid var(--rule)}
.md .t{font-size:var(--f-micro);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);padding-top:5px}
.md b{display:block;font-size:var(--f-h3);font-weight:800;letter-spacing:-.024em;margin-bottom:10px;line-height:1.1}
.md p{color:var(--dim);max-width:62ch}
.md ul{list-style:none;margin-top:14px;display:flex;flex-wrap:wrap;gap:8px 10px}
@media(max-width:860px){.md{grid-template-columns:1fr;gap:8px}}

/* ---------- números ---------- */
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(40px,5vw,80px) var(--gap);margin-top:var(--block)}
.nums div{border-top:2px solid var(--marca);padding-top:clamp(18px,2.2vw,30px)}
.nums b{display:block;font-size:var(--f-mega);font-weight:800;letter-spacing:-.055em;line-height:.86;margin-left:-.055em}
.nums small{display:block;margin-top:16px;font-size:var(--f-micro);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.nums p{margin-top:10px;color:var(--dim);max-width:36ch}
@media(max-width:760px){.nums{grid-template-columns:1fr;gap:28px}}

/* ---------- foto em faixa ---------- */
figure{position:relative;overflow:hidden;background:var(--paper-2)}
figure img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(.16) contrast(1.1) brightness(.9)}
.band{margin-top:var(--block);margin-inline:calc(-1 * var(--pad));height:clamp(240px,40vw,600px)}
.band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none;
  background:linear-gradient(180deg,rgba(37,0,14,0),rgba(37,0,14,.86))}
.band figcaption{position:absolute;z-index:1;left:var(--pad);right:var(--pad);bottom:clamp(16px,2vw,26px);display:flex;
  justify-content:space-between;align-items:baseline;gap:16px;color:var(--on-ink);font-size:var(--f-micro);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;line-height:1.45}
.band figcaption i{font-style:normal;color:var(--accent-hi);white-space:nowrap}

/* ---------- presença: três cidades em fotos, três relógios ---------- */
.cidades{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);margin-top:var(--block)}
.cidades figure{height:clamp(180px,22vw,340px)}
.cidades figcaption{position:absolute;z-index:1;left:16px;right:16px;bottom:14px;color:var(--on-ink);font-size:15px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase}
.cidades figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,0,14,0) 40%,rgba(37,0,14,.85))}
@media(max-width:700px){.cidades{grid-template-columns:1fr}.cidades figure{height:200px}}
.desks ol{list-style:none;border-top:1px solid var(--ink)}
.desks li{display:grid;grid-template-columns:minmax(0,12em) minmax(0,1fr) 3.6em;gap:18px;align-items:center;
  padding:18px 0;border-bottom:1px solid var(--rule)}
.desks .c b{display:block;font-size:var(--f-h3);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.desks .c span{display:block;margin-top:4px;font-size:15px;color:var(--dim)}
.desks time{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.desks time b{font-weight:700;animation:colon 2s steps(1) infinite}
@keyframes colon{50%{opacity:.25}}
.day{position:relative;height:1px;background:var(--rule-2)}
.day::before{content:"";position:absolute;left:37.5%;width:37.5%;top:-1px;height:3px;background:rgba(127,93,34,.28)}
.day i{position:absolute;top:-5px;left:var(--p,0%);width:1px;height:11px;background:var(--marca)}
.desks li.open .day::before{background:rgba(127,93,34,.62)}
@media(max-width:620px){.desks li{grid-template-columns:minmax(0,1fr) 3.6em}.desks .day{display:none}}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:24px;align-items:start;padding:clamp(20px,2.2vw,28px) 0;
  font-size:var(--f-lead);font-weight:700;letter-spacing:-.01em;line-height:1.35;transition:color .3s var(--ease)}
.faq summary:hover{color:var(--accent)}
.faq summary .plus{margin-top:4px}
.faq details[open] .plus::after{transform:scaleY(0)}
.faq details[open] .plus::before,.faq details[open] .plus::after{background:var(--ink)}
.faq .resp{padding:0 0 clamp(24px,2.6vw,34px);max-width:66ch;color:var(--ink-2)}
.faq .resp p+p,.faq .resp p+ul,.faq .resp ul+p{margin-top:12px}
.faq .resp ul{list-style:none;margin-top:10px}
.faq .resp li{position:relative;padding:6px 0 6px 22px}
.faq .resp li::before{content:"";position:absolute;left:0;top:18px;width:10px;height:1px;background:var(--ink)}
.faq .resp b{color:var(--ink)}

/* ---------- bloco final vinho ---------- */
.final{position:relative;overflow:hidden;isolation:isolate;background:var(--dark);color:var(--on-ink);border-top:0}
.final::before{content:"";position:absolute;right:-8%;top:-30%;width:70%;height:150%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(201,162,83,.17),rgba(201,162,83,0) 72%)}
.final>*{position:relative;z-index:1}
.final .micro{color:var(--accent-hi)}
.final h2{font-size:var(--f-mega);letter-spacing:-.045em;line-height:.92;max-width:17ch;margin-top:clamp(16px,2vw,26px)}
.final-row{margin-top:var(--block);border-top:1px solid rgba(251,250,248,.18);padding-top:clamp(30px,3.4vw,48px)}
.final .note{color:rgba(251,250,248,.76);max-width:52ch;font-size:var(--f-lead);line-height:1.6}
.final .acoes{display:flex;flex-wrap:wrap;align-items:center;gap:20px 36px;margin-top:clamp(36px,4.4vw,64px)}

/* ===========================================================
   Lista de vagas (dados vivos do Jobs Board)
   =========================================================== */
.filtros{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px;
  border-bottom:1px solid var(--ink);margin-top:var(--block)}
.abas{display:flex;flex-wrap:wrap;gap:0 24px}
.aba{position:relative;display:inline-flex;align-items:baseline;gap:8px;padding:12px 0;background:none;border:0;font:inherit;
  font-size:var(--f-small);font-weight:600;color:var(--dim);cursor:pointer;white-space:nowrap}
.aba .n{font-weight:500;font-variant-numeric:tabular-nums}
.aba:hover,.aba[aria-pressed="true"]{color:var(--ink)}
.aba[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--marca)}
.busca{display:flex;align-items:center;gap:12px;padding-bottom:12px;min-width:min(100%,320px)}
.busca input{width:100%}
.vagas{list-style:none}
.vaga{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px var(--gap);align-items:start;
  padding:clamp(26px,2.8vw,40px) 0;border-bottom:1px solid var(--rule)}
.vaga::before{content:"";position:absolute;left:calc(-1 * clamp(12px,1.6vw,22px));top:-1px;bottom:-1px;width:2px;
  background:var(--accent);opacity:0;transition:opacity .2s var(--ease)}
.vaga:hover::before,.vaga:focus-within::before{opacity:1}
.vaga h3{font-size:var(--f-h3);letter-spacing:-.025em;line-height:1.12}
.vaga h3 a::after{content:"";position:absolute;inset:0}
.vaga h3 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.vaga .emp{margin-top:8px;font-weight:600;color:var(--ink-2)}
.vaga .emp svg{display:inline-block;vertical-align:-1px;margin-right:6px}
.vaga .res{margin-top:12px;color:var(--dim);max-width:70ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vaga .meta{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:16px}
.vaga .meta .tag{font-size:15px}
.vaga .meta .tag.q{border-color:var(--rule-2);color:var(--ink-2)}
.vaga .lado{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right;pointer-events:none}
.vaga .lado .novo{font-size:15px;font-weight:700;color:var(--ink)}
.vaga .lado .ponto{background:var(--accent)}
.vaga .lado .ver{font-weight:700;border-bottom:2px solid var(--accent);padding-bottom:2px}
@media(max-width:760px){.vaga{grid-template-columns:1fr}.vaga .lado{flex-direction:row;align-items:center;justify-content:space-between;text-align:left}
  .vaga::before{left:-10px}}
.vazio-l{padding:clamp(28px,3vw,44px) 0;border-bottom:1px solid var(--rule);color:var(--dim)}
.vazio-l b{display:block;color:var(--ink);font-size:var(--f-h3);font-weight:800;letter-spacing:-.02em;margin-bottom:8px}

/* ===========================================================
   Formulários
   =========================================================== */
.forma{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:var(--gap);align-items:start}
.forma .lado-f{position:sticky;top:28px}
.forma .lado-f h2{font-size:var(--f-h2);margin-top:14px}
.forma .lado-f p{margin-top:18px;color:var(--dim);max-width:40ch}
.forma .lado-f .confia{list-style:none;margin-top:28px;border-top:1px solid var(--rule)}
.forma .lado-f .confia li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--rule);
  font-size:15px;color:var(--ink-2)}
.forma .lado-f .confia svg{margin-top:4px;color:var(--marca)}
@media(max-width:1180px){.forma{grid-template-columns:1fr}.forma .lado-f{position:static}}
.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
.campo{display:block;margin-bottom:24px}
.campo.cheio{grid-column:1 / -1}
.campo label,.campo .rot{display:block;margin-bottom:8px;font-size:15px;font-weight:600;color:var(--ink)}
.campo label .opc{font-weight:500;color:var(--dim)}
.campo .ajuda{display:block;margin-top:6px;font-size:15px;color:var(--dim)}
.campo .erro-msg{display:block;margin-top:6px;font-size:15px;font-weight:600;color:var(--erro)}
.campo .erro-msg:empty{display:none}
input[type=text],input[type=email],input[type=tel],input[type=search],input[type=url],select,textarea{
  width:100%;min-height:52px;padding:13px 16px;border:1px solid var(--campo);border-radius:0;background:var(--paper);
  font:inherit;font-size:16px;color:var(--ink);-webkit-appearance:none;appearance:none;
  transition:border-color .18s var(--ease),background .18s var(--ease)}
textarea{min-height:150px;resize:vertical;line-height:1.6}
input:hover,select:hover,textarea:hover{border-color:var(--dim)}
input:focus,select:focus,textarea:focus{border-color:var(--marca);background:#fff;outline:none}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--marca);outline-offset:1px}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--erro)}
input::placeholder,textarea::placeholder{color:#8C8F94}
input[type=checkbox]{accent-color:var(--marca);width:18px;height:18px}
@media(max-width:640px){.campos{grid-template-columns:1fr}}
/* arquivo: área de soltar quadrada */
.drop{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:center;min-height:104px;padding:24px;
  border:1px dashed var(--campo);background:var(--paper-2);cursor:pointer;transition:border-color .18s,background .18s}
.drop:hover,.drop.arrastando{border-color:var(--marca);background:var(--paper)}
.drop:focus-within{outline:2px solid var(--marca);outline-offset:2px}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.drop .ico{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--marca);color:var(--marca)}
.drop.ok{border-style:solid;border-color:var(--marca);background:var(--paper)}
.drop.ok .ico{background:var(--marca);color:var(--on-ink)}
.drop .t{display:block;font-weight:700;overflow-wrap:anywhere}
.drop .s{display:block;margin-top:2px;font-size:15px;color:var(--dim)}
.drop.invalido{border-color:var(--erro);border-style:solid}
.mel{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.envio{margin-top:8px;padding-top:24px;border-top:1px solid var(--ink);display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.envio .ajuda{font-size:15px;color:var(--dim);max-width:46ch}
.alerta{display:flex;gap:12px;align-items:flex-start;margin-bottom:28px;padding:16px 20px;border-left:3px solid var(--ink);
  background:var(--paper-2);font-size:15px;line-height:1.55}
.alerta svg{flex-shrink:0;margin-top:3px}
.alerta.ok{border-left-color:var(--ok);background:var(--ok-bg)}
.alerta.ok svg{color:var(--ok)}
.alerta.erro{border-left-color:var(--erro);background:var(--erro-bg)}
.alerta.erro svg{color:var(--erro)}
.alerta b{font-weight:700}
.spin{width:17px;height:17px;border:2px solid rgba(251,250,248,.35);border-top-color:var(--paper);border-radius:50%;
  animation:gira .7s linear infinite;display:none}
.btn.enviando .spin{display:block}
.btn.enviando .arw{display:none}
@keyframes gira{to{transform:rotate(360deg)}}

/* texto longo (acessibilidade) */
.texto{max-width:70ch}
.texto h2{font-size:var(--f-h3);margin:clamp(40px,4vw,56px) 0 14px;line-height:1.1}
.texto h2:first-child{margin-top:0}
.texto p+p{margin-top:14px}
.texto ul{list-style:none;margin-top:12px}
.texto li{position:relative;padding:8px 0 8px 22px;border-bottom:1px solid var(--rule)}
.texto li::before{content:"";position:absolute;left:0;top:21px;width:10px;height:1px;background:var(--ink)}

/* ===========================================================
   Rodapé vinho + assinatura
   =========================================================== */
footer{background:var(--dark);color:var(--on-ink-dim);padding:clamp(56px,6vw,96px) 0 clamp(34px,3.6vw,52px)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,1fr));gap:36px var(--gap);
  padding-bottom:clamp(40px,4.4vw,64px)}
.foot-grid .brand{color:var(--on-ink)}
.foot-grid .brand small{opacity:1;color:var(--on-ink-dim)}
.foot-grid p{margin-top:18px;max-width:34ch;font-size:15px}
.foot-grid h3{font-size:var(--f-micro);font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.7;color:var(--accent-hi);margin-bottom:12px}
.foot-grid ul{list-style:none}
.foot-grid li{padding:6px 0;font-size:15px}
.foot-grid a{color:var(--on-ink);transition:color .2s}
.foot-grid a:hover{color:var(--accent-hi)}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1 / -1}}
@media(max-width:480px){.foot-grid{grid-template-columns:1fr}}
.foot{position:relative;display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-top:1px solid rgba(251,250,248,.18);padding-top:clamp(22px,2.4vw,32px);font-size:15px}
.foot::before{content:"";position:absolute;left:0;top:-1px;width:44px;height:2px;background:var(--accent-hi)}
.foot a{transition:color .2s}
.foot a:hover{color:var(--on-ink)}
.foot .credito{flex-basis:100%;margin-top:clamp(14px,1.6vw,20px);padding-top:clamp(16px,1.8vw,22px);border-top:1px solid rgba(251,250,248,.1)}
.foot .credito a{color:var(--on-ink);border-bottom:1px solid var(--accent-hi);padding-bottom:1px;white-space:nowrap;font-weight:600}
.foot .credito .arw{display:inline-block;margin-left:5px;transition:transform .35s var(--ease)}
.foot .credito a:hover .arw{transform:translate(2px,-2px)}

/* ===========================================================
   Movimento: nada começa escondido, o script só arma o que está fora da tela
   =========================================================== */
.wipe>*{display:block;transition:clip-path 1s var(--ease);transition-delay:var(--d,0s)}
.fade{transition:opacity .8s var(--ease);transition-delay:var(--d,0s)}
.wipe.armed>*{clip-path:inset(0 0 105% 0)}
.fade.armed{opacity:0}
.js .hero .name{clip-path:inset(-30% 0 0 0)}
.js .hero .ch{display:inline-block;transition:transform 1.15s var(--ease),opacity .6s linear;transition-delay:calc(var(--i) * .065s)}
.js .hero:not(.in) .ch{transform:translateY(118%);opacity:0}
.js .hero:not(.in) .name{visibility:hidden}
.js .hero-bg{transition:transform 2.6s var(--ease),opacity 1.8s var(--ease)}
.js .hero:not(.in) .hero-bg{transform:scale(1.09);opacity:0}
.js .hero .sub,.js .hero .hero-body,.js .hero .hero-foot{transition:opacity .9s var(--ease),transform 1s var(--ease)}
.js .hero:not(.in) .sub{opacity:0;transform:translateY(10px)}
.js .hero:not(.in) .hero-body{opacity:0;transform:translateY(14px)}
.js .hero:not(.in) .hero-foot{opacity:0;transform:translateY(10px)}
.js .hero .sub{transition-delay:.55s}.js .hero .hero-body{transition-delay:.8s}.js .hero .hero-foot{transition-delay:1s}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .armed,.armed>*{clip-path:none!important;opacity:1!important}
  .wipe>*,.fade,.js .hero .ch,.js .hero-bg,.js .hero .sub,.js .hero .hero-body,.js .hero .hero-foot{transition:none}
  .desks time b{animation:none}
  .spin{animation:none}
}

/* ---------- Where we focus: dois segmentos em fios (sem card), como o resto do site ---------- */
.foco-intro{font-size:var(--f-lead);line-height:1.5;color:var(--ink-2);max-width:46ch}
.foco{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:clamp(28px,3.4vw,48px)}
.foco article{position:relative;border-top:1px solid var(--ink);padding-top:clamp(18px,2vw,26px)}
.foco article::before{content:"";position:absolute;left:0;top:-1px;width:44px;height:1px;background:var(--accent)}
.foco h3{font-size:var(--f-h3);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin-top:12px;color:var(--ink)}
.foco article>p:last-child{margin-top:12px;color:var(--ink-2);max-width:44ch}
.foco-nota{margin-top:clamp(28px,3.4vw,44px);max-width:70ch}
@media(max-width:760px){.foco{grid-template-columns:1fr}}
/* local da vaga no atalho do topo */
.agora li .onde{display:inline-flex;align-items:center;gap:6px}
.agora li .onde svg{flex-shrink:0;opacity:.8}
