/* Kareva: shared styles (reset, header, logo, navigation, buttons, call to action, footer). */

* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
}
html {
      scroll-behavior: auto !important;
}
html,
    body {
      width: 100%;
}
body {
      overflow-x: hidden;

      background: #000;

      color: #fff;

      font-family:
        "Figtree",
        sans-serif;

      font-size: 16px;

      line-height: 1.6;

      -webkit-font-smoothing:
        antialiased;

      text-rendering:
        optimizeLegibility;
}
a {
      color: inherit;
      text-decoration: none;
}
button {
      font-family: inherit;
}
@property --kl-navy { syntax: "<color>"; inherits: true; initial-value: #f3eee4;
}
@property --kl-orange { syntax: "<color>"; inherits: true; initial-value: #e2333d;
}
@property --kl-shade-1 { syntax: "<color>"; inherits: true; initial-value: rgba(255,255,255,.22);
}
@property --kl-shade-2 { syntax: "<color>"; inherits: true; initial-value: rgba(255,255,255,.13);
}
@property --kl-shade-3 { syntax: "<color>"; inherits: true; initial-value: rgba(255,255,255,.05);
}
.brand-logo {
      --kl-interval: 5s;
}
.kl-shine {
      pointer-events: none;
}
.kl-accent-spark {
      animation: klPulse var(--kl-interval) ease-in-out infinite;
}
.kl-line {
      stroke-dasharray: 454.6;
      stroke-dashoffset: 454.6;
      animation: klDraw var(--kl-interval) cubic-bezier(.65, 0, .35, 1) infinite;
}
@keyframes klPulse {
      0%, 100% { opacity: 1; }
      50%      { opacity: .35; }
}
@keyframes klDraw {
      0%   { stroke-dashoffset: 454.6; opacity: 1; }
      30%  { stroke-dashoffset: 0; opacity: 1; }
      82%  { stroke-dashoffset: 0; opacity: 1; }
      96%  { stroke-dashoffset: 0; opacity: 0; }
      100% { stroke-dashoffset: 454.6; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .kl-shine {
        display: none;
}
  .kl-line {
        animation: none;
        stroke-dashoffset: 0;
}
  .kl-accent-spark {
        animation: none;
}
}
.cta-section {
      --cta-accent: #e2333d;

      position: relative;
      overflow: hidden;
      background: #0d0d0d;
      color: #fff;
}
.cta-glow {
      position: absolute;
      top: -14vw;
      right: -14vw;
      width: 64vw;
      height: 64vw;
      background:
        radial-gradient(
          closest-side at 45% 45%,
          rgba(255,226,170,.30),
          rgba(255,226,170,.11) 45%,
          rgba(255,226,170,0) 100%
        );
      pointer-events: none;
      animation: ctaFloat 18s ease-in-out infinite alternate;
}
.cta-glow.is-cool {
      top: auto;
      right: auto;
      bottom: -22vw;
      left: -16vw;
      width: 52vw;
      height: 52vw;
      background:
        radial-gradient(
          closest-side at 50% 50%,
          rgba(150,180,210,.16),
          rgba(150,180,210,0) 100%
        );
      animation-duration: 22s;
      animation-direction: alternate-reverse;
}
.cta-dots {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.2px);
      background-size: 34px 34px;
      -webkit-mask-image: radial-gradient(ellipse at 72% 28%, #000, transparent 68%);
      mask-image: radial-gradient(ellipse at 72% 28%, #000, transparent 68%);
}
@keyframes ctaFloat {
      from { transform: translate3d(0, 0, 0) scale(1); }
      to   { transform: translate3d(-4vw, 3vw, 0) scale(1.08); }
}
.cta-marquee {
      position: relative;
      z-index: 2;
      overflow: hidden;
      white-space: nowrap;
      border-bottom: 1px solid rgba(255,255,255,.1);
      padding: 2.2vw 0;
}
.cta-marquee-track {
      display: inline-flex;
      animation: ctaMarquee 48s linear infinite;
      will-change: transform;
}
.cta-marquee:hover .cta-marquee-track {
      animation-play-state: paused;
}
.cta-marquee-group {
      display: inline-flex;
      align-items: center;
      flex: 0 0 auto;
}
.cta-marquee-word {
      padding: 0 2.6vw;
      font-family: "Parkinsans", sans-serif;
      font-size: clamp(44px, 5.6vw, 88px);
      line-height: 1;
      letter-spacing: -.03em;
      font-weight: 400;
      color: transparent;
      -webkit-text-stroke: 1px rgba(255,255,255,.32);
      transition: color .5s ease, -webkit-text-stroke-color .5s ease;
}
.cta-marquee-word:hover {
      color: #fff;
      -webkit-text-stroke-color: #fff;
}
.cta-marquee-dot {
      width: clamp(12px, 1.3vw, 20px);
      height: clamp(12px, 1.3vw, 20px);
      border-radius: 50%;
      background: var(--cta-accent);
}
@keyframes ctaMarquee {
      from { transform: translate3d(0, 0, 0); }
      to   { transform: translate3d(-50%, 0, 0); }
}
.cta-inner {
      position: relative;
      z-index: 2;
      width: min(1480px, calc(100% - 100px));
      margin: 0 auto;
      padding: 9vw 0 10vw;
}
.cta-kicker {
      display: flex;
      align-items: center;
      gap: 18px;
      margin-bottom: 40px;
      color: rgba(255,255,255,.5);
      font-family: "Figtree", sans-serif;
      font-size: 14px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .20em;
      text-transform: uppercase;
}
.cta-kicker i {
      display: block;
      width: 54px;
      height: 1px;
      background: var(--cta-accent);
}
.cta-title {
      max-width: 1300px;
      font-family: "Parkinsans", sans-serif;
      font-size: var(--h-cta);
      line-height: .98;
      letter-spacing: -.035em;
      font-weight: var(--h-weight);
}
.cta-title span {
      color: rgba(255,255,255,.4);
}
.cta-row {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 40px;
      margin-top: 5vw;
}
.cta-text {
      max-width: 480px;
      font-family: "Figtree", sans-serif;
      font-size: 18px;
      line-height: 1.65;
      color: rgba(255,255,255,.62);
}
.cta-actions {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 22px 34px;
}
.cta-mail {
      position: relative;
      padding: 6px 0;
      color: rgba(255,255,255,.85);
      font-family: "Figtree", sans-serif;
      font-size: 18px;
      text-decoration: none;
      transition: color .3s ease;
}
.cta-mail::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 1px;
      background: currentColor;
      opacity: .45;
      transform-origin: right center;
      transition: transform .6s cubic-bezier(.2,.7,.2,1), opacity .3s ease;
}
.cta-mail:hover {
      color: #fff;
}
.cta-mail:hover::after {
      opacity: 1;
      transform: scaleX(.001);
}
.cta-mail:focus-visible {
      outline: 2px solid var(--cta-accent);
      outline-offset: 6px;
}
.site-footer {
      --ft-accent: #e2333d;

      position: relative;
      overflow: hidden;
      background: #0d0d0d;
      color: #fff;
      border-top: 1px solid rgba(255,255,255,.1);
}
.ft-container {
      width: min(1480px, calc(100% - 100px));
      margin: 0 auto;
}
.ft-top {
      display: grid;
      grid-template-columns: 1.6fr 1fr 1fr 1fr;
      gap: 60px;
      padding: 6vw 0 5vw;
}
.ft-tagline {
      max-width: 360px;
      font-family: "Figtree", sans-serif;
      font-size: 18px;
      line-height: 1.6;
      color: rgba(255,255,255,.62);
}
.ft-label {
      margin: 38px 0 14px;
      font-family: "Figtree", sans-serif;
      font-size: 14px;
      font-weight: 500;
      letter-spacing: .04em;
      color: rgba(255,255,255,.85);
}
.ft-form {
      display: flex;
      align-items: center;
      max-width: 400px;
      border-bottom: 1px solid rgba(255,255,255,.3);
      transition: border-color .4s ease;
}
.ft-form:focus-within {
      border-color: #fff;
}
.ft-form input {
      flex: 1 1 auto;
      min-width: 0;
      padding: 14px 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: #fff;
      font-family: "Figtree", sans-serif;
      font-size: 17px;
}
.ft-form input::placeholder {
      color: rgba(255,255,255,.4);
}
.ft-form button {
      flex: 0 0 auto;
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.4);
      border-radius: 50%;
      background: transparent;
      color: #fff;
      font-size: 16px;
      cursor: pointer;
      transition: background .4s ease, color .4s ease, transform .5s cubic-bezier(.34,1.56,.64,1);
}
.ft-form button:hover,
    .ft-form button:focus-visible {
      background: var(--ft-accent);
      border-color: var(--ft-accent);
      color: #fff;
      transform: rotate(45deg);
      outline: none;
}
.ft-note {
      min-height: 22px;
      margin-top: 10px;
      font-family: "Figtree", sans-serif;
      font-size: 14px;
      color: rgba(255,255,255,.55);
}
.ft-note[data-state="ok"] {
      color: #b9e2b0;
}
.ft-note[data-state="error"] {
      color: #ff8f96;
}
.ft-col h4 {
      margin-bottom: 22px;
      color: rgba(255,255,255,.45);
      font-family: "Figtree", sans-serif;
      font-size: 13px;
      font-weight: 500;
      letter-spacing: .2em;
      text-transform: uppercase;
}
.ft-col ul {
      list-style: none;
}
.ft-col a {
      position: relative;
      display: inline-block;
      padding: 7px 0;
      color: rgba(255,255,255,.72);
      font-family: "Figtree", sans-serif;
      font-size: 17px;
      line-height: 1.3;
      text-decoration: none;
      transition: color .3s ease, transform .5s cubic-bezier(.2,.7,.2,1);
}
.ft-col a::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 3px;
      width: 100%;
      height: 1px;
      background: currentColor;
      transform: scaleX(0);
      transform-origin: left center;
      transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.ft-col a:hover,
    .ft-col a:focus-visible {
      color: #fff;
      transform: translateX(6px);
      outline: none;
}
.ft-col a:hover::after,
    .ft-col a:focus-visible::after {
      transform: scaleX(1);
}
.ft-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 16px 30px;
      padding: 26px 0;
      border-top: 1px solid rgba(255,255,255,.1);
      color: rgba(255,255,255,.45);
      font-family: "Figtree", sans-serif;
      font-size: 14px;
}
.ft-legal {
      display: flex;
      gap: 26px;
}
.ft-legal a,
    .ft-top-btn {
      color: rgba(255,255,255,.6);
      text-decoration: none;
      transition: color .3s ease;
}
.ft-legal a:hover,
    .ft-top-btn:hover {
      color: #fff;
}
.ft-top-btn {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 0;
      border: 0;
      background: none;
      font: inherit;
      cursor: pointer;
}
.ft-top-btn span {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.3);
      border-radius: 50%;
      transition: transform .5s cubic-bezier(.34,1.56,.64,1), background .3s ease, color .3s ease;
}
.ft-top-btn:hover span {
      background: var(--ft-accent);
      border-color: var(--ft-accent);
      color: #fff;
      transform: translateY(-4px);
}
.ft-wordmark {
      padding: 1.6vw clamp(14px, 2vw, 32px) 0;
      line-height: 0;
}
.ft-wordmark svg {
      display: block;
      width: 100%;
      height: auto;
      overflow: hidden;
      max-width: 1600px;
      margin: 0 auto;
}
@media (prefers-reduced-motion: reduce) {
  .cta-glow,
      .cta-marquee-track {
        animation: none;
}
}
@media (max-width: 1100px) {
  .ft-top {
        grid-template-columns: 1fr 1fr 1fr;
}
  .ft-brand {
        grid-column: 1 / -1;
}
}
@media (max-width: 900px) {
  .cta-row {
        align-items: flex-start;
        flex-direction: column;
        margin-top: 8vw;
}
  .cta-inner {
        padding: 14vw 0;
}
  .ft-top {
        gap: 40px 30px;
        padding: 12vw 0 10vw;
}
}
@media (max-width: 560px) {
  .cta-title {
        font-size: var(--h-cta);
}
  .ft-top {
        grid-template-columns: 1fr 1fr;
}
}
.btn {
      --btn-bg: #fff;
      --btn-fg: #0d0d0d;
      --btn-hover-bg: #f6ecd4;
      --btn-icon-bg: #0d0d0d;
      --btn-icon-fg: #fff;
      --btn-accent: #e2333d;
      --btn-ring: rgba(255,255,255,.08);
      --btn-glow: rgba(255,226,170,.5);
      --btn-border: transparent;

      --btn-icon: 56px;
      --btn-pad: 5px;
      --btn-padl: 36px;
      --btn-fs: 18px;
      --btn-gap: 22px;

      position: relative;
      display: inline-flex;
      align-items: center;
      gap: var(--btn-gap);
      padding: var(--btn-pad) var(--btn-pad) var(--btn-pad) var(--btn-padl);
      border: 0;
      border-radius: 999px;
      background: var(--btn-bg);
      color: var(--btn-fg);
      font-family: "Figtree", sans-serif;
      font-size: var(--btn-fs);
      font-weight: 500;
      line-height: 1.1;
      letter-spacing: 0;
      text-transform: none;
      text-decoration: none;
      white-space: nowrap;
      cursor: pointer;
      box-shadow: inset 0 0 0 1px var(--btn-border);
      transition:
        background .4s ease,
        color .4s ease,
        box-shadow .5s ease,
        translate .5s cubic-bezier(.2,.7,.2,1);
}
.btn-icon {
      flex: 0 0 auto;
      width: var(--btn-icon);
      height: var(--btn-icon);
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: var(--btn-icon-bg);
      color: var(--btn-icon-fg);
      font-size: max(13px, calc(var(--btn-icon) * .36));
      line-height: 1;
      transition:
        transform .6s cubic-bezier(.34,1.56,.64,1),
        background .4s ease,
        color .4s ease;
}
.btn:focus-visible {
      outline: 2px solid var(--btn-accent);
      outline-offset: 5px;
}
.btn--dark {
      --btn-bg: #161513;
      --btn-fg: #fff;
      --btn-hover-bg: #2b2825;
      --btn-icon-bg: #fff;
      --btn-icon-fg: #161513;
      --btn-ring: rgba(22,21,19,.08);
      --btn-glow: rgba(22,21,19,.4);
}
.btn--ghost {
      --btn-bg: rgba(255,255,255,.06);
      --btn-fg: #fff;
      --btn-hover-bg: rgba(255,255,255,.14);
      --btn-border: rgba(255,255,255,.34);
      --btn-icon-bg: rgba(255,255,255,.14);
      --btn-icon-fg: #fff;
      --btn-ring: rgba(255,255,255,.05);
      --btn-glow: rgba(255,255,255,.14);
      -webkit-backdrop-filter: blur(10px);
      backdrop-filter: blur(10px);
}
.btn--md {
      --btn-icon: 46px;
      --btn-pad: 3px;
      --btn-padl: 28px;
      --btn-fs: 16px;
      --btn-gap: 18px;
}
.btn--sm {
      --btn-icon: 34px;
      --btn-pad: 2px;
      --btn-padl: 20px;
      --btn-fs: 15px;
      --btn-gap: 12px;
}
@media (max-width: 560px) {
  .btn:not(.btn--md):not(.btn--sm) {
        --btn-padl: 28px;
        --btn-fs: 17px;
}
}
:root {
      --h2: clamp(36px, 4.2vw, 68px);
      --h-cta: clamp(40px, 5vw, 84px);
      --h-weight: 600;
}
@media (max-width: 560px) {
  :root {
        --h2: 10vw;
        --h-cta: 11vw;
}
}
.mobile-nav {
      position: fixed;
      inset: 0;
      z-index: 999;
      display: flex;
      flex-direction: column;
      justify-content: center;
      background: #0d0d0d;
      clip-path: circle(0px at 100% 0%);
      pointer-events: none;
      -webkit-user-select: none;
      user-select: none;
}
.mobile-nav.is-open {
      pointer-events: auto;
}
.mobile-nav-list {
      list-style: none;
      padding: 0 clamp(28px, 9vw, 64px);
}
.mobile-nav-item {
      position: relative;
      display: flex;
      align-items: baseline;
      gap: 22px;
      padding: 12px 0;
      opacity: 0;
      transform: translateX(-64px);
}
.mobile-nav-num {
      font-family: "Figtree", sans-serif;
      font-size: 15px;
      font-weight: 600;
      color: rgba(226,51,61,.7);
      letter-spacing: .04em;
}
.mobile-nav-item a {
      display: inline-block;
      font-family: "Parkinsans", sans-serif;
      font-weight: 700;
      font-size: clamp(38px, 12vw, 64px);
      line-height: 1.05;
      letter-spacing: -.02em;
      color: rgba(247,244,233,.4);
      text-decoration: none;
      transition: color .3s ease;
}
.mobile-nav-item::before {
      content: "";
      position: absolute;
      left: -30px;
      top: 50%;
      width: 20px;
      height: 3px;
      border-radius: 3px;
      background: #e2333d;
      opacity: 0;
      transform: translateY(-50%) translateX(-10px);
      transition: opacity .25s ease, transform .25s ease;
      pointer-events: none;
}
.mobile-nav-item:hover::before,
    .mobile-nav-item:focus-within::before {
      opacity: 1;
      transform: translateY(-50%) translateX(0);
}
.mobile-nav-item:hover a,
    .mobile-nav-item:focus-within a {
      color: #f7f4ed;
}
.mobile-nav-item a:focus-visible {
      outline: 2px solid #e2333d;
      outline-offset: 6px;
}
.mobile-nav-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 20px;
      margin-top: clamp(36px, 7vw, 60px);
      padding: 0 clamp(28px, 9vw, 64px);
      opacity: 0;
}
.mobile-nav-mail {
      color: rgba(247,244,233,.55);
      font-family: "Figtree", sans-serif;
      font-size: 15px;
      text-decoration: none;
      border-bottom: 1px solid rgba(247,244,233,.25);
      transition: color .3s ease, border-color .3s ease;
}
.mobile-nav-mail:hover {
      color: #f7f4ed;
      border-color: #f7f4ed;
}
@media (prefers-reduced-motion: reduce) {
  .mobile-nav {
        transition: clip-path .01s linear;
}
  .mobile-nav-item,
      .mobile-nav-foot {
        transition: opacity .01s linear;
}
}
.mobile-nav-item a,
    .btn {
      font-family: "Parkinsans", sans-serif;
      letter-spacing: -.005em;
}
.btn {
      font-weight: 500;
}
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 3000;
  padding: 12px 18px;
  border-radius: 10px;
  background: #fff;
  color: #161513;
  font: 500 15px/1 "Figtree", sans-serif;
  transition: top .25s ease;
}
.skip-link:focus {
  top: 16px;
}
.screen-reader-text,
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
body.admin-bar .site-header {
  top: 32px;
}
body.admin-bar .mobile-nav {
  top: 32px;
}
@media screen and (max-width: 782px) {
  body.admin-bar .site-header,
  body.admin-bar .mobile-nav {
    top: 46px;
}
}
@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed !important;
}
}

/* arrow icon (drawn, so iPhones don't turn "↗" into a blue emoji) */
.kv-arrow {
  display: inline-block;
  width: .9em;
  height: .9em;
  vertical-align: -.08em;
  flex: 0 0 auto;
}

.btn-icon .kv-arrow {
  width: 1em;
  height: 1em;
  vertical-align: middle;
}

/* footer: labelled email addresses (Sales / Support / Careers) */
.ft-mail {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}

.ft-mail-label {
  margin-top: 4px;
  color: rgba(255, 255, 255, .4);
  font-family: "Figtree", sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.ft-mail a {
  padding-top: 3px;
}

/* phones: the Connect column takes the full row so addresses never break */
@media (max-width: 560px) {
  .ft-top > .ft-col:last-child {
    grid-column: 1 / -1;
  }

  .ft-mail a,
  .ft-col:last-child a {
    white-space: nowrap;
  }
}