/* Public landing page only; application navigation and modals retain shared styles. */
.landing-page {
    --landing-ink: #172c3c;
    --landing-teal: #17696d;
    --landing-muted: #536571;
    color: var(--landing-ink);
    padding-bottom: 2rem;
}

.landing-page h1,
.landing-page h2,
.landing-page h3 {
    font-weight: 700;
    letter-spacing: -0.035em;
}

.landing-page h1 {
    font-size: clamp(2rem, 3.5vw, 3.5rem);
    line-height: 1.12;
}

.landing-page h1 span { color: var(--landing-teal); }

.landing-page h2 {
    font-size: clamp(1.65rem, 2.5vw, 2.3rem);
    max-width: 780px;
    margin-inline: auto;
}

.landing-page p { color: var(--landing-muted); line-height: 1.7; }

.landing-page .landing-hero {
    padding: clamp(1.25rem, 3vw, 3rem);
    border-radius: 1.75rem;
    background: linear-gradient(135deg, #eaf5f3, #f4f7fb 70%);
    border: 1px solid #dce9e7;
}

.landing-hero img {
    border-radius: 1.2rem !important;
    box-shadow: 0 16px 35px #172c3c18;
}

.landing-page .landing-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: var(--landing-teal);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.landing-intro { max-width: 850px; margin-inline: auto; }
.landing-page .lead { font-size: 1.1rem; font-weight: 400; }
.landing-page .btn {
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: .7rem;
    --bs-btn-border-radius: .75rem;
    font-weight: 600;
    white-space: normal;
}

.landing-page .btn-primary {
    --bs-btn-bg: #17696d;
    --bs-btn-border-color: #17696d;
    --bs-btn-hover-bg: #115357;
    --bs-btn-hover-border-color: #115357;
    --bs-btn-active-bg: #115357;
    --bs-btn-active-border-color: #115357;
}

.landing-page .btn-outline-primary {
    --bs-btn-color: #17696d;
    --bs-btn-border-color: #a0bfbd;
    --bs-btn-hover-bg: #17696d;
    --bs-btn-hover-border-color: #17696d;
    --bs-btn-active-bg: #115357;
    --bs-btn-active-border-color: #115357;
}

.landing-page .card {
    border: 1px solid #dfe7eb;
    border-radius: 1rem;
    background: #fff;
}

.landing-page .card-body { padding: 1.5rem; }
.landing-page #features { scroll-margin-top: 5rem; }
.landing-page #features .card { transition: border-color .2s, box-shadow .2s; }
.landing-page #features .card:hover {
    border-color: #8bbdb8;
    box-shadow: 0 10px 24px #172c3c0d;
}

.landing-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    margin-bottom: 1rem;
    border-radius: .8rem;
    background: #eaf5f3;
    color: var(--landing-teal);
    font-size: 1.3rem;
}

.landing-page .landing-channels {
    background: linear-gradient(120deg, #172c3c, #205457);
    border-color: transparent;
    color: #fff;
}

.landing-page .landing-channels p { color: #dfebef; max-width: 760px; margin-inline: auto; }
.landing-marketplaces { margin-top: 1.5rem; }
.landing-marketplaces li {
    padding: .5rem 1rem;
    border: 1px solid #ffffff40;
    border-radius: 2rem;
    font-weight: 600;
}

.landing-page #app-preview { padding-block: 2.5rem !important; }
.landing-page [aria-labelledby="benefits-heading"] .card { border: 0; background: #f0f5f6; }
.landing-page [aria-labelledby="audience-heading"] { border: 0; border-top: 1px solid #dfe7eb; border-radius: 0; background: transparent; }

@media (prefers-reduced-motion: reduce) {
    .landing-page #features .card { transition: none; }
}