/* Network Hero Section Styles */
.network-hero-section {
    background: #afacaa52;
    background-size: cover;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.network-content {
    padding: 40px 0;
}

.network-title {
    font-size: 48px;
    font-weight: 700;
    color: #2d2d2d;
    margin-bottom: 24px;
    line-height: 1.2;
}

.network-description {
    font-size: 16px;
    line-height: 1.8;
    color: #5a5a5a;
    max-width: 480px;
}

.network-visual {
    position: relative;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* .world-map-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg width='800' height='400' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cpattern id='dots' x='0' y='0' width='20' height='20' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='2' cy='2' r='1.5' fill='%23f1913d' opacity='0.3'/%3E%3C/pattern%3E%3C/defs%3E%3Cellipse cx='400' cy='200' rx='350' ry='150' fill='url(%23dots)'/%3E%3Cpath d='M 100,180 Q 200,150 300,170 T 500,160 T 700,180' stroke='%23f1913d' stroke-width='2' fill='none' opacity='0.4'/%3E%3Ccircle cx='150' cy='170' r='8' fill='%23f1913d'/%3E%3Cpath d='M 150,162 L 145,155 L 155,155 Z' fill='white'/%3E%3Ccircle cx='350' cy='165' r='8' fill='%23f1913d'/%3E%3Cpath d='M 350,157 L 345,150 L 355,150 Z' fill='white'/%3E%3Ccircle cx='550' cy='175' r='8' fill='%23f1913d'/%3E%3Cpath d='M 550,167 L 545,160 L 555,160 Z' fill='white'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.8;
    z-index: 1;
} */

.phone-mockup {
    position: relative;
    z-index: 3;
    /* max-width: 280px; */
    height: auto;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.15));
    animation: float 3s ease-in-out infinite;
    /* transform: rotate(11deg); */
}

.person-img {
    position: absolute;
    bottom: 0;
    left: -50px;
    z-index: 2;
    max-width: 200px;
    height: auto;
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1));
}

/* Location pin decorations */
/* .network-visual::before,
.network-visual::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 50px;
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='50' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 0C12.268 0 6 6.268 6 14c0 10.5 14 24 14 24s14-13.5 14-24c0-7.732-6.268-14-14-14zm0 19c-2.761 0-5-2.239-5-5s2.239-5 5-5 5 2.239 5 5-2.239 5-5 5z' fill='%23f1913d'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 4;
} */

.network-visual::before {
    top: 20%;
    right: 15%;
    animation-delay: 0.3s;
}

.network-visual::after {
    top: 60%;
    right: 5%;
    animation-delay: 0.6s;
}

/* Animations */
/* @keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
} */

/* Responsive */
@media (max-width: 991px) {
    .network-hero-section {
        padding: 60px 0;
    }
    
    .network-title {
        font-size: 36px;
    }
    
    .network-content {
        text-align: center;
        padding: 20px 0;
    }
    
    .network-description {
        max-width: 100%;
        margin: 0 auto;
    }
    
    .network-visual {
        min-height: 300px;
        margin-top: 40px;
    }
    
    /* .phone-mockup {
        max-width: 200px;
    } */
    
    .person-img {
        max-width: 150px;
        left: -30px;
    }
}

@media (max-width: 576px) {
    .network-title {
        font-size: 28px;
    }

    .network-description {
        font-size: 14px;
    }

    /* .phone-mockup {
        max-width: 160px;
    } */

    .person-img {
        max-width: 120px;
        left: -20px;
    }

    .network-visual::before,
    .network-visual::after {
        width: 30px;
        height: 40px;
    }
}

/* Office Locator Section */
.office-locator-section {
    background: #fff;
}

.office-locator-row {
    display: flex;
    align-items: stretch;
}

.office-list-col {
    display: flex;
    flex-direction: column;
}

.office-list-col #office-list {
    flex: 1;
    overflow-y: auto;
    max-height: 1200px;
}

.office-map-col {
    display: flex;
}

.office-map-col #office-map {
    flex: 1;
    min-height: 400px;
}

@media (max-width: 767px) {
    .office-locator-row {
        flex-direction: column;
    }

    .office-list-col #office-list {
        max-height: 300px;
        margin-bottom: 20px;
    }

    .office-map-col #office-map {
        min-height: 350px;
    }
}