/* CURSINO / O ARQUIVO — v6: moldura travada (logo em cima, orelhas de menu, pasta fixa, conteudo rola) */
:root{
  --papel:#F4F1EA;
  --papel-2:#EAE6DB;
  --papel-cinza:#E0DEDA;
  --cartao:#D7D5D0;
  --grafite:#1C1C1B;
  --tinta:#1D4ED8;        /* azul bic: SO manuscrito */
  --preto:#141414;
  --cinza-texto:#6E6C66;
  --borda2:#CBC7BA;
  --largura-pasta:min(1240px,96vw);
  --grao:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
*{margin:0;padding:0;box-sizing:border-box;}
html{overflow-x:clip; scrollbar-gutter:stable;}
body{
  background:var(--grafite);
  color:var(--preto);
  font-family:'Instrument Sans',Arial,sans-serif;
  font-size:17px; line-height:1.6;
  overflow-x:clip;
}
body::after{
  content:""; position:fixed; inset:0; z-index:999; pointer-events:none;
  background-image:var(--grao); opacity:.05;
}
a{color:inherit;}
img{max-width:100%;}
.mao{font-family:'Shadows Into Light',cursive; color:var(--tinta);}
:focus-visible{outline:2px solid var(--tinta); outline-offset:3px;}

/* ---------- O LOGO UNICO: fixo, desliza do hero e encaixa no topo ---------- */
.logo-heroi{position:fixed; left:50%; top:0; z-index:70; will-change:transform;}
.logo-heroi img{display:block; height:clamp(56px,9vw,118px); width:auto;}

/* ---------- HERO (nas tres paginas): a vaga do logo + a linha ---------- */
.hero{
  min-height:calc(100vh - 74px); min-height:calc(100svh - 74px);
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  gap:30px; padding:40px 24px 20px; color:var(--papel);
}
.logo-vaga{height:clamp(56px,9vw,118px); pointer-events:none;}
.hero .linha{
  font-size:clamp(15px,2.3vw,19px); color:#B9B5AC; text-align:center;
  opacity:calc(1 - var(--dock,0) * 1.6);
}

/* ---------- A MOLDURA TRAVADA: faixa do logo + orelhas + tampa da pasta ---------- */
.grudado{position:sticky; top:0; z-index:50; background:var(--grafite);}
.grudado .mini{
  display:flex; justify-content:center; align-items:center; height:34px;
}
.mini-vaga{height:20px; width:auto; opacity:0; display:block;}
.abas-menu{
  width:var(--largura-pasta); margin:0 auto;
  display:flex; gap:8px; justify-content:flex-end; padding-right:2.5%; align-items:flex-end;
}
.aba-link{
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:600;
  letter-spacing:.14em; text-decoration:none; color:var(--preto);
  background:var(--papel-2); background-image:var(--grao); background-blend-mode:multiply;
  border:1px solid var(--borda2); border-bottom:none;
  clip-path:polygon(0 100%, 10px 0, calc(100% - 10px) 0, 100% 100%);
  padding:7px 20px 5px;
  filter:brightness(.86);
}
.aba-link:hover{filter:brightness(.95);}
.aba-link[aria-current="page"]{filter:none; padding-top:9px;}
.tampa{
  width:var(--largura-pasta); margin:0 auto; height:16px;
  background-color:var(--papel-2); background-image:var(--grao); background-blend-mode:multiply;
  border:1px solid var(--borda2); border-bottom:none;
  border-radius:14px 14px 0 0;
  box-shadow:0 -10px 30px rgba(0,0,0,.35);
}
.pagina-cinza .tampa, .pagina-cinza .aba-link[aria-current="page"]{background-color:var(--papel-cinza);}
/* pagina sobre: boxes e textos centralizados */
.pagina-cinza .conteudo-pasta .folha{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------- A TROCA DE FOLHA ---------- */
@keyframes folhaEntra{from{opacity:0; translate:0 26px;} to{opacity:1; translate:0 0;}}
@keyframes folhaSai{to{opacity:0; translate:0 30px;}}
.tampa, .conteudo-pasta, .fundo-pasta{animation:folhaEntra .34s ease-out both;}
html.folha-sai .tampa, html.folha-sai .conteudo-pasta, html.folha-sai .fundo-pasta{
  animation:folhaSai .2s ease-in both;
}

/* ---------- O CORPO DA PASTA: o conteudo rola por baixo da moldura ---------- */
.conteudo-pasta{
  width:var(--largura-pasta); margin:0 auto;
  background-color:var(--papel-2); background-image:var(--grao); background-blend-mode:multiply;
  border-left:1px solid var(--borda2); border-right:1px solid var(--borda2);
  padding:48px 6vw 100px;
}
.pagina-cinza .conteudo-pasta{background-color:var(--papel-cinza);}
.fundo-pasta{
  width:var(--largura-pasta); margin:0 auto 12vh;
  height:22px;
  background-color:var(--papel-2); background-image:var(--grao); background-blend-mode:multiply;
  border:1px solid var(--borda2); border-top:none;
  border-radius:0 0 14px 14px;
}
.pagina-cinza .fundo-pasta{background-color:var(--papel-cinza);}
.cabeca-pagina{text-align:center; margin:6vh 0 8vh;}
.titulo-mao{
  font-family:'Shadows Into Light',cursive; color:var(--tinta);
  font-size:clamp(48px,8vw,88px); line-height:1; rotate:-1.5deg; display:inline-block;
}
.sub-pagina{font-size:clamp(16px,2vw,20px); color:var(--cinza-texto); margin-top:8px;}

/* ---------- POLAROID ---------- */
.polaroid{
  background:#FCFBF7; border:1px solid #DDD9CD;
  padding:5% 5% 0; box-shadow:0 6px 18px rgba(20,20,20,.22);
  rotate:var(--tilt, -2deg);
  transition:rotate .22s ease-out, translate .22s ease-out, box-shadow .22s ease-out;
}
.polaroid .foto{aspect-ratio:1/1.02; overflow:hidden; position:relative; background:var(--cartao);}
.polaroid .foto img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(1) contrast(1.28) brightness(1.04);
}
.polaroid .foto::after{
  content:""; position:absolute; inset:0; background-image:var(--grao); opacity:.09; pointer-events:none;
}
.polaroid .legenda{
  padding:13px 4px 16px;
  font-family:'Shadows Into Light',cursive; font-size:clamp(21px,2vw,26px);
  color:var(--tinta); line-height:1; text-align:center;
}
a.card-polaroid{display:block; text-decoration:none;}
a.card-polaroid:hover .polaroid, a.card-polaroid:focus-visible .polaroid{
  rotate:0deg; translate:0 -5px; box-shadow:0 16px 32px rgba(20,20,20,.28);
}
.chip-roteiro{
  display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:10px;
  letter-spacing:.14em; color:var(--cinza-texto); border:1px solid var(--borda2);
  padding:2px 8px;
}
.grade-polaroids{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(205px,1fr));
  gap:46px 34px; align-items:start;
}
.grade-polaroids > *:nth-child(4n+1){--tilt:-2.2deg;}
.grade-polaroids > *:nth-child(4n+2){--tilt:1.4deg;}
.grade-polaroids > *:nth-child(4n+3){--tilt:-0.8deg;}
.grade-polaroids > *:nth-child(4n+4){--tilt:2.6deg;}

/* ---------- BUSCA E FILTRO ---------- */
.filtros{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:6px 0 52px;}
.filtro{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600;
  letter-spacing:.1em; padding:9px 16px; border:1px solid var(--preto);
  background:transparent; color:var(--preto); cursor:pointer;
}
.filtro[aria-pressed="true"]{background:var(--preto); color:var(--papel);}
.filtros input{
  font-family:'Shadows Into Light',cursive; font-size:22px; color:var(--tinta);
  border:none; border-bottom:1.5px solid var(--preto); background:transparent;
  padding:4px 2px; min-width:200px; margin-left:auto; outline:none;
}
.filtros input:focus{border-bottom-width:3px;}

/* ---------- FOLHAS SOLTAS ---------- */
.folha{
  background:#FCFBF7; border:1px solid var(--borda2);
  padding:30px 32px; box-shadow:0 8px 22px rgba(20,20,20,.14);
  rotate:var(--tilt, -.6deg);
}
.nota-mao{font-family:'Shadows Into Light',cursive; color:var(--tinta); font-size:25px; line-height:1.35;}

/* ---------- BOTOES ---------- */
.cta{
  display:inline-block; background:var(--preto); color:var(--papel);
  font-family:'IBM Plex Mono',monospace; font-size:13.5px; font-weight:600;
  letter-spacing:.08em; padding:16px 26px; text-decoration:none; margin:6px 12px 0 0;
  border:none; cursor:pointer; transition:translate .18s ease-out;
}
.cta:hover{translate:0 -2px;}

/* ---------- CONTATO ---------- */
.contato-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:56px; align-items:start;}
.contato-direto{font-size:18px; line-height:2.5;}
.contato-direto a{text-decoration:none; border-bottom:2px solid var(--preto);}
.form-folha label{
  display:block; font-family:'IBM Plex Mono',monospace; font-size:10.5px;
  letter-spacing:.14em; color:var(--cinza-texto); margin:24px 0 2px;
}
.form-folha input, .form-folha select, .form-folha textarea{
  width:100%; border:none; border-bottom:1.5px solid var(--preto); background:transparent;
  font-family:'Shadows Into Light',cursive; font-size:23px; color:var(--tinta);
  padding:6px 2px; outline:none; border-radius:0;
}
.form-folha select{font-family:'Instrument Sans',sans-serif; font-size:16px; color:var(--preto); padding:10px 2px;}
.form-folha textarea{min-height:100px; resize:vertical; line-height:1.3;}
.form-folha :focus{border-bottom-width:3px;}

/* ---------- FICHA SOBREPOSTA ---------- */
.ficha-sobre{position:fixed; inset:0; z-index:200; display:none;}
.ficha-sobre.aberta{display:block;}
.ficha-sobre .fundo{
  position:absolute; inset:0; background:rgba(18,18,17,.62); opacity:0;
  transition:opacity .28s ease-out;
}
.ficha-sobre.no-ar .fundo{opacity:1;}
.ficha-sobre .painel{
  position:absolute; left:50%; bottom:0; translate:-50% 0;
  width:min(960px,96vw); max-height:92vh; overflow-y:auto;
  background:#FCFBF7; background-image:var(--grao); background-blend-mode:multiply;
  border:1px solid var(--borda2); border-bottom:none; border-radius:16px 16px 0 0;
  box-shadow:0 -20px 60px rgba(0,0,0,.5);
  padding:54px 6vw 64px;
  transform:translateY(103%);
  transition:transform .38s cubic-bezier(.16,1,.3,1);
}
.ficha-sobre.no-ar .painel{transform:translateY(0);}
.fechar-ficha{
  position:sticky; top:0; float:right; margin:-30px -10px 0 0;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600;
  letter-spacing:.14em; background:var(--preto); color:var(--papel);
  border:none; padding:10px 16px; cursor:pointer;
}
.ficha-colunas{display:grid; grid-template-columns:minmax(220px,300px) 1fr; gap:48px; align-items:start;}
.ficha-colunas .polaroid{--tilt:-1.6deg;}
.nome-ficha{
  font-family:'Shadows Into Light',cursive; color:var(--tinta);
  font-size:clamp(38px,5vw,56px); line-height:1; margin-bottom:22px; rotate:-1deg; display:inline-block;
}
.bio{font-family:'Tinos',Georgia,serif; font-size:18.5px; line-height:1.68; max-width:62ch; margin-bottom:32px;}
.handle{display:inline-block; margin-top:22px; font-size:15px; color:var(--cinza-texto); text-decoration:none;}
.handle:hover{color:var(--preto);}
@media (max-width:760px){
  .ficha-colunas{grid-template-columns:1fr;}
  .ficha-colunas .polaroid{max-width:250px;}
}

/* ---------- ENTRADAS DA GRADE ---------- */
@keyframes assenta{
  0%{opacity:0; translate:0 26px; rotate:calc(var(--tilt, -1deg) + 2deg);}
  70%{opacity:1; translate:0 -2px; rotate:calc(var(--tilt, -1deg) + 1deg);}
  100%{opacity:1; translate:0 0; rotate:var(--tilt, -1deg);}
}
.assentavel{opacity:0;}
.assentavel.no-ar{animation:assenta .32s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--atraso,0ms);}

/* ---------- RODAPE ---------- */
.rodape{
  color:#9A968D; padding:40px 6vw 46px; font-size:14px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:28px; flex-wrap:wrap;
}
.rodape img{width:180px; opacity:.85;}
.rodape .colunas{display:flex; gap:36px; flex-wrap:wrap; font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.08em;}
.rodape a{color:var(--papel); text-decoration:none;}
.rodape a:hover{border-bottom:2px solid var(--papel);}

/* ---------- RESPONSIVO ---------- */
@media (max-width:820px){
  .grade-polaroids{grid-template-columns:repeat(2,1fr); gap:38px 18px;}
  .aba-link{padding:8px 14px 6px; font-size:10px; letter-spacing:.1em;}
  .conteudo-pasta{padding:36px 6vw 80px;}
}

/* ---------- MOVIMENTO REDUZIDO ---------- */
@media (prefers-reduced-motion: reduce){
  .hero .linha{opacity:1;}
  .tampa,.conteudo-pasta,.fundo-pasta{animation:none;}
  html.folha-sai .tampa, html.folha-sai .conteudo-pasta, html.folha-sai .fundo-pasta{animation:none;}
  .assentavel{opacity:1;}
  .assentavel.no-ar{animation:none;}
  .ficha-sobre .painel, .ficha-sobre .fundo{transition:none;}
  .polaroid,.cta{transition:none;}
}
