/* Custom colors used alongside Tailwind CDN */
.hero-bg {
    background-image: linear-gradient(rgba(15, 32, 80, 0.58), rgba(0, 0, 0, 0.5)),
        url("../assets/banner.webp");
    background-size: cover;
    background-position: center 42%;
    background-attachment: scroll;
}

.paris-bg {
    background-image: linear-gradient(rgba(250, 250, 249, 0.95), rgba(250, 250, 249, 0.95)),
        url("https://images.unsplash.com/photo-1499856871958-5b9627545d1a?q=80&w=2000&auto=format&fit=crop");
    background-size: cover;
    background-position: center;
}

.skip-link {
    position: absolute;
    left: 1rem;
    top: -3rem;
    z-index: 60;
    background: #1e3a8a;
    color: #fff;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
}

.skip-link:focus {
    top: 1rem;
}

.timeline-line {
    position: absolute;
    top: 1.25rem;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: #e5e7eb;
    transform: translateX(-50%);
}