:root {
    --azul: #010E1E;    
    --amarelo: #FFB932; 
    --verde: #00A888;   
    --branco: #FFFFFF; 
    --texto: #334155; 
    --fundo-site: #f4f7f9; 
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Montserrat', sans-serif; }

body { 
    background-color: var(--fundo-site); 
    color: var(--texto); 
    line-height: 1.6; 
    scroll-behavior: smooth; 
    overflow-x: hidden; 
}

.container { max-width: 1250px; margin: 0 auto; padding: 0 20px; }

/* HEADER */
header { background: var(--branco); height: 80px; display: flex; align-items: center; border-bottom: 3px solid var(--azul); position: sticky; top: 0; z-index: 1000; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
.nav-container { width: 100%; display: flex; justify-content: space-between; align-items: center; }

/* Logo centralizada verticalmente */
.logo { display: flex; align-items: center; text-decoration: none; }
.logo img { height: 60px; width: auto; display: block; }

.nav-links a { text-decoration: none; color: var(--azul); font-weight: 700; font-size: 13px; margin-left: 20px; text-transform: uppercase; transition: 0.3s; }
.nav-links a:hover { color: var(--verde); }
.btn-nav { background: var(--amarelo); padding: 10px 22px; border-radius: 50px; color: var(--azul); text-decoration: none; font-weight: 800; transition: 0.3s; border: 2px solid var(--amarelo); }
.btn-nav:hover { background: transparent; transform: scale(1.05); }

/* SLIDER */
.slider { position: relative; height: 500px; overflow: hidden; background: var(--azul); }
.slides-container { position: relative; height: 100%; }
.slide { position: absolute; width: 100%; height: 100%; background-size: cover; background-position: center; display: flex; align-items: center; opacity: 0; transition: opacity 0.8s ease-in-out; }
.slide.active { opacity: 1; z-index: 2; }
.slide-content { color: white; z-index: 5; }
.slide-content h1 { font-size: 50px; font-weight: 900; line-height: 1.1; margin: 15px 0; }
.slide-content h1 span { color: var(--amarelo); }
.badge { background: var(--amarelo); color: var(--azul); padding: 5px 15px; border-radius: 50px; font-weight: 800; font-size: 11px; display: inline-block; }
.btn-primary { background: var(--verde); color: white; padding: 16px 32px; border-radius: 8px; text-decoration: none; font-weight: 800; display: inline-block; transition: 0.3s; }
.btn-primary:hover { background: var(--amarelo); color: var(--azul); transform: translateY(-3px); }

.slide-prev, .slide-next { position: absolute; top: 50%; z-index: 10; background: rgba(1, 14, 30, 0.6); border: none; color: white; padding: 15px; cursor: pointer; border-radius: 50%; transform: translateY(-50%); transition: 0.3s; }
.slide-next:hover, .slide-prev:hover { background: var(--amarelo); color: var(--azul); }
.slide-next { right: 20px; } .slide-prev { left: 20px; }

/* PLANOS */
.plans-section { padding: 80px 0; }
.section-title { text-align: center; font-size: 34px; font-weight: 900; color: var(--azul); margin-bottom: 50px; }
.section-title span { color: var(--verde); }
.plans-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }

.plan-card { 
    background: var(--branco); 
    padding: 40px 25px; 
    border-radius: 20px; 
    border: 2px solid transparent; 
    text-align: center; 
    position: relative; 
    display: flex; 
    flex-direction: column; 
    transition: all 0.4s ease; 
    box-shadow: 0 10px 20px rgba(1, 14, 30, 0.05);
}

.plan-card:hover { transform: translateY(-12px); border-color: var(--verde); box-shadow: 0 15px 30px rgba(1, 14, 30, 0.1); }
.plan-card.featured { border: 2px solid var(--azul); transform: scale(1.05); z-index: 5; background: #fff; }
.plan-card.featured:hover { transform: translateY(-12px) scale(1.07); }

.plan-tag { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); background: var(--amarelo); color: var(--azul); padding: 5px 20px; border-radius: 50px; font-size: 10px; font-weight: 900; }
.plan-header h3 { font-size: 55px; font-weight: 900; color: var(--azul); line-height: 1; }
.plan-header span { font-weight: 800; color: var(--verde); display: block; margin-bottom: 20px; }

.plan-features { list-style: none; text-align: left; margin: 25px 0; flex-grow: 1; border-top: 1px solid #eee; padding-top: 20px; }
.plan-features li { margin-bottom: 12px; font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.plan-features i { color: var(--verde); }
.turbo { color: var(--verde); font-weight: 800; }

.plan-price .amount { font-size: 36px; font-weight: 900; color: var(--azul); }
.btn-plan { text-decoration: none; background: #f1f5f9; color: var(--azul); padding: 14px; border-radius: 10px; font-weight: 800; margin-top: 20px; transition: 0.3s; }
.btn-plan.active { background: var(--azul); color: white; }
.btn-plan:hover { background: var(--amarelo); color: var(--azul); }

/* COBERTURA */
.coverage { padding: 80px 0; }
.check-card { background: var(--azul); border-radius: 20px; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; color: white; min-height: 450px; box-shadow: 0 20px 40px rgba(0,0,0,0.2); }
.check-text { padding: 60px; display: flex; flex-direction: column; justify-content: center; }
.check-text h2 { color: var(--amarelo); font-size: 32px; font-weight: 900; }
.select-group label { display: block; font-size: 11px; font-weight: 800; margin-bottom: 5px; opacity: 0.8; color: var(--verde); }
.select-group select { width: 100%; padding: 12px; border-radius: 8px; border: none; font-size: 16px; font-weight: 600; color: var(--azul); outline: none; margin-bottom: 15px; }
.check-map { background: #000 url('https://images.squarespace-cdn.com/content/v1/5941655615d5db8f25492d2b/1500412396342-999335S8YI0U7EIBF7YJ/google-maps-natal.png') center/cover; opacity: 1; position: relative; filter: grayscale(10%) brightness(90%); }
.map-pulse { width: 20px; height: 20px; background: var(--amarelo); border-radius: 50%; position: absolute; top: 50%; left: 50%; animation: pulse 2s infinite; }

/* CONTATO */
.contact-section { padding: 80px 0; }
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.contact-card { background: var(--branco); padding: 30px; border-radius: 15px; text-align: center; transition: 0.3s; text-decoration: none; color: inherit; box-shadow: 0 5px 15px rgba(0,0,0,0.05); border: 2px solid transparent; }
.contact-card:hover { transform: translateY(-5px); border-color: var(--verde); }
.contact-icon { width: 50px; height: 50px; background: var(--azul); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; color: var(--amarelo); }

/* MENSAGENS */
.msg-resultado { padding: 20px; border-radius: 8px; margin-top: 20px; text-align: center; font-weight: 700; animation: fadeIn 0.5s ease; }
.msg-sucesso { background: var(--verde); color: white; }
.btn-expansao { display: inline-block; margin-top: 10px; background: var(--amarelo); color: var(--azul); padding: 8px 15px; border-radius: 5px; text-decoration: none; font-size: 14px; font-weight: 800; }

@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 185, 50, 0.7); } 70% { box-shadow: 0 0 0 20px rgba(255, 185, 50, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 185, 50, 0); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

footer { background: #00070F; color: #667c99; padding: 40px 0; text-align: center; border-top: 4px solid var(--verde); }

@media (max-width: 900px) {
    .plans-grid, .check-card { grid-template-columns: 1fr; }
    .plan-card.featured { transform: none; }
    .check-map { height: 200px; }
    .slide-content h1 { font-size: 32px; }
}