@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

/* 05.03.2026 - 21.03.2026 */
/*********   16  ************/

/* 
Thin - 100
Extra Light/Ultra Light - 200
Light - 300
Regular/Normal - 400
Medium - 500
SemiBold/DemiBold - 600
Bold - 700
Extra Bold - 800
Black/Heavy - 900
*/


/*
  // <weight>: Use a value from 400 to 900
  // <uniquifier>: Use a unique and descriptive class name
  
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/

/*
  // <weight>: Use a value from 300 to 900
  // <uniquifier>: Use a unique and descriptive class name
  
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/

/*
  // <weight>: Use a value from 200 to 1000
  // <uniquifier>: Use a unique and descriptive class name

  font-family: "Mulish", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/





* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}


:root {
    --white: #FFFFFF;
    --black: #000000;

    --orange1: #FF7757;
    --orange2: #FFD2C7;
    --orange-hover: #FC957D;
    --orange-btn: #FF7654;

    --dark1: #331811;
    --dark2: #61291C;

    --gray: #767E86;
    --gray2: #5c5959;
    --blue: #172432;
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
}

button {

    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    cursor: pointer;
}

input {
    all: unset;
    box-sizing: border-box;
}

.container {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 clamp(32px, 31.25vw - 418px, 182px);
}








/* HEADER START */

/* BL HEADER START */

header {
    position: relative;
    background-image: url("img/Hero Section.png");
    background-size: cover;        /* заполняет блок, может обрезать края */
   /*  background-position: center;     центрируем */
    background-repeat: no-repeat;  /* не плиткой */
    background-color: #000;        /* запасной фон, если картинка не загрузится */
    height: 1194px;
    z-index: 0;
}

header::before {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    background-color: rgb(0, 0, 0, 0.3);
    z-index: -1;
}

header .header {
    display: flex;
    justify-content: space-between;
    padding: 32px 0px;
}

.header .logo > svg {
    max-width: clamp(140px, calc(1175vw / 56 + 510px / 7), 234px);
    max-height: clamp(27.52px, calc(33vw / 8 + 14.32px), 46px);
}

header .navigation {
    align-self: center;
}

header .navigation > ul {
    display: flex;
    gap: 32px;
}

header .navigation > ul > li {
    display: flex;
    align-items: center;
    position: relative;
}

header .navigation > ul > li::before {
    content: '';
    height: 3px;
    width: 100%;
    background-color: var(--orange1);

    position: absolute;
    left: 0%;
    bottom: -8px;

    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.4s ease;
}

header .navigation > ul > li:hover::before {
    transform: scaleX(1);
}

header .navigation > ul > li > a {
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    font-variation-settings: "wght" 400;
    color: var(--white);
    position: relative;
    display: inline-block;
    transition: font-variation-settings 0.5s ease;
}

header .navigation > ul > li > a::after {
    content: attr(data-text); /* текст ссылки */
    font-weight: 500;
    font-variation-settings: "wght" 500;
    display: block;
    height: 0;
    visibility: hidden;
    pointer-events: none;
    white-space: nowrap; /* чтобы текст не переносился */
}

header .navigation > ul > li > a:hover {
    font-variation-settings: "wght" 500;
    font-weight: 500;
}

header .log-sig {
    display: flex;
    align-items: center;
    gap: 36px;

    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--white);
}

header .log-sig > span {
    cursor: pointer;
    position: relative;
}

header .log-sig > span::after {
    content: '';
    height: 3px;
    width: 100%;
    background-color: var(--orange1);

    position: absolute;
    left: 0%;
    bottom: -8px;

    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.4s ease;
}

header .log-sig > span:hover::after {
    transform: scaleX(1);
}

header .log-sig > button {
    height: 64px;
    padding: 0 32px;
    border-radius: 13px;
    background-color: var(--orange1);
    transition: background-color 0.5s ease;
}

header .log-sig > button:hover {
    background-color: var(--orange-hover);
}

header .hamburger {
    display: none;
    position: relative;
    max-height: 28px;
    right: 37px;
    top: 11px;
}

header .hamburger.active > span:nth-child(1) {
    transform: translate(0, 0) rotate(45deg);
}

header .hamburger > span {
    position: absolute;
    width: 37.5px;
    height: 3px;
    border-radius: 2px;
    background-color: var(--white);
    transform-origin: left center;
    transition: transform 0.8s ease;
}

header .hamburger > span:nth-child(2) {
    top: 12px;
}

header .hamburger > span:nth-child(3) {
    top: 24px;
}

/* BL HEADER END */










/* BL TITLE START */

header .title {
    display: flex;
    flex-direction: column;
    gap: 37px;
    margin: 142px 0px 170px 0px;
}

header .title > h1 {
    font-family: "Playfair Display", serif;
    font-size: clamp(54px, max(125vw / 48 + 34px, 125vw / 18 - 16px), 84px);
    font-weight: 400;
    color: var(--white);
}

header .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
}

/* BL TITLE END */






/* BL CONTENT START */

header .content {
    display: flex;
    gap: 100px;
    width: 85%;
    max-width: 1291px;
    min-width: 659px;
    background-color: var(--white);
    border-radius: 0px 20px 20px 0px;
    position: relative;
    z-index: 1;
}

header .content::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: -850px;
    z-index: -1;
    background-color: var(--white);
}

header .content > .colums {
    display: flex;
    align-items: center;
    gap: 40px;
}

header .content > .colums > div {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 225.25px;
    min-width: 158.5px;
}

header .content > .colums > div > span {
    font-family: "Rubik", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--gray);
}

header .content > .colums > div > div {
    position: relative;
}

header .content > .colums > div > div > input {
    width: 100%;
    height: 37px;
    border-bottom: 1px solid var(--black);

    font-family: "Playfair Display", serif;
    font-size: clamp(16px, 1.3vw, 20px);
    font-weight: 400;
    color: var(--blue);
}

header .content > .colums > div > div > input::placeholder {
    color: var(--blue);
}

header .content > .colums > div > div > label {
    position: absolute;
    right: 0;
    top: 20%;
    cursor: pointer;
}

header .content > .bk-now {
    display: flex;
    align-items: center;
    gap: 27px;
    margin-left: auto;
    padding: 0 20px;
    background-color: var(--orange1);
    height: 216px;

    border-radius: 0px 18px 18px 0px;

    font-family: "Playfair Display", serif;
    font-size: 36px;
    font-weight: 400;
    color: var(--white);
    transition: background-color 0.5s ease;
}

header .content > .bk-now:hover {
    background-color: var(--orange-hover);
    cursor: pointer;
}

/* BL CONTENT END */









/* BL HEADER-SLIDER START */

body .header-slider {
    position: fixed;
    right: clamp(30px, 14.58333vw - 180px, 100px);
    top: 0;
    transform: translateY(483px);
    z-index: 9999;
}

body .header-slider > .wrap-slider {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

body .header-slider > .wrap-slider > div:nth-child(1) {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

body .header-slider > .wrap-slider > div:nth-child(1) > span {
    display: flex;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--gray2);
    transition: background-color 0.5s ease;
    cursor: pointer;
}

body .header-slider > .wrap-slider > div:nth-child(1) > span:hover {
    background-color: var(--orange-hover);
}

body .header-slider > .wrap-slider > div:nth-child(1) > span.active {
    background-color: var(--orange1);
}

body .header-slider > .wrap-slider > div:nth-child(1) > span > a {
    display: flex;
    width: 100%;
}

body .header-slider > .wrap-slider > div:nth-child(2) {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body .header-slider > .wrap-slider > div:nth-child(2) > span {
    width: 14px;
    height: 14px;
    border-top: 2px solid var(--gray2);
    border-right: 2px solid var(--gray2);
    border-radius: 2px;
    transition: border-top 0.5s ease, border-right 0.5s ease;
    cursor: pointer;
}

body .header-slider > .wrap-slider > div:nth-child(2) > span:nth-child(1) {
    transform: rotate(315deg);
}

body .header-slider > .wrap-slider > div:nth-child(2) > span:nth-child(2) {
    transform: rotate(135deg);
}

body .header-slider > .wrap-slider > div:nth-child(2) > span.active {
    border-top: 2px solid var(--orange1);
    border-right: 2px solid var(--orange1);
}

body .header-slider > .wrap-slider > div:nth-child(2) > span:hover {
    border-top: 2px solid var(--orange-hover);
    border-right: 2px solid var(--orange-hover);
}

/* BL HEADER-SLIDER END */

/* HEADER END */


































/* MAIN START */


/* SECTION DESTINATIONS START */

main .container {
    padding-right: 0;
}

.destinations {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 140px 0 140px 0;
}

.destinations > .bl-one {
    display: flex;
    justify-content: space-between;
    gap: 100px;
    margin-right: 180px;
}

.destinations > .bl-one > .title {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.destinations > .bl-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.destinations > .bl-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 100%;
    max-width: 365px;
    min-width: 227px;
    height: 3px;
    bottom: 0;
    background-color: var(--orange1);
}

.destinations > .bl-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.destinations > .bl-one > .arrows {
    display: flex;
    align-items: end;
    gap: 40px;
}

.destinations > .bl-one > .arrows > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 60px;
    border-radius: 12px;

    background-color: var(--blue);
    cursor: pointer;
    transition: background-color 0.5s ease;
}

.destinations > .bl-one > .arrows > span.active {
    background-color: var(--orange1);
}

.destinations > .bl-one > .arrows > span:nth-child(1) > svg {
    transform: rotate(0deg);
}

.destinations > .bl-one > .arrows > span:nth-child(2) > svg {
    transform: rotate(-180deg);
}

/* SECTION DESTINATIONS -- CAROUSEL START */


.destinations > .bl-two > .destinations-wrap-carousel {
    position: relative;
    overflow-x: auto;          /* включаем горизонтальный скролл */
    overflow-y: hidden;
    scroll-behavior: smooth;   /* плавная прокрутка (опционально) */
    scrollbar-width: none;
    -ms-overflow-style: none;

    height: 661px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel {
    position: absolute;
    display: flex;
    gap: 32px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div {
    position: relative;
    display: flex;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgb(255, 119, 87, 0.1);
    border-radius: 26px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > img:nth-child(1) {
    width: 497px;
    height: 661px;
    border-radius: 26px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > img:nth-child(2) {
    display: none;
    width: 728px;
    height: 456px;
    border-radius: 26px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > div {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 17px;
    left: 24px;
    bottom: 40px;
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > div > h3 {
    font-family: "Playfair Display", serif;
    font-size: 28px;
    font-weight: 500;
    color: var(--white);
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > div > div > span {
    margin-left: 16px;
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
}

.destinations > .bl-two > .destinations-wrap-carousel > .dest-carousel > div > div > div {
    display: flex;
    align-items: center;
}

/* SECTION DESTINATIONS END */
















/* SECTION SPECIAL OFFER START */

.specialoffer {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 140px clamp(32px, 31.25vw - 418px, 182px) 140px 0;
}

.specialoffer > .bl-one {
    display: flex;
    justify-content: space-between;
    gap: 100px;
}

.specialoffer > .bl-one > .title {
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 32px;
}

.specialoffer > .bl-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.specialoffer > .bl-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 65%;
    max-width: 365px;
    min-width: 227px;
    height: 3px;
    bottom: 0;
    right: 0;
    background-color: var(--orange1);
}

.specialoffer > .bl-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.specialoffer > .bl-one > .arrows {
    display: flex;
    align-items: end;
    gap: 40px;
}

.specialoffer > .bl-one > .arrows > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 60px;
    border-radius: 12px;

    background-color: var(--blue);
    cursor: pointer;
    transition: background-color 0.5s ease;
}

.specialoffer > .bl-one > .arrows > span.active {
    background-color: var(--orange1);
}

.specialoffer > .bl-one > .arrows > span:nth-child(1) > svg {
    transform: rotate(0deg);
}

.specialoffer > .bl-one > .arrows > span:nth-child(2) > svg {
    transform: rotate(-180deg);
}

.specialoffer > .wrap-bl-two {
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    height: 629px;
}

.specialoffer > .wrap-bl-two > .bl-two {
    display: flex;
    gap: 32px;
    position: absolute;
}

.specialoffer > .wrap-bl-two > .bl-two > div {
    width: 497px;
    max-width: 492px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-img {
    position: relative;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-img::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgb(255, 119, 87, 0.1);
    border-radius: 26px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-img > img {
    display: flex;
    width: 100%;
    height: 286px;
    border-radius: 26px 26px 0px 0px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text {
    display: flex;
    flex-direction: column;
    gap: 23px;
    padding: 40px 24px;
    border-radius: 0 0 26px 26px;

    background-color: #FFF8F1;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(1) {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(1) > span:nth-child(1) {
    font-family: "Mulish", sans-serif;
    font-size: 28px;
    font-weight: 400;
    color: var(--gray);
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(1) > span:nth-child(2) {
    display: flex;
    gap: 4px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(2) {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: var(--blue);
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) {
    display: flex;
    justify-content: space-between;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) > div > span:nth-child(1) {
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--gray);
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) > div > span:nth-child(2) {
    font-family: "Rubik", sans-serif;
    font-size: 40px;
    font-weight: 400;
    color: var(--orange1);
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) > button {
    display: flex;
    align-items: center;
    height: 64px;
    padding: 0 40px;
    border-radius: 12px;
    background-color: var(--orange-btn);

    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--white);
    cursor: pointer;

    transition: background-color 0.5s ease;
}

.specialoffer > .wrap-bl-two > .bl-two > div > .bl-text > div:nth-child(3) > button:hover {
    background-color: var(--orange-hover);
}

/* SECTION SPECIAL OFFER END */


















/* SECTION BLOG START */

.blog {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 140px clamp(32px, 31.25vw - 418px, 182px) 140px 0;
}

.blog > .bl-one {
    display: flex;
    justify-content: space-between;
    gap: 100px;
}

.blog > .bl-one > .title {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.blog > .bl-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.blog > .bl-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 100%;
    max-width: 150px;
    min-width: 150px;
    height: 3px;
    bottom: 0;
    background-color: var(--orange1);
}

.blog > .bl-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.blog > .bl-two {
    display: flex;
    gap: 32px;
}

.blog > .bl-two > .col-one {
    display: flex;
    position: relative;
}

.blog > .bl-two > .col-one::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgb(0, 0, 0, 0.2);
    border-radius: 26px;
}

.blog > .bl-two > .col-one > img {
    width: 762px;
    height: 873px;
    border-radius: 26px;
}

.blog > .bl-two > .col-two {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 106.5px 0;
}

.blog > .bl-two > .col-two > h2 {
    font-family: "Playfair Display", serif;
    font-size: 54px;
    font-weight: 400;
    color: var(--blue);
}

.blog > .bl-two > .col-two > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    line-height: 52px;
    font-weight: 400;
    color: var(--blue);
}

.blog > .bl-two > .col-two > a {
    display: flex;
    align-items: center;
    gap: 20px;
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    line-height: 52px;
    font-weight: 400;
    color: var(--orange1);
}

/* SECTION BLOG END */
















/* SECTION TRIP PLANNERS START */

.tripplanners {
    display: flex;
    gap: clamp(80px, calc(25vw / 6 + 20px), 100px);
    padding: 140px 0;
}

.tripplanners > .bl-one {
    display: flex;
    flex-direction: column;
    align-self: center;
    gap: 50px;
    max-width: 394px;
    margin-top: clamp(-10px, 23.95833vw - 355px, 105px);
}

.tripplanners > .bl-one > .row-one > .title {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.tripplanners > .bl-one > .row-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.tripplanners > .bl-one > .row-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 100%;
    max-width: 231px;
    min-width: 231px;
    height: 3px;
    bottom: 0;
    background-color: var(--orange1);
}

.tripplanners > .bl-one > .row-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: var(--gray);
}

.tripplanners > .bl-one > .row-two > .wrap-btn {
    margin-left: 40px;
}

.tripplanners > .bl-one > .row-two > .wrap-btn > button {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    padding: 0 20px;
    height: 61px;
    border-radius: 12px;
    background-color: var(--orange1);
    color: var(--white);
    transition: background-color 0.5s ease;

    position: relative;
}

.tripplanners > .bl-one > .row-two > .wrap-btn > button:hover {
    background-color: var(--orange-hover);
}

.tripplanners > .bl-one > .row-two > .wrap-btn > button::before {
    position: absolute;
    content: '';
    height: 43px;
    width: 43px;
    background-color: var(--blue);
    left: -14px;
    top: -14.5px;
    z-index: -1;
}

.tripplanners > .bl-one > .row-two > .wrap-btn > button::after {
    position: absolute;
    content: '';
    height: 43px;
    width: 43px;
    background-color: var(--gray);
    right: -18px;
    bottom: -16px;
    z-index: -1;
    
}

.tripplanners > .bl-two {
    position: relative;
    width: 100%;
    height: 545px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel {
    display: flex;
    gap: 32px;
    height: 545px;
    position: absolute;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container {
    display: flex;
    flex-direction: column;
    align-self: center;
    position: relative;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container:nth-child(2) > .wrap-img {
    transform: translateY(-72px);
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .wrap-img {
    display: flex;
    position: relative;
    transition: transform 0.5s ease;
    z-index: 2;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .wrap-img::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    background-color: rgb(0, 0, 0, 0.2);
    border-radius: 26px;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .wrap-img > img:first-child {
    display: block;
    width: 300px;
    height: 399px;
    border-radius: 26px;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .wrap-img > img:last-child {
    display: none;
    width: 1077px;
    height: 518px;
    border-radius: 26px;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    padding: 20px 0;
    position: absolute;
    bottom: 0;
    transition: transform 0.5s ease;
    z-index: 1;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container:nth-child(2) > .text {
    transform: translateY(72px);
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text > div:nth-child(1) {
    display: flex;
    justify-content: space-between;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text > h3 {
    font-family: "Playfair Display", serif;
    font-size: 28px;
    font-weight: 600;
    color: var(--blue);
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text > div:nth-child(3) {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text > div:nth-child(3) > div {
    display: flex;
    gap: 4px;
}

.tripplanners > .bl-two > .wrap-tripplanners-carousel > .img-container > .text span {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: var(--blue);
}

/* SECTION TRIP PLANNERS END */















/* SECTION DESTINATIONS GALLERY START */

.destinations-gallery {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 140px 0 140px 0;
}

.destinations-gallery > .bl-one {
    display: flex;
    justify-content: space-between;
    gap: 100px;
    margin-right: 180px;
}

.destinations-gallery > .bl-one > .title {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.destinations-gallery > .bl-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.destinations-gallery > .bl-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 100%;
    max-width: 283px;
    min-width: 227px;
    height: 3px;
    bottom: 0;
    background-color: var(--orange1);
}

.destinations-gallery > .bl-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.destinations-gallery > .bl-one > .arrows {
    display: flex;
    align-items: end;
    gap: 40px;
}

.destinations-gallery > .bl-one > .arrows > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 60px;
    border-radius: 12px;

    background-color: var(--blue);
    cursor: pointer;
    transition: background-color 0.5s ease;
}

.destinations-gallery > .bl-one > .arrows > span.active {
    background-color: var(--orange1);
}

.destinations-gallery > .bl-one > .arrows > span:nth-child(1) > svg {
    transform: rotate(0deg);
}

.destinations-gallery > .bl-one > .arrows > span:nth-child(2) > svg {
    transform: rotate(-180deg);
}

.destinations-gallery > .bl-two > .wrap-dest-gallery {
    position: relative;
    width: 1556px;

    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery {
    display: flex;
    gap: 32px;
    padding-top: 37.5px;
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > div {
    display: flex;
    position: relative;
    transition: transform 0.5s ease;
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > div::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    background-color: rgb(0, 0, 0, 0.2);
    border-radius: 26px;
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > div:nth-child(2) {
    transform: translateY(-37.5px);
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > div > img {
    display: block;
    width: 365px;
    height: 570px;
    border-radius: 26px;
}

.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > div > img:nth-child(2) {
    display: none;
    width: 728px;
    height: 351px;
    border-radius: 26px;
}

/* SECTION DESTINATIONS GALLERY END */











/* SECTION TESTIMONIAL START */

.testimonial {
    display: flex;
    flex-direction: column;
    gap: 160px;
    padding: 140px 0px 240px 0px;
}

.testimonial > .bl-one > .row-one > .title {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.testimonial > .bl-one > .row-one > .title > h1 {
    position: relative;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: normal;
    padding-bottom: 23px;
    color: var(--blue);
}

.testimonial > .bl-one > .row-one > .title > h1::before {
    position: absolute;
    content: '';
    width: 100%;
    max-width: 347px;
    min-width: 347px;
    height: 3px;
    bottom: 0;
    background-color: var(--orange1);
}

.testimonial > .bl-one > .row-one > .title > p {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.testimonial > .bl-two {
    display: flex;
    align-items: self-end;
    position: relative;
    width: 100%;
    height: 378px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.testimonial > .bl-two > .wrap-clients {
    display: flex;
    position: absolute;
    gap: 32px;
    z-index: -1;
}

.testimonial > .bl-two > .wrap-clients > div {
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 20px;

    width: 663px;
    max-width: 663px;

    padding: 60px 40px 40px;
    background-color: #F5F6F7;
    border-radius: 12px;
}

.testimonial > .bl-two > .wrap-clients > div > .ava {
    display: flex;
    position: absolute;
    left: 40px;
    top: -65px;
}

.testimonial > .bl-two > .wrap-clients > div > .ava > img {
    border-radius: 100%;
}

.testimonial > .bl-two > .wrap-clients > div > p {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    line-height: 23px;
    font-weight: 400;
    color: var(--gray);
}

.testimonial > .bl-two > .wrap-clients > div > .rating {
    display: flex;
    gap: 4px;
}

.testimonial > .bl-two > .wrap-clients > div > .name {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.testimonial > .bl-two > .wrap-clients > div > .name > span:nth-child(1) {
    font-family: "Playfair Display", serif;
    font-size: 24px;
    font-weight: 400;
    color: var(--gray);
}

.testimonial > .bl-two > .wrap-clients > div > .name > span:nth-child(2) {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: var(--gray);
}

.testimonial > .bl-three {
    display: flex;
    justify-content: flex-end;
}

.testimonial > .bl-three > .arrows {
    display: flex;
    align-items: end;
    gap: 40px;
    margin-right: 180px;
}

.testimonial > .bl-three > .arrows > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 60px;
    border-radius: 12px;

    background-color: var(--blue);
    cursor: pointer;
    transition: background-color 0.5s ease;
}

.testimonial > .bl-three > .arrows > span.active {
    background-color: var(--orange1);
}

.testimonial > .bl-three > .arrows > span:nth-child(1) > svg {
    transform: rotate(0deg);
}

.testimonial > .bl-three > .arrows > span:nth-child(2) > svg {
    transform: rotate(-180deg);
}

/* SECTION TESTIMONIAL END */






/* CAROUSEL SLIDER START */

.destinations-wrap-carousel,
.specialoffer > .wrap-bl-two,
.tripplanners > .bl-two,
.destinations-gallery > .bl-two > .wrap-dest-gallery,
.testimonial > .bl-two {
    scroll-snap-type: x mandatory;
    cursor: grab;
}

.destinations-wrap-carousel.active,
.specialoffer > .wrap-bl-two.active,
.tripplanners > .bl-two.active,
.destinations-gallery > .bl-two > .wrap-dest-gallery.active,
.testimonial > .bl-two.active {
    cursor: grabbing;
}

.destinations-wrap-carousel > div > *,
.specialoffer > .wrap-bl-two > .bl-two > *,
.tripplanners > .bl-two > .wrap-tripplanners-carousel > *,
.destinations-gallery > .bl-two > .wrap-dest-gallery > .dest-gallery > *,
.testimonial > .bl-two > .wrap-clients > * {
    scroll-snap-align: start;
}

.arrows > span.disabled {
    opacity: 0.45;
    cursor: default;
}

/* CAROUSEL SLIDER END */

/* MAIN END */












/* FOOTER START */

footer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    background-color: var(--blue);
    height: 577px;
}

footer > .newsletter {
    position: absolute;
    padding: 60px 80px;
    border-radius: 26px;
    left: 50%;
    top: -109px;
    transform: translateX(-50%);
    background-color: var(--white);
    box-shadow: 0px 0px 4px 0px rgb(0, 0, 0, 0.3);
}

footer > .newsletter > .newsletter-wrap {
    display: flex;
    gap: 100px;
}

footer > .newsletter > .newsletter-wrap > h1 {
    white-space: nowrap;
    font-family: "Playfair Display", serif;
    font-size: 64px;
    font-weight: 400;
    color: var(--gray);
}

footer > .newsletter > .newsletter-wrap > div {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

footer > .newsletter > .newsletter-wrap > div > span {
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--gray);
}

footer > .newsletter > .newsletter-wrap > div > div {
    display: flex;
    gap: 32px;
}

footer > .newsletter > .newsletter-wrap > div > div > .wrap-inp-email > input {
    width: 372px;
    height: 72px;
    padding: 0 40px;
    border-radius: 12px;
    background-color: #FFE8D4;

    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--orange1);
}

footer > .newsletter > .newsletter-wrap > div > div > .wrap-inp-email > input::placeholder {
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: var(--orange1);
}

footer > .newsletter > .newsletter-wrap > div > div > button {
    display: flex;
    align-items: center;
    height: 73px;
    padding: 0 34.5px;
    border-radius: 12px;
    background-color: var(--orange-btn);

    color: var(--white);
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 400;

    transition: background-color 0.5s ease;
}

footer > .newsletter > .newsletter-wrap > div > div > button:hover {
    background-color: var(--orange-hover);
}

footer > .footer-content {
    display: flex;
    gap: 159px;
    margin-top: 134px;
}

footer > .footer-content > .footer-logo {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

footer > .footer-content > .footer-logo > span:nth-child(1) {
    display: flex;
    align-items: center;
}

footer > .footer-content > .footer-logo > span:nth-child(2) {
    font-family: "Rubik", sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: var(--white);
}

footer > .footer-content > .footer-bl-one,
footer > .footer-content > .footer-bl-two,
footer > .footer-content > .footer-bl-three,
footer > .footer-content > .footer-bl-four {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

footer > .footer-content > .footer-bl-one > span,
footer > .footer-content > .footer-bl-two > span,
footer > .footer-content > .footer-bl-three > span,
footer > .footer-content > .footer-bl-four > span {
    font-family: "Rubik", sans-serif;
    font-size: 24px;
    font-weight: 500;
    color: var(--white);
}

footer > .footer-content > .footer-bl-one > ul,
footer > .footer-content > .footer-bl-two > ul,
footer > .footer-content > .footer-bl-three > ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

footer > .footer-content > .footer-bl-four > ul {
    display: flex;
    align-items: center;
    gap: 24px;
}

footer > .footer-content > .footer-bl-one > ul > li > a,
footer > .footer-content > .footer-bl-two > ul > li,
footer > .footer-content > .footer-bl-three > ul > li {
    font-family: "Rubik", sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: var(--white);
}

/* FOOTER END */