/* /Components/Aura/AuraAboutCompact.razor.rz.scp.css */
.about-compact-layout[b-gp17aqq3j6] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
}

@media (min-width: 48rem) {
    .about-compact-layout[b-gp17aqq3j6] {
        grid-template-columns: 3fr 2fr;
        align-items: start;
    }
}

.about-compact-copy[b-gp17aqq3j6] {
    display: flex;
    flex-direction: column;
}

.about-compact-anchors[b-gp17aqq3j6] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.about-headshot[b-gp17aqq3j6] {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--color-border);
}

.about-anchor-list[b-gp17aqq3j6] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    list-style: none;
    padding: 0;
    margin: 0;
}

.about-anchor-item[b-gp17aqq3j6] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.about-anchor-marker[b-gp17aqq3j6] {
    color: var(--color-accent);
    font-size: var(--text-caption);
    flex-shrink: 0;
}
/* /Components/Aura/AuraButton.razor.rz.scp.css */
button:focus-visible[b-hvj7mfbbz8],
a:focus-visible[b-hvj7mfbbz8] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}
/* /Components/Aura/AuraCaseCard.razor.rz.scp.css */
.case-bullets[b-djco6gmfi5] {
    list-style: none;
    padding: 0;
    margin-top: var(--spacing-lg);
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.case-bullet[b-djco6gmfi5] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
}

.case-bullet-icon[b-djco6gmfi5] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-top: 0.1em;
    color: var(--color-text-muted);
}

.case-bullet-icon--after[b-djco6gmfi5] {
    color: var(--color-accent);
}

.case-bullet-text[b-djco6gmfi5] {
    font-size: var(--text-body);
    font-weight: 400;
    color: var(--color-text-muted);
    line-height: 1.55;
}

.case-bullet-text--after[b-djco6gmfi5] {
    color: var(--color-text-main);
    font-weight: 500;
}
/* /Components/Aura/AuraClientFitSection.razor.rz.scp.css */
.fit-grid[b-josz0h19yn] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
}

@media (min-width: 40rem) {
    .fit-grid[b-josz0h19yn] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Aura/AuraCtaBanner.razor.rz.scp.css */
.cta-inner[b-3ckdvndvo2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-lg);
    text-align: center;
}

.trust-strip[b-3ckdvndvo2] {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-lg);
    padding: 0;
    margin: 0;
}

.trust-strip li[b-3ckdvndvo2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.trust-icon[b-3ckdvndvo2] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    color: var(--color-text-muted);
}
/* /Components/Aura/AuraDifferentiatorRow.razor.rz.scp.css */
.diff-row[b-uwash26as9] {
    display: grid;
    grid-template-columns: 2rem 1fr;
    grid-template-areas:
        "icon theirs"
        ".    ours";
    column-gap: var(--spacing-sm);
    row-gap: var(--spacing-xs);
    align-items: center;
}

.diff-icon[b-uwash26as9] {
    grid-area: icon;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-accent);
    flex-shrink: 0;
}

/* Theirs — second child */
.diff-row > span:nth-child(2)[b-uwash26as9] {
    grid-area: theirs;
}

/* Ours — third child: sits under Theirs, not under icon */
.diff-row > span:nth-child(3)[b-uwash26as9] {
    grid-area: ours;
}

@media (min-width: 40rem) {
    .diff-row[b-uwash26as9] {
        grid-template-columns: 2rem 1fr 1fr;
        grid-template-areas: "icon theirs ours";
        row-gap: 0;
    }
}
/* /Components/Aura/AuraDifferentiatorSection.razor.rz.scp.css */
.diff-layout[b-ro65snqna6] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
}

@media (min-width: 40rem) {
    .diff-layout[b-ro65snqna6] {
        grid-template-columns: 3fr 2fr;
    }
}

.diff-col[b-ro65snqna6] {
    display: flex;
    flex-direction: column;
}

/* Mirror the diff-row grid so headers align with row columns */
.diff-header-row[b-ro65snqna6] {
    display: none;
}

@media (min-width: 40rem) {
    .diff-header-row[b-ro65snqna6] {
        display: grid;
        grid-template-columns: 2rem 1fr 1fr;
        gap: var(--spacing-sm);
        align-items: end;
    }
}
/* /Components/Aura/AuraFaq.razor.rz.scp.css */
.faq-header[b-q2pbkosa6s] {
    margin-bottom: var(--spacing-xl);
}

.faq-subline[b-q2pbkosa6s] {
    color: var(--color-text-muted);
}

.faq-list[b-q2pbkosa6s] {
    display: flex;
    flex-direction: column;
}

.faq-item:first-child[b-q2pbkosa6s] {
    border-top: 1px solid var(--color-border);
}

/* <details> element resets */
.faq-item[b-q2pbkosa6s] {
    display: block;
}

.faq-trigger[b-q2pbkosa6s] {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-md);
    width: 100%;
    cursor: pointer;
    padding: var(--spacing-md) 0;
    color: var(--color-text-main);
    text-align: left;
}

/* Hide the default <summary> disclosure triangle in all browsers */
.faq-trigger[b-q2pbkosa6s]::-webkit-details-marker {
    display: none;
}

.faq-trigger[b-q2pbkosa6s]::marker {
    display: none;
    content: '';
}

.faq-trigger:hover[b-q2pbkosa6s] {
    color: var(--color-accent);
}

.faq-chevron[b-q2pbkosa6s] {
    color: var(--color-text-muted);
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

details[open] .faq-chevron[b-q2pbkosa6s] {
    transform: rotate(180deg);
    color: var(--color-accent);
}

.faq-answer[b-q2pbkosa6s] {
    padding-bottom: var(--spacing-md);
}
/* /Components/Aura/AuraFooter.razor.rz.scp.css */
ul[b-mc5a1etymj] {
    margin: 0;
    padding: 0;
}
/* /Components/Aura/AuraFrameworkPanel.razor.rz.scp.css */
.framework-header[b-3jofedpfs1] {
    margin-bottom: var(--spacing-md);
    padding-bottom: var(--spacing-sm);
    border-bottom: 1px solid var(--color-border);
}

.framework-title[b-3jofedpfs1] {
    margin-top: var(--spacing-xs);
    color: var(--color-text-main);
}

.framework-steps[b-3jofedpfs1] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.framework-step[b-3jofedpfs1] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
}

.step-id[b-3jofedpfs1] {
    flex-shrink: 0;
    min-width: 1.75rem;
    font-weight: 700;
    color: var(--color-accent);
    background-color: var(--color-accent-soft);
    border-radius: var(--radius-sm);
    padding: var(--spacing-xs);
    text-align: center;
    font-size: var(--text-caption);
    letter-spacing: .06em;
    text-transform: uppercase;
}
/* /Components/Aura/AuraHero.razor.rz.scp.css */
.hero-grid[b-f6k8i2ah4g] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
    align-items: stretch;
}

@media (min-width: 40rem) {
    .hero-grid[b-f6k8i2ah4g] {
        grid-template-columns: 1fr 1fr;
    }

    .hero-grid--full[b-f6k8i2ah4g] {
        grid-template-columns: 1fr;
    }
}

.hero-left[b-f6k8i2ah4g] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.hero-right[b-f6k8i2ah4g] {
    display: flex;
    flex-direction: column;
}

/* Hero h1 — uses --text-heading-hero token (3rem); no compiled utility exists */
.hero-heading[b-f6k8i2ah4g] {
    font-size: var(--text-heading-hero);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--color-text-main);
}

.cta-group[b-f6k8i2ah4g] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    align-items: center;
    margin-top: auto;
    padding-top: var(--spacing-xl);
}

/* Full-width symptom grid — second row beneath headline + AURA panel */
.hero-symptoms[b-f6k8i2ah4g] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-sm);
    margin-top: var(--spacing-2xl);
}

@media (min-width: 40rem) {
    .hero-symptoms[b-f6k8i2ah4g] {
        grid-template-columns: repeat(4, 1fr);
    }
}
/* /Components/Aura/AuraNavbar.razor.rz.scp.css */
button:focus-visible[b-tbo3og3t49] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

/* ── Brand ──────────────────────────────────────────────────── */
.navbar-brand[b-tbo3og3t49] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-sm);
    text-decoration: none;
    color: inherit;
    flex-shrink: 0;
}

.navbar-brand:focus-visible[b-tbo3og3t49] {
    outline: 2px solid var(--color-accent);
    outline-offset: 4px;
    border-radius: var(--radius-sm);
}

.navbar-brand-logo[b-tbo3og3t49] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-accent);
    flex-shrink: 0;
}

.navbar-brand-text[b-tbo3og3t49] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    line-height: 1.2;
}

.navbar-brand-name[b-tbo3og3t49] {
    font-size: var(--text-body);
    font-weight: 700;
    color: var(--color-text-main);
    letter-spacing: -0.01em;
}

.navbar-brand-tagline[b-tbo3og3t49] {
    font-size: var(--text-eyebrow);
    color: var(--color-text-muted);
    letter-spacing: 0.01em;
    /* hide on very small screens, show sm+ */
    display: none;
}

@media (min-width: 40rem) {
    .navbar-brand-tagline[b-tbo3og3t49] { display: block; }
}
/* /Components/Aura/AuraOutcomeCard.razor.rz.scp.css */
.outcome-card-inner[b-ng0b6zcqj3] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.outcome-icon[b-ng0b6zcqj3] {
    color: var(--color-accent);
    line-height: 1;
}
/* /Components/Aura/AuraOutcomeStrip.razor.rz.scp.css */
.outcomes-header[b-7n5p31gk33] {
    margin-bottom: var(--spacing-xl);
}

.outcomes-subline[b-7n5p31gk33] {
    margin-top: var(--spacing-sm);
    color: var(--color-text-muted);
}

.outcomes-grid[b-7n5p31gk33] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
}

@media (min-width: 40rem) {
    .outcomes-grid[b-7n5p31gk33] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 60rem) {
    .outcomes-grid[b-7n5p31gk33] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Components/Aura/AuraPageLayout.razor.rz.scp.css */
.skip-link[b-jpiwpe9rye] {
    position: absolute;
    top: -100%;
    left: var(--spacing-md);
    z-index: 9999;
    padding: var(--spacing-sm) var(--spacing-md);
    background-color: var(--color-accent);
    color: var(--color-page);
    border-radius: var(--radius-md);
    font-size: var(--text-caption);
    font-weight: 600;
    text-decoration: none;
    transition: top 0.1s ease;
}

.skip-link:focus-visible[b-jpiwpe9rye] {
    top: var(--spacing-md);
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}
/* /Components/Aura/AuraProcessSection.razor.rz.scp.css */
.process-header[b-3hx8wcvuz3] {
    margin-bottom: var(--spacing-xl);
}

.process-subline[b-3hx8wcvuz3] {
    margin-top: var(--spacing-sm);
    color: var(--color-text-muted);
}

.process-grid[b-3hx8wcvuz3] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
}

@media (min-width: 40rem) {
    .process-grid[b-3hx8wcvuz3] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 60rem) {
    .process-grid[b-3hx8wcvuz3] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Components/Aura/AuraProcessStep.razor.rz.scp.css */
.step-inner[b-pqvxwlot7i] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.step-icon[b-pqvxwlot7i] {
    color: var(--color-accent);
    line-height: 1;
}

.step-label[b-pqvxwlot7i] {
    color: var(--color-accent);
    font-size: var(--text-heading-lg);
    font-weight: 700;
    line-height: 1;
}
/* /Components/Aura/AuraSectionNav.razor.rz.scp.css */
/* Sticky section navigator — attaches to viewport top once the main navbar scrolls away */
.section-nav[b-bmiibv9jsr] {
    position: sticky;
    top: 0;
    z-index: 40;
    background-color: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
}

.section-nav-list[b-bmiibv9jsr] {
    list-style: none;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) 0;
    margin: 0;
    /* Allow horizontal scroll on narrow viewports without showing a scrollbar */
    overflow-x: auto;
    scrollbar-width: none;
}

.section-nav-list[b-bmiibv9jsr]::-webkit-scrollbar {
    display: none;
}

.section-nav-link[b-bmiibv9jsr] {
    display: inline-block;
    padding: var(--spacing-xs) var(--spacing-sm);
    font-size: var(--text-caption);
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    white-space: nowrap;
    transition: color var(--default-transition-duration) var(--default-transition-timing-function),
                background-color var(--default-transition-duration) var(--default-transition-timing-function);
}

.section-nav-link:hover[b-bmiibv9jsr] {
    color: var(--color-text-main);
    background-color: var(--color-surface-elevated);
}

.section-nav-link:focus-visible[b-bmiibv9jsr] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
    color: var(--color-text-main);
}

/* Push "↑ Top" to the far right */
.section-nav-top-item[b-bmiibv9jsr] {
    margin-left: auto;
}

.section-nav-top[b-bmiibv9jsr] {
    color: var(--color-accent);
    font-weight: 600;
}

.section-nav-top:hover[b-bmiibv9jsr] {
    color: var(--color-accent);
    background-color: var(--color-accent-soft);
}
/* /Components/Aura/AuraSymptomCard.razor.rz.scp.css */
.symptom-card-inner[b-12gsdnnndw] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.symptom-icon[b-12gsdnnndw] {
    color: var(--color-accent);
    line-height: 1;
}
/* /Components/Aura/AuraTrustPanel.razor.rz.scp.css */
.trust-panel-layout[b-xgi8a4ia4z] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
}

@media (min-width: 48rem) {
    .trust-panel-layout[b-xgi8a4ia4z] {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }
}

.trust-panel-intro[b-xgi8a4ia4z] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.trust-panel-grid[b-xgi8a4ia4z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.trust-item-inner[b-xgi8a4ia4z] {
    display: flex;
    flex-direction: column;
}

.trust-item-icon[b-xgi8a4ia4z] {
    color: var(--color-accent);
    font-size: var(--text-subheading);
    line-height: 1;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Blazor error overlay — hidden by default, shown by Blazor JS on unhandled exception */
#blazor-error-ui[b-dz9rmrmgh8] {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: var(--spacing-sm) var(--spacing-lg);
    background-color: var(--color-surface-elevated);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-main);
    font-size: var(--text-caption);
    text-align: center;
}

#blazor-error-ui .reload[b-dz9rmrmgh8] {
    color: var(--color-accent);
    text-decoration: underline;
    cursor: pointer;
}

#blazor-error-ui .dismiss[b-dz9rmrmgh8] {
    cursor: pointer;
    color: var(--color-text-muted);
    margin-left: auto;
}

/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* ── Backdrop ─────────────────────────────────────────── */
dialog#components-reconnect-modal[b-wm2la90eup] {
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(24rem, 90vw);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface-elevated);
    color: var(--color-text-main);
    padding: var(--spacing-xl);
    box-shadow: 0 1.5rem 3rem oklch(0 0 0 / 0.55);
    z-index: 9999;
}

dialog#components-reconnect-modal[b-wm2la90eup]::backdrop {
    background: oklch(0 0 0 / 0.60);
    backdrop-filter: blur(4px);
}

/* ── Container ─────────────────────────────────────────── */
.components-reconnect-container[b-wm2la90eup] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-md);
    text-align: center;
}

/* ── Status paragraphs ─────────────────────────────────── */
.components-reconnect-container p[b-wm2la90eup] {
    margin: 0;
    font-size: var(--text-body);
    color: var(--color-text-muted);
    line-height: 1.6;
}

/* ── Spinner animation ─────────────────────────────────── */
.components-rejoining-animation[b-wm2la90eup] {
    display: flex;
    gap: var(--spacing-xs);
    align-items: center;
    justify-content: center;
    height: 2rem;
}

.components-rejoining-animation div[b-wm2la90eup] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--color-accent);
    animation: reconnect-bounce-b-wm2la90eup 1.2s ease-in-out infinite;
}

.components-rejoining-animation div:nth-child(1)[b-wm2la90eup] { animation-delay: 0s; }
.components-rejoining-animation div:nth-child(2)[b-wm2la90eup] { animation-delay: 0.2s; }

@keyframes reconnect-bounce-b-wm2la90eup {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
    40%            { transform: scale(1.0); opacity: 1;   }
}

/* ── Buttons ───────────────────────────────────────────── */
.components-reconnect-container button[b-wm2la90eup] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-accent);
    background: transparent;
    color: var(--color-accent);
    font-size: var(--text-body);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    width: 100%;
}

.components-reconnect-container button:hover[b-wm2la90eup] {
    background: var(--color-accent);
    color: oklch(0.11 0.005 264);
}

/* ── Blazor visibility state helpers ───────────────────── */
/*  Blazor adds one of these classes to the <dialog> to show the right content */
.components-reconnect-container .components-reconnect-first-attempt-visible[b-wm2la90eup],
.components-reconnect-container .components-reconnect-repeated-attempt-visible[b-wm2la90eup],
.components-reconnect-container .components-reconnect-failed-visible[b-wm2la90eup],
.components-reconnect-container .components-pause-visible[b-wm2la90eup],
.components-reconnect-container .components-resume-failed-visible[b-wm2la90eup] {
    display: none;
}

dialog#components-reconnect-modal.components-reconnect-show    .components-reconnect-first-attempt-visible[b-wm2la90eup]  { display: block; }
dialog#components-reconnect-modal.components-reconnect-failed  .components-reconnect-failed-visible[b-wm2la90eup]         { display: block; }
dialog#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-wm2la90eup] { display: block; }
dialog#components-reconnect-modal.components-reconnect-paused  .components-pause-visible[b-wm2la90eup]                    { display: block; }
dialog#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-wm2la90eup]      { display: block; }
/* spin only when actively reconnecting */
dialog#components-reconnect-modal:not(.components-reconnect-failed):not(.components-reconnect-paused):not(.components-reconnect-resume-failed) .components-rejoining-animation[b-wm2la90eup] { display: flex; }
.components-rejoining-animation[b-wm2la90eup] { display: none; }

/* /Components/Pages/GetStarted.razor.rz.scp.css */
/* Assessment call steps — single column, stacked cards */
.gs-steps[b-qbk4js4et5] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.gs-step[b-qbk4js4et5] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
}

.gs-step-num[b-qbk4js4et5] {
    flex-shrink: 0;
    font-size: var(--text-heading);
    font-weight: 700;
    color: var(--color-accent);
    line-height: 1;
    min-width: 2.5rem;
}

/* What to expect — 2-col mobile, 4-col desktop */
.gs-expect-grid[b-qbk4js4et5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-xl);
}

@media (min-width: 60rem) {
    .gs-expect-grid[b-qbk4js4et5] {
        grid-template-columns: repeat(4, 1fr);
    }
}

.gs-expect-item[b-qbk4js4et5] {
    display: flex;
    flex-direction: column;
}

.gs-expect-icon[b-qbk4js4et5] {
    font-size: var(--text-heading);
    color: var(--color-accent);
    margin-bottom: var(--spacing-sm);
    line-height: 1;
}

/* Booking CTA — stacked on mobile, side-by-side on desktop */
.gs-booking[b-qbk4js4et5] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
}

@media (min-width: 40rem) {
    .gs-booking[b-qbk4js4et5] {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
        gap: var(--spacing-2xl);
    }
}

.gs-booking-copy[b-qbk4js4et5] {
    flex: 1;
}

.gs-booking-action[b-qbk4js4et5] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}