/* 
=====================================
GRAN MANTRA - RUTA DE LOS CENOTES
Archivo principal de estilos CSS
=====================================
*/

/* Fonts */
@font-face {
    font-family: 'Candelia';
    src: url('../Fonts/Candelia.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Faktum-Light';
    src: url('../Fonts/Faktum-Light.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Faktum-Regular';
    src: url('../Fonts/Faktum-Regular.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Faktum-MediumItalic';
    src: url('../Fonts/Faktum-MediumItalic.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Maharlika-Regular';
    src: url('../Fonts/Maharlika-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'MyriadPro-Regular';
    src: url('../Fonts/MyriadPro-Regular.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Faktum-Bold';
    src: url('../Fonts/Rene Bieder - Faktum Test Bold.otf') format('opentype');
    font-display: swap;
}

/* Variables CSS */
:root {
    --color-primary: #12238b;      /* Azul principal */
    --color-secondary: #c18144;    /* Ocre/dorado */
    --color-accent: #d4af37;       /* Dorado accent */
    --color-text: #545d6b;         /* Gris para textos */
    --color-text-light: #545d6b;   /* Mismo gris para texto claro */
    --color-white: #ffffff;
    --color-gray: #808080;
    
    --font-primary: 'Faktum-Regular', Arial, sans-serif;
    --font-title: 'Candelia', serif;
    --font-light: 'Faktum-Light', Arial, sans-serif;
    --font-bold: 'Faktum-Bold', Arial, sans-serif;
    
    --shadow-text: 2px 2px 4px rgba(0,0,0,0.5);
    --shadow-card: 0 4px 15px rgba(0,0,0,0.1);
    
    --transition: all 0.3s ease;
}

/* Global Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-primary);
    overflow-x: hidden;
    line-height: 1.6;
    color: var(--color-text);
}

/* ============================
   Hectáreas - Hero ajustes
   ============================ */
.hero-section {
    background-size: cover;
    background-position: center;
}

.hero-topbar {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    z-index: 3;
}

.hero-brand {
    height: 36px;
    width: auto;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.35));
}

.btn-outline-hero {
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.8);
    border-radius: 10px;
    padding: 10px 18px;
    font-family: var(--font-bold);
    letter-spacing: .5px;
    transition: var(--transition);
}
.btn-outline-hero:hover {
    background: rgba(255,255,255,0.12);
}

.hero-content.hectareas-hero {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 16px 70px;
    color: #fff;
}

.hero-center-logo {
    height: 110px;
    width: auto;
    margin-bottom: 24px;
    filter: drop-shadow(0 4px 12px rgba(0,0,0,.55));
}

.hectareas-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 3rem;
    line-height: 1.1;
    color: #fff;
    text-shadow: 0 2px 12px rgba(0,0,0,.45);
    margin-bottom: 18px;
}

.hectareas-subtitle {
    max-width: 900px;
    font-family: var(--font-light);
    font-size: 1.05rem;
    color: #e9e9e9;
    text-shadow: 0 2px 8px rgba(0,0,0,.35);
    margin-bottom: 28px;
}

.btn-cta-hero {
    background: #c18144;
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 12px 28px;
    font-family: var(--font-bold);
    letter-spacing: .5px;
    box-shadow: 0 10px 24px rgba(0,0,0,.25);
    transition: var(--transition);
}
.btn-cta-hero:hover { background: #a66d35; transform: translateY(-1px); }

@media (max-width: 992px) {
    .hectareas-title { font-size: 2.4rem; }
    .hero-center-logo { height: 82px; margin-bottom: 18px; }
}
@media (max-width: 768px) {
    .hero-brand { height: 28px; }
    .hero-center-logo { height: 64px; margin-bottom: 14px; }
    .hectareas-title { font-size: 2rem; }
    .hectareas-subtitle { font-size: .95rem; padding: 0 6px; }
}

/* Utility Classes */
.text-shadow {
    text-shadow: var(--shadow-text);
}

.transition {
    transition: var(--transition);
}

/* =====================================
   NAVBAR / MENU DE NAVEGACIÓN
   ===================================== */

.navbar-custom {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: none;
    z-index: 1000;
    transition: all 0.3s ease;
    padding: 15px 0;
}

.navbar-custom.scrolled {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 8px 0;
}

.navbar-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}

.navbar-logo {
    flex: 0 0 auto;
}

.nav-logo-img {
    height: 50px;
    width: auto;
    transition: all 0.3s ease;
    filter: brightness(0) invert(1); /* Logo blanco cuando está arriba */
}

.navbar-custom.scrolled .nav-logo-img {
    height: 45px;
    filter: none; /* Logo normal cuando hace scroll */
}

.navbar-menu {
    display: flex;
    gap: 40px;
    align-items: center;
    flex: 1;
    justify-content: center;
}

.nav-link {
    color: white;
    text-decoration: none;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    position: relative;
    padding: 8px 0;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}

.navbar-custom.scrolled .nav-link {
    color: var(--color-primary);
    text-shadow: none;
}

.nav-link:hover {
    color: var(--color-secondary);
    text-decoration: none;
}

.navbar-custom.scrolled .nav-link:hover {
    color: var(--color-secondary);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--color-secondary);
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

.navbar-buttons {
    display: flex;
    gap: 15px;
    align-items: center;
    flex: 0 0 auto;
}

.btn-nav-secondary {
    background: transparent;
    border: 1px solid white;
    color: white;
    padding: 8px 20px;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: 500;
    border-radius: 25px;
    transition: all 0.3s ease;
    cursor: pointer;
    letter-spacing: 0.5px;
}

.navbar-custom.scrolled .btn-nav-secondary {
    border: 1px solid var(--color-secondary);
    color: var(--color-secondary);
}

.btn-nav-secondary:hover {
    background: var(--color-secondary);
    color: white;
    border-color: var(--color-secondary);
}

.btn-nav-primary {
    background: var(--color-secondary);
    border: 1px solid var(--color-secondary);
    color: white;
    padding: 8px 20px;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: 500;
    border-radius: 25px;
    transition: all 0.3s ease;
    cursor: pointer;
    letter-spacing: 0.5px;
}

.btn-nav-primary:hover {
    background: #a06635;
    border-color: #a06635;
}

/* Hamburguesa para móvil */
.navbar-toggle {
    display: none;
    flex-direction: column;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
}

.navbar-toggle span {
    width: 25px;
    height: 3px;
    background: white;
    margin: 2px 0;
    transition: 0.3s;
    border-radius: 2px;
}

.navbar-custom.scrolled .navbar-toggle span {
    background: var(--color-primary);
}

.navbar-toggle.active span:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.navbar-toggle.active span:nth-child(2) {
    opacity: 0;
}

.navbar-toggle.active span:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

/* Menú móvil */
.navbar-mobile {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px;
    flex-direction: column;
    gap: 15px;
}

.navbar-mobile.active {
    display: flex;
}

.nav-link-mobile {
    color: var(--color-primary);
    text-decoration: none;
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: 500;
    padding: 10px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.nav-link-mobile:hover {
    color: var(--color-secondary);
    text-decoration: none;
}

.navbar-buttons-mobile {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.navbar-buttons-mobile .btn-nav-secondary,
.navbar-buttons-mobile .btn-nav-primary {
    width: 100%;
    text-align: center;
}

/* Media Queries para el navbar */
@media (max-width: 768px) {
    .navbar-menu,
    .navbar-buttons {
        display: none;
    }
    
    .navbar-toggle {
        display: flex;
    }
    
    .navbar-content {
        padding: 0 15px;
    }
}

@media (max-width: 992px) {
    .navbar-menu {
        gap: 25px;
    }
    
    .btn-nav-secondary,
    .btn-nav-primary {
        padding: 6px 15px;
        font-size: 0.75rem;
    }
}

/* Hero section functionality */
.hero-section {
    min-height: 100vh;
    background-color: #000; /* Fallback mientras carga el video */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    padding: 80px 0 0 0; /* Espacio para el navbar */
    overflow: hidden;
    z-index: 1; /* Hero section base */
    margin-bottom: 0; /* Asegurar que no haya margin negativo */
}

/* Overlay de opacidad para el video del hero */
.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Overlay semi-transparente */
    z-index: 1;
    pointer-events: none;
}

/* Video de fondo */
.hero-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0; /* detrás del contenido pero visible */
}

/* Logo */
.hero-logo {
    max-width: 300px;
    width: 100%;
    height: auto;
    margin-bottom: 2rem;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
    transition: var(--transition);
    z-index: 2;
}

.hero-logo:hover {
    transform: scale(1.05);
}

/* Texto principal */
.hero-text {
    color: var(--color-white);
    text-align: center;
    font-family: 'Maharlika-Regular', serif;
    font-size: 2.5rem;
    font-weight: normal;
    text-shadow: var(--shadow-text);
    max-width: 800px;
    line-height: 1.3;
    animation: fadeInUp 1s ease-out;
    z-index: 2;
    margin-bottom: 2rem;
}

/* Texto hero pequeño (primer y último h1) */
.hero-text-small {
    color: var(--color-white);
    text-align: center;
    font-family: 'Maharlika-Regular', serif;
    font-size: 1.2rem;
    font-weight: normal;
    text-shadow: var(--shadow-text);
    max-width: 800px;
    line-height: 1.3;
    animation: fadeInUp 1s ease-out;
    z-index: 2;
    margin-bottom: 0.5rem;
}

/* Texto hero principal (h1 del medio - RUTA DE LOS CENOTES) */
.hero-text-main {
    color: var(--color-white);
    text-align: center;
    font-family: 'Maharlika-Regular', serif;
    font-size: 3.5rem;
    font-weight: normal;
     line-height: 1;
    text-shadow: var(--shadow-text);
    max-width: 800px;
    animation: fadeInUp 1s ease-out;
    z-index: 2;
    margin-bottom: 0.5rem;
}

/* Botón CTA */
.hero-cta {
    z-index: 2;
    margin-top: 1.5rem;
    animation: fadeInUp 1.5s ease-out;
}

.btn-primary-custom {
    background: #c18144;
    border: none;
    padding: 15px 40px;
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--color-white);
    border-radius: 50px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
}

.btn-primary-custom:hover {
    background: #a66d35;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.btn-primary-custom:active {
    background: #8f5a29;
    transform: translateY(0);
}

.btn-primary-custom::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s;
}

.btn-primary-custom:hover::before {
    left: 100%;
}

/* Segunda Sección - Información */
.section-info {
    background-image: url('../01-Sección-1/FONDO.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    padding: 100px 0;
    position: relative; /* Restaurado para el overlay */
    overflow: hidden;
    z-index: 2; /* Section 2 */
}

/* Overlay para mejorar legibilidad del texto */
.section-info::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(245, 245, 240, 0.3); /* Menos opacidad para ver mejor el fondo */
    z-index: 1;
}

.info-content {
    position: relative; /* Necesario para el posicionamiento de las hojas */
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    z-index: 2;
}

.info-text-container {
    max-width: 900px; /* Aumentado de 700px a 900px para que el texto tenga más espacio */
    text-align: center;
    z-index: 3;
    position: relative;
}

.info-text {
    font-family: var(--font-light);
    font-size: 1.3rem; /* Aumentado de 1.1rem a 1.3rem */
    line-height: 1.6; /* Reducido de 1.8 a 1.6 para mejor proporción */
    color: var(--color-text);
    margin-bottom: 3rem;
    text-align: center;
}

.info-text strong {
    font-family: var(--font-bold);
    color: var(--color-secondary);
}

/* Hojas informativas */
.info-leaf {
    position: absolute; /* Cambiado de fixed a absolute para que sean fijas solo en la sección 2 */
    z-index: 1; /* Mantener z-index bajo para que esté detrás del texto */
    opacity: 1; /* Eliminada la opacidad - ahora completamente visible */
    max-width: 350px; /* Tamaño mantenido */
    transition: var(--transition);
}

.info-leaf-left {
    left: -184px; /* Valor específico solicitado */
    top: 50%;
    transform: translateY(-50%) rotate(-15deg);
    /* Animación removida para mejor rendimiento */
}

.info-leaf-right {
    right: -184px; /* Mismo valor para la derecha */
    top: 50%;
    transform: translateY(-50%) rotate(180deg) scaleX(-1); /* Rotación negativa para que apunte hacia arriba */
    /* Animación removida para mejor rendimiento */
}

/* Media query para móviles - Hojas adaptadas */
@media (max-width: 768px) {
    .info-leaf-left {
        left: -50px; /* Adaptado para móvil */
        max-width: 180px;
    }
    
    .info-leaf-right {
        right: -50px; /* Adaptado para móvil */
        max-width: 180px;
    }
}

/* Botón de información */
.info-cta {
    text-align: center;
}

.btn-info-custom {
    background-color: var(--color-secondary);
    border: none;
    padding: 15px 35px;
    font-family: var(--font-bold);
    font-size: 0.9rem;
    color: var(--color-white);
    border-radius: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(139, 115, 85, 0.3);
}

.btn-info-custom:hover {
    background-color: #7a6349;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(139, 115, 85, 0.4);
}

/* Tercera Sección - Video/Experiencia Visual */
.section-video {
    width: 100vw;
    padding: 1rem 0; /* 1rem arriba y abajo */
    margin: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3; /* Section 3 - mayor que las anteriores */
    clear: both; /* Asegurar que se posicione correctamente */
}

/* Variante sección 3 Hectáreas */
.hectareas-sec3 .video-background-img {
    max-height: unset;
    min-height: 420px;
}
.hectareas-sec3 .video-overlay {
    background-color: rgba(255, 255, 255, 0.0); /* sin oscurecer */
    padding: 60px 20px;
}
@media (max-width: 768px) {
    .hectareas-sec3 .video-background-img { min-height: 320px; }
}

.video-container {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-background-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    max-height: 60vh; /* Mantener altura rectangular */
    min-height: 480px; /* Altura mínima */
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.play-button {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.8);
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.play-button:hover {
    transform: scale(1.1);
    border-color: rgba(255, 255, 255, 1);
    background-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
}

.play-button:active {
    transform: scale(0.95);
}

.play-icon {
    width: 24px;
    height: 24px;
    color: white;
    margin-left: 3px; /* Pequeño ajuste para centrar visualmente el triángulo */
}

.play-icon svg {
    width: 100%;
    height: 100%;
}

/* Animación de pulso para el botón */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    70% {
        box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

.play-button {
    animation: pulse 2s infinite;
}

/* Cuarta Sección - Desarrollo */
.section-desarrollo {
    background-image: url('../03-Sección-3/FONDO.png'); /* Corregido a FONDO.png */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll; /* Cambiado de fixed a scroll */
    background-color: #F8F9FA; /* Fallback color */
    padding: 100px 0;
    position: relative;
    overflow: hidden;
    z-index: 4; /* Section 4 */
}

/* Overlay para mejorar legibilidad - reducido para mostrar más la imagen */
.section-desarrollo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(248, 249, 250, 0.1); /* Reducido aún más a 0.1 para máxima visibilidad de la imagen */
    z-index: 1;
}

.section-desarrollo .container {
    position: relative;
    z-index: 2;
}

/* Título principal */
.desarrollo-title {
    font-family: 'Maharlika-Regular', serif; /* Maharlika Regular como en la imagen */
    font-size: 2rem; /* Reducido de 2.8rem a 1.8rem */
    text-align: center !important;
    color: var(--color-primary); /* Azul #12238b */
   
    letter-spacing: 0.8px;
    text-transform: uppercase;
    font-weight: normal;
    line-height: 1.2;
}

/* Subtítulo descriptivo */
.desarrollo-subtitle {
    font-family: 'Faktum-Regular', sans-serif; /* Faktum como en la imagen */
    font-size: 1.4rem; /* Reducido de 1.2rem a 0.95rem */
    text-align: center !important;
    color: var(--color-text); /* Gris #545d6b */
    margin-bottom: 3rem; /* Reducido de 4rem a 3rem */
    line-height: 1.3;
    font-weight: 300;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* Carrusel de conceptos con Swiper */
.desarrollo-carousel {
    margin-bottom: 4rem;
}

.concept-swiper {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
}

.concept-cards-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 5rem; /* Aumentado de 3rem a 5rem para más separación */
    padding: 3rem 3rem; /* Aumentado padding lateral */
    background-color: transparent; /* Fondo transparente */
    backdrop-filter: none; /* Removido blur */
    border-radius: 20px;
    box-shadow: none; /* Removida sombra */
}

.concept-card {
    flex: 0 0 45%; /* Aumentado de 40% a 45% */
    text-align: center;
    padding: 3rem 2rem; /* Aumentado padding de 2rem 1.5rem a 3rem 2rem */
    margin: 0 1rem; /* Agregado margin lateral */
    border-radius: 20px; /* Aumentado border-radius */
    background-color: rgba(255, 255, 255, 0.6); /* Mantenido fondo de tarjeta */
    min-height: 280px; /* Agregado altura mínima */
    transition: var(--transition);
}

.concept-card:hover {
    transform: translateY(-5px);
    background-color: rgba(255, 255, 255, 0.7); /* Mayor opacidad en hover */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); /* Agregado shadow */
}

.concept-icon {
    margin-bottom: 2rem; /* Aumentado de 1.5rem a 2rem */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 120px; /* Aumentado de 100px a 120px */
}

.concept-icon img {
    max-width: 100px; /* Aumentado de 80px a 100px */
    max-height: 100px; /* Aumentado de 80px a 100px */
    filter: drop-shadow(0 2px 8px rgba(139, 115, 85, 0.2));
    transition: var(--transition);
}

.concept-card:hover .concept-icon img {
    transform: scale(1.1);
}

.concept-title {
    font-family: var(--font-regular);
    font-size: 1.25rem; /* Aumentado de 1rem a 1.25rem */
    color: var(--color-text);
    line-height: 1.4;
    margin: 0;
    font-weight: 500;
}

/* Personalización de botones Swiper */
.concept-swiper .swiper-button-prev,
.concept-swiper .swiper-button-next {
    background-color: rgba(139, 115, 85, 0.8);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin-top: -25px;
    color: white;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(139, 115, 85, 0.3);
}

.concept-swiper .swiper-button-prev:hover,
.concept-swiper .swiper-button-next:hover {
    background-color: var(--color-secondary);
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(139, 115, 85, 0.4);
}

.concept-swiper .swiper-button-prev:after,
.concept-swiper .swiper-button-next:after {
    font-size: 18px;
    font-weight: bold;
}

.concept-swiper .swiper-button-prev {
    left: -70px;
}

.concept-swiper .swiper-button-next {
    right: -70px;
}

/* Personalización de paginación */
.concept-swiper .swiper-pagination {
    position: static;
    margin-top: 2rem;
}

.concept-swiper .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background-color: rgba(139, 115, 85, 0.3);
    opacity: 1;
    transition: all 0.3s ease;
}

.concept-swiper .swiper-pagination-bullet-active {
    background-color: var(--color-secondary);
    transform: scale(1.2);
}

/* Texto descriptivo */
.desarrollo-description {
    text-align: center;
    margin-bottom: 3rem;
}

.description-text {
    font-family: var(--font-light);
    font-size: 1.3rem;
    color: var(--color-text);
    line-height: 1.3;
    margin-bottom: 1.5rem;
    color: var(--color-secondary);
    font-weight: 300;
}

.description-values {
    font-family: var(--font-light);
    font-size: 1.4rem; /* Aumentado de 1.1rem a 1.4rem */
    color: var(--color-secondary);
    font-style: italic;
    margin: 0;
}

/* Botón CTA */
.desarrollo-cta {
    text-align: center;
}

.btn-desarrollo-custom {
    background-color: var(--color-secondary);
    border: none;
    padding: 15px 35px;
    font-family: var(--font-bold);
    font-size: 0.9rem;
    color: var(--color-white);
    border-radius: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(193, 129, 68, 0.3); /* Actualizado para ocre */
}

.btn-desarrollo-custom:hover {
    background-color: #a56d3a; /* Ocre más oscuro para hover */
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(193, 129, 68, 0.4); /* Actualizado para ocre */
}

/* Quinta Sección - Amenidades */
.section-amenidades {
    background-color: #ffffff; /* Fondo blanco sólido */
    padding: 100px 0;
    position: relative;
    overflow: hidden;
    z-index: 5; /* Section 5 */
}

.section-amenidades .container {
    position: relative;
    z-index: 2;
}

/* Título principal */
.amenidades-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2rem;
    text-align: center !important;
    color: var(--color-primary); /* Azul #12238b */
    letter-spacing: 0.8px;
    text-transform: uppercase;
    font-weight: normal;
    line-height: 1.1;
}

/* Swiper personalizado para amenidades - 3 slides por vista */
.mySwiper-amenidades {
    max-width: 1400px; /* Aumentado de 1000px a 1400px */
    margin: 0 auto;
    padding: 40px; /* Aumentado de 20px a 40px */
}

.mySwiper-amenidades .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

/* Tarjetas transparentes con layout horizontal */
.custom-card-small {
    width: 500px; /* Aumentado de 400px a 500px */
    height: 180px; /* Aumentado de 140px a 180px */
    background: transparent; /* Fondo transparente */
    border-radius: 0; /* Sin border radius */
    display: flex;
    flex-direction: row; /* Layout horizontal */
    align-items: center;
    justify-content: flex-start;
    text-align: left; /* Texto alineado a la izquierda */
    padding: 2rem; /* Aumentado padding */
    margin: 0 auto;
    transition: all 0.3s ease;
    box-shadow: none; /* Sin sombra */
    border: none; /* Sin borde */
}

.custom-card-small:hover {
    transform: translateY(-5px); /* Efecto hover más sutil */
    background: transparent; /* Mantener transparente en hover */
}

.custom-card-small img {
    width: 140px; /* Aumentado de 100px a 140px */
    height: 140px; /* Aumentado de 100px a 140px */
    object-fit: contain;
    margin-right: 2.5rem; /* Aumentado margen para mejor separación */
    margin-bottom: 0; /* Quitar margen inferior */
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.1));
    transition: all 0.3s ease;
    flex-shrink: 0; /* No se encoge */
}

.custom-card-small:hover img {
    transform: scale(1.05); /* Hover más sutil */
}

.custom-card-small p {
    font-family: var(--font-regular);
    font-size: 1.3rem; /* Aumentado de 1.1rem a 1.3rem */
    color: var(--color-text);
    line-height: 1.3;
    font-weight: 500;
    margin: 0; /* Quitar márgenes */
    flex: 1; /* Ocupa el espacio restante */
}

/* Triángulos de navegación específicos para amenidades */
.amenidades-triangle-left,
.amenidades-triangle-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: auto; /* Cambiar de tamaño fijo a auto */
    height: auto; /* Cambiar de tamaño fijo a auto */
    background-color: transparent; /* Fondo transparente */
    color: var(--color-text); /* Color gris del texto */
    border: none;
    border-radius: 0; /* Sin border radius */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px; /* Aumentar tamaño del triángulo */
    transition: all 0.3s ease;
    box-shadow: none; /* Sin sombra */
    padding: 10px; /* Padding para área de click */
}

.amenidades-triangle-left {
    left: -60px;
}

.amenidades-triangle-right {
    right: -60px;
}

.amenidades-triangle-left:hover,
.amenidades-triangle-right:hover {
    background-color: transparent; /* Mantener transparente en hover */
    color: var(--color-primary); /* Cambiar a azul en hover */
    transform: translateY(-50%) scale(1.2); /* Efecto de escala en hover */
    box-shadow: none; /* Sin sombra en hover */
}

/* Botón CTA de amenidades */
.amenidades-cta {
    text-align: center;
    margin-top: 50px;
}

.btn-amenidades-custom {
    background-color: var(--color-primary);
    border: none;
    padding: 15px 35px;
    font-family: var(--font-bold);
    font-size: 0.9rem;
    color: var(--color-white);
    border-radius: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(18, 35, 139, 0.3);
}

.btn-amenidades-custom:hover {
    background-color: #0f1f7a;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(18, 35, 139, 0.4);
}

/* Hectáreas - Amenidades (Sección 4) */
.hect-amenidades .amenidades-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2rem;
    color: var(--color-primary);
    letter-spacing: 1px;
    margin-bottom: 10px;
}
.hectSwiper-amenidades {
    max-width: 1100px;
    margin: 0 auto;
}
.hectSwiper-amenidades .swiper-slide { display: flex; justify-content: center; }
.amenidad-item { text-align: center; }
.amenidad-circle {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 6px solid #c18144;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 12px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.amenidad-circle img { width: 70%; height: 70%; object-fit: contain; }
.amenidad-label {
    font-family: var(--font-primary);
    font-size: 1.05rem;
    color: var(--color-primary);
    margin: 0;
}
.hect-amenidades-next, .hect-amenidades-prev {
    color: #c18144;
}
@media (max-width: 768px) {
    .hectSwiper-amenidades { max-width: 90%; }
    .amenidad-circle { width: 120px; height: 120px; border-width: 5px; }
}

.section-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.section-bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.1;
}

.section-features .container {
    position: relative;
    z-index: 2;
}

.section-title {
    font-family: var(--font-title);
    font-size: 3rem;
    text-align: center;
    color: var(--color-primary);
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
}

.section-subtitle {
    font-family: var(--font-light);
    font-size: 1.2rem;
    text-align: center;
    color: var(--color-text-light);
    margin-bottom: 4rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* Feature Items */
.feature-item {
    text-align: center;
    padding: 2rem 1rem;
    transition: var(--transition);
    border-radius: 20px;
    margin-bottom: 2rem;
}

.feature-item:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-card);
    background-color: var(--color-white);
}

.feature-icon {
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80px;
}

.icon-img {
    max-width: 60px;
    max-height: 60px;
    transition: var(--transition);
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));
}

.feature-item:hover .icon-img {
    transform: scale(1.1);
}

.feature-title {
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--color-primary);
    margin-bottom: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.feature-text {
    font-family: var(--font-light);
    font-size: 0.9rem;
    color: var(--color-text-light);
    line-height: 1.5;
    max-width: 200px;
    margin: 0 auto;
}

/* Animaciones */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes floatLeft {
    0%, 100% {
        transform: translateY(-50%) rotate(-15deg) translateY(0px);
    }
    50% {
        transform: translateY(-50%) rotate(-12deg) translateY(-15px);
    }
}

@keyframes floatRight {
    0%, 100% {
        transform: translateY(-50%) rotate(15deg) scaleX(-1) translateY(0px);
    }
    50% {
        transform: translateY(-50%) rotate(12deg) scaleX(-1) translateY(-12px);
    }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .hero-logo {
        max-width: 250px;
        margin-bottom: 1.5rem;
    }
    
    .hero-text {
        font-size: 2rem;
        padding: 0 1rem;
        margin-bottom: 1.5rem;
    }
    
    .hero-text-small {
        font-size: 1rem;
        padding: 0 1rem;
        margin-bottom: 1rem;
    }
    
    .hero-text-main {
        font-size: 1.3rem;
        padding: 0 1rem;
        margin-bottom: 1rem;
    }
    
    .btn-primary-custom {
        padding: 12px 30px;
        font-size: 1rem;
    }
    
    /* Botón Etapa 1 - Responsive */
    .btn-etapa-custom {
        padding: 15px 40px;
        font-size: 1.3rem;
        letter-spacing: 1.5px;
    }
    
    /* Segunda Sección - Información */
    .section-info {
        padding: 60px 0;
        background-attachment: scroll;
    }
    
    .section-info::before {
        background-color: rgba(245, 245, 240, 0.7);
    }
    
    .info-content {
        min-height: 300px;
        flex-direction: column;
    }
    
    .info-text-container {
        max-width: 90%;
        padding: 0 1rem;
    }
    
    .info-text {
        font-size: 1rem;
        line-height: 1.6;
        margin-bottom: 2rem;
    }
    
    .btn-info-custom {
        padding: 12px 25px;
        font-size: 0.8rem;
    }
    
    /* Cuarta Sección - Desarrollo */
    .section-desarrollo {
        padding: 60px 0;
        background-attachment: scroll; /* Mejor rendimiento en móviles */
    }
    
    .section-desarrollo::before {
        background-color: rgba(248, 249, 250, 0.9); /* Más opacidad en tablet */
    }
    
    .desarrollo-title {
        font-size: 2.2rem;
        padding: 0 1rem;
        margin-bottom: 1.5rem;
        letter-spacing: 0.5px;
        line-height: 1.1;
    }
    
    .desarrollo-subtitle {
        font-size: 1.1rem;
        padding: 0 1rem;
        margin-bottom: 3rem;
        line-height: 1.4;
    }
    
    .carousel-container {
        padding: 0 1rem;
    }
    
    .concept-swiper {
        padding: 10px;
    }
    
    .concept-cards-container {
        flex-direction: column;
        gap: 2rem;
        padding: 2rem 1rem;
    }
    
    .concept-card {
        width: 100%;
        max-width: 300px;
    }
    
    .concept-icon {
        height: 80px;
        margin-bottom: 1rem;
    }
    
    .concept-icon img {
        max-width: 60px;
        max-height: 60px;
    }
    
    .concept-title {
        font-size: 0.9rem;
    }
    
    .concept-swiper .swiper-button-prev,
    .concept-swiper .swiper-button-next {
        width: 40px;
        height: 40px;
        margin-top: -20px;
    }
    
    .concept-swiper .swiper-button-prev:after,
    .concept-swiper .swiper-button-next:after {
        font-size: 14px;
    }
    
    .concept-swiper .swiper-button-prev {
        left: 10px;
    }
    
    .concept-swiper .swiper-button-next {
        right: 10px;
    }
    
    .description-text {
        font-size: 0.95rem;
        padding: 0 1rem;
    }
    
    .description-values {
        font-size: 1rem;
    }
    
    .btn-desarrollo-custom {
        padding: 12px 25px;
        font-size: 0.8rem;
    }
    
    .btn-amenidades-custom {
        padding: 12px 25px;
        font-size: 0.8rem;
    }
    
    /* Quinta Sección - Amenidades */
    .section-amenidades {
        padding: 60px 0;
    }
    
    .amenidades-title {
        font-size: 1.8rem;
        padding: 0 1rem;
        margin-bottom: 4rem; /* Mantener separación en tablet */
        line-height: 1.1;
    }
    
    .mySwiper-amenidades {
        padding: 10px;
    }
    
    .custom-card-small {
        width: 450px; /* Aumentado proporcionalmente */
        height: 150px; /* Aumentado proporcionalmente */
        padding: 1.5rem;
    }
    
    .custom-card-small img {
        width: 110px; /* Aumentado proporcionalmente */
        height: 110px;
        margin-right: 2rem;
    }
    
    .custom-card-small p {
        font-size: 1.1rem; /* Aumentado proporcionalmente */
    }
    
    .amenidades-triangle-left,
    .amenidades-triangle-right {
        font-size: 20px; /* Triángulos ligeramente más pequeños en tablet */
        padding: 8px;
    }
    
    .amenidades-triangle-left {
        left: -40px;
    }
    
    .amenidades-triangle-right {
        right: -40px;
    }
    
    /* Tercera Sección - Video */
    .video-background-img {
        max-height: 50vh; /* Menos altura en tablet */
        min-height: 350px;
    }
    
    .play-button {
        width: 70px;
        height: 70px;
    }
    
    .play-icon {
        width: 20px;
        height: 20px;
    }
    
    .section-title {
        font-size: 2.2rem;
        padding: 0 1rem;
    }
    
    .section-subtitle {
        font-size: 1.1rem;
        padding: 0 1rem;
        margin-bottom: 3rem;
    }
    
    .feature-item {
        padding: 1.5rem 0.5rem;
        margin-bottom: 1.5rem;
    }
    
    .feature-title {
        font-size: 1rem;
    }
    
    .feature-text {
        font-size: 0.85rem;
        max-width: 180px;
    }
}

@media (max-width: 480px) {
    .hero-logo {
        max-width: 200px;
    }
    
    .hero-text {
        font-size: 1.8rem;
    }
    
    .hero-text-small {
        font-size: 0.9rem;
    }
    
    .hero-text-main {
        font-size: 1.2rem;
    }
    
    .section-title {
        font-size: 2rem;
    }
    
    /* Tercera Sección - Video */
    .video-background-img {
        max-height: 40vh; /* Aún más rectangular en móviles */
        min-height: 300px;
    }
    
    .play-button {
        width: 60px;
        height: 60px;
        border-width: 2px;
    }
    
    .play-icon {
        width: 18px;
        height: 18px;
    }
    
    .btn-primary-custom {
        padding: 10px 25px;
        font-size: 0.9rem;
    }
    
    /* Botón Etapa 1 - Mobile pequeño */
    .btn-etapa-custom {
        padding: 12px 30px;
        font-size: 1.1rem;
        letter-spacing: 1px;
    }
    
    /* Información responsive para móvil pequeño */
    .section-info {
        background-size: cover;
        background-position: center top;
    }
    
    .section-info::before {
        background-color: rgba(245, 245, 240, 0.85); /* Aún más opacidad en móviles pequeños */
    }
    
    .info-leaf-left,
    .info-leaf-right {
        display: none; /* Ocultar hojas en pantallas muy pequeñas */
    }
    
    .info-text {
        font-size: 0.95rem;
    }
    
    .btn-info-custom {
        padding: 10px 20px;
        font-size: 0.75rem;
    }
    
    /* Cuarta Sección - Desarrollo móvil */
    .section-desarrollo {
        padding: 40px 0;
        background-attachment: scroll;
    }
    
    .section-desarrollo::before {
        background-color: rgba(248, 249, 250, 0.95); /* Máxima legibilidad en móvil */
    }
    
    .desarrollo-title {
        font-size: 1.8rem;
        line-height: 1.1;
        letter-spacing: 0.3px;
        margin-bottom: 1rem;
    }
    
    .desarrollo-subtitle {
        font-size: 1rem;
        line-height: 1.3;
        br {
            display: none;
        }
    }
    
    .carousel-slide {
        padding: 1.5rem 0.5rem;
        gap: 1.5rem;
    }
    
    .concept-swiper {
        padding: 5px;
    }
    
    .concept-cards-container {
        padding: 1.5rem 0.5rem;
        gap: 1.5rem;
    }
    
    .concept-icon {
        height: 70px;
    }
    
    .concept-icon img {
        max-width: 50px;
        max-height: 50px;
    }
    
    .concept-title {
        font-size: 0.85rem;
        line-height: 1.3;
    }
    
    .concept-swiper .swiper-button-prev,
    .concept-swiper .swiper-button-next {
        width: 35px;
        height: 35px;
        margin-top: -17px;
    }
    
    .concept-swiper .swiper-button-prev:after,
    .concept-swiper .swiper-button-next:after {
        font-size: 12px;
    }
    
    .concept-swiper .swiper-button-prev {
        left: 5px;
    }
    
    .concept-swiper .swiper-button-next {
        right: 5px;
    }
    
    .concept-swiper .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
    }
    
    .description-text {
        font-size: 0.9rem;
        br {
            display: none;
        }
    }
    
    .description-values {
        font-size: 0.95rem;
    }
    
    .btn-desarrollo-custom {
        padding: 10px 20px;
        font-size: 0.75rem;
    }
    
    .btn-amenidades-custom {
        padding: 10px 20px;
        font-size: 0.75rem;
    }
    
    /* Quinta Sección - Amenidades móvil */
    .section-amenidades {
        padding: 40px 0;
    }
    
    .amenidades-title {
        font-size: 1.6rem;
        line-height: 1.1;
        letter-spacing: 0.5px;
        margin-bottom: 3rem; /* Mantener separación en móvil */
        padding: 0 1rem;
    }
    
    .mySwiper-amenidades {
        padding: 5px 10px; /* Reducir padding horizontal para dar más espacio a las flechas */
    }
    
    .custom-card-small {
        width: 350px; /* Aumentado significativamente para móvil */
        height: 120px; /* Aumentado para móvil */
        padding: 1.2rem;
        flex-direction: row; /* Mantener layout horizontal */
    }
    
    .custom-card-small img {
        width: 80px; /* Aumentado para móvil */
        height: 80px;
        margin-right: 1.5rem;
    }
    
    .custom-card-small p {
        font-size: 1rem; /* Aumentado para móvil */
        line-height: 1.2;
    }
    
    .amenidades-triangle-left,
    .amenidades-triangle-right {
        display: flex; /* Mostrar flechas en móvil */
        font-size: 1.8rem;
        color: #c18144;
        font-weight: bold;
        background-color: rgba(255, 255, 255, 0.95);
        border-radius: 50%;
        width: 40px;
        height: 40px;
        align-items: center;
        justify-content: center;
        box-shadow: 0 2px 8px rgba(0,0,0,0.15);
        border: 1px solid rgba(193, 129, 68, 0.2);
        padding: 0;
    }
    
    .amenidades-triangle-left {
        left: 5px; /* Más pegado al extremo izquierdo */
    }
    
    .amenidades-triangle-right {
        right: 5px; /* Más pegado al extremo derecho */
    }
    
    .feature-item {
        padding: 1rem 0.5rem;
    }
    
    .icon-img {
        max-width: 50px;
        max-height: 50px;
    }
    
    .feature-icon {
        height: 70px;
        margin-bottom: 1rem;
    }
}

/* =====================================
   Ajustes: Sección 3 a altura de pantalla
   ===================================== */
.section-video.hectareas-sec3 {
    padding: 0;                 /* sin padding vertical */
    height: 100vh;              /* ocupa la altura de la pantalla */
}
.hectareas-sec3 .video-container { height: 100%; }
.hectareas-sec3 .video-background-img {
    height: 100%;
    max-height: none;           /* anula limite anterior */
    min-height: 0;              /* anula min-height */
    object-fit: cover;          /* recorta sin deformar */
}
.hectareas-sec3 .video-overlay {
    padding: 24px 20px;         /* menos padding para caber mejor */
}

/* Cards menos cuadrados (más bajos) */
.hectareas-pilares .pilar-card {
    min-height: 140px;
    padding: 20px 18px;
}

@media (max-width: 992px) {
    .section-video.hectareas-sec3 { height: calc(100vh - 0px); }
}
@media (max-width: 768px) {
    .section-video.hectareas-sec3 { height: calc(100vh - 0px); }
}
/* Tablet específico */
@media (min-width: 769px) and (max-width: 1024px) {
    .section-title {
        font-size: 2.8rem;
    }
    
    .hero-text {
        font-size: 2.3rem;
    }
    
    .hero-text-small {
        font-size: 1.1rem;
    }
    
    .hero-text-main {
        font-size: 1.5rem;
    }
    
    .info-leaf-left,
    .info-leaf-right {
        max-width: 150px;
    }
    
    .info-text {
        font-size: 1.05rem;
    }
    
    /* Botón Etapa 1 - Tablet */
    .btn-etapa-custom {
        padding: 18px 45px;
        font-size: 1.4rem;
    }
}

/* Loading Overlay */
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-white);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 0.5s ease;
}

.loading-overlay.hide {
    opacity: 0;
    pointer-events: none;
}

/* Spinner de carga */
.spinner {
    width: 50px;
    height: 50px;
    border: 3px solid var(--color-gray);
    border-top: 3px solid var(--color-primary);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Preparación para futuras secciones */
.section {
    padding: 80px 0;
}

.section-title {
    font-family: var(--font-title);
    font-size: 2.5rem;
    text-align: center;
    margin-bottom: 3rem;
    color: var(--color-primary);
}

.container-custom {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Container wrapper para los triángulos */
.swiper-container-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
}

/* Triángulos de navegación */
.triangle-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
    color: #999999; /* Gris claro */
    cursor: pointer;
    z-index: 10;
    user-select: none;
    transition: color 0.3s ease;
}

.triangle-nav:hover {
    color: #666666;
}

.triangle-left {
    left: -60px; /* Posicionado a la izquierda del swiper */
}

.triangle-right {
    right: -60px; /* Posicionado a la derecha del swiper */
}

/* Swiper personalizado igual al de Gran Mantra */
.mySwiper {
    overflow: hidden; /* Cambiado de visible a hidden */
    padding: 2rem 0;
    max-width: 960px; /* Ancho máximo para contener exactamente 2 slides */
    margin: 0 auto; /* Centrar el swiper */
}

.mySwiper .swiper-slide {
    width: auto;
    flex-shrink: 0;
    height: auto;
}

.custom-card {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    padding: 4rem 2rem; /* Aumentado padding vertical */
    text-align: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
    min-height: 450px; /* Aumentada altura mínima */
    width: 450px; /* Aumentado ancho */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.custom-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}


/* ============================
   Hectáreas - Sección 2 Intro
   ============================ */
.hectareas-intro {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 80px 0; /* menos padding para caber en 100vh */
    position: relative;
    min-height: 100vh; /* cubrir pantalla completa */
    display: flex;
    align-items: center; /* centrar verticalmente contenido */
}
.hectareas-intro::before {
    /* Quitar el overlay de .section-info en esta variante */
    content: '';
    position: absolute;
    inset: 0;
    background: transparent;
    pointer-events: none;
}
.intro-content {
    position: relative;
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Para que las hojas se posicionen respecto a toda la sección y no al container */
.hectareas-intro .intro-content { position: static; }
.intro-text {
    text-align: center;
    max-width: 900px;
    z-index: 2;
}
.intro-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2.4rem;
    color: #12238b; /* azul */
    margin-bottom: 14px;
}
.intro-subtitle {
    font-family: var(--font-light);
    font-size: 1.05rem;
    color: #545d6b;
}
.intro-subtitle em { font-family: var(--font-bold); }

.intro-leaf {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 180px;
    height: auto;
    z-index: 1;
    filter: drop-shadow(0 4px 14px rgba(0,0,0,.18));
}
.intro-leaf-left { left: 0; }
.intro-leaf-right { right: 0; }

@media (max-width: 992px) {
    .intro-title { font-size: 2rem; }
    .intro-leaf { width: 140px; }
}
@media (max-width: 768px) {
    .hectareas-intro { padding: 70px 0; }
    .intro-title { font-size: 1.8rem; }
    .intro-subtitle { font-size: .95rem; }
    .intro-leaf { display: none; }
}
.custom-card img {
    width: 140px; /* Aumentado significativamente */
    height: 140px; /* Aumentado significativamente */
    margin-bottom: 3rem; /* Más espacio debajo del ícono */
    filter: drop-shadow(0 4px 12px rgba(139, 115, 85, 0.3));
    transition: all 0.3s ease;
}

.custom-card:hover img {
    transform: scale(1.1);
}

.custom-card p {
    font-family: var(--font-regular);
    font-size: 1.4rem; /* Aumentado el tamaño de fuente */
    color: var(--color-text);
    line-height: 1.4;
    font-weight: 500;
    margin: 0;
}

/* Botones de navegación del swiper */
.mySwiper .swiper-button-next,
.mySwiper .swiper-button-prev {
    background-color: rgba(193, 129, 68, 0.9);
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin-top: -30px;
    color: white;
    font-size: 20px;
    font-weight: bold;
    transition: all 0.3s ease;
    border: 2px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
}

.mySwiper .swiper-button-next:hover,
.mySwiper .swiper-button-prev:hover {
    background-color: var(--color-secondary);
    transform: scale(1.1);
    box-shadow: 0 5px 15px rgba(193, 129, 68, 0.4);
}

.mySwiper .swiper-button-next::after,
.mySwiper .swiper-button-prev::after {
    font-size: 18px;
}

/* Responsive para mySwiper */
@media (max-width: 768px) {
    .triangle-nav {
        display: flex;
        font-size: 1.8rem;
        color: #c18144;
        font-weight: bold;
        background-color: transparent;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        align-items: center;
        justify-content: center;
        box-shadow: 0 0px 0px rgba(0, 0, 0, 0.15);
        border: 0px solid rgba(193, 129, 68, 0.2);
    }
    
    .triangle-left {
        left: 5px; /* Más pegado al extremo izquierdo */
    }
    
    .triangle-right {
        right: 5px; /* Más pegado al extremo derecho */
    }
    
    .mySwiper .swiper-slide {
        width: auto;
    }
    
    .swiper-container-wrapper {
        position: relative;
        max-width: 100%;
        margin: 0 auto;
        padding: 0 10px; /* Reducir padding para dar más espacio a las flechas */
    }
    
    .custom-card {
        padding: 2rem 1.5rem;
        min-height: 300px;
        width: 280px; /* Ancho ajustado para mejor centrado */
        margin: 0 auto; /* Centrar las tarjetas */
    }
    
    .custom-card img {
        width: 80px;
        height: 80px;
        margin-bottom: 1.5rem;
    }
    
    .custom-card p {
        font-size: 1.1rem;
        text-align: center;
    }
    
    /* Centrar el swiper de desarrollo */
    .mySwiper {
        text-align: center;
    }
    
    .mySwiper .swiper-wrapper {
        align-items: center;
    }
    
    .mySwiper .swiper-button-next,
    .mySwiper .swiper-button-prev {
        width: 50px;
        height: 50px;
        margin-top: -25px;
    }
}

@media (max-width: 480px) {
    .mySwiper .swiper-slide {
        width: auto;
    }
    
    .custom-card {
        padding: 1.5rem 1rem;
        min-height: 250px;
        width: 250px; /* Ancho más reducido para móviles pequeños */
    }
    
    .custom-card img {
        width: 60px;
        height: 60px;
        margin-bottom: 1rem;
    }
    
    .custom-card p {
        font-size: 1rem;
    }
}

/* =====================================
   SEXTA SECCIÓN - MACROLOTE
   ===================================== */

.section-macrolote {
    width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.macrolote-image {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
}

/* =====================================
   SECCIÓN BOTÓN ETAPA 1
   ===================================== */

.etapa-button-section {
    background-color: var(--color-background);
    padding: 40px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-etapa-custom {
    background-color: #c18144;
    border: none;
    padding: 20px 50px;
    font-family: 'Maharlika-Regular', serif;
    font-size: 1.5rem;
    font-weight: normal;
    color: var(--color-white);
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(193, 129, 68, 0.3);
    position: relative;
    overflow: hidden;
}

.btn-etapa-custom:hover {
    background-color: #a66d35;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(193, 129, 68, 0.4);
}

.btn-etapa-custom:active {
    background-color: #8f5a29;
    transform: translateY(-1px);
}

/* =====================================
   SECCIÓN 8 - GALERÍA SWIPER
   ===================================== */

.section-gallery {
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
    z-index: 8;
}

.gallerySwiper {
    width: 100%;
    height: 100%;
}

.gallerySwiper .swiper-slide {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.slide-content {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gallery-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Navegación personalizada */
.gallery-button-next,
.gallery-button-prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gallery-button-next {
    right: 30px;
}

.gallery-button-prev {
    left: 30px;
}

.gallery-button-next:hover,
.gallery-button-prev:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.gallery-button-next::after,
.gallery-button-prev::after {
    font-size: 20px;
    font-weight: bold;
}

/* Paginación personalizada */
.gallery-pagination {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 15px;
}

.gallery-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    opacity: 1;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid rgba(255, 255, 255, 0.3);
}

.gallery-pagination .swiper-pagination-bullet-active {
    background: #DAA520;
    border-color: #DAA520;
    transform: scale(1.3);
    box-shadow: 0 0 15px rgba(218, 165, 32, 0.6);
}

/* Responsive para galería */
@media (max-width: 768px) {
    .gallery-button-next,
    .gallery-button-prev {
        width: 50px;
        height: 50px;
    }
    
    .gallery-button-next {
        right: 20px;
    }
    
    .gallery-button-prev {
        left: 20px;
    }
    
    .gallery-button-next::after,
    .gallery-button-prev::after {
        font-size: 16px;
    }
    
    .gallery-pagination {
        bottom: 20px;
        gap: 10px;
    }
    
    .gallery-pagination .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
    }
}

@media (max-width: 480px) {
    .gallery-button-next,
    .gallery-button-prev {
        width: 45px;
        height: 45px;
    }
    
    .gallery-button-next {
        right: 15px;
    }
    
    .gallery-button-prev {
        left: 15px;
    }
    
    .gallery-button-next::after,
    .gallery-button-prev::after {
        font-size: 14px;
    }
    
    .gallery-pagination .swiper-pagination-bullet {
        width: 8px;
        height: 8px;
    }
}

/* =====================================
   SECCIÓN 9 - CONTACTO Y FOOTER
   ===================================== */

/* Video Modal Fullscreen tweaks */
.video-modal .modal-dialog {
    margin: 0;
    max-width: none;
}
.video-modal .modal-content {
    background-color: #000;
}
.video-modal .modal-body {
    padding: 0;
}
.video-modal video {
    display: block;
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.section-contact-footer {
    background-image: url('../05-Sección-5/fondo1.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    min-height: 100vh;
    position: relative;
    padding: 80px 0 0 0; /* Sin padding bottom para conectar con footer */
    overflow: hidden;
    z-index: 9;
}

/* Hoja superior asomándose */
.contact-leaf-top {
    position: absolute;
    top: -50px;
    right: 10%;
    max-width: 200px;
    width: auto;
    height: auto;
    z-index: 10;
    opacity: 0.9;
    transform: rotate(15deg);
}

/* Columna de texto */
.contact-text-column {
    position: relative;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 70vh;
}

/* Hoja dorada flotante */
.contact-leaf-floating {
position: absolute;
    top: -121px;
    left: 69px;
    max-width: 18.2rem;
    width: auto;
    height: auto;
    z-index: 2;
    opacity: 0.95;
    transform: rotate(-15deg);
}

/* Contenido del texto */
.contact-text-content {
    position: relative;
    z-index: 3;
    padding-left: 2rem;
}

.contact-phrase {
    font-family: 'Maharlika-Regular', sans-serif;
    font-size: 2.3rem;
    color: #12238b; /* Azul corporativo */
    margin-bottom: 0.5rem;
    font-weight: 400;
    line-height: 1.2;
}

.contact-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2.6rem;
    color: #12238b; /* Azul corporativo */
    margin-bottom: 0.5rem;
    font-weight: normal;
    line-height: 1.1;
}

.contact-subtitle {
    font-family: 'Candelia', serif;
    font-size: 2rem;
    color: #c18144; /* Ocre corporativo */
    margin-bottom: 0;
    font-weight: normal;
    font-style: italic;
    line-height: 1.2;
}

/* Columna del formulario */
.contact-form-column {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

/* Card del formulario */
.contact-form-card {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 15px;
    padding: 2.5rem;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    max-width: 500px;
    width: 100%;
}

.form-title {
    font-family: 'Faktum-Regular', sans-serif;
    font-size: 1.5rem;
    color: #c18144; /* Ocre corporativo */
    margin-bottom: 2rem;
    text-align: left;
    font-weight: 600;
}

/* Estilos del formulario */
.contact-form .form-label {
    font-family: 'Faktum-Regular', sans-serif;
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 0.5rem;
    font-weight: 500;
}

.contact-form .form-control {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-family: 'Faktum-Regular', sans-serif;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0.9);
}

.contact-form .form-control:focus {
    border-color: #c18144;
    box-shadow: 0 0 0 0.2rem rgba(193, 129, 68, 0.25);
    background: white;
}

.contact-form textarea.form-control {
    resize: vertical;
    min-height: 100px;
}

/* Botón del formulario */
.btn-contact-custom {
    background: linear-gradient(135deg, #c18144, #d4af37);
    color: white;
    border: none;
    padding: 12px 30px;
    font-size: 0.9rem;
    font-family: 'Faktum-Regular', sans-serif;
    font-weight: 600;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    width: 100%;
    box-shadow: 0 4px 15px rgba(193, 129, 68, 0.3);
}

.btn-contact-custom:hover {
    background: linear-gradient(135deg, #d4af37, #c18144);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(193, 129, 68, 0.4);
}

/* =====================================
   NAVBAR ADDITIONAL STYLES
   ===================================== */

/* Asegurar que todas las secciones tengan espacio para el navbar fijo */
section {
    scroll-margin-top: 80px;
}

/* Mejorar el logo en dispositivos móviles */
@media (max-width: 480px) {
    .nav-logo-img {
        height: 45px;
    }
    
    .navbar-custom.scrolled .nav-logo-img {
        height: 40px;
    }
    
    .navbar-custom {
        padding: 12px 0;
    }
    
    .navbar-custom.scrolled {
        padding: 8px 0;
    }
}

/* Animaciones para el menú */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.navbar-mobile.active {
    animation: fadeInDown 0.3s ease;
}

/* Mejorar la visibilidad del menú en dispositivos con alta densidad de píxeles */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .navbar-custom {
        border-bottom: 0.5px solid rgba(255, 255, 255, 0.2);
    }
}

/* Efectos hover mejorados para los botones del navbar */
.btn-nav-secondary:focus,
.btn-nav-primary:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(193, 129, 68, 0.3);
}

/* Mejorar accesibilidad */
.nav-link:focus,
.nav-link-mobile:focus {
    outline: 2px solid var(--color-secondary);
    outline-offset: 2px;
}

/* Asegurar que el menú no interfiera con otros elementos de z-index alto */
.navbar-custom {
    z-index: 1000;
}

.navbar-mobile {
    z-index: 999;
}

/* =====================================
   FOOTER
   ===================================== */

.footer-section {
    background-image: url('../05-Sección-5/fondo1.png');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-attachment: scroll;
    padding: 60px 0 40px 0;
    position: relative;
    z-index: 8;
    /* Continuación del fondo de la sección 9 */
}

/* =====================================
   HECTÁREAS - SECCIÓN PILARES
   ===================================== */
.hectareas-pilares {
    background: transparent; /* usa el fondo de la sección 3 */
    position: relative;
    padding: 20px 0 40px;
}

/* =====================================
   HECTÁREAS - SECCIÓN ESENCIAL (post lotificación)
   ===================================== */
.section-esencial {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 110px 0 90px;
    position: relative;
}
.esencial-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2.4rem;
    color: var(--color-primary);
    line-height: 1.15;
    letter-spacing: .5px;
    margin-bottom: 24px;
}
.esencial-subtitle {
    font-family: var(--font-light);
    font-size: 1rem;
    color: var(--color-text);
    max-width: 760px;
    margin: 0 auto 10px;
    line-height: 1.5;
}
.hectSwiper-esencial { max-width: 1080px; margin: 10px auto 0; }
.hectSwiper-esencial .swiper-slide { display:flex; justify-content:center; }
.esencial-card {
    background: #fff;
    border-radius: 10px;
    padding: 46px 38px 40px;
    width: 520px;
    box-shadow: 0 6px 18px rgba(0,0,0,.12);
    position: relative;
    text-align: center;
}
.esencial-icon-circle {
    width: 115px;
    height: 115px;
    border: 5px solid #c18144;
    border-radius: 50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin: 0 auto 18px;
    background:#fff;
    box-shadow: 0 4px 10px rgba(0,0,0,.08);
}
.esencial-icon-circle img { width:65%; height:65%; object-fit:contain; }
.esencial-text {
    font-family: var(--font-primary);
    font-size: .95rem;
    line-height: 1.45;
    color: var(--color-text);
    margin: 0;
}
.esencial-prev, .esencial-next {
    color: #c1c1c1;
    width: 42px; height: 42px;
}
.esencial-prev::after, .esencial-next::after { font-size: 20px; }
.esencial-phrase {
    font-family: var(--font-primary);
    font-size: 1rem;
    color: var(--color-secondary);
    margin: 50px 0 18px;
}
.btn-esencial-cta {
    background: #c18144;
    color:#fff;
    border:0;
    font-family: var(--font-bold);
    font-size:.7rem;
    padding:10px 34px;
    letter-spacing:.5px;
    border-radius:4px;
    transition: var(--transition);
}
.btn-esencial-cta:hover { background:#a86934; }
@media (max-width: 992px){
    .esencial-title { font-size:2.1rem; }
    .esencial-card { width: 420px; padding:40px 32px 36px; }
}
@media (max-width: 768px){
    .esencial-title { font-size:1.9rem; }
    .esencial-card { width:100%; max-width: 460px; }
    .esencial-icon-circle { width:95px; height:95px; border-width:4px; }
}
.pilares-kicker {
    font-family: 'Maharlika-Regular', serif;
    font-size: 2.2rem;
    color: var(--color-primary);
    letter-spacing: 1px;
    margin: 0;
}
.pilares-script {
    font-family: 'Candelia', serif;
    font-size: 3rem;
    color: var(--color-secondary);
    line-height: 1;
    margin-top: -6px;
    margin-bottom: 18px;
}
.pilares-grid {
    max-width: 1200px;
    margin: 0 auto;
}
.pilar-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 22px 22px;
    text-align: center;
    box-shadow: 0 10px 22px rgba(0,0,0,0.10);
    transition: transform .2s ease, box-shadow .2s ease;
    height: 100%;
    width: 100%;
    min-height: 160px;
}
.pilar-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(0,0,0,0.12);
}
.pilar-icon {
    width: 80px;
    height: 80px;
    object-fit: contain;
    margin-bottom: 12px;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,.12));
}
.pilar-title {
    font-family: 'Maharlika-Regular', serif;
    font-size: 1.25rem;
    color: var(--color-secondary);
    letter-spacing: 1px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.pilar-text {
    font-family: var(--font-light);
    font-size: 0.95rem;
    color: var(--color-text);
    line-height: 1.5;
    margin: 0;
}

/* Grid ancho similar al mockup */
.pilares-grid .col-lg-6 { max-width: 520px; }
.pilares-grid { gap: 18px 24px; }
.hectareas-sec3 .container { max-width: 1120px; }

@media (max-width: 992px) {
    .hectareas-pilares { padding: 70px 0; }
    .pilares-script { font-size: 2.6rem; }
}
@media (max-width: 768px) {
    .hectareas-pilares { padding: 60px 0; }
    .pilares-kicker { font-size: 1.6rem; }
    .pilares-script { font-size: 2.2rem; }
    .pilar-card { padding: 22px 18px; }
    .pilar-icon { width: 70px; height: 70px; }
}

/* Logo del footer */
.footer-logo {
    margin-bottom: 3rem;
}

.footer-isotipo {
    max-width: 80px;
    width: auto;
    height: auto;
    opacity: 0.9;
}

/* Contenido del footer */
.footer-content {
    margin-bottom: 3rem;
}

.footer-column {
    margin-bottom: 2rem;
}

.footer-column-title {
    font-family: 'Faktum-Regular', sans-serif;
    font-size: 1.1rem;
    color: #12238b; /* Azul corporativo */
    margin-bottom: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 0.5rem;
}

.footer-link {
    font-family: 'Faktum-Regular', sans-serif;
    font-size: 0.95rem;
    color: #666;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-link:hover {
    color: #c18144; /* Ocre corporativo */
    text-decoration: none;
}

/* Bottom del footer */
.footer-bottom {
    border-top: 1px solid rgba(18, 35, 139, 0.1);
    padding-top: 2rem;
}

.footer-copyright {
    font-family: 'Faktum-Light', sans-serif;
    font-size: 0.85rem;
    color: #888;
    margin: 0;
    line-height: 1.5;
}

.footer-copyright .footer-link {
    color: #888;
    font-size: 0.85rem;
}

.footer-copyright .footer-link:hover {
    color: #c18144;
}

/* Responsive para sección 9 y footer */
@media (max-width: 768px) {
    .section-contact-footer {
        padding: 60px 0 0 0;
        background-attachment: scroll;
    }
    
    .contact-leaf-top {
        max-width: 180px;
        top: -60px;
        right: 10%;
        z-index: 3;
    }
    
    .contact-text-column {
        padding: 1rem;
        min-height: auto;
        margin-bottom: 2rem;
        position: relative;
    }
    
    .contact-leaf-floating {
        max-width: 150px;
        top: 20px;
        right: -30px;
        left: auto;
        z-index: 2;
    }
    
    .contact-text-content {
        padding-left: 1rem;
    }
    
    .contact-phrase {
        font-size: 1.4rem;
    }
    
    .contact-title {
        font-size: 2.5rem;
        line-height: 1.1;
    }
    
    .contact-subtitle {
        font-size: 1.5rem;
    }
    
    .contact-form-column {
        padding: 1rem;
    }
    
    .contact-form-card {
        padding: 2rem;
    }
    
    .form-title {
        font-size: 1.3rem;
        margin-bottom: 1.5rem;
    }
    
    .footer-section {
        padding: 40px 0 30px 0;
    }
    
    .footer-logo {
        margin-bottom: 2rem;
    }
    
    .footer-isotipo {
        max-width: 60px;
    }
    
    .footer-content {
        margin-bottom: 2rem;
    }
    
    .footer-column-title {
        font-size: 1rem;
    }
    
    .footer-link {
        font-size: 0.9rem;
    }
    
    .footer-copyright {
        font-size: 0.8rem;
        text-align: center;
        padding: 0 1rem;
    }
}

@media (max-width: 480px) {
    .contact-leaf-top {
        max-width: 80px;
        top: -20px;
    }
    
    .contact-leaf-floating {
        max-width: 146px;
        top: 15px;
        right: -25px;
        left: auto;
    }
    
    .contact-phrase {
        font-size: 1.2rem;
    }
    
    .contact-title {
        font-size: 2rem;
    }
    
    .contact-subtitle {
        font-size: 1.3rem;
    }
    
    .contact-form-card {
        padding: 1.5rem;
        margin: 0 0.5rem;
    }
    
    .form-title {
        font-size: 1.2rem;
    }
    
    .footer-isotipo {
        max-width: 50px;
    }
    
    .footer-column-title {
        font-size: 0.95rem;
    }
    
    .footer-link {
        font-size: 0.85rem;
    }
    
    .footer-copyright {
        font-size: 0.75rem;
        line-height: 1.4;
    }
}