/* brief.boostic.ai — motor de briefs. Línea gráfica heredada del _template de propuestas. */
:root{
  --c-bg:#FFFFFF; --c-bg-soft:#F5F8FC; --c-bg-deep:#061024;
  --c-ink:#0B1B33; --c-ink-2:#38465C; --c-ink-3:#6B7A90;
  --c-primary:#0050E0; --c-accent:#1D84FF; --c-accent-2:#0B63FF;
  --c-line:#E3E9F2; --c-line-2:#EEF3F9; --c-on-dark:#E9F1FF; --c-success:#16A34A; --c-danger:#D92D20;
  --f-mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --f-body:'Sora', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --maxw:760px; --gutter:clamp(18px,5vw,40px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--c-bg)}
body{background:var(--c-bg);color:var(--c-ink);font-family:var(--f-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100dvh}
::selection{background:var(--c-primary);color:#fff}
a{color:var(--c-primary);text-decoration:none}
h1,h2,h3{font-family:var(--f-body);color:var(--c-ink);letter-spacing:-0.025em;font-weight:800}
.mono{font-family:var(--f-mono)}

/* AURORA background sutil */
.bk-aurora{position:fixed;inset:-20% -10% auto -10%;height:60vh;z-index:0;pointer-events:none;opacity:.85;
  background:radial-gradient(38% 50% at 78% 18%,rgba(29,132,255,.16),transparent 70%),
  radial-gradient(32% 44% at 12% 8%,rgba(0,80,224,.10),transparent 70%),
  radial-gradient(40% 50% at 88% 80%,rgba(189,235,255,.30),transparent 70%);filter:blur(10px)}

/* HEADER sticky con progreso */
.bk-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.85);backdrop-filter:saturate(140%) blur(12px);-webkit-backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--c-line)}
.bk-head-in{max-width:var(--maxw);margin:0 auto;padding:14px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:14px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-ink);font-weight:500}
.brand .dot{width:7px;height:7px;border-radius:50%;background:var(--c-primary);box-shadow:0 0 0 4px rgba(0,80,224,.14)}
.brand .client{color:var(--c-primary);font-weight:700}
.bk-step-meta{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-3);text-align:right;white-space:nowrap}
.bk-progress{height:3px;background:var(--c-line-2)}
.bk-progress span{display:block;height:100%;background:var(--c-primary);width:0;transition:width .35s cubic-bezier(.2,.7,.2,1)}

/* LAYOUT */
.bk-wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:clamp(28px,5vw,56px) var(--gutter) 120px}
.eyebrow{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--c-primary);display:inline-flex;align-items:center;gap:10px;font-weight:500;margin-bottom:18px}
.eyebrow::before{content:'';width:24px;height:2px;background:var(--c-primary)}

/* INTRO / portada */
.bk-intro h1{font-size:clamp(32px,6vw,52px);line-height:1.02;letter-spacing:-0.035em;margin-bottom:18px}
.bk-intro p{font-size:clamp(15px,1.8vw,18px);color:var(--c-ink-2);max-width:54ch;margin-bottom:14px}
.bk-intro .meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0}
.bk-pill{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink-2);border:1px solid var(--c-line);padding:8px 12px;background:#fff}
.bk-pill b{color:var(--c-primary)}

/* ROLE PICKER */
.role-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:24px}
@media(min-width:620px){.role-grid{grid-template-columns:1fr 1fr}}
.role-card{text-align:left;padding:24px;background:#fff;border:1px solid var(--c-line);cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s;font-family:inherit}
.role-card:hover{border-color:var(--c-primary);box-shadow:0 18px 44px -30px rgba(11,27,51,.32);transform:translateY(-2px)}
.role-card .rk{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-primary);font-weight:700;margin-bottom:12px}
.role-card .rn{font-size:18px;font-weight:700;color:var(--c-ink);margin-bottom:6px;letter-spacing:-0.01em}
.role-card .rd{font-size:13.5px;color:var(--c-ink-2);line-height:1.5}

/* STEP / bloque */
.bk-block{display:none}
.bk-block.active{display:block;animation:fadeUp .4s cubic-bezier(.2,.7,.2,1)}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.block-no{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink-3);font-weight:700;margin-bottom:10px}
.bk-block h2{font-size:clamp(22px,3.4vw,30px);line-height:1.12;letter-spacing:-0.025em;margin-bottom:10px}
.block-intro{font-size:14.5px;color:var(--c-ink-2);line-height:1.6;max-width:58ch;margin-bottom:8px}
.block-micro{font-family:var(--f-mono);font-size:11px;letter-spacing:.04em;color:var(--c-ink-3);background:var(--c-bg-soft);border-left:2px solid var(--c-primary);padding:8px 12px;margin-bottom:6px}

/* FIELDS */
.field{padding:22px 0;border-top:1px solid var(--c-line-2)}
.field:first-of-type{border-top:1px solid var(--c-line);margin-top:22px}
.field label.q{display:block;font-size:16px;font-weight:600;color:var(--c-ink);line-height:1.45;margin-bottom:6px}
.field .req{color:var(--c-primary);font-weight:700;margin-left:2px}
.field .help{font-size:13px;color:var(--c-ink-3);line-height:1.5;margin-bottom:12px}
.field input[type=text],.field input[type=email],.field input[type=tel],.field textarea,.field select{
  width:100%;background:#fff;border:1px solid var(--c-line);color:var(--c-ink);font-family:var(--f-body);font-size:15px;padding:12px 14px;outline:none;transition:border-color .2s;border-radius:2px}
.field textarea{min-height:96px;resize:vertical;line-height:1.55}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--c-primary)}
.field input::placeholder,.field textarea::placeholder{color:var(--c-ink-3)}
.field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--c-danger)}
.field .err{display:none;font-family:var(--f-mono);font-size:11px;color:var(--c-danger);margin-top:8px;letter-spacing:.02em}
.field.invalid .err{display:block}
/* checkbox group */
.opts{display:flex;flex-wrap:wrap;gap:10px}
.opt{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--c-ink);border:1px solid var(--c-line);padding:10px 14px;cursor:pointer;background:#fff;transition:border-color .2s,background .2s;border-radius:2px}
.opt:hover{border-color:var(--c-primary)}
.opt input{accent-color:var(--c-primary);width:16px;height:16px}
.opt.checked{border-color:var(--c-primary);background:rgba(0,80,224,.04)}

/* NAV botones */
.bk-nav{position:fixed;bottom:0;left:0;right:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-top:1px solid var(--c-line)}
.bk-nav-in{max-width:var(--maxw);margin:0 auto;padding:14px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:14px}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-mono);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:13px 22px;background:var(--c-primary);color:#fff;border:none;cursor:pointer;transition:background .2s,transform .2s;border-radius:2px}
.btn:hover{background:var(--c-accent-2);transform:translateY(-1px)}
.btn:disabled{opacity:.4;cursor:default;transform:none}
.btn.ghost{background:transparent;color:var(--c-ink-2);border:1.5px solid var(--c-line)}
.btn.ghost:hover{border-color:var(--c-primary);color:var(--c-primary);background:transparent}
.bk-autosave{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-ink-3)}
.bk-autosave b{color:var(--c-success)}

/* SUCCESS */
.bk-done{text-align:center;padding:clamp(40px,8vw,80px) 0}
.bk-done .ic{width:64px;height:64px;margin:0 auto 24px;border-radius:50%;background:rgba(22,163,74,.1);display:flex;align-items:center;justify-content:center}
.bk-done .ic svg{width:30px;height:30px;stroke:var(--c-success);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.bk-done h2{font-size:clamp(26px,4vw,38px);margin-bottom:14px;letter-spacing:-0.03em}
.bk-done p{font-size:16px;color:var(--c-ink-2);max-width:46ch;margin:0 auto}

.foot-note{margin-top:40px;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-3);text-align:center}

/* PANTALLA DIVISOR de sección */
.bk-block.divider{min-height:44vh;display:flex;flex-direction:column;justify-content:center}
.bk-block.divider h2{font-size:clamp(28px,5vw,44px);letter-spacing:-0.03em;line-height:1.05}
.bk-block.divider .block-intro{margin-top:14px;font-size:clamp(15px,1.8vw,18px)}

/* MODO 1x1 (una pregunta por pantalla, estilo BH) */
.bk-block.solo{min-height:46vh}
.bk-block.solo .eyebrow{margin-bottom:16px}
.bk-block.solo .field{border-top:none;padding:10px 0 0}
.bk-block.solo .field label.q{font-size:clamp(20px,3vw,28px);font-weight:700;line-height:1.22;letter-spacing:-0.02em;color:var(--c-ink);margin-bottom:14px}
.bk-block.solo .field .help{font-size:14px;margin-bottom:16px}

@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}