heading.pcss

.h-default {
  @apply font-condensed font-medium leading-tight;
}

.h-alt {
  @apply font-alt font-normal;
  line-height: 0.96;
}

.h-allcaps {
  @apply font-condensed font-normal uppercase leading-tight;
}


@responsive {
  .head-alt-xl,
  .content-block .head-alt-xl {
    @apply text-7xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-lg,
  .content-block .head-alt-lg {
    @apply text-6xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-md,
  .content-block .head-alt-md {
    @apply text-4xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-base,
  .content-block .head-alt-base {
    @apply text-3xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-sm,
  .content-block .head-alt-sm {
    @apply text-2xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-xs,
  .content-block .head-alt-xs {
    @apply text-xl font-alt font-normal;
    line-height: 0.96;
  }

  .head-alt-2xs,
  .content-block .head-alt-2xs {
    @apply text-lg font-alt font-normal;
    line-height: 0.96;
  }



  .head-base,
  .content-block .head-base {
    @apply text-3xl font-condensed font-medium leading-tight;
  }

  .head-sm,
  .content-block .head-sm {
    @apply text-2xl font-condensed font-medium leading-tight;
  }

  .head-xs,
  .content-block .head-xs {
    @apply text-xl font-condensed font-medium leading-tight;
  }

  .head-2xs,
  .content-block .head-2xs {
    @apply text-lg font-condensed font-medium leading-tight;
  }



  .head-heavy-base,
  .content-block .head-heavy-base {
    @apply text-3xl font-condensed font-bold leading-tight;
  }

  .head-heavy-sm,
  .content-block .head-heavy-sm {
    @apply text-2xl font-condensed font-bold leading-tight;
  }

  .head-heavy-xs,
  .content-block .head-heavy-xs {
    @apply text-xl font-condensed font-bold leading-tight;
  }

  .head-heavy-2xs,
  .content-block .head-heavy-2xs {
    @apply text-lg font-condensed font-bold leading-tight;
  }



  .head-allcaps-2xs,
  .content-block .head-allcaps-2xs {
    @apply text-lg font-condensed font-normal uppercase leading-tight;
  }

  .head-allcaps-3xs,
  .content-block .head-allcaps-3xs {
    @apply text-base font-condensed font-normal uppercase leading-tight;
  }

  .head-allcaps-4xs,
  .content-block .head-allcaps-4xs {
    @apply text-sm font-condensed font-normal uppercase leading-tight;
  }




  .head-allcaps-heavy-2xs,
  .content-block .head-allcaps-heavy-2xs {
    @apply text-lg font-condensed font-bold uppercase leading-tight;
  }

  .head-allcaps-heavy-3xs,
  .content-block .head-allcaps-heavy-3xs {
    @apply text-base font-condensed font-bold uppercase leading-tight;
  }

  .head-allcaps-heavy-4xs,
  .content-block .head-allcaps-heavy-4xs {
    @apply text-sm font-condensed font-bold uppercase leading-tight;
  }
}





.header-clip {
  clip-path: polygon(0 0, 100% 0, 100% 96%, 0% 100%);
}



.head-xl {
  @apply font-alt text-base lg:text-xl font-medium leading-7 uppercase;
}

.head-2xl {
  @apply font-alt text-2xl font-medium leading-8 uppercase;
  letter-spacing: -0.01em;
}

.head-3xl {
  @apply font-alt leading-4 text-lg tracking-tight uppercase xl:text-3xl xl:leading-8;
}

.head-4xl {
  @apply font-alt text-3xl font-medium leading-7 tracking-tight uppercase mb-5 lg:leading-10 xl:text-4xl;
}

.head-6xl {
  @apply font-alt text-2xl font-medium tracking-tight uppercase xl:text-6xl;
}

.head-7xl {
  @apply font-alt text-3xl font-medium tracking-tight uppercase xl:text-7xl;
}

.head-8xl {
  @apply font-alt text-4xl font-medium tracking-tight uppercase xl:text-8xl;
}


p {
  @apply text-sm leading-6 lg:text-base;
}


.vertical-time-line {
  border-left: 1px solid green;
}