/* ============================================================
   LAPA — Briefing (formulário de captação)
   Space Grotesk + Space Mono · tinta/papel · verde · areia
   ============================================================ */
:root {
  --ink: #0a0a0a; --paper: #f4f4f5; --paper-2: #ebebed;
  --gray-1: #8a8a8f; --gray-2: #5a5a5f;
  --line: rgba(10,10,10,0.14); --line-2: rgba(10,10,10,0.08);
  --green: #1fd65f; --err: #e0473a;
  --display: "Space Grotesk","Helvetica Neue",Arial,sans-serif;
  --mono: "Space Mono",ui-monospace,Menlo,monospace;
}
* { margin:0; padding:0; box-sizing:border-box; }
html, body { background:var(--paper); }
body { font-family:var(--display); color:var(--ink); -webkit-font-smoothing:antialiased; min-height:100vh; }
::selection { background:var(--green); color:var(--ink); }
button { font-family:inherit; }

/* areia no fundo (bem sutil, em cima do papel) */
.bf-sand { position:fixed; inset:0; width:100vw; height:100vh; z-index:0; opacity:0.10; pointer-events:none; filter:invert(1); }

/* topo */
.bf-top { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px clamp(20px,5vw,56px); }
.bf-logo { height:24px; width:auto; display:block; }
.bf-progress { display:flex; align-items:center; gap:14px; flex:1; max-width:340px; transition:opacity .4s; }
.bf-progress-label { font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--gray-1); white-space:nowrap; }
.bf-progress-track { flex:1; height:3px; background:var(--line-2); border-radius:100px; overflow:hidden; }
.bf-progress-fill { height:100%; width:0; background:var(--ink); border-radius:100px; transition:width .5s cubic-bezier(0.16,1,0.3,1); }

/* área central */
.bf-wrap { position:relative; z-index:2; max-width:760px; margin:0 auto; padding:clamp(20px,4vw,50px) clamp(20px,5vw,56px) 120px; min-height:calc(100vh - 70px); display:flex; flex-direction:column; }
.bf-stage { flex:1; }

/* animação de entrada */
[data-anim] { animation:bfRise .5s cubic-bezier(0.16,1,0.3,1) both; }
@keyframes bfRise { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { [data-anim] { animation:none; } }

/* tipografia comum */
.bf-eyebrow { font-family:var(--mono); font-size:13px; letter-spacing:0.18em; text-transform:uppercase; color:var(--gray-1); margin-bottom:18px; }
.bf-eyebrow.green { color:var(--green); display:inline-flex; align-items:center; gap:10px; }
.bf-eyebrow.green::before { content:""; width:9px; height:9px; border-radius:50%; background:var(--green); box-shadow:0 0 10px var(--green); }
.bf-title { font-size:clamp(38px,6vw,66px); line-height:1.02; font-weight:600; letter-spacing:-0.035em; text-wrap:balance; }
.bf-title.sm { font-size:clamp(34px,5vw,54px); }
.bf-title .ac { color:var(--green); }
.bf-sub { font-size:clamp(16px,2vw,19px); line-height:1.5; color:var(--gray-2); max-width:46ch; margin-top:6px; }

/* ---------- INTRO ---------- */
.bf-intro { padding-top:clamp(20px,7vh,90px); max-width:620px; }
.bf-lede { font-size:19px; line-height:1.55; color:var(--gray-2); margin:26px 0 36px; max-width:50ch; }
.bf-intro-meta { display:flex; flex-direction:column; gap:14px; margin-bottom:44px; }
.bf-intro-meta div { display:flex; align-items:center; gap:16px; font-size:17px; color:var(--ink); }
.bf-intro-meta .n { font-family:var(--mono); font-size:13px; color:var(--green); border:1px solid var(--line); border-radius:50%; width:36px; height:36px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }

/* ---------- passos ---------- */
.bf-step-head { margin-bottom:34px; }
.bf-step .bf-eyebrow { font-size:clamp(26px,3.4vw,38px); font-family:var(--display); font-weight:600; letter-spacing:-0.02em; text-transform:none; color:var(--ink); margin-bottom:8px; }
.bf-fields { display:flex; flex-direction:column; gap:28px; }
.bf-field { display:flex; flex-direction:column; gap:10px; }
.bf-label { font-size:17px; font-weight:500; letter-spacing:-0.01em; }
.bf-label .req { color:var(--green); }
.bf-hint { font-size:13.5px; color:var(--gray-1); margin-top:-4px; }

/* inputs */
.bf-input { width:100%; font-family:var(--display); font-size:17px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:12px; padding:15px 17px; transition:border-color .15s, box-shadow .15s; }
.bf-input::placeholder { color:#b4b4b9; }
.bf-input:focus { outline:none; border-color:var(--ink); box-shadow:0 0 0 3px rgba(10,10,10,0.06); }
.bf-textarea { resize:vertical; min-height:110px; line-height:1.5; }
.bf-select-wrap { position:relative; }
.bf-select-wrap::after { content:"▾"; position:absolute; right:18px; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--gray-1); }
.bf-select { appearance:none; cursor:pointer; padding-right:42px; }
.bf-field.err .bf-input { border-color:var(--err); box-shadow:0 0 0 3px rgba(224,71,58,0.12); }

/* multi chips */
.bf-chips { display:flex; flex-wrap:wrap; gap:10px; }
.bf-chip { font-size:15px; color:var(--gray-2); background:#fff; border:1px solid var(--line); border-radius:100px; padding:11px 18px; cursor:pointer; transition:all .15s; }
.bf-chip:hover { border-color:var(--ink); color:var(--ink); }
.bf-chip.on { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.bf-field.err .bf-chips { outline:2px solid rgba(224,71,58,0.3); outline-offset:6px; border-radius:8px; }

/* serviços (cards) */
.bf-services { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
@media (max-width:560px){ .bf-services { grid-template-columns:1fr; } }
.bf-svc { display:flex; align-items:center; gap:16px; text-align:left; background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 18px; cursor:pointer; transition:all .15s; position:relative; }
.bf-svc:hover { border-color:var(--ink); transform:translateY(-1px); }
.bf-svc.on { border-color:var(--ink); box-shadow:inset 0 0 0 1px var(--ink); }
.bf-svc-ic { font-size:24px; width:46px; height:46px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; background:var(--paper-2); border-radius:11px; font-family:var(--mono); }
.bf-svc.on .bf-svc-ic { background:var(--green); }
.bf-svc-tx { display:flex; flex-direction:column; gap:3px; flex:1; min-width:0; }
.bf-svc-name { font-size:16.5px; font-weight:600; letter-spacing:-0.01em; }
.bf-svc-desc { font-size:13px; color:var(--gray-1); }
.bf-svc-check { width:24px; height:24px; flex:0 0 auto; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; color:transparent; transition:all .15s; }
.bf-svc.on .bf-svc-check { background:var(--ink); border-color:var(--ink); color:var(--paper); }
.bf-field.err .bf-services { outline:2px solid rgba(224,71,58,0.3); outline-offset:8px; border-radius:12px; }

/* escalas */
.bf-scales { display:flex; flex-direction:column; gap:26px; }
.bf-scale-top { display:flex; justify-content:space-between; font-size:14px; color:var(--gray-2); margin-bottom:10px; font-weight:500; }
.bf-range { -webkit-appearance:none; appearance:none; width:100%; height:3px; background:var(--line); border-radius:100px; outline:none; }
.bf-range::-webkit-slider-thumb { -webkit-appearance:none; width:26px; height:26px; border-radius:50%; background:var(--ink); cursor:pointer; border:3px solid var(--paper); box-shadow:0 2px 8px rgba(0,0,0,0.2); transition:background .15s; }
.bf-range::-webkit-slider-thumb:hover { background:var(--green); }
.bf-range::-moz-range-thumb { width:22px; height:22px; border-radius:50%; background:var(--ink); cursor:pointer; border:3px solid var(--paper); }

/* tags */
.bf-tags { display:flex; flex-wrap:wrap; gap:9px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:12px; padding:11px 13px; }
.bf-tags:focus-within { border-color:var(--ink); box-shadow:0 0 0 3px rgba(10,10,10,0.06); }
.bf-tag { display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:var(--paper); border-radius:100px; padding:7px 8px 7px 14px; font-size:14px; }
.bf-tag button { background:none; border:0; color:var(--paper); opacity:0.6; cursor:pointer; font-size:12px; padding:0 2px; }
.bf-tag button:hover { opacity:1; }
.bf-tag-input { flex:1; min-width:120px; border:0; outline:none; font-family:var(--display); font-size:16px; padding:7px 4px; background:transparent; }

/* botões */
.bf-btn { display:inline-flex; align-items:center; gap:11px; font-size:16px; font-weight:600; letter-spacing:-0.01em; background:var(--ink); color:var(--paper); border:1px solid var(--ink); border-radius:100px; padding:15px 28px; cursor:pointer; transition:all .18s; }
.bf-btn:hover { background:#000; transform:translateY(-1px); }
.bf-btn .ar { transition:transform .2s; }
.bf-btn:hover .ar { transform:translateX(3px); }
.bf-btn.ghost { background:transparent; color:var(--ink); border-color:var(--line); }
.bf-btn.ghost:hover { border-color:var(--ink); background:transparent; }
.bf-btn-lg { font-size:18px; padding:18px 34px; }
.bf-link { background:none; border:0; color:var(--gray-1); font-size:14px; cursor:pointer; text-decoration:underline; text-underline-offset:3px; font-family:var(--display); padding:6px; }
.bf-link:hover { color:var(--ink); }

/* nav inferior */
.bf-nav { position:sticky; bottom:0; z-index:3; display:flex; justify-content:space-between; gap:14px; padding:18px 0 6px; margin-top:40px; background:linear-gradient(to top, var(--paper) 60%, transparent); }
.bf-nav:empty { display:none; }

/* revisão */
.bf-review { display:flex; flex-direction:column; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; }
.bf-rev-row { display:grid; grid-template-columns:200px 1fr; gap:20px; padding:16px 20px; border-bottom:1px solid var(--line-2); }
.bf-rev-row:last-child { border-bottom:none; }
@media (max-width:560px){ .bf-rev-row { grid-template-columns:1fr; gap:5px; } }
.bf-rev-k { font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--gray-1); padding-top:2px; }
.bf-rev-v { font-size:15.5px; line-height:1.45; color:var(--ink); white-space:pre-wrap; word-break:break-word; }
.bf-send { margin-top:30px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.bf-send-alt { display:flex; align-items:center; gap:10px; }
.bf-send-alt .dot { color:var(--gray-1); }

/* tela final */
.bf-done { padding-top:clamp(30px,9vh,110px); max-width:560px; }
.bf-done-mark { width:64px; height:64px; border-radius:50%; background:var(--green); color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:32px; margin-bottom:28px; box-shadow:0 0 0 8px rgba(31,214,95,0.16); }
.bf-done-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }

@media print { .bf-sand, .bf-nav, .bf-progress { display:none !important; } }

/* ---- Language switcher ---- */
.bf-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.bf-lang { display:flex; align-items:center; gap:8px; }
.bf-lang-sep { color:#8a8a8f; opacity:.4; font-family:var(--mono); font-size:11px; }
.bf-lang-btn { font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; background:none; border:0; padding:4px 2px; color:var(--gray-1); cursor:pointer; transition:color .2s; }
.bf-lang-btn:hover, .bf-lang-btn.active { color:var(--ink); font-weight:700; }
