/* ============================================================
   Empresário Ciborgue · Rafael Guzzo — brand.css
   Sistema de design reutilizável (variáveis + base + componentes)
   ============================================================ */

:root{
  /* Cores conceito */
  --cor-tinta:#141413;
  --cor-papel:#FAF9F5;
  --cor-humano:#E8602C;   /* clay — a pessoa, o comando */
  --cor-maquina:#3173B8;  /* azul — a IA, a execução */
  /* Aliases */
  --cor-primaria:#E8602C;
  --cor-secundaria:#3173B8;
  /* Neutros / texto */
  --cor-texto-suave:#6B675E;
  --cor-linha:#E6E1D5;
  --cor-papel-2:#F2EFE7;            /* superfície clara alternativa */
  --cor-texto-claro:rgba(250,249,245,.92);
  --cor-texto-claro-suave:rgba(250,249,245,.62);
  --cor-linha-escura:rgba(250,249,245,.14);
  /* Tipografia */
  --fonte-titulo:'Poppins',system-ui,-apple-system,sans-serif;
  --fonte-corpo:'Poppins',system-ui,-apple-system,sans-serif;
  --fonte-mono:'Space Mono','IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;
  /* Forma */
  --raio:14px; --raio-sm:8px; --raio-pill:999px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--fonte-corpo);
  font-weight:300;
  color:var(--cor-tinta);
  background:var(--cor-papel);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%}
a{color:inherit}

/* Tipografia */
h1,h2,h3,h4{font-family:var(--fonte-titulo);font-weight:700;line-height:1.12;margin:0 0 .4em}
h1{font-size:clamp(2.4rem,6vw,3.6rem);letter-spacing:-.5px}
h2{font-size:clamp(1.6rem,4vw,2.5rem);letter-spacing:-.3px}
h3{font-size:1.2rem}
p{margin:0 0 1rem}
.lead{font-size:clamp(1.05rem,2.4vw,1.3rem);color:var(--cor-texto-suave)}
.secao-escura .lead{color:var(--cor-texto-claro-suave)}

.eyebrow{
  font-family:var(--fonte-mono);text-transform:uppercase;
  letter-spacing:.2em;font-size:.78rem;color:var(--cor-texto-suave);
  display:inline-block;margin-bottom:1rem;font-weight:400;
}
.secao-escura .eyebrow{color:var(--cor-texto-claro-suave)}
.tag-mono{font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.12em;font-size:.95rem}
.tag-mono .h{color:var(--cor-humano)}
.tag-mono .m{color:var(--cor-maquina)}

/* Layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
.secao{padding:72px 0}
.secao-escura{background:var(--cor-tinta);color:var(--cor-texto-claro)}
.secao-clara-2{background:var(--cor-papel-2)}
.center{text-align:center}
.grid{display:grid;gap:22px}
@media(min-width:760px){
  .secao{padding:104px 0}
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
}

/* Botões */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.1em;
  font-size:.82rem;font-weight:400;cursor:pointer;
  background:var(--cor-humano);color:#fff;
  padding:15px 28px;border-radius:var(--raio-sm);border:1.5px solid var(--cor-humano);
  text-decoration:none;transition:transform .15s ease,opacity .15s ease;
}
.btn:hover{transform:translateY(-1px);opacity:.94}
.btn--ghost{background:transparent;color:var(--cor-tinta);border-color:var(--cor-linha)}
.secao-escura .btn--ghost{color:var(--cor-texto-claro);border-color:var(--cor-linha-escura)}
.btn--azul{background:var(--cor-maquina);border-color:var(--cor-maquina)}

/* Cards */
.card{
  background:#fff;border:1px solid var(--cor-linha);
  border-radius:var(--raio);padding:28px;
}
.secao-escura .card{background:rgba(250,249,245,.04);border-color:var(--cor-linha-escura)}
.card--clay{border-top:3px solid var(--cor-humano)}
.card--azul{border-top:3px solid var(--cor-maquina)}
.card h3{margin-top:0}

/* Logo lockup */
.ec-lockup{display:flex;align-items:center;gap:13px}
.ec-lockup svg{width:42px;height:42px;flex:none}
.ec-wm{display:flex;flex-direction:column;line-height:1;font-family:var(--fonte-titulo)}
.ec-wm b{font-weight:300;letter-spacing:.18em;font-size:.72rem}
.ec-wm strong{font-weight:700;letter-spacing:.03em;font-size:1.02rem}

/* Navbar */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,249,245,.86);
  backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--cor-linha)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav a.link{font-family:var(--fonte-mono);text-transform:uppercase;letter-spacing:.12em;
  font-size:.72rem;text-decoration:none;color:var(--cor-texto-suave);margin-left:20px}
.nav a.link:hover{color:var(--cor-tinta)}
.nav-links{display:none}
@media(min-width:760px){.nav-links{display:flex;align-items:center}}

/* Hero */
.hero{padding:84px 0 64px}
.hero h1{max-width:20ch}
.hero .center h1{max-width:24ch;margin-left:auto;margin-right:auto}
.hero .lead{max-width:48ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

/* Listas pra-quem / inclui */
.lista{list-style:none;padding:0;margin:0}
.lista li{position:relative;padding:10px 0 10px 30px;border-bottom:1px solid var(--cor-linha)}
.secao-escura .lista li{border-color:var(--cor-linha-escura)}
.lista li::before{position:absolute;left:0;top:9px;font-family:var(--fonte-mono);font-size:1rem}
.lista--sim li::before{content:'+';color:var(--cor-maquina)}
.lista--nao li::before{content:'×';color:var(--cor-humano)}
.lista--num{counter-reset:s}
.lista--num li{counter-increment:s;padding-left:44px}
.lista--num li::before{content:counter(s,decimal-leading-zero);color:var(--cor-humano);font-size:.85rem;top:12px}

/* Preço */
.preco{font-family:var(--fonte-titulo);font-weight:700;font-size:clamp(2.4rem,7vw,3.4rem)}
.preco small{display:block;font-family:var(--fonte-mono);font-size:.8rem;font-weight:400;
  letter-spacing:.12em;color:var(--cor-texto-suave);text-transform:uppercase}

/* FAQ */
.faq details{border-bottom:1px solid var(--cor-linha);padding:14px 0}
.secao-escura .faq details{border-color:var(--cor-linha-escura)}
.faq summary{cursor:pointer;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:var(--fonte-mono);color:var(--cor-humano)}
.faq details[open] summary::after{content:'–'}
.faq p{margin:12px 0 4px;color:var(--cor-texto-suave)}
.secao-escura .faq p{color:var(--cor-texto-claro-suave)}

/* Footer */
.footer{background:var(--cor-tinta);color:var(--cor-texto-claro-suave);padding:54px 0}
.footer a{color:var(--cor-texto-claro);text-decoration:none}
.footer .ec-wm{color:var(--cor-texto-claro)}

/* Util */
.divisor{height:1px;background:var(--cor-linha);margin:0}
.pill{display:inline-block;font-family:var(--fonte-mono);font-size:.7rem;text-transform:uppercase;
  letter-spacing:.14em;padding:6px 12px;border-radius:var(--raio-pill);border:1px solid var(--cor-linha);color:var(--cor-texto-suave)}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

/* --- nav mobile + hero + cards --- */
.nav-right{display:flex;align-items:center;gap:10px}
.nav-cta{padding:9px 16px}
@media(max-width:759px){.nav-cta{padding:8px 14px;font-size:.7rem;letter-spacing:.06em}}
.card{display:flex;flex-direction:column}
.card .btn{margin-top:auto;align-self:flex-start}

/* --- Rafael Guzzo lockup (marca do site / nav / footer) --- */
.rg-lockup{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--cor-tinta)}
.rg-lockup svg{flex:none}
.rg-wm{font-family:var(--fonte-titulo);font-weight:300;letter-spacing:.22em;font-size:.86rem;white-space:nowrap}
.footer .rg-lockup{color:var(--cor-texto-claro)}
/* --- Empresário Ciborgue lockup (produto / destaque) --- */
.ec-hero{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.ec-hero .ec-emp{font-family:var(--fonte-titulo);font-weight:300;letter-spacing:.2em;line-height:1;color:var(--cor-tinta)}
.ec-hero .ec-cib{font-family:var(--fonte-titulo);font-weight:700;letter-spacing:.02em;line-height:1.02;color:var(--cor-tinta)}
.ec-hero .ec-dash{display:flex;gap:6px;justify-content:center;margin-top:8px}
.ec-hero .ec-dash i{height:6px;border-radius:3px;display:block}
.secao-escura .ec-hero .ec-emp,.secao-escura .ec-hero .ec-cib{color:var(--cor-texto-claro)}

/* --- QA rodada 2: nav-cta, preço em card, eyebrow centralizada --- */
.nav-cta{white-space:nowrap}
.card .preco{font-size:1.9rem}
.eyebrow.center{display:block;text-align:center}

/* --- Destaques de texto (headline e corpo) --- */
.hl{color:var(--cor-humano)}
strong{font-weight:600}
.destaque-frase{font-family:var(--fonte-titulo);font-weight:500;font-size:clamp(1.2rem,2.8vw,1.6rem);line-height:1.3;color:var(--cor-tinta);margin:1.4rem 0}
.secao-escura .destaque-frase{color:var(--cor-texto-claro)}
/* --- Vagas em destaque grande (mentoria) --- */
.vagas-big{list-style:none;padding:0;margin:8px 0 24px}
.vagas-big li{font-family:var(--fonte-titulo);font-weight:700;font-size:clamp(1.7rem,5.4vw,3.1rem);line-height:1.12;padding:14px 0;border-bottom:1px solid var(--cor-linha-escura)}
.vagas-big li:last-child{border-bottom:0}
/* --- Hero 2 colunas (raio-x) --- */
.hero-2col{display:flex;flex-direction:column;gap:34px;align-items:center}
.hero-2col .col-txt{width:100%}
@media(min-width:820px){.hero-2col{flex-direction:row}.hero-2col .col-txt{flex:1.1}.hero-2col .col-viz{flex:.9;display:flex;justify-content:center}}
/* --- Radar / raio-x (svg) --- */
.radar{width:min(300px,78vw);height:auto}
.radar-sweep{transform-origin:100px 100px;animation:radarspin 4.5s linear infinite}
@keyframes radarspin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* --- Botão flutuante de WhatsApp (padrão BR) --- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:200;width:60px;height:60px;
  border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.25);transition:transform .18s ease,box-shadow .18s ease}
.wa-float:hover{transform:scale(1.06);box-shadow:0 8px 26px rgba(0,0,0,.32)}
.wa-float svg{width:34px;height:34px;display:block}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;
  animation:wapulse 2.6s ease-out infinite;pointer-events:none}
@keyframes wapulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.45)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@media(max-width:759px){.wa-float{width:54px;height:54px;right:16px;bottom:16px}.wa-float svg{width:30px;height:30px}}