.marketing-page {
    --mp-primary: #0d3b66;
    --mp-accent: #0e9aa7;
    --mp-soft: #eef8f8;
    --mp-text: #334155;
    --mp-border: #e2e8f0;
    --mp-radius: 14px;
    --mp-shadow: 0 12px 36px rgba(13, 59, 102, 0.08);
}

.mp-section { padding: 64px 0; }
.mp-section-alt { background: linear-gradient(180deg, #f8fbfd 0%, #fff 100%); }
.mp-badge { display: inline-block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--mp-accent); background: var(--mp-soft); padding: 6px 12px; border-radius: 999px; margin-bottom: 1rem; }
.mp-title { font-size: 1.9rem; font-weight: 700; color: var(--mp-primary); margin-bottom: 0.75rem; }
.mp-lead { color: var(--mp-text); line-height: 1.75; font-size: 1.05rem; }
.mp-card { background: #fff; border: 1px solid var(--mp-border); border-radius: var(--mp-radius); padding: 1.25rem; height: 100%; box-shadow: var(--mp-shadow); transition: transform .2s, border-color .2s; }
.mp-card:hover { transform: translateY(-2px); border-color: var(--mp-accent); }
.mp-card h3 { font-size: 1.05rem; color: var(--mp-primary); font-weight: 700; }
.mp-card p { color: var(--mp-text); font-size: 0.95rem; margin-bottom: 0; }
.mp-hero { padding: 48px 0 64px; background: linear-gradient(135deg, #edf4ff 0%, #fff 50%, #eaf9f9 100%); }
.mp-hero h1 { color: var(--mp-primary); font-weight: 800; font-size: clamp(1.8rem, 4vw, 2.5rem); line-height: 1.2; }
.mp-grid { display: grid; gap: 1rem; }
.mp-metric { text-align: center; padding: 1rem; border-radius: var(--mp-radius); background: #fff; border: 1px solid var(--mp-border); }
.mp-metric strong { display: block; font-size: 1.4rem; color: var(--mp-accent); }
.mp-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--mp-radius); overflow: hidden; border: 1px solid var(--mp-border); }
.mp-table th, .mp-table td { padding: 0.85rem 1rem; border-bottom: 1px solid var(--mp-border); }
.mp-table th { background: #f8fafc; color: var(--mp-primary); }
.mp-list { list-style: none; padding: 0; margin: 0; }
.mp-list li { padding: 0.55rem 0 0.55rem 1.6rem; position: relative; color: var(--mp-text); }
.mp-list li::before { content: '\ea41'; font-family: boxicons; position: absolute; left: 0; color: var(--mp-accent); }
.mp-gallery img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; }
@media (max-width: 767px) { .mp-hero .default-btn, .mp-hero .optional-btn { width: 100%; text-align: center; } }