/* PrivaxisOS - module.css: shared theme for product/module pages (dpo-services + modules).
   Light hero, compact buttons/spacing, shared product-UI components. Linked after
   site.css, before page styles. Per-module mockups and amber accents stay page-local. */

.hero::before {
    content: ''; position: absolute; top: -200px; right: -200px;
    width: 600px; height: 600px; border-radius: 50%;
    background: radial-gradient(circle, rgba(26,141,147,0.08) 0%, transparent 70%);
  }
.hero::after {
    content: ''; position: absolute; bottom: -150px; left: -150px;
    width: 500px; height: 500px; border-radius: 50%;
    background: radial-gradient(circle, rgba(33,70,99,0.06) 0%, transparent 70%);
  }
.hero h1 { font-size: 48px; font-weight: 800; color: #214663; line-height: 1.15; margin-bottom: 20px; }
.hero-desc { font-size: 18px; color: #64748b; line-height: 1.7; margin-bottom: 32px; }
.section { padding: 80px; }
.section-inner { max-width: 1200px; margin: 0 auto; }
.section-title { font-size: 36px; font-weight: 800; color: #214663; margin-bottom: 16px; line-height: 1.2; }
.section-subtitle { font-size: 17px; color: #64748b; line-height: 1.7; }
.features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.feature-card {
    background: #fff; border-radius: 16px; padding: 32px;
    border: 1px solid #e2e8f0; transition: all 0.3s;
  }
.feature-icon { width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.feature-card h3 { font-size: 18px; font-weight: 700; color: #214663; margin-bottom: 10px; }
.feature-card p { font-size: 14px; color: #64748b; line-height: 1.7; }
.bg-slate { background: #f8fafc; }
.cta { background: linear-gradient(135deg, #214663 0%, #1a3a4f 50%, #214663 100%); padding: 80px; text-align: center; color: #fff; }
.cta h2 { font-size: 36px; font-weight: 800; margin-bottom: 16px; }
.cta p { font-size: 18px; color: #94a3b8; max-width: 600px; margin: 0 auto 40px; line-height: 1.7; }
.cta-buttons { display: flex; gap: 16px; justify-content: center; }
.btn-primary { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; background: #1a8d93; color: #fff; border-radius: 10px; font-size: 16px; font-weight: 600; transition: background 0.2s; }
.btn-primary:hover { background: #158a8f; }
.btn-outline { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.3); border-radius: 10px; font-size: 16px; font-weight: 600; transition: all 0.2s; }
.btn-outline:hover { border-color: #fff; background: rgba(255,255,255,0.05); }
.footer { background: #0f172a; color: #64748b; padding: 48px 80px 32px; }

/* Unified light hero (shared by all module pages). */
  .hero { padding: 140px 80px 80px; background: linear-gradient(135deg, #f0f7ff 0%, #eef4fb 50%, #f0f9f4 100%); position: relative; overflow: hidden; }