:root{
  --fundo:#1a1815; --carvao:#221f1c; --carvao-2:#2e2a26; --creme:#faf4ec; --creme-2:#f1e7da;
  --terra:#c65d32; --terra-esc:#9c4423; --terra-claro:#e8875a;
  --muted:#a99f93; --deep:#12100e; --verde:#6fa06b;
  --line:rgba(250,244,236,.13); --exp:cubic-bezier(.16,1,.3,1); --r:14px;
}
@font-face{font-family:Anton;src:url(fonts/anton-400.woff2) format('woff2');font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-700.woff2) format('woff2');font-weight:700;font-display:swap}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--fundo);color:var(--creme);font:400 1rem/1.6 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,.display{font-family:Anton,Inter,sans-serif;text-transform:uppercase;line-height:1.04;letter-spacing:.012em;font-weight:400}
.hl{color:var(--terra-claro);font-style:normal}
.mono-label,.eyebrow{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.14em;color:var(--terra-claro)}
.wrap{max-width:560px;margin:0 auto;padding:0 20px}
section.wrap{padding:40px 20px 8px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0}
input{font:inherit;color:inherit}
::selection{background:var(--terra);color:var(--creme)}
:focus-visible{outline:2px solid var(--terra-claro);outline-offset:2px;border-radius:6px}
/* fundo: grid sutil + glow terracota + grain (fallback-herói do E3) */
.grid-bg{position:fixed;inset:0;z-index:-1;background:
  radial-gradient(90% 58% at 72% -6%,rgba(198,93,50,.17),transparent 62%),
  radial-gradient(55% 38% at 0% 104%,rgba(198,93,50,.06),transparent 70%),
  repeating-linear-gradient(0deg,transparent 0 23px,rgba(250,244,236,.033) 23px 24px),
  repeating-linear-gradient(90deg,transparent 0 23px,rgba(250,244,236,.033) 23px 24px),
  var(--fundo)}
.grid-bg::after{content:"";position:absolute;inset:0;mix-blend-mode:soft-light;opacity:.55;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.3'/%3E%3C/svg%3E")}
/* ---------- hero ---------- */
header.hero{position:relative;padding:58px 20px 4px}
.hero-top{display:flex;align-items:center;justify-content:space-between}
.id-chip{display:flex;align-items:center;gap:14px}
.avatar{width:46px;height:46px;object-fit:cover;border-radius:12px;border:1px solid var(--line);outline:1px solid rgba(198,93,50,.4);outline-offset:3px}
.avatar--sm{width:40px;height:40px;border-radius:10px}
.hero-top .mono-label{color:var(--creme);font-size:.8rem;letter-spacing:.12em}
.hero-cross{font-family:"JetBrains Mono",monospace;font-size:.8rem;color:rgba(250,244,236,.35)}
header.hero h1{margin-top:24px;font-size:clamp(2.35rem,8.8vw,3.4rem);text-wrap:balance}
.hero-rule{display:flex;align-items:center;gap:12px;margin-top:26px}
.hero-rule::before{content:"+";font-family:"JetBrains Mono",monospace;font-size:.8rem;color:rgba(250,244,236,.35)}
.rule-line{flex:1;height:1px;background:linear-gradient(90deg,var(--line),rgba(250,244,236,.04))}
/* ---------- eyebrows de seção ---------- */
.wrap>.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.wrap>.eyebrow::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
/* ---------- cards ---------- */
.card{background:var(--carvao-2);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.card--live{position:relative;border:none;padding:21px;background:var(--carvao-2)}
.card--live::before{content:"";position:absolute;inset:0;border-radius:var(--r);padding:1px;pointer-events:none;
  background:conic-gradient(from var(--ang,0deg),var(--terra),var(--creme-2) 22%,var(--terra) 48%,rgba(198,93,50,.4) 74%,var(--terra));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:spin 7s linear infinite}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes spin{to{--ang:360deg}}
a.card{display:block;position:relative;padding:16px 46px 16px 16px;transition:border-color .3s var(--exp)}
a.card::after{content:"→";position:absolute;right:16px;top:50%;translate:0 -50%;font-family:"JetBrains Mono",monospace;font-size:.85rem;color:var(--terra-claro)}
a.card h3{font-size:1.3rem;letter-spacing:.02em;line-height:1.12}
a.card p{color:var(--muted);font-size:.88rem;line-height:1.55;margin-top:5px}
#links .card,#aprender .card{margin-top:10px}
.media{overflow:hidden;border-radius:calc(var(--r) - 7px)}
.media img{width:100%;aspect-ratio:16/10;object-fit:cover}
/* ---------- contorno cursor-reativo (GlowingEffect adaptado à IDV; span injetado pelo quiz.js só em pointer fine) ---------- */
.glow{position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;opacity:var(--active,0);transition:opacity .35s var(--exp);
  background:conic-gradient(from calc(var(--start,0)*1deg),transparent 0deg 70deg,rgba(198,93,50,.9) 100deg,rgba(250,244,236,.95) 115deg,rgba(232,135,90,.9) 130deg,transparent 160deg 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
/* ---------- quiz: a janela de terminal da página ---------- */
.quiz-card{counter-reset:opt;background:var(--deep);padding:56px 16px 18px}
.quiz-card::after{content:"Diagnóstico";position:absolute;top:1px;left:1px;right:1px;height:38px;display:flex;align-items:center;padding:0 17px;
  font-family:"JetBrains Mono",monospace;font-size:.64rem;letter-spacing:.14em;color:var(--muted);
  border-bottom:1px solid var(--line);border-radius:13px 13px 0 0;background:rgba(250,244,236,.02)}
.quiz-card .eyebrow{color:var(--creme-2);font-size:.74rem;letter-spacing:.1em;line-height:1.7;margin:0 2px 12px;animation:rise .4s var(--exp) backwards}
.quiz-card .eyebrow::before{content:"> ";color:var(--terra-claro)}
.quiz-card .pergunta{font-size:1.32rem;line-height:1.12;margin:2px 2px 14px;animation:rise .4s var(--exp) backwards}
.quiz-card .pergunta::before{content:"> ";font-family:"JetBrains Mono",monospace;font-size:.72em;color:var(--terra-claro);vertical-align:.1em}
.qopt{counter-increment:opt;display:flex;align-items:baseline;gap:12px;width:100%;text-align:left;
  background:rgba(250,244,236,.028);border:1px solid var(--line);border-radius:10px;padding:13px 14px;margin-top:8px;
  color:var(--creme);font:400 .94rem/1.45 Inter,system-ui,sans-serif;cursor:pointer;
  transition:border-color .3s var(--exp),background .3s var(--exp),color .3s var(--exp),scale .2s var(--exp);animation:rise .5s var(--exp) backwards}
.qopt::before{content:"0" counter(opt);font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.06em;color:var(--terra-claro);opacity:.85;transition:color .3s var(--exp),opacity .3s var(--exp)}
.qopt::after{content:"→";margin-left:auto;align-self:center;font-family:"JetBrains Mono",monospace;font-size:.8rem;color:var(--terra-claro);opacity:0;translate:-4px 0;transition:opacity .3s var(--exp),translate .3s var(--exp)}
.qopt:nth-of-type(1){animation-delay:.05s}.qopt:nth-of-type(2){animation-delay:.12s}
.qopt:nth-of-type(3){animation-delay:.19s}.qopt:nth-of-type(4){animation-delay:.26s}
.qopt:active{scale:.98;border-color:rgba(198,93,50,.6);background:rgba(198,93,50,.07)}
@keyframes rise{from{opacity:0;translate:0 10px}}
.quiz-card h2{font-size:1.45rem;margin:2px 2px 10px;animation:rise .45s var(--exp) backwards}
.quiz-card p:not(.eyebrow){color:var(--creme-2);font-size:.95rem;line-height:1.65;animation:rise .5s .06s var(--exp) backwards}
.quiz-card .cta{animation:rise .5s .1s var(--exp) backwards}
.quiz-card a.card{margin-top:10px;background:rgba(250,244,236,.028);font-weight:600;font-size:.95rem;animation:rise .5s .12s var(--exp) backwards}
.quiz-card button.mono-label{margin-top:16px;padding:4px 2px;color:var(--muted);cursor:pointer;font-size:.66rem;letter-spacing:.14em;transition:color .3s var(--exp)}
.quiz-card button.mono-label::before{content:"← "}
.quiz-card button.skip::before{content:"→ "}
/* ---------- quiz: espelho, saudação e parecer do diagnóstico ---------- */
.saud{font-weight:600;color:var(--creme);margin:0 2px 10px}
.espelho{border:1px solid var(--line);border-radius:10px;background:rgba(250,244,236,.02);padding:12px 14px;margin:0 0 14px;animation:rise .45s .04s var(--exp) backwards}
.espelho .espelho-t{font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.12em;color:var(--muted);margin:0 0 7px}
.espelho ul{list-style:none}
.espelho li{font-family:"JetBrains Mono",monospace;font-size:.76rem;letter-spacing:.02em;line-height:1.8;color:var(--creme-2);padding-left:1.05rem;text-indent:-1.05rem}
.espelho li::before{content:"▸ ";color:var(--terra-claro)}
.parecer{border-left:2px solid var(--terra);padding-left:12px;margin:12px 2px 14px;color:var(--creme)}
.quiz-card p.parecer{color:var(--creme)}
/* ---------- quiz: form de captura ---------- */
.lead-form{display:grid;gap:8px;margin-top:14px}
.lead-input{background:rgba(250,244,236,.028);border:1px solid var(--line);border-radius:10px;padding:13px 14px;color:var(--creme);transition:border-color .3s var(--exp)}
.lead-input::placeholder{color:var(--muted)}
.lead-input:focus{outline:none;border-color:rgba(232,135,90,.65)}
.lead-input.invalido{border-color:var(--terra)}
.lead-erro{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.06em;color:var(--terra-claro)}
.lead-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.lead-form .cta{margin-top:6px}
.quiz-nav{display:flex;justify-content:space-between;align-items:center;gap:12px}
.consent{font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.05em;line-height:1.7;color:var(--muted)}
.quiz-card p.consent{color:var(--muted);font-size:.6rem;line-height:1.7}
/* ---------- CTA (terracota sólido — o acento da página) ---------- */
.cta{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--terra);color:var(--creme);
  font:600 .95rem/1.2 Inter,system-ui,sans-serif;padding:15px 20px;border-radius:10px;margin-top:16px;
  transition:background .3s var(--exp),scale .2s var(--exp)}
.cta::after{content:"→";font-family:"JetBrains Mono",monospace;font-size:.9rem;font-weight:400}
.cta:active{scale:.98;background:var(--terra-esc)}
/* ---------- serviços ---------- */
.svc{margin-top:14px;padding:12px 12px 16px;cursor:pointer;scroll-margin-top:24px}
.svc.card--live::before{animation:none;background:linear-gradient(155deg,rgba(232,135,90,.55),var(--line) 30%,var(--line) 78%,rgba(232,135,90,.25))}
.svc h2{font-size:1.3rem;margin:15px 6px 7px;padding-right:34px;position:relative}
.svc h2::after{content:"+";position:absolute;right:4px;top:50%;translate:0 -50%;font:400 1.05rem/1 "JetBrains Mono",monospace;color:var(--terra-claro);transition:rotate .35s var(--exp)}
.svc.open h2::after{rotate:45deg}
.svc>p{margin:0 6px;color:var(--muted);font-size:.93rem;line-height:1.55}
.acc-body p{margin:14px 6px 0;padding-top:14px;border-top:1px solid var(--line);color:var(--creme-2);font-size:.95rem;line-height:1.65}
.acc-body .cta{margin:16px 6px 4px}
/* ---------- portfólio ---------- */
.portfolio-grid{display:grid;gap:12px}
.case{position:relative;padding:12px;display:flex;flex-direction:column;gap:10px}
.case-link{display:flex;flex-direction:column;gap:10px}
.case h3{font-size:1.3rem;letter-spacing:.02em;line-height:1.12;margin:0 6px}
.case .badge-demo{align-self:flex-start;margin:0 6px 4px}
.case:not(:has(img)){justify-content:center;gap:9px;padding:22px 18px;min-height:150px;
  background:var(--carvao-2) repeating-linear-gradient(0deg,transparent 0 10px,rgba(250,244,236,.025) 10px 11px)}
.case:not(:has(img)) h3{margin:0}
.case:not(:has(img))::before{content:"> você está aqui";font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.12em;color:var(--terra-claro)}
.case:not(:has(img))::after{content:"● no_ar";font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.1em;color:var(--verde)}
/* ---------- voz de sistema ---------- */
.blink::after{content:"▮";color:var(--terra-claro);animation:bl 1.1s steps(1) infinite;margin-left:2px}
@keyframes bl{50%{opacity:0}}
.badge-demo{font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.1em;border:1px solid var(--line);border-radius:99px;padding:3px 9px;color:var(--muted)}
/* ---------- footer ---------- */
footer.wrap{padding:36px 20px 64px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
footer.wrap::before{content:"+";font-family:"JetBrains Mono",monospace;font-size:.8rem;color:rgba(250,244,236,.3);margin-bottom:12px}
footer.wrap .avatar--sm{margin-bottom:8px}
footer.wrap p.mono-label{color:var(--creme)}
footer.wrap a.mono-label{color:var(--muted);letter-spacing:.08em;transition:color .3s var(--exp)}
/* ---------- motion ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s var(--exp),transform .55s var(--exp)}
.reveal.is-in{opacity:1;transform:none}
.accordion>.acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--exp)}
.accordion.open>.acc-body{grid-template-rows:1fr}
.acc-body>div{overflow:hidden}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}}
/* ---------- desktop (enriquecimento; mobile é a via principal) ---------- */
@media (hover:hover) and (pointer:fine){
  .qopt:hover{border-color:rgba(232,135,90,.75);background:rgba(198,93,50,.12);color:var(--creme)}
  .qopt:hover::before{color:var(--creme);opacity:1}
  .qopt:hover::after{opacity:1;translate:0}
  .svc .media img,.case .media img{transition:scale .7s var(--exp)}
  .svc:hover .media img,.case:hover .media img{scale:1.045}
  a.card:hover{border-color:rgba(198,93,50,.45)}
  .cta:hover{background:var(--terra-esc)}
  .quiz-card button.mono-label:hover{color:var(--creme)}
  footer.wrap a.mono-label:hover{color:var(--terra-claro)}
  .glow-on .card--live::before{animation:none;background:linear-gradient(155deg,rgba(232,135,90,.5),var(--line) 30%,var(--line) 78%,rgba(232,135,90,.22))}
}
@media (min-width:900px){
  .wrap{max-width:640px}
  header.hero{padding-top:84px}
  .portfolio-grid{grid-template-columns:1fr 1fr;gap:14px}
  .portfolio-grid>.case-anchor{grid-column:span 2}
}