:root {
  --base: 16px;
  --grid-columns: 12;
  --color-primary-black-coffee: #1d1d1b;
  --color-primary-stainless-steel: #cac7c7;
  --color-primary-macchiato: #dbd7bd;
  --color-primary-milk: #f6f5ee;
  --color-misc-critical: #ff7157;
  --color-misc-success: #3d9867;
  --color-misc-loading-color: #f6f5ee;
  --color-text-black-coffee: #1d1d1b;
  --color-text-stainless-steel: #cac7c7;
  --color-text-subdued: #626262;
  --color-text-disabled: #898989;
  --color-text-milk: #f6f5ee;
  --color-text-critical: #ff7157;
  --color-text-line-item: #969696;
  --color-icon-black-coffee: #1d1d1b;
  --color-icon-disabled: #898989;
  --color-icon-stainless-steel: #cac7c7;
  --color-icon-milk: #f6f5ee;
  --color-icon-critical: #ff7157;
  --color-border-black-coffee: #1d1d1b;
  --color-border-stainless-steel: #cac7c7;
  --color-border-milk: #f6f5ee;
  --color-border-disabled: #898989;
  --color-border-critical: #ff7157;
  --color-border-subdued: #626262;
  --color-bg-black-coffee: #1d1d1b;
  --color-bg-black-coffee-hover: #3a3a3a;
  --color-bg-stainless-steel: #cac7c7;
  --color-bg-milk: #f6f5ee;
  --color-bg-disabled: #e8e8e8;
  --color-bg-macchiato: #dbd7bd;
  --color-bg-subdued: #626262;
  --color-scrollbar-black-coffee: #1d1d1b;
  --color-scrollbar-stainless-steel: #cac7c7;
  --spacing-mega: 64px;
  --spacing-jumbo: 48px;
  --spacing-xxxl: 40px;
  --spacing-xxl: 32px;
  --spacing-xl: 24px;
  --spacing-l: 16px;
  --spacing-m: 8px;
  --spacing-s: 4px;
  --spacing-xs: 4px;
  --spacing-xxs: 4px;
  --spacing-element-spacing: 32px;
  --z-index-top: 100;
  --z-index-below-modal: 8;
  --z-index-zero: 0;
  --z-index-below-zero: -1;
  --z-index-link-list__item: 10;
  --z-index-dropdown: 3;
  --z-index-below-dropdown: 2;
  --global-pt: var(--announcement-bar-height, 0);
  --action-target-area: 48px;
  --ios-navbar-area: 48px;
  --icon-size: 24px;
  --media-bg-color: #f8f5ee;
  --z-index-above-default: 1;
  --border-radius-block: 0;
  --border-radius-button: 0;
  --missing-countdown-gradient-1: #2d3133;
  --missing-countdown-gradient-2: #202324;
  --missing-button-primary-hover: #000;
  --missing-button-primary-active: #4d4e4f;
  --missing-button-primary-disabled: #20222380;
  --missing-button-secondary-active: #2022230a;
  --missing-button-secondary-disabled: #20222359;
  --missing-button-tertiary-border: #ffffff80;
  --missing-button-tertiary-hover-border: #ffffff1f;
  --missing-button-tertiary-active: #ffffff52;
  --missing-button-tertiary-disabled-border: #ffffff2e;
  --missing-button-tertiary-disabled-bg: #ffffff2e;
  --missing-button-tertiary-disabled: #fff6;
  --missing-button-size-active-bg: #2022230a;
  --missing-button-size-disabled: #20222380;
  --missing-dropdown-item-pressed: #f1f2f3;
  --missing-tabs-border-hover: #dce3e7;
  --missing-tabs-border-pressed: #92999c;
  --missing-facets-bg: #fffffff2;
  --missing-tag-hover-bg: #dff0ff
}

@media(min-width:1024px) {
  :root {
      --spacing-mega: 128px;
      --spacing-jumbo: 64px;
      --spacing-xxxl: 48px;
      --spacing-xxl: 40px;
      --spacing-xl: 32px;
      --spacing-l: 24px;
      --spacing-m: 16px;
      --spacing-s: 8px;
      --spacing-xs: 4px;
      --spacing-xxs: 4px;
      --spacing-element-spacing: 64px;
  }
}

html {
  box-sizing: border-box;
  height: 100%
}

input, ol, textarea, ul {
  margin: 0;
  padding: 0
}

input, textarea {
  color: inherit;
  font: inherit
}

*, :after, :before {
  border-width: 0;
  box-sizing: border-box
}

.aspect-ratio-1\:1 {
  aspect-ratio: 1;
  overflow: hidden;
  position: relative;
  width: 100%;
  z-index: 1
}


.is-invalid {
  border: 1px solid red !important;
}



body {
  background-color: var(--color-bg-milk);
  color: var(--color-text-black-coffee);
  font-family: inherit;
  line-height: inherit;
  margin: 0;
  min-height: 100%;
  min-height: calc(100vh - var(--global-pt, 0px));
  min-height: -webkit-fill-available;
  padding-top: var(--global-pt, 0)
}


.login-register-page h1,
.login-register-page h2,
.login-register-page h3,
.login-register-page h4,
.login-register-page h5,
.login-register-page h6 {
  font-size: inherit;
  font-weight: inherit;
}

.login-register-page a {
  text-decoration: inherit;
}

.login-register-page a,
.login-register-page button {
  color: inherit;
}

.login-register-page button {
  background-color: transparent;
  border: none;
  box-shadow: unset;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  margin: 0;
  overflow: visible;
  padding: 0;
  text-align: inherit;
  border-radius: 50px;
}

.login-register-page img {
  display: block;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}

.login-register-page .trailing-character:before {
  content: ",";
}

.login-register-page .w-12 {
  width: .75rem;
}
.login-register-page .h-12 {
  height: .75rem;
}
.login-register-page .w-16 {
  width: 1rem;
}
.login-register-page .h-16 {
  height: 1rem;
}
.login-register-page .w-24 {
  width: 1.5rem;
}
.login-register-page .h-24 {
  height: 1.5rem;
}

.login-register-page [type=email],
.login-register-page [type=number],
.login-register-page [type=password],
.login-register-page [type=search],
.login-register-page [type=tel],
.login-register-page [type=text],
.login-register-page textarea {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--color-bg-milk);
  border: 1px solid var(--color-border-stainless-steel);
  border-radius: 0;
  box-shadow: none;
  color: var(--color-text-black-coffee);
   font-family: 'fark', sans-serif;
  font-size: .75rem;
  font-weight: 300;
  letter-spacing: .07em;
  line-height: 1.75;
  outline: none;
  padding: .8125rem .875rem .75rem;
  width: 100%;
}

@media(min-width:1024px) {
  .login-register-page [type=email],
  .login-register-page [type=number],
  .login-register-page [type=password],
  .login-register-page [type=search],
  .login-register-page [type=tel],
  .login-register-page [type=text],
  .login-register-page textarea {
    font-size: .875rem;
    font-weight: 300;
    letter-spacing: .05em;
    line-height: 1.7142857143;
    padding: .6875rem .875rem;
  }
}

.login-register-page [type=email]::placeholder,
.login-register-page [type=number]::placeholder,
.login-register-page [type=password]::placeholder,
.login-register-page [type=search]::placeholder,
.login-register-page [type=tel]::placeholder,
.login-register-page [type=text]::placeholder,
.login-register-page textarea::placeholder {
  color: var(--color-text-subdued);
}

/* Focus, active, disabled, etc. */
.login-register-page [type=email]:focus,
.login-register-page [type=number]:focus,
.login-register-page [type=password]:focus,
.login-register-page [type=search]:focus,
.login-register-page [type=tel]:focus,
.login-register-page [type=text]:focus,
.login-register-page textarea:focus {
  border-color: var(--color-border-black-coffee);
}

.login-register-page [type=email]:focus::placeholder,
.login-register-page [type=number]:focus::placeholder,
.login-register-page [type=password]:focus::placeholder,
.login-register-page [type=search]:focus::placeholder,
.login-register-page [type=tel]:focus::placeholder,
.login-register-page [type=text]:focus::placeholder,
.login-register-page textarea:focus::placeholder {
  color: var(--color-text-black-coffee);
}

.login-register-page [type=email]:active,
.login-register-page [type=number]:active,
.login-register-page [type=password]:active,
.login-register-page [type=search]:active,
.login-register-page [type=tel]:active,
.login-register-page [type=text]:active,
.login-register-page textarea:active {
  border-color: var(--color-border-black-coffee);
  color: var(--color-text-black-coffee);
}

.login-register-page [type=email]:active::placeholder,
.login-register-page [type=number]:active::placeholder,
.login-register-page [type=password]:active::placeholder,
.login-register-page [type=search]:active::placeholder,
.login-register-page [type=tel]:active::placeholder,
.login-register-page [type=text]:active::placeholder,
.login-register-page textarea:active::placeholder {
  color: var(--color-text-black-coffee);
}

.login-register-page [type=email][disabled],
.login-register-page [type=number][disabled],
.login-register-page [type=password][disabled],
.login-register-page [type=search][disabled],
.login-register-page [type=tel][disabled],
.login-register-page [type=text][disabled],
.login-register-page textarea[disabled] {
  border-color: var(--color-border-disabled);
  color: var(--color-text-disabled);
}

.login-register-page [type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  background-color: #1d1d1b;
  border: 1px solid #1d1d1b;
  border-radius: 0;
  height: 1.125rem;
  margin: 0;
  outline: none;
  position: relative;
  width: 1.125rem;
}

.login-register-page [type=checkbox],
.login-register-page [type=checkbox] ~ label {
  cursor: pointer;
}



.field-option {
  grid-gap: 1rem;
  align-items: center;
  display: flex;
  margin: .25rem 0
}

.field-option label {
  flex: 1;
  word-break: break-word
}



.orea-heritage-section:first-child .hero__media:before {
  display: none
}

.orea-heritage-section:first-child .hero__video {
  left: 50%;
  max-width: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.orea-heritage-section:not(:first-child) .hero {
  --hero-media-ratio: 1.75
}

@media(min-width:1024px) {
  .orea-heritage-section:not(:first-child) .hero {
      --hero-media-ratio: 0.66667
  }
}

.marquee {
  display: block;
  overflow: hidden;
  width: 100%
}

.marquee:hover {
  cursor: pointer
}




.main-page__content h3 {
   font-family: 'fark', sans-serif;
  font-size: 1.5rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.25;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .main-page__content h3 {
      font-size: 2.25rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.2222222222;
      text-transform: uppercase
  }
}

.main-page__content h4 {
   font-family: 'fark', sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.4;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .main-page__content h4 {
      font-size: 1.5rem;
      font-weight: 400;
      letter-spacing: .06em;
      line-height: 1.5;
      text-transform: uppercase
  }
}

.main-page__content h5 {
   font-family: 'fark', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.5;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .main-page__content h5 {
      font-size: 1.25rem;
      font-weight: 400;
      letter-spacing: .06em;
      line-height: 1.3;
      text-transform: uppercase
  }
}

.main-page__content h6 {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 400;
  letter-spacing: .06em;
  line-height: 1.3571428571;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .main-page__content h6 {
      font-size: 1rem;
      font-weight: 400;
      letter-spacing: .08em;
      line-height: 1.5;
      text-transform: uppercase
  }
}

.main-page__content p {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  text-transform: none
}

@media(min-width:1024px) {
  .main-page__content p {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}
























/* main {
  margin-top: var(--header-height, 100px);
}


 */








































































.page-login-wrapper:not(.page-login) .page-login__back--button {
  --button-padding: 0px 2rem;
  align-items: center;
  background-color: #0000;
  border: 1px solid var(--color-border-stainless-steel);
  border-left: 0;
  border-radius: 0;
  border-right: 0;
  border-top: 1px solid #0000;
  color: var(--color-text-black-coffee);
  display: inline-block;
  display: flex;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-size: .75rem;
  font-weight: 300;
  left: 0;
  letter-spacing: .05em;
  letter-spacing: .07em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  line-height: 1.75;
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  padding-left: var(--spacing-m);
  position: absolute;
  text-align: center;
  text-decoration: none;
  top: 0;
  transition: border-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login-wrapper:not(.page-login) .page-login__back--button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login-wrapper:not(.page-login) .page-login__back--button:not(.page-login-wrapper:not(.page-login) .page-login__back--button[disabled]):hover {
  cursor: pointer
}

.page-login-wrapper:not(.page-login) .page-login__back--button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login-wrapper:not(.page-login) .page-login__back--button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login-wrapper:not(.page-login) .page-login__back--button:before {
  align-self: center;
  background-image: url(icon-arrow-left.844e4a7b2cf92a28.svg@fill=%231D1D1B);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 1.25rem;
  margin-right: var(--spacing-s);
  vertical-align: middle;
  width: 1.25rem
}

.page-login-wrapper:not(.page-login) .page-login__back--button:hover {
  background-color: var(--missing-button-tertiary-hover-border);
  border-color: var(--color-border-black-coffee)
}

.page-login-wrapper:not(.page-login) .page-login__back--button:active {
  background-color: var(--missing-button-tertiary-active);
  border-color: var(--color-border-milk)
}

.page-login-wrapper:not(.page-login) .page-login__back--button[disabled] {
  border-color: var(--color-border-stainless-steel);
  color: var(--color-text-disabled)
}

.page-login-wrapper:not(.page-login) .page-login__back--button[disabled]:before {
  align-self: center;
  background-image: url("icon-arrow-left.b0b0303df3e25523.svg@fill=rgba(246, 245, 238, 0.4)");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 1.25rem;
  margin-right: var(--spacing-s);
  vertical-align: middle;
  width: 1.25rem
}

@media(min-width:1024px) {
  .page-login-wrapper:not(.page-login) .page-login__back--button {
    font-size: .875rem;
    font-weight: 300;
    letter-spacing: .05em;
    line-height: 1.7142857143;
    margin-left: 0.5rem;
    margin-top: 44%;
    width: 50%;
  }
}

@media(max-width:1023px) {
  .page-login-wrapper:not(.page-login) .page-login__back--button {
      min-height: 3.375rem
  }

  .page-login-wrapper:not(.page-login) .page-login-wrapper__container {
      padding-top: 3.375rem
  }
}

.page-login-wrapper .page-login-wrapper__container {
  display: grid;
  position: relative
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login-wrapper__container {
      grid-template-columns: repeat(var(--grid-columns), 1fr)
  }
}

.page-login-wrapper .page-login-wrapper__column {
  grid-column: 1/span 12
}

@media(max-width:1023px) {
  .page-login-wrapper.page-login-wrapper--no-media-mobile .page-login-wrapper__column--last {
      display: none
  }
}

.page-login-wrapper .page-login__register {
  border-top: 1px solid var(--color-border-stainless-steel);
  margin-top: var(--spacing-m);
  padding-top: var(--spacing-xl)
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__register {
      margin-top: var(--spacing-l);
      padding-top: var(--spacing-xxl)
  }
}

.page-login-wrapper .page-login__register--button {
  --button-padding: 0px 2rem;
  background-color: #0000;
  border: 1px solid var(--color-border-stainless-steel);
  color: var(--color-text-black-coffee);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-xl);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: border-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__register--button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login-wrapper .page-login__register--button:not(.page-login-wrapper .page-login__register--button[disabled]):hover {
  cursor: pointer
}

.page-login-wrapper .page-login__register--button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__register--button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login-wrapper .page-login__register--button:hover {
  background-color: var(--missing-button-tertiary-hover-border);
  border-color: var(--color-border-black-coffee)
}

.page-login-wrapper .page-login__register--button:active {
  background-color: var(--missing-button-tertiary-active);
  border-color: var(--color-border-milk)
}

.page-login-wrapper .page-login__register--button[disabled] {
  border-color: var(--color-border-stainless-steel);
  color: var(--color-text-disabled)
}

.page-login-wrapper .page-login__register--text {
   font-family: 'fark', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__register--text {
      font-size: 1.25rem;
      font-weight: 400;
      letter-spacing: .06em;
      line-height: 1.3;
      text-transform: uppercase
  }
}

.page-login-wrapper .page-login__presentation-text {
  color: var(--color-text-black-coffee);
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  margin-top: var(--spacing-m);
  text-transform: none
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__presentation-text {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}

.page-login-wrapper .page-login__presentation-text p {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  text-transform: none
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__presentation-text p {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}

.page-login-wrapper .page-login__presentation-text a {
  text-decoration-color: initial;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 1px
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__presentation-text a {
      cursor: pointer
  }

  .page-login-wrapper .page-login__presentation-text a:hover {
      text-decoration-line: none
  }
}

.page-login-wrapper .page-login__presentation-text ol, .page-login-wrapper .page-login__presentation-text ul {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__presentation-text ol, .page-login-wrapper .page-login__presentation-text ul {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

@media(max-width:1023px) {
  .page-login-wrapper .page-login-wrapper__column--first {
      order: 2;
      padding: var(--spacing-xxl) var(--spacing-l) var(--spacing-jumbo)
  }
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login-wrapper__column--first {
      grid-column: 2/span 4;
      margin-bottom: var(--spacing-section-margin-bottom);
      margin-top: var(--spacing-s);
      padding-top: 3.5rem;
      margin-top: -170px;
  }
}

.page-login-wrapper .page-login-wrapper__column--first .page-login-wrapper__column-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center
}

.page-login-wrapper .page-login-wrapper__column--first .page-login__fields .field {
  margin-bottom: var(--spacing-m);
  max-width: 100%;
  width: 100%
}

.page-login-wrapper .page-login-wrapper__column--last {
  background-color: var(--color-bg-black-coffee);
  position: relative
}

@media(max-width:1023px) {
  .page-login-wrapper .page-login-wrapper__column--last {
      aspect-ratio: 16/9
  }
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login-wrapper__column--last {
      grid-column: 7/span 6;
      margin-bottom: 0
  }
}

@media(max-width:1023px) {
  .page-login-wrapper .page-login-wrapper__column--last .page-login__content {
      display: none
  }

}

.page-login-wrapper .login-page__image-wrapper {
  aspect-ratio: 16/9
}

.page-login-wrapper .login-page__image-wrapper img {
  object-fit: cover;
  width: 100%
}

@media(min-width:1024px) {
  .page-login-wrapper .login-page__image-wrapper {
      aspect-ratio: 4/5
  }
}

@media(max-width:1023px) {
  .page-login-wrapper .login-page__image--mobile-hidden {
      display: none
  }
}

@media(min-width:1024px) {
  .page-login-wrapper .login-page__image--desktop-hidden {
      display: none
  }
}

.page-login-wrapper .page-login__activate-account--text-link {
  display: inline;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .06em;
  line-height: 1.4285714286;
  text-decoration-color: initial;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 1px;
  width: max-content
}

@media(min-width:1024px) {
  .page-login-wrapper .page-login__activate-account--text-link {
      cursor: pointer
  }

  .page-login-wrapper .page-login__activate-account--text-link:hover {
      text-decoration-line: none
  }

  .page-login-wrapper .page-login__activate-account--text-link {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .05em;
      line-height: 1.625
  }
}

@media(max-width:1023px) {
  .page-login-wrapper .page-login__activate-account--text-link {
      line-height: 3rem
  }
}

.page-login .page-login__title {
   font-family: 'fark', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.15625;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login .page-login__title {
      font-size: 2.5rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.1;
      text-transform: uppercase
  }
}

.page-login .page-login__fields .field:last-child {
  margin-bottom: 0
}

.page-login .page-login__form {
  margin-top: var(--spacing-xl)
}

.page-login .page-login__button-wrapper {
  display: flex;
  flex-direction: column-reverse;
  gap: var(--spacing-s)
}

@media(min-width:1024px) {
  .page-login .page-login__button-wrapper {
      align-items: center;
      gap: var(--spacing-m)
  }
}

.page-login .page-login__login--button {
  --button-padding: 0px 2rem;
  background-color: var(--color-bg-black-coffee);
  border: 1px solid var(--color-bg-black-coffee);
  color: var(--color-text-milk);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-xl);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: background-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login .page-login__login--button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login .page-login__login--button:not(.page-login .page-login__login--button[disabled]):hover {
  cursor: pointer
}

.page-login .page-login__login--button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login .page-login__login--button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login .page-login__login--button:hover {
  background-color: var(--color-bg-black-coffee-hover)
}

.page-login .page-login__login--button:active {
  background-color: var(--missing-button-primary-active);
  border-color: var(--missing-button-primary-active)
}

.page-login .page-login__login--button[disabled] {
  background-color: var(--color-bg-disabled);
  border-color: var(--color-bg-disabled);
  color: var(--color-text-disabled)
}

@media(min-width:1024px) {
  .page-login .page-login__login--button {
      margin-top: var(--spacing-xxl)
  }
}

.page-login__activate-account .page-login-activate-account__title {
   font-family: 'fark', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.15625;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__title {
      font-size: 2.5rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.1;
      text-transform: uppercase
  }
}

.page-login__activate-account .page-login-activate-account__text {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  margin-top: var(--spacing-m);
  text-transform: none
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__text {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}

.page-login__activate-account .page-login-activate-account__form {
  margin-top: var(--spacing-l)
}

.page-login__activate-account .page-login-activate-account__button, .page-login__activate-account .page-login-activate-account__button--decline {
  width: 100%
}

.page-login__activate-account .page-login-activate-account__button {
  --button-padding: 0px 2rem;
  background-color: var(--color-bg-black-coffee);
  border: 1px solid var(--color-bg-black-coffee);
  color: var(--color-text-milk);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: background-color .2s ease-in-out
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login__activate-account .page-login-activate-account__button:not(.page-login__activate-account .page-login-activate-account__button[disabled]):hover {
  cursor: pointer
}

.page-login__activate-account .page-login-activate-account__button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login__activate-account .page-login-activate-account__button:hover {
  background-color: var(--color-bg-black-coffee-hover)
}

.page-login__activate-account .page-login-activate-account__button:active {
  background-color: var(--missing-button-primary-active);
  border-color: var(--missing-button-primary-active)
}

.page-login__activate-account .page-login-activate-account__button[disabled] {
  background-color: var(--color-bg-disabled);
  border-color: var(--color-bg-disabled);
  color: var(--color-text-disabled)
}

.page-login__activate-account .page-login-activate-account__button--decline {
  --button-padding: 0px 2rem;
  background-color: #0000;
  border: 1px solid var(--color-border-stainless-steel);
  color: var(--color-text-black-coffee);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-m);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: border-color .2s ease-in-out
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__button--decline {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login__activate-account .page-login-activate-account__button--decline:not(.page-login__activate-account .page-login-activate-account__button--decline[disabled]):hover {
  cursor: pointer
}

.page-login__activate-account .page-login-activate-account__button--decline[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login__activate-account .page-login-activate-account__button--decline {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login__activate-account .page-login-activate-account__button--decline:hover {
  background-color: var(--missing-button-tertiary-hover-border);
  border-color: var(--color-border-black-coffee)
}

.page-login__activate-account .page-login-activate-account__button--decline:active {
  background-color: var(--missing-button-tertiary-active);
  border-color: var(--color-border-milk)
}

.page-login__activate-account .page-login-activate-account__button--decline[disabled] {
  border-color: var(--color-border-stainless-steel);
  color: var(--color-text-disabled)
}

@media(max-width:1023px) {
  .page-login__activate-account .page-login-activate-account__button--decline {
      display: none
  }
}

.page-login__activate-account .page-login__activate-account--decline {
  background-color: #0000
}

@media(min-width:1024px) {
  .page-login__activate-account.page-login-wrapper .page-login__back--button {
      display: none
  }
}

.page-login__create-account .page-create-account__form {
  margin-top: var(--spacing-l)
}

.page-login__create-account .page-login-create-account__button {
  --button-padding: 0px 2rem;
  background-color: var(--color-bg-black-coffee);
  border: 1px solid var(--color-bg-black-coffee);
  color: var(--color-text-milk);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-l);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: background-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login__create-account .page-login-create-account__button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login__create-account .page-login-create-account__button:not(.page-login__create-account .page-login-create-account__button[disabled]):hover {
  cursor: pointer
}

.page-login__create-account .page-login-create-account__button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login__create-account .page-login-create-account__button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login__create-account .page-login-create-account__button:hover {
  background-color: var(--color-bg-black-coffee-hover)
}

.page-login__create-account .page-login-create-account__button:active {
  background-color: var(--missing-button-primary-active);
  border-color: var(--missing-button-primary-active)
}

.page-login__create-account .page-login-create-account__button[disabled] {
  background-color: var(--color-bg-disabled);
  border-color: var(--color-bg-disabled);
  color: var(--color-text-disabled)
}

.page-login__create-account .page-login-create-account__title {
   font-family: 'fark', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.15625;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login__create-account .page-login-create-account__title {
      font-size: 2.5rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.1;
      text-transform: uppercase
  }
}

.page-login__recover-password .page-login-recover-password__title {
   font-family: 'fark', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.15625;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login__recover-password .page-login-recover-password__title {
      font-size: 2.5rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.1;
      text-transform: uppercase
  }

  .page-login__recover-password .page-login-recover-password__form {
      margin-top: var(--spacing-l)
  }
}

.page-login__recover-password .page-login-recover-password__form-wrapper .page-login-recover-password__form {
  margin-top: var(--spacing-l)
}

.page-login__recover-password .page-login-recover-password__text {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  margin-top: var(--spacing-m);
  text-transform: none
}

@media(min-width:1024px) {
  .page-login__recover-password .page-login-recover-password__text {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}

.page-login__recover-password .page-login-recover-password__button {
  --button-padding: 0px 2rem;
  background-color: var(--color-bg-black-coffee);
  border: 1px solid var(--color-bg-black-coffee);
  color: var(--color-text-milk);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-m);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: background-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login__recover-password .page-login-recover-password__button {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login__recover-password .page-login-recover-password__button:not(.page-login__recover-password .page-login-recover-password__button[disabled]):hover {
  cursor: pointer
}

.page-login__recover-password .page-login-recover-password__button[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login__recover-password .page-login-recover-password__button {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login__recover-password .page-login-recover-password__button:hover {
  background-color: var(--color-bg-black-coffee-hover)
}

.page-login__recover-password .page-login-recover-password__button:active {
  background-color: var(--missing-button-primary-active);
  border-color: var(--missing-button-primary-active)
}

.page-login__recover-password .page-login-recover-password__button[disabled] {
  background-color: var(--color-bg-disabled);
  border-color: var(--color-bg-disabled);
  color: var(--color-text-disabled)
}

@media(min-width:1024px) {
  .page-login__recover-password .page-login-recover-password__button {
      margin-top: var(--spacing-l)
  }
}

.page-login__reset-password .page-login-reset-password__title {
   font-family: 'fark', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: .05em;
  line-height: 1.15625;
  text-transform: uppercase
}

@media(min-width:1024px) {
  .page-login__reset-password .page-login-reset-password__title {
      font-size: 2.5rem;
      font-weight: 400;
      letter-spacing: .04em;
      line-height: 1.1;
      text-transform: uppercase
  }
}

.page-login__reset-password .page-login-reset-password__text {
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  margin-top: var(--spacing-m);
  text-transform: none
}

@media(min-width:1024px) {
  .page-login__reset-password .page-login-reset-password__text {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625;
      text-transform: none
  }
}

.page-login__reset-password .page-login-reset-password__form {
  margin-top: var(--spacing-l)
}

.page-login__reset-password .button--reset-password {
  --button-padding: 0px 2rem;
  background-color: var(--color-bg-black-coffee);
  border: 1px solid var(--color-bg-black-coffee);
  color: var(--color-text-milk);
  display: inline-block;
   font-family: 'fark', sans-serif;
  font-size: .875rem;
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1.6428571429;
  line-height: var(--action-target-area);
  margin-top: var(--spacing-m);
  min-height: var(--action-target-area);
  min-width: var(--action-target-area);
  padding: var(--button-padding);
  text-align: center;
  transition: background-color .2s ease-in-out;
  width: 100%
}

@media(min-width:1024px) {
  .page-login__reset-password .button--reset-password {
      font-size: 1rem;
      font-weight: 300;
      letter-spacing: .06em;
      line-height: 1.625
  }
}

.page-login__reset-password .button--reset-password:not(.page-login__reset-password .button--reset-password[disabled]):hover {
  cursor: pointer
}

.page-login__reset-password .button--reset-password[disabled] {
  pointer-events: none
}

@media(min-width:1024px) {
  .page-login__reset-password .button--reset-password {
      --button-padding: 0 2.625rem;
      line-height: var(--action-target-area)
  }
}

.page-login__reset-password .button--reset-password:hover {
  background-color: var(--color-bg-black-coffee-hover)
}

.page-login__reset-password .button--reset-password:active {
  background-color: var(--missing-button-primary-active);
  border-color: var(--missing-button-primary-active)
}

.page-login__reset-password .button--reset-password[disabled] {
  background-color: var(--color-bg-disabled);
  border-color: var(--color-bg-disabled);
  color: var(--color-text-disabled)
}

@media(min-width:1024px) {
  .page-login__reset-password .button--reset-password {
      margin-top: var(--spacing-l)
  }
}





@media only screen and (max-width: 767px) {
  .page-login-wrapper .login-page__image-wrapper img {
    object-fit: cover;
    width: 45%
  }

  .page-login-wrapper .login-page__image-wrapper img {
    object-fit: contain; /* Ajuste l'image sans la couper */
    height: auto;
    max-height: 300px; /* Ajuste selon ton design */
}

.login-register-page img {
    max-width: 90%; /* Évite que l'image prenne toute la largeur sur mobile */
    margin: 0 auto; /* Centre l'image */
}

  login-wrapper__container {
    padding-top: 0rem;
}
  }


  @media only screen and (max-width: 1000px) {
    .page-login-wrapper .login-page__image-wrapper img {
      object-fit: cover;
      width: 40%
    } 
  }