:root {
  --brand-white: #ffffff;
  --brand-black: #080808;
  --brand-pink: #f766a4;
  --brand-pink-hover: #e05b95;
  --brand-light-blue: #0193ea;
  --brand-light-blue-hover: #0384ce;
  --brand-yellow: #fbe038;
  --font-scale-max: 1.8;

  /* Spacing */
  --spacing-y-axis: clamp(50px, 6vw, 100px);
  --spacing-x-axis: clamp(20px, 5.2vw, 100px);

  /* Gap spacing */
  --g-01: clamp(15px, 3vw, 20px);
  --g-02: clamp(20px, 3vw, 40px);
  --g-03: clamp(30px, 4vw, 60px);
  --g-04: clamp(40px, 4vw, 80px);
  --g-05: clamp(50px, 5.2vw, 100px);
}

.text-balance {
  text-wrap: balance;
}

.text-nowrap {
  text-wrap: nowrap;
}

.textUppercase {
  text-transform: uppercase;
}

/* =====================
   Font Weight Utilities
========================*/

.font-400 {
  font-weight: 400;
}
.font-500 {
  font-weight: 500;
}
.font-600 {
  font-weight: 600;
}
.font-700 {
  font-weight: 700;
}
.font-800 {
  font-weight: 800;
}

/* ===========
   Transitions
==============*/

svg,
span,
a,
button {
  transition-duration: 0.1s;
}

/* =====================
   Gap spacing Utilities
========================*/

/* Gap col & row */
.gap-sm {
  gap: var(--g-01) !important;
}

.gap-md {
  gap: var(--g-02) !important;
}

.gap-lg {
  gap: var(--g-03) !important;
}

.gap-xl {
  gap: var(--g-04) !important;
}

.gap-2xl {
  gap: var(--g-05) !important;
}

/* Gap col */
.col-gap-sm {
  column-gap: var(--g-01) !important;
}

.col-gap-md {
  column-gap: var(--g-02) !important;
}

.col-gap-lg {
  column-gap: var(--g-03) !important;
}

.col-gap-xl {
  column-gap: var(--g-04) !important;
}

.col-gap-2xl {
  column-gap: var(--g-05) !important;
}

/* Gap row */
.row-gap-sm {
  row-gap: var(--g-01) !important;
}

.row-gap-md {
  row-gap: var(--g-02) !important;
}

.row-gap-lg {
  row-gap: var(--g-03) !important;
}

.row-gap-xl {
  row-gap: var(--g-04) !important;
}

.row-gap-2xl {
  row-gap: var(--g-05) !important;
}

/* =================
   Spacing Utilities
====================*/

.padding-y {
  padding-top: var(--spacing-y-axis);
  padding-bottom: var(--spacing-y-axis);
}

.padding-x {
  padding-right: var(--spacing-x-axis);
  padding-left: var(--spacing-x-axis);
}

.padding-left-x {
  padding-left: var(--spacing-x-axis);
}
.padding-right-x {
  padding-right: var(--spacing-x-axis);
}
.padding-top-y {
  padding-top: var(--spacing-y-axis);
}
.padding-bottom-y {
  padding-bottom: var(--spacing-y-axis);
}

.padding-top-y-lg {
  padding-top: var(--spacing-y-axis-lg) !important;
}
.padding-bottom-y-lg {
  padding-bottom: var(--spacing-y-axis-lg) !important;
}
.padding-top-y-sm {
  padding-top: var(--spacing-y-axis-sm) !important;
}
.padding-bottom-y-sm {
  padding-bottom: var(--spacing-y-axis-sm) !important;
}

.group-spacing-small,
.wp-block-group.group-spacing-small {
  padding: clamp(20px, 4vw, 50px) !important;
}

/* ==================
   Background colours
=====================*/

.bgWhite {
  background-color: var(--brand-white);
}

.bgBlack {
  background-color: var(--brand-black);
}

.bgPink {
  background-color: var(--brand-pink);
}

.bgLightBlue {
  background-color: var(--brand-light-blue);
}

.bgYellow {
  background-color: var(--brand-yellow);
}

/* ============
   Text Colours
===============*/

.textShadowSharp {
  text-shadow: 3px 4px 0px black;
}

.textWhite {
  color: var(--brand-white);
}

.textBlack {
  color: var(--brand-black);
}

.textPink {
  color: var(--brand-pink);
}

.textLightBlue {
  color: var(--brand-light-blue);
}

.textYellow {
  color: var(--brand-yellow);
}

/* ============
   Buttons
===============*/

section .btn {
  padding: clamp(7px, 1.5vw, 14px) clamp(15px, 3vw, 30px);
  max-width: fit-content;
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  border-width: 2px;
  border-style: solid;
  border-radius: 10px;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25);
  transform: rotate(-1deg);
}

section .btn > span {
  text-wrap: nowrap;
}

section .btn > span:not(.btnIcon) {
  font-size: var(--body-font);
}

section .btn-sm {
  padding: clamp(6px, 1.5vw, 8px) clamp(10px, 3vw, 20px);
}

section .btn-sm > span:not(.btnIcon) {
  font-size: var(--body-font-sm);
}

section .btn-lg {
  padding: clamp(8px, 1.5vw, 16px) clamp(20px, 3vw, 40px);
}

section .btn-lg > span:not(.btnIcon) {
  font-size: var(--fs-h5);
}

.solidLightBlueBtn {
  background-color: var(--brand-light-blue);
}

.solidLightBlueBtn span {
  color: white;
}

.solidLightBlueBtn:hover {
  background-color: var(--brand-light-blue-hover);
}

.solidPinkBtn {
  background-color: var(--brand-pink) !important;
  position: relative;
  gap: 0;
  padding: 0;
  border: 3px solid var(--brand-black) !important;
  border-radius: 0 !important;
  box-shadow: 6px 6px 0px var(--brand-black) !important;
  transform: rotate(-1deg) translate3d(0, 0, 0);
  overflow: hidden;
  transition:
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 260ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 180ms ease;
  animation: solidPinkBtnAttentionLoop 3s cubic-bezier(0.22, 1, 0.36, 1)
    infinite;
}

.solidPinkBtn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 0%,
    transparent 38%,
    rgb(255 255 255 / 0.2) 49%,
    transparent 60%,
    transparent 100%
  );
  opacity: 0;
  transform: translate3d(-10%, 0, 0);
  transition:
    opacity 220ms ease,
    transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.homepageLayout > section:nth-of-type(2) .solidPinkBtn {
  animation-delay: 0.8s;
}

.homepageLayout > section:nth-of-type(3) .solidPinkBtn {
  animation-delay: 2.4s;
}

.homepageLayout > section:nth-of-type(5) .solidPinkBtn {
  animation-delay: 4s;
}

.solidPinkBtn .btnLabel,
.solidPinkBtn > span:not(.btnIcon) {
  position: relative;
  z-index: 1;
  color: var(--brand-black);
  line-height: 0.95;
  letter-spacing: -0.04em;
}

.solidPinkBtn .btnLabel {
  display: inline-flex;
  align-items: center;
  padding: clamp(10px, 1.5vw, 18px) clamp(20px, 3vw, 34px);
}

.solidPinkBtn .btnIcon {
  display: grid;
  place-items: center;
  min-width: clamp(3rem, 6vw, 4.6rem);
  padding: clamp(10px, 1.5vw, 18px) clamp(12px, 2vw, 18px);
  border-left: 3px solid var(--brand-black);
  color: var(--brand-black);
  font-size: clamp(1.75rem, 3vw, 2.3rem);
  line-height: 1;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.solidPinkBtn .btnIcon i {
  transform: scale(1.08);
  transform-origin: center;
}

.btn.solidPinkBtn:hover {
  background-color: var(--brand-pink-hover) !important;
  box-shadow: 8px 8px 0px var(--brand-black) !important;
  transform: rotate(-0.35deg) translate3d(-1px, -2px, 0);
  animation: none;
}

.btn.solidPinkBtn:hover::before {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.btn.solidPinkBtn:hover .btnIcon {
  transform: translate3d(3px, 0, 0);
}

.btn.solidPinkBtn:active {
  background-color: var(--brand-pink-hover) !important;
  box-shadow: 3px 3px 0px var(--brand-black) !important;
  transform: rotate(-0.35deg) translate3d(3px, 3px, 0);
  transition-duration: 110ms;
  animation: none;
}

.btn.solidPinkBtn:active::before {
  opacity: 0.7;
  transform: translate3d(4%, 0, 0);
}

.btn.solidPinkBtn:active .btnIcon {
  transform: translate3d(1px, 0, 0);
}

.btn.solidPinkBtn:focus-visible {
  outline: 2px solid var(--brand-yellow);
  outline-offset: 4px;
  animation: none;
}

.btnsContainer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 20px;
  row-gap: 10px;
  margin-top: clamp(10px, 2vw, 30px) !important;
}

.btnsContainer .btn {
  max-width: 100%;
}

@media (min-width: 768px) {
  .btnsContainer .btn {
    max-width: fit-content;
  }
}

/* ==================
   Homepage To Top
=====================*/

.top-button {
  right: clamp(16px, 2.4vw, 34px);
  bottom: clamp(16px, 2.4vw, 34px);
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0;
  width: auto;
  min-width: 0;
  padding: 0.48rem 0.56rem 0.48rem 0 !important;
  border: 3px solid var(--brand-black) !important;
  border-radius: 0 !important;
  background: var(--brand-pink) !important;
  color: var(--brand-black) !important;
  box-shadow: 4px 4px 0px var(--brand-black) !important;
  transform: rotate(-4deg) translate3d(0, 0, 0);
  overflow: hidden;
  text-decoration: none;
  transition:
    opacity 220ms ease,
    transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 220ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 180ms ease;
}

.top-button::before {
  content: "TOP";
  position: absolute;
  inset: 0 auto 0 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.56rem 0.72rem 0.52rem;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--brand-black);
  background: linear-gradient(
    135deg,
    rgb(255 255 255 / 0.2) 0%,
    rgb(255 255 255 / 0.2) 18%,
    transparent 18%,
    transparent 100%
  );
  pointer-events: none;
}

.top-button i {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  margin-left: 3.2rem;
  padding: 0.42rem 0.5rem;
  border-left: 3px solid var(--brand-black);
  background: var(--brand-yellow);
  font-size: 0.92rem;
  line-height: 1;
}

.top-button:hover {
  background: var(--brand-pink-hover) !important;
  color: var(--brand-black) !important;
  box-shadow: 8px 8px 0px var(--brand-black) !important;
  transform: rotate(-2deg) translate3d(-2px, -2px, 0);
}

.top-button:hover i {
  background: #f5d11f;
}

.top-button:active {
  box-shadow: 3px 3px 0px var(--brand-black) !important;
  transform: rotate(-2deg) translate3d(3px, 3px, 0);
}

.top-button:focus-visible {
  outline: 3px solid var(--brand-white);
  outline-offset: 4px;
}

@media (min-width: 768px) {
  .top-button {
    padding: 0.6rem 0.72rem 0.6rem 0 !important;
  }

  .top-button::before {
    padding: 0.72rem 0.9rem 0.66rem;
    font-size: 0.82rem;
  }

  .top-button i {
    min-width: 2.9rem;
    margin-left: 3.9rem;
    padding: 0.5rem 0.6rem;
    font-size: 1.05rem;
  }
}

/* ================
   Column Utilities
===================*/

.one-col {
  max-width: 1200px;
  width: 100%;
}

.two-cols {
  position: relative;
  z-index: 1;
}

.two-cols > div > :first-child {
  margin-top: 0;
}

.one-col,
.two-cols,
.three-cols,
.four-cols {
  display: grid;
  grid-template-columns: 1fr;
}

.column {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 15px;
}

.column > * {
  margin: 0;
}

.textColumn h2 {
  text-wrap: balance;
}

.textColumn img {
  max-width: 600px;
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: contain;
}

.textColumn .btnsContainer {
  margin-top: 30px !important;
}

.textColumn .ctaPillContainer {
  justify-content: flex-start;
  margin-top: 0;
}

.mediaColumn {
  align-items: center;
}

@media (max-width: 575px) {
  .two-cols.seventy-thirty-cols .textContentCardContainer {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 640px) {
  .two-cols,
  .three-cols,
  .four-cols {
    grid-template-columns: 1fr 1fr;
  }

  .two-cols.seventy-thirty-cols {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1024px) {
  .three-cols,
  .four-cols {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .two-cols.seventy-thirty-cols {
    grid-template-columns: 65% 35%;
  }

  .two-cols.seventy-thirty-cols:has(.sm-order-0) {
    grid-template-columns: 35% 65%;
  }
}

@media (min-width: 1400px) {
  .four-cols {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

/* ===============
   Order Utilities
==================*/

/* Base (all sizes) */
.order-0 {
  order: 0;
}
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.order-3 {
  order: 3;
}

/* ≥640px */
@media (min-width: 640px) {
  .sm-order-0 {
    order: 0;
  }
  .sm-order-1 {
    order: 1;
  }
  .sm-order-2 {
    order: 2;
  }
  .sm-order-3 {
    order: 3;
  }
}

/* ≥1024px */
@media (min-width: 1024px) {
  .lg-order-0 {
    order: 0;
  }
  .lg-order-1 {
    order: 1;
  }
  .lg-order-2 {
    order: 2;
  }
  .lg-order-3 {
    order: 3;
  }
}

/* ≥1200px */
@media (min-width: 1200px) {
  .xl-order-0 {
    order: 0;
  }
  .xl-order-1 {
    order: 1;
  }
  .xl-order-2 {
    order: 2;
  }
  .xl-order-3 {
    order: 3;
  }
}

/* =======================
   Media Fitting Utilities
==========================*/
.media-cover,
.media-cover > img {
  object-fit: cover;
}

.media-contain,
.media-contain > img {
  object-fit: contain;
}

.site-header {
  position: absolute;
  width: 100%;
  left: 0;
}

html,
body,
#page {
  height: unset !important;
}

section .brand-carousel {
  position: relative;
  left: -3px;
  z-index: 2;
  margin: 0 !important;
  padding: 0;
  width: 103%;
  max-width: 103%;
  transform: rotate(3deg);
  background-color: white;
  border-radius: 0;
}

.homepageBrandSection {
  position: relative;
  overflow-x: clip;
  margin-top: -53px;
  margin-bottom: -60px;
}

.solidBadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(10px, 2vw, 15px) clamp(30px, 4vw, 60px) !important;
  border: 3px solid var(--brand-black);
  border-radius: 0;
  box-shadow: 4px 4px 0px var(--brand-black);
}

.pinkBadge {
  background-color: var(--brand-pink);
}

.solidBadge > span {
  color: var(--brand-black);
  font-size: clamp(1rem, 3vw, 1.6rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.homepageBrandBadge {
  --homepage-brand-badge-overshoot: -58%;
  position: absolute;
  top: -26px;
  left: clamp(16px, 5vw, 72px);
  z-index: 1;
  transform: rotate(3deg) translate3d(0, 150%, 0) scale(0.92);
  transform-origin: center center;
  visibility: hidden;
}

.brandLogoCarousel .embla__viewport {
  overflow: hidden;
}

.brandLogoCarousel .embla__container {
  display: flex;
  align-items: center;
  touch-action: pan-y pinch-zoom;
}

.brandLogoCarousel .embla__slide {
  flex: 0 0 auto;
  min-width: 0;
  padding-right: 40px;
}

.brandLogoCarousel .embla__slide img {
  display: block;
  width: auto;
  max-width: none;
  height: 1.5rem;
  object-fit: contain;
}

.homepageHeroVideo {
  position: relative;
  min-height: 70vh;
  overflow: hidden;
  background-color: var(--brand-black);
}

.homepageHeroVideo::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    180deg,
    #80d1fe 0%,
    rgb(128 209 254 / 80%) 10%,
    transparent 30%,
    transparent
  );
  pointer-events: none;
  z-index: 1;
}

.homepageHeroVideo__media {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 70vh;
  object-fit: cover;
}

.homepageHeroVideoScrollPrompt {
  position: absolute;
  left: 50%;
  bottom: 15vw;
  z-index: 2;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  inline-size: 8.5rem;
  aspect-ratio: 1;
  padding: 1rem;
  border: 3px solid rgb(255 255 255 / 28%);
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.03);
  backdrop-filter: blur(10px);
  color: var(--brand-white);
  text-align: center;
  text-decoration: none;
  transform: translateX(-50%);
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
}

.homepageHeroVideoScrollPrompt:hover {
  transform: translateX(-50%) translateY(-2px);
}

.homepageHeroVideoScrollPrompt:focus-visible {
  outline: 2px solid var(--brand-yellow);
  outline-offset: 4px;
}

.homepageHeroVideoScrollPromptText {
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.homepageHeroVideoScrollPromptChevrons {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.22rem;
  animation: homepageHeroVideoChevronFloat 2.2s ease-in-out infinite;
}

.homepageHeroVideoScrollPromptChevron {
  display: block;
  inline-size: 0.95rem;
  block-size: 0.95rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: 0.92;
  transform: rotate(45deg);
}

@keyframes homepageHeroVideoChevronFloat {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(0.3rem);
  }
}

@media (min-width: 768px) {
  .homepageHeroVideoScrollPrompt {
    bottom: 10vw;
    gap: 0.72rem;
    inline-size: clamp(10.75rem, 19.5vw, 13.5rem);
    padding: 1.4rem;
  }

  .homepageHeroVideoScrollPromptText {
    font-size: clamp(1rem, 2vw, 1.2rem);
    letter-spacing: 0.12em;
  }

  .homepageHeroVideoScrollPromptChevron {
    inline-size: 1.2rem;
    block-size: 1.2rem;
  }
}

@media (max-width: 767px) {
  .homepageHeroVideo,
  .homepageHeroVideo__media {
    min-height: 95vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .homepageHeroVideoScrollPrompt,
  .homepageHeroVideoScrollPromptChevrons {
    transition: none;
    animation: none;
  }

  .homepageHeroVideoScrollPrompt:hover {
    transform: translateX(-50%);
  }
}

.shopSheweeHome .textColumn p span,
.shopSheweeHome > div > .mediaColumn .mediaTextGroup p span,
.shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p span,
.theStoriesSheweeHome .textColumn p span {
  line-height: 100%;
}

/* Anchor the repeated shop media copy to the lower-right of the image column. */
.shopSheweeHome > div > .mediaColumn .mediaTextGroup {
  width: fit-content;
  margin-top: auto !important;
  margin-left: auto !important;
  color: rgb(225 201 50);
  text-shadow: 2px 3px 0px rgb(205 184 48);
  transform: rotate(-25deg);
  position: relative;
  right: -100px;
}

.shopSheweeHome > div > .mediaColumn .mediaTextCarousel .embla__viewport {
  overflow: hidden;
}

.shopSheweeHome > div > .mediaColumn .mediaTextCarousel .embla__container {
  display: flex;
  align-items: flex-start;
  touch-action: pan-y pinch-zoom;
}

.shopSheweeHome > div > .mediaColumn .mediaTextCarousel .embla__slide {
  flex: 0 0 auto;
  min-width: 0;
}

.shopSheweeHome > div > .mediaColumn .mediaTextGroupStack {
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: fit-content;
  padding-inline: clamp(12px, 1.6vw, 24px);
  box-sizing: border-box;
}

.shopSheweeHome > div > .mediaColumn .mediaTextGroup p,
.shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p {
  margin: 0;
}

/* You can just */
.shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(1) {
  --font-size: 2.5rem;
  --fluid-font-size: 5.4vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

/* PEE */
.shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(2) {
  --font-size: 10rem;
  --fluid-font-size: 19vw;
  display: inline-block;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
  text-shadow: 4px 5px 0px var(--brand-black);
  transform: translate3d(-120vw, 0, 0);
  transform-origin: left center;
  will-change: transform;
}

/* Anywhere */
.shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(3) {
  --font-size: 3.1rem;
  --fluid-font-size: 6.5vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

/* Shop Shewee button and the stories button */
.shopSheweeHome .textColumn .solidPinkBtn .btnLabel,
.theStoriesSheweeHome .textColumn .solidPinkBtn .btnLabel {
  --font-size: 1.4rem;
  --fluid-font-size: 5vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

/* Freedom */
.theStoriesSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(1) {
  --font-size: 4rem;
  --fluid-font-size: 8.5vw;
  display: inline-block;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
  visibility: hidden;
  transform: translate3d(-0.16em, calc(-100% - 24vh), 0) rotate(-14deg)
    scale(1.06);
  transform-origin: center bottom;
  will-change: transform;
}

/* To Go */
.theStoriesSheweeHome .textColumn .storiesToGoWord {
  --font-size: 6.3rem;
  --fluid-font-size: 13.6vw;
  display: inline-flex;
  align-items: flex-end;
  gap: 0.015em;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.theStoriesSheweeHome .textColumn .storiesToGoLetter {
  visibility: hidden;
  opacity: 0;
  transform: translate3d(0, 0.45em, 0) scale(0.84, 1.14);
  transform-origin: center bottom;
  will-change: transform, opacity;
}

.theStoriesSheweeHome .textColumn .storiesToGoSpacer {
  display: inline-block;
  width: 0.22em;
}

/* Keep the shop media text smaller on mobile than the stories section. */
/* Travels, Festivals */
.shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(1),
.shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(1) {
  --font-size: 1.2rem;
  --fluid-font-size: 2.8vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.theStoriesSheweeHome .textColumn p:nth-of-type(2) > span:nth-of-type(1) {
  --font-size: 2rem;
  --fluid-font-size: 4.5vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

/* Adventure */
.shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(2),
.shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(2) {
  --font-size: 1.92rem;
  --fluid-font-size: 4.1vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.theStoriesSheweeHome .textColumn p:nth-of-type(2) > span:nth-of-type(2) {
  --font-size: 3.2rem;
  --fluid-font-size: 6.8vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.peebolHome .textColumn {
  align-items: flex-start;
  gap: clamp(12px, 2vw, 22px);
}

.peebolHome .textColumn p span {
  line-height: 100%;
}

.peebolHomeIntro {
  --font-size: 1.05rem;
  --fluid-font-size: 2.6vw;
  letter-spacing: 0.1em;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.peebolHomeIntro > span {
  display: inline-block;
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transform-origin: left center;
  will-change: transform, opacity;
}

.peebolHomeTitle {
  --font-size: 5.5rem;
  --fluid-font-size: 12vw;
  max-width: 6ch;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
  letter-spacing: -0.05em;
  line-height: 0.92;
  opacity: 0;
  transform: translate3d(-48px, 0, 0) skewX(-8deg);
  transform-origin: left center;
  will-change: transform, opacity;
}

.peebolHome .textColumn > p:nth-of-type(3) {
  --font-size: 1.6rem;
  --fluid-font-size: 5vw;
  max-width: 11ch;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
  line-height: 1;
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  will-change: transform, opacity;
}

.peebolHome .btnsContainer {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  will-change: transform, opacity;
}

.peebolHome .textColumn .solidPinkBtn .btnLabel {
  --font-size: 1.4rem;
  --fluid-font-size: 5vw;
  font-size: clamp(
    var(--font-size),
    var(--fluid-font-size),
    calc(var(--font-size) * var(--font-scale-max))
  );
}

.peebolHomeImageWrap {
  position: relative;
  z-index: 1;
  width: min(100%, 500px);
  margin-inline: auto;
}

.peebolHomeImage {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 18px 24px rgb(0 0 0 / 0.22));
  opacity: 0;
  transform: translate3d(72px, 22px, 0) rotate(10deg) scale(0.92);
  transform-origin: center center;
  will-change: transform, opacity;
}

@media (min-width: 768px) {
  .homepageBrandBadge {
    --homepage-brand-badge-overshoot: -48%;
    top: -75px;
    left: clamp(30px, 6vw, 100px);
  }

  .brandLogoCarousel .embla__slide {
    padding-right: 60px;
  }

  .brandLogoCarousel .embla__slide img {
    height: 2rem;
  }

  /* You can just */
  .shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(1) {
    --fluid-font-size: 5.7vw;
  }

  /* PEE */
  .shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(2) {
    --fluid-font-size: 22vw;
  }

  /* Anywhere */
  .shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(3) {
    --fluid-font-size: 6.8vw;
  }

  /* Shop Shewee button and the stories button */
  .shopSheweeHome .textColumn .solidPinkBtn .btnLabel,
  .theStoriesSheweeHome .textColumn .solidPinkBtn .btnLabel {
    --fluid-font-size: 3.5vw;
  }

  /* Freedom */
  .theStoriesSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(1) {
    --fluid-font-size: 9.2vw;
  }

  /* To Go */
  .theStoriesSheweeHome .textColumn .storiesToGoWord {
    --fluid-font-size: 14.5vw;
  }

  /* Scale the shop media text back up on larger screens without pinning it at the clamp max. */
  /* Travels, Festivals */
  .shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(1),
  .shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(1) {
    --font-size: 1.85rem;
    --fluid-font-size: 3.1vw;
  }

  .theStoriesSheweeHome .textColumn p:nth-of-type(2) > span:nth-of-type(1) {
    --fluid-font-size: 5vw;
  }

  /* Adventure */
  .shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(2),
  .shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(2) {
    --font-size: 2.8rem;
    --fluid-font-size: 3.9vw;
  }

  .theStoriesSheweeHome .textColumn p:nth-of-type(2) > span:nth-of-type(2) {
    --fluid-font-size: 7.4vw;
  }

  .peebolHomeIntro {
    --fluid-font-size: 1.9vw;
  }

  .peebolHomeTitle {
    --fluid-font-size: 9vw;
  }

  .peebolHome .textColumn > p:nth-of-type(3) {
    --fluid-font-size: 3vw;
  }

  .peebolHome .textColumn .solidPinkBtn .btnLabel {
    --fluid-font-size: 3.5vw;
  }
}

@media (min-width: 1200px) {
  .homepageBrandBadge {
    top: -75px;
    left: clamp(36px, 5vw, 130px);
  }

  .brandLogoCarousel .embla__slide {
    padding-right: 100px;
  }

  .brandLogoCarousel .embla__slide img {
    height: 3rem;
  }

  /* Keep desktop growth fluid while landing near the original visual scale. */
  /* Travels, Festivals */
  .shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(1),
  .shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(1) {
    --font-size: 2rem;
    --fluid-font-size: 2.9vw;
  }

  .theStoriesSheweeHome .textColumn p:nth-of-type(2) > span:nth-of-type(1) {
    --fluid-font-size: 3.5vw;
  }

  /* Adventure */
  .shopSheweeHome > div > .mediaColumn .mediaTextGroup p > span:nth-of-type(2),
  .shopSheweeHome > div > .mediaColumn .mediaTextGroupStack p > span:nth-of-type(2) {
    --font-size: 5.2rem;
    --fluid-font-size: 3.4vw;
  }
}

.shopSheweeHome {
  --shop-shewee-before-offset: -25vw;
  --shop-shewee-after-offset: -26.5vw;
  overflow-x: clip;
  position: relative;
  isolation: isolate;
  z-index: 1;
}

.shopSheweeHome::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--brand-yellow);
  mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" id="Layer_2" data-name="Layer 2" viewBox="0 0 2040.98 1230.3"><defs><style> .cls-1 { fill: %23efd132; } </style></defs><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M2040.91,279.32v946.4c0,1-.11,2.01,.03,3,.18,1.3-.26,1.69-1.53,1.53-.98-.12-2-.02-3-.02H4.58c-1,0-2.02-.11-3,.03-1.31,.19-1.74-.19-1.53-1.53,.15-.98,.03-2,.03-3V1.35C1.54,.44,2.64-.69,4.81,.54c6.85,3.89,14.15,7.04,20.84,11.17,11.84,7.31,23.38,15.12,35.02,22.74,2.19,1.43,4.43,2.83,6.45,4.49,4.71,3.87,9.36,7.82,13.91,11.87,6.92,6.14,13.89,12.25,20.56,18.66,4.65,4.47,8.84,9.41,13.24,14.14,.57,.61,1.23,1.14,1.74,1.79,4.42,5.71,8.84,11.41,13.2,17.16,4.46,5.88,9.23,11.57,13.19,17.77,5.73,8.96,11.72,17.78,16.33,27.45,5.3,11.11,11.52,21.81,16.38,33.09,4.45,10.33,7.71,21.17,11.33,31.85,1.57,4.63,2.84,9.38,4.05,14.12,1.69,6.64,3.14,13.34,4.79,19.99,.91,3.68,1.55,4.15,4.77,3.19,6.95-2.07,14.07-3,21.25-3.71,3.11-.3,6.21-.68,9.3-1.08,4.71-.61,9.41-1.73,14.12-1.8,9.21-.13,18.4-.69,27.6-1.03,2.59-.1,5.19,.76,7.8,.9,6.27,.35,12.53,.24,18.82,.8,8.85,.78,17.66,1.6,26.39,3.23,7.71,1.44,15.51,2.56,23.07,4.57,11.66,3.1,23.5,5.57,34.73,10.22,6.48,2.68,13.49,4.25,19.65,7.5,6.7,3.53,12.56,3.62,19.44,.57,7.42-3.29,15.32-5.6,23.15-7.86,8.78-2.53,17.69-4.62,26.59-6.72,5.41-1.27,10.86-2.43,16.36-3.21,7.31-1.04,14.67-1.9,22.04-2.41,10.78-.75,21.59-1.17,32.39-1.64,3.66-.16,7.35-.23,10.99,.04,6.38,.48,12.75,1.83,19.12,1.81,11.53-.04,22.68,2.48,33.87,4.44,10.42,1.83,20.62,4.95,30.88,7.64,16.67,4.36,32.63,10.7,48.26,17.87,7.89,3.62,15.66,7.54,23.35,11.58,5.07,2.66,10.07,5.54,14.81,8.74,10.73,7.24,21.99,13.72,31.7,22.44,4.39,3.94,9.45,7.13,13.81,11.1,7.97,7.27,15.7,14.81,23.4,22.36,2.94,2.88,5.44,6.21,8.3,9.19,3.27,3.42,4.14,3.23,8.52,.97,8.75-4.52,17.41-9.34,26.52-13,12.27-4.92,24.83-9.19,37.47-13.08,9.5-2.92,19.29-4.93,29.01-7.11,5.58-1.25,11.24-2.18,16.9-2.98,4.58-.64,9.22-.88,13.84-1.28,10.6-.91,21.19-2.24,31.81-2.57,10.3-.32,20.63,.3,30.94,.7,14,.54,27.8,2.68,41.46,5.65,21.66,4.71,42.67,11.47,63.12,20.09,11.94,5.03,23.81,10.14,35.13,16.5,11.58,6.5,23.08,13.13,33.8,20.99,6.49,4.76,12.81,9.75,19.06,14.81,4.99,4.05,9.83,8.29,14.58,12.62,1.6,1.46,2.49,1.4,4.07-.03,4.27-3.86,9.02-7.23,13.09-11.29,8.33-8.3,18.32-14.42,27.58-21.49,5.46-4.17,11.37-7.73,17.16-11.45,10.54-6.78,21.75-12.27,32.83-17.92,10.45-5.33,21.64-9.3,32.71-13.29,15.85-5.7,32.01-10.29,48.65-13.31,12.99-2.35,25.98-4.52,39.1-5.96,17.75-1.96,35.5-2.21,53.33-1.08,18.16,1.15,36.02,3.89,53.64,8.3,27.82,6.96,53.98,17.82,77.83,33.92,3.72,2.51,7.26,5.3,10.92,7.91,2.52,1.79,2.61,1.69,3.93-.98,2.43-4.92,4.63-9.98,7.45-14.66,9.95-16.5,23.42-29.78,38.75-41.27,23.14-17.34,48.89-29.62,76.09-39.03,25.06-8.67,50.79-14.42,77.03-18.15,18.98-2.7,38.03-4.32,57.16-4.61,12.14-.18,24.3,.42,36.45,.69,17.67,.39,35.19,2.54,52.57,5.44,24.46,4.08,48.53,9.85,71.83,18.54,1.53,.57,3.18,.79,4.78,1.18Z"/></g></svg>');
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-position: top;
  transform: translate3d(0, 0, 0);
  transition: transform 0.85s cubic-bezier(0.12, 0.9, 0.24, 1);
  will-change: transform;
  z-index: 1;
  background-position: bottom;
}

.shopSheweeHome::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #f3da39;
  mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" id="Layer_2" data-name="Layer 2" viewBox="0 0 2040.98 1230.3"><defs><style> .cls-1 { fill: %23efd132; } </style></defs><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M2040.91,279.32v946.4c0,1-.11,2.01,.03,3,.18,1.3-.26,1.69-1.53,1.53-.98-.12-2-.02-3-.02H4.58c-1,0-2.02-.11-3,.03-1.31,.19-1.74-.19-1.53-1.53,.15-.98,.03-2,.03-3V1.35C1.54,.44,2.64-.69,4.81,.54c6.85,3.89,14.15,7.04,20.84,11.17,11.84,7.31,23.38,15.12,35.02,22.74,2.19,1.43,4.43,2.83,6.45,4.49,4.71,3.87,9.36,7.82,13.91,11.87,6.92,6.14,13.89,12.25,20.56,18.66,4.65,4.47,8.84,9.41,13.24,14.14,.57,.61,1.23,1.14,1.74,1.79,4.42,5.71,8.84,11.41,13.2,17.16,4.46,5.88,9.23,11.57,13.19,17.77,5.73,8.96,11.72,17.78,16.33,27.45,5.3,11.11,11.52,21.81,16.38,33.09,4.45,10.33,7.71,21.17,11.33,31.85,1.57,4.63,2.84,9.38,4.05,14.12,1.69,6.64,3.14,13.34,4.79,19.99,.91,3.68,1.55,4.15,4.77,3.19,6.95-2.07,14.07-3,21.25-3.71,3.11-.3,6.21-.68,9.3-1.08,4.71-.61,9.41-1.73,14.12-1.8,9.21-.13,18.4-.69,27.6-1.03,2.59-.1,5.19,.76,7.8,.9,6.27,.35,12.53,.24,18.82,.8,8.85,.78,17.66,1.6,26.39,3.23,7.71,1.44,15.51,2.56,23.07,4.57,11.66,3.1,23.5,5.57,34.73,10.22,6.48,2.68,13.49,4.25,19.65,7.5,6.7,3.53,12.56,3.62,19.44,.57,7.42-3.29,15.32-5.6,23.15-7.86,8.78-2.53,17.69-4.62,26.59-6.72,5.41-1.27,10.86-2.43,16.36-3.21,7.31-1.04,14.67-1.9,22.04-2.41,10.78-.75,21.59-1.17,32.39-1.64,3.66-.16,7.35-.23,10.99,.04,6.38,.48,12.75,1.83,19.12,1.81,11.53-.04,22.68,2.48,33.87,4.44,10.42,1.83,20.62,4.95,30.88,7.64,16.67,4.36,32.63,10.7,48.26,17.87,7.89,3.62,15.66,7.54,23.35,11.58,5.07,2.66,10.07,5.54,14.81,8.74,10.73,7.24,21.99,13.72,31.7,22.44,4.39,3.94,9.45,7.13,13.81,11.1,7.97,7.27,15.7,14.81,23.4,22.36,2.94,2.88,5.44,6.21,8.3,9.19,3.27,3.42,4.14,3.23,8.52,.97,8.75-4.52,17.41-9.34,26.52-13,12.27-4.92,24.83-9.19,37.47-13.08,9.5-2.92,19.29-4.93,29.01-7.11,5.58-1.25,11.24-2.18,16.9-2.98,4.58-.64,9.22-.88,13.84-1.28,10.6-.91,21.19-2.24,31.81-2.57,10.3-.32,20.63,.3,30.94,.7,14,.54,27.8,2.68,41.46,5.65,21.66,4.71,42.67,11.47,63.12,20.09,11.94,5.03,23.81,10.14,35.13,16.5,11.58,6.5,23.08,13.13,33.8,20.99,6.49,4.76,12.81,9.75,19.06,14.81,4.99,4.05,9.83,8.29,14.58,12.62,1.6,1.46,2.49,1.4,4.07-.03,4.27-3.86,9.02-7.23,13.09-11.29,8.33-8.3,18.32-14.42,27.58-21.49,5.46-4.17,11.37-7.73,17.16-11.45,10.54-6.78,21.75-12.27,32.83-17.92,10.45-5.33,21.64-9.3,32.71-13.29,15.85-5.7,32.01-10.29,48.65-13.31,12.99-2.35,25.98-4.52,39.1-5.96,17.75-1.96,35.5-2.21,53.33-1.08,18.16,1.15,36.02,3.89,53.64,8.3,27.82,6.96,53.98,17.82,77.83,33.92,3.72,2.51,7.26,5.3,10.92,7.91,2.52,1.79,2.61,1.69,3.93-.98,2.43-4.92,4.63-9.98,7.45-14.66,9.95-16.5,23.42-29.78,38.75-41.27,23.14-17.34,48.89-29.62,76.09-39.03,25.06-8.67,50.79-14.42,77.03-18.15,18.98-2.7,38.03-4.32,57.16-4.61,12.14-.18,24.3,.42,36.45,.69,17.67,.39,35.19,2.54,52.57,5.44,24.46,4.08,48.53,9.85,71.83,18.54,1.53,.57,3.18,.79,4.78,1.18Z"/></g></svg>');
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-position: top;
  transform: translate3d(0, 0, 0);
  transition: transform 0.85s cubic-bezier(0.12, 0.9, 0.24, 1) 0s;
  will-change: transform;
  z-index: 0;
}

.shopSheweeHome.shopSheweeHomeBgAnim::before {
  transform: translate3d(0, var(--shop-shewee-before-offset), 0);
}

.shopSheweeHome.shopSheweeHomeBgAnim::after {
  transform: translate3d(0, var(--shop-shewee-after-offset), 0);
}

.shopSheweeHome .bgTravelPattern,
.shopSheweeHome::before,
.shopSheweeHome .roughEdgeMask::before {
  background-image: url(/wp-content/themes/shewee/img/homepage/travel-icon-bg-6.webp);
  background-size: contain;
  background-color: var(--brand-yellow);
  background-blend-mode: multiply;
}

.shopSheweeHome .bgTravelPattern {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 104%;
  max-width: 100%;
  background-position: bottom;
}

.shopSheweeHome .roughEdgeMask {
  position: absolute;
  top: 15vw;
  left: 0;
  mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" id="Layer_2" data-name="Layer 2" viewBox="0 0 1914 1080"><g id="Layer_1-2" data-name="Layer 1"><path d="M1914,31V1080H0V4c4.31,1.82,8.17-.46,12.05-1.56,4.11-1.16,7.18-.75,10.38,2.45,2.47,2.48,5.77,5.05,9.04,5.63,6.97,1.22,14.13,1.33,20.85,3.94,.45,.18,.98,.17,1.48,.25,7.54,1.2,15.12,2.18,22.6,3.66,13.59,2.68,27.38,3.64,41.12,4.33,12.93,.65,25.94-.46,38.92-.71,4.32-.08,8.65,.11,12.97,.13,7.77,.03,15.54,.19,23.31-.01,8.97-.24,17.93-.95,26.9-1.2,8.8-.25,17.61-.14,26.42-.27,6.98-.11,13.95-.54,20.93-.48,11.82,.1,23.63,.66,35.45,.66,8.14,0,16.32-1.29,24.39-.72,6.17,.43,12.22,.42,18.34,.07,10.12-.58,20.25-.96,30.38-1.43,.66-.03,1.32-.16,1.98-.23,5.12-.52,10.23-1.29,15.36-1.5,13.78-.56,27.64-.15,41.34-1.51,14.16-1.41,28.66-1.09,42.33-6.1,.46-.17,.96-.28,1.46-.32,5.94-.56,11.9-1.01,17.83-1.71,2.78-.33,5.48-1.23,8.25-1.7,5.52-.95,11.06-1.81,16.6-2.64,.79-.12,1.65,.25,2.47,.27,3.97,.06,7.94,0,11.91,.13,4.65,.16,8.99-2.48,13.81-1.27,2.01,.5,4.28,.06,6.43-.04,7.97-.36,15.94-.71,23.9-1.17,1.95-.11,3.88-.6,5.82-.92,3.33,0,6.67,0,10,0,1.11,.31,2.2,.84,3.32,.9,5.99,.3,11.97,.61,17.97,.68,13.13,.17,26.24,.16,39.38,1.15,15.23,1.15,30.57,.8,45.86,1.26,5.03,.15,9.97,1.02,15.08,1.04,8.84,.03,17.52,3.4,26.56,2.1,.46-.07,.97,.19,1.46,.29,3.09,.65,6.15,1.62,9.27,1.89,11.91,1.03,23.63,4.19,35.73,3.18,1.61-.14,3.29,.4,4.91,.74,9.61,2.01,19.23,4.01,28.82,6.11,12.31,2.7,25.17,1.77,37.31,5.65,1.22,.39,2.65,.07,3.98,.15,1.49,.09,3.06,0,4.45,.43,3.22,.98,6.34,1.86,9.7,.43,.79-.33,2.13-.15,2.87,.33,5.76,3.71,11.76,2.95,17.82,1.14,3.65-1.09,7.13-.51,10.82,.02,6.69,.96,13.49,1.16,20.24,1.67,.32,.02,.67-.05,.98-.15,6.38-2.14,12.79-1.15,19.27-.49,4.43,.45,9,.51,13.42,0,6.92-.79,13.71-2.45,20.79-1.61,2.43,.29,5-.15,7.45-.55,13.17-2.15,26.36-2.63,39.64-1.26,2.76,.28,5.6-.17,8.4-.27,1.66-.06,3.31-.16,4.97-.17,3.8-.02,7.62,.21,11.4-.04,6.1-.4,12.3-2.44,18.26-.29,5.37,1.94,10.48,1.02,15.74,.31,2.19-.29,3.7-1.14,3.36-4.03,1.98,.47,3.41,.8,4.83,1.15,8.4,2.05,16.81,4.03,25.18,6.17,3.22,.82,6.65,1.48,9.45,3.11,11.58,6.76,24.67,7.48,37.36,9.72,9,1.59,18.12,2.54,27.19,3.67,6.44,.8,12.91,2.15,19.34,1.98,12.5-.33,24.93-.11,37.34,1.39,2.11,.26,4.31-.09,6.46-.28,6.28-.55,12.57-1.74,18.83-1.61,8.98,.19,17.88,.8,26.91,.01,9.59-.83,19.29-.55,28.94-.6,12.14-.06,24.27-.01,36.41,.1,2.13,.02,4.25,.65,6.38,.95,6.26,.87,12.51,1.36,18.86-.99,.62,.37,1.42,1.03,2.33,1.36,5.36,1.97,10.95,2.33,15.87-.56,2.51-1.48,4.45-2.26,7.29-1.72,2.42,.46,4.98,.34,7.47,.27,7.5-.2,14.95,.02,22.42,.98,5.93,.76,11.84,.48,17.82-1.01,7.06-1.76,14.41-2.36,21.63-3.55,1.76-.29,3.55-.75,5.18-1.47,6.61-2.92,13.13-5.58,20.67-3.31,2.44,.73,5.28,.16,7.93,.13,3.32-.03,6.67-.38,9.96-.12,8.97,.71,17.95,1.38,26.86,2.59,12.69,1.73,25.32,3.98,37.98,5.91,3.28,.5,6.6,.68,9.92,.91,2.92,.2,5.27-.93,6.58-3.61,1.17-2.4,3.22-3.33,5.61-3.62,5.11-.63,10.23-1.29,15.37-1.58,3.46-.2,6.96,.31,10.44,.33,7.66,.04,15.32-.18,22.97,0,3.14,.07,6.26,.84,9.38,1.34,2.62,.41,5.22,1.17,7.84,1.28,10.48,.42,20.97,.63,31.46,.93,1.83,.05,3.8-.3,5.46,.26,5.17,1.76,10.5,1.92,15.81,1.75,7.2-.23,14.64,1.76,21.53-2.13,.88-.5,2.3-.23,3.43-.08,4.28,.59,8.56,1.26,12.83,1.96,3.33,.55,6.6,1.13,9.47-1.48,.54-.49,1.54-.65,2.34-.68,6.97-.27,13.94-.61,20.91-.66,10.33-.08,20.66,.03,31,.11,4,.03,7.98,.33,11.32-2.65,.8-.72,2.12-.95,3.25-1.18,6.21-1.23,12.42-2.49,18.66-3.51,2.26-.37,4.62-.13,6.94-.13,4.97-.01,9.95,.18,14.91-.06,5.14-.25,10.26-.91,15.39-1.39Z"/></g></svg>');
  mask-size: contain;
  mask-repeat: no-repeat;
  width: 100%;
  height: 100%;
  z-index: 0;
  max-width: 100%;
  transform: scaleY(-1);
}

.shopSheweeHome .roughEdgeMask::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(/wp-content/themes/shewee/img/homepage/travel-icon-bg-6.webp);
  background-size: contain;
  background-color: var(--brand-yellow);
  background-blend-mode: multiply;
  transform: scaleY(-1);
  transform-origin: center;
  background-position: bottom;
}

.madeInBritainSection {
  position: relative;
  top: -20%;
  right: 5%;
  margin-left: auto !important;
  width: fit-content;
}

.madeInBritainBadgeFrame {
  position: relative;
  z-index: 2;
  display: inline-block;
  width: clamp(120px, 27vw, 350px);
  overflow: hidden;
  border-radius: 50%;
  isolation: isolate;
}

.madeInBritainBadgeFrame::after {
  content: "";
  position: absolute;
  inset: -18%;
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(
    115deg,
    transparent 24%,
    rgb(255 255 255 / 0.12) 38%,
    rgb(255 255 255 / 0.98) 50%,
    rgb(255 255 255 / 0.32) 58%,
    transparent 76%
  );
  transform: translate3d(-180%, 0, 0) rotate(12deg);
  animation: madeInBritainShine 5s linear 1.6s infinite;
}

.madeInBritainBadge {
  display: block;
  width: 100%;
  filter: drop-shadow(2px 4px 10px rgba(0, 0, 0, 0.1));
}

.madeInBritainBadge {
  transform: translateX(120%) rotate(365deg);
  transform-origin: center center;
}

.madeInBritainLogo {
  max-width: clamp(50px, 12vw, 150px);
  position: absolute;
  bottom: -10%;
  left: -10%;
  filter: drop-shadow(2px 4px 10px rgba(0, 0, 0, 0.1));
  z-index: 1;
  visibility: hidden;
  transform: rotate(-30deg) translateX(80%) scale(0.5);
  transform-origin: center center;
}

.shopSheweeHome > div {
  display: grid;
  grid-template-columns: 1fr;
  position: relative;
  z-index: 2;
}

.shopSheweeHome > div > .mediaColumn > .shopSheweeHomeHandTrigger {
  right: -27%;
  position: absolute;
  bottom: 0;
  max-width: clamp(530px, 88vw, 1300px);
  width: 130%;
}

.shopSheweeHomeHand {
  display: block;
  width: 100%;
  transform: rotate(0) translate(100%);
  filter: drop-shadow(0px 10px 0px white);
}

.handColorCarousel .embla__viewport {
  overflow: hidden;
  width: 100%;
}

.handColorCarousel .embla__container {
  display: flex;
}

.handColorCarousel .embla__slide {
  flex: 0 0 100%;
  min-width: 0;
}

.handColorCarousel .embla__slide img {
  display: block;
  width: 100%;
  height: auto;
}

.theStoriesSheweeHome {
  --stories-shewee-bg-image: url("/wp-content/themes/shewee/img/homepage/safari-couple-bg.webp");
  padding-top: calc(var(--spacing-y-axis) + 50px);
  padding-bottom: calc(var(--spacing-y-axis) + 50px);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  z-index: 0;
}

.theStoriesSheweeHome::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--stories-shewee-bg-image);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 24% 0%;
  pointer-events: none;
  z-index: 0;
}

.theStoriesSheweeHome > * {
  position: relative;
  z-index: 1;
}

.peebolHome {
  padding-top: calc(var(--spacing-y-axis) + 50px);
  padding-bottom: calc(var(--spacing-y-axis) + 50px);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  z-index: 0;
}

.peebolHome::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/wp-content/themes/shewee/img/homepage/outdoors-bg.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  pointer-events: none;
  z-index: 0;
}

.peebolHome > * {
  position: relative;
  z-index: 1;
}

@media (min-width: 481px) {
  .shopSheweeHome > div > .mediaColumn > .shopSheweeHomeHandTrigger {
    right: -13%;
  }
}

@media (min-width: 768px) {
  .shopSheweeHome {
    --shop-shewee-before-offset: -21vw;
    --shop-shewee-after-offset: -22.25vw;
  }

  .shopSheweeHome::before {
    mask-size: cover;
  }

  .shopSheweeHome::after {
    mask-size: cover;
  }

  .shopSheweeHome .roughEdgeMask {
    top: 5vw;
    mask-size: cover;
  }

  .shopSheweeHome .bgTravelPattern,
  .shopSheweeHome::before,
  .shopSheweeHome .roughEdgeMask::before {
    background-size: cover;
  }

  .shopSheweeHome::before {
    background-position: top;
  }

  .shopSheweeHome .bgTravelPattern {
    background-position: 50% 45.2vw;
  }

  .shopSheweeHome .roughEdgeMask::before {
    background-position: 50% 107%;
  }

  .shopSheweeHome > div {
    display: grid;
    grid-template-columns: 1fr auto;
    max-width: 1800px;
    margin-left: auto;
  }

  .madeInBritainSection {
    top: -15%;
    right: 15%;
  }

  .shopSheweeHome > div > .mediaColumn > .shopSheweeHomeHandTrigger {
    width: 100%;
    max-width: clamp(530px, 68vw, 1300px);
    right: -11%;
    bottom: -4%;
  }

  .peebolHome .two-cols {
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  }

  .peebolHome .textColumn {
    padding-right: clamp(0px, 4vw, 70px);
  }

  .peebolHomeImageWrap {
    margin-left: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .shopSheweeHome::before,
  .shopSheweeHome::after {
    transition: none;
  }

  .shopSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(2) {
    transform: none;
    will-change: auto;
  }

  .madeInBritainBadgeFrame::after {
    animation: none;
  }

  .homepageBrandBadge {
    visibility: visible;
    z-index: 3;
    transform: rotate(3deg) translate3d(0, 0, 0) scale(1);
  }

  .homepageBrandBadgeAnim {
    animation: none;
  }

  .peeWordAnim {
    animation: none;
    transform: none;
  }

  .theStoriesSheweeHome .textColumn p:nth-of-type(1) > span:nth-of-type(1) {
    visibility: visible;
    transform: none;
    will-change: auto;
  }

  .theStoriesSheweeHome .textColumn .storiesToGoLetter {
    visibility: visible;
    opacity: 1;
    transform: none;
    will-change: auto;
  }

  .peebolHomeIntro > span,
  .peebolHomeTitle,
  .peebolHome .textColumn > p:nth-of-type(3),
  .peebolHome .btnsContainer,
  .peebolHomeImage {
    opacity: 1;
    transform: none;
    will-change: auto;
  }

  .peebolIntroAnim,
  .peebolTitleAnim,
  .peebolBodyAnim,
  .peebolImageAnim {
    animation: none;
  }

  .solidPinkBtn {
    animation: none;
  }
}

.handAnim {
  transform: rotate(24deg) translate3d(0, 0, 0);
  animation:
    handAnim 0.75s ease 0s 1 forwards,
    handBob 1.8s ease-in-out 0.75s infinite alternate;
}

.madeInBritainAnim {
  transform: translateX(0) rotate(5deg);
  animation: madeInBritainAnim 0.65s cubic-bezier(0.12, 0.9, 0.24, 1) 0s 1
    forwards;
}

.madeInBritainLogoAnim {
  animation: madeInBritainLogoAnim 0.8s cubic-bezier(0.2, 0.9, 0.24, 1) 0.35s 1
    forwards;
}

.homepageBrandBadgeAnim {
  animation: homepageBrandBadgeAnim 0.95s cubic-bezier(0.18, 0.9, 0.24, 1) 0.2s
    1 forwards;
}

.peeWordAnim {
  animation: peeWordSlideIn 1.05s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 forwards;
}

.storiesFreedomAnim {
  animation: storiesFreedomDrop 0.4s cubic-bezier(0.2, 0.6, 0.5, 0.5) 0.05s 1
    forwards;
}

.storiesToGoAnim {
  animation: storiesToGoSnap 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 forwards;
}

.peebolIntroAnim {
  animation: peebolTagRise 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0s 1
    forwards;
}

.peebolTitleAnim {
  animation: peebolHeadingSweep 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0s 1
    forwards;
}

.peebolBodyAnim {
  animation: peebolCopyLift 0.65s cubic-bezier(0.2, 0.9, 0.24, 1) 0s 1
    forwards;
}

.peebolImageAnim {
  animation:
    peebolProductSettle 0.95s cubic-bezier(0.18, 0.9, 0.24, 1) 0s 1 forwards,
    peebolProductFloat 3s ease-in-out 0.95s infinite alternate;
}

@keyframes handAnim {
  0% {
    transform: rotate(0) translate3d(100%, 0, 0);
  }

  100% {
    transform: rotate(24deg) translate3d(0, 0, 0);
  }
}

@keyframes handBob {
  0% {
    transform: rotate(24deg) translate3d(0, 0, 0);
  }

  100% {
    transform: rotate(24deg) translate3d(0, 18px, 0);
  }
}

@keyframes peeWordSlideIn {
  0% {
    transform: translate3d(-120vw, 0, 0) scaleX(1);
  }

  100% {
    transform: translate3d(0, 0, 0) scaleX(1);
  }
}

@keyframes storiesFreedomDrop {
  0% {
    visibility: visible;
    transform: translate3d(-0.16em, calc(-100% - 24vh), 0) rotate(-14deg)
      scale(1.06);
  }

  58% {
    visibility: visible;
    transform: translate3d(0.08em, 0.16em, 0) rotate(5deg) scale(0.985);
  }

  76% {
    visibility: visible;
    transform: translate3d(-0.03em, -0.07em, 0) rotate(-1.6deg) scale(1.01);
  }

  90% {
    visibility: visible;
    transform: translate3d(0.015em, 0.03em, 0) rotate(0.7deg) scale(0.998);
  }

  100% {
    visibility: visible;
    transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
  }
}

@keyframes storiesToGoSnap {
  0% {
    visibility: visible;
    opacity: 0;
    transform: translate3d(0, 0.45em, 0) scale(0.84, 1.14);
  }

  30% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0.12em, 0) scale(0.94, 1.06);
  }

  62% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, -0.05em, 0) scale(1.04, 0.96);
  }

  82% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0.015em, 0) scale(0.99, 1.01);
  }

  100% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes peebolTagRise {
  0% {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes peebolHeadingSweep {
  0% {
    opacity: 0;
    transform: translate3d(-48px, 0, 0) skewX(-8deg);
  }

  65% {
    opacity: 1;
    transform: translate3d(8px, 0, 0) skewX(1deg);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) skewX(0deg);
  }
}

@keyframes peebolCopyLift {
  0% {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes peebolProductSettle {
  0% {
    opacity: 0;
    transform: translate3d(72px, 22px, 0) rotate(10deg) scale(0.92);
  }

  70% {
    opacity: 1;
    transform: translate3d(-6px, -4px, 0) rotate(3deg) scale(1.01);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(4deg) scale(1);
  }
}

@keyframes peebolProductFloat {
  0% {
    transform: translate3d(0, 0, 0) rotate(4deg);
  }

  100% {
    transform: translate3d(0, 10px, 0) rotate(4deg);
  }
}

@keyframes solidPinkBtnAttentionLoop {
  0%,
  72%,
  100% {
    transform: rotate(-1deg) translate3d(0, 0, 0);
  }

  76% {
    transform: rotate(-1.7deg) translate3d(-1px, 0, 0);
  }

  80% {
    transform: rotate(-0.25deg) translate3d(1px, 0, 0);
  }

  84% {
    transform: rotate(-1.45deg) translate3d(-1px, 0, 0);
  }

  88% {
    transform: rotate(-0.55deg) translate3d(1px, 0, 0);
  }
}

@keyframes madeInBritainShine {
  0%,
  60%,
  100% {
    opacity: 0;
    transform: translate3d(-180%, 0, 0) rotate(12deg);
  }

  64% {
    opacity: 0.4;
    transform: translate3d(-120%, 0, 0) rotate(12deg);
  }

  74% {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(12deg);
  }

  84% {
    opacity: 0.4;
    transform: translate3d(120%, 0, 0) rotate(12deg);
  }

  88% {
    opacity: 0;
    transform: translate3d(180%, 0, 0) rotate(12deg);
  }
}

@keyframes madeInBritainAnim {
  0% {
    transform: translateX(120%) rotate(365deg);
  }

  100% {
    transform: translateX(0) rotate(5deg);
  }
}

@keyframes madeInBritainLogoAnim {
  0% {
    visibility: visible;
    z-index: 1;
    transform: rotate(-30deg) translateX(80%) scale(0.1);
  }

  70% {
    visibility: visible;
    z-index: 1;
    transform: rotate(-30deg) translateX(-50%) scale(1);
  }

  71% {
    visibility: visible;
    z-index: 4;
    transform: rotate(-30deg) translateX(-50%) scale(1);
  }

  100% {
    visibility: visible;
    z-index: 4;
    transform: rotate(-30deg) translateX(0) scale(1);
  }
}

@keyframes homepageBrandBadgeAnim {
  0% {
    visibility: visible;
    z-index: 1;
    transform: rotate(3deg) translate3d(0, 150%, 0) scale(0.92);
  }

  62% {
    visibility: visible;
    z-index: 1;
    transform: rotate(3deg)
      translate3d(0, var(--homepage-brand-badge-overshoot), 0) scale(1.03);
  }

  63% {
    visibility: visible;
    z-index: 3;
    transform: rotate(3deg)
      translate3d(0, var(--homepage-brand-badge-overshoot), 0) scale(1.03);
  }

  78% {
    visibility: visible;
    z-index: 3;
    transform: rotate(3deg) translate3d(0, 14%, 0) scale(0.985);
  }

  90% {
    visibility: visible;
    z-index: 3;
    transform: rotate(3deg) translate3d(0, -7%, 0) scale(1.012);
  }

  100% {
    visibility: visible;
    z-index: 3;
    transform: rotate(3deg) translate3d(0, 0, 0) scale(1);
  }
}