/* Ajustes modernos de rendimiento y accesibilidad */

:root {
    --placeholder-bg: #eef6e2;
    --placeholder-border: #d6eab8;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    background: var(--primary-color);
    color: #fff;
    padding: 0.75rem 1rem;
    border-radius: 0 0 8px 8px;
}

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

main > section,
.footer {
    content-visibility: auto;
    contain-intrinsic-size: 1px 900px;
}

.content-image-placeholder,
.auto-placeholder {
    margin: 0 0 1rem;
    border: 1px solid var(--placeholder-border);
    border-radius: 12px;
    overflow: hidden;
    background: var(--placeholder-bg);
}

.content-image-placeholder img,
.auto-placeholder img {
    display: block;
    width: 100%;
    max-height: 560px;
    object-fit: contain;
    object-position: center;
}

.auto-placeholder figcaption,
.content-image-placeholder figcaption {
    padding: 0.5rem 0.75rem;
    color: var(--text-light);
    font-size: 0.9rem;
}

.service-card img,
.market-card img,
.projects-gallery img,
.team-content img {
    border-radius: 12px;
}

/* Más altura en fotos para ver más contenido visual */
.service-card > img {
    height: 280px !important;
    object-fit: cover !important;
    object-position: center !important;
}

.market-card > img {
    height: 150px !important;
    object-fit: cover !important;
    object-position: center !important;
}

.projects-gallery img {
    width: 260px !important;
    height: 180px !important;
    object-fit: cover !important;
    object-position: center !important;
}

:focus-visible {
    outline: 3px solid var(--secondary-color);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

@media (max-width: 768px) {
    .content-image-placeholder img,
    .auto-placeholder img {
        max-height: 360px;
    }
}