body.home .ngh #experience .ngpt-showcase {
margin: 21px 0 3px;
border: 1px solid #668448;
border-radius: 14px;
overflow: hidden;
background: #1b211d;
box-shadow: 0 15px 34px rgba(0,0,0,.2), inset 0 0 0 1px rgba(181,230,106,.08);
color: #fff;
isolation: isolate;
}
body.home .ngh #experience .ngpt-showcase__top {
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
padding: 9px 14px;
border-bottom: 1px solid #46533c;
background: #283026;
}
body.home .ngh #experience .ngpt-showcase__live {
display: inline-flex;
align-items: center;
gap: 8px;
color: #b5e66a;
font: 700 9px/1.2 'Proximanova-bold',sans-serif;
letter-spacing: .13em;
white-space: nowrap;
}
body.home .ngh #experience .ngpt-showcase__live i {
width: 7px;
height: 7px;
flex: 0 0 7px;
border-radius: 50%;
background: #b5e66a;
box-shadow: 0 0 0 4px rgba(181,230,106,.14);
}
body.home .ngh #experience .ngpt-showcase__auto {
color: #bac5b1;
font: 700 9px/1.2 'Proximanova-bold',sans-serif;
letter-spacing: .05em;
text-align: right;
}
body.home .ngh #experience .ngpt-showcase__viewport {
position: relative;
height: 186px;
overflow: hidden;
isolation: isolate;
background:
radial-gradient(ellipse at 95% 0%, rgba(132,192,65,.23), transparent 53%),
linear-gradient(135deg,#252d26,#222722 64%,#181d19);
}
body.home .ngh #experience .ngpt-scene {
position: absolute;
inset: 0;
display: grid;
grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
align-items: center;
gap: 11px;
padding: 20px 18px;
opacity: 0;
transform: translateY(17px) scale(.985);
pointer-events: none;
}
body.home .ngh #experience .ngpt-scene--discover { opacity: 1; transform: none; }
body.home .ngh #experience .ngpt-scene__copy { min-width: 0; }
body.home .ngh #experience .ngpt-scene__copy small {
display: block;
color: #b5e66a;
font: 700 10px/1.2 'Proximanova-bold',sans-serif;
letter-spacing: .12em;
margin: 0 0 10px;
}
body.home .ngh #experience .ngpt-scene__copy strong {
display: block;
color: #fff;
font: 700 clamp(19px,1.65vw,24px)/1.13 'Proximanova-bold',sans-serif;
letter-spacing: -.025em;
max-width: 220px;
text-wrap: balance;
}
body.home .ngh #experience .ngpt-scene__copy > span {
display: block;
color: #bdc6bc;
font: 400 11px/1.35 'Proximanova-regular',sans-serif;
margin: 10px 0 0;
}
body.home .ngh #experience .ngpt-search-card,
body.home .ngh #experience .ngpt-site-card,
body.home .ngh #experience .ngpt-growth-card {
min-width: 0;
width: 100%;
border-radius: 8px;
background: #f7f8f9;
color: #202124;
box-shadow: 0 8px 20px rgba(0,0,0,.24);
overflow: hidden;
}
body.home .ngh #experience .ngpt-search-card { padding: 10px; }
body.home .ngh #experience .ngpt-search-card__field {
display: flex;
align-items: center;
gap: 7px;
min-height: 28px;
padding: 4px 7px;
border: 1px solid #cbd2c4;
border-radius: 5px;
background: #fff;
color: #62676b;
font: 700 10px/1.2 'Proximanova-bold',sans-serif;
}
body.home .ngh #experience .ngpt-search-card__glass {
flex: 0 0 10px;
width: 10px; height: 10px;
border: 1.8px solid #84c041;
border-radius: 50%;
position: relative;
}
body.home .ngh #experience .ngpt-search-card__glass::after {
content: '';
position: absolute;
width: 6px; height: 1.8px;
top: 8px; left: 7px;
background: #84c041;
transform: rotate(45deg);
}
body.home .ngh #experience .ngpt-search-card__query { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
body.home .ngh #experience .ngpt-search-card__cursor { width: 1px; height: 10px; flex: 0 0 1px; background: #84c041; }
body.home .ngh #experience .ngpt-search-card__result {
display: flex;
gap: 8px;
align-items: center;
border-bottom: 1px solid #e9ece7;
padding: 6px 1px 5px;
}
body.home .ngh #experience .ngpt-search-card__result:last-child { border-bottom: 0; }
body.home .ngh #experience .ngpt-search-card__result > span:last-child { flex: 1; min-width: 0; }
body.home .ngh #experience .ngpt-search-card__check {
flex: 0 0 12px;
width: 12px; height: 12px;
border-radius: 50%;
background: #e3f3d5;
position: relative;
}
body.home .ngh #experience .ngpt-search-card__check::before {
content: ''; position: absolute; inset: 3px;
border-radius: 50%; background: #84c041;
}
body.home .ngh #experience .ngpt-search-card__result b {
display: block; font: 700 9px/1.3 'Proximanova-bold',sans-serif; color: #303432;
}
body.home .ngh #experience .ngpt-search-card__result i {
display: block; width: 70%; max-width: 170px; height: 3px;
margin-top: 3px; border-radius: 5px; background: #d6dcd5;
}
body.home .ngh #experience .ngpt-search-card__result:nth-child(3) i { width: 51%; }
body.home .ngh #experience .ngpt-search-card__result:nth-child(4) i { width: 62%; }
body.home .ngh #experience .ngpt-site-card__bar {
display: flex; align-items: center; gap: 3px;
padding: 7px 9px; border-bottom: 1px solid #e5e8e2; background:#eceef0;
}
body.home .ngh #experience .ngpt-site-card__bar i {
width: 5px; height: 5px; border-radius: 50%; background: #b7bec1;
}
body.home .ngh #experience .ngpt-site-card__bar i:first-child { background: #84c041; }
body.home .ngh #experience .ngpt-site-card__bar span {
flex: 1; text-align: center; color:#62676b;
font: 700 8px/1 'Proximanova-bold',sans-serif;
}
body.home .ngh #experience .ngpt-site-card__canvas {
display:grid;grid-template-columns:1.1fr .9fr; gap:12px; align-items:center; padding:13px 13px 15px;
}
body.home .ngh #experience .ngpt-site-card__eyebrow {
display:block;width:33%;height:5px;background:#84c041;border-radius:3px;margin-bottom:8px;
}
body.home .ngh #experience .ngpt-site-card__title {
display:block;width:90%;height:11px;background:#202124;border-radius:3px;margin-bottom:7px;
}
body.home .ngh #experience .ngpt-site-card__text {
display:block;width:100%;height:4px;background:#bcc1c5;border-radius:3px;margin-bottom:5px;
}
body.home .ngh #experience .ngpt-site-card__text--short {width:70%;}
body.home .ngh #experience .ngpt-site-card__button {
display:inline-block;padding:6px 8px;margin-top:5px;border-radius:3px;
background:#84c041;color:#182019;
font:700 7px/1 'Proximanova-bold',sans-serif;
}
body.home .ngh #experience .ngpt-site-card__art {
display:flex;align-items:flex-end;gap:6px;justify-content:center;
height:76px;border-radius:5px;background:linear-gradient(145deg,#e3f3d5,#d5e2d2);
padding:12px 8px;
}
body.home .ngh #experience .ngpt-site-card__art span {
display:block;width:26%;border-radius:4px 4px 0 0;background:#84c041;
height:40%;
}
body.home .ngh #experience .ngpt-site-card__art span:nth-child(2) {height:75%;background:#679a32;}
body.home .ngh #experience .ngpt-site-card__art span:nth-child(3) {height:56%;background:#b5e66a;}
body.home .ngh #experience .ngpt-growth-card { padding: 10px 11px 8px; }
body.home .ngh #experience .ngpt-growth-card__top {
display:flex;gap:7px;align-items:center;justify-content:space-between;
}
body.home .ngh #experience .ngpt-growth-card__top > span {
color:#62676b;font:700 8px/1.2 'Proximanova-bold',sans-serif;letter-spacing:.05em;
}
body.home .ngh #experience .ngpt-growth-card__top b {
color:#3e6b24;font:700 8px/1.2 'Proximanova-bold',sans-serif;
}
body.home .ngh #experience .ngpt-growth-card__top b i {
display:inline-block;width:5px;height:5px;border-radius:50%;background:#84c041;margin-right:3px;
}
body.home .ngh #experience .ngpt-growth-card__graph {
position:relative;height:82px;margin:7px 0 2px;overflow:hidden;
}
body.home .ngh #experience .ngpt-growth-card__grid {
display:block;position:absolute;left:0;right:0;height:1px;background:#e0e7db;
}
body.home .ngh #experience .ngpt-growth-card__grid--a {top:25%;}
body.home .ngh #experience .ngpt-growth-card__grid--b {top:50%;}
body.home .ngh #experience .ngpt-growth-card__grid--c {top:75%;}
body.home .ngh #experience .ngpt-growth-card__graph svg {
position:absolute;inset:0;width:100%;height:100%;
}
body.home .ngh #experience .ngpt-growth-card__area {fill:#84c04127;}
body.home .ngh #experience .ngpt-growth-card__line {
fill:none;stroke:#6da23c;stroke-width:3;stroke-linejoin:round;stroke-linecap:round;
}
body.home .ngh #experience .ngpt-growth-card__point {fill:#84c041;stroke:#fff;stroke-width:2;}
body.home .ngh #experience .ngpt-growth-card__labels {
display:flex;gap:5px;justify-content:space-between;
font:700 7px/1.2 'Proximanova-bold',sans-serif;color:#62676b;
}
body.home .ngh #experience .ngpt-showcase__progress {
display:block;height:4px;background:#35472c;overflow:hidden;
}
body.home .ngh #experience .ngpt-showcase__progress span {
display:block;width:100%;height:100%;
transform:scaleX(0);transform-origin:left;
background:linear-gradient(90deg,#84c041,#b5e66a 70%,#e3f3d5);
} body.home .ngh #experience .nghd-process__path { margin:18px 0 15px;min-width:0; }
body.home .ngh #experience .nghd-process__path-node { min-width:0; }
body.home .ngh #experience .nghd-process__path-node--green { background:#383838;border-color:#555; }
body.home .ngh #experience .nghd-process__path-node--green .nghd-process__path-number {color:#b5e66a;}
body.home .ngh #experience .nghd-process__path-node--green strong { color:#fff; }
body.home .ngh #experience .nghd-process__path-node--green small {color:#dadada;} @media (prefers-reduced-motion: no-preference) {
body.home .ngh #experience .ngpt-scene--discover {animation:ngpt-stage-first 7.2s ease-in-out infinite;}
body.home .ngh #experience .ngpt-scene--build {animation:ngpt-stage-second 7.2s ease-in-out infinite;}
body.home .ngh #experience .ngpt-scene--improve {animation:ngpt-stage-third 7.2s ease-in-out infinite;}
body.home .ngh #experience .ngpt-showcase__progress span {animation:ngpt-stage-progress 7.2s linear infinite;}
body.home .ngh #experience .ngpt-showcase__live i {animation:ngpt-stage-beacon 1.25s ease-in-out infinite;}
body.home .ngh #experience .ngpt-search-card__cursor {animation:ngpt-stage-cursor .7s steps(1) infinite;}
body.home .ngh #experience .ngpt-search-card__result {animation:ngpt-stage-row 7.2s ease-in-out infinite;}
body.home .ngh #experience .ngpt-search-card__result:nth-child(3) {animation-delay:.11s;}
body.home .ngh #experience .ngpt-search-card__result:nth-child(4) {animation-delay:.22s;}
body.home .ngh #experience .ngpt-site-card__art span {animation:ngpt-stage-bars 1.55s ease-in-out infinite alternate;}
body.home .ngh #experience .ngpt-site-card__art span:nth-child(2){animation-delay:.24s;}
body.home .ngh #experience .ngpt-site-card__art span:nth-child(3){animation-delay:.46s;}
body.home .ngh #experience .ngpt-growth-card__line {
stroke-dasharray:290;stroke-dashoffset:290;
animation:ngpt-stage-graph 7.2s ease-in-out infinite;
}
body.home .ngh #experience .ngpt-growth-card__point {animation:ngpt-stage-point 7.2s ease-in-out infinite;}
body.home .ngh #experience .nghd-process__visual .nghd-process__path-node:nth-child(1) {
animation:ngpt-stage-tile-first 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__visual .nghd-process__path-node:nth-child(3) {
animation:ngpt-stage-tile-second 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__visual .nghd-process__path-node:nth-child(5) {
animation:ngpt-stage-tile-third 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__path-arrow {animation:ngpt-stage-arrow 1.2s ease-in-out infinite;}
body.home .ngh #experience .nghd-process__outcome-icon {animation:ngpt-stage-finish 7.2s ease-in-out infinite;}
@keyframes ngpt-stage-first {
0%,3%,26% {opacity:1;transform:translateY(0) scale(1);}
30%,96% {opacity:0;transform:translateY(-12px) scale(.98);}
100% {opacity:1;transform:translateY(0) scale(1);}
}
@keyframes ngpt-stage-second {
0%,27% {opacity:0;transform:translateY(15px) scale(.98);}
33%,58% {opacity:1;transform:translateY(0) scale(1);}
63%,100% {opacity:0;transform:translateY(-12px) scale(.98);}
}
@keyframes ngpt-stage-third {
0%,59% {opacity:0;transform:translateY(15px) scale(.98);}
65%,94% {opacity:1;transform:translateY(0) scale(1);}
100% {opacity:0;transform:translateY(-12px) scale(.98);}
}
@keyframes ngpt-stage-progress {
0% {transform:scaleX(0);}
98% {transform:scaleX(1);}
100% {transform:scaleX(0);}
}
@keyframes ngpt-stage-beacon {
0%,100% {opacity:.65;box-shadow:0 0 0 1px #b5e66a22;}
50% {opacity:1;box-shadow:0 0 0 5px #b5e66a38,0 0 14px #b5e66a88;}
}
@keyframes ngpt-stage-cursor {0%,49%{opacity:1;}50%,100%{opacity:0;}}
@keyframes ngpt-stage-row {
0% {transform:translateX(-12px);opacity:0;}
10%,28% {transform:translateX(0);opacity:1;}
35%,100% {transform:translateX(0);opacity:1;}
}
@keyframes ngpt-stage-bars {
0% {transform:scaleY(.65);transform-origin:bottom;}
100% {transform:scaleY(1);transform-origin:bottom;}
}
@keyframes ngpt-stage-graph {
0%,62% {stroke-dashoffset:290;}
83%,98% {stroke-dashoffset:0;}
100% {stroke-dashoffset:290;}
}
@keyframes ngpt-stage-point {
0%,78% {opacity:0;transform:scale(.4);transform-origin:237px 8px;}
86%,96% {opacity:1;transform:scale(1.18);transform-origin:237px 8px;}
100% {opacity:0;transform:scale(.4);transform-origin:237px 8px;}
}
@keyframes ngpt-stage-tile-first {
0%,5%,23% {background:#84c041;border-color:#b5e66a;box-shadow:0 0 0 2px #b5e66a8c;transform:translateY(-3px);}
29%,98% {background:#383838;border-color:#555;box-shadow:none;transform:none;}
100% {background:#84c041;border-color:#b5e66a;box-shadow:0 0 0 2px #b5e66a8c;transform:translateY(-3px);}
}
@keyframes ngpt-stage-tile-second {
0%,27% {background:#383838;border-color:#555;box-shadow:none;transform:none;}
34%,57% {background:#84c041;border-color:#b5e66a;box-shadow:0 0 0 2px #b5e66a8c;transform:translateY(-3px);}
63%,100% {background:#383838;border-color:#555;box-shadow:none;transform:none;}
}
@keyframes ngpt-stage-tile-third {
0%,61% {background:#383838;border-color:#555;box-shadow:none;transform:none;}
66%,92% {background:#84c041;border-color:#b5e66a;box-shadow:0 0 0 2px #b5e66a8c;transform:translateY(-3px);}
100% {background:#383838;border-color:#555;box-shadow:none;transform:none;}
} @keyframes ngpt-stage-arrow {0%,100%{opacity:.6;}50%{opacity:1;filter:brightness(1.5);}}
@keyframes ngpt-stage-finish {0%,80%,100%{transform:scale(1);box-shadow:none;}85%,94%{transform:scale(1.13);box-shadow:0 0 0 6px #84c04130;}}
body.home .ngh #experience .nghd-process__path-node strong,
body.home .ngh #experience .nghd-process__path-node small,
body.home .ngh #experience .nghd-process__path-node .nghd-process__path-number {
color:#fff;
}
body.home .ngh #experience .nghd-process__path-node small {color:#f2f2f2;}
body.home .ngh #experience .nghd-process__path-node .nghd-process__path-number {color:#def3c5;}
} @media (prefers-reduced-motion: reduce) {
body.home .ngh #experience .ngpt-scene--discover {opacity:1;transform:none;}
body.home .ngh #experience .ngpt-scene--build,
body.home .ngh #experience .ngpt-scene--improve {opacity:0;}
body.home .ngh #experience .nghd-process__path-node--green {background:#84c041;border-color:#84c041;}
body.home .ngh #experience .nghd-process__path-node--green strong,
body.home .ngh #experience .nghd-process__path-node--green small,
body.home .ngh #experience .nghd-process__path-node--green .nghd-process__path-number {color:#202124;}
}
@media(max-width:1090px) {
body.home .ngh #experience .ngpt-scene {grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);}
body.home .ngh #experience .ngpt-scene__copy strong {font-size:18px;}
}
@media(max-width:600px) {
body.home .ngh #experience .ngpt-showcase {margin-top:17px;}
body.home .ngh #experience .ngpt-showcase__auto {font-size:8px;letter-spacing:0;}
body.home .ngh #experience .ngpt-showcase__live {font-size:8px;}
body.home .ngh #experience .ngpt-showcase__viewport {height:237px;}
body.home .ngh #experience .ngpt-scene {display:flex; flex-direction:column; align-items:stretch; gap:12px; padding:16px;}
body.home .ngh #experience .ngpt-scene__copy strong {font-size:19px;max-width:none;}
body.home .ngh #experience .ngpt-scene__copy small {margin-bottom:4px;}
body.home .ngh #experience .ngpt-scene__copy > span {margin-top:5px;}
body.home .ngh #experience .ngpt-search-card,
body.home .ngh #experience .ngpt-site-card,
body.home .ngh #experience .ngpt-growth-card {max-width:100%;}
body.home .ngh #experience .ngpt-site-card__canvas {padding:10px 12px;}
body.home .ngh #experience .ngpt-site-card__art {height:56px;}
body.home .ngh #experience .ngpt-growth-card__graph {height:70px;}
body.home .ngh #experience .nghd-process__path {margin:17px 0 14px;}
} @media (prefers-reduced-motion: no-preference) {
body.home .ngh #experience .nghd-process__visual.ngpt-active .nghd-process__path-node:nth-child(1) {
animation:ngpt-stage-tile-first 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__visual.ngpt-active .nghd-process__path-node:nth-child(3) {
animation:ngpt-stage-tile-second 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__visual.ngpt-active .nghd-process__path-node:nth-child(5) {
animation:ngpt-stage-tile-third 7.2s ease-in-out infinite;
}
body.home .ngh #experience .nghd-process__path-node:nth-child(1) > :is(strong,small,span) {
animation: ngpt-stage-ink-first 7.2s linear infinite;
}
body.home .ngh #experience .nghd-process__path-node:nth-child(3) > :is(strong,small,span) {
animation: ngpt-stage-ink-second 7.2s linear infinite;
}
body.home .ngh #experience .nghd-process__path-node:nth-child(5) > :is(strong,small,span) {
animation: ngpt-stage-ink-third 7.2s linear infinite;
}
@keyframes ngpt-stage-ink-first {
0%,5%,23% {color:#202124;}
29%,98% {color:#fff;}
100% {color:#202124;}
}
@keyframes ngpt-stage-ink-second {
0%,27% {color:#fff;}
34%,57% {color:#202124;}
63%,100% {color:#fff;}
}
@keyframes ngpt-stage-ink-third {
0%,61% {color:#fff;}
66%,92% {color:#202124;}
100% {color:#fff;}
}
} body.home .ngh #experience .ngpt-showcase *,
body.home .ngh #experience .ngpt-showcase *::before,
body.home .ngh #experience .ngpt-showcase *::after {box-sizing:border-box;}