/*********************************************************/
/*CSS MODE - MRPNET 2025
/*********************************************************/
.container-principal { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; box-sizing: border-box; background-image: url(../images/bg-site.jpg); }
.divisao-logos { display: flex; width: 100%; max-width: 1200px; height: 500px; background: white; border-radius: 20px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1); overflow: hidden; position: relative; }

.logo-section { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; transition: all 0.3s ease; padding: 20px; z-index: 999}
.logo-crb { background: linear-gradient(135deg, #05355B 0%, #005288 100%); }
.logo-marcia { background: linear-gradient(135deg, #29B7C0  0%, #1D5FA5 100%); }

.logo-link { display: flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: none; width: 100%; flex: 1; position: relative; transition: transform 0.3s ease; }
.logo-link:hover { transform: scale(1.05); }

.logo-image { max-width: 300px; max-height: 220px; width: auto; height: auto; object-fit: contain; filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.2)); transition: all 0.3s ease; }
.logo-overlay { position: absolute; bottom: -20px; left: -8px; right: 0; width: 110%; background: rgba(0, 0, 0, 0.7); color: white; padding: 15px 10px 30px 10px; text-align: center; transform: translateY(100%); transition: transform 0.3s ease; }
.logo-link:hover .logo-overlay { transform: translateY(0); }

.logo-text { font-size: 18px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }

.divisor-central { width: 2px; background: linear-gradient(to bottom, transparent 0%, rgba(255, 255, 255, 0.3) 20%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.3) 80%, transparent 100%); position: relative; }
.divisor-central::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 20px; height: 20px; background: white; border-radius: 50%; box-shadow: 0 0 20px rgba(255, 255, 255, 0.8); }

.chamada-texto { position: absolute; bottom: 120px; text-align: center; padding: 0 20px; }
.chamada-texto p { color: white; font-size: 16px; font-weight: 600; line-height: 1.4; margin: 0; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); letter-spacing: 0.5px; }

.logogrupo {width: 200px; height: 180px; margin: auto; background-position: center; background-image: url(../images/logogrupo.png); position: absolute; top: 100px; left: 50%;  transform: translate(-50%, -50%); z-index: 99999;}

@media (max-width: 1600px) {
    .divisao-logos {margin-top: 20px;}
}

@media (max-width: 1400px) {
    .logogrupo {width: 140px; height: 150px; top: 60px;}
    .divisao-logos { height: 360px;}
    .chamada-texto { bottom: 80px; }
    .logo-section {margin-top: -60px;}
}

@media (max-width: 1280px) {
    .divisao-logos { height: 400px;}
    .chamada-texto { bottom: 120px; }
}

@media (max-width: 1024px) {
    .divisao-logos { height: 360px;}
    .chamada-texto { bottom: 80px; }
    .logo-text { font-size: 14px;}
}

@media (max-width: 950px) {
    .chamada-texto p {font-size: 0.9em;}
    .logo-text { font-size: 0.6em !important}
    .logo-overlay {padding: 5px 10px 10px 10px;}
}


@media (max-width: 768px) {
    .divisao-logos { flex-direction: column; height: auto; height: 500px; min-height: 500px; }
    .logo-section {margin-top: 0;}
    .chamada-texto { bottom: 40px; }

    .divisor-central { width: 100%; height: 2px; background: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, 0.3) 20%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.3) 80%, transparent 100%); }
    .divisor-central::before { top: 50%; left: 50%; }
    .logo-image { max-width: 200px; max-height: 120px; }

}
@media (max-width: 480px) {
    .container-principal { padding: 10px; }
    .divisao-logos { border-radius: 15px; min-height: 500px; }
    .logo-image { max-width: 250px; max-height: 120px; }
    .logo-text { font-size: 14px; }
    .chamada-texto p { font-size: 12px; }
}