/* Best Loan App landing page - only the few pieces not already in
   loan-emi-calculator/index.css and location-page/index.css. */

/* The location hero pins its subtitle to one line; this page's is longer, so let it wrap. */
.loc-page .loc-hero-sub {
    white-space: normal;
    max-width: 760px;
}

/* Inline links from the source doc. .emi-content a is already blue; add the hover
   affordance, and cover the two section headings the doc hyperlinks (they sit
   outside .emi-content so the base rule misses them). */
.loc-page .emi-content a:not([class]):hover { text-decoration: underline; }

.loc-page .loc-section-heading a {
    color: var(--blue, #2156e5);
    text-decoration: none;
}

.loc-page .loc-section-heading a:hover { text-decoration: underline; }

.bla-callout {
    background: #f5f7fb;
    border-left: 3px solid var(--blue, #2156e5);
    border-radius: 12px;
    padding: 18px 20px;
    margin: 24px 0 18px;
}

.bla-callout-label {
    display: inline-block;
    font-family: 'Geist', 'Geist Fallback', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--blue, #2156e5);
    margin-bottom: 6px;
}

.emi-content .bla-callout p {
    margin: 0;
    color: var(--ink, #14223f);
}

.emi-content p.bla-note {
    font-size: 14px;
    font-style: italic;
    color: #7a8699;
    border-top: 1px solid var(--line, #e6e9f2);
    padding-top: 12px;
    margin-top: 18px;
}

/* The sidebar has no Related Blogs card here, so let the TOC stick on its own. */
.emi-sidebar .toc-card { position: sticky; top: 96px; }

@media (max-width: 1024px) {
    .emi-sidebar .toc-card { position: static; }
}

@media (max-width: 768px) {
    .bla-callout { padding: 16px; margin: 20px 0 16px; }
}