/* ROGACHEV — карточка товара. Одна на весь сайт; фото всегда 4:5 на плитке одного тона. */

.rg-card{display:flex;flex-direction:column;gap:10px;min-width:0;position:relative}
.rg-card__media{position:relative;aspect-ratio:4/5;background:linear-gradient(160deg,#F1F3EE 0%,var(--tile) 100%);overflow:hidden}

/* Кадры: на телефоне листаются пальцем, на компьютере — движением мыши по фото */
.rg-card__frames{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.rg-card__frames::-webkit-scrollbar{display:none}
.rg-card__img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:start;scroll-snap-stop:always}
.rg-card__noimg{margin:auto;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);text-align:center;padding:0 12px}
@media (hover:hover) and (pointer:fine){ .rg-card__frames{overflow-x:hidden;scroll-snap-type:none} }

.rg-card__water{position:absolute;top:14px;left:14px;color:var(--patina);pointer-events:none}
.rg-card__water--dry{color:var(--text-3)}
.rg-card__fav{position:absolute;top:2px;right:2px;width:var(--tap);height:var(--tap);display:flex;align-items:center;justify-content:center;color:var(--ink)}
.rg-card__fav:hover{color:var(--patina)}
.rg-card__fav[aria-pressed="true"] .rg-icon{fill:currentColor}
.rg-card__tag{position:absolute;left:14px;bottom:14px;font-family:var(--font-mono);font-size:10px;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;background:var(--surface);padding:3px 7px;pointer-events:none}
.rg-card__bars{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:4px;pointer-events:none}
.rg-card__bars i{width:14px;height:2px;background:#C3CBC2;display:block}
.rg-card__bars i.is-on{background:var(--ink)}

.rg-card__name{font-family:var(--font-body);font-size:16px;font-weight:400;line-height:1.3;overflow-wrap:break-word}
.rg-card__name a{display:block}
.rg-card__meta{font-family:var(--font-mono);font-size:12px;line-height:1.4;color:var(--text-3)}
.rg-card__foot{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:24px}
.rg-card__price{font-family:var(--font-display);font-size:19px;line-height:1.2;white-space:nowrap}

/* Кружки цветов: видимый размер 13, нажимаемая область больше */
.rg-card__colors{display:flex;align-items:center;margin:-10px -5px -10px 0}
.rg-card__dot{width:24px;height:44px;display:flex;align-items:center;justify-content:center;flex:none;position:relative}
.rg-card__dot i{width:13px;height:13px;border-radius:50%;display:block;box-shadow:inset 0 0 0 1px rgba(23,30,26,.18)}
button.rg-card__dot:hover i{box-shadow:inset 0 0 0 1px rgba(23,30,26,.5)}
button.rg-card__dot.is-on i,button.rg-card__dot.is-on:hover i{box-shadow:0 0 0 2px var(--dot-ring,var(--ground)),0 0 0 3px var(--ink)}
.rg-band{--dot-ring:var(--surface)}
.rg-card__more{font-family:var(--font-mono);font-size:11px;color:var(--text-3);min-width:28px;height:44px;display:inline-flex;align-items:center;justify-content:center}

@media (max-width:760px){
  .rg-card__name{font-size:14px}
  .rg-card__price{font-size:17px}
  .rg-card__water{top:12px;left:12px}
  .rg-card__tag{left:12px;bottom:12px}
  .rg-card__foot{flex-wrap:wrap}
  .rg-card__dot{width:22px}
  .rg-card__colors{margin-right:-4px}
}

/* Загрузка */
.rg-card--skeleton .rg-card__media,.rg-card--skeleton i{background:var(--line-soft);display:block;animation:rg-pulse 1.4s ease-in-out infinite}
@keyframes rg-pulse{50%{opacity:.55}}
@media (prefers-reduced-motion:reduce){ .rg-card--skeleton .rg-card__media,.rg-card--skeleton i{animation:none} }