@media(max-width:767px){.elementor-31600 .elementor-element.elementor-element-53bab3cb{padding:0px 0px 0px 0px;}}/* Start custom CSS for section, class: .elementor-element-53bab3cb */:root {
                --earth-brown: #AD633E;
                --accent-blue: #4F89AF;
                --light-brown: #D4A574;
                --dark-brown: #8B4513;
                --light-blue: #7BA5C4;
                --white: #FFFFFF;
                --light-gray: #F5F5F5;
                --dark-gray: #333333;
                --success: #28a745;
                --warning: #ffc107;
                --danger: #dc3545;
            }

            #student-lodge-homepage {
                font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
                max-width: 1200px;
                margin: 0 auto;
                padding: 20px;
                background: linear-gradient(135deg, var(--light-gray) 0%, #E8E8E8 100%);
                border-radius: 10px;
                box-shadow: 0 8px 32px rgba(0,0,0,0.1);
            }
            
            /* Header styling */
            .lodge-header {
                text-align: center;
                margin-bottom: 30px;
                padding: 25px 20px;
                background: var(--dark-brown);
                border-radius: 10px;
                color: var(--white);
                box-shadow: 0 4px 16px rgba(139, 69, 19, 0.4);
                border: 1px solid #E0E0E0;
            }

            .lodge-header h1 {
                font-size: 2.5em;
                margin: 0 0 10px 0;
                font-weight: 700;
                color: var(--white);
            }

            .lodge-header p {
                font-size: 1.1em;
                margin: 0;
                color: var(--white);
                opacity: 0.9;
            }

            /* Search Section */
            .search-section {
                background: var(--white);
                border-radius: 10px;
                padding: 20px;
                margin-bottom: 20px;
                box-shadow: 0 4px 16px rgba(0,0,0,0.1);
                border: 1px solid #E0E0E0;
            }

            .search-section h3 {
                margin: 0 0 15px 0;
                color: var(--dark-gray);
                font-size: 1.2em;
                font-weight: 600;
            }

            .search-bar {
                display: flex;
                gap: 10px;
                align-items: center;
            }

            .search-input {
                flex: 1;
                padding: 12px 16px;
                border: 2px solid #E0E0E0;
                border-radius: 8px;
                font-size: 1em;
                transition: all 0.3s ease;
                background: var(--white);
            }

            .search-input:focus {
                outline: none;
                border-color: var(--accent-blue);
                box-shadow: 0 0 0 3px rgba(79, 137, 175, 0.1);
            }

            .search-btn {
                padding: 12px 20px;
                background: linear-gradient(135deg, var(--accent-blue) 0%, var(--light-blue) 100%);
                color: var(--white);
                border: none;
                border-radius: 8px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .search-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(79, 137, 175, 0.4);
            }

            /* Filter Section */
            .filter-section {
                background: var(--white);
                border-radius: 10px;
                padding: 20px;
                margin-bottom: 30px;
                box-shadow: 0 4px 16px rgba(0,0,0,0.1);
                border: 1px solid #E0E0E0;
                position: relative;
            }

            .filter-toggle {
                display: none;
                background: var(--accent-blue);
                color: var(--white);
                border: none;
                padding: 12px 20px;
                border-radius: 8px;
                font-weight: 600;
                cursor: pointer;
                width: 100%;
                margin-bottom: 0;
                transition: all 0.3s ease;
            }

            .filter-toggle:hover {
                background: var(--light-blue);
            }

            .filter-content {
                display: block;
                transition: all 0.3s ease;
            }

            .filter-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
                gap: 20px;
                margin-bottom: 20px;
            }

            .filter-group {
                display: flex;
                flex-direction: column;
            }

            .filter-group label {
                font-weight: 600;
                color: var(--dark-gray);
                margin-bottom: 8px;
                font-size: 0.9em;
                text-transform: uppercase;
                letter-spacing: 0.5px;
            }

            .filter-group select,
            .filter-group input {
                padding: 12px;
                border: 2px solid #E0E0E0;
                border-radius: 8px;
                font-size: 1em;
                transition: all 0.3s ease;
                background: var(--white);
            }

            .filter-group select:focus,
            .filter-group input:focus {
                outline: none;
                border-color: var(--accent-blue);
                box-shadow: 0 0 0 3px rgba(79, 137, 175, 0.1);
            }

            .filter-actions {
                display: flex;
                gap: 15px;
                justify-content: center;
                flex-wrap: wrap;
            }

            .btn {
                padding: 12px 24px;
                border: none;
                border-radius: 8px;
                font-size: 1em;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                text-transform: uppercase;
                letter-spacing: 0.5px;
                display: inline-flex;
                align-items: center;
                gap: 8px;
            }

            .btn-primary {
                background: linear-gradient(135deg, var(--accent-blue) 0%, var(--light-blue) 100%);
                color: var(--white);
                box-shadow: 0 4px 16px rgba(79, 137, 175, 0.3);
            }

            .btn-primary:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(79, 137, 175, 0.4);
            }

            .btn-secondary {
                background: var(--white);
                color: var(--dark-gray);
                border: 2px solid var(--earth-brown);
            }

            .btn-secondary:hover {
                background: var(--earth-brown);
                color: var(--white);
            }

            .properties-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
                gap: 25px;
                margin-top: 30px;
            }

            .property-card {
                background: var(--white);
                border-radius: 8px;
                overflow: hidden;
                box-shadow: 0 8px 24px rgba(0,0,0,0.1);
                transition: all 0.3s ease;
                cursor: pointer;
                border: 1px solid #E0E0E0;
                display: flex;
                flex-direction: column;
            }

            .property-card:hover {
                transform: translateY(-5px);
                box-shadow: 0 12px 32px rgba(0,0,0,0.15);
            }

            .property-image {
                height: 200px;
                background-size: cover;
                background-position: center;
                position: relative;
                overflow: hidden;
            }

            .property-image::before {
                content: '';
                position: absolute;
                top: 0; left: 0; right: 0; bottom: 0;
                background: linear-gradient(45deg, rgba(173, 99, 62, 0.1) 0%, rgba(79, 137, 175, 0.1) 100%);
            }

            .property-status {
                position: absolute;
                top: 12px;
                left: 12px;
                padding: 6px 12px;
                border-radius: 20px;
                font-size: 0.8em;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 0.5px;
                z-index: 2;
            }

            .status-available { background: var(--success); color: var(--white); }
            .status-occupied { background: var(--danger); color: var(--white); }
            .status-pending { background: var(--warning); color: var(--dark-gray); }

            .property-heart {
                position: absolute;
                top: 12px;
                right: 12px;
                width: 40px;
                height: 40px;
                background: rgba(255, 255, 255, 0.9);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                transition: all 0.3s ease;
                backdrop-filter: blur(10px);
                z-index: 2;
            }

            .property-heart:hover {
                background: var(--white);
                transform: scale(1.1);
            }

            .property-heart.liked {
                background: var(--danger);
                color: var(--white);
            }

            .property-content {
                padding: 20px;
                flex-grow: 1;
                display: flex;
                flex-direction: column;
            }

            .property-title {
                font-size: 1.3em;
                font-weight: 700;
                color: var(--dark-gray);
                margin: 0 0 8px 0;
                line-height: 1.3;
            }

            .property-location {
                color: var(--earth-brown);
                font-size: 0.9em;
                margin-bottom: 15px;
                display: flex;
                align-items: center;
                gap: 5px;
            }

            .property-details {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 15px;
                flex-wrap: wrap;
                gap: 10px;
            }

            .property-price {
                font-size: 1.4em;
                font-weight: 700;
                color: var(--accent-blue);
            }

            .property-times {
                display: flex;
                gap: 15px;
                font-size: 0.9em;
                color: var(--dark-gray);
            }

            .time-item {
                display: flex;
                align-items: center;
                gap: 5px;
                padding: 4px 8px;
                background: var(--light-gray);
                border-radius: 6px;
            }

            .property-features {
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                margin-top: 15px;
            }

            .feature-tag {
                background: var(--light-brown);
                color: var(--dark-gray);
                padding: 4px 8px;
                border-radius: 12px;
                font-size: 0.8em;
                font-weight: 500;
            }

            .whatsapp-btn {
                background: linear-gradient(135deg, var(--accent-blue) 0%, var(--light-blue) 100%);
                color: var(--white);
                padding: 8px 16px;
                border-radius: 8px;
                text-decoration: none;
                font-size: 0.9em;
                font-weight: 600;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                transition: all 0.3s ease;
                margin-top: auto;
            }

            .whatsapp-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(79, 137, 175, 0.3);
                text-decoration: none;
                color: var(--white);
            }

            /* Load More Button */
            .load-more-container {
                text-align: center;
                margin-top: 30px;
                padding: 20px;
            }

            .load-more-btn {
                background: linear-gradient(135deg, var(--earth-brown) 0%, var(--dark-brown) 100%);
                color: var(--white);
                padding: 15px 30px;
                border: none;
                border-radius: 8px;
                font-size: 1.1em;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                display: inline-flex;
                align-items: center;
                gap: 10px;
            }

            .load-more-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(173, 99, 62, 0.4);
            }

            .load-more-btn:disabled {
                opacity: 0.6;
                cursor: not-allowed;
                transform: none;
            }

            /* Modal Styles */
            .modal { 
                display: none; 
                position: fixed; 
                z-index: 1000; 
                left: 0; 
                top: 0; 
                width: 100%; 
                height: 100%; 
                background: rgba(0, 0, 0, 0.8); 
                backdrop-filter: blur(5px); 
            }
            
            .modal-content { 
                background: var(--white); 
                margin: 2% auto; 
                padding: 0; 
                border-radius: 8px; 
                width: 90%; 
                max-width: 900px; 
                max-height: 90vh; 
                overflow-y: auto; 
                position: relative; 
                box-shadow: 0 20px 60px rgba(0,0,0,0.3); 
            }
            
            .modal-close { 
                position: absolute; 
                top: 15px; 
                right: 20px; 
                font-size: 28px; 
                font-weight: bold; 
                cursor: pointer; 
                color: var(--white); 
                transition: all 0.3s ease; 
                z-index: 10; 
            }
            
            .modal-close:hover { 
                transform: scale(1.2); 
            }
            
            .modal-body { 
                padding: 0; 
            }
            
            .modal-gallery { 
                margin-bottom: 20px; 
                padding: 20px 20px 0; 
            }
            
            .modal-gallery img { 
                width: 100%; 
                height: auto; 
                max-height: 400px; 
                object-fit: cover; 
                border-radius: 8px; 
                margin-bottom: 10px; 
            }

            /* Video Container */
            .video-container {
                position: relative;
                width: 100%;
                height: 0;
                padding-bottom: 56.25%; /* 16:9 aspect ratio */
                margin-bottom: 20px;
                border-radius: 8px;
                overflow: hidden;
            }

            .video-container iframe,
            .video-container video {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: none;
                border-radius: 8px;
            }
            
            .related-properties { 
                margin-top: 30px; 
                padding: 20px; 
                border-top: 2px solid var(--light-gray); 
            }
            
            .loading { 
                text-align: center; 
                padding: 40px; 
                color: var(--earth-brown); 
            }
            
            .no-results { 
                text-align: center; 
                padding: 40px; 
                color: var(--dark-gray); 
                background: var(--white); 
                border-radius: 8px; 
                box-shadow: 0 4px 16px rgba(0,0,0,0.1); 
            }

            /* Agent Modal Styles */
            .agent-modal {
                display: none;
                position: fixed;
                z-index: 1001;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.8);
                backdrop-filter: blur(5px);
            }

            .agent-modal-content {
                background: var(--white);
                margin: 5% auto;
                padding: 30px;
                border-radius: 8px;
                width: 90%;
                max-width: 500px;
                position: relative;
                box-shadow: 0 20px 60px rgba(0,0,0,0.3);
            }

            .agent-form {
                display: flex;
                flex-direction: column;
                gap: 20px;
            }

            .agent-form input {
                padding: 12px;
                border: 2px solid #E0E0E0;
                border-radius: 8px;
                font-size: 1em;
                transition: all 0.3s ease;
            }

            .agent-form input:focus {
                outline: none;
                border-color: var(--accent-blue);
                box-shadow: 0 0 0 3px rgba(79, 137, 175, 0.1);
            }

            .referral-link-container {
                background: var(--light-gray);
                padding: 15px;
                border-radius: 8px;
                margin-top: 20px;
            }

            .referral-link {
                word-break: break-all;
                background: var(--white);
                padding: 10px;
                border-radius: 6px;
                font-family: monospace;
                font-size: 0.9em;
                border: 1px solid #ddd;
            }

            .copy-btn {
                background: var(--success);
                color: var(--white);
                border: none;
                padding: 8px 16px;
                border-radius: 6px;
                cursor: pointer;
                margin-top: 10px;
                transition: all 0.3s ease;
            }

            .copy-btn:hover {
                background: #218838;
            }

            /* Mobile Responsive */
            @media (max-width: 768px) {
                #student-lodge-homepage {
                    padding: 5px;
                    background: none;
                    box-shadow: none;
                    border-radius: 0;
                }
                
                .lodge-header { 
                    font-size: 2em; 
                    margin-bottom: 15px;
                    padding: 15px 10px;
                    border-radius: 8px;
                }
                
                .lodge-header h1 { 
                    font-size: 1.8em; 
                }

                /* Full width search on mobile */
                .search-section {
                    margin: 0 -5px 15px -5px;
                    border-radius: 8px;
                    padding: 15px;
                }

                .search-bar {
                    flex-direction: column;
                    gap: 10px;
                }

                .search-input {
                    width: 100%;
                }

                .search-btn {
                    width: 100%;
                    justify-content: center;
                }
                
                .filter-toggle {
                    display: block;
                }
                
                .filter-content {
                    display: none;
                    margin-top: 15px;
                }
                
                .filter-content.active {
                    display: block;
                }

                .filter-section {
                    margin: 0 -5px 15px -5px;
                    border-radius: 8px;
                    padding: 15px;
                }

                .filter-grid { 
                    grid-template-columns: 1fr; 
                    gap: 15px; 
                }
                
                .filter-actions { 
                    flex-direction: column; 
                    align-items: stretch; 
                }
                
                .properties-grid { 
                    grid-template-columns: 1fr; 
                    gap: 15px;
                    margin: 0 -5px;
                }

                .property-card {
                    border-radius: 8px;
                }
                
                .property-details { 
                    flex-direction: column; 
                    align-items: flex-start; 
                }
                
                .property-times { 
                    margin-top: 10px; 
                    flex-direction: row; 
                    gap: 8px; 
                }
                
                .modal-content { 
                    width: 95%; 
                    margin: 5% auto; 
                    border-radius: 8px;
                }
                
                .modal-body { 
                    padding: 0; 
                }

                .load-more-container {
                    margin: 20px -5px 0 -5px;
                }
            }

            @media (max-width: 480px) {
                #student-lodge-homepage {
                    padding: 2px;
                }

                .search-section,
                .filter-section {
                    margin: 0 -2px 10px -2px;
                    padding: 10px;
                }

                .properties-grid {
                    margin: 0 -2px;
                    gap: 10px;
                }

                .property-image { 
                    height: 180px; 
                }
                
                .property-title { 
                    font-size: 1.1em; 
                }
                
                .property-price { 
                    font-size: 1.2em; 
                }

                .load-more-container {
                    margin: 15px -2px 0 -2px;
                    padding: 15px;
                }
            }/* End custom CSS */