@import url("https://fonts.googleapis.com/css2?family=Nata+Sans:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:bottom}body{line-height:1}button{font:inherit}button:focus{outline:none}:focus-visible{outline: 1px solid rgba(255, 255, 255, .8);outline-offset:2px;border-radius: 2px;}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type=text],input[type=button],input[type=submit],input[type=reset],input[type=search],input[type=password]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:60%;line-height:initial}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:1.2rem}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*,*:before,*:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px,1px,1px,1px);position:absolute!important} :root { --color-brand-blue-primary: #05374F;
--color-brand-blue-dark: #002E44;
--color-brand-blue-medium: #054868;
--color-brand-blue-light: #1382B2;
--color-brand-blue-lighter: #22aae5;
--color-brand-lime-primary: #A1C52F;
--color-brand-teal-primary: #1a7b8b; --color-primary-black: #000000;
--color-primary-white: #ffffff;
--color-primary-gray-dark: #333333;
--color-primary-gray-medium-dark: #a4a4a4;
--color-primary-gray-medium: #c3c3c3;
--color-primary-gray-light: #FAFAFA;
--color-red-alert: #9F1D1D;
--color-red-alert-accent: #B30822; --color-text-primary: var(--color-primary-gray-dark);
--color-text-heading: var(--color-brand-blue-primary);
--color-link: var(--color-brand-blue-primary);
--color-text-alert: var(--color-red-alert); --font-h1: 9rem;
--font-h2: 5rem;
--font-h3: 3rem;
--font-h4: 2.5rem;
--font-h5: 2rem;
--font-body: 1.8rem;
--line-height-base: 1.1;
--line-height-tight: .95;
--line-height-expanded: 1.5; --font-icon: "Font Awesome 7 Pro"; --space-xs: 10px;
--space-sm: 15px;
--space-md: 20px;
--space-lg: 40px;
--space-xl: 60px; --site-width: 1440px; --transition-base: 0.3s ease;
--transition-header: 0.5s ease; --site-header-height: 90px;
--wp-admin-bar-height: 0px;
--header-height: 90px;
--header-scrolled-height: 60px;
color: #22aae5;
}
body.admin-bar {
--wp-admin-bar-height: 32px;
}
@media screen and (max-width: 782px) {
body.admin-bar {
--wp-admin-bar-height: 46px;
}
}
@media screen and (max-width: 1024px) {
:root {
--header-height: 60px;
--header-scrolled-height: 60px;
}
} html { font-size: 62.5%; overflow-x: hidden;overscroll-behavior: none;}
@media (prefers-reduced-motion: no-preference) {
html { scroll-behavior: smooth; }
}
.row,body,img {width:100%}
body {font-family:Poppins,sans-serif;font-size:var(--font-body);line-height:var(--line-height-expanded);font-weight:300;color:var(--color-text-primary);background-color:var(--color-brand-teal-primary);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:clip}
::-moz-selection,::selection {background-color:var(--color-primary-black);color:var(--color-primary-white)}
.row {max-width:var(--site-width);margin:0 auto;position:relative;display:flex;flex-wrap:wrap;justify-content:center;box-sizing:border-box}
.full {max-width:100%;padding:0}
.inset {margin:0 var(--space-lg)}
img {height:auto}
.mobile{display:none;visibility:hidden}
@media screen and (max-width:1024px){
.row.inset{margin-left:var(--space-md);margin-right:var(--space-md)}
}
@media screen and (max-width:760px){
.desktop{display:none;visibility:hidden}
.mobile{display:revert;visibility:revert}
}
.skip-link {
position: fixed;
top: -100px;
left: 20px;
z-index: 99999;
padding: 12px 18px;
background-color: var(--color-brand-lime-primary);
color: var(--color-brand-blue-primary);
font-size: 1.6rem;
font-weight: 600;
text-decoration: none;
transition: top .25s ease;
}
.skip-link:focus,
.skip-link:focus-visible {
top: 20px;
outline: 3px solid var(--color-primary-white);
outline-offset: 3px;
} h1, h2, h3, h4, h5 {
font-family: 'Nata Sans', sans-serif;
color: var(--color-text-heading);
line-height: var(--line-height-base);
word-break: normal;
overflow-wrap: break-word;
}
h1 {
font-size: var(--font-h1);
line-height: var(--line-height-tight);
font-weight: 900;
margin: 0 0 var(--space-sm);
}
h2 {
font-size: var(--font-h2);
font-weight: 800;
margin: 0 0 var(--space-xs);
}
h3 {
font-size: var(--font-h3);
font-weight: 600;
margin: 0 0 var(--space-xs);
}
h4 {
font-size: var(--font-h4);
font-weight: 600;
margin: 0 0 var(--space-xs);
}
h5 {
font-size: var(--font-h5);
font-weight: 500;
margin: 0 0 var(--space-xs);
}
p, ul {
margin-bottom: var(--space-sm);
line-height: var(--line-height-expanded);
}
p:last-child {
margin-bottom: 0;
}
a {
color: var(--color-link);
text-decoration: none;
}
a:hover,
a:focus-visible {
text-decoration: underline dotted var(--color-brand-blue-light);
text-underline-offset: 2px; 
}
em, i {
font-weight: 300;
font-style: italic;
}
strong, b {
font-weight: 600;
}
@media screen and (max-width: 1024px) {
:root {
--font-h1: 6rem;
--font-h2: 4rem;
--font-h3: 3rem;
--font-h4: 2rem;
--font-h5: 1.8rem;
--font-body: 1.8rem;
}
}
@media screen and (max-width: 760px) {
:root {
--font-h1: 4.2rem;
--font-h2: 3.2rem;
--font-h3: 2.8rem;
--font-h4: 2rem;
--font-h5: 1.7rem;
--font-body: 1.7rem;
--line-height-tight: 1.05;
}
}
@media screen and (max-width: 480px) {
:root {
--font-h1: 3.6rem;
--font-h2: 2.8rem;
--font-h3: 2.3rem;
--font-h4: 2rem;
--font-h5: 1.7rem;
--font-body: 1.6rem;
}
} .middle {
align-self: center;
}
.row.header {
margin-bottom: 20px;
flex: 1;
}
.header-text.text-left {
flex: 1;
text-align: left;
}
.module-header {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 30px;
width: 100%;
margin-bottom: 40px;
}
.module-header h2 {
font-size: var(--font-h4);
color: var(--color-brand-blue-lighter);
margin: 0;
}
@media screen and (max-width: 760px) {
.module-header {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
.module-header h2 {
font-size: var(--font-h4);
}
}
.top-none { padding-top: 0; }
.top-small { padding-top: 40px; }
.top-medium { padding-top: 80px; }
.top-large { padding-top: 100px; }
.top-xlarge { padding-top: 120px; }
.bottom-none { padding-bottom: 0; }
.bottom-small { padding-bottom: 40px; }
.bottom-medium { padding-bottom: 80px; }
.bottom-large { padding-bottom: 100px; }
.bottom-xlarge { padding-bottom: 120px; }
@media screen and (max-width: 760px) {
.top-small { padding-top: 20px; }
.top-medium { padding-top: 60px; }
.top-large { padding-top: 80px; }
.top-xlarge { padding-top: 100px; }
.bottom-small { padding-bottom: 20px; }
.bottom-medium { padding-bottom: 60px; }
.bottom-large { padding-bottom: 80px; }
.bottom-xlarge { padding-bottom: 100px; }
}
.bgcolor-default { background-color: var(--color-brand-blue-primary); }
.bgcolor-white { background-color: var(--color-primary-white); }
.bgcolor-gray { background-color: var(--color-primary-gray-dark); }
.bgcolor-gray-dark { background-color: var(--color-primary-gray-dark); }
.bgcolor-gray-light { background-color: var(--color-primary-gray-light); }
.bgcolor-blue { background-color: var(--color-brand-blue-primary); }
.bgcolor-blue-dark { background-color: var(--color-brand-blue-dark); }
.bgcolor-blue-light { background-color: var(--color-brand-blue-light); }
.text-default {
color: var(--color-primary-white);
}
.text-dark {
color: var(--color-primary-gray-dark);
}
.text-dark :where(p, li, i, .gform_wrapper.gravity-theme .gfield_label) {
color: var(--color-primary-gray-dark);
}
.text-dark :where(h1, h2, h3, h4, h5, h6) {
color: var(--color-brand-blue-primary);
}
.text-default,
.text-default :where(h1, h2, h3, h4, h5, h6, p, li, i, .gform_wrapper.gravity-theme .gfield_label),
.text-light,
.text-light :where(h1, h2, h3, h4, h5, h6, p, li, i, .gform_wrapper.gravity-theme .gfield_label) {
color: var(--color-primary-white);
}
.bgcolor-default.text-light h3,
.bgcolor-blue-dark.text-light h3 {
color: var(--color-brand-lime-primary);
} .reveal {
position:relative;
opacity:0;
transform:translateY(40px);
transition:opacity 0.8s ease, transform 0.8s ease;
}
.reveal.active {
opacity:1;
transform:translateY(0);
} @keyframes fadeUpHold {
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeSlideUp {
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes slideInArrow {
to {
opacity: 1;
transform: translateX(0);
}
}
@keyframes pushHeadline {
to {
transform: translateX(20px);
}
} body:not(.page-loaded) #main-content {
opacity: 0;
transform: translateY(12px);
}
body.page-loaded #main-content {
opacity: 1;
transform: translateY(0);
transition: opacity .5s ease, transform .5s ease;
}
body.page-leaving #main-content {
opacity: 0;
transform: translateY(-12px);
transition: opacity .25s ease, transform .25s ease;
} #site-alert {
background-color: var(--color-text-alert);
padding: 10px 40px;
text-align: center;
color: var(--color-primary-black);
font-size: 1.2rem;
display: block;
z-index: 10000;
}
#site-alert p {
margin: 0;
color: var(--color-primary-white);
font-weight: 500;
}
#site-alert a {
margin: 0;
color: var(--color-primary-white);
text-decoration: underline;
}
#site-alert > .row {
justify-content: center;
} #site-header {
position: fixed;
top: var(--wp-admin-bar-height);
left: 0;
z-index: 100;
transition: all 0.5s;
} #site-header .nav-bar {
min-height: var(--header-height);
transition: all var(--transition-header);
margin: 0 40px;
}
#site-header .nav-wrap {
transition: linear var(--transition-base);
align-self: center;
}
#logo-container {
display: flex;
}
#site-logo {
display: block;
width: 220px;
max-width: 100%;
height: auto;
margin-right: 30px;
position: relative;
transition: all var(--transition-header);
} #site-header.scrolled {
background-color: rgba(5, 55, 79, .6) !important;
}
#site-header.scrolled .nav-bar {
min-height: var(--header-scrolled-height) !important;
}
#site-header.scrolled #site-logo {
width: 160px;
} @media screen and (max-width: 1024px) {
#site-header .nav-bar {
min-height: var(--header-height);
margin: 0;
}
#site-header .nav-wrap {
padding: 0 20px;
height: var(--header-height);
}
#logo-container {
display: flex;
flex:  1;
}
#site-logo {
width: 200px;
}
}
@media screen and (max-width: 760px) {
#site-logo {
width: 180px;
}
}
@media screen and (max-width: 500px) {
#site-logo {
width: 160px;
}
} #main-nav {
display: flex;
flex: 1;
padding-left: 10px;
border-left: 1px solid var(--color-brand-blue-light);
font-family: 'Poppins', sans-serif;
transition: 0.3s linear;
}
#main-nav > ul {
display: flex;
align-items: center;
width: 100%;
margin-bottom: 0;
white-space: nowrap;
}
#main-nav .nav-btn {
margin-left: auto;
}
#main-nav ul > li {
position: relative;
}
#main-nav .menu-item-has-children::after { content: '';
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 35px;
pointer-events: auto;
}
#main-nav a {
font-size: 1.5rem;
font-weight: 500;
color: var(--color-primary-white);
display: inline-block;
text-decoration: none;
padding: 0 20px;
position: relative;
}
#main-nav .menu-item-has-children {
margin-right: 10px;
}
#main-nav .menu-item-has-children > a::after {
font-family: var(--font-icon);
font-weight: 300;
content: "\f078";
font-size: 0.8rem;
position: absolute;
right: -3px;
top: 50%;
transform: translateY(-50%);
pointer-events: none;
color: inherit;
}
#main-nav ul.sub-menu {
position: absolute;
min-width: 200px;
text-align: left;
white-space: nowrap;
background-color: var(--color-brand-blue-primary);
box-shadow: 0 2px 4px rgb(0 0 0 / 50%);
z-index: 10;
border-radius: 1px;
padding: 8px 10px;
pointer-events: auto;
display: block; 
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity 0.3s ease, transform 0.3s ease;
top: 100%;
margin-top: 20px; 
}
#main-nav ul > li:hover > ul,
#main-nav ul > li:focus-within > ul {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
#main-nav ul.sub-menu li a {
padding: 15px 5px;
text-transform: capitalize;
color: var(--color-primary-white);
margin-bottom: 0;
}
#main-nav ul.sub-menu a::before {
content: none;
}
#main-nav > ul > li:not(.nav-btn).current-menu-item > a::before,
#main-nav > ul > li:not(.nav-btn).current-menu-ancestor > a::before,
#main-nav > ul > li:not(.nav-btn).current-page-ancestor > a::before,
#main-nav > ul > li:not(.nav-btn) > a:hover::before {
content: "";
height: 1px;
width: 30px;
background-color: var(--color-brand-lime-primary);
position: absolute;
top: 23px;
left: 50%;
transform: translateX(-50%);
transition: opacity 0.5s;
opacity: 1;
}
#main-nav .nav-btn a:hover {
text-decoration: none;
}
#main-nav .no-show,
#menu-main-menu-1 .no-show {
display: none;
}
@media screen and (max-width: 1140px) {
#main-nav a {
font-size: 1.4rem;
padding: 0 15px;
}
} #nav-trigger {
display: block;
position: relative;
top: 16px;
right: 0;
width: 32px;
height: 28px;
z-index: 100;
cursor: pointer;
padding: 0;
border-radius: 8px;
}
@media screen and (min-width: 1025px) {
#nav-trigger {
display: none;
}
}
#mobile-nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100dvh;
overflow-y: auto;
background-color: var(--color-brand-blue-dark);
font-family: 'Poppins', sans-serif;
z-index: 10000;
transform: translateY(-100%);
visibility: hidden;
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0s linear 0.3s;
}
#mobile-nav.mnav-open {
transform: translateY(0);
visibility: visible;
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0s;
}
#mobile-nav nav {
display: block;
width: 100%;
}
#mobile-nav a {
display: flex;
align-items: center;
gap: 10px;
padding: 0 20px;
color: var(--color-primary-white);
font-size: 2.6rem;
line-height: 6.4rem;
font-weight: 300;
text-decoration: none;
transition: background-color .5s;
}
#mobile-nav a::after {
content: "\f054";
flex: 0 0 auto;
font-family: var(--font-icon);
color: var(--color-brand-lime-primary);
font-size: 1.8rem;
font-weight: 300;
line-height: 1;
transition: transform .3s ease;
}
#mobile-nav a:hover::after,
#mobile-nav a:focus-visible::after {
transform: translateX(5px);
}
#mobile-nav ul {
margin: 10px 0 40px 0;
}
#mobile-nav nav .sub-menu {
display: none;
border-left: 1px var(--color-primary-white) solid;
margin: 0 0 0 20px;
}
#mobile-nav .sub-menu li a {
font-weight: 400;
}
#nav-trigger [id^="hamburger-"] {
height: 2px;
background-color: var(--color-primary-white);
display: block;
position: absolute;
border-radius: 3px;
right: 0;
transition: all 0.3s;
box-shadow: 0 0 2px rgba(0, 0, 0, 1);
}
#hamburger-top { top: 6px; width: 28px; }
#hamburger-mid { top: 14px; width: 20px; }
#hamburger-btm { top: 22px; width: 12px; }
#mobile-nav-close {
top: 16px;
right: 0;
width: 100%;
height: 40px;
background: none;
border: none;
color: var(--color-primary-white);
cursor: pointer;
z-index: 10000;
transition: opacity 0.3s ease-in-out;
text-align: right;
padding: 20px;
}
#mobile-nav-close::before {
content: "\f00d";
font-family: var(--font-icon);
font-size: 2.6rem;
font-weight: 300;
display: inline-block;
}
li.mnav-trigger > a::after {
content: "\f067";
font-family: 'Font Awesome 7 Pro';
font-weight: 300;
font-size: 2rem;
display: inline-block;
margin-top: -2px;
position: absolute;
right: 22px;
transition: transform 0.5s ease, opacity 0.3s ease;
transform-origin: 50% 50%;
opacity: 1;
transform: rotate(0deg) scale(1);
}
li.mnav-trigger.open > a::after {
content: "\f068";
transform: rotate(360deg) scale(1);
opacity: 1;
transition: transform 0.5s ease-in-out, opacity 0.3s ease-in-out;
}
@media screen and (max-width: 1024px) {
#main-nav {
display: none;
}
} .narrow {
max-width: 1140px;
}
.narrower {
max-width: 1024px;
} .row.accordion {
flex-direction: column;
}
.accordion-intro {
margin-bottom: 40px;
}
ul.accordion-list {
position: relative;
display: block;
width: 100%;
margin: 0;
list-style: none;
}
ul.accordion-list li {
position: relative;
display: block;
width: 100%;
padding: 20px 20px 20px 0;
margin: 0 auto 15px;
cursor: pointer;
border-bottom: 1px solid  var(--color-brand-blue-light);
}
div.answer {
position: relative;
width: 100%;
margin: 0;
padding: 0;
}
div.answer p {
font-weight: 300;
padding: 10px 0 0;
margin: 0 0 15px;
}
ul.accordion-list .answer ol,
ul.accordion-list .answer ul {
padding-left: 20px;
}
ul.accordion-list .answer ol li {
font-weight: 300;
padding: 0;
border-bottom: none;
list-style-type: auto;
display: list-item;
}
ul.accordion-list .answer ul li {
padding: 0;
border-bottom: none;
list-style-type: circle;
display: list-item;
}
button.accordion-trigger {
all: unset;
display: flex;
justify-content: space-between;
align-items: flex-start;
width: 100%;
cursor: pointer;
font-size: var(--font-h3);
line-height: var(--line-h4);
font-weight: 400;
letter-spacing: 0.01em;
padding: 0 0 10px;
margin: 0;
}
button.accordion-trigger:after {
content: '\2b';
font-size: 2.9rem;
margin-left: 10px;
font-family: 'Font Awesome 7 Pro';
font-weight: 300;
transition: transform 0.3s ease;
}
ul.accordion-list li.active button.accordion-trigger:after {
content: '\f068';
transform: rotate(180deg);
}
button.accordion-trigger:focus-visible {
outline: 2px solid var(--color-brand-blue-dark);
outline-offset: 4px;
}
@media screen and (max-width: 1024px) {
.accordion-panel.row.full {
}
}
@media screen and (max-width: 760px) {
button.accordion-trigger {
}
} .basic-content-panel.row.full {
text-align: left;
display: flex;
align-items: center;
position: relative;
overflow: hidden;
}
.basic-content-panel::before {
content: "";
position: absolute;
inset: 0;
background-image: url(//heliumstudio.com/wp-content/themes/Helium2026/images/heliumstudio-logo-pattern.svg);
background-position: center;
background-repeat: repeat;
background-size: 2020px auto;
background-attachment: fixed;
opacity: .18;
pointer-events: none;
z-index: 0;
}
.basic-content {
justify-content: flex-start;
}
.basic-content-inner {
width: 100%;
display: flex;
flex-direction: column;
gap: 10px;
}
.basic-content-copy p {
margin-bottom: 10px;
}
.basic-content-copy ul li {
list-style: disc;
margin-left: 20px;
}
.basic-content-word {
display: inline-block;
opacity: 0;
transform: translateY(.35em);
filter: blur(4px);
}
.basic-content-panel.is-visible .basic-content-word {
animation: basicContentWordReveal .55s cubic-bezier(.16, 1, .3, 1) forwards;
animation-delay: calc(var(--word-index) * 90ms);
}
.basic-content h2 .basic-content-accent {
color: var(--color-brand-lime-primary);
}
@keyframes basicContentWordReveal {
to {
opacity: 1;
transform: translateY(0);
filter: blur(0);
}
}
@media (prefers-reduced-motion: reduce) {
.basic-content-word {
opacity: 1;
transform: none;
filter: none;
animation: none;
}
} .row.full.card-panel {
text-align: left;
}
.card-panel-wrap .card-intro {
max-width: 760px;
margin-bottom: 40px;
}
.row.card-wrap {
display: block;
column-count: 3;
column-gap: 60px;
}
article.card-item {
display: inline-block;
width: 100%;
margin: 0 0 40px;
break-inside: avoid;
}
.card-container {
margin: 0;
gap: 10px;
display: flex;
flex-direction: column;
}
.card-icon {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
border-radius: 4px;
background-color: var(--color-brand-blue-dark);
}
.card-icon i {
color: var(--color-brand-blue-light);
font-size: 20px;
line-height: 1;
}
.card-container h3 {
margin: 0;
font-size: var(--font-h4);
color: var(--color-brand-lime-primary);
}
.card-container p {
line-height: 1.4;
margin: 0;
}
@media screen and (max-width: 1024px) {
.row.card-wrap {
column-count: 2;
column-gap: 40px;
}
}
@media screen and (max-width: 640px) {
.row.card-wrap {
column-count: 1;
}
article.card-item {
margin-bottom: 24px;
}
} .contact-container {
display: flex;
flex-direction: row;
gap: 50px;
text-align: left;
}
.contact-info {
flex: 1;
max-width: 42%;
text-align: left;
}
.contact-bar h2 {
}
.contact-details {
display: grid;
grid-template-columns: 1fr;
gap: 10px 10px;
}
.contact-details > div {
white-space: nowrap;
display: inline-flex;
align-items: center;
gap: 6px;
}
.contact-details a {
color: var(--color-primary-white);
}
.contact-details-email::before,
.contact-details-phone::before,
.contact-details-fax::before {
font-family: var(--font-icon);
font-weight: 300;
color: var(--color-brand-blue-light);
speak: none;
}
.contact-details-email::before {
content: "\f0e0";
padding-right: 6px;
}
.contact-details-phone::before {
content: "\f095";
padding-right: 6px;
}
.contact-details-fax::before {
content: "\f1ac";
padding-right: 6px;
}
.contact-info .locations-info {
padding: 30px;
margin-top: 10px;
}
.locations-info .offices {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
padding-bottom: 30px;
}
.contact-form {
flex: 1;
max-width: 58%;
text-align: left;
}
.contact-form h2 {
padding-bottom: 10px;
}
@media screen and (max-width: 1040px) {
.contact-details {
grid-template-columns: 1fr;
}
.locations-info .offices {
grid-template-columns: 1fr;
}
}
@media screen and (max-width: 760px) {
.contact-container {
flex-direction: column;
}
.contact-info,
.contact-form {
max-width: unset;
width: 100%;
}
} .contact-panel .gfield_radio {
display: flex;
}
.contact-panel .gchoice {
flex: 1;
color: var(--color-primary-gray-dark);
}
.contact-panel p.gform_required_legend {
display: none;
}
.contact-panel .gform_wrapper.gravity-theme .gfield_required {
color: var(--color-primary-gray-dark);
font-size: 1.2rem;
font-weight: 300;
}
.contact-panel .gform_wrapper.gravity-theme input[type=color],
.contact-panel .gform_wrapper.gravity-theme input[type=date],
.contact-panel .gform_wrapper.gravity-theme input[type=datetime-local],
.contact-panel .gform_wrapper.gravity-theme input[type=datetime],
.contact-panel .gform_wrapper.gravity-theme input[type=email],
.contact-panel .gform_wrapper.gravity-theme input[type=month],
.contact-panel .gform_wrapper.gravity-theme input[type=number],
.contact-panel .gform_wrapper.gravity-theme input[type=password],
.contact-panel .gform_wrapper.gravity-theme input[type=search],
.contact-panel .gform_wrapper.gravity-theme input[type=tel],
.contact-panel .gform_wrapper.gravity-theme input[type=text],
.contact-panel .gform_wrapper.gravity-theme input[type=time],
.contact-panel .gform_wrapper.gravity-theme input[type=url],
.contact-panel .gform_wrapper.gravity-theme input[type=week],
.contact-panel .gform_wrapper.gravity-theme select,
.contact-panel .gform_wrapper.gravity-theme textarea {
border: 1px solid var(--color-primary-gray-medium);
background-color: var(--color-primary-white);
border-radius: 3px;
font-family: var(--font-body);
}
.contact-panel .gform_wrapper.gravity-theme .gfield .large,
.contact-panel .gform_wrapper.gravity-theme .gfield .medium,
.contact-panel .gform_wrapper.gravity-theme .gfield .small {
padding: 15px;
}
.contact-panel .gform_wrapper.gravity-theme ::placeholder,
.contact-panel .gform_wrapper.gravity-theme select {
color: var(--color-primary-gray-medium-dark);
font-family: var(--font-body);
}
.contact-panel .gform_wrapper.gravity-theme select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
padding-right: 45px;
background-image: url("data:image/svg+xml;utf8,<svg fill='%231d2b36' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
background-repeat: no-repeat;
background-position: right 10px center;
background-size: 18px;
}
.contact-panel .gform_wrapper.gravity-theme .gfield_label {
position: absolute !important;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.contact-panel .gform_validation_errors {
display: none;
}
.contact-panel .gform_wrapper.gravity-theme .gfield_validation_message, 
.contact-panel .gform_wrapper.gravity-theme .validation_message {
border: none;
padding: 0;
margin: 8px 0 0 0;
background: none;
font-size: 1.2rem;
font-weight: 500;
}
@media screen and (max-width: 1040px) {
.contact-panel .gfield_radio {
display: block;
}
} .cpt-container {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 44px 50px;
}
.cpt-post {
min-width: 0;
}
.cpt-item {
display: block;
color: var(--color-primary-white);
text-align: left;
text-decoration: none;
}
.cpt-image {
position: relative;
aspect-ratio: 1 / 1;
width: 100%;
overflow: hidden;
border-radius: 20px;
box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}
.cpt-image-bg {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
transform: scale(1);
opacity: .7;
transition: transform .45s ease, opacity .45s ease;
z-index: 0;
}
.cpt-image::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
to bottom,
rgba(0, 0, 0, 0) 38%,
rgba(0, 0, 0, .12) 56%,
rgba(0, 0, 0, .86) 100%
);
transition: background .35s ease;
z-index: 1;
}
.cpt-item:hover .cpt-image-bg,
.cpt-item:focus-visible .cpt-image-bg {
transform: scale(1.06);
opacity: 1;
}
.cpt-content {
position: absolute;
left: 30px;
right: 30px;
bottom: 30px;
z-index: 2;
}
.cpt-category {
display: inline-block;
max-width: fit-content;
padding: 7px 14px;
border-radius: 20px;
background-color: color-mix(
in srgb,
var(--color-brand-lime-primary) 78%,
transparent
);
color: var(--color-primary-white);
font-size: 1.4rem;
font-weight: 500;
line-height: 1;
margin-bottom: 2px;
}
.cpt-content h3 {
max-width: 90%;
margin: 8px 0 0 0;
color: var(--color-primary-white);
}
.cpt-item:hover .cpt-image::before {
background: linear-gradient(
to bottom,
rgba(0, 0, 0, .04) 30%,
rgba(0, 0, 0, .2) 55%,
rgba(0, 0, 0, .92) 100%
);
}
.cpt-item:focus-visible {
outline: none;
}
.cpt-item:focus-visible .cpt-image {
outline: 3px solid currentColor;
outline-offset: 4px;
}
@media screen and (max-width: 1024px) {
.cpt-image {
aspect-ratio: 1 / 1.35;
}
.cpt-content {
left: 20px;
right: 20px;
bottom: 20px;
}
}
@media screen and (max-width: 760px) {
.cpt-container {
gap: 24px;
grid-template-columns: 1fr;
}
.cpt-content {
left: 22px;
right: 22px;
bottom: 24px;
}
} .gallery-panel {
--container-width: 1440px;
--peek-width: 120px;
--row-inset: 40px;
}
.gallery-header {
position: relative;
min-width: 100%;
display: flex;
gap: 40px;
}
.gallery-arrows {
display: flex;
gap: 10px;
margin-left: auto;
}
.gallery-arrow {
width: 40px;
height: 40px;
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: var(--color-brand-blue, #0a2540);
color: var(--color-primary-white);
cursor: pointer;
}
.gallery-arrow i {
font-size: 14px;
}
.gallery-arrow:hover {
background: var(--color-brand-blue-dark, #061a2f);
}
.gallery-wrap {
padding-left: max(
40px,
calc((100% - var(--container-width)) / 2)
);
overflow: hidden;
}
.gallery-splide {
overflow: visible;
}
.gallery-splide .splide__list {
width: calc(100vw + var(--peek-width));
}
.gallery-item {
display: block;
color: var(--color-primary-white);
text-decoration: none;
}
.gallery-image {
position: relative;
aspect-ratio: 1 / 1;
width: 100%;
overflow: hidden;
border-radius: 20px;
box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}
.gallery-image-bg {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
transform: scale(1);
opacity: .7;
transition: transform .45s ease, opacity .45s ease;
z-index: 0;
}
.gallery-image::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
to bottom,
rgba(0, 0, 0, 0) 38%,
rgba(0, 0, 0, .12) 56%,
rgba(0, 0, 0, .86) 100%
);
transition: background .35s ease;
pointer-events: none;
z-index: 1;
}
.gallery-content {
position: absolute;
left: 30px;
right: 30px;
bottom: 30px;
z-index: 2;
}
.gallery-content h3 {
margin: 8px 0 0 0;
color: var(--color-primary-white);	
}
.gallery-item:hover .gallery-image-bg,
.gallery-item:focus-visible .gallery-image-bg {
transform: scale(1.06);
opacity: 1;
}
.gallery-item:hover .gallery-image::before {
background: linear-gradient(
to bottom,
rgba(0, 0, 0, .04) 30%,
rgba(0, 0, 0, .2) 55%,
rgba(0, 0, 0, .92) 100%
);
}
.gallery-item:focus-visible {
outline: none;
}
.gallery-item:focus-visible .gallery-image {
outline: 3px solid currentColor;
outline-offset: 4px;
}
@media (max-width: 1024px) {
.gallery-panel {
--peek-width: 80px;
}
.gallery-content {
left: 20px;
right: 20px;
bottom: 20px;
}
.gallery-wrap {
padding-left: max(
20px,
calc((100% - var(--container-width)) / 2)
);
}
.gallery-arrow {
width: 30px;
height: 30px;
}
.gallery-image {
position: relative;
aspect-ratio: 1 / 1.35;
}
}
@media (max-width: 640px) {
.gallery-panel {
--peek-width: 40px;
}
.gallery-header {
padding-right: 0;
}
.gallery-content {
left: 22px;
right: 22px;
bottom: 24px;
}
.gallery-content h3 {
font-size: clamp(1.5rem, 7vw, 2.2rem);
}
} .full-width-cta-panel {
position: relative;
overflow: hidden;
min-height: 420px;
}
.full-width-cta-panel > .row.inset {
position: relative;
z-index: 3;
}
.full-width-cta-wrap {
flex-direction: column;
text-align: center;
gap: 20px;
}
.full-width-cta-bg {
position: absolute;
inset: 0;
z-index: 0;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.full-width-cta-arrow-link {
display: inline-flex;
text-decoration: none;
}
.full-width-cta-arrow-link:hover,
.full-width-cta-arrow-link:focus-visible {
text-decoration: none;
}
.full-width-cta-arrow-link:focus-visible {
outline: 2px solid var(--color-primary-black);
outline-offset: 4px;
}
.full-width-cta-heading {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 1rem;
}
.full-width-cta-heading h2 {
margin: 0;
font-weight: 800;
}
.full-width-cta-wrap > h2,
.full-width-cta-wrap .btn {
opacity: 0;
}
.full-width-cta-wrap > h2 {
filter: blur(12px);
transform: translateY(35px) scale(.97);
}
.full-width-cta-wrap .btn {
transform: translateY(18px);
}
.full-width-cta-panel.is-visible .full-width-cta-wrap > h2 {
animation: fullWidthCtaHeadingReveal 1.1s cubic-bezier(.16, 1, .3, 1) forwards;
}
.full-width-cta-panel.is-visible .full-width-cta-wrap .btn {
animation: fullWidthCtaButtonReveal .7s ease-out .65s forwards;
}
@keyframes fullWidthCtaHeadingReveal {
to {
opacity: 1;
filter: blur(0);
transform: translateY(0) scale(1);
}
}
@keyframes fullWidthCtaButtonReveal {
to {
opacity: 1;
transform: translateY(0);
}
}
@media screen and (max-width: 760px) {
.full-width-cta-heading {
flex-direction: column;
gap: 1.5rem;
text-align: center;
}
}
@media (prefers-reduced-motion: reduce) {
.full-width-cta-wrap > h2,
.full-width-cta-wrap .btn {
opacity: 1;
filter: none;
transform: none;
animation: none;
}
} .logo-slider-rows {
position: relative;
overflow: hidden;
}
.logo-slider-rows::before,
.logo-slider-rows::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: 120px;
pointer-events: none;
z-index: 5;
}
.logo-slider-rows::before {
left: 0;
background: linear-gradient(
to right,
var(--color-brand-blue-primary) 0%,
transparent 100%
);
}
.logo-slider-rows::after {
right: 0;
background: linear-gradient(
to left,
var(--color-brand-blue-primary) 0%,
transparent 100%
);
}
@media screen and (max-width: 760px) {
.logo-slider-rows::before,
.logo-slider-rows::after {
width: 60px;
}
}
.logo-slider {
width: 100%;
}
.logo-slider + .logo-slider {
margin-top: 14px;
}
.logo-slider--bottom {
width: calc(100% + 75px);
margin-left: -75px;
}
.logo-slider .splide__track {
overflow: hidden;
}
.logo-slider .splide__list {
align-items: center;
}
.logo-slider .splide__slide {
height: 82px;
}
.logo-item {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 82px;
}
.logo-item img {
display: block;
width: auto;
height: auto;
max-width: 140px;
max-height: 68px;
object-fit: contain;
}
@media screen and (max-width: 760px) {
.logo-slider + .logo-slider {
margin-top: 10px;
}
.logo-slider--bottom {
width: calc(100% + 62px);
margin-left: -62px;
}
.logo-slider .splide__slide,
.logo-item {
height: 68px;
}
.logo-item img {
max-width: 115px;
max-height: 56px;
}
}
@media screen and (max-width: 500px) {
.logo-slider--bottom {
width: calc(100% + 52px);
margin-left: -52px;
}
.logo-item img {
max-width: 96px;
max-height: 48px;
}
} .hero-panel {
position: relative;
height: 50vh;
overflow: hidden;
background: linear-gradient(
to bottom,
var(--color-brand-teal-primary) 0%,
var(--color-brand-blue-primary) 100%
);
}
.hero-panel.hero-large {
height: 100vh;
padding-top: 180px;
}
.hero-panel.hero-medium,
.hero-panel.hero-small {
display: flex;
align-items: center;
height: auto;
}
.hero-panel.hero-medium {
min-height: 70vh;
padding-top: 60px;
}
.hero-panel.hero-small {
min-height: 50vh;
padding-top: 40px;
}
.hero-img {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
opacity: .8;
overflow: hidden;
z-index: 1;
}
.hero-img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
@media (min-width: 761px) {
.hero-img img {
object-fit: cover;
object-position: center top;
}
}
.hero-gradient-bottom {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 40vh;
background: linear-gradient(
to bottom,
transparent 0%,
var(--color-brand-blue-primary) 100%
);
pointer-events: none;
z-index: 2;
}
.hero-text-wrap {
position: relative;
margin-top: 120px;
z-index: 3;
}
.hero-text {
flex-direction: column;
width: 100%;
color: var(--color-primary-white);
pointer-events: none;
}
.hero-text.align-center {
align-items: center;
text-align: center;
}
.hero-text.align-left {
align-items: flex-start;
text-align: left;
}
.hero-text.align-right {
align-items: flex-end;
text-align: right;
}
.hero-text a,
.hero-text button {
pointer-events: auto;
}
.hero-text h1,
.hero-text h2 {
color: var(--color-primary-white);
text-shadow: 0 0 8px rgba(0, 0, 0, .6);
letter-spacing: -1px;
}
.hero-text h1,
.hero-text h2 {
color: var(--color-primary-white);
text-shadow: 0 0 8px rgba(0, 0, 0, .6);
letter-spacing: -1px;
}
.hero-text h1 {
opacity: 0;
filter: blur(12px);
transform: translateY(35px) scale(.97);
letter-spacing: 1px;
animation: heroHeadlineReveal 1.1s cubic-bezier(.16, 1, .3, 1) .35s forwards;
max-width: 1040px;
}
.hero-text h2 {
opacity: 0;
font-size: var(--font-h3);
font-weight: inherit;
line-height: 1.25;
transform: translateY(18px);
animation: heroCopyReveal .7s ease-out 1.05s forwards;
max-width: 1040px;
}
body.home .hero-text h1 {
max-width: 1000px;
font-size: 11rem;
line-height: 10rem;
}
body.home .hero-text h2 {
max-width: 1000px;
}
.hero-text .btn {
margin: 10px 0;
opacity: 0;
transform: translateY(18px);
animation: heroCopyReveal .7s ease-out 1.3s forwards;
}
.hero-scroll-indicator {
display: flex;
align-items: center;
justify-content: center;
margin: 0;
padding: 10px;
border: 0;
background: transparent;
color: var(--color-primary-white);
font-size: 3rem;
line-height: 1;
cursor: pointer;
opacity: 0;
transform: translateY(18px);
animation: heroCopyReveal .7s ease-out 1.55s forwards;
z-index: 4;
transition: color .4s ease;
}
.hero-scroll-indicator i {
display: block;
animation: heroArrowBounce 1.8s ease-in-out 2.25s infinite;
}
.hero-scroll-indicator:hover,
.hero-scroll-indicator:focus-visible {
color: var(--color-brand-lime-primary);
}
.hero-scroll-indicator:focus-visible {
outline: 2px solid var(--color-brand-lime-primary);
outline-offset: 4px;
}
@keyframes heroHeadlineReveal {
0% {
opacity: 0;
filter: blur(12px);
transform: translateY(35px) scale(.97);
}
60% {
opacity: 1;
filter: blur(.1px);
}
100% {
opacity: 1;
filter: blur(0);
transform: translateY(0) scale(1);
}
}
@keyframes heroCopyReveal {
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes heroArrowBounce {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(10px);
}
}
@media screen and (max-width: 1024px) {
.hero-panel.hero-large {
height: auto;
min-height: 80vh;
padding-top: 140px;
}
.hero-panel.hero-medium {
min-height: 45vh;
padding-top: 45px;
}
.hero-img {
background-attachment: scroll;
}
body.home .hero-text h1 {
font-size: 6rem;
line-height: 1;
}
.hero-scroll-indicator {
bottom: 24px;
left: 20px;
}
}
@media screen and (max-width: 760px) {
.hero-panel.hero-large {
min-height: 90vh;
padding-top: 120px;
}
.hero-panel.hero-medium {
min-height: 50vh;
padding-top: 50px;
}
.hero-text-wrap {
margin-top: 40px;
}
body.home .hero-text h1 {
font-size: 4.5rem;
}
}
@media (prefers-reduced-motion: reduce) {
.hero-text h1,
.hero-text h2,
.hero-text .btn {
opacity: 1;
filter: none;
transform: none;
animation: none;
}
.hero-img {
background-attachment: scroll;
}
.hero-scroll-indicator {
animation: none;
}
} .notfound-panel.row.full {
min-height: calc(100vh - 280px);
display: flex;
align-items: center;
text-align: left;
background: linear-gradient(to bottom, var(--color-brand-teal-primary) 0%, var(--color-brand-blue-primary) 100%);
position: relative;
overflow: hidden;
}
.notfound-panel::before {
content: "";
position: absolute;
inset: 0;
background-image: url(//heliumstudio.com/wp-content/themes/Helium2026/images/heliumstudio-logo-pattern.svg);
background-position: center;
background-repeat: repeat;
background-size: 2020px auto;
opacity: .18;
pointer-events: none;
z-index: 0;
}
.notfound-content h1 {
font-size: 20rem;
line-height: 1;
font-weight: 800;
color: var(--color-primary-white);
margin-bottom: 0;
text-shadow: 0 0 8px rgba(0, 0, 0, .6);
}
.notfound-content h2 {
color: var(--color-primary-white);
text-shadow: 0 0 8px rgba(0, 0, 0, .6);
}
.notfound-content p {
color: var(--color-primary-white);
margin-bottom: 30px;
text-shadow: 0 0 8px rgba(0, 0, 0, .6);
}
.notfound-content {
width: 100%;
}
@media screen and (max-width: 760px) {
.notfound-content h1 {
font-size: var(--font-h1);
}
} .spacer-panel.row.full {
z-index: -1;
} .table-panel .inset h2 {
width: 100%;
text-align: left;
margin-bottom: 20px;
}
.table-container {
width: 100%;
}
.table-panel .table-row {
background-color: var(--color-primary-gray-light);
padding: 40px 30px;
margin-bottom: 20px;
}
.table-panel .columns {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.col.label {
font-weight: 600;
color: var(--color-brand-blue-medium-dark);
}
.table-panel .col ul {
margin: 0;
list-style: none;
}
@media screen and (max-width: 760px) {
.table-panel .columns {
grid-template-columns: 1fr;
gap: 0;
}
.table-panel .table-row {
padding: 20px;
margin-bottom: 5px;
}
} .process-scroller-wrap {
display: grid;
grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr);
align-items: start;
gap: clamp(50px, 8vw, 140px);
width: 100%;
}
.process-intro h2 {
}
.process-intro {
position: sticky;
top: calc(var(--header-height, 100px) + 50px);
align-self: start;
font-size: var(--font-h4);
}
.process-scroller-step {
display: flex;
align-items: top;
min-height: 45vh;
}
.process-scroller-step:last-child {
min-height: 0;
padding-bottom: 60px;
}
.process-scroller-item {
position: relative;
width: 100%;
padding: 0;
display: flex;
flex-direction: row;
gap: 40px;
}
.process-number {
display: flex;
flex: 1;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
border-radius: 12px;
background-color: var(--color-brand-blue-medium);
color: var(--color-primary-white);
padding: 40px;
font-size: 2.8rem;
line-height: 1;
font-weight: 500;
}
.process-scroller-item h3 {
margin: 0 0 18px;
font-size: clamp(2rem, 3.5vw, 4rem);
font-weight: 600;
}
.process-scroller-item-copy {
font-size: var(--font-h4);
}
.process-scroller-item-copy p:last-child {
margin-bottom: 0;
} .process-scroller-item {
opacity: .22;
filter: blur(1px);
transform: translateY(28px) scale(.98);
transform-origin: left center;
transition:
opacity .65s ease,
filter .65s ease,
transform .75s cubic-bezier(.16, 1, .3, 1);
} .process-scroller-step.is-active .process-scroller-item {
opacity: 1;
filter: blur(0);
transform: translateY(0) scale(1);
}
.process-number {
transition:
background-color .5s ease,
color .5s ease,
box-shadow .5s ease,
transform .65s cubic-bezier(.16, 1, .3, 1);
}
.process-scroller-item h3,
.process-scroller-item-copy {
transition:
color .5s ease,
transform .65s cubic-bezier(.16, 1, .3, 1);
}
@media screen and (max-width: 900px) {
.process-scroller-wrap {
grid-template-columns: 1fr;
gap: 50px;
}
.process-intro {
position: relative;
top: auto;
}
.process-scroller-item {
opacity: .35;
filter: none;
transform: translateY(18px);
}
.process-scroller-step {
min-height: auto;
}
.process-scroller-item {
padding: 25px 0 25px 0;
}
}
@media screen and (max-width: 600px) {
.process-scroller-item {
padding-left: 0;
flex-direction: column;
gap: 20px;
}
.process-number {
padding: 20px;
}
}
@media (prefers-reduced-motion: reduce) {
.process-scroller-item,
.process-number,
.process-scroller-item h3,
.process-scroller-item-copy {
transition: none;
transform: none;
filter: none;
}
} .value-panels-panel {
position: relative;
overflow: hidden;
}
.value-panels-panel::before {
content: "";
position: absolute;
inset: 0;
background-image: url(//heliumstudio.com/wp-content/themes/Helium2026/images/heliumstudio-logo-pattern.svg);
background-position: center;
background-repeat: repeat;
background-size: 2020px auto;
background-attachment: fixed;
opacity: .18;
pointer-events: none;
z-index: 0;
}
.value-panels-panel > .row.inset {
position: relative;
z-index: 1;
}
.value-panels-container {
display: block;
}
.value-panels-layout {
display: grid;
grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr);
align-items: center;
gap: clamp(60px, 8vw, 140px);
width: 100%;
}
.value-panels-intro {
max-width: 640px;
}
.value-panels-intro h2 {
margin: 0;
font-size: var(--font-h2);
font-weight: 900;
line-height: .92;
}
.value-panels-intro-copy {
max-width: 560px;
margin-top: 26px;
font-size: clamp(1.35rem, 2vw, 2rem);
font-weight: 600;
line-height: 1.2;
}
.value-panels-slider-wrap {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: stretch;
gap: 28px;
min-width: 0;
}
.value-panels-slider {
width: 100%;
}
.value-panels-slider .splide__track {
overflow: hidden;
}
.value-panels-slider .splide__slide {
display: flex;
align-items: stretch;
}
.value-panel-slide {
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
min-height: 360px;
border-radius: 20px;
}
.value-panel-slide h3 {
color: inherit;
font-size: var(--font-h3);
font-weight: 800;
line-height: 1.05;
color: var(--color-brand-lime-primary);
}
.value-panel-slide-copy {
max-width: 680px;
font-size: var(--font-h4);
}
.value-panel-slide-copy p:last-child {
margin-bottom: 0;
}
.value-panel-arrow {
display: flex;
align-items: center;
justify-content: center;
width: clamp(90px, 9vw, 140px);
min-height: 100%;
padding: 0;
border: 0;
background: transparent;
color: var(--color-brand-lime-primary);
cursor: pointer;
transition: color .35s ease, transform .4s cubic-bezier(.16, 1, .3, 1);
}
.value-panel-arrow i {
font-size: clamp(2.4rem, 4vw, 4.5rem);
font-weight: 300;
transition: transform .4s cubic-bezier(.16, 1, .3, 1);
}
.value-panel-arrow:hover,
.value-panel-arrow:focus-visible {
background: transparent;
color: var(--color-primary-white);
transform: translateX(6px);
}
.value-panel-arrow:hover i,
.value-panel-arrow:focus-visible i {
transform: translateX(8px);
}
.value-panel-arrow:focus-visible {
outline: 3px solid var(--color-brand-lime-primary);
outline-offset: 5px;
}
.value-panels-pagination {
display: none;
}
@media screen and (max-width: 760px) {
.value-panels-layout {
grid-template-columns: 1fr;
align-items: start;
gap: 24px;
}
.value-panels-slider-wrap {
display: block;
width: 100%;
min-width: 0;
}
.value-panel-arrow {
display: none;
}
.value-panel-slide {
justify-content: flex-start;
min-height: 0;
padding: 18px 0 8px;
}
.value-panel-slide h3 {
margin-bottom: 10px;
}
.value-panels-pagination {
position: static;
display: flex;
align-items: left;
justify-content: flex-start;
gap: 10px;
margin: 18px 0 0;
padding: 0;
}
.value-panels-slider .splide__pagination {
position: static;
display: flex;
align-items: center;
justify-content: flex-start;
width: 100%;
gap: 10px;
margin: 18px 0 0;
padding: 0;
}
.value-panels-slider .splide__pagination__page {
width: 10px;
height: 10px;
margin: 0;
padding: 0;
border: 0;
border-radius: 50%;
background-color: rgba(255, 255, 255, .25);
opacity: 1;
cursor: pointer;
transform: none;
transition:
width .3s ease,
border-radius .3s ease,
background-color .3s ease;
}
.value-panels-slider .splide__pagination__page.is-active {
width: 28px;
border-radius: 20px;
background-color: rgba(255, 255, 255, .9);
transform: none;
}
.value-panels-slider .splide__pagination__page:focus-visible {
outline: 2px solid var(--color-brand-lime-primary);
outline-offset: 4px;
}
.value-panels-slider .splide__pagination__page {
margin: 0;
}
} .case-study-feature-panel {
position: relative;
overflow: hidden;
background-color: var(--color-brand-blue-primary);
}
.case-study-feature-bg {
position: absolute;
inset: 0;
background-image:
linear-gradient(
to right,
rgba(5, 55, 79, .88) 0%,
rgba(5, 55, 79, .72) 45%,
rgba(5, 55, 79, .88) 100%
),
var(--case-study-bg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: 0;
}
.case-study-feature-container {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
align-items: center;
gap: clamp(50px, 7vw, 120px);
min-height: 100vh;
z-index: 2;
}
.case-study-feature-frame {
position: relative;
height: min(70vh, 720px);
overflow: hidden;
background-color: var(--color-brand-blue-dark);
box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
}
.case-study-feature-image {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: auto;
will-change: transform;
}
.case-study-feature-content {
max-width: 560px;
}
.case-study-feature-content h2 {
margin: 0 0 28px;
color: var(--color-brand-lime-primary);
font-size: var(--font-h3);
font-weight: 800;
}
.case-study-deliverables {
color: var(--color-primary-white);
font-size: var(--font-h4);
line-height: 1.3;
}
.case-study-deliverables ul {
margin: 0;
padding: 0;
list-style: none;
}
.case-study-deliverables li {
position: relative;
margin-bottom: 8px;
padding-left: 20px;
list-style: none;
}
.case-study-deliverables li::before {
content: "+";
position: absolute;
top: 0;
left: 0;
color: var(--color-brand-lime-primary);
font-weight: 600;
}
@media screen and (max-width: 900px) {
.case-study-feature-container {
grid-template-columns: 1fr;
min-height: auto;
gap: 40px;
padding-top: 50px;
padding-bottom: 50px;
}
.case-study-feature-frame {
height: 110vw;
}
.case-study-feature-image {
position: relative;
transform: none !important;
}
} .split-content-container {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-areas: "content image";
align-items: start;
gap: clamp(40px, 6vw, 100px);
}
.split-content-container.image-left {
grid-template-areas: "image content";
}
.split-content-container.image-right {
grid-template-areas: "content image";
}
.split-content {
grid-area: content;
min-width: 0;
align-self: stretch;
}
.split-content-copy {
display: flex;
flex-direction: column;
height: 100%;
}
.split-content-step {
position: relative;
min-height: 65vh;
flex: 0 0 auto;
}
.split-content-step:last-child {
flex: 1 0 55vh;
min-height: 55vh;
}
.split-content-img {
grid-area: image;
min-width: 0;
overflow: hidden;
box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}
.split-content-photo {
display: block;
width: 100%;
height: auto;
}
.split-content-item {
position: sticky;
top: calc(var(--header-height, 100px) + 50px);
padding: 30px 0;
opacity: .35;
transform: translateY(30px);
transition: opacity .35s ease;
}
.split-content-item.is-active {
opacity: 1;
}
.split-content-panel .inset h2 {
width: 100%;
margin-bottom: 20px;
text-align: left;
font-size: var(--font-h3);
color: var(--color-brand-lime-primary);
}
.split-content p {
margin-bottom: 20px;
}
.split-content ul {
margin-left: 0;
padding-left: 0;
list-style: none;
}
.split-content li {
position: relative;
margin-bottom: 8px;
padding-left: 24px;
text-align: left;
}
.split-content li::before {
content: "+";
position: absolute;
top: 0;
left: 0;
font-weight: 400;
}
@media screen and (max-width: 900px) {
.split-content-container,
.split-content-container.image-left,
.split-content-container.image-right {
grid-template-columns: 1fr;
grid-template-areas:
"image"
"content";
}
.split-content-copy {
height: auto;
}
.split-content-step,
.split-content-step:last-child {
flex: none;
min-height: auto;
}
.split-content-item {
position: relative;
top: auto;
padding: 35px 0;
opacity: 1;
transform: none;
}
} .multi-column-container {
display: block;
}
.multi-column-grid {
display: grid;
gap: clamp(40px, 5vw, 80px);
width: 100%;
}
.multi-column-grid.columns-1 {
grid-template-columns: 1fr;
}
.multi-column-grid.columns-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.multi-column-grid.columns-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.multi-column-item {
min-width: 0;
}
.multi-column-item h3 {
margin: 0 0 18px;
color: var(--color-brand-lime-primary);
font-size: var(--font-h3);
}
.multi-column-copy p {
margin-bottom: 18px;
}
.multi-column-copy p:last-child {
margin-bottom: 0;
}
.multi-column-copy ul {
margin: 0;
padding: 0;
list-style: none;
}
.multi-column-copy li {
position: relative;
margin-bottom: 8px;
padding-left: 20px;
}
.multi-column-copy li::before {
content: "+";
position: absolute;
top: 0;
left: 0;
color: var(--color-brand-lime-primary);
font-weight: 600;
}
@media screen and (max-width: 900px) {
.multi-column-grid.columns-3 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 700px) {
.multi-column-grid,
.multi-column-grid.columns-2,
.multi-column-grid.columns-3 {
grid-template-columns: 1fr;
gap: 35px;
}
.multi-column-intro {
margin-bottom: 35px;
}
} .testimonial-container {
display: block;
}
.testimonial-splide {
position: relative;
}
.testimonial-splide::before,
.testimonial-splide::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: 140px;
pointer-events: none;
z-index: 5;
}
.testimonial-splide::before {
left: 0;
background: linear-gradient(
to right,
var(--color-brand-blue-dark) 0%,
transparent 100%
);
}
.testimonial-splide::after {
right: 0;
background: linear-gradient(
to left,
var(--color-brand-blue-dark) 0%,
transparent 100%
);
}
@media screen and (max-width: 760px) {
.testimonial-splide::before,
.testimonial-splide::after {
width: 60px;
}
}
.testimonial-container > h2 {
margin: 0 0 38px;
color: var(--color-brand-blue-light);
font-size: 2rem;
font-weight: 500;
line-height: 2;
}
.testimonial-splide {
width: 100%;
}
.testimonial-splide .splide__track {
overflow: hidden;
}
.testimonial-splide .splide__list {
align-items: stretch;
}
.testimonial-splide .splide__slide {
display: flex;
}
.testimonial-item {
display: flex;
flex-direction: column;
width: 100%;
min-height: 210px;
padding: 34px 30px;
border-radius: 12px;
background-color: var(--color-brand-blue-medium);
color: var(--color-primary-white);
}
.testimonial-stars {
display: flex;
gap: 7px;
margin-bottom: 24px;
font-size: 1rem;
}
.testimonial-stars i {
color: #F6C945;
}
.testimonial-credit {
margin-top: auto;
padding-top: 28px;
}
.testimonial-byline {
font-weight: 600;
margin-top: 3px;
font-size: .9rem;
opacity: .7;
}
.testimonial-controls {
display: flex;
align-items: center;
justify-content: flex-end;
margin-left: auto;
}
.testimonial-dots {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 10px;
}
.testimonial-dot {
width: 10px;
height: 10px;
margin: 0;
padding: 0;
border: 0;
border-radius: 50%;
background-color: rgba(255, 255, 255, .25);
cursor: pointer;
transition: width .3s ease, border-radius .3s ease, background-color .3s ease;
}
.testimonial-dot.is-active {
width: 28px;
border-radius: 20px;
background-color: rgba(255, 255, 255, .9);
}
.testimonial-dot:focus-visible {
outline: 2px solid var(--color-brand-lime-primary);
outline-offset: 4px;
}
@media screen and (max-width: 1024px) {
.testimonial-container {
padding-top: 50px;
padding-bottom: 50px;
}
.testimonial-item {
min-height: 290px;
padding: 30px 26px;
}
}
@media screen and (max-width: 760px) {
.testimonial-container {
padding-top: 40px;
padding-bottom: 40px;
}
.testimonial-controls {
margin-left: 0;
}
.testimonial-container > h2 {
margin-bottom: 26px;
}
.testimonial-item {
min-height: 270px;
}
} .content.row.full {
text-align: left;
}
.content-wrap {
flex-direction: column;
padding: 40px;
}
.content-wrap ul {
list-style-type: disc;
line-height: 2.4rem;
font-weight: 300;
color: var(--color-primary-gray-dark);
margin-left: 50px;
margin-bottom: 20px;
}
.content-wrap ol {
list-style-type: revert;
line-height: 2.4rem;
font-weight: 300;
color: var(--color-primary-gray-dark);
margin-left: 50px;
margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
.content-wrap {
padding: 20px;
}
} .project-single-hero {
position: relative;
display: flex;
align-items: flex-end;
min-height: 80svh;
height: auto;
padding-top: 120px;
padding-bottom: 40px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
overflow: hidden;
background-color: var(--color-brand-blue-primary);
}
.project-single-hero::before {
content: "";
position: absolute;
inset: 0;
background-color: rgba(5, 55, 79, 0.55);
pointer-events: none;
z-index: 1;
}
.project-single {
position: relative;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end;
width: 100%;
margin-top: 0;
padding-bottom: 0;
color: var(--color-primary-white);
text-align: left;
z-index: 3;
}
.project-single > .cpt-category {
width: auto;
max-width: max-content;
opacity: 0;
transform: translateY(20px);
animation: fadeSlideUp 0.6s ease-out forwards;
animation-delay: 0.4s;
text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
margin-bottom: 10px;
}
.project-single > h1 {
width: 100%;
max-width: 70%;
color: var(--color-primary-white);
text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
opacity: 0;
transform: translateY(20px);
animation: fadeSlideUp 0.6s ease-out forwards;
animation-delay: 0.6s;
}
.project-single > .project-intro {
width: 100%;
max-width: 100%;
color: var(--color-primary-white);
font-size: var(--font-h4);
text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
opacity: 0;
transform: translateY(20px);
animation: fadeSlideUp 0.6s ease-out forwards;
animation-delay: 0.9s;
}
.project-single > .project-intro-subtext {
width: 100%;
max-width: 100%;
color: var(--color-primary-white);
font-size: var(--font-h5);
text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
opacity: 0;
transform: translateY(20px);
animation: fadeSlideUp 0.6s ease-out forwards;
animation-delay: 1.2s;
margin-top: 20px;
}
@media screen and (max-width: 760px) {
.project-single-hero {
min-height: auto;
padding-top: 140px;
padding-bottom: 32px;
}
.project-single > h1,
.project-single > .project-intro {
max-width: 100%;
}
} #site-footer {
background-color: var(--color-brand-blue-dark);
}
.footer {
font-family: 'Poppins', sans-serif;
font-size: 1.4rem;
line-height: 1.9rem;
color: var(--color-primary-white);
gap: 30px;
padding: 80px 40px;
}
.footer a {
color: var(--color-primary-white);
}
.footer .col-one {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.footer-logo {
display: inline-block;
max-width: 120px;
}
.footer-logo img {
display: block;
width: 100%;
height: auto;
transform-origin: center;
transition:
transform .4s cubic-bezier(.16, 1, .3, 1),
filter .35s ease;
}
.footer-logo:hover img,
.footer-logo:focus-visible img {
transform: rotate(-4deg) scale(1.06);
filter: brightness(1.15);
}
.footer .col-two {
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-start;
margin-top: 10px;
}
.footer .col-three {
display: flex;
flex-direction: column;
justify-content: flex-start;
flex: 1;
}
.footer-nav .menu {
columns: 3;
column-gap: 2rem;
list-style: none;
padding: 0;
margin: 0;
}
.footer-nav .menu li {
break-inside: avoid;
margin: 0;
}
.footer-nav .menu li a {
transition: color 0.3s ease;
}
@media screen and (max-width: 980px) {
.footer {
flex-direction: column;
text-align: center;
margin: 20px 0;
padding: 20px;
}
.footer .col-one,
.footer .col-two {
align-items: center;
}
.footer-logo,
.footer-company {
margin-bottom: 20px;
}
.footer-nav .menu {
columns: 2;
}
.footer-nav .menu li,
.footer-contact-email,
.footer-contact-phone {
margin: 10px 0;
}
}
@media screen and (max-width: 600px) {
.footer-nav #menu-main-menu-2 {
flex-direction: column;
gap: 10px;
}
.footer-nav .menu {
columns: 1;
}
} a.btn,
#main-nav .nav-btn > a,
.gform-button-wrap .gform_button {
position: relative;
display: inline-block;
margin: 0;
padding: 16px 38px 16px 27px;
overflow: hidden;
border: 0;
border-radius: 46px;
background-color: var(--color-brand-lime-primary);
box-shadow: 0 0 8px rgba(0, 0, 0, .3);
color: var(--color-brand-blue-primary);
font-family: 'Poppins', sans-serif;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.2;
text-decoration: none;
cursor: pointer;
transition: padding-right .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s ease;
}
a.btn::after,
#main-nav .nav-btn > a::after,
.gform-button-wrap::after {
content: "\f054";
position: absolute;
top: 50%;
right: 22px;
color: var(--color-brand-blue-primary);
font-family: var(--font-icon);
font-size: .8rem;
font-weight: 500;
line-height: 1;
pointer-events: none;
transform: translateY(-50%);
transition: transform .35s cubic-bezier(.2, .7, .2, 1);
}
a.btn:hover,
a.btn:focus-visible,
#main-nav .nav-btn > a:hover,
#main-nav .nav-btn > a:focus-visible,
.gform-button-wrap:hover .gform_button,
.gform-button-wrap:focus-within .gform_button {
padding-right: 46px;
background-color: var(--color-brand-lime-primary);
color: var(--color-brand-blue-primary);
text-decoration: none;
box-shadow: 0 6px 16px rgba(0, 0, 0, .28);
}
a.btn:hover::after,
a.btn:focus-visible::after,
#main-nav .nav-btn > a:hover::after,
#main-nav .nav-btn > a:focus-visible::after,
.gform-button-wrap:hover::after,
.gform-button-wrap:focus-within::after {
transform: translateY(-50%) translateX(0px);
}
#main-nav a:focus-visible,
#mobile-nav a:focus-visible,
#footer-nav a:focus-visible,
#logo-container a:focus-visible {
outline: 1px solid rgba(255, 255, 255, .8);
outline-offset: 4px;
border-radius: 2px;
} #main-nav .nav-btn > a {
padding-top: 12px;
padding-bottom: 12px;
} .gform-button-wrap {
position: relative;
display: inline-flex;
align-items: center;
vertical-align: middle;
}
.gform-button-wrap .gform_button {
padding-right: 38px;
margin-bottom: 0;
}
.gform_wrapper.gravity-theme .gform_footer input {
margin-bottom: 0 !important;
} .print-only, .hide, .hidden { display: none !important; visibility: hidden; }
body img.gform_ajax_spinner { display: none !important; } @media print {
#site-header {display: none;}
.print-only { display: block!important; visibility: visible;}
* { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
a, a:visited { text-decoration: underline; }
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}