/* Главная: «Коллекционные камни». Стиль подогнан под соседние блоки (Новинки/Хиты): Montserrat, h2 24/20px вес 300, #232323.
   Отступ сверху задаёт общее правило main.daf-home (--daf-section-gap), поэтому у самой секции своих полей нет. */
.daf-gems {
  --gems-ink: #232323;
  --gems-muted: #4f5a65;
  --gems-line: #d7dbe0;
  --gems-accent: #e24e4d;
  color: var(--gems-ink);
  font-family: Montserrat, sans-serif;
}
.daf-gems *, .daf-gems *::before, .daf-gems *::after { box-sizing: border-box; }
.daf-gems h2 { margin: 0 0 24px; font-family: inherit; font-size: 24px; font-weight: 300; line-height: 31.92px; color: var(--gems-ink); }
.daf-gems__frame { position: relative; }
.daf-gems__list {
  --gems-gap: 24px;
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * var(--gems-gap)) / 4);
  gap: var(--gems-gap); list-style: none; padding: 0; margin: 0;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain;
}
.daf-gems__list::-webkit-scrollbar { display: none; }
.daf-gems__list > li { min-width: 0; scroll-snap-align: start; margin: 0; padding: 0; }
.daf-gems__tile { display: flex; flex-direction: column; align-items: center; color: inherit; text-decoration: none; text-align: center; }
.daf-gems__tile:focus-visible, .daf-gems__arrow:focus-visible { outline: 2px solid var(--gems-accent); outline-offset: 2px; }
.daf-gems__photo { display: block; width: 100%; aspect-ratio: 6 / 5; overflow: hidden; }
.daf-gems__photo img { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .32s ease; }
.daf-gems__name { display: inline-block; margin-top: 12px; font-size: 13px; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; font-weight: 500; transition: color .22s ease; }
.daf-gems__tile:is(:hover, :focus-visible) .daf-gems__name { color: var(--gems-accent); }
@media (hover: hover) { .daf-gems__tile:hover img { transform: scale(1.045); } }
.daf-gems__arrow { display: grid; place-items: center; width: 40px; height: 40px; position: absolute; top: 40%; transform: translateY(-50%); z-index: 1; border: 1px solid var(--gems-line); border-radius: 50%; background: #fff; color: var(--gems-muted); padding: 0; cursor: pointer; }
.daf-gems__arrow[hidden] { display: none; }
.daf-gems__arrow:not(:disabled):hover { color: var(--gems-accent); border-color: var(--gems-accent); }
.daf-gems__arrow:disabled { opacity: .36; cursor: default; }
.daf-gems__arrow--prev { left: 8px; }
.daf-gems__arrow--next { right: 8px; }
@media (max-width: 1023px) {
  .daf-gems h2 { font-size: 20px; line-height: 26px; }
  .daf-gems__list { --gems-gap: 16px; grid-auto-columns: calc((100% - var(--gems-gap)) / 2); }
}
@media (max-width: 767px) {
  .daf-gems h2 { font-weight: 400; margin-bottom: 16px; }
  .daf-gems__list { --gems-gap: 12px; grid-auto-columns: 100%; }
  .daf-gems__list > li { scroll-snap-stop: always; }
  .daf-gems__name { font-size: 11px; margin-top: 8px; letter-spacing: .06em; }
  .daf-gems__arrow { width: 32px; height: 32px; }
  .daf-gems__arrow--prev { left: 4px; }
  .daf-gems__arrow--next { right: 4px; }
}
@media (min-width: 1441px) { .daf-gems h2 { font-size: 32px; line-height: 40px; } }
@media (prefers-reduced-motion: reduce) { .daf-gems__photo img, .daf-gems__name { transition: none; } }