/* Customer login hero — cinematic image only, no overlay UI */

body.customer-ui-new.customer-login-new .customer-auth-hero {
    justify-content: center;
    align-items: stretch;
    padding: 0;
    background-color: #020812;
    background-image:
        linear-gradient(90deg, rgba(2, 8, 18, 0.98) 0%, rgba(2, 8, 18, 0.72) 14%, rgba(2, 8, 18, 0.08) 42%, rgba(2, 8, 18, 0.22) 100%),
        linear-gradient(180deg, rgba(2, 8, 18, 0.2) 0%, rgba(2, 8, 18, 0.05) 42%, rgba(2, 8, 18, 0.72) 100%),
        var(--classic-login-bg);
    background-position: center, center, 66% center;
    background-size: cover, cover, cover;
}

body.customer-ui-new.customer-login-new .customer-auth-hero::before {
    z-index: 0;
    opacity: 0;
    mask-image: none;
}

body.customer-ui-new.customer-login-new .customer-auth-hero::after {
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(circle at 78% 62%, rgba(var(--portal-primary-rgb), 0.14), transparent 46%),
        radial-gradient(circle at 24% 18%, rgba(var(--portal-secondary-rgb), 0.08), transparent 40%);
    content: '';
    pointer-events: none;
    mix-blend-mode: screen;
    opacity: 0.55;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-lines {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line {
    position: absolute;
    display: block;
    opacity: 0.62;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line--a {
    top: 11%;
    right: 9%;
    width: 108px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--portal-primary-bright-rgb), 0.75) 42%, transparent);
    transform: rotate(-7deg);
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line--b {
    top: 13%;
    right: 7%;
    width: 42px;
    height: 1px;
    background: rgba(var(--portal-secondary-rgb), 0.58);
    transform: rotate(68deg);
    transform-origin: 100% 50%;
    opacity: 0.48;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line--c {
    top: 36%;
    left: 5%;
    width: 72px;
    height: 1px;
    background: linear-gradient(90deg, rgba(var(--portal-primary-rgb), 0.55), transparent);
    transform: rotate(22deg);
    opacity: 0.4;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line--d {
    bottom: 24%;
    left: 13%;
    width: 1px;
    height: 78px;
    background: linear-gradient(180deg, transparent, rgba(var(--portal-primary-rgb), 0.52) 38%, transparent);
    transform: rotate(5deg);
    opacity: 0.45;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-line--e {
    bottom: 31%;
    right: 16%;
    width: 164px;
    height: 1px;
    background: linear-gradient(90deg, transparent 8%, rgba(var(--portal-primary-bright-rgb), 0.42) 52%, transparent);
    transform: rotate(-13deg);
    opacity: 0.38;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-corner {
    position: absolute;
    display: block;
    width: 28px;
    height: 28px;
    border-color: rgba(var(--portal-primary-rgb), 0.42);
    border-style: solid;
    opacity: 0.5;
}

body.customer-ui-new.customer-login-new .customer-auth-hero-corner--tr {
    top: 9%;
    right: 6%;
    border-width: 1px 1px 0 0;
    transform: rotate(-4deg);
}

body.customer-ui-new.customer-login-new .customer-auth-hero-corner--bl {
    bottom: 18%;
    left: 8%;
    width: 34px;
    height: 22px;
    border-width: 0 0 1px 1px;
    transform: rotate(3deg);
    opacity: 0.38;
}

/* Suppress any legacy hero content blocks */
body.customer-ui-new.customer-login-new .customer-auth-hero-top,
body.customer-ui-new.customer-login-new .customer-auth-hero-features,
body.customer-ui-new.customer-login-new .customer-auth-hero-copy,
body.customer-ui-new.customer-login-new .customer-auth-hero-ambient,
body.customer-ui-new.customer-login-new .customer-auth-hero-backdrop,
body.customer-ui-new.customer-login-new .customer-auth-hero-dock,
body.customer-ui-new.customer-login-new .customer-auth-hero-pipeline {
    display: none;
}

@media (max-width: 900px) {
    body.customer-ui-new.customer-login-new .customer-auth-hero-lines {
        display: none;
    }
}

@media (max-width: 1100px) {
    body.customer-ui-new.customer-login-new .customer-auth-hero {
        background-image:
            linear-gradient(90deg, rgba(2, 8, 18, 0.96) 0%, rgba(2, 8, 18, 0.45) 22%, rgba(2, 8, 18, 0.12) 50%, rgba(2, 8, 18, 0.35) 100%),
            linear-gradient(180deg, rgba(2, 8, 18, 0.25) 0%, rgba(2, 8, 18, 0.08) 50%, rgba(2, 8, 18, 0.65) 100%),
            var(--classic-login-bg);
    }
}
