/* Orbán Dóra – css/ajanlat.css
   Csak az ajanlat.html oldalra vonatkozó stílusok. Nem érinti a többi oldalt. */

/* --- "Megértés a kapcsolataidhoz" lead mondat: mobilon (768px alatt, ahol több sorra törik) sorkizárt, desktopon marad középen --- */
@media (max-width: 767px) {
    .who-we-are__lead {
        text-align: justify;
    }
}

/* --- Ajánlat oldal: ügyfélvélemény kártya --- */
.testimonial-card {
    background: linear-gradient(160deg, #faf6ee, #f3ead9);
    border: 1px solid #dcc493;
    border-radius: 10px;
    padding: 26px 28px;
    margin: 0 0 24px;
}

@media (min-width: 768px) {
    .testimonial-card {
        height: 100%;
    }
}

.testimonial-card p {
    font-style: italic;
    line-height: 1.7;
    color: #3b2c1e;
    margin: 0 0 14px;
}

.testimonial-card cite {
    display: block;
    font-style: normal;
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #8a6a42;
}

@media (max-width: 575px) {
    .testimonial-card { padding: 20px 22px; }
}

/* --- Ajánlat oldal: "Min változtatnál?" cím alatti .bottom-border csík (app.css: bottom:-35px)
   890px alatt átlógna a "Párkapcsolat" szövegbe, mert a custom.css a headline margin-bottom-ját
   10px-re csökkenti ezen a törésponton --- */
@media (max-width: 890px) {
    .bg-1.border-top .big-headline__headline,
    .who-we-are-section .big-headline__headline {
        margin-bottom: 64px;
    }
}

/* --- Ajánlat oldal: "Min változtatnál?" kategória-oszlopok 767px alatt egymás alá kerülnek (col-md-4), gutter nélkül összeérnek --- */
@media (max-width: 767px) {
    .problem-columns > .col-12.col-md-4 + .col-12.col-md-4 {
        margin-top: 28px;
    }
}

/* --- "Árak" menüpont horgony-linkje: fixed nav alá ne csússzon a cím --- */
#arak {
    scroll-margin-top: 90px;
}

@media (min-width: 891px) {
    #arak {
        scroll-margin-top: 170px;
    }
}