/* QBO Dashboard — landing page (public/landing.php)
 *
 * The front door at the site root for anyone not signed in. Rendered by
 * QBOD_Frontend_Gate outside the active theme, so nothing here inherits from
 * the site theme and nothing here leaks into wp-admin.
 *
 * Contrast was calculated, not eyeballed (UI hard rule 7a), across every
 * surface each colour lands on:
 *   ink   #1d2327 on page #f4f6f8 .... 14.66:1
 *   body  #2d3338 on page #f4f6f8 .... 11.80:1
 *   sub   #565a60 on page #f4f6f8 ..... 6.40:1
 *   white on CTA  #1d3557 ............ 12.36:1
 *   white on hover #2a4a73 ............ 9.03:1
 *   #d9dde1 on footer band #1d2327 ... 11.63:1
 *
 * No max-width on any text element (UI hard rule 4) — the footer band is a
 * background change, which is what separates the sections rather than a
 * hairline (hard rule 2).
 */

.qbod-landing,
.qbod-landing * {
    box-sizing: border-box;
}

.qbod-landing {
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f4f6f8;
    color: #2d3338;
    font-family: "Segoe UI", Candara, system-ui, -apple-system, sans-serif;
    font-size: 18px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

.qbod-landing img {
    max-width: 100%;
    height: auto;
}

/* ---- Hero ---- */
.qbod-landing-main {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 40px;
    text-align: center;
}

/* font-family repeated rather than inherited, deliberately. The theme is
   dequeued on this page, but a heading is the single most likely thing for
   any future stylesheet to restyle, and one sans family is a hard rule
   (6a) — this is the belt to that braces. */
.qbod-landing-wordmark {
    margin: 0 0 6px;
    color: #1d2327;
    font-family: "Segoe UI", Candara, system-ui, -apple-system, sans-serif;
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -0.4px;
}

.qbod-landing-kicker {
    margin: 0 0 28px;
    color: #565a60;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.4px;
}

.qbod-landing-lede {
    margin: 0 0 36px;
    font-size: 20px;
}

/* ---- Sign-in CTA ----
   The single primary action on the page, in the same navy the login screen's
   submit button already uses, so "the blue one signs you in" holds across both
   screens (UI hard rule 1). */
.qbod-landing-cta {
    display: inline-block;
    padding: 15px 38px;
    background: #1d3557;
    border: 2px solid #1d3557;
    border-radius: 5px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
}

.qbod-landing-cta:hover,
.qbod-landing-cta:focus {
    background: #2a4a73;
    border-color: #2a4a73;
    color: #ffffff;
}

.qbod-landing-cta:focus-visible {
    outline: 3px solid #1d3557;
    outline-offset: 3px;
}

.qbod-landing-note {
    margin: 30px 0 0;
    color: #565a60;
    font-size: 15px;
}

/* ---- Footer band ----
   A background change, not a hairline: it is what marks the boundary. */
.qbod-landing-footer {
    flex: 0 0 auto;
    padding: 22px 40px;
    background: #1d2327;
    color: #d9dde1;
    font-size: 15px;
    text-align: center;
}

.qbod-landing-footer a {
    color: #d9dde1;
}

@media (max-width: 900px) {
    .qbod-landing-wordmark { font-size: 34px; }
    .qbod-landing-main     { padding: 48px 24px; }
}