.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =========================================================
THE HUMAINITY — SITE CUSTOM CSS
MASTER LOOP: 52 SECONDS
========================================================= */

/* =========================================================
FUTURISTIC GLASS DISPLAY
========================================================= */

.hum-glass {
position: relative;
overflow: hidden;

background:
    linear-gradient(
        135deg,
        rgba(20, 75, 105, 0.34) 0%,
        rgba(5, 18, 30, 0.78) 45%,
        rgba(8, 28, 45, 0.68) 100%
    );

-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);

border: 1px solid rgba(105, 220, 255, 0.80);

clip-path: polygon(
    0 18px,
    18px 0,
    calc(100% - 55px) 0,
    calc(100% - 42px) 8px,
    100% 8px,
    100% calc(100% - 18px),
    calc(100% - 18px) 100%,
    55px 100%,
    42px calc(100% - 8px),
    0 calc(100% - 8px)
);

box-shadow:
    0 0 8px rgba(80, 210, 255, 0.65),
    0 0 22px rgba(50, 180, 255, 0.32),
    0 0 45px rgba(30, 140, 255, 0.14),
    inset 0 0 25px rgba(70, 200, 255, 0.12);

transform-origin: center center;

}

/* =========================================================
MASTER SEQUENCE

00.0–02.0   DNA ONLY
02.0–02.7   BOOT POWER ON
02.8–12.4   BOOT TYPES
12.4–14.9   BOOT HOLD
14.9–15.3   BOOT → DEFINE
15.3–21.3   DEFINE
21.3–21.7   DEFINE → PRINCIPLES
21.7–27.7   PRINCIPLES
27.7–28.1   PRINCIPLES → STATUS
28.1–34.1   SYSTEM STATUS
34.1–34.5   STATUS → QUERY
34.5–42.0   FINAL QUERY
42.0–43.5   SHUTDOWN
43.5–52.0   DNA ONLY
========================================================= */

/* =========================================================
OVERLAY POSITIONING

SCREEN 1 remains the normal-flow anchor.
Everything else occupies the exact same display position.
========================================================= */

.hum-screen0,
.hum-screen2,
.hum-screen3,
.hum-screen4 {
position: absolute !important;

top: 50% !important;
left: 50% !important;

width: min(80vw, 1400px) !important;

margin: 0 !important;

}

/* =========================================================
SCREEN 0 — BOOT DISPLAY
========================================================= */

.hum-screen0 {
z-index: 14;

animation: humScreen0 52s linear infinite;

}

@keyframes humScreen0 {

/* 00.0–02.0 sec — OFF */

0%,
3.84% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(0.02)
        scaleY(0.002);

    filter: brightness(3);

    visibility: hidden;
    pointer-events: none;
}


/* 02.0 sec — POWER ON */

3.85% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(0.12)
        scaleY(0.004);

    filter: brightness(5);

    visibility: visible;
}


/* 02.3 sec */

4.42% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.008);

    filter: brightness(4);
}


/* 02.7 sec */

5.19% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1.8);
}


/* 02.8–14.9 sec — ACTIVE */

5.38%,
28.65% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: visible;
}


/* FLICKER OUT */

28.84% {
    opacity: 0.12;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.98);

    filter: brightness(4);
}

29.04% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(2.5);
}

29.23% {
    opacity: 0.08;

    filter: brightness(4);
}


/* OFF FOR REST OF LOOP */

29.42%,
100% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}

}

/* =========================================================
BOOT TERMINAL
========================================================= */

.screen-boot {
position: relative;
z-index: 3;

width: 100%;

color: #EAF9FF;

font-family: "Roboto Mono", monospace;

text-shadow:
    0 0 2px rgba(255, 255, 255, 1),
    0 0 5px rgba(145, 225, 255, 0.95),
    0 0 10px rgba(75, 190, 255, 0.70),
    0 0 20px rgba(40, 145, 255, 0.32);

}

.screen-boot .boot-line {
display: block;

width: 0;
max-width: max-content;

overflow: hidden;
white-space: nowrap;

opacity: 0;

}

.screen-boot .boot-spacer {
height: 1.2em;
}

/* =========================================================
BOOT LINE 1
02.8–03.9 sec
========================================================= */

.screen-boot .boot-line-1 {
animation: bootLine1 52s steps(25, end) infinite;
}

@keyframes bootLine1 {

0%,
5.38% {
    width: 0;
    opacity: 0;
}

5.39% {
    width: 0;
    opacity: 1;
}

7.50% {
    width: 25ch;
    opacity: 1;
}

28.65% {
    width: 25ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 2
04.1–05.4 sec
========================================================= */

.screen-boot .boot-line-2 {
animation: bootLine2 52s steps(34, end) infinite;
}

@keyframes bootLine2 {

0%,
7.88% {
    width: 0;
    opacity: 0;
}

7.89% {
    width: 0;
    opacity: 1;
}

10.38% {
    width: 34ch;
    opacity: 1;
}

28.65% {
    width: 34ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 3
05.6–06.9 sec
========================================================= */

.screen-boot .boot-line-3 {
animation: bootLine3 52s steps(34, end) infinite;
}

@keyframes bootLine3 {

0%,
10.76% {
    width: 0;
    opacity: 0;
}

10.77% {
    width: 0;
    opacity: 1;
}

13.27% {
    width: 34ch;
    opacity: 1;
}

28.65% {
    width: 34ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 4
07.2–08.1 sec
========================================================= */

.screen-boot .boot-line-4 {
animation: bootLine4 52s steps(19, end) infinite;
}

@keyframes bootLine4 {

0%,
13.84% {
    width: 0;
    opacity: 0;
}

13.85% {
    width: 0;
    opacity: 1;
}

15.58% {
    width: 19ch;
    opacity: 1;
}

28.65% {
    width: 19ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 5
08.3–09.5 sec
========================================================= */

.screen-boot .boot-line-5 {
animation: bootLine5 52s steps(29, end) infinite;
}

@keyframes bootLine5 {

0%,
15.96% {
    width: 0;
    opacity: 0;
}

15.97% {
    width: 0;
    opacity: 1;
}

18.27% {
    width: 29ch;
    opacity: 1;
}

28.65% {
    width: 29ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 6
09.7–11.0 sec
========================================================= */

.screen-boot .boot-line-6 {
animation: bootLine6 52s steps(36, end) infinite;
}

@keyframes bootLine6 {

0%,
18.65% {
    width: 0;
    opacity: 0;
}

18.66% {
    width: 0;
    opacity: 1;
}

21.15% {
    width: 36ch;
    opacity: 1;
}

28.65% {
    width: 36ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 7
11.2–12.3 sec
========================================================= */

.screen-boot .boot-line-7 {
animation: bootLine7 52s steps(34, end) infinite;
}

@keyframes bootLine7 {

0%,
21.53% {
    width: 0;
    opacity: 0;
}

21.54% {
    width: 0;
    opacity: 1;
}

23.65% {
    width: 34ch;
    opacity: 1;
}

28.65% {
    width: 34ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT LINE 8 — > BEGIN_
========================================================= */

.screen-boot .boot-line-8 {
animation: bootLine8 52s steps(8, end) infinite;
}

@keyframes bootLine8 {

0%,
23.84% {
    width: 0;
    opacity: 0;
}

23.85% {
    width: 0;
    opacity: 1;
}

26.00% {
    width: 8ch;
    opacity: 1;
}

28.65% {
    width: 8ch;
    opacity: 1;
}

28.66%,
100% {
    width: 0;
    opacity: 0;
}

}

/* =========================================================
BOOT CURSOR
========================================================= */

.screen-boot .boot-cursor {
animation: humBootCursor 0.65s steps(1, end) infinite;
}

@keyframes humBootCursor {

0%,
49% {
    opacity: 1;
}

50%,
100% {
    opacity: 0;
}

}

/* =========================================================
SCREEN 1 — DEFINE
15.3–21.3 sec
========================================================= */

.hum-screen1 {
z-index: 10;

animation: humScreen1 52s linear infinite;

}

@keyframes humScreen1 {

0%,
28.64% {
    opacity: 0;

    transform:
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}


/* FLICKER IN */

28.85% {
    opacity: 0.85;

    transform:
        scaleX(1)
        scaleY(0.98);

    filter: brightness(3);

    visibility: visible;
}

29.04% {
    opacity: 0.15;

    transform:
        scaleX(1)
        scaleY(1);

    filter: brightness(2.5);
}

29.23% {
    opacity: 1;

    transform:
        scaleX(1)
        scaleY(0.99);

    filter: brightness(2);
}


/* STABLE */

29.42%,
40.96% {
    opacity: 1;

    transform:
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: visible;
}


/* FLICKER OUT */

41.15% {
    opacity: 0.15;
    filter: brightness(3.5);
}

41.35% {
    opacity: 1;
    filter: brightness(2);
}

41.54% {
    opacity: 0.08;
    filter: brightness(4);
}


/* OFF */

41.73%,
100% {
    opacity: 0;

    transform:
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}

}

/* =========================================================
SCREEN 2 — PRINCIPLES
21.7–27.7 sec
========================================================= */

.hum-screen2 {
z-index: 11;

animation: humScreen2 52s linear infinite;

}

@keyframes humScreen2 {

0%,
41.53% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}


/* FLICKER IN */

41.73% {
    opacity: 0.85;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.98);

    filter: brightness(3);

    visibility: visible;
}

41.92% {
    opacity: 0.15;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(2.5);
}

42.12% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.99);

    filter: brightness(2);
}


/* STABLE */

42.31%,
52.88% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: visible;
}


/* FLICKER OUT */

53.08% {
    opacity: 0.15;
    filter: brightness(3.5);
}

53.27% {
    opacity: 1;
    filter: brightness(2);
}

53.46% {
    opacity: 0.08;
    filter: brightness(4);
}


/* OFF */

53.65%,
100% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}

}

/* =========================================================
SCREEN 3 — SYSTEM STATUS
28.1–34.1 sec
========================================================= */

.hum-screen3 {
z-index: 12;

opacity: 0;
visibility: hidden;

animation: humScreen3 52s linear infinite;

}

@keyframes humScreen3 {

/* EXPLICITLY OFF */

0%,
53.45% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}


/* FLICKER IN */

53.65% {
    opacity: 0.85;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.98);

    filter: brightness(3);

    visibility: visible;
}

53.85% {
    opacity: 0.15;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(2.5);
}

54.04% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.99);

    filter: brightness(2);
}


/* STABLE */

54.23%,
64.96% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: visible;
}


/* FLICKER OUT */

65.19% {
    opacity: 0.15;
    filter: brightness(3.5);
}

65.38% {
    opacity: 1;
    filter: brightness(2);
}

65.58% {
    opacity: 0.08;
    filter: brightness(4);
}


/* EXPLICITLY OFF AGAIN */

65.77%,
100% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}

}

/* =========================================================
SCREEN 4 — FINAL QUERY
34.5–42.0 sec
========================================================= */

.hum-screen4 {
z-index: 13;

opacity: 0;
visibility: hidden;

animation: humScreen4 52s linear infinite;

}

@keyframes humScreen4 {

/* EXPLICITLY OFF */

0%,
65.57% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}


/* FLICKER IN */

65.77% {
    opacity: 0.85;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.98);

    filter: brightness(3);

    visibility: visible;
}

65.96% {
    opacity: 0.15;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(2.5);
}

66.15% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.99);

    filter: brightness(2);
}


/* STABLE */

66.35%,
80.38% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(1);

    filter: brightness(1);

    visibility: visible;
}


/* PRE-SHUTDOWN FLICKER */

80.58% {
    opacity: 0.55;
    filter: brightness(2.5);
}

80.77% {
    opacity: 1;
    filter: brightness(1.4);
}


/* CRT SHUTDOWN */

80.96% {
    opacity: 0.8;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.92);

    filter: brightness(2);
}

82.12% {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scaleX(1)
        scaleY(0.025);

    filter: brightness(5);
}

83.46% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(0.12)
        scaleY(0.003);

    filter: brightness(5);

    visibility: hidden;
}


/* DNA ONLY */

83.65%,
100% {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        scaleX(0.02)
        scaleY(0.002);

    filter: brightness(1);

    visibility: hidden;
    pointer-events: none;
}

}

/* =========================================================
HUD FRAME DETAILS
========================================================= */

.hum-glass::before {
content: "";

position: absolute;
inset: 8px;

z-index: 2;

pointer-events: none;

background:

    linear-gradient(
        90deg,
        #b9f3ff 0%,
        #55cfff 55%,
        transparent 100%
    ) left top / 120px 3px no-repeat,

    linear-gradient(
        270deg,
        #b9f3ff 0%,
        #55cfff 55%,
        transparent 100%
    ) right top / 120px 3px no-repeat,

    linear-gradient(
        90deg,
        #b9f3ff 0%,
        #55cfff 55%,
        transparent 100%
    ) left bottom / 120px 3px no-repeat,

    linear-gradient(
        270deg,
        #b9f3ff 0%,
        #55cfff 55%,
        transparent 100%
    ) right bottom / 120px 3px no-repeat,

    linear-gradient(
        180deg,
        #b9f3ff,
        #42bfff,
        transparent
    ) left top / 3px 85px no-repeat,

    linear-gradient(
        180deg,
        #b9f3ff,
        #42bfff,
        transparent
    ) right top / 3px 85px no-repeat,

    linear-gradient(
        0deg,
        #b9f3ff,
        #42bfff,
        transparent
    ) left bottom / 3px 85px no-repeat,

    linear-gradient(
        0deg,
        #b9f3ff,
        #42bfff,
        transparent
    ) right bottom / 3px 85px no-repeat;

filter:
    drop-shadow(0 0 2px rgba(190, 245, 255, 0.95))
    drop-shadow(0 0 6px rgba(55, 185, 255, 0.80))
    drop-shadow(0 0 12px rgba(30, 140, 255, 0.40));

}

/* =========================================================
SCREEN SURFACE
========================================================= */

.hum-glass::after {
content: "";

position: absolute;
inset: 0;

z-index: 1;

pointer-events: none;

background:
    linear-gradient(
        110deg,
        transparent 20%,
        rgba(150, 225, 255, 0.055) 45%,
        transparent 65%
    ),

    repeating-linear-gradient(
        0deg,
        rgba(150, 225, 255, 0.045) 0px,
        rgba(150, 225, 255, 0.045) 1px,
        transparent 1px,
        transparent 4px
    );

opacity: 0.75;

}

/* =========================================================
SCREEN TEXT GLOW
========================================================= */

.hum-glass .screen-text,
.hum-glass .screen-title,
.hum-glass .screen-body,
.hum-glass .screen-statement {
position: relative;

z-index: 3;

text-shadow:
    0 0 2px rgba(255, 255, 255, 1),
    0 0 5px rgba(145, 225, 255, 0.95),
    0 0 10px rgba(75, 190, 255, 0.70),
    0 0 20px rgba(40, 145, 255, 0.32);

}

.hum-glass .screen-text {
color: #EAF9FF;

letter-spacing: 0.04em;

}

/* =========================================================
SCREEN CURSOR
========================================================= */

.hum-glass .screen-statement::after {
content: "_";

display: inline-block;

margin-left: 0.08em;

color: #EAF9FF;

text-shadow:
    0 0 2px rgba(255, 255, 255, 1),
    0 0 5px rgba(145, 225, 255, 0.95),
    0 0 10px rgba(75, 190, 255, 0.70);

animation: humCursor 0.8s steps(1, end) infinite;

}

@keyframes humCursor {

0%,
49% {
    opacity: 1;
}

50%,
100% {
    opacity: 0;
}

}

/* =========================================================
OPTIONAL INLINE ACCENTS
========================================================= */

.human-accent {
color: #FFB45E;

text-shadow:
    0 0 5px rgba(255, 180, 94, 0.65),
    0 0 12px rgba(255, 140, 50, 0.30);

}

.ai-accent {
color: #78C7FF;

text-shadow:
    0 0 5px rgba(120, 199, 255, 0.75),
    0 0 12px rgba(55, 145, 255, 0.40);

}/* End custom CSS */