/* =========================
   GovTransfer Auth - Shared
   ========================= */

/* Tokens */
:root {
    --gt-bg0: #070b13;
    --gt-bg1: #0b1220;
    --gt-surface: rgba(17, 24, 39, 0.84);
    --gt-border: rgba(255,255,255,0.09);
    --gt-text: rgba(255,255,255,0.92);
    --gt-muted: rgba(255,255,255,0.62);
    --gt-accent: #0f46b8;
    --gt-accentHover: #1557e0;
    --gt-accentTeal: #23c6b6;
}

/* Page shell */
.gt-auth2 {
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    color: var(--gt-text);
    background: linear-gradient(180deg, var(--gt-bg0), var(--gt-bg1));
}

/* Background layers */
.gt-auth2__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.gt-auth2__grid {
    position: absolute;
    inset: -20%;
    opacity: 0.18;
    background: linear-gradient(to right, rgba(255,255,255,0.06) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,0.06) 1px, transparent 1px);
    background-size: 90px 90px;
    transform: rotate(-8deg);
}

.gt-auth2__flow {
    position: absolute;
    inset: -35%;
    opacity: 0.58;
    background: radial-gradient(closest-side at 22% 18%, rgba(15,70,184,0.24), transparent 62%), radial-gradient(closest-side at 72% 45%, rgba(35,198,182,0.14), transparent 60%), radial-gradient(closest-side at 58% 85%, rgba(15,70,184,0.12), transparent 62%);
    filter: blur(20px);
    animation: gtFlowDrift 44s cubic-bezier(0.2,0.8,0.2,1) infinite alternate;
    will-change: transform;
}

@keyframes gtFlowDrift {
    0% {
        transform: translate3d(-2.5%, -1.2%, 0) scale(1.02);
    }

    50% {
        transform: translate3d( 1.6%, 1.4%, 0) scale(1.04);
    }

    100% {
        transform: translate3d( 2.2%, -2.0%, 0) scale(1.03);
    }
}

.gt-auth2__nodes {
    position: absolute;
    inset: 0;
    opacity: 0.50;
    background: radial-gradient(2px 2px at 14% 26%, rgba(255,255,255,0.55), transparent 60%), radial-gradient(2px 2px at 32% 54%, rgba(255,255,255,0.45), transparent 60%), radial-gradient(2px 2px at 46% 30%, rgba(255,255,255,0.50), transparent 60%), radial-gradient(2px 2px at 62% 64%, rgba(255,255,255,0.42), transparent 60%), radial-gradient(2px 2px at 78% 38%, rgba(255,255,255,0.50), transparent 60%), radial-gradient(2px 2px at 90% 74%, rgba(255,255,255,0.38), transparent 60%), linear-gradient(115deg, transparent 48%, rgba(15,70,184,0.16) 50%, transparent 52%), linear-gradient(22deg, transparent 49%, rgba(35,198,182,0.12) 50%, transparent 51%);
    background-repeat: no-repeat;
    animation: gtNodesFloat 28s ease-in-out infinite alternate;
    will-change: transform;
}

@keyframes gtNodesFloat {
    0% {
        transform: translate3d(0,0,0);
    }

    100% {
        transform: translate3d(-1.0%, 0.8%, 0);
    }
}

.gt-auth2__vignette {
    position: absolute;
    inset: 0;
    background: radial-gradient(900px 600px at 35% 38%, transparent 0%, rgba(0,0,0,0.22) 55%, rgba(0,0,0,0.62) 100%), radial-gradient(900px 600px at 75% 45%, transparent 0%, rgba(0,0,0,0.18) 52%, rgba(0,0,0,0.60) 100%);
}

/* Layout */
.gt-auth2__layout {
    position: relative;
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
}

/* Left marketing */
.gt-auth2__left {
    display: grid;
    place-items: center;
    padding: 72px 56px;
}

.gt-auth2__leftInner {
    width: min(640px, 92vw);
    transform: translateY(-0.75vh);
}

.gt-auth2__pitchTitle {
    font-size: clamp(1.8rem, 2.4vw, 2.4rem);
    letter-spacing: 0.2px;
    margin: 0 0 10px;
    font-weight: 800;
}

.gt-auth2__pitchText {
    margin: 0 0 18px;
    color: rgba(255,255,255,0.72);
    line-height: 1.55;
    max-width: 52ch;
}

.gt-featureList {
    margin: 18px 0;
    display: grid;
    gap: 14px;
}

.gt-feature {
    display: grid;
    grid-template-columns: 86px 1fr;
    gap: 14px;
    align-items: center;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.10);
    background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(0,0,0,0.10));
    box-shadow: 0 18px 44px rgba(0,0,0,0.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .gt-feature:hover {
        transform: translateY(-1px);
        border-color: rgba(255,255,255,0.14);
        background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(0,0,0,0.12));
    }

.gt-featureIcon {
    width: 76px;
    height: 76px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,0.14);
    background: radial-gradient(60% 60% at 30% 30%, rgba(21,87,224,0.35), transparent 60%), radial-gradient(60% 60% at 75% 70%, rgba(35,198,182,0.18), transparent 62%), rgba(0,0,0,0.20);
    box-shadow: 0 16px 40px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.10);
    overflow: hidden;
    animation: gtIconFloat 7.2s ease-in-out infinite;
    will-change: transform;
}

.gt-feature:nth-child(2) .gt-featureIcon {
    animation-duration: 8.3s;
}

.gt-feature:nth-child(3) .gt-featureIcon {
    animation-duration: 6.6s;
}

@keyframes gtIconFloat {
    0% {
        transform: translate3d(0,0,0);
    }

    50% {
        transform: translate3d(0,-5px,0);
    }

    100% {
        transform: translate3d(0,0,0);
    }
}

.gt-featureIcon svg {
    width: 54px;
    height: 54px;
    filter: drop-shadow(0 10px 18px rgba(0,0,0,0.28));
}

.gt-featureTitle {
    margin: 0 0 4px;
    font-weight: 720;
    letter-spacing: 0.2px;
    font-size: 1.02rem;
    color: rgba(255,255,255,0.92);
}

.gt-featureDesc {
    margin: 0;
    color: rgba(255,255,255,0.68);
    line-height: 1.45;
    font-size: 0.92rem;
}

.gt-auth2__trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.gt-auth2__trustItem {
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(0,0,0,0.18);
    color: rgba(255,255,255,0.78);
    font-size: 0.85rem;
}

/* Right form pane */
.gt-auth2__right {
    display: grid;
    place-items: center;
    padding: 56px 22px;
}

.gt-auth2__rightInner {
    width: min(620px, 92vw);
    transform: translateY(-0.75vh);
}

/* Card */
.gt-auth2__card {
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, rgba(17,24,39,0.92), rgba(17,24,39,0.78));
    border: 1px solid var(--gt-border);
    border-radius: 18px;
    box-shadow: 0 40px 90px rgba(0,0,0,0.45), 0 12px 36px rgba(0,0,0,0.30);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 24px 24px 20px;
    animation: gtCardIn 520ms cubic-bezier(0.2,0.8,0.2,1) both;
}

@keyframes gtCardIn {
    from {
        opacity: 0;
        transform: translate3d(0,10px,0) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translate3d(0,0,0) scale(1);
    }
}

/* Brand + headings */
.gt-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

    .gt-brand img {
        height: 52px;
        width: auto;
    }

.gt-brand__name {
    font-weight: 820;
    font-size: 1.25rem;
    letter-spacing: 0.3px;
    margin: 0;
}

.gt-brand__tag {
    color: var(--gt-muted);
    font-size: 0.9rem;
    margin: 2px 0 0;
}

.gt-h1 {
    margin: 14px 0 4px;
    font-size: 1.25rem;
    letter-spacing: 0.2px;
}

.gt-sub {
    margin: 0 0 14px;
    color: rgba(255,255,255,0.70);
}

/* Inputs */
.gt-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}

.gt-label {
    font-size: 0.9rem;
    color: var(--gt-muted);
}

.gt-inputWrap {
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(0,0,0,0.18);
    border-radius: 12px;
    padding: 10px 12px;
    transition: border-color 200ms ease, box-shadow 200ms ease, background-color 200ms ease;
}

    .gt-inputWrap:focus-within {
        border-color: rgba(15,70,184,0.65);
        box-shadow: 0 0 0 4px rgba(15,70,184,0.18);
        background: rgba(0,0,0,0.24);
    }

.gt-inputIcon {
    color: rgba(255,255,255,0.60);
}

.gt-input {
    flex: 1;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    color: var(--gt-text) !important;
    padding: 0 !important;
    min-width: 0;
}

    .gt-input::placeholder {
        color: rgba(255,255,255,0.35);
    }

.gt-reveal {
    border: none;
    background: transparent;
    color: rgba(255,255,255,0.75);
    cursor: pointer;
    padding: 6px;
    border-radius: 10px;
    transition: background-color 150ms ease, transform 150ms ease;
}

    .gt-reveal:hover {
        background: rgba(255,255,255,0.08);
    }

    .gt-reveal:active {
        transform: translateY(1px);
    }

/* Helpers / errors */
.gt-help {
    color: rgba(255,255,255,0.50);
    font-size: 0.8rem;
    line-height: 1.35;
    margin-top: 6px;
}

.gt-danger {
    color: #ff6b6b !important;
}

/* Checkbox */
.gt-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: rgba(255,255,255,0.70);
    font-size: 0.9rem;
    line-height: 1.35;
}

    .gt-check input {
        width: 16px;
        height: 16px;
        margin-top: 2px;
        accent-color: var(--gt-accent);
    }

/* Links + primary button */
.gt-link {
    color: rgba(255,255,255,0.78);
    text-decoration: none;
}

    .gt-link:hover {
        text-decoration: underline;
    }

.gt-btnPrimary {
    margin-top: 6px;
    height: 46px;
    width: 100%;
    border-radius: 12px;
    border: 1px solid rgba(15,70,184,0.60);
    background: linear-gradient(180deg, var(--gt-accentHover), var(--gt-accent));
    color: white;
    font-weight: 650;
    letter-spacing: 0.2px;
    cursor: pointer;
    box-shadow: 0 14px 26px rgba(15,70,184,0.20);
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

    .gt-btnPrimary:hover {
        transform: translateY(-1px);
        box-shadow: 0 18px 32px rgba(15,70,184,0.26);
        filter: brightness(1.03);
    }

    .gt-btnPrimary:active {
        transform: translateY(0);
    }

/* Footer (shared fix: always in normal flow) */
.gt-footer {
    position: static !important;
    margin-top: 14px;
    padding-top: 0px;
    border-top: 1px solid rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.35);
    font-size: 0.8rem;
    text-align: center;
}

/* Common secondary row */
.gt-secondaryRow {
    margin-top: 12px;
    color: rgba(255,255,255,0.65);
    font-size: 0.9rem;
    text-align: center;
}

/* Responsive stacking */
@media (max-width: 980px) {
    .gt-auth2__layout {
        grid-template-columns: 1fr;
    }

    .gt-auth2__left {
        display: none;
    }

    .gt-auth2__rightInner {
        transform: none;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .gt-auth2__flow,
    .gt-auth2__nodes {
        animation: none !important;
    }

    .gt-auth2__card {
        animation: none !important;
    }

    .gt-featureIcon {
        animation: none !important;
    }
}

/* Selection + focus */
::selection {
    background: rgba(15,70,184,0.35);
}

:focus-visible {
    outline: 2px solid rgba(15,70,184,0.65);
    outline-offset: 2px;
    border-radius: 10px;
}

/* Normalize primary buttons across <a> and <button> */
.gt-btnPrimary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #FFFFFF !important;
    text-decoration: none; /* fixes <a> */
    appearance: none; /* fixes <button> */
    -webkit-appearance: none;
    line-height: 1; /* prevents baseline drift */
}