/* ═══════════════════════════════════════════════════
   marketing.css – Unified styles for Marketing pages
   ═══════════════════════════════════════════════════ */
:root{--mktg-ac:#00b4d8;--mktg-bt:#0a2540;--mktg-al:color-mix(in srgb,#00b4d8 12%,white)}

/* Hero SVG cross pattern */
.mktg-hero-bg::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%2300b4d8' fill-opacity='0.07'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}

/* Glass */
.mktg-glass{background:rgba(255,255,255,0.07);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.15)}

/* Feature card */
.mktg-feature-card{transition:all .3s cubic-bezier(.4,0,.2,1);border:2px solid transparent}
.mktg-feature-card:hover{transform:translateY(-8px);border-color:var(--mktg-ac);box-shadow:0 24px 48px rgba(0,0,0,.10)}

/* Plan card */
.mktg-plan-card{transition:all .3s cubic-bezier(.4,0,.2,1);border:2px solid transparent}
.mktg-plan-card:hover{transform:translateY(-8px);border-color:var(--mktg-ac);box-shadow:0 24px 48px rgba(0,0,0,.12)}
.mktg-plan-card.mktg-popular{border-color:var(--mktg-ac)}

/* Accent utilities */
.mktg-ai{color:var(--mktg-ac)}
.mktg-ab{background:var(--mktg-al)}

/* Buttons */
.mktg-btn-fill{background:var(--mktg-ac);color:var(--mktg-bt);display:inline-block;transition:all .2s}
.mktg-btn-fill:hover{filter:brightness(1.1);transform:translateY(-2px)}
.mktg-btn-ring{border:2px solid var(--mktg-ac);color:var(--mktg-ac);display:inline-block;transition:all .2s}
.mktg-btn-ring:hover{background:var(--mktg-ac);color:#fff}

/* FAQ */
.mktg-faq-item{transition:all .2s ease}
.mktg-faq-item:hover{border-color:var(--mktg-ac)}

/* Gradients */
.mktg-gradient{background:linear-gradient(135deg,#0a2540 0%,#023e8a 50%,#00b4d8 100%)}
.mktg-mid-gradient{background:linear-gradient(135deg,#023e8a,#0a2540)}

/* Animations */
@keyframes mktg-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.mktg-float{animation:mktg-float 4s ease-in-out infinite}
.mktg-blob2{animation:mktg-float 6s ease-in-out infinite reverse}

/* Dark mode overrides */
.dark .mktg-feature-card,.dark .mktg-plan-card,.dark .mktg-faq-item{background:#0d1b2e!important}