/* ═══════════════════════════════════════════════
   LOGO-PRECIO.CSS — página «Cuánto cuesta un logo»
   Se apoya en faq.css (cabecera, preguntas, CTA).
   Solo variables de tokens.css; no declara :root.
   ═══════════════════════════════════════════════ */

.logo-precio { max-width:980px; }

.vias { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; margin-bottom:72px; }
.via { display:flex; flex-direction:column; gap:10px; padding:28px 26px; background:var(--blanco); border:1px solid var(--gris-2); border-radius:var(--radio-hoja); transition:border-color .3s ease, transform .3s ease, box-shadow .3s ease; }
.via:hover { border-color:var(--acento); transform:translateY(-3px); box-shadow:0 10px 28px rgba(15,42,13,0.08); }
.via-etiqueta { font-size:10px; font-weight:400; text-transform:uppercase; letter-spacing:2.5px; color:var(--acento); }
.via h2 { font-size:22px; font-weight:700; line-height:1.2; color:var(--verde-oscuro); }
.via p { flex:1; font-size:15px; font-weight:300; line-height:1.65; color:var(--gris-4); }
.via-precio { margin-top:8px; font-size:24px; font-weight:700; color:var(--verde); }

.elegir { margin-bottom:72px; max-width:760px; }
.elegir h2 { font-size:clamp(26px,3.4vw,34px); font-weight:700; line-height:1.15; color:var(--verde-oscuro); margin-bottom:22px; }
.elegir p { font-size:17px; font-weight:300; line-height:1.75; color:var(--gris-4); margin-bottom:18px; }
.elegir a, .faq-item p a { color:var(--verde); text-decoration:underline; text-underline-offset:3px; }

.faq-titulo { font-size:clamp(26px,3.4vw,34px); font-weight:700; line-height:1.15; color:var(--verde-oscuro); margin-bottom:28px; }

@media (max-width:640px) {
  .vias { gap:16px; margin-bottom:56px; }
  .via { padding:24px 22px; }
}