components.v2.css — Relematic (Premium B2B) */

h1,h2,h3{ margin:0; line-height:1.12; letter-spacing:-0.02em; }
p{ margin:.9rem 0 0; color:var(--muted); max-width:72ch; }

/* Eyebrow por defecto (secciones claras) */
.section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(11,15,20,.55);
}
.section-eyebrow::before{
  content:"";
  width:26px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg, var(--gold), rgba(201,164,76,.25));
}

/* Botones — ÚNICA verdad */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding:.78rem 1.15rem;
  border-radius: var(--radius-sm);
  border:1px solid transparent;
  font-weight:800;
  font-size:.95rem;
  white-space:nowrap;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
}
.btn:active{ transform: translateY(1px); }

.btn-primary{
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  color: var(--ink);
  border-color: rgba(0,0,0,.16);
  box-shadow: 0 12px 30px rgba(201,164,76,.42);
}
.btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 42px rgba(201,164,76,.52);
}

.btn-secondary{
  background: rgba(255,255,255,.92);
  color: var(--text);
  border-color: rgba(255,255,255,.85);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.btn-secondary:hover{ background:#fff; }