/* ============================================================
   DGxOne Public Design System
   Shared foundation for public, authentication, and onboarding pages.
   Page-specific layouts remain in their dedicated stylesheets.
   ============================================================ */

:root {
    color-scheme: dark;

    /* Brand colors */
    --dgxp-bg: #020609;
    --dgxp-bg-deep: #010305;
    --dgxp-surface: #071017;
    --dgxp-surface-raised: #0a141c;
    --dgxp-surface-soft: rgba(10, 20, 28, .72);

    --dgxp-text: #f3f7f9;
    --dgxp-text-muted: #8998a2;
    --dgxp-text-soft: #65757f;

    --dgxp-accent: #8bdcff;
    --dgxp-accent-strong: #ace9ff;
    --dgxp-accent-surface: rgba(49, 137, 171, .18);

    --dgxp-line: rgba(139, 220, 255, .13);
    --dgxp-line-soft: rgba(255, 255, 255, .07);

    /* Layout */
    --dgxp-max-width: 1480px;
    --dgxp-reading-width: 760px;
    --dgxp-nav-height: 82px;

    /* Spacing: 8px-based */
    --dgxp-space-1: 8px;
    --dgxp-space-2: 16px;
    --dgxp-space-3: 24px;
    --dgxp-space-4: 32px;
    --dgxp-space-5: 48px;
    --dgxp-space-6: 64px;
    --dgxp-space-7: 96px;
    --dgxp-space-8: 128px;

    /* Radius */
    --dgxp-radius-small: 8px;
    --dgxp-radius-medium: 16px;
    --dgxp-radius-large: 24px;

    /* Motion */
    --dgxp-motion-fast: 160ms;
    --dgxp-motion-standard: 220ms;
    --dgxp-motion-slow: 420ms;
    --dgxp-ease: cubic-bezier(.22, .75, .22, 1);

    /* Typography */
    --dgxp-font:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Helvetica,
        Arial,
        sans-serif;

    --dgxp-display-xl: clamp(4rem, 8vw, 8rem);
    --dgxp-display-lg: clamp(3.2rem, 6vw, 6.4rem);
    --dgxp-display-md: clamp(2.6rem, 5vw, 5rem);

    --dgxp-body-lg: clamp(1rem, 1.3vw, 1.18rem);
    --dgxp-body: .96rem;
    --dgxp-caption: .72rem;
}

body.dgx-public-site {
    min-width: 320px;
    min-height: 100svh;
    margin: 0;
    overflow-x: clip;
    color: var(--dgxp-text);
    background:
        radial-gradient(
            circle at 50% -12%,
            rgba(47, 137, 176, .14),
            transparent 36rem
        ),
        linear-gradient(
            180deg,
            #040b10 0%,
            var(--dgxp-bg) 46%,
            var(--dgxp-bg-deep) 100%
        );
    font-family: var(--dgxp-font);
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.dgx-public-site *,
.dgx-public-site *::before,
.dgx-public-site *::after {
    box-sizing: border-box;
}

.dgx-public-site a {
    color: inherit;
    text-decoration: none;
}

.dgx-public-site button,
.dgx-public-site input,
.dgx-public-site select,
.dgx-public-site textarea {
    font: inherit;
}

/* Shared content container */

.dgx-public-container {
    width: min(
        var(--dgxp-max-width),
        calc(100% - 64px)
    );
    margin-inline: auto;
}

/* Shared eyebrow */

.dgx-public-eyebrow {
    margin: 0;
    color: var(--dgxp-accent);
    font-size: .65rem;
    font-weight: 750;
    letter-spacing: .22em;
    text-transform: uppercase;
}

/* Shared headings */

.dgx-public-display {
    margin: 0;
    color: var(--dgxp-text);
    font-size: var(--dgxp-display-xl);
    font-weight: 650;
    line-height: .92;
    letter-spacing: -.064em;
    text-wrap: balance;
}

.dgx-public-heading {
    margin: 0;
    color: var(--dgxp-text);
    font-size: var(--dgxp-display-lg);
    font-weight: 640;
    line-height: .96;
    letter-spacing: -.055em;
    text-wrap: balance;
}

/* Shared body copy */

.dgx-public-lead {
    max-width: var(--dgxp-reading-width);
    margin: 0;
    color: var(--dgxp-text-muted);
    font-size: var(--dgxp-body-lg);
    line-height: 1.74;
    text-wrap: pretty;
}

/* Shared buttons */

.dgx-public-primary,
.dgx-public-secondary {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--dgxp-space-3);
    padding-inline: var(--dgxp-space-3);
    border-radius: var(--dgxp-radius-small);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .035em;
    transition:
        transform var(--dgxp-motion-fast) ease,
        border-color var(--dgxp-motion-fast) ease,
        background var(--dgxp-motion-fast) ease,
        color var(--dgxp-motion-fast) ease;
}

.dgx-public-primary {
    border: 1px solid rgba(139, 220, 255, .42);
    color: #edfaff;
    background: var(--dgxp-accent-surface);
}

.dgx-public-primary:hover,
.dgx-public-primary:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(139, 220, 255, .72);
    background: rgba(49, 137, 171, .27);
}

.dgx-public-secondary {
    border: 1px solid var(--dgxp-line-soft);
    color: #a9b8c1;
    background: rgba(255, 255, 255, .025);
}

.dgx-public-secondary:hover,
.dgx-public-secondary:focus-visible {
    color: var(--dgxp-text);
    border-color: rgba(139, 220, 255, .34);
}

/* Shared text action */

.dgx-public-text-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(163, 179, 189, .31);
    color: #a3b3bd;
    font-size: .8rem;
    font-weight: 600;
}

.dgx-public-text-link:hover,
.dgx-public-text-link:focus-visible {
    color: var(--dgxp-text);
    border-color: var(--dgxp-accent);
}

/* Shared card */

.dgx-public-card {
    border: 1px solid var(--dgxp-line);
    border-radius: var(--dgxp-radius-medium);
    background: var(--dgxp-surface-soft);
    box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}

/* Shared section rhythm */

.dgx-public-section {
    padding-block:
        clamp(
            var(--dgxp-space-7),
            12vw,
            180px
        );
    border-top: 1px solid var(--dgxp-line-soft);
}

/* Shared navigation */

.dgx-public-nav {
    min-height: var(--dgxp-nav-height);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: var(--dgxp-space-4);
    border-bottom: 1px solid var(--dgxp-line-soft);
}

.dgx-public-brand {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 12px;
}

.dgx-public-brand img {
    width: 34px;
    height: 34px;
}

.dgx-public-brand-copy {
    display: grid;
    gap: 3px;
}

.dgx-public-brand-copy strong {
    color: var(--dgxp-text);
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.dgx-public-brand-copy small {
    color: var(--dgxp-text-soft);
    font-size: .56rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.dgx-public-nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2.25vw, 36px);
}

.dgx-public-nav-links a {
    color: #7d8d98;
    font-size: .75rem;
    font-weight: 650;
    letter-spacing: .035em;
    transition: color var(--dgxp-motion-fast) ease;
}

.dgx-public-nav-links a:hover,
.dgx-public-nav-links a:focus-visible,
.dgx-public-nav-links a[aria-current="page"] {
    color: var(--dgxp-accent);
}

.dgx-public-nav-action {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    padding-inline: 17px;
    border: 1px solid rgba(139, 220, 255, .32);
    border-radius: var(--dgxp-radius-small);
    color: #dff6ff;
    background: rgba(52, 135, 168, .12);
    font-size: .72rem;
    font-weight: 700;
    transition:
        border-color var(--dgxp-motion-fast) ease,
        background var(--dgxp-motion-fast) ease;
}

.dgx-public-nav-action:hover,
.dgx-public-nav-action:focus-visible {
    border-color: rgba(139, 220, 255, .66);
    background: rgba(52, 135, 168, .22);
}

/* Shared footer */

.dgx-public-footer {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--dgxp-space-4);
    border-top: 1px solid var(--dgxp-line-soft);
}

.dgx-public-footer-brand {
    display: grid;
    gap: 5px;
}

.dgx-public-footer-brand strong {
    font-size: .88rem;
    letter-spacing: .06em;
}

.dgx-public-footer-brand span {
    color: var(--dgxp-text-soft);
    font-size: .62rem;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.dgx-public-footer nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--dgxp-space-3);
}

.dgx-public-footer nav a {
    color: #70818b;
    font-size: .7rem;
}

.dgx-public-footer nav a:hover,
.dgx-public-footer nav a:focus-visible {
    color: var(--dgxp-text);
}

/* Shared form controls for future auth/onboarding */

.dgx-public-field {
    display: grid;
    gap: 9px;
}

.dgx-public-field label {
    color: #a6b3bb;
    font-size: .78rem;
    font-weight: 600;
}

.dgx-public-field input,
.dgx-public-field select,
.dgx-public-field textarea {
    width: 100%;
    border: 1px solid var(--dgxp-line);
    border-radius: var(--dgxp-radius-small);
    color: var(--dgxp-text);
    background: rgba(1, 6, 9, .7);
    transition:
        border-color var(--dgxp-motion-fast) ease,
        box-shadow var(--dgxp-motion-fast) ease;
}

.dgx-public-field input,
.dgx-public-field select {
    min-height: 48px;
    padding-inline: 14px;
}

.dgx-public-field textarea {
    min-height: 140px;
    padding: 14px;
    resize: vertical;
}

.dgx-public-field input:focus,
.dgx-public-field select:focus,
.dgx-public-field textarea:focus {
    outline: none;
    border-color: rgba(139, 220, 255, .65);
    box-shadow: 0 0 0 3px rgba(139, 220, 255, .08);
}

/* Focus accessibility */

.dgx-public-site :focus-visible {
    outline: 2px solid rgba(139, 220, 255, .82);
    outline-offset: 3px;
}

/* Responsive foundation */

@media (max-width: 1050px) {
    .dgx-public-nav {
        grid-template-columns: 1fr auto;
    }

    .dgx-public-nav-links {
        display: none;
    }
}

@media (max-width: 780px) {
    :root {
        --dgxp-nav-height: 72px;
    }

    .dgx-public-container {
        width: min(
            var(--dgxp-max-width),
            calc(100% - 36px)
        );
    }

    .dgx-public-brand-copy small {
        display: none;
    }

    .dgx-public-footer {
        min-height: 170px;
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgx-public-site *,
    .dgx-public-site *::before,
    .dgx-public-site *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* End DGxOne Public Design System */
