.ax-editorial {
  isolation: isolate;
  overflow: hidden;
  position: relative;
  padding: clamp(42px, 4vw, 66px) 0 clamp(46px, 5vw, 76px);
  background-color: #f5f0e5;
  background-image:
    linear-gradient(115deg, rgba(252, 249, 239, .74), rgba(239, 240, 224, .64) 48%, rgba(250, 237, 235, .72)),
    url('../img/editorial/arthopia-editorial-floral-v1.png');
  background-position: center, center;
  background-repeat: no-repeat;
  background-size: cover, cover;
  color: #34291f;
}

.ax-editorial--ultra .ax-editorial__head {
  margin-bottom: 34px;
}

.ax-editorial__head {
  align-items: end;
  margin-bottom: 28px;
}

.ax-editorial__lead {
  max-width: 330px;
  margin-bottom: 3px;
}

.ax-editorial__viewport {
  overflow: hidden;
  background: transparent;
}

.ax-editorial__track {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.ax-editorial__card {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid rgba(75, 98, 56, .18);
  border-radius: 24px;
  background: #fffdf8;
  box-shadow: none;
  transform: translateY(0);
  transition: box-shadow .28s ease, transform .28s ease;
}

.ax-editorial--ultra .ax-editorial__card:hover {
  box-shadow: 0 26px 54px rgba(63, 56, 40, .17), 0 3px 0 rgba(255, 255, 255, .82) inset;
  transform: translateY(-5px);
}

.ax-editorial__media,
.ax-editorial__media img {
  display: block;
  width: 100%;
}

.ax-editorial__media {
  overflow: hidden;
  aspect-ratio: 3 / 2;
  background: #e4e4d8;
}

.ax-editorial__media img {
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.ax-editorial__media:hover img,
.ax-editorial__media:focus-visible img {
  transform: scale(1.035);
}

.ax-editorial__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 19px 17px 19px;
}

.ax-editorial__category {
  margin: 0 0 9px;
  color: #6f8164;
  font: 700 .66rem/1.2 Manrope, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.ax-editorial__title {
  margin: 0;
  color: #3f572b;
  font: 600 clamp(22px, 1.65vw, 28px)/1.08 'EB Garamond', Georgia, serif;
}

.ax-editorial__title a {
  color: inherit;
  text-decoration: none;
}

.ax-editorial__excerpt {
  margin: 12px 0 20px;
  color: #5d6254;
  font: 500 .76rem/1.58 Manrope, sans-serif;
}

.ax-editorial__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-top: auto;
}

.ax-editorial__read,
.ax-editorial__category-link {
  color: #3f602c;
  font: 700 .73rem/1.3 Manrope, sans-serif;
  text-decoration: none;
}

.ax-editorial__read span {
  display: inline-block;
  margin-left: 4px;
  transition: transform .2s ease;
}

.ax-editorial__read:hover span,
.ax-editorial__read:focus-visible span {
  transform: translateX(4px);
}

.ax-editorial__category-link {
  color: #777a69;
  font-weight: 600;
}

.ax-editorial__read:focus-visible,
.ax-editorial__category-link:focus-visible,
.ax-editorial__title a:focus-visible,
.ax-editorial__media:focus-visible,
.ax-editorial__control:focus-visible {
  outline: 3px solid #9bb486;
  outline-offset: 4px;
}

.ax-editorial__controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 20px;
}

@media (min-width: 901px) {
  .ax-editorial__track {
    gap: 0;
  }

  .ax-editorial__card {
    border-radius: 0;
    box-shadow: none;
  }

  .ax-editorial__card:first-child {
    border-radius: 24px 0 0 24px;
  }

  .ax-editorial__card:last-child {
    border-radius: 0 24px 24px 0;
  }

  .ax-editorial__controls { display: none; }
}

.ax-editorial__count {
  min-width: 48px;
  color: #6b7461;
  font: 700 .7rem/1 Manrope, sans-serif;
  text-align: center;
}

.ax-editorial__control {
  display: inline-grid;
  width: 38px;
  height: 38px;
  padding: 0;
  place-items: center;
  border: 1px solid #c9d2be;
  border-radius: 50%;
  background: transparent;
  color: #3f602c;
  cursor: pointer;
  font: 700 18px/1 Manrope, sans-serif;
}

.ax-editorial__control:hover:not(:disabled) {
  border-color: #789363;
  background: #e6eddf;
}

.ax-editorial__control:disabled {
  cursor: default;
  opacity: .35;
}

/* The homepage loads this direct stylesheet before the cached theme bundle. */
body#index.theme-arthopia .ax-foot {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (max-width: 900px) {
  .ax-editorial__track {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    padding: 3px 2px 10px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .ax-editorial__track::-webkit-scrollbar { display: none; }

  .ax-editorial__card {
    flex: 0 0 min(76vw, 380px);
    scroll-snap-align: start;
  }
}

@media (max-width: 560px) {
  .ax-editorial { padding: 52px 0 64px; }
  .ax-editorial__body { padding: 19px 18px 20px; }
  .ax-editorial__title { font-size: 28px; }
  .ax-editorial--ultra .ax-editorial__card:hover { transform: none; }
  .ax-editorial__controls { justify-content: space-between; }
}

@media (prefers-reduced-motion: reduce) {
  .ax-editorial__media img,
  .ax-editorial__read span { transition: none; }
  .ax-editorial__track { scroll-behavior: auto; }
}
