/* =============================================================================
   Flexi Dog — landing-page.css
   ============================================================================= */

.landing-page .lp-hero {
    background: linear-gradient(135deg, var(--c-blue-700) 0%, var(--c-green-700) 100%);
    color: #fff;
    padding: var(--space-10) 0 var(--space-9);
    text-align: center;
}
.lp-hero h1 { color: #fff; font-size: clamp(2rem, 5vw, 3rem); margin-bottom: var(--space-4); }
.lp-hero__subtitle { font-size: 1.25rem; opacity: .95; margin-bottom: var(--space-6); }

.lp-problem-card { background: var(--c-bg-card); padding: var(--space-5); border-radius: var(--radius-md); }
.lp-problem-card ul { list-style: disc; padding-left: var(--space-5); }
.lp-problem-card ul li { margin-bottom: var(--space-2); }

.lp-ingredients { list-style: none; padding: 0; margin-bottom: var(--space-5); }
.lp-ingredients li {
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--c-border);
}
.lp-ingredients li::before { content: "✓ "; color: var(--c-green-700); font-weight: 700; }
.lp-badges { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.lp-tiers { display: flex; flex-direction: column; gap: var(--space-3); }
.lp-tier {
    background: var(--c-bg);
    padding: var(--space-4);
    border-radius: var(--radius-sm);
    border: 2px solid var(--c-border);
    text-align: center;
    position: relative;
}
.lp-tier--popular { border-color: var(--c-orange-500); }
.lp-tier strong { display: block; font-size: 1.125rem; margin-bottom: var(--space-1); }
.lp-price { font-size: 1.5rem; color: var(--c-blue-700); font-weight: 700; display: block; }
.lp-tier__unit { font-size: var(--fs-small); color: var(--c-text-mute); display: block; }

.lp-reviews .card { font-style: italic; }