:root{--accent-color: #3498db;--light-bg: #f9f9f9;--dark-text: #333;--light-text: #fff;--gray-text: #777;--card-shadow: 0 10px 30px rgba(0, 0, 0, .1);--transition: all .3s ease}.dicas-container{max-width:1200px;margin:0 auto;padding:40px 20px}.dicas-container h3,.dicas-container h2{line-height:1.2}.header-section{text-align:center;margin-bottom:50px}.header-section h1{font-size:2.5rem;color:var(--base-color);margin-bottom:15px;position:relative;display:inline-block}.header-section h1:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:80px;height:4px;background:var(--medium-gray);border-radius:2px}.header-section p{font-size:1.1rem;color:var(--gray-text);max-width:700px;margin:0 auto}.dicas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:30px;margin-bottom:50px}.dica-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--card-shadow);transition:var(--transition);cursor:pointer;position:relative}.dica-card:hover{transform:translateY(-10px);box-shadow:0 15px 35px #00000026}.dica-image{height:200px;overflow:hidden;position:relative}.dica-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:var(--transition)}.dica-card:hover .dica-image img{transform:scale(1.1)}.dica-content{padding:20px}.dica-content h3{font-size:1.3rem;margin-bottom:10px;color:var(--base-color)}.dica-content p{color:var(--gray-text);font-size:.9rem;margin-bottom:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.read-more{display:inline-flex;align-items:center;color:var(--medium-gray);font-weight:500;font-size:.9rem;transition:var(--transition)}.read-more i{margin-left:5px;transition:var(--transition)}.dica-card:hover .read-more{color:var(--accent-color)}.dica-card:hover .read-more i{transform:translate(5px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.dicas-grid{grid-template-columns:1fr}.header-section h1{font-size:2rem}.modal-content{width:95%;margin:20px auto}.modal-header{padding:15px 20px}.modal-header h2{font-size:1.5rem}.modal-body{padding:20px}}
