@layer sections {
  .lgbt {
    --lgbt-text-1: #e3decf;
    --lgbt-text-2: #c9c7b6;
    --lgbt-gold-1: #d2ad69;
    --lgbt-gold-3: #a9874b;
    --lgbt-gold-grad: linear-gradient(
      180deg,
      #d8b470 0%,
      #d2ad69 22%,
      #c09b58 40%,
      #a9874b 56%,
      #7e6e43 70%,
      rgba(51, 58, 87, 0.8) 80%,
      rgba(36, 42, 66, 0.4) 100%
    );
    --lgbt-ease: cubic-bezier(0.2, 0.75, 0.2, 1);
    --lgbt-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    position: relative;
    color: var(--c-cream-soft);
    font-family: var(--ff-garamond);
    line-height: normal;
    scroll-margin-top: calc(-1 * (var(--nav-h) + var(--space-md)));
  }
  .lgbt-stage {
    position: relative;
    height: 100vh;
    height: 100svh;
    min-height: 600px;
    overflow: hidden;
    isolation: isolate;
    background: var(--c-green-deep);
  }
  .lgbt-stage.is-open {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
  }
  .lgbt-scene {
    position: absolute;
    inset: 0;
    background: radial-gradient(
      120% 90% at 50% 40%,
      #272f50 0%,
      var(--c-green-deep) 50%,
      var(--c-green-night) 100%
    );
  }
  .lgbt-scene:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--lgbt-noise);
    opacity: 0.09;
    mix-blend-mode: overlay;
  }
  .lgbt-panel {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    max-width: none;
    pointer-events: none;
    overflow: visible;
  }
  .lgbt-panel .lgbt-ln {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .lgbt-panel .lgbt-glow .lgbt-ln {
    stroke: #fff4e0;
    stroke-width: 4.2;
  }
  .lgbt-panel .lgbt-crisp .lgbt-ln {
    stroke: url(#lgbt-line-grad);
    stroke-width: 1.9;
  }
  .lgbt-hand {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    pointer-events: none;
    will-change: transform, opacity, filter;
  }
  .lgbt-hand__float {
    animation: lgbt-float-a 7.5s ease-in-out infinite;
  }
  .lgbt-hand--2 .lgbt-hand__float {
    animation-name: lgbt-float-b;
    animation-delay: -2.2s;
  }
  @keyframes lgbt-float-a {
    0%,
    to {
      transform: translate(0);
    }
    50% {
      transform: translate(calc(var(--amp, 7px) * -1));
    }
  }
  @keyframes lgbt-float-b {
    0%,
    to {
      transform: translate(0);
    }
    50% {
      transform: translate(var(--amp, 7px));
    }
  }
  .lgbt-hand img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    filter: drop-shadow(0 26px 34px rgba(3, 5, 15, 0.5))
      drop-shadow(0 4px 8px rgba(3, 5, 15, 0.25));
  }
  .lgbt-logo {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
    display: none;
    max-width: none;
    pointer-events: none;
    overflow: visible;
    filter: drop-shadow(0 0 8px rgba(255, 240, 210, 0.22));
    transition: filter 1s var(--lgbt-ease);
  }
  .lgbt-logo.lit {
    filter: drop-shadow(0 0 16px rgba(255, 214, 170, 0.7))
      drop-shadow(0 0 34px rgba(160, 140, 255, 0.35)) brightness(1.12);
  }
  .lgbt-logo-halo {
    position: absolute;
    z-index: 1;
    display: none;
    width: 190px;
    height: 190px;
    margin: -95px 0 0 -95px;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(closest-side, #ecd6a033, #ecd6a000);
    animation: lgbt-breathe 4.5s ease-in-out infinite;
  }
  .lgbt-content {
    position: absolute;
    left: 0;
    right: 0;
    top: var(--ty, 40%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 16px;
  }
  .lgbt-stage.is-open .lgbt-content {
    position: relative;
    top: auto;
    padding: clamp(72px, 13vh, 136px) 24px clamp(72px, 11vh, 120px);
  }
  .lgbt-title {
    --gs: clamp(48px, 5.3vw, 104px);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    will-change: transform;
  }
  .lgbt-title:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: -1;
    width: 140%;
    height: 340%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    background: radial-gradient(closest-side, #d6be8221, #d6be8200);
    animation: lgbt-breathe 7s ease-in-out infinite;
  }
  @keyframes lgbt-breathe {
    0%,
    to {
      opacity: 0.7;
    }
    50% {
      opacity: 1;
    }
  }
  .lgbt-gold {
    display: block;
    font-family: var(--ff-garamond);
    font-weight: 500;
    font-size: var(--gs);
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    padding-left: 0.06em;
    color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(
        100deg,
        #fff6de00 40%,
        #fff6def2,
        #fff6de00 60%
      ),
      var(--lgbt-gold-grad);
    background-size:
      300% 100%,
      100% 100%;
    background-position:
      100% 0,
      0 0;
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
  }
  .lgbt-gold.glint {
    animation: lgbt-glint 1.5s cubic-bezier(0.45, 0, 0.25, 1);
  }
  @keyframes lgbt-glint {
    0% {
      background-position:
        100% 0,
        0 0;
    }
    to {
      background-position:
        0% 0,
        0 0;
    }
  }
  .lgbt-sub {
    display: block;
    position: relative;
    margin-top: calc(var(--gs) * -0.21);
    font-family: var(--ff-garamond);
    font-weight: 500;
    font-size: calc(var(--gs) * 0.3);
    line-height: 1.1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    padding-left: 0.08em;
    color: var(--c-cream-soft);
    text-shadow: 0 2px 14px rgba(10, 14, 28, 0.75);
  }
  .lgbt-text {
    display: none;
    width: min(640px, 100%);
    margin-top: clamp(40px, 7vh, 76px);
    text-align: left;
  }
  .lgbt-text:focus {
    outline: none;
  }
  .lgbt-stage.is-open .lgbt-text {
    display: block;
  }
  .lgbt-lead {
    font-size: clamp(20px, 1.7vw, 25px);
    font-weight: 500;
    line-height: 1.5;
    color: var(--lgbt-text-1);
  }
  .lgbt-body {
    margin-top: 1.4em;
    font-size: clamp(17px, 1.36vw, 20px);
    font-weight: 500;
    line-height: 1.72;
    color: var(--lgbt-text-2);
  }
  .lgbt-lead + .lgbt-body {
    margin-top: 1.5em;
  }
  .lgbt-closing {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: clamp(40px, 6vh, 64px);
    text-align: center;
  }
  .lgbt-closing i {
    display: block;
    width: 46px;
    height: 1px;
    background: linear-gradient(
      90deg,
      var(--lgbt-gold-3),
      var(--lgbt-gold-1),
      var(--lgbt-gold-3)
    );
  }
  .lgbt-closing p {
    margin-top: 24px;
    max-width: 22em;
    font-style: italic;
    font-weight: 400;
    font-size: clamp(22px, 2vw, 29px);
    line-height: 1.35;
    color: var(--c-cream-soft);
  }
  .lgbt-rv {
    opacity: 0;
    transform: translateY(18px);
    transition:
      opacity 0.9s var(--lgbt-ease),
      transform 1s var(--lgbt-ease);
  }
  .lgbt-stage.is-in .lgbt-rv {
    opacity: 1;
    transform: none;
    transition-delay: calc(var(--d, 0) * 0.11s);
  }
  .lgbt-closing i {
    transform: scaleX(0);
    transition: transform 0.9s var(--lgbt-ease);
  }
  .lgbt-stage.is-in .lgbt-closing i {
    transform: scaleX(1);
    transition-delay: 0.7s;
  }
  .lgbt-spark {
    position: absolute;
    z-index: 5;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(
      closest-side,
      #fffbef,
      #f0d6a099 45%,
      #f0d6a000
    );
  }
  .lgbt-spark.go {
    animation: lgbt-spark 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
  }
  @keyframes lgbt-spark {
    0% {
      opacity: 0;
      transform: scale(0.2);
    }
    18% {
      opacity: 1;
      transform: scale(1.4);
    }
    to {
      opacity: 0;
      transform: scale(9);
    }
  }
  .lgbt-cta {
    position: absolute;
    left: 50%;
    bottom: clamp(26px, 6vh, 60px);
    z-index: 6;
    transform: translate(-50%);
    transition:
      opacity 0.5s var(--lgbt-ease),
      transform 0.5s var(--lgbt-ease);
  }
  .lgbt-cta.off {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%) translateY(10px);
  }
  .lgbt-back-wrap {
    display: flex;
    justify-content: center;
    margin-top: clamp(40px, 6vh, 64px);
  }
  @media (max-width: 759.98px) {
    .lgbt-title {
      --gs: min(11.6vw, 52px);
    }
    .lgbt-gold {
      letter-spacing: 0.035em;
      padding-left: 0.035em;
    }
    .lgbt-sub {
      font-size: calc(var(--gs) * 0.33);
      letter-spacing: 0.07em;
      margin-top: calc(var(--gs) * -0.17);
    }
    .lgbt-hand {
      --amp: 2px;
    }
    .lgbt-logo,
    .lgbt-logo-halo {
      display: block;
    }
    .lgbt-stage.is-open .lgbt-content {
      padding: 92px 34px 84px;
    }
    .lgbt-lead {
      font-size: 20px;
    }
    .lgbt-body {
      font-size: 17.5px;
      line-height: 1.66;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .lgbt-hand__float,
    .lgbt-title:before,
    .lgbt-logo-halo {
      animation: none;
    }
  }
  html:not(.js) .lgbt-stage {
    height: auto;
  }
  html:not(.js) .lgbt-hand,
  html:not(.js) .lgbt-logo,
  html:not(.js) .lgbt-logo-halo,
  html:not(.js) .lgbt-cta,
  html:not(.js) .lgbt-back-wrap,
  html:not(.js) .lgbt-panel {
    display: none;
  }
  html:not(.js) .lgbt-content {
    position: relative;
    top: auto;
    padding: clamp(72px, 13vh, 136px) 24px clamp(72px, 11vh, 120px);
  }
  html:not(.js) .lgbt-text {
    display: block;
  }
  html:not(.js) .lgbt-rv {
    opacity: 1;
    transform: none;
  }
  html:not(.js) .lgbt-closing i {
    transform: none;
  }
}