body { font-family: Arial, sans-serif; margin: 0; padding: 0; background: #f4f4f4; }
header { text-align: center; padding: 20px; background: #007bff; color: white; }
.container { display: flex; max-width: 1200px; margin: 20px auto; }
.calculator { flex: 2; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.1); }
.ads-right { padding: 20px; }
form { display: grid; gap: 10px; }
input, select { padding: 8px; border: 1px solid #ddd; border-radius: 4px; width: 100%; }
button { background: #007bff; color: white; border: none; padding: 10px; cursor: pointer; }
.hidden { display: none; }
.ads-top, .ads-bottom { height: 90px; background: #eee; text-align: center; } /* Ajuste para AdSense */
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
footer { text-align: center; padding: 10px; background: #f4f4f4; }
table { width: 100%; border-collapse: collapse; margin-top: 20px; }
th, td { border: 1px solid #ddd; padding: 8px; text-align: left; }
th { background: #f2f2f2; }
.explanation { margin-top: 40px; padding: 20px; background: #fff; border-radius: 8px; }
.ad-interstitial { margin: 20px 0; text-align: center; background: #f9f9f9; padding: 10px; border: 1px solid #ddd; }
details { margin-top: 20px; border: 1px solid #ddd; border-radius: 4px; padding: 10px; }
summary { cursor: pointer; font-weight: bold; }
#resumoTable th { background: #e0f7fa; color: #0b2239; } /* Destaque para resumo */
@media (max-width: 768px) { 
    .container { flex-direction: column; } 
    .field-pair { grid-template-columns: 1fr; } 
}
/* Estilos anteriores... */
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
.card { background: #fff; padding: 20px; border-radius: 8px; text-align: center; box-shadow: 0 2px 5px rgba(0,0,0,0.1); transition: transform 0.2s; }
.card:hover { transform: scale(1.05); }
.card i { font-size: 2em; color: #007bff; margin-bottom: 10px; }

