/*!* =========================================*/
/*   REFERENCIÁK HERO — ugyanolyan mint SERVICES*/
/*   csak primary button*/
/*========================================= *!*/

/*.ref-hero {*/
/*    width: 100%;*/
/*    min-height: 50vh;*/
/*    position: relative;*/
/*    display: flex;*/
/*    align-items: flex-end;*/
/*    padding-top: 140px;*/
/*    overflow: hidden;*/
/*    background-image: url('http://magnaplan.hu/wp-content/uploads/2025/12/close-up-colleagues-working-urban-design-with-blueprints-building-model-team-people-doing-teamwork-construction-layout-designing-architectural-development-project-1-1.png');*/
/*    background-size: cover;*/
/*    background-position: center top;*/
/*}*/

/*!* Overlay: felül sötétebb, középen enyhébb, alul teljesen fehér *!*/
/*.ref-hero::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    inset: 0;*/
/*    background: linear-gradient(*/
/*            to bottom,*/
/*            rgba(17, 50, 81, 0.95) 0%,*/
/*            rgba(17, 50, 81, 0.55) 35%,*/
/*            rgba(17, 50, 81, 0.15) 65%,*/
/*            #ffffff 100%*/
/*    );*/
/*    z-index: 0;*/
/*}*/

/*.ref-hero-inner {*/
/*    position: relative;*/
/*    z-index: 1;*/
/*    max-width: var(--section-max);*/
/*    width: 100%;*/
/*    padding: 60px var(--side-padding) 80px;*/
/*    box-sizing: border-box;*/
/*    color: #fff;*/
/*}*/

/*.ref-hero-inner h1 {*/
/*    font-size: 64px;*/
/*    font-weight: 300;*/
/*    margin: 0 0 20px;*/
/*    color: #ffffff;*/
/*}*/

/*!* HERO gomb — PRIMARY színnel *!*/
/*.ref-hero-inner .mp-btn {*/
/*    background: var(--primary);*/
/*    color: #ffffff;*/
/*    font-weight: 500;*/
/*    padding: 14px 32px;*/
/*    border-radius: 28px;*/
/*    font-size: 16px;*/
/*    display: inline-block;*/
/*    text-decoration: none;*/
/*}*/
/*.ref-hero-inner .mp-btn:hover {*/
/*    opacity: 0.9;*/
/*}*/

/*!* MOBILE RESPONSIVE *!*/
/*@media (max-width: 1024px) {*/
/*    .ref-hero {*/
/*        padding-top: 120px;*/
/*        min-height: 40vh;*/
/*    }*/

/*    .ref-hero-inner {*/
/*        padding: 40px 20px 60px;*/
/*    }*/

/*    .ref-hero-inner h1 {*/
/*        font-size: 36px;*/
/*    }*/

/*    .ref-hero-inner .mp-btn {*/
/*        font-size: 15px;*/
/*        padding: 12px 28px;*/
/*    }*/
/*}*/

/* ===== SECTIONS ===== */
.references-bg {
    background: #ffffff;
}

.references-page {
    max-width: 1400px;
    margin: 0 auto;
    background: #ffffff;
    border-radius: 24px;
    padding: 40px 42px 50px;
    box-shadow: 0 14px 40px rgba(0,0,0,0.10);
}

.ref-group {
    margin-bottom: 70px;
    position: relative;
    padding: 0;
}

.ref-group h2 {
    font-size: 40px;
    font-stretch: 110%;
    font-weight: 300;
}

/* ===== FADING OVERLAY ===== */
.ref-group.fade-left::before,
.ref-group.fade-right::after {
    content: "";
    position: absolute;
    top: 48px;
    height: 180px;
    pointer-events: none;
    z-index: 20;
}

.ref-group.fade-left::before {
    left: 0;
    width: 120px;
    background: linear-gradient(to left, rgba(255,255,255,0) 0%, #ffffff 90%);
}

.ref-group.fade-right::after {
    right: 0;
    width: 120px;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, #ffffff 90%);
}

/* ===== SCROLL LIST ===== */
.ref-scroll {
    display: flex;
    gap: 36px;
    overflow-x: auto;
    scroll-behavior: smooth;
    padding: 12px 0 4px;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
}

.ref-scroll::-webkit-scrollbar { display: none; }
.ref-scroll { scrollbar-width: none; }

/* ===== CARD IMAGE ONLY ===== */
.ref-card {
    width: 320px;
    height: 320px;
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0,0,0,0.10);
    flex-shrink: 0;
}

.ref-card img {
    width: 100%;
    /*aspect-ratio: 4 / 3;*/
    object-fit: cover;
    display: block;
}

/* ===== NAME OUTSIDE ===== */
.ref-name {
    margin-top: 20px;
    font-size: 24px;
    color: var(--primary);
    font-weight: 500;
    text-align: center;
}