/* TiAMaX Assortment — Frontend Styles v1.1 */

:root {
    --tiamx-bg: #f7f7f8;
    --tiamx-surface: #ffffff;
    --tiamx-text: #1f1f1f;
    --tiamx-muted: #6d6f73;
    --tiamx-line: #e6e7eb;
    --tiamx-accent: #88A2FF;
    --tiamx-accent-soft: #C0E0FF;
    --tiamx-accent-blue: #88A2FF;
    --tiamx-accent-deep: #253A82;
}

/* ── Reveal animation ── */
.tiamx-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.tiamx-reveal.is-visible { opacity: 1; transform: translateY(0); }
.tiamx-reveal .tiamx-collection-card {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.tiamx-reveal.is-visible .tiamx-collection-card { opacity: 1; transform: translateY(0); }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(1) { transition-delay: 0.05s; }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(2) { transition-delay: 0.10s; }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(3) { transition-delay: 0.15s; }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(4) { transition-delay: 0.20s; }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(5) { transition-delay: 0.25s; }
.tiamx-reveal.is-visible .tiamx-collection-card:nth-child(6) { transition-delay: 0.30s; }

/* ── Section ── */
.tiamx-collections {
    padding: 80px 0;
    background: transparent;
}

.tiamx-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.tiamx-section__head { margin-bottom: 0; }

.tiamx-section__title {
    font-size: 52px;
    font-weight: 800;
    text-align: left;
    margin: 0 0 8px;
    color: var(--tiamx-accent-deep);
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.tiamx-section__subtitle {
    text-align: left;
    margin: 0 0 36px;
    color: var(--tiamx-muted);
    font-size: 15px;
    font-weight: 300;
}

/* ── Slider wrapper ── */
.tiamx-collections__slider {
    position: relative;
    padding: 0 8px;
    margin: 0 -8px;
}

/* ── Track ── */
.tiamx-collections__track {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 16px 4px 24px;
    -webkit-overflow-scrolling: touch;
}
.tiamx-collections__track::-webkit-scrollbar { display: none; }
.tiamx-collections__track { scrollbar-width: none; }

/* ── Card ── */
.tiamx-collection-card {
    background: var(--tiamx-surface);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(23, 23, 23, 0.09);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none !important;
    color: inherit !important;
    display: flex;
    flex-direction: column;
    flex: 0 0 260px;
    scroll-snap-align: start;
    min-width: 0;
}
.tiamx-collection-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 40px rgba(23, 23, 23, 0.14);
}

/* ── Card image ── */
.tiamx-collection-card__image {
    height: 220px;
    background: var(--tiamx-accent-soft);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tiamx-collection-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.5s ease;
}
.tiamx-collection-card:hover .tiamx-collection-card__image img {
    transform: scale(1.06);
}

/* placeholder */
.tiamx-collection-card__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #88A2FF;
    opacity: 0.55;
}

/* ── Card content ── */
.tiamx-collection-card__content {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    background: #fff;
}
.tiamx-collection-card__title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 2px;
    color: var(--tiamx-text);
    line-height: 1.3;
}
.tiamx-collection-card__link {
    display: inline-block;
    margin-top: 6px;
    color: var(--tiamx-accent-blue);
    text-decoration: none !important;
    font-weight: 600;
    font-size: 14px;
    transition: color 0.2s;
}
.tiamx-collection-card:hover .tiamx-collection-card__link {
    color: #e83240;
}

/* ── Slider buttons ── */
.tiamx-slider-btn {
    position: absolute;
    top: calc(16px + 110px);
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: 1.5px solid var(--tiamx-line);
    background: var(--tiamx-surface);
    border-radius: 50%;
    cursor: pointer;
    transition: box-shadow 0.2s, transform 0.2s;
    font-size: 22px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    color: var(--tiamx-text);
    box-shadow: 0 2px 8px rgba(23,23,23,0.10);
    padding: 0;
}
.tiamx-slider-btn--prev { left: -14px; }
.tiamx-slider-btn--next { right: -14px; }
.tiamx-slider-btn:hover {
    transform: translateY(-50%) scale(1.07);
    box-shadow: 0 8px 20px rgba(23,23,23,0.18);
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .tiamx-collection-card { flex: 0 0 220px; }
    .tiamx-collection-card__image { height: 180px; }
    .tiamx-slider-btn { top: calc(16px + 90px); }
}
@media (max-width: 768px) {
    .tiamx-collections { padding: 40px 0; }
    .tiamx-section__title { font-size: 36px; text-align: center; }
    .tiamx-section__subtitle { text-align: center; }
    .tiamx-collection-card { flex: 0 0 200px; }
    .tiamx-collection-card__image { height: 160px; }
    .tiamx-slider-btn { width: 38px; height: 38px; font-size: 18px; top: calc(16px + 80px); }
    .tiamx-slider-btn--prev { left: -4px; }
    .tiamx-slider-btn--next { right: -4px; }
}