/* Palime Archive — utilities.css */

/* === ОТОБРАЖЕНИЕ === */
.hidden   { display: none !important; }
.visible  { display: block !important; }
.flex     { display: flex; }
.inline   { display: inline; }
.block    { display: block; }

/* === ТЕКСТ === */
.text-center  { text-align: center; }
.text-right   { text-align: right; }
.text-left    { text-align: left; }
.text-upper   { text-transform: uppercase; }
.text-mono    { font-family: var(--font-mono); }
.text-display { font-family: var(--font-display); }
.text-serif   { font-family: var(--font-serif); }
.text-sm      { font-size: 0.875rem; }
.text-xs      { font-size: 0.75rem; }
.text-lg      { font-size: 1.125rem; }
.text-muted   { opacity: 0.55; }
.text-accent  { color: var(--accent); }

/* === ОТСТУПЫ === */
.mt-xs  { margin-top: var(--spacing-xs); }
.mt-sm  { margin-top: var(--spacing-sm); }
.mt-md  { margin-top: var(--spacing-md); }
.mt-lg  { margin-top: var(--spacing-lg); }
.mt-xl  { margin-top: var(--spacing-xl); }
.mt-2xl { margin-top: var(--spacing-2xl); }

.mb-xs  { margin-bottom: var(--spacing-xs); }
.mb-sm  { margin-bottom: var(--spacing-sm); }
.mb-md  { margin-bottom: var(--spacing-md); }
.mb-lg  { margin-bottom: var(--spacing-lg); }
.mb-xl  { margin-bottom: var(--spacing-xl); }
.mb-2xl { margin-bottom: var(--spacing-2xl); }

/* === ПОЗИЦИОНИРОВАНИЕ === */
.relative { position: relative; }
.absolute { position: absolute; }
.sticky   { position: sticky; top: 0; }

/* === OVERFLOW === */
.overflow-hidden { overflow: hidden; }
.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* === ИЗОБРАЖЕНИЯ === */
.img-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.aspect-3-2  { aspect-ratio: 3/2; }
.aspect-16-9 { aspect-ratio: 16/9; }
.aspect-1-1  { aspect-ratio: 1/1; }

/* === ЦВЕТА РАЗДЕЛОВ === */
.section-cinema { --accent: var(--accent-cinema); }
.section-lit    { --accent: var(--accent-lit); }
.section-music  { --accent: var(--accent-music); }
.section-art    { --accent: var(--accent-art); }

/* === АНИМАЦИИ === */
.fade-in {
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.no-transition { transition: none !important; }

/* === АДАПТИВ === */
.hide-mobile  { display: block; }
.show-mobile  { display: none; }

@media (max-width: 768px) {
    .hide-mobile { display: none !important; }
    .show-mobile { display: block !important; }
}