:root{
  --ww-navy:#0A2540;
  --foreground:213 45% 12%;
  --muted:26 55% 97.5%;
  --border:213 22% 89%;
  --ww-ease:cubic-bezier(.22,1,.36,1);
}

html{overflow-y:scroll}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,blockquote{letter-spacing:-.021em;font-variation-settings:"SOFT" 0,"WONK" 1;text-wrap:balance}
h1{letter-spacing:-.032em}
p,li{text-wrap:pretty}
::selection{background:hsl(var(--primary));color:#fff}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid hsl(var(--primary));outline-offset:3px;border-radius:8px}

section > .absolute.inset-0[aria-hidden="true"] > div{display:none !important}

main > section{position:relative;isolation:isolate}
main > section::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:repeating-linear-gradient(115deg,rgba(10,37,64,.05) 0 1px,transparent 1px 15px);
  -webkit-mask-image:radial-gradient(120% 90% at 100% 0%,#000,transparent 62%);
  mask-image:radial-gradient(120% 90% at 100% 0%,#000,transparent 62%);
}
main > section:nth-of-type(even)::before{
  -webkit-mask-image:radial-gradient(110% 90% at 0% 100%,#000,transparent 60%);
  mask-image:radial-gradient(110% 90% at 0% 100%,#000,transparent 60%);
}
main > section[style*="background:rgb(10,37,64)"]::before,
footer::before{
  background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.075) 0 1px,transparent 1px 15px);
}
main > section:first-of-type::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(62% 58% at 90% 4%,hsl(18 100% 58%/.13),transparent 68%),
    radial-gradient(48% 52% at 2% 98%,rgba(10,37,64,.07),transparent 70%);
}
@media (min-width:768px){main > section:first-of-type{min-height:82vh}}
footer{position:relative;isolation:isolate}
footer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  -webkit-mask-image:radial-gradient(90% 120% at 100% 0%,#000,transparent 65%);
  mask-image:radial-gradient(90% 120% at 100% 0%,#000,transparent 65%)}
footer > *{position:relative;z-index:1}
footer > .h-1{background:linear-gradient(90deg,hsl(18 100% 58%),hsl(28 100% 62%) 55%,hsl(18 100% 52%))!important}

header.sticky{background:#fff!important;border-bottom-color:transparent!important;transition:box-shadow .35s ease}
header.sticky.is-stuck{box-shadow:0 1px 0 rgba(10,37,64,.07),0 20px 40px -34px rgba(10,37,64,.75)}
header nav a{position:relative}
header nav[aria-label="Main navigation"] a::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;
  background:hsl(var(--primary));transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ww-ease);
}
header nav[aria-label="Main navigation"] a:hover::after{transform:scaleX(1)}
header nav[aria-label="Main navigation"] a.text-primary::after{transform:scaleX(1);opacity:.55}
header img{transition:transform .4s var(--ww-ease)}
header a:hover img{transform:scale(1.03)}

#ww-progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:60;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,hsl(18 100% 58%),hsl(28 100% 64%));pointer-events:none}

a.bg-primary,button.bg-primary{
  position:relative;overflow:hidden;
  box-shadow:0 12px 26px -14px hsl(18 100% 42%/.7);
  transition:transform .3s var(--ww-ease),box-shadow .3s var(--ww-ease),background-color .3s ease;
}
a.bg-primary::after,button.bg-primary::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent 22%,rgba(255,255,255,.34) 46%,transparent 70%);
  transform:translateX(-130%);transition:transform .75s var(--ww-ease);
}
a.bg-primary:hover::after,button.bg-primary:hover::after{transform:translateX(130%)}
a.bg-primary:hover,button.bg-primary:hover{box-shadow:0 20px 34px -16px hsl(18 100% 42%/.75)}
a.border-2:not(.border-white\/30){transition:background-color .3s ease,color .3s ease,transform .3s var(--ww-ease),border-color .3s ease}
a.border-2:not(.border-white\/30):hover{background:var(--ww-navy);color:#fff!important;border-color:var(--ww-navy)!important}
a.border-white\/30:hover{background:rgba(255,255,255,.09)}

.rounded-2xl[style*="background:rgb(10,37,64)"]{
  background:linear-gradient(158deg,#0e3055 0%,#081f36 100%)!important;
  box-shadow:0 26px 50px -32px rgba(10,37,64,.8)!important;
  transition:transform .4s var(--ww-ease),box-shadow .4s var(--ww-ease);
}
.rounded-2xl[style*="background:rgb(10,37,64)"]::after{
  content:"";position:absolute;left:26px;right:26px;top:0;height:2px;border-radius:0 0 2px 2px;
  background:hsl(var(--primary));transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ww-ease);
}
.rounded-2xl[style*="background:rgb(10,37,64)"]:hover::after{transform:scaleX(1)}
.rounded-2xl[style*="background:rgb(10,37,64)"]:hover{box-shadow:0 36px 60px -30px rgba(10,37,64,.85)!important}
.rounded-2xl[style*="background:rgb(10,37,64)"] > .rounded-lg{transition:transform .45s var(--ww-ease),box-shadow .45s var(--ww-ease);box-shadow:0 10px 22px -12px hsl(18 100% 40%/.8)}
.rounded-2xl[style*="background:rgb(10,37,64)"]:hover > .rounded-lg{transform:translateY(-2px) rotate(-4deg)}

article.group,.rounded-2xl.border{transition:transform .45s var(--ww-ease),box-shadow .45s var(--ww-ease),border-color .3s ease}
article.group img{will-change:transform}
.rounded-2xl.border:hover{border-color:hsl(18 100% 58%/.45)!important}

.w-8.h-0\.5.bg-primary{border-radius:2px;box-shadow:0 0 0 3px hsl(18 100% 58%/.12)}

@keyframes ww-rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes ww-visual-in{from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:none}}
@keyframes ww-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes ww-float-slow{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}

[data-hero] > *{animation:ww-rise .85s var(--ww-ease) both}
[data-hero] > *:nth-child(2){animation-delay:.08s}
[data-hero] > *:nth-child(3){animation-delay:.16s}
[data-hero] > *:nth-child(4){animation-delay:.24s}
[data-hero-visual]{display:block;animation:ww-visual-in 1s var(--ww-ease) .18s both;margin-top:1rem;max-width:440px}
[data-hero-visual] > div{padding:22px 0 52px!important}
[data-hero-visual] [data-float]{animation:ww-float 7s ease-in-out infinite}
[data-hero-visual] [data-float-slow]{animation:ww-float-slow 9s ease-in-out infinite .6s}

@media (max-width:1119px){
  [data-hero-grid]{display:flex;flex-direction:column}
  [data-hero]{display:contents}
  [data-hero-visual]{order:1;margin-top:.25rem}
  [data-hero] > *:last-child{order:2;margin-top:2.25rem}
}

@media (min-width:1120px){
  [data-hero-visual]{margin-top:0;max-width:none}
  [data-hero-visual] > div{padding:28px 0 64px 48px!important}
  [data-hero-grid]{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:56px;align-items:center;max-width:none!important}
  [data-hero-grid] h1{font-size:clamp(2.8rem,4.1vw,4.3rem)!important}
}

blockquote{position:relative;padding-left:26px}
blockquote::before{content:"";position:absolute;left:0;top:.25em;bottom:.25em;width:3px;border-radius:3px;background:linear-gradient(hsl(18 100% 58%),hsl(18 100% 58%/.15))}

.shadow-md,.shadow-lg,.shadow-xl{box-shadow:0 24px 48px -30px rgba(10,37,64,.55),0 2px 6px -4px rgba(10,37,64,.18)!important}
blockquote{text-wrap:pretty}
input,textarea,select{transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease}
input:focus,textarea:focus,select:focus{border-color:hsl(var(--primary))!important;box-shadow:0 0 0 4px hsl(18 100% 58%/.14)!important;outline:none!important}

@media (max-width:767px){
  #mobile-menu nav > a{min-height:44px;display:flex;align-items:center}
  #mobile-menu nav > a:last-child{justify-content:center}
  #menu-toggle{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
  #mobile-menu{background:#fff}
  input,select,textarea{font-size:16px!important}
  main > section:first-of-type{padding-top:2.5rem}
  h1{letter-spacing:-.024em}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  [data-hero] > *,[data-hero-visual]{opacity:1!important;transform:none!important}
}
