:root {
--noio-bg: #071019;
--noio-bg2: #0a1520;
--noio-panel: #0f1b27;
--noio-panel2: #132231;
--noio-border: #20384a;

--noio-text: #f2f7fb;
--noio-muted: #99a9b7;

--noio-cyan: #24e5ff;
--noio-magenta: #ff3daa;
--noio-yellow: #ffd34e;

color-scheme: dark;
}


* {
box-sizing: border-box;
}


html {
scroll-behavior: smooth;
}


body {
margin: 0;
background:
radial-gradient(
circle at 15% 0%,
rgba(36,229,255,.05),
transparent 30rem
),
#071019;

color: var(--noio-text);
}


::selection {
background: var(--noio-cyan);
color: #071019;
}


a {
color: var(--noio-cyan);
text-decoration: none;
}


a:hover {
color: var(--noio-magenta);
}


.noio-topline {
height: 3px;

background:
linear-gradient(
90deg,
var(--noio-cyan),
var(--noio-magenta),
var(--noio-yellow)
);
}


/* HEADER */

.noio-header {
position: sticky;
top: 0;
z-index: 100;

background: rgba(6,14,22,.96);

border-bottom:
1px solid var(--noio-border);

backdrop-filter: blur(12px);
}


.noio-header-inner {
max-width: 1480px;
min-height: 82px;

margin: auto;
padding: 0 24px;

display: flex;
align-items: center;
gap: 34px;
}


.noio-brand {
display: flex;
align-items: center;
gap: 12px;

flex-shrink: 0;
}


.noio-brand-bird {
width: 74px;
height: auto;
}


.noio-brand-copy {
display: flex;
flex-direction: column;
}


.noio-wordmark {
font-size: 2rem;
font-weight: 900;
letter-spacing: .09em;
line-height: .9;

background:
linear-gradient(
90deg,
var(--noio-cyan),
#ffffff 55%,
var(--noio-magenta)
);

background-clip: text;
-webkit-background-clip: text;

color: transparent;
}


.noio-claim {
margin-top: 7px;

font-size: .73rem;
font-weight: 600;
letter-spacing: .035em;

color: #d9e3eb;
}


/* NAVIGATION */

.noio-nav {
margin-left: auto;

display: flex;
align-items: center;
}


.noio-nav-item {
display: flex;
align-items: center;
gap: 7px;

height: 82px;
padding: 0 13px;

border-left:
1px solid rgba(32,56,74,.55);

color: #dbe6ed;

font-size: .78rem;
font-weight: 600;

transition:
background .2s,
color .2s;
}


.noio-nav-item:hover {
background:
rgba(36,229,255,.06);

color:
var(--noio-cyan);
}


.noio-nav-item svg {
width: 21px;
height: 21px;

fill: none;
stroke: var(--noio-cyan);
stroke-width: 1.7;
stroke-linecap: round;
stroke-linejoin: round;

flex-shrink: 0;
}


/* MOBILE MENU */

.noio-mobile-menu {
display: none;
margin-left: auto;
}


.noio-mobile-menu summary {
width: 42px;
height: 42px;

display: flex;
flex-direction: column;
justify-content: center;
gap: 5px;

cursor: pointer;

list-style: none;
}


.noio-mobile-menu summary::-webkit-details-marker {
display: none;
}


.noio-mobile-menu summary span {
width: 26px;
height: 2px;

background: var(--noio-text);
}


.noio-mobile-menu-panel {
position: absolute;
right: 15px;
top: 72px;

min-width: 250px;

padding: 10px;

border:
1px solid var(--noio-border);

border-radius: 14px;

background: #09141f;

box-shadow:
0 24px 60px rgba(0,0,0,.45);
}


.noio-mobile-menu-panel a {
display: block;

padding: 11px 12px;

color: var(--noio-text);

border-radius: 8px;
}


.noio-mobile-menu-panel a:hover {
background:
rgba(36,229,255,.08);

color: var(--noio-cyan);
}


/* HERO */

.noio-hero {
position: relative;
overflow: hidden;

min-height: 585px;

display: flex;
align-items: center;

padding: 80px 28px;

border-bottom:
1px solid var(--noio-border);

background:
linear-gradient(
90deg,
rgba(4,10,17,.98) 0%,
rgba(7,17,28,.96) 46%,
rgba(8,25,38,.82) 100%
);
}


.noio-hero::before {
content: "";

position: absolute;
inset: 0;

background:

radial-gradient(
circle at 74% 40%,
rgba(36,229,255,.14),
transparent 28%
),

radial-gradient(
circle at 91% 73%,
rgba(255,61,170,.09),
transparent 22%
);

pointer-events: none;
}


.noio-hero-glow {
position: absolute;

right: 3%;
bottom: -32%;

width: 68%;
height: 72%;

border-radius: 50%;

background:
radial-gradient(
ellipse,
rgba(28,138,184,.18),
transparent 65%
);

filter: blur(16px);
}


.noio-hero-bird {
position: absolute;

right: 10%;
top: 15%;

width: min(39vw, 540px);

opacity: .31;

transform:
rotate(-7deg);

filter:
drop-shadow(
0 0 24px
rgba(36,229,255,.25)
);
}


.noio-hero-arc {
position: absolute;

right: -80px;

width: 410px;
height: 410px;

border-radius: 50%;

border: 3px solid transparent;

pointer-events: none;
}


.noio-hero-arc-one {
top: -70px;

border-left-color:
var(--noio-cyan);

transform: rotate(23deg);
}


.noio-hero-arc-two {
top: 45px;

border-left-color:
var(--noio-magenta);

transform: rotate(17deg);
}


.noio-hero-content {
position: relative;
z-index: 3;

width: 100%;
max-width: 1380px;

margin: auto;
}


.noio-hero-kicker {
color: var(--noio-cyan);

font-size: .76rem;
font-weight: 800;
letter-spacing: .18em;
}


.noio-hero h1 {
margin:
23px 0 0;

font-size:
clamp(5.2rem, 11vw, 10rem);

line-height: .76;

font-weight: 900;
letter-spacing: -.045em;

color: #fff;
}


.noio-hero h2 {
margin:
26px 0 0;

font-size:
clamp(2rem, 4vw, 4rem);

line-height: 1;

font-weight: 750;

color: #fff;
}


.noio-hero-text {
margin-top: 18px;

font-size:
clamp(1rem, 1.6vw, 1.25rem);

color: #d5dee5;
}


.noio-hero-actions {
display: flex;
flex-wrap: wrap;
gap: 16px;

margin-top: 30px;
}


.noio-button {
min-width: 210px;

display: inline-flex;
align-items: center;
justify-content: center;
gap: 16px;

padding: 14px 24px;

border-radius: 999px;

font-size: .93rem;
font-weight: 800;

transition:
transform .18s,
background .18s,
border-color .18s;
}


.noio-button:hover {
transform:
translateY(-2px);
}


.noio-button-primary {
background:
var(--noio-cyan);

color: #041018;
}


.noio-button-primary:hover {
background:
#58ecff;

color: #041018;
}


.noio-button-secondary {
border:
1px solid #d6e1e9;

color:
var(--noio-text);
}


.noio-button-secondary:hover {
border-color:
var(--noio-cyan);

color:
var(--noio-cyan);
}


.noio-values {
margin-top: 54px;

display: flex;
align-items: center;
flex-wrap: wrap;
gap: 13px;

color: #a6b4bf;

font-size: .64rem;
font-weight: 700;
letter-spacing: .22em;
}


.noio-values i {
width: 1px;
height: 12px;

background:
#496072;
}


/* RUBRIC CARDS */

.noio-rubrics {
max-width: 1480px;

margin:
-1px auto 0;

padding:
18px 24px 0;

display: grid;

grid-template-columns:
repeat(7, minmax(0,1fr));

gap: 9px;
}


.noio-rubric {
min-height: 124px;

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;

text-align: center;

padding: 15px 9px;

border:
1px solid var(--noio-border);

background:
var(--noio-panel);

color:
var(--noio-text);

transition:
transform .18s,
background .18s,
border-color .18s;
}


.noio-rubric:hover {
transform:
translateY(-4px);

background:
var(--noio-panel2);

border-color:
#31556d;

color:
var(--noio-text);
}


.noio-rubric svg {
width: 28px;
height: 28px;

margin-bottom: 10px;

fill: none;

stroke:
var(--noio-cyan);

stroke-width: 1.6;

stroke-linecap: round;
stroke-linejoin: round;
}


.noio-rubric strong {
font-size: .86rem;
}


.noio-rubric span {
margin-top: 4px;

font-size: .69rem;

color:
var(--noio-muted);
}


/* MAIN */

.noio-main,
.noio-content-shell,
.noio-article-shell {
padding:
clamp(3rem,6vw,6rem)
24px;

max-width: 1320px;

margin: auto;
}


.noio-content-shell,
.noio-article-shell {
max-width: 920px;
}


.noio-kicker {
margin: 0 0 8px;

color:
var(--noio-cyan);

font-size: .7rem;
font-weight: 850;
letter-spacing: .17em;
}


.noio-section-title {
margin-top: 0;

font-size:
clamp(2rem,4vw,3rem);
}


/* POSTS */

.wp-block-post-template {
gap: 18px;
}


.noio-news-card {
height: 100%;

overflow: hidden;

border:
1px solid var(--noio-border);

border-radius: 14px;

background:
var(--noio-panel);

transition:
transform .18s,
border-color .18s;
}


.noio-news-card:hover {
transform:
translateY(-4px);

border-color:
#31566e;
}


.noio-news-card figure {
margin: 0;
}


.noio-news-card img {
border-radius: 0;
}


.noio-news-body {
padding: 18px;
}


.noio-news-category a {
color:
var(--noio-cyan);

font-size: .7rem;

font-weight: 800;

letter-spacing: .08em;

text-transform: uppercase;
}


.noio-empty {
padding:
30px;

border:
1px dashed #35566c;

border-radius:
14px;

background:
rgba(15,27,39,.6);
}


.noio-empty h3 {
margin-bottom: 7px;
}


/* FEATURES */

.noio-feature-columns {
gap: 18px;
}


.noio-feature {
height: 100%;

padding: 28px;

border:
1px solid var(--noio-border);

border-radius:
14px;

background:
var(--noio-panel);
}


.noio-feature h3 {
margin-top: 8px;

font-size: 1.55rem;
}


.noio-feature-poll {
border-left:
4px solid var(--noio-cyan);
}


.noio-feature-events {
border-left:
4px solid var(--noio-yellow);
}


/* STORY */

.noio-story {
margin-top:
4rem;

padding:
clamp(28px,5vw,55px);

border:
1px solid var(--noio-border);

border-radius:
17px;

background:
linear-gradient(
120deg,
rgba(36,229,255,.055),
rgba(255,61,170,.04)
);
}


.noio-story h2 {
margin:
8px 0 16px;

font-size:
clamp(2rem,4vw,3.2rem);
}


.noio-story p {
max-width:
870px;

color:
#b6c3ce;

font-size:
1.08rem;
}


/* FORMS */

.wpforms-container,
.wpforms-container label,
.wpforms-container legend,
.wpforms-container .wpforms-field-label,
.wpforms-container .wpforms-field-sublabel,
.wpforms-container .wpforms-field-description {
color:
var(--noio-text) !important;
}


.wpforms-container input,
.wpforms-container textarea,
.wpforms-container select {
background:
#091521 !important;

color:
var(--noio-text) !important;

border:
1px solid #355167 !important;

border-radius:
9px !important;
}


.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus {
border-color:
var(--noio-cyan) !important;

box-shadow:
0 0 0 3px
rgba(36,229,255,.12) !important;
}


.wpforms-container button[type="submit"] {
border: 0 !important;

border-radius:
999px !important;

background:
var(--noio-cyan) !important;

color:
#041018 !important;

font-weight:
800 !important;
}


/* EVENTS */

.tribe-common,
.tribe-events {
--tec-color-text-primary:
#eef5fa;

--tec-color-text-secondary:
#9fafbb;
}


.tribe-events a,
.tribe-common a {
color:
var(--noio-cyan);
}


/* YOP POLL */

.yop-poll-container,
[class*="yop-poll"] {
color:
var(--noio-text);
}


/* FOOTER */

.noio-footer {
margin-top: 70px;

padding:
45px 24px 65px;

border-top:
1px solid var(--noio-border);

background:
#060d14;
}


.noio-footer-grid {
max-width:
1320px;

margin: auto;

display: grid;

grid-template-columns:
1.4fr 1fr 1fr 1.5fr;

gap:
36px;
}


.noio-footer-logo {
font-size:
2.1rem;

font-weight:
900;

letter-spacing:
.08em;

background:
linear-gradient(
90deg,
var(--noio-cyan),
#fff,
var(--noio-magenta)
);

background-clip: text;
-webkit-background-clip: text;

color:
transparent;
}


.noio-footer-grid strong {
display:
block;

margin-bottom:
12px;

color:
var(--noio-cyan);

font-size:
.75rem;

letter-spacing:
.12em;

text-transform:
uppercase;
}


.noio-footer-grid a {
display:
block;

margin:
7px 0;

color:
#cad6de;
}


.noio-footer-grid p {
color:
var(--noio-muted);
}


/* GENERAL CONTENT */

.wp-block-post-content,
.wp-block-post-content p,
.wp-block-post-content li,
.entry-content,
.entry-content p,
.entry-content li {
color:
var(--noio-text);
}


/* RESPONSIVE */

@media (max-width: 1260px) {

.noio-nav-item {
padding:
0 8px;

font-size:
.71rem;
}

}


@media (max-width: 1080px) {

.noio-nav {
display: none;
}

.noio-mobile-menu {
display: block;
}

.noio-header-inner {
min-height: 72px;
}

.noio-rubrics {
grid-template-columns:
repeat(4,1fr);
}

}


@media (max-width: 760px) {

.noio-hero {
min-height:
520px;

padding:
65px 22px;
}

.noio-hero-bird {
right:
-15%;

top:
18%;

width:
82vw;

opacity:
.12;
}

.noio-values {
gap:
9px;

letter-spacing:
.12em;
}

.noio-rubrics {
grid-template-columns:
repeat(2,1fr);

padding-left:
14px;

padding-right:
14px;
}

.noio-footer-grid {
grid-template-columns:
1fr;
}

}


@media (max-width: 480px) {

.noio-brand-bird {
width:
57px;
}

.noio-wordmark {
font-size:
1.6rem;
}

.noio-claim {
font-size:
.63rem;
}

.noio-hero h1 {
font-size:
5rem;
}

.noio-rubric {
min-height:
110px;
}

}