/* CRM login: vector fiber field and animated text refraction. */
.oim-login-speed-page .oim-login-speed-shell {
    min-height: 100vh;
    overflow: hidden;
}

@supports (height: 100dvh) {
    .oim-login-speed-page .oim-login-speed-shell {
        height: 100dvh;
        min-height: 100dvh;
    }
}

.oim-login-speed-page .oim-login-speed-hero {
    --oim-login-speed-gutter: clamp(32px, 7%, 96px);
    position: relative;
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 18% 22%, rgba(30, 70, 140, 0.12), transparent 33%),
        radial-gradient(circle at 82% 68%, rgba(117, 100, 216, 0.12), transparent 43%),
        linear-gradient(135deg, #080f26 0%, #101b38 60%, #141b39 100%);
}

.oim-login-speed-page .oim-login-speed-hero::after {
    position: absolute;
    content: '';
    pointer-events: none;
}

.oim-login-speed-page .oim-login-speed-hero::after {
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(8, 15, 38, 0.65) 0%, rgba(8, 15, 38, 0.12) 55%, rgba(8, 15, 38, 0.04) 100%),
        linear-gradient(180deg, rgba(8, 15, 38, 0.18), transparent 30%, transparent 69%, rgba(8, 15, 38, 0.28));
}

.oim-login-speed-page .oim-login-speed-atmosphere {
    position: absolute;
    inset: 0;
    z-index: -2;
    overflow: hidden;
    pointer-events: none;
}

.oim-login-speed-page .oim-login-speed-light-field {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1;
    transform: translateZ(0);
    user-select: none;
}

.oim-login-speed-page .left-content {
    position: relative;
    top: -24px;
    z-index: 2;
    width: min(780px, calc(100% - var(--oim-login-speed-gutter) - var(--oim-login-speed-gutter)));
    max-width: none;
    min-width: 0;
    min-height: 0;
    margin-left: var(--oim-login-speed-gutter);
    padding: 0;
    color: #fff;
    animation: oimLoginSpeedHeroIn 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes oimLoginSpeedHeroIn {
    from {
        opacity: 0;

    }
    to {
        opacity: 1;

    }
}

.oim-login-speed-page .oim-login-speed-stage {
    position: relative;
    height: auto; min-height: 230px;
    overflow: visible;
    contain: layout;
    --oim-login-speed-source-x: 0px;
    --oim-login-speed-source-y: 0px;
}

.oim-login-speed-page .oim-login-speed-copy {
    position: relative;
    z-index: 2;
    width: 100%;
    padding-top: 24px;
}

.oim-login-speed-page .oim-login-speed-kicker {
    display: flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    margin: 0 0 15px;
    padding: 0;
    border: 0;

    background: none;
    color: #a6b9d8;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: none;
}

.oim-login-speed-page .oim-login-speed-kicker > span {
    width: 26px;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.16), #fff);
}

.oim-login-speed-page .oim-login-speed-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 3.2vw, 52px);
    font-weight: 500;
    letter-spacing: -0.045em;
    line-height: 1.12;
    text-wrap: balance;
    text-shadow: 0 14px 32px rgba(27, 20, 82, 0.2);
}

.oim-login-speed-page .oim-login-speed-title > span {
    display: block;
    white-space: normal;
}

.oim-login-speed-page .oim-login-speed-title > span:first-child {
    font-size: .76em;
    font-weight: 400;
    color: #c4d0e3;
    margin-bottom: 10px;
}

.oim-login-speed-page .oim-login-speed-title-accent {
    margin-top: 6px;
    font-weight: 700;
}

.oim-login-speed-page .oim-login-speed-title strong {
    color: #fff;
    font-weight: 700;
    text-shadow:
        0 0 22px rgba(221, 230, 255, 0.26),
        0 14px 32px rgba(27, 20, 82, 0.24);
}

.oim-login-speed-page .oim-login-speed-hero.is-motion-enabled [data-oim-login-speed-copy] {
    -webkit-mask-image: var(--oim-haze-inverse-mask);
    mask-image: var(--oim-haze-inverse-mask);
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.oim-login-speed-page .oim-login-speed-haze-copy {
    position: absolute;
    inset: 0;
    z-index: 3;
    overflow: visible;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
}

.oim-login-speed-page .oim-login-speed-haze-copy .oim-login-speed-filtered-copy {
    z-index: 2;
    width: 100%;
    padding-top: 24px;
    filter: url('#oimLoginSpeedHeatFilter');
    -webkit-mask-image: var(--oim-haze-mask);
    mask-image: var(--oim-haze-mask);
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.oim-login-speed-page .oim-login-speed-hero.is-motion-enabled .oim-login-speed-haze-copy {
    opacity: 1;
}

.oim-login-speed-page .oim-login-speed-hero.is-motion-enabled .oim-login-speed-filtered-copy {
    will-change: filter;
}

.oim-login-speed-page .oim-login-speed-plume::before,
.oim-login-speed-page .oim-login-speed-plume::after {
    position: absolute;
    content: "";
    border-radius: 50%;
    pointer-events: none;
}

.oim-login-speed-page .oim-login-speed-plume::before {
    top: var(--oim-wind-apex);
    left: 100%;
    width: 43%;
    height: 16%;
    opacity: var(--oim-wisp-a-opacity, 0);
    background: linear-gradient(90deg, transparent 0%, rgba(202, 225, 255, 0.17) 27%, rgba(240, 248, 255, 0.4) 64%, rgba(121, 184, 255, 0.3) 100%);
    filter: blur(10px);
    transform: translate3d(calc(-100% + var(--oim-wisp-a-x, 0px)), calc(-50% + var(--oim-wind-rise) * var(--oim-wisp-a-progress, 0)), 0);
    will-change: transform, opacity;
}

.oim-login-speed-page .oim-login-speed-plume::after {
    top: var(--oim-wind-apex);
    left: 100%;
    width: 38%;
    height: 12%;
    opacity: var(--oim-wisp-b-opacity, 0);
    background: linear-gradient(90deg, transparent 0%, rgba(214, 230, 255, 0.16) 31%, rgba(243, 242, 255, 0.34) 68%, rgba(157, 128, 255, 0.24) 100%);
    filter: blur(8px);
    transform: translate3d(calc(-100% + var(--oim-wisp-b-x, 0px)), calc(-50% + var(--oim-wind-rise) * var(--oim-wisp-b-progress, 0)), 0);
    will-change: transform, opacity;
}

.oim-login-speed-page .oim-login-speed-filter-defs {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.oim-login-speed-page .oim-login-speed-hero.oim-login-speed-static .oim-login-speed-haze-copy {
    display: none;
}

.oim-login-speed-page .crm-feature-list {
    display: flex;
    flex-direction: column;
    width: min(440px, 100%);
    gap: 12px;
    margin-top: 14px;
}

.oim-login-speed-page .crm-feature-item {
    display: flex;
    min-height: 48px;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid rgba(174, 198, 235, 0.09);
    border-radius: 10px;
    background: rgba(15, 29, 57, 0.78);
    box-shadow: none;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.35;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}


@media (max-width: 1240px) and (min-width: 1025px) {
    .oim-login-speed-page .left-content {
        width: min(720px, calc(100% - var(--oim-login-speed-gutter) - var(--oim-login-speed-gutter)));
    }

    .oim-login-speed-page .oim-login-speed-stage {
        min-height: 206px;
    }

    .oim-login-speed-page .oim-login-speed-title {
        font-size: clamp(29px, 2.65vw, 36px);
    }

    .oim-login-speed-page .crm-feature-list {
        gap: 10px;
        margin-top: 10px;
    }

    .oim-login-speed-page .crm-feature-item {
        min-height: 50px;
        padding: 11px 15px;
        font-size: 14px;
    }
}

@media (max-width: 1080px) and (min-width: 1025px) {
    .oim-login-speed-page .left-content {
        width: calc(100% - var(--oim-login-speed-gutter) - var(--oim-login-speed-gutter));
    }

    .oim-login-speed-page .oim-login-speed-title {
        font-size: 27px;
    }

    .oim-login-speed-page .crm-feature-item {
        gap: 10px;
        padding-right: 12px;
        padding-left: 12px;
        font-size: 13px;
    }

}

@media (max-width: 1024px) {
    .oim-login-speed-page .oim-login-speed-hero {
        display: none;
    }
}

@media (max-height: 720px) and (min-width: 1025px) {
    .oim-login-speed-page .left-content {
        top: -8px;
        width: min(760px, calc(100% - var(--oim-login-speed-gutter) - var(--oim-login-speed-gutter)));
    }

    .oim-login-speed-page .oim-login-speed-stage {
        min-height: 180px;
    }

    .oim-login-speed-page .oim-login-speed-copy,
    .oim-login-speed-page .oim-login-speed-haze-copy .oim-login-speed-copy {
        padding-top: 18px;
    }

    .oim-login-speed-page .crm-feature-list {
        gap: 8px;
        margin-top: 4px;
    }

    .oim-login-speed-page .crm-feature-item {
        min-height: 42px;
        padding: 9px 13px;
        font-size: 13px;
    }

}

@media (prefers-reduced-motion: reduce) {
    .oim-login-speed-page .oim-login-speed-exhaust-glow,
    .oim-login-speed-page .oim-login-speed-plume::before,
    .oim-login-speed-page .oim-login-speed-plume::after,
    .oim-login-speed-page .left-content {
        animation: none !important;
    }

    .oim-login-speed-page .oim-login-speed-haze-copy {
        display: none;
    }
}

.crm-login-brand {
    position: absolute; top: 42px; left: var(--oim-login-speed-gutter);
    display: flex; align-items: center; gap: 16px; color: #f4f7ff;
}
.crm-login-brand > span:first-child { font-size: 25px; font-weight: 700; letter-spacing: -1px; }
.crm-login-brand > span:last-child { padding-left: 16px; border-left: 1px solid #ffffff26; font-size: 12px; color: #a6b5ce; }
.crm-login-netspeed {
    position: absolute; left: 76%; top: 52.22%; width: 17.48%; height: auto;
    transform: translateY(-50%); opacity: .9;
}
.oim-login-speed-page .oim-login-speed-title strong { display: block; }
.oim-login-speed-page .oim-login-speed-copy { max-width: 76%; }
.oim-login-speed-page .oim-login-speed-haze-copy .oim-login-speed-filtered-copy { max-width: 76%; }
.crm-login-description { max-width: 410px; margin: 22px 0 28px; color: #abbad2; font-size: 15px; line-height: 1.7; }

/* Shared timing keeps each destination glimmer synchronized with its own light. */
.crm-fiber-pulses { opacity: .75; }
.crm-fiber-pulses path, .crm-fiber-arrivals circle {
    --fiber-duration: 4.1s;
    --fiber-delay: -1.2s;
    opacity: 0;
}
.crm-fiber-pulses path { stroke-dasharray: 48 1052; stroke-dashoffset: -1000; }
.crm-fiber-arrivals circle { fill: #bddaff; filter: blur(1px); }
.is-motion-enabled .crm-fiber-pulses path {
    animation: crmFiberFlow var(--fiber-duration) linear infinite;
    animation-delay: var(--fiber-delay);
}
.is-motion-enabled .crm-fiber-arrivals circle {
    animation: crmFiberArrival var(--fiber-duration) linear infinite;
    animation-delay: var(--fiber-delay);
}
:is(.crm-fiber-pulses path, .crm-fiber-arrivals circle):nth-child(2) {
    --fiber-duration: 5.3s;
    --fiber-delay: -3.7s;
    stroke-dasharray: 65 1035;
}
:is(.crm-fiber-pulses path, .crm-fiber-arrivals circle):nth-child(3) {
    --fiber-duration: 4.7s;
    --fiber-delay: -.4s;
    stroke-dasharray: 36 1064;
}
:is(.crm-fiber-pulses path, .crm-fiber-arrivals circle):nth-child(4) {
    --fiber-duration: 5.9s;
    --fiber-delay: -2.6s;
    stroke-dasharray: 54 1046;
}
:is(.crm-fiber-pulses path, .crm-fiber-arrivals circle):nth-child(5) {
    --fiber-duration: 4.4s;
    --fiber-delay: -1.9s;
    stroke-dasharray: 42 1058;
}
/* Offset reaches zero (the city) at 1000 / 1100 of the travel cycle. */
@keyframes crmFiberArrival {
    0%, 90.9% { opacity: 0; }
    93% { opacity: .3; }
    100% { opacity: 0; }
}
@keyframes crmFiberFlow {
    0% { stroke-dashoffset: -1000; opacity: 0; }
    10% { opacity: .85; }
    78% { opacity: .6; }
    100% { stroke-dashoffset: 100; opacity: 0; }
}
@media (max-height: 720px) and (min-width: 1025px) {
    .crm-login-brand { top: 24px; }
    .crm-login-description { margin: 12px 0 18px; }
}
@media (max-height: 580px) and (min-width: 1025px) {
    .oim-login-speed-page .oim-login-speed-shell { height: auto; min-height: 580px; }
    body.oim-login-speed-page { overflow-y: auto; }
}
@media (prefers-reduced-motion: reduce) {
    .crm-fiber-pulses path, .crm-fiber-arrivals circle { animation: none !important; }
}

/* Wind, refraction and contact light share the measured leading edge of the logo. */
.oim-login-speed-page .oim-login-speed-plume {
    position: absolute;
    left: 0;
    top: var(--oim-wind-top, 0px);
    width: var(--oim-login-speed-source-x);
    height: var(--oim-wind-height, 0px);
    clip-path: polygon(0 0, 100% var(--oim-wind-apex, 50%), 0 100%);
    overflow: hidden;
    z-index: 1;
    opacity: .65;
    background: linear-gradient(90deg, transparent 8%, rgba(110, 167, 255, .012) 60%, rgba(165, 205, 255, .07));
    pointer-events: none;
    mix-blend-mode: screen;
}
.oim-login-speed-page .oim-login-speed-exhaust-glow {
    position: absolute;
    left: var(--oim-login-speed-source-x);
    top: var(--oim-login-speed-source-y);
    width: 32px;
    height: 44px;
    z-index: 3;
    border-radius: 50%;
    background: radial-gradient(ellipse, #d5e9ff 0%, #80b4ff66 24%, transparent 70%);
    filter: blur(3px);
    transform: translate(-50%, -50%);
    opacity: .22;
    pointer-events: none;
}

.oim-login-speed-page .crm-feature-icon {
    flex: 0 0 20px;
    color: #91b5ec;
}

/* An undistorted vector silhouette behind the fiber field and all login content. */
.oim-login-speed-page .crm-login-turkey {
    position: absolute;
    z-index: -3;
    left: 3%;
    top: 52.22%;
    width: 70%;
    height: auto;
    transform: translateY(-40%);
    opacity: .85;
    pointer-events: none;
    user-select: none;
}

@media (max-width: 1024px) {
    .oim-login-speed-page .right-panel {
        position: relative;
    }

    .oim-login-speed-page .right-panel::before {
        content: '';
        position: absolute;
        top: 7%;
        left: 3%;
        width: 94%;
        height: 45%;
        background: url('../images/turkey-network.svg') center top / contain no-repeat;
        opacity: .16;
        pointer-events: none;
    }
}

.crm-login-description {
    position: relative;
    isolation: isolate;
}
.crm-login-description::before {
    content: '';
    position: absolute;
    inset: -12px -22px;
    z-index: -1;
    background: radial-gradient(ellipse, rgba(8, 15, 38, .8) 30%, transparent 74%);
    pointer-events: none;
}
.crm-login-turkey {
    -webkit-mask-image: linear-gradient(110deg, rgba(0, 0, 0, .38), #000 70%);
    mask-image: linear-gradient(110deg, rgba(0, 0, 0, .38), #000 70%);
}