/* /Layout/MainLayout.razor.rz.scp.css */
/* AD-547: the stock Blazor sidebar layout was replaced wholesale by a public
   landing-page shell - a full-width header (see NavMenu.razor.css) over a
   centred content column. */

.site-main[b-g21zd934c9] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.5rem 1.25rem 4rem;
}

@media (max-width: 640.98px) {
    .site-main[b-g21zd934c9] {
        padding: 1.75rem 1rem 3rem;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* AD-547: replaces the stock Blazor sidebar nav with a top header bar.

   The header is a 3-column grid (1fr / auto / 1fr) rather than a flex row with
   space-between: space-between would centre the nav only by accident of the
   brand's width, and the brand is wider than the toggler. With 1fr on both
   flanks the nav sits on the viewport centre regardless.

   Colours come from the app icon itself - #181A22 is its background layer and
   #5E2EC2 the ring in its artwork - so the header matches the installed app. */

.site-header[b-tl7zv961qd] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1.5rem;
    background-color: #181A22;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.brand[b-tl7zv961qd] {
    grid-column: 1;
    justify-self: start;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.brand:hover[b-tl7zv961qd] {
    color: #fff;
    text-decoration: none;
}

.brand img[b-tl7zv961qd] {
    display: block;
    width: 32px;
    height: 32px;
}

.site-nav[b-tl7zv961qd] {
    grid-column: 2;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.site-nav[b-tl7zv961qd]  .nav-link {
    display: block;
    padding: 0.4rem 0.9rem;
    border-radius: 4px;
    color: #d7d7d7;
    font-size: 0.95rem;
    text-decoration: none;
}

.site-nav[b-tl7zv961qd]  .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.site-nav[b-tl7zv961qd]  .nav-link.active {
    background-color: #5E2EC2;
    color: #fff;
}

/* The toggler occupies column 3, balancing the brand in column 1 so the nav in
   column 2 stays centred. Hidden on wide viewports, where the nav is always open. */
.nav-toggler[b-tl7zv961qd] {
    grid-column: 3;
    justify-self: end;
    display: none;
    padding: 0.4rem 0.6rem;
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    cursor: pointer;
}

.nav-toggler-icon[b-tl7zv961qd] {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%28255,255,255,0.85%29' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    background-size: cover;
}

@media (max-width: 640.98px) {
    .site-header[b-tl7zv961qd] {
        grid-template-columns: 1fr auto;
        row-gap: 0.5rem;
    }

    .nav-toggler[b-tl7zv961qd] {
        grid-column: 2;
        display: block;
    }

    /* Second row, full width - the two links stack instead of crowding the brand. */
    .site-nav[b-tl7zv961qd] {
        grid-column: 1 / -1;
        grid-row: 2;
        flex-direction: column;
        align-items: stretch;
    }

    .site-nav.collapsed[b-tl7zv961qd] {
        display: none;
    }
}
/* /Pages/Contact.razor.rz.scp.css */
.contact[b-4krdd1mq2j] {
    max-width: 640px;
    margin: 0 auto;
    padding: 2rem 0;
}

.contact h1[b-4krdd1mq2j] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1.25rem;
}

.contact p[b-4krdd1mq2j] {
    font-size: 1.05rem;
    line-height: 1.6;
}

.contact .note[b-4krdd1mq2j] {
    color: #6c757d;
}
/* /Pages/ForClubs.razor.rz.scp.css */
/* AD-612: the "Are you a club?" pitch page.

   Follows Contact.razor.css - a centred reading column with muted secondary text -
   widened to 720px because the five numbered steps run considerably longer than
   Contact's three lines. Badge sizing is not repeated here; those rules moved to
   css/app.css when this page became the second consumer. */

.for-clubs[b-dnxfa7m7g3] {
    max-width: 720px;
    margin: 0 auto;
    padding: 2rem 0;
}

.for-clubs h1[b-dnxfa7m7g3] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.for-clubs h2[b-dnxfa7m7g3] {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 2.25rem 0 1rem;
}

.for-clubs p[b-dnxfa7m7g3] {
    font-size: 1.05rem;
    line-height: 1.6;
}

.for-clubs .lead[b-dnxfa7m7g3] {
    font-size: 1.25rem;
    color: #6c757d;
    margin-bottom: 1.5rem;
}

.for-clubs .steps[b-dnxfa7m7g3] {
    font-size: 1.05rem;
    line-height: 1.6;
    padding-left: 1.5rem;
}

.for-clubs .steps li[b-dnxfa7m7g3] {
    margin-bottom: 1.1rem;
}

/* The badges sit inside step 1, so they line up with the step's text instead of
   centring on the page the way they do on Home. */
.for-clubs .steps .badges[b-dnxfa7m7g3] {
    justify-content: flex-start;
    margin-top: 0.5rem;
}

.for-clubs .note[b-dnxfa7m7g3] {
    color: #6c757d;
    margin-top: 1.75rem;
}

.for-clubs .cta[b-dnxfa7m7g3] {
    margin-top: 1.5rem;
    font-size: 1.15rem;
    font-weight: 600;
}

@media (max-width: 640.98px) {
    .for-clubs h1[b-dnxfa7m7g3] {
        font-size: 1.75rem;
    }

    .for-clubs h2[b-dnxfa7m7g3] {
        font-size: 1.25rem;
    }

    .for-clubs .lead[b-dnxfa7m7g3] {
        font-size: 1.1rem;
    }
}
/* /Pages/Home.razor.rz.scp.css */
/* AD-547 landing page: two download sections stacked over a hero image. */

.download[b-m4jqmu6eo4] {
    text-align: center;
    padding: 2.5rem 0;
}

.download h1[b-m4jqmu6eo4],
.download h2[b-m4jqmu6eo4] {
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 0.75rem;
}

.download .lead[b-m4jqmu6eo4] {
    font-size: 1.25rem;
    color: #6c757d;
    margin: 0 0 1.5rem;
}

/* AD-612: .badges and the two .badge-* rules moved to css/app.css when ForClubs.razor
   became a second consumer - scoped CSS only ever matches this component's markup. */

.hero[b-m4jqmu6eo4] {
    padding: 1.5rem 0 2.5rem;
}

.hero img[b-m4jqmu6eo4] {
    display: block;
    width: 100%;
    max-width: 1200px;
    aspect-ratio: 12 / 7;
    margin: 0 auto;
}

.legal-links[b-m4jqmu6eo4] {
    text-align: center;
    font-size: 0.9rem;
    color: #6c757d;
}

@media (max-width: 640.98px) {
    .download h1[b-m4jqmu6eo4],
    .download h2[b-m4jqmu6eo4] {
        font-size: 1.75rem;
    }

    .download .lead[b-m4jqmu6eo4] {
        font-size: 1.1rem;
    }
}
