.bg-rubin{
    background-image: url("/images/mag-pattern-600x346-1-e1685711173127.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    color: #fff;
}
.container-text span{
    font-weight: 700;
}
.btn-warning-primary{
    background: #FB8800;
    color: #fff;
}
.btn-warning-primary:hover{
    background: #264664;
}
.category{
    position: relative;
    background-size: cover;
    background-position: center;
    height: 300px; /* або за потребою */
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    border-radius: 10px;
    transition: all .4s;
}
.category:hover{
    background-size: 130%;
}
.btn-warning{
    background: #FB8800;
    border: #FB8800;
}
.text-shadow-custom{
    text-shadow: 2px 2px 4px #264664;
}
.overlay-custom{
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(38, 70, 100, 0.6);
}

.category-index .category {
    width: 100%;
    margin-bottom: 0;
}

.category-index .overlay-custom {
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.category-index .overlay-custom .section-110 {
    padding: 0;
}

@media (max-width: 767px) {
    .page-footer {
        padding-top: 38px;
        padding-bottom: 24px;
    }

    .page-footer .grid-group-md > [class*="col-"] {
        margin-top: 24px !important;
    }

    .page-footer .grid-group-md > [class*="col-"]:first-child {
        margin-top: 0 !important;
    }

    .page-footer .offset-top-30 {
        margin-top: 12px;
    }

    .page-footer .offset-top-50 {
        margin-top: 24px;
    }
}
.rubin-hero { position: relative; height: min(760px, 100svh); min-height: 440px; overflow: hidden; background: #172d40; }
.rubin-hero-slide { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; }
.rubin-hero-slide.is-active { display: flex; }
.rubin-hero-slide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rubin-hero-slide::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .23); pointer-events: none; }
.rubin-hero-content { position: relative; z-index: 1; width: 100%; padding: 45px 15px; }
.rubin-hero-content .rubin-hero-caption { position: static; display: block; opacity: 1; visibility: visible; transform: none; color: #fff; white-space: normal; }
.rubin-hero-content h1 { margin: 0 0 20px; }
.rubin-hero-content .big { color: #fff; text-shadow: 0 2px 9px rgba(0,0,0,.6); }
@media (max-width: 767px) {
    .rubin-hero { height: 70svh; min-height: 420px; }
    .rubin-hero-content .big { font-size: clamp(25px, 7vw, 38px); line-height: 1.2; }
    .rubin-hero-content .container { width: 100%; padding: 0; }
    .rubin-hero-content .btn { white-space: normal; }
}
.rubin-categories-section { background: #fff; color: #264664; }
.rubin-categories-section h3 { color: #264664; }
@media (prefers-reduced-motion: no-preference) {
    @view-transition {
        navigation: auto;
    }

    ::view-transition-group(root),
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation-duration: 150ms;
        animation-timing-function: ease-out;
    }
}