/* Endolifter — v1.6 section scroll pills */

/* Indicador "scroll a siguiente sección" — replica el estilo de .hero__scroll */
.section-scroll-next {
    position: absolute; bottom: 24px; right: 24px;
    display: inline-flex; align-items: center; gap: 10px;
    color: var(--color-text-muted);
    font-size: 0.66rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    z-index: 5;
    padding: 8px 14px;
    border: 1px solid var(--color-border);
    border-radius: 100px;
    background: rgba(10,10,10,0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-decoration: none;
    transition: color .2s, border-color .2s, background .2s, transform .2s;
    cursor: pointer;
    user-select: none;
}
.section-scroll-next:hover {
    color: var(--color-accent);
    border-color: var(--color-accent);
    background: rgba(10,10,10,0.85);
    transform: translateY(-2px);
}
.section-scroll-next__line {
    width: 22px; height: 1px;
    background: linear-gradient(to right, var(--color-accent), transparent);
    display: inline-block;
    animation: scrollPulse 2.5s ease-in-out infinite;
}
.section-scroll-next__arrow {
    color: var(--color-accent);
    font-size: 0.78rem;
    line-height: 1;
}

/* En la última sección visible (si hubiera escapado al JS), siempre ocultar */
.section-scroll-next.is-last { display: none; }

@media (max-width: 768px) {
    .section-scroll-next { display: none; }
}

/* Asegurar position:relative en cualquier sección de la front-page que la pueda recibir */
.front-page > section,
.front-page > .section,
.front-page > .trust-bar,
.front-page > .hero { position: relative; }

/* Aseguramos algo de aire en cada sección de la home para alojar el pill
   sin que colisione con el contenido (excepto en hero, que ya tiene el suyo). */
.front-page > section:not(.hero):has(> .section-scroll-next) {
    padding-bottom: max(96px, 5vw);
}

/* Fallback para navegadores sin :has() */
@supports not selector(:has(*)) {
    .front-page > section:not(.hero) { padding-bottom: max(96px, 5vw); }
}