/* Custom styles to apply the Inter font */
body {
    font-family: 'Inter', sans-serif;
}
/* Custom colors for easier use, inspired by the original design */
.bg-brand-blue { background-color: #3498db; }
.text-brand-blue { color: #3498db; }
.bg-brand-green { background-color: #2ecc71; }
.text-brand-green { color: #2ecc71; }
.bg-brand-dark { background-color: #34495e; }
.text-brand-dark { color: #34495e; }
.bg-brand-light-gray { background-color: #f8f9fa; }
.bg-brand-instagram { background-color: #e1306c; }
.hover\:bg-brand-instagram-dark:hover { background-color: #c13584; }

/* ========= CSS ADICIONAL PARA EL VIDEO HERO ========= */
#hero-video iframe {
    /* Asegura que el video cubra todo el espacio sin deformarse */
    width: 100vw;
    height: 56.25vw; /* 100 * 9 / 16 (proporción 16:9) */
    min-height: 100vh; /* vh = viewport height */
    min-width: 177.77vh; /* 100 * 16 / 9 */
    pointer-events: none; /* Evita que se pueda hacer clic en el video */
}

/* ========= NUEVO CSS PARA POSICIONAR EL TEXTO ========= */
.hero-text-content {
    position: absolute; /* Posicionamiento absoluto dentro de la sección */
    bottom: 0;        /* Lo pega a la parte inferior */
    right: 0;         /* Lo pega a la parte derecha */
    z-index: 10;      /* Se asegura que esté por encima de la capa oscura */
    color: white;
    text-align: right;  /* Alinea el texto a la derecha */
    padding: 3rem;      /* Espaciado (equivale a p-12 en Tailwind) */
    max-width: 42rem;   /* Límite de ancho (equivale a max-w-2xl) */
}