@import 'Parallax.Client.rz4wo6nabi.bundle.scp.css';
@import '_content/AD.Admin/AD.Admin.6lkoncg0mo.bundle.scp.css';
@import '_content/AD.Ui/AD.Ui.le6a2hxpdw.bundle.scp.css';

/* /Components/Public/DocumentPage.razor.rz.scp.css */
.doc[b-l9nh8qcanj] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    max-width: var(--reading-max);
    margin-inline: auto;
    padding: var(--space-48) var(--space-24) var(--space-64);
}

.doc-title[b-l9nh8qcanj] {
    font-size: var(--fs-xl);
}

.doc[b-l9nh8qcanj]  h2 {
    margin-top: var(--space-16);
    font-size: var(--fs-lg);
}

.doc[b-l9nh8qcanj]  p {
    color: var(--clr-text-secondary);
}

@media (max-width: 640px) {
    .doc[b-l9nh8qcanj] {
        padding: var(--space-32) var(--space-16) var(--space-48);
    }
}
/* /Components/Public/Home.razor.rz.scp.css */
/* The showcase's landing. The hero sits on the frame, as Atlas Digital's; the sections on the paper ground. */
.pub-wrap[b-0m0rbeli1x] {
    width: 100%;
    max-width: var(--page-max);
    margin-inline: auto;
    padding-inline: var(--space-24);
}

.hero-inner[b-0m0rbeli1x] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    align-items: center;
    gap: var(--space-48);
    padding-block: var(--space-64);
}

.hero-text[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-16);
}

.hero-status[b-0m0rbeli1x] {
    color: var(--clr-frame-text-muted);
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hero-title[b-0m0rbeli1x] {
    max-width: 16ch;
    color: var(--clr-frame-text);
    font-size: calc(var(--fs-2xl) * 1.35);
    line-height: 1.1;
}

/* The title's second half in the gold, as Atlas Digital's hero: the frame's highlight. */
.hero-accent[b-0m0rbeli1x] {
    color: var(--clr-highlight);
}

.hero-lead[b-0m0rbeli1x] {
    max-width: var(--reading-max);
    color: var(--clr-frame-text-muted);
    font-size: var(--fs-md);
}

/* The panel's drawing on the frame's raised step, so the cover stands out from the hero's own frame. */
.hero-art[b-0m0rbeli1x]  .cover {
    background: var(--clr-frame-raised);
}

.pub-section[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-48) 0;
}

.pub-section:last-of-type[b-0m0rbeli1x] {
    padding-bottom: var(--space-64);
}

.steps[b-0m0rbeli1x],
.figures[b-0m0rbeli1x],
.principles[b-0m0rbeli1x] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: var(--space-16);
    list-style: none;
}

.step[b-0m0rbeli1x],
.principle[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.step h3[b-0m0rbeli1x],
.principle h3[b-0m0rbeli1x] {
    font-size: var(--fs-md);
}

.step p[b-0m0rbeli1x],
.principle p[b-0m0rbeli1x] {
    color: var(--clr-text-secondary);
}

/* A step's number is a reading aid, neutral: the accent acts, it does not label. */
.step-number[b-0m0rbeli1x] {
    font-family: var(--font-serif);
    font-size: var(--fs-xl);
    font-weight: 600;
    line-height: 1;
    color: var(--clr-text-muted);
}

/* Three short figures, always on one row: one a row, they took a phone's whole screen. */
.figures[b-0m0rbeli1x] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 640px) {
    .figures[b-0m0rbeli1x] {
        gap: var(--space-8);
    }

    .figure[b-0m0rbeli1x] {
        padding: var(--space-12);
    }

    .figure-number[b-0m0rbeli1x] {
        font-size: var(--fs-xl);
    }

    .figure-word[b-0m0rbeli1x] {
        font-size: var(--fs-sm);
    }
}

/* The principles, of uneven length, two by two on a desk: four narrow columns stretched the short ones to the
   longest's height, half empty. */
@media (min-width: 900px) {
    .principles[b-0m0rbeli1x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.figure[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.figure-number[b-0m0rbeli1x] {
    font-family: var(--font-serif);
    font-size: var(--fs-2xl);
    font-weight: 600;
    line-height: 1.1;
}

/* The card's serif stays the number's: its word reads in the text's face. */
.figure-word[b-0m0rbeli1x] {
    font-family: var(--font-sans);
    font-weight: 400;
    color: var(--clr-text-secondary);
}

.panel-list[b-0m0rbeli1x] {
    padding-top: var(--space-8);
}

.screens[b-0m0rbeli1x] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr));
    gap: var(--space-24);
}

.screen[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.screen-img[b-0m0rbeli1x] {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    box-shadow: 0 1px 2px var(--clr-shadow);
}

.faq[b-0m0rbeli1x] {
    display: flex;
    flex-direction: column;
    max-width: var(--reading-max);
    border-top: 1px solid var(--clr-border);
}

/* The family's FaqItem (AD.Showcase), drawn in Parallax's look: a hairline between questions, the chevron turning. */
.faq[b-0m0rbeli1x]  .faq-item {
    border-bottom: 1px solid var(--clr-border);
}

.faq[b-0m0rbeli1x]  .faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
    min-height: var(--target);
    padding-block: var(--space-12);
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.faq[b-0m0rbeli1x]  .faq-q::-webkit-details-marker {
    display: none;
}

.faq[b-0m0rbeli1x]  .faq-chev {
    flex: none;
    inline-size: 1.25rem;
    block-size: 1.25rem;
    color: var(--clr-text-muted);
    transition: transform var(--dur-2) var(--ease-out);
}

.faq[b-0m0rbeli1x]  .faq-item[open] .faq-chev {
    transform: rotate(180deg);
}

.faq[b-0m0rbeli1x]  .faq-a {
    padding-bottom: var(--space-16);
    color: var(--clr-text-secondary);
}

@media (max-width: 640px) {
    .pub-wrap[b-0m0rbeli1x] {
        padding-inline: var(--space-16);
    }

    .hero-inner[b-0m0rbeli1x] {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-24);
        padding-block: var(--space-40);
    }

    .hero-title[b-0m0rbeli1x] {
        font-size: var(--fs-2xl);
    }
}

/* The closing call: its words and the way to write, side by side on a desk, the button under them on a phone. */
.contact-card[b-0m0rbeli1x] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16) var(--space-32);
    padding: var(--space-24) var(--space-32);
    background: var(--clr-band);
    border-color: transparent;
    box-shadow: none;
}

.contact-body[b-0m0rbeli1x] {
    --stack-gap: var(--space-8);
    flex: 1 1 28rem;
    max-width: var(--reading-max);
}

.contact-title[b-0m0rbeli1x] {
    font-size: var(--fs-xl);
}

.contact-body p[b-0m0rbeli1x] {
    color: var(--clr-text-secondary);
}
/* /Components/Public/PublicLayout.razor.rz.scp.css */
/* The showcase's frame is the family's bar (AD.Ui base.css): the brand and the language switch, styled with the app's
   (app.css). No navigation tab bar: the showcase is one page and two documents. */
.pub-footer[b-8tqidsnlpm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-32);
    padding: var(--space-32) var(--space-16) var(--space-40);
    color: var(--clr-frame-text-muted);
    font-size: var(--fs-sm);
    text-align: center;
}

.pub-footer-links[b-8tqidsnlpm] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-4) var(--space-16);
}

.pub-footer-links a[b-8tqidsnlpm] {
    display: inline-flex;
    align-items: center;
    min-height: var(--target);
    color: var(--clr-frame-text-muted);
}

@media (hover: hover) {
    .pub-footer-links a:hover[b-8tqidsnlpm] {
        color: var(--clr-frame-text);
    }
}
/* /Components/SignIn/SignInLayout.razor.rz.scp.css */
/* The form, and beside it on a desk the frame's panel that says what Parallax is; under the form on a phone, where
   the form comes first. */
.sign-page[b-wexyw5fca6] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-24);
    align-items: stretch;
}

@media (min-width: 901px) {
    .sign-page[b-wexyw5fca6] {
        grid-template-columns: minmax(0, 28rem) minmax(0, 24rem);
        justify-content: center;
    }
}

.sign[b-wexyw5fca6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    width: 100%;
    max-width: 28rem;
    margin-inline: auto;
}

.sign-switch[b-wexyw5fca6] {
    padding-top: var(--space-8);
    border-top: 1px solid var(--clr-border);
}

.sign-demo[b-wexyw5fca6] {
    padding-top: var(--space-16);
    border-top: 1px solid var(--clr-border);
}

.sign-aside[b-wexyw5fca6] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-16);
    width: 100%;
    max-width: 28rem;
    margin-inline: auto;
    padding: var(--space-32) var(--space-24);
    border-radius: var(--radius-lg);
    background: var(--clr-frame);
    color: var(--clr-frame-text);
}

.sign-aside[b-wexyw5fca6]  .sign-art {
    width: min(12rem, 70%);
    margin-bottom: var(--space-8);
}

.sign-aside-title[b-wexyw5fca6] {
    color: var(--clr-frame-text);
    font-size: var(--fs-xl);
    line-height: 1.2;
}

.sign-points[b-wexyw5fca6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    list-style: none;
}

/* Each point after the signature stroke, in the highlight, in its proportions (a slash as high as the line). */
.sign-points li[b-wexyw5fca6] {
    position: relative;
    padding-left: var(--space-24);
    color: var(--clr-frame-text-muted);
}

.sign-points li[b-wexyw5fca6]::before {
    content: "";
    position: absolute;
    top: 0.3em;
    left: 0.25rem;
    width: var(--signature-width);
    height: 1em;
    border-radius: var(--radius-xs);
    background: var(--clr-highlight);
    transform: skewX(-30deg);
}

/* Mastodon under the registration's form, apart from it as on the sign-in page. */
.sign-alternative[b-wexyw5fca6] {
    margin-top: var(--space-24);
    padding-top: var(--space-24);
    border-top: 1px solid var(--clr-border);
}