/* Native reconstruction of the saved reference homepage body. */
.jr-home { overflow: hidden; }
.jr-ref-shell { width: min(1470px, calc(100% - 90px)); margin: 0 auto; }
.jr-ref-heading { display: flex; align-items: center; min-height: 58px; margin-bottom: 36px; }
.jr-ref-heading h2 { margin: 0; color: #2e2e2e; font-family: Georgia, "Times New Roman", serif; font-size: 34px; font-weight: 500; line-height: 1.15; text-transform: uppercase; }
.jr-ref-heading h2 span { margin-right: 8px; font-size: 24px; }

.jr-ref-hero { position: relative; width: 100%; height: auto; aspect-ratio: 1817 / 866; margin-bottom: 0; overflow: hidden; background: #231b13; transition: height 650ms cubic-bezier(.45,0,.25,1); }
.jr-ref-hero__slide { position: absolute; inset: 0; z-index: 1; visibility: hidden; opacity: 0; pointer-events: none; transform: translate3d(-5%,0,0) scale(1.015); transition: transform 900ms cubic-bezier(.45,0,.25,1), opacity 650ms ease; will-change: transform, opacity; }
.jr-ref-hero__slide.is-active { z-index: 3; visibility: visible; opacity: 1; pointer-events: auto; transform: translate3d(0,0,0) scale(1); }
.jr-ref-hero__slide.is-leaving { z-index: 2; visibility: visible; opacity: 1; pointer-events: none; transform: translate3d(5%,0,0) scale(1.015); }
.jr-ref-hero__image { display: block; width: 100%; height: 100%; object-fit: contain; user-select: none; }
.jr-ref-hero__sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.jr-ref-collection-banner__copy a, .jr-ref-about__copy a { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 11px 25px; border: 1px solid #2e2e2e; background: #fff; color: #2e2e2e; font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: 1px; text-decoration: none; text-transform: uppercase; transition: .3s; }
.jr-ref-hero__arrow { position: absolute; top: 50%; z-index: 5; width: 70px; height: 70px; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,.1); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; transform: translateY(-50%); }
.jr-ref-hero__arrow--prev { left: 30px; }
.jr-ref-hero__arrow--next { right: 30px; }
.jr-ref-hero__dots { position: absolute; right: 0; bottom: 20px; left: 0; z-index: 5; display: flex; justify-content: center; gap: 10px; }
.jr-ref-hero__dots button { position: relative; width: 15px; height: 15px; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: 0 0 0 2px transparent; cursor: pointer; transition: box-shadow .3s ease; }
.jr-ref-hero__dots button i { position: absolute; inset: 0; border-radius: 50%; background: rgba(255,255,255,.3); transition: transform .3s ease, background-color .3s ease; }
.jr-ref-hero__dots button.is-active { box-shadow: 0 0 0 2px #fff; }
.jr-ref-hero__dots button.is-active i { background: #fff; transform: scale(.4); }

.jr-home .rd-category-carousel { margin-bottom: 100px; padding: 0; }
.jr-home .rd-category-shell, .jr-home .rd-new-arrivals__shell, .jr-home .rd-products__shell { width: min(1470px, calc(100% - 90px)); }
.jr-home .rd-editorial-banner { margin: 0 0 100px; }
.jr-home .rd-vc { margin-bottom: 60px; }
.jr-home .rd-products { margin-bottom: 40px; padding-top: 70px; padding-bottom: 85px; }
.jr-home .rd-new-arrivals { margin-bottom: 100px; padding: 0; }

.jr-ref-collection-banner { position: relative; display: flex; min-height: 760px; align-items: center; margin-bottom: 100px; overflow: hidden; background: #e6ded7 url('../jierra-storefront/2023/08/h1-bn2-bg.jpg') center/cover no-repeat fixed; }
.jr-ref-collection-banner__copy { position: relative; z-index: 2; width: 46%; padding-left: max(45px, 8vw); color: #fff; text-transform: uppercase; }
.jr-ref-collection-banner__copy span { font-size: 18px; letter-spacing: .18em; }
.jr-ref-collection-banner__copy h2 { margin: 14px 0 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(54px, 6vw, 92px); font-weight: 400; line-height: .92; }
.jr-ref-collection-banner__copy strong { display: block; margin: 8px 0 22px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(39px, 4.4vw, 68px); font-weight: 400; }
.jr-ref-collection-banner__copy p { margin: 0 0 30px; font-size: 15px; text-transform: none; }
.jr-ref-collection-banner img { position: absolute; right: 4%; bottom: 0; width: min(54%, 830px); max-height: 94%; object-fit: contain; object-position: bottom; }
.jr-ref-collection-banner--masons img { pointer-events: none; transform: scale(1); transform-origin: 50% 100%; transition: transform 700ms cubic-bezier(.16,1,.3,1); will-change: transform; }
.jr-ref-collection-banner--masons:hover img,
.jr-ref-collection-banner--masons:focus-within img { transform: scale(1.085); }

.jr-ref-lifestyle-stack { margin-bottom: 100px; }
.jr-ref-lifestyle-stack .jr-ref-heading { justify-content: center; margin-bottom: 38px; }
.jr-ref-products { margin-bottom: 100px; }
.jr-ref-product-rail { display: flex; gap: 30px; overflow-x: auto; padding-bottom: 10px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.jr-ref-product-rail::-webkit-scrollbar { display: none; }
.jr-ref-product-rail .rd-tab-product-card { flex: 0 0 calc((100% - 90px) / 4); }

.jr-ref-exhibition-gallery { margin-bottom: 100px; }
.jr-ref-exhibition-gallery__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 255px; gap: 24px; }
.jr-ref-exhibition-gallery__item { position: relative; grid-column: span 4; margin: 0; overflow: hidden; background: #eee8e3; }
.jr-ref-exhibition-gallery__item:nth-child(1), .jr-ref-exhibition-gallery__item:nth-child(3) { grid-row: span 2; }
.jr-ref-exhibition-gallery__item:nth-child(5), .jr-ref-exhibition-gallery__item:nth-child(6) { grid-column: span 6; }
.jr-ref-exhibition-gallery__item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 650ms cubic-bezier(.2,.7,.25,1); }
.jr-ref-exhibition-gallery__item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.58), transparent 55%); opacity: .72; pointer-events: none; transition: opacity 300ms ease; }
.jr-ref-exhibition-gallery__item figcaption { position: absolute; right: 25px; bottom: 24px; left: 25px; z-index: 2; display: flex; justify-content: space-between; align-items: end; color: #fff; text-transform: uppercase; }
.jr-ref-exhibition-gallery__item small { font-size: 11px; letter-spacing: .13em; }
.jr-ref-exhibition-gallery__item strong { font-size: 17px; font-weight: 600; }
.jr-ref-exhibition-gallery__item:hover img { transform: scale(1.045); }
.jr-ref-exhibition-gallery__item:hover::after { opacity: .92; }
.jr-ref-upcoming-banner { margin-bottom: 100px; }

.jr-ref-reviews { margin-bottom: 100px; padding: 80px 0 90px; background: #f5f5f5; }
.jr-ref-reviews__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.jr-ref-review { position: relative; display: grid; grid-template-columns: 112px 1fr; gap: 24px; min-height: 290px; padding: 34px; border: 1px solid #ddd; background: #fff; }
.jr-ref-review > img { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; }
.jr-ref-review h3 { margin: 4px 0 2px; font-size: 18px; }
.jr-ref-review span { color: #777; font-size: 14px; }
.jr-ref-review b { display: block; margin: 12px 0; color: #b4864f; font-size: 15px; letter-spacing: .12em; }
.jr-ref-review p { margin: 0; color: #575757; font-size: 14px; line-height: 1.65; }
.jr-ref-review > i { position: absolute; right: -15px; bottom: -15px; display: grid; width: 40px; height: 40px; place-items: center; background: #fff; font-style: normal; }

.jr-ref-about { margin-bottom: 100px; }
.jr-ref-about__copy { display: grid; grid-template-columns: 1fr 1.35fr auto; gap: 60px; align-items: center; padding: 58px 64px; border-top: 1px solid #d9d3cc; border-bottom: 1px solid #d9d3cc; }
.jr-ref-about__copy h3 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(34px, 3.4vw, 54px); font-weight: 400; line-height: 1.06; text-transform: uppercase; }
.jr-ref-about__copy p { margin: 0; color: #68625d; font-size: 16px; line-height: 1.8; }
.jr-ref-about__copy a { color: #2e2e2e; white-space: nowrap; }

.jr-home .rd-exhibition { margin-bottom: 100px; padding-top: 0; }
.jr-ref-instagram { margin-bottom: 100px; padding: 82px 0 90px; background: #f7f1ee url('../jierra-storefront/2023/08/h2-bg-insta.jpg') center/cover no-repeat; }
.jr-ref-instagram .jr-ref-heading { justify-content: center; }
.jr-ref-instagram__rail { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.jr-ref-instagram__rail a { position: relative; display: block; aspect-ratio: 1; overflow: visible; color: #fff; }
.jr-ref-instagram__rail img { width: 100%; height: 100%; object-fit: cover; }
.jr-ref-instagram__rail span { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0,0,0,.35); font-size: 18px; opacity: 0; transition: .3s; }
.jr-ref-instagram__rail a:hover span { opacity: 1; }
.jr-ref-instagram__rail i { position: absolute; right: -15px; bottom: -15px; display: grid; width: 40px; height: 40px; place-items: center; background: #fff; color: #2e2e2e; font-style: normal; }
.jr-ref-instagram__rail a:nth-child(n+4) { display: none; }

.jr-ref-shopping { margin-bottom: 100px; }
.jr-ref-shopping .jr-ref-heading { justify-content: center; }
.jr-ref-shopping__grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid #d9d3cc; }
.jr-ref-shopping__grid article { padding: 42px 28px; border-right: 1px solid #d9d3cc; text-align: center; }
.jr-ref-shopping__grid article:last-child { border-right: 0; }
.jr-ref-shopping__grid img { width: 60px; height: 60px; object-fit: contain; }
.jr-ref-shopping__grid h3 { margin: 18px 0 6px; font-size: 16px; text-transform: uppercase; }
.jr-ref-shopping__grid p { margin: 0 0 15px; color: #777; font-size: 14px; }
.jr-ref-shopping__grid a { border-bottom: 1px solid; color: inherit; font-size: 12px; font-weight: 600; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.jr-ref-reviews:last-child { margin-bottom: 0; }

@media (max-width: 989px) {
  .jr-ref-hero__arrow { display: none; }
  .jr-ref-collection-banner { min-height: 610px; }
  .jr-ref-reviews__grid { grid-template-columns: repeat(2, 1fr); }
  .jr-ref-review:nth-child(3) { display: none; }
  .jr-ref-about__copy { grid-template-columns: 1fr 1fr; }
  .jr-ref-about__copy a { width: max-content; }
}

@media (max-width: 767px) {
  .jr-ref-shell, .jr-home .rd-category-shell, .jr-home .rd-new-arrivals__shell, .jr-home .rd-products__shell { width: calc(100% - 28px); }
  .jr-ref-heading { margin-bottom: 26px; }
  .jr-ref-heading h2 { font-size: 25px; }
  .jr-ref-hero { margin-bottom: 0; }
  .jr-ref-hero__arrow { display: none; }
  .jr-ref-hero__dots { bottom: 10px; gap: 8px; }
  .jr-ref-hero__dots button { width: 10px; height: 10px; }
  .jr-home .rd-category-carousel, .jr-home .rd-editorial-banner, .jr-home .rd-new-arrivals, .jr-ref-products, .jr-ref-about, .jr-home .rd-exhibition, .jr-ref-instagram, .jr-ref-shopping { margin-bottom: 50px; }
  .jr-home .rd-vc { margin-bottom: 50px; }
  .jr-ref-lifestyle-stack { margin-bottom: 50px; }
  .jr-ref-lifestyle-stack .jr-ref-heading { margin-bottom: 28px; }
  .jr-home .rd-products { margin-bottom: 35px; padding-top: 50px; padding-bottom: 55px; }
  .jr-ref-collection-banner { min-height: 480px; margin-bottom: 50px; padding-top: 40px; align-items: flex-start; background-attachment: scroll; }
  .jr-ref-collection-banner__copy { width: 100%; padding: 0 24px; }
  .jr-ref-collection-banner__copy h2 { font-size: 46px; }
  .jr-ref-collection-banner__copy strong { font-size: 34px; }
  .jr-ref-collection-banner img { right: -12%; width: 72%; max-height: 65%; }
  .jr-ref-product-rail { gap: 14px; }
  .jr-ref-product-rail .rd-tab-product-card { flex-basis: 78%; }
  .jr-ref-exhibition-gallery { margin-bottom: 50px; }
  .jr-ref-exhibition-gallery__grid { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .jr-ref-exhibition-gallery__grid::-webkit-scrollbar { display: none; }
  .jr-ref-exhibition-gallery__item, .jr-ref-exhibition-gallery__item:nth-child(n) { flex: 0 0 82%; min-height: 390px; scroll-snap-align: start; }
  .jr-ref-exhibition-gallery__item figcaption { right: 18px; bottom: 18px; left: 18px; }
  .jr-ref-upcoming-banner { margin-bottom: 50px; }
  .jr-ref-reviews { margin-bottom: 50px; padding: 52px 0 58px; }
  .jr-ref-reviews__grid { display: flex; overflow-x: auto; gap: 16px; scroll-snap-type: x mandatory; }
  .jr-ref-review { flex: 0 0 88%; grid-template-columns: 78px 1fr; padding: 24px; scroll-snap-align: start; }
  .jr-ref-review:nth-child(3) { display: grid; }
  .jr-ref-review > img { width: 78px; height: 78px; }
  .jr-ref-about__copy { grid-template-columns: 1fr; gap: 24px; padding: 38px 0; }
  .jr-ref-about__copy h3 { font-size: 36px; }
  .jr-ref-instagram { padding: 52px 0 58px; }
  .jr-ref-instagram__rail { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .jr-ref-instagram__rail a:nth-child(3) { display: none; }
  .jr-ref-shopping__grid { grid-template-columns: 1fr 1fr; }
  .jr-ref-shopping__grid article { border-bottom: 1px solid #d9d3cc; }
  .jr-ref-shopping__grid article:nth-child(2) { border-right: 0; }
  .jr-ref-shopping__grid article:nth-child(n+3) { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .jr-ref-hero, .jr-ref-hero__slide { transition: none; }
  .jr-ref-collection-banner--masons img { transition: none; }
}

@media (min-width: 990px) and (max-width: 1360px) {
  .jr-ref-hero__arrow { display: none; }
}
