nav a {
    font-weight: 600 !important;
}
/*#clientes{
	display: none !important;
}*/
#logotipo{
	font-family: "Space Grotesk", sans-serif;
}
.bg-brand-500 {
	--tw-bg-opacity: 1;
	background-color: rgb(255 51 102) !important;
}
.to-indigo-600 {
	color:#ff3366 !important;
}
.hover\:shadow-brand-500\/30:hover {
	--tw-shadow-color: rgb(99 91 255 / 0.3);
	--tw-shadow: var(--tw-shadow-colored);
	background-color: #4f46e5 !important;
}
.hover\:text-brand-500:hover {
	--tw-text-opacity: 1;
	color:#ff3366 !important;;
}
.hover\:bg-brand-600:hover {
	--tw-bg-opacity: 1;
	background-color:#4f46e5 !important;
}
.hlt{
	color:#ff3366 !important;
}
.hlt2{
	color:#52514e !important;
}
.text-slate-900 {
	--tw-text-opacity: 1;
	color:#1a1a1a;
}
.no-scrollbar::-webkit-scrollbar {
	display: none;
}
.no-scrollbar { 
	-ms-overflow-style: none;
	scrollbar-width: none;
  }
@keyframes marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}
/* Clase que aplica la animación a la tira del carrusel */
.animate-infinite-scroll {
	display: flex;
	width: max-content;
	animation: marquee 30s linear infinite; /* Ajusta los segundos para cambiar la velocidad */
}
/* Pausar el movimiento al pasar el cursor (Opcional pero recomendable) */
.animate-infinite-scroll:hover {
	animation-play-state: paused;
}
/*STRIPE*/
/* Estilos para el Selector y Cajas de Pago */
.checkout-section {
    max-width: 600px;
    margin: 2rem auto;
    background: #fff;
    padding: 2rem;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.payment-methods {
    display: flex;
    gap: 1rem;
    margin: 1.5rem 0;
}

.method-option {
    flex: 1;
    padding: 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    text-align: center;
    font-weight: 500;
    transition: all 0.3s ease;
}

.method-option.active {
    border-color: #3498db;
    background-color: #f0f7fc;
}

.payment-box {
    margin-top: 1.5rem;
}

.payment-box.hidden {
    display: none;
}

#card-element {
    padding: 12px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    margin-bottom: 1rem;
    background: #fff;
}

.btn-pay, .btn-wa {
    display: block;
    width: 100%;
    padding: 0.8rem;
    background-color: #2c3e50;
    color: white;
    text-align: center;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
}

.btn-wa {
    background-color: #25D366;
}

.bank-details {
    background: #f8fafc;
    padding: 1rem;
    border-radius: 6px;
    border-left: 4px solid #3498db;
    margin-bottom: 1rem;
}

.error-msg {
    color: #e74c3c;
    font-size: 0.85rem;
    margin-top: 0.5rem;
}
*{box-sizing:border-box;}

        .container{
            width:95%;
            max-width:900px;
            padding:32px 64px;
            margin:auto;
        }

        .social{
            /*las imágenes usadas tienen width de 48px*/
            width:48px;
            position:fixed;
            top:50px;
            right:0;
        }

        /* Extra centrado vertical*/

        .social{
            /*border:1px solid #000;*/
            top:50%;
            height:205px;
            /*para poner height 192 deberíamos haber indicado en el reset de estilos font-size:0;*/
            margin-top:-100px;
        }