header{
      position:relative;
      height:100vh;
      min-height:520px;
      overflow:hidden;
      background:#0f1c26;
    }

    .text-brand-yellow {
    --tw-text-opacity: 1;
    color: rgb(242 226 5 / var(--tw-text-opacity, 1));
}

.bg-brand-yellow {
    --tw-bg-opacity: 1;
    background-color: rgb(242 226 5 / var(--tw-bg-opacity, 1));
}

.text-navy {
    --tw-text-opacity: 1;
    color: rgb(15 28 39 / var(--tw-text-opacity, 1));
}

.before\:bg-brand-yellow::before {
    content: var(--tw-content);
    --tw-bg-opacity: 1;
    background-color: rgb(242 226 5 / var(--tw-bg-opacity, 1));
}

    canvas{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      display:block;
    }

    .overlay{
      position:absolute;
      inset:0;              
      z-index:2;

      max-width:1280px;
      margin:0 auto;

      padding: clamp(24px, 5vw, 60px);
      padding-top: clamp(32px, 6vw, 90px);

      //pointer-events:none;
    }

    h1{
      margin:0 0 12px 0;
      font-size: clamp(28px, 3.8vw, 48px);
      line-height:1.15;
      letter-spacing:-.02em;
    }

    p{
      margin:0;
      max-width:90ch;
      opacity:.9;
      font-size: clamp(15px, 1.4vw, 19px);
    }

    .logo{
      position:absolute;
      right:0;         
      bottom:50px;     
      z-index:3;
      pointer-events:auto;
    }

    .logo img{
      height:70px;
      width:auto;
      display:block;
    }