:root {
    --primary: #0077b5; /* Azul LinkedIn */
    --secondary: #00a0dc;
    --dark: #1d2226;
    --light: #f3f2ef;
    --accent: #ff5f00; /* Laranja para botões de destaque/M-Pesa */
    --success: #057642;
}

body { font-family: 'Inter', -apple-system, sans-serif; background-color: var(--light); color: var(--dark); overflow-x: hidden; }

/* Header & Nav */
.navbar { background: white; box-shadow: 0 2px 10px rgba(0,0,0,0.1); padding: 15px 0; }
.navbar-brand { font-weight: 800; color: var(--primary) !important; font-size: 1.5rem; }

/* Hero Section */
.hero { background: linear-gradient(135deg, #0077b5 0%, #004b7c 100%); color: white; padding: 100px 0; }
.btn-cta { background: var(--accent); color: white; padding: 15px 35px; border-radius: 50px; font-weight: 700; text-transform: uppercase; transition: 0.3s; border: none; }
.btn-cta:hover { background: #e65600; transform: translateY(-3px); color: white; }

/* Features Section */
.feature-card { background: white; border-radius: 15px; padding: 40px; border: none; transition: 0.3s; height: 100%; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
.feature-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
.feature-icon { font-size: 2.5rem; color: var(--primary); margin-bottom: 20px; }

/* Pricing Table */
.pricing-card { border-radius: 20px; border: 2px solid transparent; transition: 0.3s; }
.pricing-card.featured { border-color: var(--accent); position: relative; }
.pricing-card.featured::after { content: "RECOMENDADO"; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); background: var(--accent); color: white; padding: 5px 15px; border-radius: 20px; font-size: 0.7rem; font-weight: bold; }

/* Footer */
footer { background: var(--dark); color: white; padding: 60px 0 20px; }