/* Shared visual primitives for marketing and landing pages. */
.marketing-section {
    position: relative;
    overflow: hidden;
}

.marketing-surface {
    background: #fbfaf4;
    background: color-mix(in srgb, var(--cream, #fbfaf4) 84%, white);
}

.marketing-card {
    border: 1px solid var(--cream-border, #e4e0d5);
    background: white;
    box-shadow: 0 1px 2px rgba(18, 40, 32, .03), 0 18px 46px -36px rgba(18, 40, 32, .35);
}

.marketing-card:hover {
    border-color: rgba(39, 96, 71, .28);
    box-shadow: 0 22px 50px -34px rgba(18, 40, 32, .4);
}

.marketing-button {
    min-height: 48px;
    box-shadow: 0 10px 28px -14px rgba(18, 40, 32, .55);
}

.marketing-button:hover { transform: translateY(-2px); }
.marketing-button:active { transform: translateY(0) scale(.985); }

@media (prefers-reduced-motion: reduce) {
    .marketing-button:hover { transform: none; }
}