/* === INICIO: Estilos del buscador === */
/* === FIN: Estilos del buscador === */

    :root{
      --btn-bg: #F4F4F4;
      --accent: #ff7aa2; /* color amigable */
      --muted: #6c757d;
      --card-radius: 16px;
    }
    body{
      font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
      background: linear-gradient(180deg,#fff 0%, #f8fbff 100%);
      color:#222;
    }
    .brand-letter{ color:var(--accent); font-weight:800 }
    .btn-----kids{
      background: var(--btn-bg);
      border: 0;
      box-shadow: 0 6px 18px rgba(0,0,0,0.06);
      border-radius: 12px;
      padding: .6rem 1rem;
    }
    .card-product{ border-radius: var(--card-radius); }
    .hero{ border-radius: 20px; background: linear-gradient(90deg, #fff, #fffaf6); box-shadow: 0 10px 30px rgba(0,0,0,0.04)}
    .category-badge{ font-size:.9rem; padding:.45rem .7rem; border-radius:999px; background:#fff; box-shadow:0 6px 18px rgba(0,0,0,.03)}
    .mascot{ width:120px; height:120px; border-radius:50%; background:linear-gradient(135deg,#ffd6e8,#fff); display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--accent)}
    footer{ background:#fff; border-top:1px solid #e9ecef }
    @media (max-width:575px){ .mascot{ width:80px; height:80px } }