.page {
  background: var(--color-surface);
  color: var(--color-text);
  overflow: hidden;
}
.page .container {
  width: min(1180px, 100% - 2rem);
  margin: 0 auto;
}
.page h1,
.page h2,
.page h3,
.page p {
  margin: 0;
}
.page h1 {
  font-size: 3.75rem;
  line-height: 0.95em;
  font-weight: 800;
  letter-spacing: -0.05em;
}
.page h2 {
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.05em;
  font-weight: 800;
  letter-spacing: -0.035em;
}
.page p {
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  line-height: 1.65em;
}
.page img,
.page video {
  display: block;
  max-width: 100%;
  height: auto;
}
.page video {
  width: 100%;
  object-fit: cover;
  background: var(--color-background-dark);
}
.page .label {
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-neutral-700);
}
.page .btns {
  margin-top: 2rem;
}
.page .hero {
  position: relative;
  padding: 5rem 0 0;
}
.page .hero .subtitle {
  margin-top: 1.5rem;
}
.page .hero .container {
  display: grid;
  align-items: center;
  gap: 3rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .hero .container {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr);
  }
}
.page .hero .content {
  position: relative;
  z-index: 2;
}
.page .hero .bottle {
  width: min(100%, 38rem);
  justify-self: center;
  filter: drop-shadow(0 2rem 3rem rgba(0, 0, 0, 0.18));
}
.page .hero video {
  max-height: 42rem;
  width: auto;
}
.page .hero.dark, .page .hero.photo {
  background: var(--color-background-dark);
  color: var(--color-text-inverted);
}
.page .hero.dark .btn, .page .hero.photo .btn {
  background: var(--color-surface);
  color: var(--color-text);
}
.page .hero.photo {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.22)), url("../images/static/distribution-hero.jpg") center/cover;
  min-height: 34rem;
  display: flex;
  align-items: center;
}
.page .intro {
  padding: clamp(4rem, 8vw, 7rem) 0 3rem;
  text-align: center;
}
.page .intro .container {
  max-width: 800px;
}
.page .intro p:not(.label) {
  margin-top: 1rem;
}
.page .intro.dark {
  min-height: 55vh;
  display: flex;
  align-items: center;
  background: var(--color-background-dark);
  color: var(--color-text-inverted);
}
.page .benefits,
.page .steps,
.page .names,
.page .downloads,
.page .articles,
.page .gallery,
.page .questions,
.page .form-section,
.page .about,
.page .book,
.page .video,
.page .image,
.page .videos {
  padding: clamp(3rem, 7vw, 5rem) 0;
}
.page .items {
  display: grid;
  gap: 2rem;
}
@media screen and (min-width: calc(600px + 1px)) {
  .page .items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .items {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.page .item {
  text-align: center;
}
.page .item img {
  margin: 0 auto 1.25rem;
}
.page .item h2 {
  font-size: 1.15rem;
  letter-spacing: 0;
}
.page .item p {
  margin-top: 0.75rem;
  font-size: 1rem;
}
.page .video {
  color: var(--color-text);
  padding-top: 3rem;
}
.page .video .container {
  display: grid;
  align-items: center;
  gap: 3rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .video .container {
    grid-template-columns: 23rem minmax(0, 1fr);
  }
}
.page .video video {
  aspect-ratio: 9/16;
  border-radius: 1rem;
}
.page .video h2 {
  font-size: 2.75rem;
}
.page .video .subtitle {
  margin-top: 1.5rem;
}
.page .about .container,
.page .book .container {
  display: grid;
  align-items: center;
  gap: 3rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .about .container,
  .page .book .container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.page .about p,
.page .book p {
  margin-top: 1.25rem;
}
.page .book {
  background: var(--color-surface-muted);
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .book .container {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 0.9fr) minmax(0, 0.6fr);
  }
}
.page .book .cover {
  max-height: 28rem;
  width: auto;
}
.page .form-section {
  background: var(--color-surface-muted);
}
.page .form-section .container {
  display: grid;
  align-items: center;
  gap: 3rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .form-section .container {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}
.page .form {
  width: min(100%, 42rem);
  margin: 0 auto;
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--color-surface);
  border: 2px solid var(--color-border-light);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.08);
}
.page .form h1,
.page .form h2 {
  margin-bottom: 2rem;
  font-size: clamp(2rem, 4vw, 3rem);
}
.page .form .form-item {
  margin-top: 1.25rem;
}
.page .form label {
  display: block;
  margin-bottom: 0.35rem;
  font-weight: 700;
}
.page .form .input {
  display: block;
  width: 100%;
  padding: 0.9rem 1rem;
  border-radius: 0;
  border: 1px solid var(--color-border-input);
  background: var(--color-surface-input);
  font: inherit;
}
.page .form textarea {
  min-height: 9rem;
  resize: vertical;
}
.page .form .note {
  margin-top: 1rem;
  font-size: 0.9rem;
  text-align: right;
}
.page .videos .container,
.page .image .container {
  display: grid;
  gap: 2rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .videos .container,
  .page .image .container {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}
.page .videos video,
.page .videos img,
.page .image video,
.page .image img {
  height: 100%;
  max-height: 34rem;
  width: auto;
  object-fit: contain;
  border-radius: 1rem;
}
.page .steps header {
  max-width: 760px;
  margin-bottom: 2.5rem;
}
.page .steps .item {
  padding: 2rem;
  border: 1px solid var(--color-border-light);
  background: var(--color-surface);
  text-align: left;
  box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.05);
}
.page .steps .item span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 1rem;
  border-radius: 50%;
  background: var(--color-links);
  color: var(--color-text-inverted);
  font-weight: 800;
}
.page .questions .container {
  max-width: 900px;
}
.page .question {
  border-top: 1px solid var(--color-border-strong);
}
.page .question:last-child {
  border-bottom: 1px solid var(--color-border-strong);
}
.page .question summary {
  padding: 1.4rem 3rem 1.4rem 0;
  font-size: 1.15rem;
  font-weight: 800;
  cursor: pointer;
}
.page .question div {
  padding: 0 0 1.5rem;
  line-height: 1.65em;
}
.page .articles .container {
  display: grid;
  gap: 2rem;
}
.page .article {
  display: grid;
  align-items: center;
  gap: 2rem;
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .article {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr);
  }
}
.page .article img {
  width: 100%;
  border-radius: 1rem;
}
.page .download {
  display: grid;
  align-items: center;
  gap: 2rem;
  padding: 2rem 0;
  border-top: 1px solid var(--color-border-medium);
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .download {
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.45fr);
  }
}
.page .download:last-child {
  border-bottom: 1px solid var(--color-border-medium);
}
.page .download img {
  justify-self: center;
}
.page .gallery .container {
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: calc(600px + 1px)) {
  .page .gallery .container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page .gallery img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 1rem;
}
.page .names {
  background: var(--color-background-dark);
  color: var(--color-text-inverted);
}
.page .names .container {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: rgba(255, 255, 255, 0.22);
}
@media screen and (min-width: calc(900px + 1px)) {
  .page .names .container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page .name {
  padding: 1.25rem;
  background: var(--color-background-dark);
  text-align: center;
  font-weight: 800;
}

body[data-page-is-homepage] {
  padding-top: 0 !important;
}

/*# sourceMappingURL=page-home.css.map */
