/* Meritum Heritage Tour — Custom Theme Overrides */

/* ========================================
   Header & Navigation
   ======================================== */

/* Logo */
#logo img {
    height: 48px;
    width: auto;
}
/* Header bar — keep everything in one line */
#header .container-header {
    padding-top: 0;
    padding-bottom: 0;
    min-height: auto;
    display: flex;
    align-items: center;
}
#header .container-header .left-side {
    display: flex;
    align-items: center;
    flex: 1;
}
#header .container-header .left-side #logo {
    flex: 0 0 auto;
    margin-right: 15px;
}

/* Compact header height */
#header {
    padding: 22px 0 !important;
}
/* Sticky header on homepage scroll — white bg, dark text */
#header-container.sticky {
    background: #fff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08) !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
}
#header-container.sticky #navigation ul li > a {
    color: #333 !important;
}
#header-container.sticky #navigation ul li > a:hover,
#header-container.sticky #navigation ul li > a.active {
    color: #1E40AF !important;
}
#header-container.sticky .show-lang span,
#header-container.sticky .show-lang i {
    color: #333 !important;
}
/* Swap logo white→dark on sticky */
#header-container.sticky .logo-white {
    display: none !important;
}
#header-container.sticky .logo-dark {
    display: inline-block !important;
}
#header #logo {
    padding: 8px 0;
}

/* Navigation links */
#navigation.style-1 ul li a {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 8px 14px;
}

/* Dropdown arrow — bigger, more visible */
#navigation ul li a .fa-caret-down,
#navigation ul li a::after {
    font-size: 10px;
}

/* Active page highlight */
#navigation ul li a.active {
    color: #1E40AF !important;
    border-bottom: 2px solid #1E40AF;
}
.inner-pages #navigation ul li a.active {
    color: #1E40AF !important;
}

/* Transparent header (homepage): white links */
.head-tr #navigation ul li > a {
    color: rgba(255,255,255,0.9);
}
.head-tr #navigation ul li > a:hover {
    color: #fff;
}
.head-tr #navigation ul li a.active {
    color: #fff !important;
    border-bottom-color: #F59E0B;
}

/* Dropdown menu styling */
#navigation ul li ul {
    min-width: 200px;
    border-radius: 8px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
    border: none;
    padding: 8px 0;
}
#navigation ul li ul li a {
    font-size: 14px !important;
    padding: 8px 20px !important;
    font-weight: 500 !important;
}
#navigation ul li ul li a:hover {
    background: #f0f4ff;
    color: #1E40AF !important;
}

/* Language switcher — cleaner */
.header-user-menu .show-lang {
    font-size: 14px;
    font-weight: 600;
}

/* Inner pages: solid white header with shadow */
.inner-pages #header-container {
    background: #fff;
    position: relative;
    z-index: 999;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

/* Half-map layout: fixed header above the fixed map */
.half-map-view #header-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99999;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* Half-map: use sticky instead of fixed so the map doesn't bleed over the footer */
.half-map-view .google-maps-right {
    position: sticky !important;
    top: 80px;
    height: calc(100vh - 80px);
    align-self: flex-start;
}

/* Fix station card list items: icon + text on same line */
.homes-content .homes-list.clearfix li {
    line-height: 1.5 !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px;
    margin-bottom: 6px;
}
.homes-content .homes-list li i {
    flex: 0 0 auto;
    margin-top: 3px;
}
.homes-content .homes-list li span {
    line-height: 1.5;
    display: inline;
    flex: 1 1 auto;
}

/* Primary color: heritage blue */
a:hover,
.text-primary { color: #1E40AF !important; }

.btn-yellow,
.btn-yellow:focus {
    background: #F59E0B;
    color: #fff;
    border: none;
}
.btn-yellow:hover {
    background: #D97706;
    color: #fff;
}

/* Navigation active link */
#navigation ul li a.active,
#navigation ul li:hover > a {
    color: #1E40AF;
}

/* Footer accent */
.first-footer h2::after {
    background: #F59E0B;
}

/* Progress bars default gradient */
.progress-bar {
    background: linear-gradient(to right, #28a745, #0284c7);
}

/* Card hover lift */
.project-single:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
    transition: all 0.3s ease;
}
.project-single {
    transition: all 0.3s ease;
}

/* Quiz option selected state */
.quiz-option:hover {
    border-color: #0284c7 !important;
    background: #f0f2ff !important;
}

/* ========================================
   Leaflet Popup Styling
   ======================================== */
.leaflet-popup-content-wrapper {
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important;
    padding: 0 !important;
    overflow: hidden;
}
.leaflet-popup-content {
    margin: 16px 30px 16px 18px !important;
    font-family: 'Montserrat', 'Arial', sans-serif;
}
.leaflet-popup-tip {
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.leaflet-popup-close-button {
    color: #6c757d !important;
    font-size: 22px !important;
    top: 4px !important;
    right: 6px !important;
    width: 24px !important;
    height: 24px !important;
}
.leaflet-popup-close-button:hover {
    color: #333 !important;
}

/* Search bar — full width input */
.rld-main-search .rld-single-input {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
}
.rld-main-search .rld-single-input input {
    width: 100% !important;
}

/* Hero section overlay refinement */
.welcome-area.overlay::before {
    background: linear-gradient(135deg, rgba(30,64,175,0.85), rgba(7,89,133,0.85));
}

/* ========================================
   Counter Section — Heritage Theme
   ======================================== */
section.counterup {
    background-attachment: fixed;
    padding: 5rem 0;
}
.counterup .countr .fa,
.counterup .countr .fas {
    color: #F59E0B !important;
    font-size: 2.8rem;
}
.counterup .countr p {
    font-size: 2.8rem;
    font-weight: 800;
}
.counterup .count-me h3 {
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ========================================
   Hero Section — Enhanced
   ======================================== */
.welcome-area.overlay::before {
    background: linear-gradient(135deg, rgba(30,64,175,0.82), rgba(7,89,133,0.78));
}
.banner-inner .title {
    text-shadow: 2px 2px 8px rgba(0,0,0,0.4);
}
/* Typed cursor */
.typed-cursor {
    color: #F59E0B;
    font-weight: 300;
}

/* ========================================
   Featured Stations Carousel
   ======================================== */
.rec-pro .listing-img-container {
    overflow: hidden;
    border-radius: 8px 8px 0 0;
    display: block;
}
.rec-pro .listing-img-container img {
    transition: transform 0.5s ease;
    width: 100%;
    height: 260px;
    object-fit: cover;
}
.rec-pro .listing-img-container:hover img {
    transform: scale(1.08);
}
.rec-pro .listing-badges .featured {
    background-color: #1E40AF;
}
.rec-pro .listing-compact-title {
    font-weight: 700;
}
.rec-pro .agents-grid {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 15px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: all 0.3s ease;
    margin: 0 5px;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.rec-pro .agents-grid:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}
.rec-pro .agents-grid .homes-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
.rec-pro .agents-grid .homes-content .homes-list li span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.rec-pro .agents-grid .homes-content .footer {
    margin-top: auto;
}
/* OWL dots styling */
.rec-pro .owl-dots .owl-dot span {
    background: #c5cae9;
}
.rec-pro .owl-dots .owl-dot.active span {
    background: #1E40AF;
}

/* ========================================
   Station Cards — Uniform Size
   ======================================== */
.project-single {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    height: 100%;
    display: flex;
    flex-direction: column;
}
.project-single .project-inner {
    flex: 0 0 auto;
}
.project-single .homes-img {
    overflow: hidden;
    display: block;
    height: 200px;
}
.project-single .homes-img img {
    transition: transform 0.5s ease;
    width: 100%;
    height: 200px;
    object-fit: cover;
}
.project-single:hover .homes-img img {
    transform: scale(1.08);
}
.project-single .homes-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 15px 20px 15px 20px !important;
}
.project-single .homes-content .homes-list {
    padding-right: 10px;
}
.project-single .homes-content h3 {
    font-size: 1.05rem;
    font-weight: 700;
    /* Fixed: 2 lines max */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.4em;
}
.project-single .homes-content .homes-list {
    flex: 1 1 auto;
}
.project-single .homes-content .homes-list li span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.project-single .homes-content .footer {
    margin-top: auto !important;
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
}
.project-single .homes-content .footer a {
    color: #1E40AF;
    font-weight: 600;
}
/* Station card badge */
.station-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    padding: 4px 10px;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
}
.station-badge.quiz { background: rgba(14,116,144,0.85); }
.station-badge.qr { background: rgba(40,167,69,0.85); }
.station-badge.heritage { background: rgba(30,64,175,0.85); }

/* ========================================
   Quiz Cards — Uniform Size
   ======================================== */
.quiz-station-card {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: none;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.quiz-station-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}
.quiz-station-card .card-img-top,
.quiz-station-card .card-img-top img {
    height: 200px;
    object-fit: cover;
    flex: 0 0 auto;
}
.quiz-station-card:hover .card-img-top img {
    transform: scale(1.05);
}
.quiz-station-card .card-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
.quiz-station-card .card-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.4em;
}
.quiz-station-card .card-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1 1 auto;
}
.quiz-station-card .btn-block {
    margin-top: auto;
}

/* Item wrapper — equal height in rows */
.portfolio-items,
.popular.featured,
#stations-right-list {
    display: flex !important;
    flex-wrap: wrap !important;
}
.portfolio-items > .item,
.popular > .item,
#stations-right-list > .item {
    display: flex;
}
.portfolio-items > .item > .project-single,
.popular > .item > .project-single,
#stations-right-list > .item > .project-single {
    width: 100%;
}

/* ========================================
   Section Backgrounds
   ======================================== */
.bg-white-2 {
    background: linear-gradient(135deg, #f8f9ff 0%, #eef1f5 100%);
}

/* ========================================
   Buttons — Rounded Modern Style
   ======================================== */
.btn-heritage {
    background: #1E40AF;
    color: #fff;
    border-radius: 30px;
    padding: 10px 28px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
}
.btn-heritage:hover {
    background: #1a37a0;
    color: #fff;
    box-shadow: 0 4px 12px rgba(30,64,175,0.3);
    transform: translateY(-2px);
}
.btn-gold {
    background: #F59E0B;
    color: #fff;
    border-radius: 30px;
    padding: 10px 28px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
}
.btn-gold:hover {
    background: #D97706;
    color: #fff;
    box-shadow: 0 4px 12px rgba(245,158,11,0.3);
    transform: translateY(-2px);
}

/* Fix mobile overflow on half-map stations page */
@media screen and (max-width: 575px) {
    .half-map-view .fx-google-map-right.pl-55 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .half-map-view .container-fluid {
        overflow-x: hidden;
    }
    /* Hero heading mobile fix */
    .headings-2 h1 {
        font-size: 1.5rem !important;
        word-break: break-word;
    }
    /* Mobile logo — centered, kept clear of the hamburger box,
       width-based sizing so the aspect ratio survives 320px screens too.
       (#header #logo needed to out-rank the desktop "#header #logo" rule.) */
    #header #logo,
    #logo {
        text-align: center;
        /* menu.css makes #logo absolute under 1024px and its static position
           varies per page (the half-map header pushed it off-screen) — pin it
           to the header instead and kill the theme's margin-right offsets */
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100vw;
        margin: 0 !important;
        padding: 0 85px;
    }
    #header #logo img,
    #logo img {
        height: auto !important;
        width: 100%;
        max-width: 230px;
        margin: 0 auto;
        display: block;
    }
    /* Counter mobile fix */
    .counterup .countr .fa,
    .counterup .countr .fas {
        font-size: 2rem;
        margin-right: 0.5rem;
    }
    .counterup .countr p {
        font-size: 1.8rem;
    }
    .counterup .count-me h3 {
        font-size: 0.8rem;
    }
}

/* Station detail: the theme's 90px section padding leaves a large empty band
   under the header on small screens */
@media screen and (max-width: 767px) {
    section.listing.blog.details {
        padding-top: 30px !important;
    }
}

/* Hungarian labels are sentence case — undo the theme's Title Case transform
   on nav links and buttons ("Túra Indítása" → "Túra indítása") */
#navigation.style-1 ul a,
body a.btn,
.btn,
.button {
    text-transform: none !important;
}

/* The theme paints a purple gradient on every .btn that has no background of
   its own — the white-outline (ghost) CTAs must stay transparent */
body a.btn {
    background-image: none !important;
}

/* Mobile menu "Térkép megnyitása" button: theme purple → brand blue
   (.mm-menu a.button.border needed to out-rank ".homepage-1 a.button.border") */
.mm-menu a.button.border,
.mm-menu a.button.border i {
    color: #1E40AF !important;
    border-color: #1E40AF !important;
}

/* Retire the template's leftover purple accent (#8731E8) in the footer and
   the scroll-to-top button in favour of the brand blue/amber pair */
.first-footer .netsocials a .fa-facebook,
.first-footer .netsocials a .fa-twitter,
.first-footer .netsocials a .fa-instagram,
.first-footer .netsocials a .fa-google-plus,
.first-footer .netsocials a .fa-youtube,
.first-footer .contactus ul li .fa {
    color: #F59E0B !important;
}
.first-footer .widget h3::after,
.first-footer .newsletters h3::after {
    background: #F59E0B !important;
}
.go-up {
    background: #1E40AF !important;
}
.widget.quick-link ul li a:hover,
.widget.quick-link ul li a:hover:before,
.popular .homes-content h3:hover {
    color: #F59E0B !important;
}

/* Station-card footer icons (arrow, QR): template green → brand blue */
.popular .footer i,
.project-single .footer i {
    color: #1E40AF !important;
}

/* Long source URLs in station descriptions must wrap instead of stretching
   the page sideways (real horizontal scroll on tablets, clipped on phones) */
.blog-pots a,
.blog-pots p {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Sticky-header clone: the theme's JS clones #header before mmenu moves the
   nav out of it, so on mobile the clone can keep the desktop nav and stretch
   far past the viewport, causing horizontal scroll. Cap it at viewport width
   and clip it below the desktop-nav breakpoint (mmenu is used under 1200px,
   so there is no header dropdown to clip there). */
#header.cloned {
    width: 100% !important;
    max-width: 100vw !important;
}
@media screen and (max-width: 1199px) {
    #header.cloned {
        overflow: hidden;
    }
}