@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  scroll-behavior: smooth;
  overflow: hidden;
}

body.public {
  perspective: 3px;
  perspective-origin: center;
  transform-style: preserve-3d;
  overflow-x: hidden;
  overflow-y: auto;
}

header.public {
  perspective: inherit;
  perspective-origin: inherit;
  transform-style: inherit;
}

.public-header-img {
  transform: translateZ(-1px) scale(2.1);
}

.public-header-title {
  font-size: calc(5.98vw + 1rem);
}

main.public {
  perspective: inherit;
  perspective-origin: inherit;
  transform-style: inherit;
}

.section-title {
  font-size: calc(1.6vw + 1rem);
}

.section-title[contenteditable="true"] {
  @apply shadow-input shadow-primary outline-0
}

.section-description {
  font-size: calc(1vw + .8rem);
}

.section-paragraph div {
  @apply mb-3 last:mb-0
}

.section-paragraph[contenteditable="true"] {
  @apply shadow-input shadow-primary outline-0
}

.mask-right {
  mask-image: linear-gradient(90deg, black, rgba(0,0,0,.8), transparent);
}