/* Critical-shell: must stay in sync with src/index.css :root tokens.
   Source of truth: src/index.css — update both files together. */
:root {
    --background: 222 35% 8%;
    --foreground: 210 25% 97%;
    --primary: 168 79% 47%;
    --primary-foreground: 0 0% 100%;
    --muted: 222 17% 16%;
    --muted-foreground: 220 13% 72%;
    --accent: 222 19% 18%;
    --border: 222 16% 21%;
    --card: 222 24% 12%
}

* {
    box-sizing: border-box
}

body {
    margin: 0;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    line-height: 1.5
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-heading {
    font-family: Outfit, Inter, system-ui, -apple-system, "Segoe UI", sans-serif
}

.min-h-screen {
    min-height: 100vh
}

.flex {
    display: flex
}

.flex-col {
    flex-direction: column
}

.flex-1 {
    flex: 1 1 0%
}

.items-center {
    align-items: center
}

.justify-center {
    justify-content: center
}

.gap-3 {
    gap: .75rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-8 {
    gap: 2rem
}

.gap-12 {
    gap: 3rem
}

.h-16 {
    height: 4rem
}

.w-full {
    width: 100%
}

.fixed {
    position: fixed
}

.relative {
    position: relative
}

.top-0 {
    top: 0
}

.left-0 {
    left: 0
}

.right-0 {
    right: 0
}

.z-50 {
    z-index: 50
}

.border-b {
    border-bottom-width: 1px
}

.border-border {
    border-color: hsl(var(--border))
}

.bg-background {
    background: hsl(var(--background))
}

.bg-card {
    background: hsl(var(--card))
}

.text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}

.font-semibold {
    font-weight: 600
}

.leading-tight {
    line-height: 1.25
}

.text-primary {
    color: hsl(var(--primary))
}

.text-foreground {
    color: hsl(var(--foreground))
}

.text-muted-foreground {
    color: hsl(var(--muted-foreground))
}

.space-y-6>:not([hidden])~:not([hidden]) {
    margin-top: 1.5rem
}

.rounded-xl {
    border-radius: .75rem
}

.shadow-subtle {
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05)
}

.p-2 {
    padding: .5rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.py-2\.5 {
    padding-top: .625rem;
    padding-bottom: .625rem
}

.pt-20 {
    padding-top: 5rem
}

.pb-12 {
    padding-bottom: 3rem
}

@media(min-width:768px) {
    .md\:text-5xl {
        font-size: 3rem;
        line-height: 1
    }

    .md\:pt-24 {
        padding-top: 6rem
    }

    .md\:pb-16 {
        padding-bottom: 4rem
    }

}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}