.page .rte p {
  margin: 0.75em 0;
  font-size: 16px;
  text-transform: none;
  font-family: eb-garamond, serif;
  line-height: 1.6;
}

.page .container {
  max-width: 1200px;
}

.page .rte,
.page h1 {
  padding-top: 50px;
}

.pdp-content__wrapper .tabs,
.pdp-section__recommendations {
  max-width: 75%;
  margin: auto;
  padding-top: 40px;
}

.product main#MainContent {
  max-width: 2400px;
  margin: auto;
}

.pdp-section__content .pdp-section__recommendations-item {
  padding: 5px;
}
.pdp-section__content .pdp-section__recommendations-feed,
.pdp-section__content .pdp-section__recommendations {
  padding-top: 0;
}

.pdp-section__content .pdp-section__recommendations-feed {
  margin-left: -5px;
}

.page h2,
.page h3 {
  font-weight: normal;
  font-size: 24px;
  text-transform: uppercase;
}

.page h4 {
  font-weight: normal;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: bold;
}

.page .wp-block-columns {
  padding: 25px 0;
}

.page ul {
  font-family: eb-garamond, serif;
  padding-left: 15px;
}

body.stockists .is-layout-flex {
  display: flex;
}

.stockists :where(.wp-block-columns.is-layout-flex) {
  gap: 2em;
}
.stockists :where(.wp-block-columns) {
  margin-bottom: 1.75em;
}

.stockists .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
  flex-basis: 0;
  flex-grow: 1;
}
body .is-layout-flex > * {
  margin: 0;
}

.stockists div.rte a:not(.themeless) {
  color: black;
}

a.pagination__item.pagination__item--current.light {
  color: black;

  border-bottom: 2px solid black;
}
.product-category-text p {
  font-size: 19px;
}

.main-collection__details-content {
  max-width: 40%;
}

.main-collection__details {
  padding-top: 7rem;
}

a.pagination__item {
  padding: 0 5px;
}

div#pdpDescriptionPanel p {
  text-align: left !important;
}

.page footer ul {
  padding-left: 0;
}

.product-quickshop__content.pdp-section__content {
  text-align: center;
}

.customer-service-bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border-top: 1px solid #ccc;
  margin-top: 25px;
  padding-top: 25px;
  padding-bottom: 25px;
}

.btn {
  padding: 10px 25px 17px;
  text-decoration: none !important;
  line-height: 1;
}

/***********************    QA Fixes ( 27-09-2024 )    ***********************/

.pdp-content__title,
.pdp-content__title + span {
  color: #333;
}

.product-quickshop {
  z-index: 11;
  align-items: start;
}

button.embla__button.themeless:disabled {
  display: none;
}

.product-quickshop__wrapper.pdp-section {
  height: calc(100vh - 20vh);
  overflow-y: auto;
  margin-top: 10vh;
}

.main-collection__grid
  .product-card__media
  responsive-picture
  img.object-cover {
  -o-object-fit: unset;
  object-fit: unset;
}

@media screen and (min-width: 768px) and (max-width: 1270px) {
  .recently-viewed__content .cta {
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-left: -30px;
  }
}

@media screen and (max-width: 1270px) {
  .product-quickshop__wrapper.pdp-section {
    overflow-y: auto;
    height: 85vh;
  }

  quick-add-modal .pdp-section {
    padding-bottom: 0px;
  }
  quick-add-modal .pdp-content__wrapper {
    padding-top: 0px;
  }
  quick-add-modal .pdp-section__content {
    padding-right: 0rem;
  }
  quick-add-modal .quick-add-modal__content-info {
    --modal-padding: 2.5rem;
  }
  quick-add-modal .quick-add-modal__toggle {
    padding: 0.5rem;
    width: 2rem;
    top: 1rem;
    right: 1.7rem;
  }
  quick-add-modal quantity-input {
    padding: 7px;
  }
  quick-add-modal .product-form__actions {
    display: flex;
    gap: 10px;
    flex-direction: column;
  }
  quick-add-modal .product-form__actions .quantity-wrapper {
    width: 100%;
  }
  quick-add-modal #pdpFormSubmitWrapper {
    width: 100%;
  }
  quick-add-modal .pdp-content__wrapper .tabs,
  quick-add-modal .pdp-section__recommendations {
    max-width: 100%;
    padding-top: 0px;
  }
  quick-add-modal .pdp-content__main {
    max-width: 100%;
  }
}

@media screen and (max-width: 1024px) {
  ul.social-icons {
    flex-wrap: wrap;
    padding: 0 10px;
    margin: 30px 0px 20px;
    gap: 10px;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (max-width: 768px) {
  quick-add-modal .quick-add-modal__content-info {
    margin-bottom: 3rem;
  }
  .pdp-content__main {
    max-width: 75%;
  }
  .drawer-panel.open_new {
    visibility: visible;
    opacity: 1;
    --tw-translate-y: 0%;
  }
  a.header-actions__cart {
    position: relative;
  }
  .header-actions__cart .cart-count {
    top: -8px;
    right: -5px;
    position: absolute;
    padding-bottom: 3px;
  }

  dropdown-menu.account-link {
    display: none;
  }

  #mobile-navigation-drawer button.mobile-navigation__search-submit {
    padding: 5px;
    background: #fff !important;
  }
  #mobile-navigation-drawer .mobile-navigation__search-submit svg {
    height: 1.2rem;
    width: 1.2rem;
  }
  #mobile-navigation-drawer a[href="/account"] {
    display: none;
  }
  #mobile-navigation-drawer .quick-add-modal__toggle {
    padding: 0rem;
    top: 1.5rem;
    right: 0rem;
  }
  #mobile-navigation-drawer .mobile-navigation__container {
    padding-top: 90px;
  }
  .mobile-navigation-wrap {
    position: relative;
  }

  embla-carousel.pdp-media__thumbnails {
    display: none;
  }

  .pdp-media__main .opacity-0 {
    opacity: 1;
  }

  .pdp-media__main .embla__container {
    touch-action: unset;
  }

  .hero-modal.active {
    top: inherit;
    bottom: 5%;
    visibility: visible;
    width: 100%;
    z-index: 3;
  }

  /************************ Global *****************************/
  a.mobile-account-link {
    display: block;
  }

  .header.stuck .header-wrapper .header-navigation {
    display: none;
  }
  .header.stuck .header-wrapper {
    grid-template-areas: "search logo logo logo account-cart";
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    padding-bottom: 0.625rem;
  }
  body .header-actions__cart,
  body .header-actions > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: 0;
    margin-right: 0;
  }
  a.search-link.mobile-search-link {
    display: block;
  }
  a.search-link.mobile-search-link svg {
    height: 1rem;
    margin-right: 0.4rem;
    width: 1rem;
    margin-top: 0.2rem;
  }
  a.account-link.mobile-account-link img {
    height: 1.1rem;
    width: 1.1rem;
    margin-right: 0.4rem;
    margin-top: 0.2rem;
  }

  body .header.stuck .header-actions,
  body .header.stuck .header-logo {
    padding-bottom: 0;
  }

  body .header.stuck .header-search {
    display: block;
  }
  .hero-pagination {
    bottom: 1rem;
  }
  .shop-this-look {
    bottom: 3rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    max-width: 190px;
    padding: 0.375rem 1.5rem 0.625rem;
  }
  .w-full.keen-slider.hero-slider {
    min-height: 420px !important;
  }

  /*************************************************************/

  /************************* Home page *************************/
  .template-index .hero-slider .hero-slide__content {
    justify-content: center;
  }
  .template-index .hero-slider .responsive-picture {
    height: 100%;
  }
  .shoppable-banner__content[data-x] {
    align-items: center;
    justify-content: center;
    left: 0;
    right: 0;
  }

  .shoppable-banner__content[data-y="bottom"] {
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .shoppable-banner__body {
    padding-right: 0;
    text-align: center;
  }
  .shoppable-banner__title {
    padding-right: 0;
  }
  /*******************************************************************/

  /************************* Collection page *************************/
  .template-collection .main-collection__details-content {
    max-width: 100%;
    width: 100%;
    flex-basis: 100%;
  }
  .template-collection .main-collection__details-categories {
    margin-top: 2.5rem;
  }
  .template-collection .main-collection__details-categories {
    padding-left: 0.001rem;
    margin-top: 2.5rem;
  }
  .template-collection .main-collection__details {
    display: flex;
    padding: 3.5rem 2.5rem;
    flex-wrap: wrap;
  }
  .collection-shoppable__banners {
    display: flex;
    flex-wrap: wrap;
  }
  .collection-shoppable__banner {
    flex: 0 0 100%;
    width: 100%;
  }
  /*******************************************************************/

  .faq-container img,
  .faq-container > div {
    width: 100% !important;
  }
  .pdp-content__wrapper {
    padding-top: 2rem;
    text-align: center;
  }
  .product-carousel__arrow {
    z-index: 1;
  }
}

@media screen and (max-width: 600px) {
  quantity-input button {
    padding: 20px;
  }
  quantity-input {
    padding: 7px;
  }
  .product-form__actions {
    display: flex;
    gap: 10px;
    flex-direction: column;
  }
  .product-form__actions .quantity-wrapper {
    width: 100%;
  }
  #pdpFormSubmitWrapper {
    width: 100%;
  }
}

@media screen and (max-width: 480px) {
  body .announcement-item a {
    font-size: 10px;
  }
  body .hero-slide__content h2 {
    font-size: 2rem;
  }
  .main-collection__details-categories ul a {
    font-size: 14px;
  }
}
@media screen and (max-width: 440px) {
  .header-actions__cart svg {
    height: 1rem;
    width: 1rem;
  }
  a.search-link.mobile-search-link svg {
    height: 0.8rem;
    margin-right: 0.1rem;
    width: 0.8rem;
    margin-top: 0.2rem;
  }
  a.account-link.mobile-account-link img {
    height: 0.8rem;
    width: 0.8rem;
    margin-right: 0.1rem;
    margin-top: 0.2rem;
  }
}

@media screen and (max-width: 360px) {
  body .announcement-item a {
    font-size: 10px;
  }
  body .hero-slide__content h2 {
    font-size: 2rem;
  }
  .main-collection__details-categories ul a {
    font-size: 10px;
  }
}

/*****************************************************************************/

/* MICHAEL IN BROWSER 10 - 10 */

@media screen and (max-width: 768px) {
  .quickshop {
    display: none !important;
  }
}

body .mobile-navigation__menu {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

body .mobile-navigation__menu-item {
  border: 0;
  padding: 0;
  background-color: transparent;
}

body .mobile-navigation__menu-item > button {
  font-size: 30px;
  padding: 0;
  line-height: 1.5;
  background-color: transparent !important;
  color: #000 !important;
}

body #mobile-navigation-drawer {
  background: #f6f2e6;
}
#mobile-navigation-drawer .quick-add-modal__toggle {
  background-color: transparent !important;
}

#mobile-navigation-drawer .quick-add-modal__toggle svg {
  color: black;
}

.small-mobile-item {
  color: #000 !important;
  padding: 10px 0;
  font-size: 20px !important;
  line-height: 1.5 !important;
}

.line-spacer {
  padding-top: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid black;
  display: block;
  width: 100%;
}
body .mobile-navigation__search {
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  body .recently-viewed__section {
    display: none;
  }

  .pdp-section__recommendations-feed {
    flex-wrap: wrap;
  }

  .pdp-alsoloved__wrapper {
    padding: 0;
  }

  .product-carousel__arrow.product-carousel__next {
    right: -1rem;
  }

  .product-carousel__arrow.product-carousel__previous {
    left: -1rem;
  }

  .pdp-alsoloved__wrapper h2 {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
  }

  .layout-main-header .header-item[data-placement="account-cart"] {
    justify-content: space-around;
  }

  .template-page main#MainContent {
    padding-left: 25px;
    padding-right: 25px;
  }

  .faq-container > div {
    padding-left: 0 !important;
  }
}
5 @media (min-width: 768px) {
  .newsletter-banner__wrapper {
    max-width: 1100px !important;
  }
}

.cart-drawer__item-options span {
  font-size: 10px;
}

theme-drawer#cart-drawer {
  overflow-y: scroll;
}

quantity-input input {
  -moz-appearance: textfield;
}

/* Product page Zoom fixes */

.product .pswp__img,
.product .pswp__zoom-wrap {
  transform: none !important;
  transition: none !important;
  transform-origin: unset !important;
  position: unset;
}
.product .pswp .pswp__zoom-wrap img {
  width: 100% !important;
  height: 100dvh !important;
  max-width: none;
  object-fit: contain;
  padding: 1rem;
}
.product .pswp--open.cross-button-clicked {
  display: none;
}

@media only screen and (min-width: 768px) {
  .product .pswp--open:not(.pswp--ui-visible) .pswp__zoom-wrap {
    display: none;
  }
}
/* Product page Zoom fixes */

.mobile-navigation__menu-go-back svg {
  height: 0.75rem;
  width: 0.75rem;
  margin-right: 5px;
  margin-top: -2px;
}

.mobile-navigation__menu-go-back {
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
  width: 100%;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.mobile-navigation__menu-pane.open ul li {
  width: 100%;
}

.keen-slider.fader .keen-slider__slide:after {
  content: "x";
  font-size: 0;
  width: 100%;
  height: 60%;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.hero-slide__content {
  justify-content: center;
  z-index: 1;
  padding-top: 4rem;

  /*background: radial-gradient(circle, rgba(69,53,52,0.75) 0%, rgba(89,60,59,0.4) 34%, rgba(157,108,106,0) 71%);*/
}

.megamenu__menu {
  grid-template-rows: repeat(var(--row-count), 1fr);
  grid-auto-flow: column;
}

theme-carousel[data-fade="true"] .keen-slider__slide:not(.slide__selected) {
  pointer-events: none;
}

theme-carousel[data-fade="true"] .slide__selected {
  pointer-events: auto;
}

/* ==========================================================================
   Collection card badge — text on a white rectangle, top left (supersedes the
   mobile circle sizing from dev request 1, which is moot now the card badge is
   not a circle).

   The component ships an absolutely positioned pill at top/right 1.25rem and
   paints it with two inline custom properties: --background for the fill and
   --color for the ink. The fill is white here regardless of configuration, so
   the ink cannot be --color (white text on a white block); the badge takes its
   own --background as the text colour instead: the sold-out badge (black on
   white) reads black, and a sale badge reads in its accent.

   Card-scoped on purpose — the PDP badge is untouched.
   ========================================================================== */
.product-card__media product-badge,
.product-card__media product-badge[data-shape='circle'],
.product-card__media product-badge[data-shape='square'] {
  top: 10px;
  left: 10px;
  right: auto;
  aspect-ratio: auto;
  border-radius: 0;
  background-color: #fff;
  color: var(--background);
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
  padding: 5px 15px;
  text-align: left;
  justify-content: flex-start;
}

.product-card__media product-badge span,
.product-card__media product-badge[data-shape='circle'] span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: 1.1;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .product-card__media product-badge span,
  .product-card__media product-badge[data-shape='circle'] span {
    font-size: 10px;
  }
}

/* The sale badge is the one exception: same rectangle, but filled with its own
   configured colours (#a2706d, white ink). The compiled component exposes no
   badge type in the markup, only the inline colours it paints, so this matches
   on the fill. If the Sale Badge background is changed in the theme editor,
   update the value here too — otherwise it falls back to the white block. */
.product-card__media product-badge[style*='--background: #a2706d' i] {
  background-color: var(--background);
  color: var(--color);
}

/* ==========================================================================
   Dev request 2 — Sale emphasis
   The was-price used to be inline-styled `opacity:0.6` in the same colour as
   the live price, which is the exact complaint in the brief. It now takes its
   own colour from the Sale Emphasis theme setting (--sale-compare-color).
   ========================================================================== */
.money-compare {
  text-decoration: line-through;
  color: var(--sale-compare-color, #ac7674);
  opacity: 1;
}

/* The drawer drops its own 2rem side padding when an upsell block is present
   (.cart-drawer__section:has(.cart-drawer__upsell)) and the component stylesheet
   hands that padding back to five children by name - header, table, warnings,
   subtotal, taxes message - but not to the Special Instructions block, which is
   why it alone sat flush against the edge. An upsell IS configured on this store
   (make-it-a-party), so this is the state customers see whenever that product is
   not already in the cart. Same selector shape, same 2rem, so it lines up with
   the subtotal directly above it. */
.cart-drawer__section:has(.cart-drawer__upsell) .cart-drawer__footer-instructions {
  padding-left: 2rem;
  padding-right: 2rem;
}

.money-sale {
  color: var(--sale-price-color, #a2706d);
}

/* Collection cards, PDP and quick shop: the was-price takes the brand pink,
   the same #a2706d as the sale badge fill. Hard-coded rather than
   --sale-compare-color so it stays matched to the badge. */
.product-card__details .money-compare,
.pdp-content__price .money-compare {
  color: #a2706d;
}

/* Same places: the price actually paid is black, so the pink strikethrough is
   the only coloured price. */
.product-card__details .money-sale,
.pdp-content__price .money-sale {
  color: #000;
}

.product-sale-promo {
  display: block;
  margin-top: 2px;
  color: var(--sale-compare-color, #ac7674);
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.pdp-content__price + .product-sale-promo {
  margin-top: 6px;
}

/* ==========================================================================
   Dev request 3 — Cart drawer quantity stepper
   ========================================================================== */
.cart-drawer__item-qty {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  font-size: 0.75rem;
  line-height: 1rem;
}

.cart-drawer__item-qty-btn {
  /* Light grey. The border is currentColor, so this paints the glyph and the
     ring together. Kept a literal, not a shared variable: these buttons are
     chrome, not sale styling. */
  color: #b3b3b3;
  /* ~15% smaller than the original 22px circle, glyph scaled with it. */
  width: 19px;
  height: 19px;
  font-size: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid currentColor;
  border-radius: 9999px;
  line-height: 1;
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.cart-drawer__item-qty-btn:hover {
  opacity: 0.6;
}

.cart-drawer__item-qty-btn[aria-busy='true'] {
  opacity: 0.4;
  pointer-events: none;
}

.cart-drawer__item-qty-value {
  min-width: 1.25em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Dev request 4 — Product card image alts
   Mobile swipe is native scroll-snap; the arrows are desktop-only and appear
   on hover. `aspect-ratio` on the track keeps the grid from reflowing before
   the slides have measured.
   ========================================================================== */
.product-card__gallery {
  position: relative;
  width: 100%;
}

.product-card__gallery-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}

.product-card__gallery-track::-webkit-scrollbar {
  display: none;
}

.product-card__gallery-track > .product-card__slide {
  flex: 0 0 100%;
  scroll-snap-align: start;
}

.product-card__gallery-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 28px;
  height: 28px;
  display: none;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.85);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.product-card__gallery-nav svg {
  width: 10px;
  height: 10px;
}

.product-card__gallery-nav--prev {
  left: 10px;
  transform: translateY(-50%) rotate(180deg);
}

.product-card__gallery-nav--next {
  right: 10px;
}

@media (min-width: 769px) {
  .product-card__gallery-nav {
    display: flex;
  }

  .product-card__gallery:hover .product-card__gallery-nav,
  .product-card__gallery-nav:focus-visible {
    opacity: 1;
  }
}

/* ==========================================================================
   Dev request 6 — Welcome offer sticky bubble
   ========================================================================== */
.sticky-signup {
  position: fixed;
  bottom: 20px;
  z-index: 40;
  display: flex;
  align-items: flex-end;
  gap: 6px;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.sticky-signup.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.sticky-signup--right {
  right: 20px;
  flex-direction: row;
}

.sticky-signup--left {
  left: 20px;
  flex-direction: row-reverse;
}

.sticky-signup__trigger {
  background: var(--sale-compare-color, #ac7674);
  color: #f6f2e6;
  border-radius: 9999px;
  padding: 12px 20px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

.sticky-signup__dismiss {
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  align-self: flex-start;
}

.sticky-signup__dismiss svg {
  width: 8px;
  height: 8px;
}

.sticky-signup__panel {
  position: absolute;
  bottom: calc(100% + 10px);
  right: 0;
  width: min(320px, calc(100vw - 40px));
  background: #fff;
  padding: 20px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
}

.sticky-signup--left .sticky-signup__panel {
  right: auto;
  left: 0;
}

.sticky-signup__heading {
  margin-bottom: 10px;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .sticky-signup {
    bottom: 14px;
  }

  .sticky-signup--right {
    right: 14px;
  }

  .sticky-signup--left {
    left: 14px;
  }
}

/* ==========================================================================
   Dev request 7 — EU withdrawal form
   ========================================================================== */
.eu-withdrawal .container {
  max-width: 640px;
  margin: auto;
  padding: 50px 20px 80px;
}

.eu-withdrawal__heading {
  text-transform: uppercase;
  font-size: 24px;
  letter-spacing: 1px;
  margin-bottom: 16px;
}

.eu-withdrawal__intro {
  margin-bottom: 28px;
}

.eu-withdrawal__step {
  border: 0;
  padding: 0;
  margin: 0 0 24px;
}

.eu-withdrawal__legend {
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
  margin-bottom: 14px;
  opacity: 0.7;
}

.eu-withdrawal__label {
  display: block;
  font-size: 13px;
  margin: 14px 0 4px;
}

.eu-withdrawal__optional {
  opacity: 0.6;
}

.eu-withdrawal__input {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(0, 0, 0, 0.25);
  background: transparent;
  font-size: 14px;
}

.eu-withdrawal__textarea {
  resize: vertical;
}

.eu-withdrawal__summary {
  border: 1px solid rgba(0, 0, 0, 0.15);
  padding: 14px 16px;
  margin-bottom: 18px;
  font-size: 14px;
}

.eu-withdrawal__summary-row {
  display: flex;
  gap: 10px;
  padding: 3px 0;
}

.eu-withdrawal__summary-row dt {
  flex: 0 0 40%;
  opacity: 0.65;
}

.eu-withdrawal__summary-row dd {
  margin: 0;
  word-break: break-word;
}

.eu-withdrawal__confirm {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  margin-bottom: 20px;
}

.eu-withdrawal__submit {
  display: inline-block;
  background: #000;
  color: #fff;
  padding: 13px 26px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  border: 0;
}

.eu-withdrawal__continue {
  margin-top: 22px;
}

.eu-withdrawal__back {
  display: block;
  margin-top: 14px;
  font-size: 12px;
  text-decoration: underline;
  cursor: pointer;
}

.eu-withdrawal__errors,
.eu-withdrawal__success {
  margin-bottom: 20px;
}

.eu-withdrawal__errors {
  color: #b3261e;
}

/* ==========================================================================
   Recently Viewed — greyed-out placeholders for a short row
   Filled in by recently-viewed-placeholders.js, which only ever tops the row
   up to data-limit; a visitor with none still gets the section hidden.

   order:1 keeps them behind the real cards without touching the DOM order —
   the grid is a flex row, and the component appends cards on its own schedule.
   0.727 is the aspect ratio the store's product images actually use, so a
   placeholder is the same height as the card beside it.
   ========================================================================== */
.recently-viewed__placeholder {
  order: 1;
  pointer-events: none;
}

.recently-viewed__placeholder-media {
  aspect-ratio: 0.727;
  background-color: #ececec;
  width: 100%;
}

.recently-viewed__placeholder-line {
  background-color: #e4e4e4;
  height: 10px;
  margin-top: 10px;
  width: 70%;
}

.recently-viewed__placeholder-line--short {
  margin-top: 6px;
  width: 40%;
}

/* ==========================================================================
   SMS / email sign-up landing page — sections/layout-sms-signup.liquid
   One centred column after everlane.com/pages/sms-signup, set in the store's
   own type. The form is a Klaviyo embed (fields, consent, list) — see below
   for how it is brought into the store's type.
   ========================================================================== */
.sms-signup {
  padding: 60px 20px 100px;
}

/* Background image: full-bleed behind the section, content on a white panel —
   the ribbon photo is a busy print that no text reads cleanly over. */
.sms-signup--has-background {
  isolation: isolate;
  overflow: hidden;
  padding: 80px 20px;
  position: relative;
}

.sms-signup__background {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
  z-index: -1;
}

.sms-signup--has-background .sms-signup__inner {
  background: #fff;
  padding: 48px 40px 36px;
}

.sms-signup__inner {
  margin: 0 auto;
  max-width: 560px;
  text-align: center;
}

.sms-signup a.sms-signup__wordmark {
  color: #000;
  display: inline-block;
  font-family: eb-garamond, serif;
  font-size: 18px;
  letter-spacing: 4px;
  margin-bottom: 40px;
  text-decoration: none;
  text-transform: uppercase;
}

.sms-signup__wordmark img {
  display: block;
  height: auto;
  max-width: 240px;
}

.page h1.sms-signup__heading {
  font-family: eb-garamond, serif;
  font-size: 40px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.1;
  margin: 0 0 16px;
  padding-top: 0;
  text-transform: uppercase;
}

.page .sms-signup__subheading p {
  font-family: eb-garamond, serif;
  font-size: 20px;
  line-height: 1.35;
  margin: 0 0 28px;
}

.sms-signup__form {
  min-height: 220px; /* holds the space while onsite.js renders the form */
}

/* Klaviyo's embed renders into the page (no iframe) with hashed class names and
   Arial throughout, and the theme's globals leak into it: the country picker
   takes the rose button fill, and the disclosure the all-caps titling face.
   Element selectors under the section keep every override page-scoped. */
.sms-signup__form .klaviyo-form {
  margin: 0 auto;
  max-width: 480px;
}

.sms-signup__form .klaviyo-form input {
  border: 1px solid #000 !important;
  border-radius: 0 !important;
  font-family: eb-garamond, serif !important;
  font-size: 17px !important;
}

.sms-signup__form .klaviyo-form button:not(.klaviyo-form-button) {
  background: transparent !important;
  border-radius: 0 !important;
  color: #000 !important;
}

.sms-signup__form .klaviyo-form button.klaviyo-form-button {
  background: #000 !important;
  border-radius: 0 !important;
  font-family: jaf-domus-titling-web, sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 2px !important;
  width: 100% !important;
}

.sms-signup__form .klaviyo-form button.klaviyo-form-button:hover {
  background: #ac7674 !important;
}

.sms-signup__form .klaviyo-form div:has(> button.klaviyo-form-button) {
  width: 100% !important;
}

.sms-signup__form .klaviyo-form .klaviyo-disclosure,
.sms-signup__form .klaviyo-form .klaviyo-disclosure * {
  color: #555 !important;
  font-family: eb-garamond, serif !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.sms-signup__form .klaviyo-form .klaviyo-disclosure a {
  color: #000 !important;
  text-decoration: underline !important;
}

.sms-signup__form .klaviyo-form p,
.sms-signup__form .klaviyo-form span {
  font-family: eb-garamond, serif !important;
}

.sms-signup__placeholder {
  border: 1px dashed #ccc;
  font-size: 14px;
  padding: 40px 20px;
}

.page .sms-signup__footnote {
  font-size: 12px;
  padding-top: 24px;
}

@media (max-width: 767px) {
  .sms-signup {
    padding: 40px 16px 60px;
  }

  .sms-signup--has-background {
    padding: 40px 16px;
  }

  .sms-signup--has-background .sms-signup__inner {
    padding: 32px 20px 24px;
  }

  .page h1.sms-signup__heading {
    font-size: 30px;
  }

  .page .sms-signup__subheading p {
    font-size: 17px;
  }
}