
/* =========================================

   TOURS PAGE — Clean v7

========================================= */



/* ===== HERO ===== */

.tl-hero {

    position: relative;

    height: 55vh;

    min-height: 420px;

    background-size: cover;

    background-position: center;

    background-color: #081C33;

    display: flex;

    align-items: center;

    overflow: hidden;

}



.tl-hero::after {

    content: '';

    position: absolute;

    inset: 0;

    background: linear-gradient(to bottom, rgba(8,28,51,0.3) 0%, rgba(8,28,51,0.75) 100%);

    z-index: 1;

}



.tl-hero__inner {

    position: relative;

    z-index: 2;

    max-width: 1320px;

    margin: 0 auto;

    padding: 0 1.5rem 2rem;

    width: 100%;

    text-align: center;

}



.tl-hero__tag {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.45rem 1.2rem;

    background: rgba(255,255,255,0.12);

    backdrop-filter: blur(12px);

    border: 1px solid rgba(255,255,255,0.2);

    border-radius: 100px;

    font-size: 0.82rem;

    font-weight: 600;

    color: white;

    margin-bottom: 1.25rem;

}



.tl-hero__title {

    font-size: clamp(2.5rem, 6vw, 4.5rem);

    font-weight: 900;

    color: white;

    line-height: 1.05;

    letter-spacing: -0.04em;

    margin-bottom: 1rem;

    font-family: 'Inter', sans-serif;

    text-shadow: 0 4px 24px rgba(0,0,0,0.3);

}



.tl-hero__sub {

    color: rgba(255,255,255,0.7);

    font-size: 1rem;

}



/* ===== FILTERS ===== */

.tl-filters {

    position: relative;

    padding: 0 1.5rem;

    margin-top: -60px;

    z-index: 100;

    overflow: visible;

}



.tl-filters__inner {

    background: rgba(255,255,255,0.96);

    backdrop-filter: blur(24px);

    -webkit-backdrop-filter: blur(24px);

    border-radius: 24px;

    border: 1px solid rgba(255,255,255,0.9);

    box-shadow: 0 20px 60px rgba(0,0,0,0.12);

    padding: 1.5rem 2rem;

    max-width: 1320px;

    margin: 0 auto;

    overflow: visible;

}



.tl-filters__form {

    display: grid;

    grid-template-columns: 1.2fr 1.8fr 0.9fr 2fr 0.7fr 1fr auto;

    gap: 1rem;

    align-items: end;

}



.tl-filter-group {

    display: flex;

    flex-direction: column;

    gap: 0.4rem;

    position: relative;

    z-index: 10;

}



.tl-filter-group:focus-within {

    z-index: 200;

}



.tl-filter-label {

    font-size: 0.65rem;

    font-weight: 800;

    color: #081C33;

    text-transform: uppercase;

    letter-spacing: 0.08em;

}



.tl-select, .tl-input {

    padding: 0.65rem 0.9rem;

    border: 1.5px solid #eee;

    border-radius: 12px;

    font-size: 0.85rem;

    background: #F8F9FB;

    color: #081C33;

    font-family: inherit;

    font-weight: 500;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

    width: 100%;

}



.tl-select:focus, .tl-input:focus {

    outline: none;

    border-color: #FF6B00;

    background: white;

    box-shadow: 0 0 0 3px rgba(255,107,0,0.08);

}



.tl-date-row {

    display: grid;

    grid-template-columns: 0.8fr 1.8fr 1.3fr;

    gap: 0.3rem;

}



.tl-date-row .tl-select {

    font-size: 0.75rem;

    padding: 0.65rem 0.4rem;

}



.tl-dur-row {

    display: flex;

    gap: 0.4rem;

    flex-wrap: wrap;

}



.tl-dur-btn { cursor: pointer; }

.tl-dur-btn input { display: none; }



.tl-dur-btn span {

    display: inline-block;

    padding: 0.45rem 0.75rem;

    background: #F8F9FB;

    border: 1.5px solid #eee;

    border-radius: 10px;

    font-size: 0.78rem;

    font-weight: 600;

    color: #444;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

    white-space: nowrap;

    cursor: pointer;

}



.tl-dur-btn input:checked + span {

    background: #FF6B00;

    border-color: #FF6B00;

    color: white;

    box-shadow: 0 4px 12px rgba(255,107,0,0.3);

}



.tl-dur-btn span:hover { border-color: #FF6B00; color: #FF6B00; }



.tl-filter-group--btns {

    justify-content: flex-end;

    gap: 0.5rem;

}



.tl-btn-primary {

    padding: 0.7rem 1.5rem;

    background: linear-gradient(135deg, #FF6B00, #FF8C3A);

    color: white;

    border: none;

    border-radius: 14px;

    font-size: 0.9rem;

    font-weight: 700;

    cursor: pointer;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

    font-family: inherit;

    text-decoration: none;

    text-align: center;

    white-space: nowrap;

    box-shadow: 0 8px 20px rgba(255,107,0,0.35);

}



.tl-btn-primary:hover {

    transform: translateY(-2px);

    box-shadow: 0 12px 28px rgba(255,107,0,0.45);

    color: white;

}



.tl-btn-reset {

    padding: 0.7rem 1rem;

    background: transparent;

    border: 1.5px solid #eee;

    border-radius: 14px;

    font-size: 0.82rem;

    color: #888;

    text-decoration: none;

    text-align: center;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

    font-family: inherit;

}



.tl-btn-reset:hover { border-color: #FF6B00; color: #FF6B00; }



/* Slider */

.slider-values {

    font-size: 0.82rem;

    font-weight: 800;

    color: #FF6B00;

    margin-bottom: 6px;

}



.slider-track-bg {

    position: relative;

    height: 4px;

    background: #eee;

    border-radius: 2px;

    margin: 6px 0;

}



.slider-fill {

    position: absolute;

    height: 100%;

    background: #FF6B00;

    border-radius: 2px;

}



.slider-inputs {

    position: relative;

    height: 20px;

    margin-top: -12px;

}



.slider-inputs input[type="range"] {

    position: absolute;

    top: 0;

    width: 100%;

    appearance: none;

    -webkit-appearance: none;

    background: transparent;

    pointer-events: none;

    margin: 0;

}



.slider-inputs input[type="range"]:first-child { z-index: 2; }

.slider-inputs input[type="range"]:last-child { z-index: 1; }



.slider-inputs input[type="range"]::-webkit-slider-thumb {

    -webkit-appearance: none;

    width: 18px;

    height: 18px;

    background: #FF6B00;

    border-radius: 50%;

    cursor: pointer;

    pointer-events: auto;

    border: 2px solid white;

    box-shadow: 0 2px 6px rgba(255,107,0,0.3);

    margin-top: -7px;

}



.slider-inputs input[type="range"]::-webkit-slider-runnable-track {

    height: 4px;

    background: transparent;

}



/* ===== RESULTS ===== */

.tl-results {

    padding: 2rem 1.5rem 4rem;

    background: #F4F6FA;

    position: relative;

    z-index: 1;

}



.tl-results__inner { max-width: 1320px; margin: 0 auto; }



.tl-results__head {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 2rem;

    flex-wrap: wrap;

    gap: 1rem;

}



.tl-results__info { display: flex; align-items: center; gap: 1rem; }



.tl-results__info h2 {

    font-size: 1.4rem;

    font-weight: 800;

    color: #081C33;

    font-family: 'Inter', sans-serif;

}



.tl-results__count {

    background: white;

    border: 1.5px solid #eee;

    border-radius: 20px;

    padding: 0.3rem 0.9rem;

    font-size: 0.78rem;

    color: #888;

    font-weight: 600;

}



.tl-results__sort {

    display: flex;

    align-items: center;

    gap: 0.75rem;

    font-size: 0.82rem;

    color: #888;

}



/* ===== CARDS GRID ===== */

.tl-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1.5rem;

}



/* ===== CARD ===== */

.tl-card {

    position: relative;

    border-radius: 24px;

    overflow: hidden;

    aspect-ratio: 3/4;

    cursor: pointer;

    transition: transform 0.35s cubic-bezier(0.23,1,0.32,1),

                box-shadow 0.35s cubic-bezier(0.23,1,0.32,1);

    background: #081C33;

}



.tl-card:hover {

    transform: translateY(-6px);

    box-shadow: 0 28px 56px rgba(0,0,0,0.18);

}



/* Img wrap — fills card */

.tl-card__img-wrap {

    position: absolute;

    inset: 0;

    display: block;

    text-decoration: none;

    border-radius: 0;

    overflow: hidden;

}



/* Img */

.tl-card__img {

    position: absolute;

    inset: 0;

    background-size: cover;

    background-position: center;

    background-color: #081C33;

    transition: transform 0.6s cubic-bezier(0.23,1,0.32,1);

}



.tl-card:hover .tl-card__img {

    transform: scale(1.06);

}



/* Gradient overlay */

.tl-card__img::after {

    content: '';

    position: absolute;

    inset: 0;

    background: linear-gradient(

        to bottom,

        transparent 0%,

        rgba(8,28,51,0.08) 35%,

        rgba(8,28,51,0.45) 60%,

        rgba(8,28,51,0.82) 85%,

        rgba(8,28,51,0.92) 100%

    );

    z-index: 1;

}



/* Days badge */

.tl-card__days {

    position: absolute;

    top: 14px;

    left: 14px;

    z-index: 10;

    background: #FF6B00;

    color: white;

    padding: 5px 12px;

    border-radius: 20px;

    font-size: 0.72rem;

    font-weight: 700;

    letter-spacing: 0.03em;

    box-shadow: 0 4px 12px rgba(255,107,0,0.4);

    pointer-events: none;

}



/* Wish button */

.tl-card__wish {

    position: absolute;

    top: 14px;

    right: 14px;

    z-index: 10;

    width: 36px;

    height: 36px;

    background: rgba(255,255,255,0.15);

    backdrop-filter: blur(10px);

    -webkit-backdrop-filter: blur(10px);

    border: 1px solid rgba(255,255,255,0.25);

    border-radius: 50%;

    font-size: 0.95rem;

    display: flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    transition: background 0.2s, transform 0.2s;

}



.tl-card__wish:hover {

    background: rgba(255,255,255,0.28);

    transform: scale(1.1);

}



@keyframes wishPop {

    0% { transform: scale(1); }

    50% { transform: scale(1.4); }

    100% { transform: scale(1); }

}



.tl-card__wish.active { animation: wishPop 0.3s ease; }



/* Body */

.tl-card__body {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    z-index: 3;

    padding: 0 1.25rem 1.25rem;

    background: none;

}



/* Destination */

.tl-card__dest {

    display: block;

    font-size: 0.65rem;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #FF8C3A;

    text-transform: uppercase;

    margin-bottom: 6px;

}



/* Name */

.tl-card__name {

    display: block;

    font-size: 1.08rem;

    font-weight: 600;

    color: white;

    text-decoration: none;

    line-height: 1.3;

    margin-bottom: 8px;

    font-family: 'Inter', sans-serif;

}



.tl-card__name:hover { color: white; }



/* Desc */

.tl-card__desc {

    font-size: 0.76rem;

    color: rgba(255,255,255,0.65);

    line-height: 1.5;

    margin-bottom: 8px;

}



/* Meta */

.tl-card__meta {

    display: flex;

    gap: 1rem;

    font-size: 0.73rem;

    color: rgba(255,255,255,0.7);

    margin-bottom: 12px;

}



/* Footer */

.tl-card__footer {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding-top: 10px;

    border-top: 1px solid rgba(255,255,255,0.15);

}



/* Price */

.tl-card__price {

    display: flex;

    flex-direction: row;

    align-items: baseline;

    gap: 5px;

}



.tl-card__price-from {

    font-size: 0.68rem;

    color: rgba(255,255,255,0.55);

    font-weight: 400;

    letter-spacing: 0.05em;

}



.tl-card__price-val {

    font-size: 1.35rem;

    font-weight: 800;

    color: white;

    letter-spacing: -0.02em;

    line-height: 1;

    font-family: 'Inter', sans-serif;

}



/* CTA */

.tl-card__cta {

    opacity: 0;

    transform: translateX(6px);

    transition: all 0.25s;

    background: #FF6B00;

    color: white;

    padding: 0.4rem 1rem;

    border-radius: 20px;

    font-size: 0.75rem;

    font-weight: 700;

    text-decoration: none;

    white-space: nowrap;

    box-shadow: 0 4px 12px rgba(255,107,0,0.4);

}



.tl-card:hover .tl-card__cta {

    opacity: 1;

    transform: translateX(0);

}



/* ===== EMPTY ===== */

.tl-empty {

    text-align: center;

    padding: 5rem 2rem;

    background: white;

    border-radius: 20px;

    grid-column: 1 / -1;

}



.tl-empty__icon { font-size: 3.5rem; margin-bottom: 1rem; opacity: 0.4; }

.tl-empty h3 { font-size: 1.3rem; font-weight: 700; color: #081C33; margin-bottom: 0.5rem; }

.tl-empty p { color: #888; margin-bottom: 1.5rem; }



/* ===== PAGINATION ===== */

.tl-pagination {

    display: flex;

    justify-content: center;

    gap: 0.5rem;

    margin-top: 3rem;

    flex-wrap: wrap;

}



.tl-page-btn {

    padding: 0.55rem 1.1rem;

    background: white;

    border: 1.5px solid #e8e8e8;

    border-radius: 10px;

    color: #081C33;

    text-decoration: none;

    font-size: 0.82rem;

    font-weight: 500;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

}



.tl-page-btn:hover, .tl-page-btn.active {

    background: #FF6B00;

    border-color: #FF6B00;

    color: white;

}



/* ===== MOBILE ===== */

@media (max-width: 1100px) {

    .tl-filters__form { grid-template-columns: repeat(3, 1fr); }

    .tl-grid { grid-template-columns: repeat(2, 1fr); }

}



@media (max-width: 768px) {

    .tl-hero { height: 50vh; min-height: 360px; }

    .tl-filters { margin-top: -30px; padding: 0 1rem; }

    .tl-filters__inner { padding: 1.25rem; border-radius: 20px; }

    .tl-filters__form { grid-template-columns: 1fr; gap: 0.75rem; }

    .tl-results { padding: 1.5rem 1rem 3rem; }

    .tl-grid { grid-template-columns: 1fr; gap: 1rem; }

    .tl-results__head { flex-direction: column; align-items: flex-start; }

}






/* ===== CARD FINAL FIXES ===== */

.tl-card__body {

    padding: 0 1.25rem 1.4rem !important;

}



.tl-card__dest {

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

    max-width: calc(100% - 50px) !important;

}



.tl-card__wish {

    position: absolute !important;

    top: 14px !important;

    right: 14px !important;

    z-index: 10 !important;

}



.tl-card__img::after {

    background: linear-gradient(

        to bottom,

        rgba(8,28,51,0.05) 0%,

        rgba(8,28,51,0.15) 30%,

        rgba(8,28,51,0.55) 60%,

        rgba(8,28,51,0.88) 82%,

        rgba(8,28,51,0.96) 100%

    ) !important;

    z-index: 1 !important;

}



.tl-card__price-val {

    font-size: 1.2rem !important;

}




/* ===== CARD FIXES v2 ===== */

.tl-card__body {

    padding: 0 1.25rem 1.5rem !important;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    min-height: 55%;

}



.tl-card__dest {

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

    max-width: calc(100% - 50px) !important;

    margin-bottom: 8px !important;

}



.tl-card__name {

    font-size: 1.15rem !important;

    font-weight: 800 !important;

    margin-bottom: 12px !important;

    line-height: 1.25 !important;

}



.tl-card__desc {

    margin-bottom: 10px !important;

}



.tl-card__meta {

    margin-bottom: 16px !important;

}



.tl-card__footer {

    margin-top: 4px !important;

    padding-top: 12px !important;

}



.tl-card__price-val {

    font-size: 1.75rem !important;

    font-weight: 900 !important;

    color: white !important;

}



.tl-card__price-from {

    font-size: 0.72rem !important;

    opacity: 0.7 !important;

}



.tl-card__img::after {

    background: linear-gradient(

        to bottom,

        transparent 0%,

        rgba(8,28,51,0.05) 25%,

        rgba(8,28,51,0.50) 55%,

        rgba(8,28,51,0.88) 80%,

        rgba(8,28,51,0.97) 100%

    ) !important;

}




/* ===== POLISH v3 ===== */



.tl-card__blur {

    position: absolute;

    inset: auto 0 0 0;

    height: 38%;

    backdrop-filter: blur(18px);

    -webkit-backdrop-filter: blur(18px);

    mask-image: linear-gradient(to top, black 0%, black 55%, transparent 100%);

    -webkit-mask-image: linear-gradient(to top, black 0%, black 55%, transparent 100%);

    pointer-events: none;

    z-index: 2;

}



.tl-card__img::after {

    background: linear-gradient(

        to bottom,

        transparent 0%,

        rgba(8,28,51,0.08) 45%,

        rgba(8,28,51,0.55) 72%,

        rgba(8,28,51,0.92) 100%

    ) !important;

    z-index: 1 !important;

}



.tl-card__body {

    z-index: 3 !important;

    padding: 0 1.5rem 1.75rem !important;

}



.tl-card__price {

    padding-left: 8px !important;

    margin-top: 4px !important;

}



.tl-card__price-val {

    font-size: 1.75rem !important;

    font-weight: 900 !important;

    color: white !important;

    display: block !important;

    line-height: 1.1 !important;

}



.tl-card__price-from {

    font-size: 0.68rem !important;

    opacity: 0.65 !important;

    display: block !important;

    margin-bottom: 2px !important;

}



.tl-card__footer {

    border-top: 1px solid rgba(255,255,255,0.12) !important;

    padding-top: 12px !important;

}



.tl-card__meta {

    color: rgba(255,255,255,0.9) !important;

    margin-bottom: 16px !important;

}



.tl-card__dest {

    font-size: 0.68rem !important;

    letter-spacing: 2px !important;

    font-weight: 800 !important;

    opacity: 0.95 !important;

}



.tl-card__wish {

    width: 32px !important;

    height: 32px !important;

    background: rgba(255,255,255,0.12) !important;

    backdrop-filter: blur(20px) !important;

    -webkit-backdrop-filter: blur(20px) !important;

    font-size: 0.85rem !important;

}




/* ===== POLISH v4 ===== */



.tl-card__body {

    padding: 0 1.5rem 1.75rem !important;

    padding-bottom: 1.75rem !important;

    bottom: 0 !important;

    transform: translateY(-16px) !important;

}



.tl-card__name {

    margin-bottom: 10px !important;

}



.tl-card__desc {

    margin-top: 10px !important;

    margin-bottom: 10px !important;

}



.tl-card__price-val {

    font-size: 1.6rem !important;

    font-weight: 800 !important;

}



.tl-card__footer {

    border-top: none !important;

}



.tl-card__wish {

    background: rgba(255,255,255,0.18) !important;

    backdrop-filter: blur(24px) !important;

    -webkit-backdrop-filter: blur(24px) !important;

}




/* ===== FILTERS v3 ===== */

.tl-filters__form {

    grid-template-columns: 2.2fr 1.6fr 1.3fr 1.5fr 0.7fr auto !important;

    gap: 1.2rem !important;

}



.tl-filter-group--dest .tl-select {

    min-width: 220px !important;

}



.tl-filter-group--price {

    margin-right: 12px !important;

}



.tl-filter-group--people .tl-input {

    color: #081C33 !important;

    border-color: #ddd !important;

}



.tl-filter-group--people .tl-input::placeholder {

    color: #aaa !important;

    opacity: 1 !important;

}



.tl-filter-group--btns {

    display: flex !important;

    flex-direction: column !important;

    align-items: stretch !important;

    gap: 6px !important;

}



.tl-btn-reset {

    background: none !important;

    border: none !important;

    padding: 4px 0 !important;

    font-size: 0.75rem !important;

    color: #aaa !important;

    text-align: center !important;

    text-decoration: underline !important;

    text-underline-offset: 3px !important;

    cursor: pointer !important;

}



.tl-btn-reset:hover {

    color: #FF6B00 !important;

    border: none !important;

    background: none !important;

    transform: none !important;

}




/* ===== DATE PICKER ===== */

.tl-date-single {

    position: relative;

}



.tl-date-display {

    cursor: pointer !important;

    background: #F8F9FB !important;

    caret-color: transparent !important;

}



.tl-date-display:focus {

    border-color: #FF6B00 !important;

    box-shadow: 0 0 0 3px rgba(255,107,0,0.08) !important;

}



.tl-date-popup {

    display: none;

    position: absolute;

    top: calc(100% + 8px);

    left: 0;

    background: white;

    border-radius: 16px;

    border: 1.5px solid #eee;

    box-shadow: 0 12px 40px rgba(0,0,0,0.12);

    padding: 1rem;

    z-index: 500;

    min-width: 320px;

}



.tl-date-popup.open {

    display: block;

}



.tl-date-popup__row {

    display: grid;

    grid-template-columns: 0.8fr 1.4fr 1fr;

    gap: 8px;

    margin-bottom: 10px;

}



.tl-date-popup__apply {

    width: 100%;

    padding: 0.6rem;

    background: #FF6B00;

    color: white;

    border: none;

    border-radius: 10px;

    font-size: 0.85rem;

    font-weight: 700;

    cursor: pointer;

    font-family: inherit;

    transition: background 0.2s;

}



.tl-date-popup__apply:hover {

    background: #e55f00;

}




/* ===== FILTERS FINAL POLISH ===== */



.tl-filters__inner {

    padding: 1.1rem 2rem !important;

}



.tl-filter-group + .tl-filter-group {

    border-left: 1px solid rgba(8,28,51,0.06);

    padding-left: 1.2rem;

}



.tl-filter-group--btns {

    border-left: none !important;

    padding-left: 0 !important;

}



.tl-filter-group--people .tl-input {

    color: #081C33 !important;

    font-weight: 600 !important;

}



.tl-filter-group--people .tl-input::placeholder {

    color: #081C33 !important;

    opacity: 0.45 !important;

    font-weight: 500 !important;

}



.tl-filter-group--dur .tl-dur-btn span {

    font-size: 0.72rem !important;

    padding: 0.3rem 0.55rem !important;

    color: #555 !important;

    background: #F4F5F7 !important;

    border-color: transparent !important;

}



.tl-filter-group--dur .tl-dur-btn span:hover {

    border-color: #FF6B00 !important;

    color: #FF6B00 !important;

    background: #FFF5EE !important;

}



.tl-filter-group--dur .tl-dur-btn input:checked + span {

    background: #FF6B00 !important;

    border-color: #FF6B00 !important;

    color: white !important;

    font-weight: 700 !important;

    box-shadow: 0 3px 10px rgba(255,107,0,0.28) !important;

    opacity: 1 !important;

}



.tl-select:focus,

.tl-input:focus,

.tl-date-display:focus {

    border-color: #FF6B00 !important;

    box-shadow: 0 0 0 3px rgba(255,107,0,0.08) !important;

    background: white !important;

}



.tl-btn-primary {

    transition: transform 0.25s cubic-bezier(0.22,1,0.36,1),

                box-shadow 0.25s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-btn-primary:hover {

    transform: translateY(-2px) !important;

    box-shadow: 0 14px 32px rgba(255,107,0,0.42) !important;

}



.tl-btn-reset {

    color: #9AA3B0 !important;

    text-decoration: none !important;

    font-weight: 500 !important;

    letter-spacing: 0.01em !important;

}



.tl-btn-reset:hover {

    color: #FF6B00 !important;

}



@media (max-width: 1200px) {

    .tl-filter-group + .tl-filter-group {

        border-left: none;

        padding-left: 0;

    }

}




/* ===== FILTERS MICRO POLISH ===== */

.tl-filter-group + .tl-filter-group {

    border-left-color: rgba(8,28,51,0.04) !important;

}



.tl-filters__form {

    grid-template-columns: 2.2fr 1.6fr 1.3fr 1.5fr 1fr auto !important;

}



.tl-filter-group--people {

    min-width: 140px !important;

}



.tl-filters__inner {

    padding: 1rem 2rem !important;

}



.tl-filter-group--btns {

    align-items: center !important;

}



.tl-btn-reset {

    color: #9AA3B0 !important;

    font-size: 0.72rem !important;

    text-decoration: none !important;

    transition: color 0.2s !important;

}




/* ===== MOBILE v2 ===== */

@media (max-width: 768px) {



    .tl-hero {

        height: 45vh !important;

        min-height: 300px !important;

    }



    .tl-filters {

        margin-top: 0 !important;

        padding: 1rem !important;

        position: relative !important;

        z-index: 10 !important;

    }



    .tl-filters__inner {

        padding: 1.25rem !important;

        border-radius: 20px !important;

    }



    .tl-filters__form {

        display: grid !important;

        grid-template-columns: 1fr 1fr !important;

        gap: 0.75rem !important;

    }



    .tl-filter-group--dest {

        grid-column: 1 / -1 !important;

    }



    .tl-filter-group--date {

        grid-column: 1 / 2 !important;

    }



    .tl-filter-group--people {

        grid-column: 2 / 3 !important;

        min-width: unset !important;

    }



    .tl-filter-group--price,

    .tl-filter-group--dur {

        display: none !important;

    }



    .tl-filters__more-btn {

        grid-column: 1 / 2 !important;

        display: flex !important;

        align-items: center !important;

        gap: 6px !important;

        padding: 0.65rem 1rem !important;

        background: #F4F6FA !important;

        border: 1.5px solid #eee !important;

        border-radius: 12px !important;

        font-size: 0.82rem !important;

        font-weight: 600 !important;

        color: #081C33 !important;

        cursor: pointer !important;

        transition: all 0.2s !important;

        white-space: nowrap !important;

        justify-content: center !important;

    }



    .tl-filters__more-btn:hover {

        border-color: #FF6B00 !important;

        color: #FF6B00 !important;

    }



    .tl-filter-group--btns {

        grid-column: 2 / 3 !important;

        border-left: none !important;

        padding-left: 0 !important;

    }



    .tl-filter-group--btns .tl-btn-primary {

        width: 100% !important;

    }



    .tl-btn-reset {

        display: none !important;

    }



    .tl-filter-group + .tl-filter-group {

        border-left: none !important;

        padding-left: 0 !important;

    }



    .tl-results {

        padding: 1rem 1rem 3rem !important;

    }



    .tl-grid {

        grid-template-columns: 1fr 1fr !important;

        gap: 0.75rem !important;

    }



    .tl-results__head {

        flex-direction: column !important;

        align-items: flex-start !important;

    }

}



@media (max-width: 480px) {

    .tl-grid {

        grid-template-columns: 1fr !important;

    }

}



/* Bottom sheet — всегда скрыт на десктопе */

.tl-filters__more-btn { display: none; }



.tl-bottom-sheet { display: none; }



@media (max-width: 768px) {

    .tl-filters__more-btn { display: flex; }

    .tl-bottom-sheet { display: block; }

}



.tl-bottom-sheet__overlay {

    position: fixed;

    inset: 0;

    background: rgba(8,28,51,0.5);

    z-index: 1050;

    opacity: 0;

    pointer-events: none;

    transition: opacity 0.3s cubic-bezier(0.22,1,0.36,1);

}



.tl-bottom-sheet__panel {

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    background: white;

    border-radius: 24px 24px 0 0;

    z-index: 1051;

    padding: 0 1.5rem 2rem;

    transform: translateY(100%);

    transition: transform 0.35s cubic-bezier(0.22,1,0.36,1);

    max-height: 85vh;

    overflow-y: auto;

}



.tl-bottom-sheet.open .tl-bottom-sheet__overlay {

    opacity: 1;

    pointer-events: auto;

}



.tl-bottom-sheet.open .tl-bottom-sheet__panel {

    transform: translateY(0);

}



.tl-bottom-sheet__handle {

    width: 40px;

    height: 4px;

    background: #e0e0e0;

    border-radius: 2px;

    margin: 12px auto 0;

}



.tl-bottom-sheet__header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 1rem 0 0.75rem;

    border-bottom: 1px solid #f0f0f0;

    margin-bottom: 1.25rem;

}



.tl-bottom-sheet__title {

    font-size: 1rem;

    font-weight: 700;

    color: #081C33;

}



.tl-bottom-sheet__close {

    width: 32px;

    height: 32px;

    border-radius: 50%;

    background: #F4F6FA;

    border: none;

    font-size: 0.85rem;

    color: #666;

    cursor: pointer;

    display: flex;

    align-items: center;

    justify-content: center;

}



.tl-bs-group {

    margin-bottom: 1.5rem;

}



.tl-bs-group .tl-filter-label {

    display: block;

    margin-bottom: 0.75rem;

}



.tl-bottom-sheet__footer {

    padding-top: 1rem;

    border-top: 1px solid #f0f0f0;

}



.tl-bottom-sheet__footer .tl-btn-primary {

    width: 100%;

    padding: 0.85rem;

    font-size: 1rem;

}




/* ===== MOBILE v3 — single source of truth ===== */

@media (max-width: 768px) {



    .tl-filters__form {

        display: flex !important;

        flex-direction: column !important;

        gap: 0.75rem !important;

    }



    .tl-filter-group--price,

    .tl-filter-group--dur {

        display: none !important;

    }



    .tl-filter-group + .tl-filter-group {

        border-left: none !important;

        padding-left: 0 !important;

    }



    .tl-filters__more-btn {

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        gap: 8px !important;

        padding: 0.7rem 1rem !important;

        background: transparent !important;

        border: 1.5px dashed rgba(8,28,51,0.18) !important;

        border-radius: 12px !important;

        font-size: 0.85rem !important;

        font-weight: 700 !important;

        color: #081C33 !important;

        cursor: pointer !important;

        transition: all 0.2s !important;

    }



    .tl-filters__more-btn:hover {

        border-color: #FF6B00 !important;

        color: #FF6B00 !important;

    }



    .tl-more-badge {

        background: #FF6B00;

        color: white;

        font-size: 0.68rem;

        font-weight: 800;

        width: 18px;

        height: 18px;

        border-radius: 50%;

        display: inline-flex;

        align-items: center;

        justify-content: center;

    }



    .tl-filter-group--btns {

        border-left: none !important;

        padding-left: 0 !important;

    }



    .tl-filter-group--btns .tl-btn-primary {

        width: 100% !important;

        padding: 0.85rem !important;

        font-size: 1rem !important;

    }



    .tl-btn-reset { display: none !important; }



    .tl-results { padding: 1rem 1rem 3rem !important; }



    .tl-grid {

        grid-template-columns: 1fr 1fr !important;

        gap: 0.75rem !important;

    }



    .tl-results__head {

        flex-direction: column !important;

        align-items: flex-start !important;

    }

}



@media (max-width: 480px) {

    .tl-grid { grid-template-columns: 1fr !important; }

}



/* Bottom Sheet в BS body показываем скрытые группы */

.tl-bottom-sheet__body .tl-filter-group--price,

.tl-bottom-sheet__body .tl-filter-group--dur {

    display: block !important;

    margin-bottom: 1.5rem;

}



.tl-bottom-sheet__body .tl-filter-group + .tl-filter-group {

    border-left: none !important;

    padding-left: 0 !important;

}



.tl-btn-bs-apply {

    width: 100% !important;

    padding: 0.85rem !important;

    font-size: 1rem !important;

}




/* ===== MOBILE v4 ===== */

@media (max-width: 768px) {



    .tl-filters {

        margin-top: 24px !important;

    }



    .tl-filters__inner {

        padding: 1.5rem 1.25rem !important;

    }



    .tl-filters__form {

        display: flex !important;

        flex-direction: column !important;

        gap: 0.65rem !important;

    }



    .tl-filter-group,

    .tl-filter-group--dest,

    .tl-filter-group--date,

    .tl-filter-group--people,

    .tl-filter-group--btns {

        width: 100% !important;

        grid-column: unset !important;

    }



    .tl-filter-label {

        font-size: 0.72rem !important;

        font-weight: 600 !important;

        text-transform: none !important;

        letter-spacing: 0.03em !important;

        color: #555 !important;

        margin-bottom: 6px !important;

    }



    .tl-select,

    .tl-input,

    .tl-date-display {

        height: 52px !important;

        font-size: 0.95rem !important;

        padding: 0 1rem !important;

        width: 100% !important;

        box-sizing: border-box !important;

    }



    .tl-date-row {

        display: grid !important;

        grid-template-columns: 0.8fr 1.4fr 1fr !important;

        gap: 6px !important;

    }



    .tl-date-row .tl-select {

        height: 52px !important;

        font-size: 0.82rem !important;

        padding: 0 0.5rem !important;

    }



    .tl-filters__more-btn {

        width: 100% !important;

        height: 48px !important;

        background: transparent !important;

        border: none !important;

        font-size: 0.85rem !important;

        font-weight: 500 !important;

        color: #8A94A6 !important;

        letter-spacing: 0.01em !important;

        justify-content: flex-start !important;

        padding: 0 0.25rem !important;

        gap: 6px !important;

    }



    .tl-filters__more-btn:hover {

        color: #FF6B00 !important;

        border: none !important;

    }



    .tl-filter-group--btns {

        margin-top: 4px !important;

    }



    .tl-filter-group--btns .tl-btn-primary {

        width: 100% !important;

        height: 56px !important;

        font-size: 1rem !important;

        border-radius: 16px !important;

    }

}




/* ===== DURATION PILLS + MOBILE POLISH ===== */

.tl-dur-btn span {

    height: 40px !important;

    border-radius: 999px !important;

    display: inline-flex !important;

    align-items: center !important;

    padding: 0 1rem !important;

    font-size: 0.78rem !important;

    font-weight: 600 !important;

    transition: all 0.2s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-dur-btn input:checked + span {

    background: #FF6B00 !important;

    border-color: #FF6B00 !important;

    color: white !important;

    box-shadow: 0 4px 12px rgba(255,107,0,0.28) !important;

    transform: scale(1.04) !important;

}



@media (max-width: 768px) {

    .tl-filter-group {

        gap: 6px !important;

    }



    .tl-filter-label {

        margin-bottom: 6px !important;

    }



    .tl-select,

    .tl-input,

    .tl-date-display {

        height: 54px !important;

    }



    .tl-hero {

        height: 38vh !important;

        min-height: 220px !important;

    }



    .tl-filters {

        margin-top: 16px !important;

    }

}




/* ===== DURATION PILLS + MOBILE POLISH ===== */

.tl-dur-btn span {

    height: 40px !important;

    border-radius: 999px !important;

    display: inline-flex !important;

    align-items: center !important;

    padding: 0 1rem !important;

    font-size: 0.78rem !important;

    font-weight: 600 !important;

    transition: all 0.2s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-dur-btn input:checked + span {

    background: #FF6B00 !important;

    border-color: #FF6B00 !important;

    color: white !important;

    box-shadow: 0 4px 12px rgba(255,107,0,0.28) !important;

    transform: scale(1.04) !important;

}



@media (max-width: 768px) {

    .tl-filter-group {

        gap: 6px !important;

    }



    .tl-filter-label {

        margin-bottom: 6px !important;

    }



    .tl-select,

    .tl-input,

    .tl-date-display {

        height: 54px !important;

    }



    .tl-hero {

        height: 38vh !important;

        min-height: 220px !important;

    }



    .tl-filters {

        margin-top: 16px !important;

    }

}




/* ===== CHIPS + MOBILE POLISH v5 ===== */

@media (max-width: 768px) {

    .tl-select,

    .tl-input,

    .tl-date-display {

        height: 54px !important;

    }



    .tl-filter-label {

        text-transform: none !important;

        letter-spacing: 0.02em !important;

        font-size: 0.75rem !important;

        color: #666 !important;

    }



    .tl-filters__inner {

        margin-bottom: 0 !important;

    }

}



.tl-active-chips {

    display: none;

    flex-wrap: wrap;

    gap: 8px;

    padding: 0.75rem 1.5rem 0;

}



.tl-active-chips.has-chips {

    display: flex;

}



.tl-chip {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    padding: 5px 10px 5px 12px;

    background: #FFF5EE;

    border: 1px solid rgba(255,107,0,0.2);

    border-radius: 999px;

    font-size: 0.75rem;

    font-weight: 600;

    color: #FF6B00;

    cursor: pointer;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1);

}



.tl-chip:hover {

    background: #FFE8D6;

}



.tl-chip__remove {

    width: 16px;

    height: 16px;

    border-radius: 50%;

    background: rgba(255,107,0,0.15);

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-size: 0.6rem;

    font-weight: 800;

    line-height: 1;

}




/* ===== PAGE DEPTH v1 ===== */



/* 1. Hero меньше */

.tl-hero {

    height: 62vh !important;

    min-height: 420px !important;

}



/* 2. Фильтр glassmorphism */

.tl-filters__inner {

    background: rgba(255,255,255,0.92) !important;

    backdrop-filter: blur(24px) !important;

    -webkit-backdrop-filter: blur(24px) !important;

    box-shadow: 0 24px 64px rgba(0,0,0,0.10) !important;

}



/* 3. Бюджет шире */

.tl-filter-group--price {

    min-width: 190px !important;

}



/* 4. Кнопка поиска крупнее */

.tl-btn-primary {

    height: 58px !important;

    font-weight: 800 !important;

    letter-spacing: -0.01em !important;

}



/* 5. Воздух между фильтром и результатами */

.tl-results {

    padding-top: 3rem !important;

}



/* Система глубины — разные уровни теней */

.tl-filters__inner {

    position: relative !important;

    z-index: 10 !important;

}



.tl-card {

    box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;

}



.tl-card:hover {

    box-shadow: 0 28px 56px rgba(0,0,0,0.20) !important;

    z-index: 2 !important;

}



.tl-filters {

    z-index: 20 !important;

}




/* ===== BOOK BTN ON CARD ===== */

.tl-card__cta--book {

    background: transparent !important;

    border: 1px solid rgba(255,255,255,0.5) !important;

    color: white !important;

    box-shadow: none !important;

    opacity: 0;

    transform: translateX(6px);

    transition: all 0.25s !important;

}



.tl-card:hover .tl-card__cta--book {

    opacity: 1 !important;

    transform: translateX(0) !important;

}



.tl-card__cta--book:hover {

    background: rgba(255,255,255,0.15) !important;

    border-color: white !important;

    color: white !important;

}



.tl-card__footer {

    flex-wrap: wrap !important;

    gap: 6px !important;

}




/* ===== CARD PREMIUM FINAL ===== */



.tl-card {

    position: relative !important;

    border-radius: 24px !important;

    overflow: hidden !important;

    aspect-ratio: 3/4 !important;

    cursor: pointer !important;

    background: #081C33 !important;

    box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;

    transition: transform 0.4s cubic-bezier(0.22,1,0.36,1),

                box-shadow 0.4s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-card:hover {

    transform: translateY(-10px) !important;

    box-shadow: 0 40px 120px rgba(0,0,0,0.22),

                0 0 0 1px rgba(255,255,255,0.06) !important;

}



.tl-card__img-wrap {

    position: absolute !important;

    inset: 0 !important;

    display: block !important;

    overflow: hidden !important;

}



.tl-card__img {

    position: absolute !important;

    inset: 0 !important;

    background-size: cover !important;

    background-position: center !important;

    transition: transform 0.7s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-card:hover .tl-card__img {

    transform: scale(1.07) !important;

}



.tl-card__img::after {

    content: "" !important;

    position: absolute !important;

    inset: 0 !important;

    background: linear-gradient(

        180deg,

        transparent 0%,

        rgba(0,0,0,0.08) 35%,

        rgba(0,0,0,0.45) 62%,

        rgba(0,0,0,0.82) 100%

    ) !important;

    z-index: 1 !important;

}



/* Blur layer */

.tl-card__blur {

    position: absolute !important;

    inset: auto 0 0 0 !important;

    height: 38% !important;

    backdrop-filter: blur(18px) !important;

    -webkit-backdrop-filter: blur(18px) !important;

    mask-image: linear-gradient(to top, black 0%, black 55%, transparent 100%) !important;

    -webkit-mask-image: linear-gradient(to top, black 0%, black 55%, transparent 100%) !important;

    pointer-events: none !important;

    z-index: 2 !important;

}



/* Days badge */

.tl-card__days {

    position: absolute !important;

    top: 14px !important; left: 14px !important;

    z-index: 10 !important;

    background: rgba(255,255,255,0.15) !important;

    backdrop-filter: blur(16px) !important;

    -webkit-backdrop-filter: blur(16px) !important;

    border: 1px solid rgba(255,255,255,0.25) !important;

    color: white !important;

    padding: 5px 12px !important;

    border-radius: 20px !important;

    font-size: 0.72rem !important;

    font-weight: 700 !important;

    pointer-events: none !important;

    box-shadow: none !important;

}



/* Wish button */

.tl-card__wish {

    position: absolute !important;

    top: 14px !important; right: 14px !important;

    z-index: 10 !important;

    width: 34px !important; height: 34px !important;

    background: rgba(255,255,255,0.15) !important;

    backdrop-filter: blur(20px) !important;

    -webkit-backdrop-filter: blur(20px) !important;

    border: 1px solid rgba(255,255,255,0.2) !important;

    border-radius: 50% !important;

    font-size: 0.85rem !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    cursor: pointer !important;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-card__wish:hover {

    background: rgba(255,255,255,0.28) !important;

    transform: scale(1.12) !important;

}



/* Body — стеклянная панель */

.tl-card__body {

    position: absolute !important;

    bottom: 0 !important; left: 0 !important; right: 0 !important;

    z-index: 3 !important;

    padding: 1.25rem 1.25rem 1.4rem !important;

    transform: translateY(-12px) !important;

    display: flex !important;

    flex-direction: column !important;

}



.tl-card__dest {

    display: block !important;

    font-size: 0.65rem !important;

    font-weight: 800 !important;

    letter-spacing: 2px !important;

    color: #FF8C3A !important;

    text-transform: uppercase !important;

    margin-bottom: 6px !important;

    opacity: 0.95 !important;

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

}



.tl-card__name {

    display: block !important;

    font-size: 1.12rem !important;

    font-weight: 800 !important;

    color: white !important;

    text-decoration: none !important;

    line-height: 1.25 !important;

    margin-bottom: 10px !important;

    font-family: "Inter", sans-serif !important;

}



.tl-card__meta {

    display: flex !important;

    gap: 1rem !important;

    font-size: 0.72rem !important;

    color: rgba(255,255,255,0.85) !important;

    margin-bottom: 14px !important;

}



.tl-card__footer {

    display: flex !important;

    justify-content: space-between !important;

    align-items: flex-end !important;

    border-top: 1px solid rgba(255,255,255,0.12) !important;

    padding-top: 12px !important;

    margin-top: 0 !important;

    flex-wrap: nowrap !important;

    gap: 8px !important;

}



.tl-card__price {

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;

    gap: 0 !important;

    padding-left: 4px !important;

}



.tl-card__price-from {

    font-size: 0.65rem !important;

    color: rgba(255,255,255,0.55) !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    margin-bottom: 2px !important;

    display: block !important;

}



.tl-card__price-val {

    font-size: 1.6rem !important;

    font-weight: 900 !important;

    color: white !important;

    letter-spacing: -0.03em !important;

    line-height: 1 !important;

    font-family: "Inter", sans-serif !important;

    display: block !important;

}



/* Actions — обе кнопки */

.tl-card__actions {

    display: flex !important;

    flex-direction: column !important;

    gap: 5px !important;

    align-items: flex-end !important;

}



.tl-card__cta {

    opacity: 0 !important;

    transform: translateX(8px) !important;

    transition: all 0.25s cubic-bezier(0.22,1,0.36,1) !important;

    background: #FF6B00 !important;

    color: white !important;

    padding: 0.35rem 0.9rem !important;

    border-radius: 20px !important;

    font-size: 0.72rem !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    white-space: nowrap !important;

    display: block !important;

}



.tl-card:hover .tl-card__cta {

    opacity: 1 !important;

    transform: translateX(0) !important;

}



.tl-card__cta--book {

    background: rgba(255,255,255,0.15) !important;

    border: 1px solid rgba(255,255,255,0.3) !important;

    backdrop-filter: blur(8px) !important;

    transition-delay: 0.05s !important;

}



.tl-card__cta--book:hover {

    background: rgba(255,255,255,0.25) !important;

    color: white !important;

}




/* ===== WISHLIST HEART RED ===== */

.tour-wishlist.active .lucide,

.wishlist-btn.active .lucide {

    color: #ef4444 !important;

    fill: #ef4444 !important;

}



.tour-wishlist .lucide,

.wishlist-btn .lucide {

    transition: color 0.2s, fill 0.2s !important;

}




/* ===== WISHLIST HEART RED FIX ===== */

.tl-card__wish.active .lucide {

    color: #ef4444 !important;

    fill: #ef4444 !important;

}



.tl-card__wish .lucide {

    transition: color 0.2s, fill 0.2s !important;

}




.tl-card__wish.active svg {

    color: #ef4444 !important;

    fill: #ef4444 !important;

    stroke: #ef4444 !important;

}




/* ===== WISHLIST HEART ANIMATION ===== */

.tl-card__wish {

    transition: transform 0.2s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-card__wish svg {

    transition: stroke 0.2s ease, fill 0.2s ease !important;

}



.tl-card__wish.active svg {

    stroke: #ef4444 !important;

    fill: #ef4444 !important;

    filter: drop-shadow(0 0 6px rgba(239,68,68,0.5)) !important;

}



@keyframes heartPop {

    0%   { transform: scale(1); }

    30%  { transform: scale(1.4); }

    60%  { transform: scale(0.9); }

    100% { transform: scale(1); }

}



.tl-card__wish.pop {

    animation: heartPop 0.4s cubic-bezier(0.22,1,0.36,1) !important;

}




/* ===== HEART ICON FIX ===== */

.tl-card__wish svg {

    width: 16px !important;

    height: 16px !important;

    stroke: white !important;

    fill: none !important;

    display: block !important;

}



.tl-card__wish.active svg {

    stroke: #ef4444 !important;

    fill: #ef4444 !important;

    filter: drop-shadow(0 0 4px rgba(239,68,68,0.6)) !important;

}




/* ===== HEART JUICY STYLE ===== */

.tl-card__wish svg {

    width: 18px !important;

    height: 18px !important;

    stroke: rgba(255,255,255,0.9) !important;

    fill: none !important;

    stroke-width: 2 !important;

    filter: drop-shadow(0 1px 3px rgba(0,0,0,0.3)) !important;

    transition: all 0.2s cubic-bezier(0.22,1,0.36,1) !important;

}



.tl-card__wish:hover svg {

    stroke: white !important;

    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)) !important;

    transform: scale(1.1) !important;

}



.tl-card__wish.active svg {

    stroke: #ef4444 !important;

    fill: #ef4444 !important;

    filter: drop-shadow(0 0 8px rgba(239,68,68,0.7)) !important;

    transform: scale(1.05) !important;

}




/* ===== HEART BUTTON CONTRAST ===== */

.tl-card__wish {

    background: rgba(0,0,0,0.35) !important;

    border: 1.5px solid rgba(255,255,255,0.25) !important;

    backdrop-filter: blur(8px) !important;

    -webkit-backdrop-filter: blur(8px) !important;

}



.tl-card__wish:hover {

    background: rgba(0,0,0,0.55) !important;

    border-color: rgba(255,255,255,0.4) !important;

}



.tl-card__wish.active {

    background: rgba(239,68,68,0.2) !important;

    border-color: rgba(239,68,68,0.5) !important;

}




/* ===== HEART ACTIVE CONTRAST FIX ===== */

.tl-card__wish.active {

    background: rgba(239,68,68,0.85) !important;

    border-color: rgba(239,68,68,0.9) !important;

    box-shadow: 0 4px 16px rgba(239,68,68,0.4) !important;

}



.tl-card__wish.active svg {

    stroke: white !important;

    fill: white !important;

    filter: drop-shadow(0 0 4px rgba(255,255,255,0.3)) !important;

}




/* ===== INSTANT HEART ON LOAD ===== */

.tl-card__wish.active {

    background: rgba(239,68,68,0.85) !important;

    border-color: rgba(239,68,68,0.9) !important;

    box-shadow: 0 4px 16px rgba(239,68,68,0.4) !important;

}




/* ===== БЛИЖАЙШИЕ ВЫЕЗДЫ ===== */

.tl-upcoming {

    padding: 4rem 0;

    background: white;

    border-top: 1px solid rgba(8,28,51,0.06);

}

.tl-upcoming__inner {

    max-width: 1320px;

    margin: 0 auto;

    padding: 0 2rem;

}

.tl-upcoming__head { margin-bottom: 2rem; }

.tl-upcoming__list { display: flex; flex-direction: column; gap: 1rem; }



.tl-upcoming-card {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 2rem;

    padding: 1.5rem 2rem;

    background: white;

    border: 1px solid rgba(8,28,51,0.07);

    border-radius: 20px;

    transition: all 0.28s cubic-bezier(0.22,1,0.36,1);

    box-shadow: 0 2px 12px rgba(8,28,51,0.04);

}

.tl-upcoming-card:hover {

    transform: translateY(-3px);

    box-shadow: 0 12px 36px rgba(8,28,51,0.1);

    border-color: rgba(255,107,0,0.15);

}

.tl-upcoming-card__dest {

    font-size: 0.65rem;

    font-weight: 800;

    color: #FF6B00;

    text-transform: uppercase;

    letter-spacing: 0.08em;

    margin-bottom: 3px;

}

.tl-upcoming-card__name {

    font-size: 1rem;

    font-weight: 700;

    color: #0A1628;

    letter-spacing: -0.01em;

    margin-bottom: 6px;

}

.tl-upcoming-card__date {

    display: flex;

    align-items: center;

    gap: 4px;

    font-size: 0.75rem;

    color: #888;

}

.tl-upcoming-card__right {

    display: flex;

    align-items: center;

    gap: 2rem;

    flex-shrink: 0;

}

.tl-upcoming-card__spots-text {

    display: flex;

    justify-content: space-between;

    font-size: 0.72rem;

    color: #888;

    margin-bottom: 6px;

    gap: 1rem;

}

.tl-upcoming-card__spots-text strong { color: #0A1628; font-weight: 700; }

.tl-upcoming-card__bar {

    width: 160px;

    height: 6px;

    background: rgba(8,28,51,0.06);

    border-radius: 3px;

    overflow: hidden;

}

.tl-upcoming-card__bar-fill {

    height: 100%;

    background: linear-gradient(90deg, #FF6B00, #FF8C3A);

    border-radius: 3px;

    transition: width 1s cubic-bezier(0.22,1,0.36,1);

}

.tl-upcoming-card__btn {

    padding: 10px 20px;

    background: linear-gradient(135deg, #FF7A00, #FF5C00);

    color: white;

    border-radius: 999px;

    font-size: 0.82rem;

    font-weight: 700;

    text-decoration: none;

    white-space: nowrap;

    transition: all 0.28s cubic-bezier(0.22,1,0.36,1);

    box-shadow: 0 4px 14px rgba(255,107,0,0.25);

}

.tl-upcoming-card__btn:hover {

    transform: translateY(-2px);

    box-shadow: 0 10px 28px rgba(255,107,0,0.35);

    color: white;

}



/* ===== ИСТОРИИ ===== */

.tl-stories {

    padding: 4rem 0;

    background: rgba(8,28,51,0.02);

}

.tl-stories__inner {

    max-width: 1320px;

    margin: 0 auto;

    padding: 0 2rem;

}

.tl-stories__head { margin-bottom: 2rem; }

.tl-stories__grid {

    display: grid;

    grid-template-columns: 1.4fr 1fr;

    gap: 1.5rem;

}

.tl-story {

    border-radius: 24px;

    overflow: hidden;

    position: relative;

}

.tl-story--sm {

    display: flex;

    flex-direction: column;

    gap: 1.5rem;

}

.tl-story--sm .tl-story__img { border-radius: 20px; }

.tl-story__img {

    position: relative;

    height: 400px;

    background-size: cover;

    background-position: center;

    overflow: hidden;

    transition: transform 0.6s cubic-bezier(0.22,1,0.36,1);

}

.tl-story--sm .tl-story__img { height: 185px; }

/* removed: tl-story img transform (zoomed text) */

.tl-story__overlay {

    position: absolute;

    inset: 0;

    background: linear-gradient(to top, rgba(8,28,51,0.92) 0%, rgba(8,28,51,0.1) 60%);

}

.tl-story__content {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    padding: 1.75rem;

    z-index: 1;

}

.tl-story--sm .tl-story__content { padding: 1.25rem; }

.tl-story__dest {

    font-size: 0.65rem;

    font-weight: 800;

    color: #FF6B00;

    text-transform: uppercase;

    letter-spacing: 0.08em;

    margin-bottom: 0.5rem;

}

.tl-story__quote {

    font-size: 1rem;

    font-weight: 600;

    color: white;

    line-height: 1.5;

    margin: 0 0 1rem;

    font-style: italic;

}

.tl-story--sm .tl-story__quote { font-size: 0.85rem; margin-bottom: 0.6rem; }

.tl-story__author {

    display: flex;

    align-items: center;

    gap: 0.6rem;

}

.tl-story__avatar {

    width: 32px;

    height: 32px;

    background: linear-gradient(135deg, #FF6B00, #FF8C3A);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 0.8rem;

    font-weight: 800;

    color: white;

    flex-shrink: 0;

}

.tl-story__author strong { font-size: 0.82rem; color: white; display: block; }

.tl-story__author span { font-size: 0.65rem; color: rgba(255,255,255,0.5); }

.tl-story__stars { margin-left: auto; display: flex; gap: 1px; }



/* ===== CINEMATIC CTA ===== */

.tl-cinematic {

    position: relative;

    min-height: 400px;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}

.tl-cinematic__bg {

    position: absolute;

    inset: 0;

    background-size: cover;

    background-position: center;

    transform: scale(1.05);

    transition: transform 8s ease;

}

.tl-cinematic:hover .tl-cinematic__bg { transform: scale(1.0); }

.tl-cinematic__overlay {

    position: absolute;

    inset: 0;

    background: rgba(8,28,51,0.72);

}

.tl-cinematic__inner {

    position: relative;

    z-index: 1;

    text-align: center;

    padding: 3rem 2rem;

    max-width: 700px;

}

.tl-cinematic__quote {

    font-size: clamp(1.5rem, 4vw, 2.5rem);

    font-weight: 900;

    color: white;

    letter-spacing: -0.03em;

    line-height: 1.2;

    margin-bottom: 1rem;

    font-family: "Inter", sans-serif;

    font-style: italic;

}

.tl-cinematic__sub {

    font-size: 1rem;

    color: rgba(255,255,255,0.6);

    margin-bottom: 2rem;

}

.tl-cinematic__btn {

    display: inline-block;

    padding: 14px 36px;

    background: linear-gradient(135deg, #FF7A00, #FF5C00);

    color: white;

    border-radius: 999px;

    font-weight: 700;

    font-size: 0.95rem;

    text-decoration: none;

    box-shadow: 0 8px 28px rgba(255,107,0,0.35);

    transition: all 0.28s cubic-bezier(0.22,1,0.36,1);

}

.tl-cinematic__btn:hover {

    transform: translateY(-3px);

    box-shadow: 0 20px 48px rgba(255,107,0,0.45);

    color: white;

}



@media (max-width: 768px) {

    .tl-stories__grid { grid-template-columns: 1fr; }

    .tl-story__img { height: 280px; }

    .tl-upcoming-card { flex-direction: column; align-items: flex-start; }

    .tl-upcoming-card__right { width: 100%; }

    .tl-upcoming-card__bar { width: 100%; }

}




/* ===== UPCOMING PREMIUM ===== */

.tl-upcoming-card {

    display: grid !important;

    grid-template-columns: 80px 1fr auto !important;

    align-items: center !important;

    text-decoration: none !important;

    color: inherit !important;

}



.tl-upcoming-card__img {

    width: 80px;

    height: 80px;

    border-radius: 14px;

    background-size: cover;

    background-position: center;

    flex-shrink: 0;

}



.tl-upcoming-card__badges { margin-bottom: 4px; }



.tl-upcoming-badge {

    display: inline-flex;

    align-items: center;

    gap: 3px;

    font-size: 0.6rem;

    font-weight: 800;

    padding: 2px 8px;

    border-radius: 999px;

    text-transform: uppercase;

    letter-spacing: 0.04em;

}



.tl-upcoming-badge--fire {

    background: rgba(239,68,68,0.1);

    color: #dc2626;

    border: 1px solid rgba(239,68,68,0.2);

}



.tl-upcoming-badge--warning {

    background: rgba(245,158,11,0.1);

    color: #d97706;

    border: 1px solid rgba(245,158,11,0.2);

}



.tl-upcoming-badge--normal {

    background: rgba(255,107,0,0.08);

    color: #FF6B00;

    border: 1px solid rgba(255,107,0,0.15);

}



/* ===== TRUST WHY ===== */

.tl-trust-why {

    padding: 4rem 0;

    background: linear-gradient(135deg, #081C33, #0d2a4a);

}

.tl-trust-why__inner {

    max-width: 1320px;

    margin: 0 auto;

    padding: 0 2rem;

}

.tl-trust-why__head { margin-bottom: 2.5rem; }

.tl-trust-why__head .h-tag { color: rgba(255,255,255,0.5) !important; }

.tl-trust-why__head .h-title { color: white !important; }

.tl-trust-why__grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1.5rem;

}

.tl-trust-why__card {

    padding: 1.75rem;

    background: rgba(255,255,255,0.05);

    border: 1px solid rgba(255,255,255,0.08);

    border-radius: 20px;

    transition: all 0.28s cubic-bezier(0.22,1,0.36,1);

}

.tl-trust-why__card:hover {

    background: rgba(255,255,255,0.08);

    border-color: rgba(255,107,0,0.2);

    transform: translateY(-4px);

}

.tl-trust-why__icon {

    width: 52px;

    height: 52px;

    background: rgba(255,107,0,0.12);

    border-radius: 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 1rem;

}

.tl-trust-why__card h3 {

    font-size: 0.95rem;

    font-weight: 700;

    color: white;

    margin-bottom: 0.5rem;

    letter-spacing: -0.01em;

}

.tl-trust-why__card p {

    font-size: 0.78rem;

    color: rgba(255,255,255,0.45);

    line-height: 1.6;

}



/* ===== GALLERY ===== */

.tl-gallery {

    padding: 4rem 0;

    background: white;

}

.tl-gallery__inner {

    max-width: 1320px;

    margin: 0 auto;

    padding: 0 2rem;

}

.tl-gallery__head { margin-bottom: 2rem; }

.tl-gallery__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    grid-template-rows: repeat(2, 220px);

    gap: 1rem;

}

.tl-gallery__item {

    border-radius: 20px;

    overflow: hidden;

    position: relative;

    display: block;

    text-decoration: none;

}

.tl-gallery__item--lg { grid-row: span 2; }

.tl-gallery__item--right { grid-column: 3; grid-row: span 2; }



.tl-gallery__img {

    width: 100%;

    height: 100%;

    background-size: cover;

    background-position: center;

    transition: transform 0.6s cubic-bezier(0.22,1,0.36,1);

}

.tl-gallery__item:hover .tl-gallery__img { transform: scale(1.08); }



.tl-gallery__label {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    padding: 0.875rem 1rem;

    background: linear-gradient(to top, rgba(8,28,51,0.8) 0%, transparent 100%);

    font-size: 0.72rem;

    font-weight: 700;

    color: white;

    opacity: 0;

    transform: translateY(4px);

    transition: all 0.3s cubic-bezier(0.22,1,0.36,1);

}

.tl-gallery__item:hover .tl-gallery__label {

    opacity: 1;

    transform: translateY(0);

}



@media (max-width: 768px) {

    .tl-trust-why__grid { grid-template-columns: 1fr 1fr; }

    .tl-gallery__grid {

        grid-template-columns: 1fr 1fr;

        grid-template-rows: auto;

    }

    .tl-gallery__item--lg,

    .tl-gallery__item--right { grid-row: span 1; }

    .tl-gallery__item { height: 160px; }

}





/* ===== BOTTOM SHEET FIX ===== */

#bottomSheet {

    display: block !important;

    position: fixed;

    inset: 0;

    z-index: 1050;

    pointer-events: none;

    visibility: hidden;

}



#bottomSheet.open {

    pointer-events: auto;

    visibility: visible;

}



#bottomSheet .tl-bottom-sheet__overlay {

    position: fixed;

    inset: 0;

    background: rgba(8,28,51,0.5);

    z-index: 1050;

    opacity: 0;

    pointer-events: none;

    transition: opacity 0.3s ease;

}



#bottomSheet.open .tl-bottom-sheet__overlay {

    opacity: 1;

    pointer-events: auto;

}



#bottomSheet .tl-bottom-sheet__panel {

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    background: white;

    border-radius: 24px 24px 0 0;

    z-index: 1051;

    padding: 0 1.5rem 2rem;

    transform: translateY(100%);

    transition: transform 0.35s cubic-bezier(0.22,1,0.36,1);

    max-height: 85vh;

    overflow-y: auto;

    pointer-events: auto;

}



#bottomSheet.open .tl-bottom-sheet__panel {

    transform: translateY(0) !important;

}




/* ===== Адаптив секции "Ближайшие выезды" ===== */

.tl-upcoming-card__img {

    width: 80px; height: 80px;

    border-radius: 14px;

    background-size: cover; background-position: center;

    flex-shrink: 0;

}

.tl-upcoming-card__left { flex: 1; min-width: 0; }

.tl-upcoming-card__badges { margin-bottom: 6px; }



@media (max-width: 860px) {

    .tl-upcoming-card {

        flex-direction: column;

        align-items: stretch;

        gap: 1rem;

        padding: 1.2rem;

    }

    .tl-upcoming-card__img { width: 100%; height: 160px; }

    .tl-upcoming-card__right {

        flex-direction: column;

        align-items: stretch;

        gap: 1rem;

        width: 100%;

    }

    .tl-upcoming-card__bar { width: 100%; }

    .tl-upcoming-card__btn {

        text-align: center;

        padding: 12px;

        background: linear-gradient(135deg, #ff7a14, #FF6B00);

        color: #fff;

        border-radius: 12px;

        font-weight: 700;

    }

}

@media (max-width: 480px) {

    .tl-upcoming__inner { padding: 0 1rem; }

    .tl-upcoming-card__name { font-size: 1.05rem; }

}




/* ===== Истории путешественников — 3 равные карточки (redesign) ===== */

.tl-stories__grid {

    grid-template-columns: repeat(3, 1fr) !important;

    gap: 1.5rem !important;

}

.tl-story {

    border-radius: 24px;

    overflow: hidden;

    position: relative;

    min-height: 360px;

}

.tl-story__img {

    border-radius: 24px;

    position: relative;

    height: 100%;

    min-height: 360px;

    background-size: cover;

    background-position: center;

}

.tl-story__overlay {

    position: absolute; inset: 0;

    background: linear-gradient(to top, rgba(6,16,31,0.92) 0%, rgba(6,16,31,0.4) 45%, rgba(6,16,31,0.1) 100%);

}

.tl-story__content {

    position: absolute; inset: 0;

    display: flex; flex-direction: column; justify-content: flex-end;

    padding: 24px; z-index: 2;

}

.tl-story__dest {

    font-size: 0.72rem; font-weight: 800; color: #FF6B00;

    text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 10px;

}

.tl-story__quote {

    font-size: 1rem; line-height: 1.5; color: #fff; font-weight: 600;

    margin: 0 0 18px; border: none; padding: 0;

}

.tl-story__author { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.tl-story__avatar {

    width: 38px; height: 38px; border-radius: 50%;

    background: rgba(255,255,255,0.18); backdrop-filter: blur(6px);

    display: flex; align-items: center; justify-content: center;

    color: #fff; font-weight: 800; font-size: 0.95rem; flex-shrink: 0;

}

.tl-story__author strong { display: block; color: #fff; font-size: 0.9rem; }

.tl-story__author span { display: block; color: rgba(255,255,255,0.7); font-size: 0.76rem; }

.tl-story__stars { display: flex; gap: 2px; width: 100%; margin-top: 6px; }

.tl-story__stars .lucide { width: 15px; height: 15px; }

.tl-stories__empty { grid-column: 1/-1; text-align: center; padding: 40px; color: rgba(8,28,51,0.5); }



@media (max-width: 900px) {

    .tl-stories__grid { grid-template-columns: repeat(2, 1fr) !important; }

}

@media (max-width: 600px) {

    .tl-stories__grid { grid-template-columns: 1fr !important; }

    .tl-story, .tl-story__img { min-height: 300px; }

}




/* Hover: зум только фона истории, текст статичен */

.tl-story__img {

    transition: background-size 0.6s cubic-bezier(0.22,1,0.36,1);

    background-size: cover;

}

/* removed: bg-size zoom */




/* ===== Зум фона истории через ::before (плавно, текст статичен) ===== */

.tl-story__img {

    background-image: none !important;

    background-size: cover;

    overflow: hidden;

}

.tl-story__img::before {

    content: "";

    position: absolute;

    inset: 0;

    background-image: var(--bg);

    background-size: cover;

    background-position: center;

    transform: scale(1);

    transition: transform 0.7s cubic-bezier(0.22,1,0.36,1);

    z-index: 0;

}

.tl-story:hover .tl-story__img::before { transform: scale(1.08); }

/* overlay и контент — поверх фона, не зумятся */

.tl-story__overlay { z-index: 1; }

.tl-story__content { z-index: 2; }

