/* Loranet Custom Styles - Geometric Background Pattern */
.loranet-homepage {
    background: #ffffff;
    min-height: 100vh;
    position: relative;
    overflow: hidden;
}

.loranet-homepage::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        linear-gradient(45deg, rgba(173, 216, 230, 0.1) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(173, 216, 230, 0.1) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(173, 216, 230, 0.1) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(173, 216, 230, 0.1) 75%);
    background-size: 60px 60px;
    background-position: 0 0, 0 30px, 30px -30px, -30px 0px;
    opacity: 0.3;
    z-index: 0;
}

.loranet-homepage > * {
    position: relative;
    z-index: 1;
}

.loranet-branding {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: 60px 0 20px;
    flex-wrap: wrap;
}

.loranet-logo-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #1e3a5f 0%, #2c5282 100%);
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(30, 58, 95, 0.3);
}

.loranet-logo-icon::before {
    content: '';
    width: 60%;
    height: 60%;
    background: rgba(255, 255, 255, 0.2);
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}

.loranet-company-name {
    font-size: 3.5rem;
    font-weight: 700;
    color: #1e3a5f;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin: 0;
    line-height: 1.2;
}

.loranet-tagline {
    font-size: 1.2rem;
    color: #2c5282;
    font-weight: 400;
    text-align: center;
    margin: 10px 0 60px;
    letter-spacing: 1px;
}

.loranet-members {
    text-align: center;
    margin: 80px 0 40px;
}

.loranet-members-title {
    font-size: 1rem;
    color: #1e3a5f;
    margin-bottom: 30px;
    font-weight: 500;
}

.loranet-members-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
    margin-top: 30px;
}

.loranet-member-logo {
    max-width: 200px;
    height: auto;
    opacity: 0.9;
    transition: opacity 0.3s ease;
}

.loranet-member-logo:hover {
    opacity: 1;
}

@media (max-width: 768px) {
    .loranet-company-name {
        font-size: 2.5rem;
    }
    
    .loranet-members-logos {
        flex-direction: column;
        gap: 40px;
    }
}