/* ============================================================
   NYO · Carreiras — estilo das páginas de vaga
   Base: minimalismo Apple (referencia-visual/awesome-design-md/apple)
   Tema: 100% preto · acento único laranja NYO #E8402D
   ============================================================ */
:root{
  --accent:#E8402D;--accent-press:#c9351f;
  --bg:#000000;
  --ink:#f5f5f7;--muted:#a1a1a6;--muted-2:#6e6e73;
  --hairline:rgba(255,255,255,0.12);
  --sans:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Inter',system-ui,sans-serif;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.47;letter-spacing:-0.011em}

/* NAV */
.nav{position:sticky;top:0;z-index:50;height:48px;background:rgba(0,0,0,0.7);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--hairline)}
.logo{height:16px;width:auto;display:block}
.nav a.nav-right{color:var(--muted);font-size:12px;text-decoration:none}
.nav a.nav-right:hover{color:var(--ink)}

.wrap{max-width:760px;margin:0 auto;padding:0 24px}
section{padding:72px 0;border-top:1px solid var(--hairline)}

/* HERO */
.hero{padding:104px 0 80px;border-top:none}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:0.01em;color:var(--accent);margin-bottom:18px}
.hero h1{font-size:76px;font-weight:600;letter-spacing:-0.03em;line-height:1.03;margin-bottom:22px}
.hero .lead{font-size:24px;font-weight:400;line-height:1.33;letter-spacing:-0.012em;color:var(--ink);max-width:640px;margin-bottom:14px}
.hero .meta{font-size:17px;color:var(--muted);margin-bottom:38px}
.hero .meta span{margin:0 8px;color:var(--muted-2)}

/* BOTÃO (Apple pill, acento NYO) */
.btn-primary{display:inline-block;background:var(--accent);color:#fff;font-size:17px;font-weight:400;letter-spacing:-0.01em;padding:13px 26px;border-radius:9999px;text-decoration:none;transition:transform .12s ease,background .2s ease}
.btn-primary:active{transform:scale(0.96);background:var(--accent-press)}

/* BLOCOS */
.block h2{font-size:32px;font-weight:600;letter-spacing:-0.02em;line-height:1.15;margin-bottom:26px}
.block .intro{font-size:21px;font-weight:400;line-height:1.5;letter-spacing:-0.01em;color:var(--muted);max-width:640px}

.clean-list{list-style:none}
.clean-list li{font-size:19px;line-height:1.5;letter-spacing:-0.01em;color:var(--ink);padding:18px 0;border-top:1px solid var(--hairline)}
.clean-list li:first-child{border-top:none;padding-top:0}
.clean-list.muted li{color:var(--muted)}

/* SOBRE A NYO */
.about p{font-size:21px;font-weight:400;line-height:1.5;letter-spacing:-0.01em;color:var(--muted);max-width:660px}
.about .k{font-size:13px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--muted-2);margin-bottom:18px}

/* CTA FINAL */
.cta-final{text-align:center;padding:96px 0}
.cta-final h2{font-size:40px;font-weight:600;letter-spacing:-0.022em;margin-bottom:30px}

/* FOOTER */
footer{padding:40px 0;border-top:1px solid var(--hairline)}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
footer .fmeta{font-size:12px;color:var(--muted-2)}

/* HUB (index raiz) */
.hub-hero{padding:120px 0 56px}
.hub-hero h1{font-size:64px;font-weight:600;letter-spacing:-0.03em;line-height:1.05;margin-bottom:22px}
.hub-hero p{font-size:22px;font-weight:400;line-height:1.45;letter-spacing:-0.012em;color:var(--muted);max-width:620px}
.jobs{list-style:none;padding-bottom:96px}
.jobs a{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:28px 0;border-top:1px solid var(--hairline);text-decoration:none;color:var(--ink);transition:padding-left .2s ease}
.jobs a:hover{padding-left:8px}
.jobs a .j-title{font-size:28px;font-weight:600;letter-spacing:-0.02em}
.jobs a .j-area{font-size:15px;color:var(--muted)}
.jobs a .j-arrow{color:var(--accent);font-size:20px;margin-left:auto}

@media (max-width:640px){
  .hero{padding:72px 0 52px}.hero h1{font-size:50px}.hero .lead{font-size:21px}
  section{padding:52px 0}.block h2{font-size:27px}.cta-final h2{font-size:30px}
  .hub-hero{padding:80px 0 40px}.hub-hero h1{font-size:42px}
  .jobs a .j-title{font-size:22px}
}