/* Fuente Corporativa */
        @font-face {
            font-family: 'DIN Next LT Arabic';
            src: local('DIN Next LT Arabic Bold'), local('DINNextLTArabic-Bold');
            font-weight: 700;
            font-style: normal;
            font-display: swap;
        }

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

        :root {
            --primary-blue: #1e4a7a;
            --secondary-blue: #2e75b6;
            --light-blue: #e8f1f8;
            --accent-gold: #c9a227;
            --light-gold: #f5ead8;
            --white: #ffffff;
            --off-white: #fafbfc;
            --text-gray: #4a5568;
            --medium-gray: #6c757d;
            --dark-gray: #2c3e50;
            --transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: 'Outfit', sans-serif;
            color: var(--text-gray);
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Navbar */
        .navbar {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            background: var(--white);
            padding: 1rem 0;
            z-index: 1000;
            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);
            transition: var(--transition);
        }

        .navbar.scrolled {
            padding: 0.7rem 0;
            box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
        }

        .nav-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .logo img {
            height: 45px;
            width: auto;
            transition: var(--transition);
        }

        .navbar.scrolled .logo img {
            height: 38px;
        }

        .nav-links {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }

        .nav-links a {
            color: var(--dark-gray);
            text-decoration: none;
            font-weight: 500;
            transition: var(--transition);
        }

        .nav-links a:hover {
            color: var(--primary-blue);
        }

        /* Social Links en Navbar - Discretos */
        .social-nav {
            display: flex;
            gap: 0.75rem;
            align-items: center;
            margin-left: 1rem;
            padding-left: 1rem;
            border-left: 1px solid #e0e0e0;
        }

        .social-link {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: var(--off-white);
            color: var(--text-gray);
            transition: var(--transition);
        }

        .social-link:hover {
            background: var(--primary-blue);
            color: var(--white);
            transform: translateY(-2px);
        }

        .social-link:hover svg {
            fill: var(--white);
        }

        .social-link svg {
            width: 16px;
            height: 16px;
            transition: var(--transition);
        }

        .menu-toggle {
            display: none;
            flex-direction: column;
            cursor: pointer;
            gap: 5px;
            position: relative;
            z-index: 1001;
        }

        .menu-toggle span {
            width: 25px;
            height: 3px;
            background: var(--primary-blue);
            border-radius: 3px;
            transition: var(--transition);
        }

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

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

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

        /* Hero/Inicio */
        #inicio {
            margin-top: 80px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fafb 100%);
            padding: 5rem 2rem;
        }

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

        .hero-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
            margin-bottom: 5rem;
        }

        .hero-badge {
            display: inline-block;
            background: var(--light-gold);
            border: 2px solid var(--accent-gold);
            color: var(--accent-gold);
            padding: 0.5rem 1.2rem;
            border-radius: 30px;
            font-size: 0.75rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 1.5rem;
        }

        h1 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            font-size: clamp(2.5rem, 5vw, 3.5rem);
            color: var(--dark-gray);
            font-weight: 800;
            line-height: 1.1;
            margin-bottom: 1.5rem;
            letter-spacing: -1.5px;
        }

        h1 .highlight {
            color: var(--primary-blue);
        }

        .lead-text {
            font-size: 1.1rem;
            color: var(--medium-gray);
            margin-bottom: 2rem;
            line-height: 1.7;
        }

        .hero-buttons {
            display: flex;
            gap: 1rem;
            flex-wrap: wrap;
        }

        .btn {
            padding: 0.9rem 2rem;
            border-radius: 30px;
            text-decoration: none;
            font-weight: 600;
            transition: var(--transition);
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }

        .btn-primary {
            background: var(--primary-blue);
            color: var(--white);
            box-shadow: 0 4px 15px rgba(30, 74, 122, 0.25);
        }

        .btn-primary:hover {
            background: var(--secondary-blue);
            transform: translateY(-2px);
        }

        .btn-secondary {
            background: var(--white);
            color: var(--primary-blue);
            border: 2px solid var(--primary-blue);
        }

        .btn-secondary:hover {
            background: var(--primary-blue);
            color: var(--white);
        }

        .hero-image img {
            width: 100%;
            height: auto;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(30, 74, 122, 0.2);
            object-fit: cover;
            max-height: 550px;
        }

        /* Section Styling */
        section {
            padding: 5rem 2rem;
        }

        .section-header {
            text-align: center;
            margin-bottom: 4rem;
        }

        .section-subtitle {
            color: var(--accent-gold);
            font-weight: 600;
            font-size: 0.85rem;
            text-transform: uppercase;
            letter-spacing: 2px;
            margin-bottom: 0.75rem;
        }

        h2 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            font-size: clamp(2rem, 4vw, 3rem);
            color: var(--primary-blue);
            font-weight: 700;
            margin-bottom: 1rem;
            letter-spacing: -1px;
        }

        h3 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            font-size: 1.8rem;
            color: var(--primary-blue);
            margin-bottom: 1rem;
            font-weight: 700;
        }

        /* Quiénes Somos */
        .about-content {
            max-width: 900px;
            margin: 0 auto 3rem;
        }

        .about-content p {
            font-size: 1.05rem;
            line-height: 1.8;
            margin-bottom: 1.5rem;
            color: var(--text-gray);
        }

        .mission-vision {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 3rem;
            margin-bottom: 3rem;
        }

        .mv-card {
            background: var(--off-white);
            padding: 2.5rem;
            border-radius: 15px;
            border-left: 4px solid var(--accent-gold);
        }

        .mv-card h3 {
            margin-bottom: 1rem;
        }

        .mv-card p {
            color: var(--text-gray);
            line-height: 1.8;
        }

        /* Valores */
        .values-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
        }

        .value-card {
            background: var(--white);
            padding: 2rem;
            border-radius: 12px;
            border: 1px solid #e9ecef;
            transition: var(--transition);
            position: relative;
            overflow: hidden;
        }

        /* Siluetas de animales de fondo */
        .value-card::before {
            content: '';
            position: absolute;
            bottom: -30px;
            right: -30px;
            width: 150px;
            height: 150px;
            background-size: contain;
            background-repeat: no-repeat;
            opacity: 0.04;
            pointer-events: none;
            transition: var(--transition);
        }

        /* Perro */
        .value-card:nth-child(1)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%231e4a7a' d='M309.6 158.5L332.7 19.8C334.6 8.4 344.5 0 356.1 0c7.5 0 14.5 3.5 19 9.5L392 32h52.1c12.7 0 24.9 5.1 33.9 14.1L496 64h56c13.3 0 24 10.7 24 24v24c0 44.2-35.8 80-80 80H464 448 426.7l-5.1 30.5-112-64zM416 256.1L416 480c0 17.7-14.3 32-32 32H352c-17.7 0-32-14.3-32-32V364.8c-24 12.3-51.2 19.2-80 19.2s-56-6.9-80-19.2V480c0 17.7-14.3 32-32 32H96c-17.7 0-32-14.3-32-32V249.8c-28.8-10.9-51.4-35.3-59.2-66.5L1 167.8c-4.3-17.1 6.1-34.5 23.3-38.8s34.5 6.1 38.8 23.3l3.9 15.5C70.5 182 83.3 192 98 192h30 16H303.8L416 256.1zM464 80a16 16 0 1 0 -32 0 16 16 0 1 0 32 0z'/%3E%3C/svg%3E");
        }

        /* Gato */
        .value-card:nth-child(2)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%231e4a7a' d='M320 192h17.1c22.1 38.3 63.5 64 110.9 64c11 0 21.8-1.4 32-4v4 32V480c0 17.7-14.3 32-32 32s-32-14.3-32-32V339.2L280 448h56c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-53 0-96-43-96-96V192.5c0-16.1-12-29.8-28-31.8l-7.9-1c-17.5-2.2-30-18.2-27.8-35.7s18.2-30 35.7-27.8l7.9 1c48 6 84.1 46.8 84.1 95.3v85.3c34.4-51.7 93.2-85.8 160-85.8zm160 26.5v0c-10 3.5-20.8 5.5-32 5.5c-28.4 0-54-12.4-71.6-32h0c-3.7-4.1-7-8.5-9.9-13.2C357.3 164 352 146.6 352 128v0V32 12 10.7C352 4.8 356.7 .1 362.6 0h.2c3.3 0 6.4 1.6 8.4 4.2l0 .1L384 21.3l27.2 36.3L416 64h64l4.8-6.4L512 21.3 524.8 4.3l0-.1c2-2.6 5.1-4.2 8.4-4.2h.2C539.3 .1 544 4.8 544 10.7V12 32v96c0 17.3-4.6 33.6-12.6 47.6c-11.3 19.8-29.6 35.2-51.4 42.9zM432 128a16 16 0 1 0 -32 0 16 16 0 1 0 32 0zm48 16a16 16 0 1 0 0-32 16 16 0 1 0 0 32z'/%3E%3C/svg%3E");
        }

        /* Corazón con cruz médica */
        .value-card:nth-child(3)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%231e4a7a' d='M228.3 469.1L47.6 300.4c-4.2-3.9-8.2-8.1-11.9-12.4h87c22.6 0 43-13.6 51.7-34.5l10.5-25.2 49.3 109.5c3.8 8.5 12.1 14 21.4 14.1s17.8-5 22-13.3L320 253.7l1.7 3.4c9.5 19 28.9 31 50.1 31H476.3c-3.7 4.3-7.7 8.5-11.9 12.4L283.7 469.1c-7.5 7-17.4 10.9-27.7 10.9s-20.2-3.9-27.7-10.9zM503.7 240h-132c-3 0-5.8-1.7-7.2-4.4l-23.2-46.3c-4.1-8.1-12.4-13.3-21.5-13.3s-17.4 5.1-21.5 13.3l-41.4 82.8L205.9 158.2c-3.9-8.7-12.7-14.3-22.2-14.1s-18.1 5.9-21.8 14.8l-31.8 76.3c-1.2 3-4.2 4.9-7.4 4.9H16c-2.6 0-5 .4-7.3 1.1C3 225.2 0 208.2 0 190.9v-5.8c0-69.9 50.5-129.5 119.4-141C165 36.5 211.4 51.4 244 84l12 12 12-12c32.6-32.6 79-47.5 124.6-39.9C461.5 55.6 512 115.2 512 185.1v5.8c0 16.9-2.8 33.5-8.3 49.1z'/%3E%3C/svg%3E");
        }

        /* Estrella (calidad) */
        .value-card:nth-child(4)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%231e4a7a' d='M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z'/%3E%3C/svg%3E");
        }

        /* Libro (mejora continua) */
        .value-card:nth-child(5)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%231e4a7a' d='M96 0C43 0 0 43 0 96V416c0 53 43 96 96 96H384h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V384c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H384 96zm0 384H352v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z'/%3E%3C/svg%3E");
        }

        /* Pata de mascota (sensibilidad) */
        .value-card:nth-child(6)::before {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%231e4a7a' d='M226.5 92.9c14.3 42.9-.3 86.2-32.6 96.8s-70.1-15.6-84.4-58.5-1.1-86.2 31.2-96.8 70.1 15.6 84.4 58.5zM100.4 198.6c18.9 32.4 14.3 70.1-10.2 84.1s-59.7-.9-78.5-33.3-14.3-70.1 10.2-84.1 59.7 .9 78.5 33.3zM69.2 401.2C121.6 259.9 214.7 224 256 224s134.4 35.9 186.8 177.2c3.6 9.7 5.2 20.1 5.2 30.5v1.6c0 25.8-20.9 46.7-46.7 46.7c-11.5 0-22.9-1.4-34-4.2l-88-22c-15.3-3.8-31.3-3.8-46.6 0l-88 22c-11.1 2.8-22.5 4.2-34 4.2C84.9 480 64 459.1 64 433.3v-1.6c0-10.4 1.6-20.8 5.2-30.5zM421.8 282.7c-24.5-14-29.1-51.7-10.2-84.1s54-47.3 78.5-33.3 29.1 51.7 10.2 84.1-54 47.3-78.5 33.3zM310.1 189.7c-32.3-10.6-46.9-53.9-32.6-96.8s52.1-69.1 84.4-58.5 46.9 53.9 32.6 96.8-52.1 69.1-84.4 58.5z'/%3E%3C/svg%3E");
        }

        .value-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        }

        .value-card:hover::before {
            opacity: 0.08;
            transform: scale(1.1) rotate(5deg);
        }

        .value-icon {
            width: 60px;
            height: 60px;
            background: var(--light-blue);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.8rem;
            margin-bottom: 1.5rem;
        }

        .value-card h4 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            color: var(--primary-blue);
            margin-bottom: 0.75rem;
            font-weight: 600;
        }

        .value-card p {
            color: var(--medium-gray);
            font-size: 0.95rem;
            line-height: 1.7;
        }

        /* Galería */
        #galeria {
            background: var(--white);
        }

        .gallery-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-auto-rows: 280px;
            gap: 1.5rem;
            margin-top: 3rem;
        }

        .gallery-item {
            position: relative;
            overflow: hidden;
            border-radius: 15px;
            cursor: pointer;
            transition: var(--transition);
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
        }

        /* Bento Grid Layout - Diseño asimétrico moderno */
        .gallery-item:nth-child(1) {
            grid-column: span 2;
            grid-row: span 2;
        }

        .gallery-item:nth-child(2) {
            grid-column: span 2;
        }

        .gallery-item:nth-child(3) {
            grid-column: span 2;
        }

        .gallery-item:nth-child(4) {
            grid-column: span 2;
            grid-row: span 2;
        }

        .gallery-item:nth-child(5) {
            grid-column: span 2;
        }

        .gallery-item:nth-child(6) {
            grid-column: span 2;
        }

        .gallery-item:nth-child(7) {
            grid-column: span 2;
        }

        .gallery-item:nth-child(8) {
            grid-column: span 2;
        }

        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: var(--transition);
        }

        .gallery-item:hover img {
            transform: scale(1.05);
        }

        .gallery-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(to top, rgba(30, 74, 122, 0.9), transparent);
            padding: 1.5rem;
            transform: translateY(100%);
            transition: var(--transition);
        }

        .gallery-item:hover .gallery-overlay {
            transform: translateY(0);
        }

        .gallery-overlay h4 {
            color: var(--white);
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            font-size: 1.1rem;
            font-weight: 600;
            margin-bottom: 0.25rem;
        }

        .gallery-overlay p {
            color: rgba(255, 255, 255, 0.9);
            font-size: 0.85rem;
        }

        /* Lightbox Modal */
        .lightbox {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.95);
            z-index: 9999;
            align-items: center;
            justify-content: center;
            padding: 2rem;
        }

        .lightbox.active {
            display: flex;
        }

        .lightbox img {
            max-width: 90%;
            max-height: 90%;
            border-radius: 8px;
            box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5);
        }

        .lightbox-close {
            position: absolute;
            top: 2rem;
            right: 2rem;
            width: 50px;
            height: 50px;
            background: var(--white);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            font-size: 1.5rem;
            color: var(--primary-blue);
            transition: var(--transition);
        }

        .lightbox-close:hover {
            transform: rotate(90deg);
            background: var(--accent-gold);
            color: var(--white);
        }

        /* Servicios */
        #servicios {
            background: var(--off-white);
        }

        .services-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
        }

        .service-card {
            background: var(--white);
            padding: 2.5rem;
            border-radius: 15px;
            border: 1px solid #e9ecef;
            transition: var(--transition);
            position: relative;
            overflow: hidden;
        }

        .service-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 3px;
            background: var(--accent-gold);
            transform: scaleX(0);
            transform-origin: left;
            transition: var(--transition);
        }

        .service-card::after {
            content: '';
            position: absolute;
            bottom: -20px;
            right: -20px;
            width: 120px;
            height: 120px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23e8f1f8' d='M226.5 92.9c14.3 42.9-.3 86.2-32.6 96.8s-70.1-15.6-84.4-58.5-1.1-86.2 31.2-96.8 70.1 15.6 84.4 58.5zM100.4 198.6c18.9 32.4 14.3 70.1-10.2 84.1s-59.7-.9-78.5-33.3-14.3-70.1 10.2-84.1 59.7 .9 78.5 33.3zM69.2 401.2C121.6 259.9 214.7 224 256 224s134.4 35.9 186.8 177.2c3.6 9.7 5.2 20.1 5.2 30.5v1.6c0 25.8-20.9 46.7-46.7 46.7c-11.5 0-22.9-1.4-34-4.2l-88-22c-15.3-3.8-31.3-3.8-46.6 0l-88 22c-11.1 2.8-22.5 4.2-34 4.2C84.9 480 64 459.1 64 433.3v-1.6c0-10.4 1.6-20.8 5.2-30.5zM421.8 282.7c-24.5-14-29.1-51.7-10.2-84.1s54-47.3 78.5-33.3 29.1 51.7 10.2 84.1-54 47.3-78.5 33.3zM310.1 189.7c-32.3-10.6-46.9-53.9-32.6-96.8s52.1-69.1 84.4-58.5 46.9 53.9 32.6 96.8-52.1 69.1-84.4 58.5z'/%3E%3C/svg%3E");
            background-size: contain;
            background-repeat: no-repeat;
            opacity: 1;
            pointer-events: none;
            transition: var(--transition);
        }

        .service-card:hover::before {
            transform: scaleX(1);
        }

        .service-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        }

        .service-card:hover::after {
            opacity: 0.5;
            transform: scale(1.1) rotate(10deg);
        }

        .service-icon {
            width: 70px;
            height: 70px;
            background: var(--light-blue);
            border-radius: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2rem;
            margin-bottom: 1.5rem;
            position: relative;
            z-index: 1;
        }

        .service-card h4 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            font-size: 1.3rem;
            color: var(--primary-blue);
            margin-bottom: 1rem;
            font-weight: 700;
            position: relative;
            z-index: 1;
        }

        .service-card p {
            color: var(--medium-gray);
            line-height: 1.7;
            font-size: 0.95rem;
            position: relative;
            z-index: 1;
        }

        /* Contacto */
        #contacto {
            background: var(--white);
        }

        .contact-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 3rem;
        }

        .contact-info {
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }

        .contact-item {
            display: flex;
            gap: 1.5rem;
            padding: 1.5rem;
            background: var(--off-white);
            border-radius: 12px;
            transition: var(--transition);
        }

        .contact-item:hover {
            background: var(--light-blue);
        }

        .contact-icon {
            width: 60px;
            height: 60px;
            background: var(--light-blue);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.8rem;
            flex-shrink: 0;
        }

        .contact-details h4 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            color: var(--primary-blue);
            margin-bottom: 0.5rem;
            font-weight: 600;
        }

        .contact-details p,
        .contact-details a {
            color: var(--text-gray);
            text-decoration: none;
            line-height: 1.6;
        }

        .contact-details a:hover {
            color: var(--primary-blue);
        }

        .map-container {
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            height: 100%;
            min-height: 450px;
        }

        .map-container iframe {
            width: 100%;
            height: 100%;
            border: 0;
        }

        /* Footer */
        footer {
            background: var(--primary-blue);
            color: var(--white);
            padding: 3rem 2rem 2rem;
        }

        .footer-grid {
            max-width: 1200px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 3rem;
            margin-bottom: 2rem;
        }

        .footer-section h3 {
            font-family: 'DIN Next LT Arabic', 'Montserrat', sans-serif;
            margin-bottom: 1.5rem;
            font-weight: 700;
        }

        .footer-section p,
        .footer-section a {
            opacity: 0.9;
            line-height: 1.8;
            color: var(--white);
            text-decoration: none;
        }

        .footer-section a:hover {
            opacity: 1;
            text-decoration: underline;
        }

        .footer-section ul {
            list-style: none;
        }

        .footer-section li {
            margin-bottom: 0.8rem;
        }

        /* Redes Sociales en Footer */
        .footer-social {
            display: flex;
            gap: 1rem;
            margin-top: 1.5rem;
        }

        .footer-social-link {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            color: var(--white);
            transition: var(--transition);
        }

        .footer-social-link:hover {
            background: var(--accent-gold);
            transform: translateY(-3px);
        }

        .footer-social-link svg {
            width: 20px;
            height: 20px;
        }

        .footer-bottom {
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            padding-top: 2rem;
            text-align: center;
            opacity: 0.8;
        }

        /* WhatsApp Button */
        .whatsapp-btn {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 60px;
            height: 60px;
            background: #25D366;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2rem;
            color: var(--white);
            box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
            z-index: 999;
            text-decoration: none;
            animation: pulse 2s infinite;
            transition: var(--transition);
        }

        .whatsapp-btn svg {
            width: 32px;
            height: 32px;
            fill: var(--white);
        }

        .whatsapp-btn:hover {
            transform: scale(1.1);
            box-shadow: 0 6px 25px rgba(37, 211, 102, 0.5);
        }

        @keyframes pulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }

        /* Responsive */
        @media (max-width: 1100px) {
            .services-grid {
                grid-template-columns: repeat(2, 1fr);
            }

            .gallery-grid {
                grid-template-columns: repeat(2, 1fr);
                grid-auto-rows: 250px;
            }

            .gallery-item:nth-child(1),
            .gallery-item:nth-child(4) {
                grid-column: span 2;
                grid-row: span 1;
            }

            .gallery-item:nth-child(2),
            .gallery-item:nth-child(3),
            .gallery-item:nth-child(5),
            .gallery-item:nth-child(6),
            .gallery-item:nth-child(7),
            .gallery-item:nth-child(8) {
                grid-column: span 1;
                grid-row: span 1;
            }
        }

        @media (max-width: 768px) {
            .logo img {
                height: 38px;
            }

            .navbar {
                padding: 0.8rem 0;
            }

            .nav-container {
                padding: 0 1rem;
            }

            .hero-grid,
            .mission-vision,
            .contact-grid {
                grid-template-columns: 1fr;
            }

            .values-grid {
                grid-template-columns: 1fr;
            }

            .footer-grid {
                grid-template-columns: 1fr;
            }

            /* Menú móvil mejorado */
            .nav-links {
                position: fixed;
                top: 0;
                right: -100%;
                height: 100vh;
                width: 75%;
                max-width: 300px;
                background: var(--white);
                flex-direction: column;
                padding: 5rem 2rem 2rem;
                box-shadow: -5px 0 25px rgba(0, 0, 0, 0.15);
                transition: var(--transition);
                z-index: 999;
                overflow-y: auto;
                gap: 1rem;
            }

            .nav-links.active {
                right: 0;
            }

            .nav-links li {
                width: 100%;
            }

            .nav-links a {
                display: block;
                padding: 0.8rem 0;
                font-size: 1.1rem;
            }

            .menu-toggle {
                display: flex;
                z-index: 1001;
            }

            .social-nav {
                border-left: none;
                border-top: 1px solid #e0e0e0;
                padding-left: 0;
                padding-top: 1.5rem;
                margin-left: 0;
                margin-top: 1.5rem;
                justify-content: center;
                width: 100%;
            }

            /* Servicios en móvil */
            .services-grid {
                grid-template-columns: 1fr;
                gap: 1.2rem;
            }

            .service-card {
                padding: 1.8rem 1.5rem;
                display: flex;
                flex-direction: column;
                min-height: auto;
            }

            .service-icon {
                width: 60px;
                height: 60px;
                font-size: 1.8rem;
                margin-bottom: 1rem;
            }

            .service-card h4 {
                font-size: 1.15rem;
                line-height: 1.3;
                margin-bottom: 0.8rem;
            }

            .service-card p {
                font-size: 0.9rem;
                line-height: 1.6;
            }

            .service-card::after {
                width: 100px;
                height: 100px;
                bottom: -15px;
                right: -15px;
            }

            /* Hero section */
            #inicio {
                padding: 3rem 1rem;
                margin-top: 70px;
            }

            .hero-buttons {
                flex-direction: column;
            }

            .btn {
                width: 100%;
                justify-content: center;
            }

            /* Secciones generales */
            section {
                padding: 3rem 1rem;
            }

            .section-header {
                margin-bottom: 2.5rem;
            }

            h1 {
                font-size: 2rem;
                line-height: 1.2;
            }

            h2 {
                font-size: 1.8rem;
            }

            h3 {
                font-size: 1.5rem;
            }

            .gallery-grid {
                grid-template-columns: 1fr;
                grid-auto-rows: 300px;
                gap: 1rem;
            }

            .gallery-item:nth-child(1),
            .gallery-item:nth-child(2),
            .gallery-item:nth-child(3),
            .gallery-item:nth-child(4),
            .gallery-item:nth-child(5),
            .gallery-item:nth-child(6),
            .gallery-item:nth-child(7),
            .gallery-item:nth-child(8) {
                grid-column: span 1 !important;
                grid-row: span 1 !important;
            }

            .whatsapp-btn {
                width: 55px;
                height: 55px;
                bottom: 20px;
                right: 20px;
            }

            .whatsapp-btn svg {
                width: 28px;
                height: 28px;
            }

            .map-container {
                min-height: 350px;
            }
        }

        @media (max-width: 640px) {
            .nav-links {
                width: 85%;
                max-width: none;
            }

            #inicio {
                padding: 2.5rem 1rem;
            }

            section {
                padding: 2.5rem 1rem;
            }

            .service-card {
                padding: 1.5rem;
            }

            .service-icon {
                width: 55px;
                height: 55px;
                font-size: 1.6rem;
            }

            .service-card h4 {
                font-size: 1.1rem;
            }

            .service-card p {
                font-size: 0.88rem;
            }
        }