/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Dynalight&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{ padding: 0; margin: 0; box-sizing: border-box; }

body { font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 400; color: #fff; line-height: 1.6; background-color: #282828; }
img { display: block; max-width: 100%; height: auto; }
a { outline: none; text-decoration: none; color: #040404; text-decoration: none; transition: all 0.3s ease-in-out; }
ul,ol { padding: 0; margin: 0; list-style: none; }
h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1; font-family: "Dynalight", sans-serif; }
h1 { font-size: 100px; }
h2 { font-size: 80px; }
h3 { font-size: 42px; }
p { margin-bottom: 30px; }
p:last-child { margin-bottom: 0; }

/* global */
.centered { padding-right: calc((100% - 1100px)/ 2); padding-left: calc((100% - 1100px)/ 2); }
.btn { padding: 0 40px; min-height: 58px; font-size: 18px; font-family: "Inter", sans-serif; font-weight: 700; display: inline-flex; align-items: center; border-radius: 30px; color: #fff; text-transform: uppercase; cursor: pointer; border: 0; background-color: #EF5644; }
.btn:hover { background-color: #ff8475; }

/* wrapper */
.wrapper { width: 100%; position: relative; overflow: hidden; }

/* header */
.header { padding: 0 35px; position: relative; width: 100%; z-index: 99; display: flex; align-items: center; justify-content: space-between; min-height: 100px; background-color: #282828; }
.header .logo { display: block; width: 368px; }
.header .menu { display: flex; flex-wrap: wrap; gap: 40px; }
.header .menu li a { padding: 0 3px; position: relative; font-weight: 400; color: #fff; }
.header .menu li a:after { position: absolute; left: 50%; bottom: -6px; content: ''; width: 0; height: 2px; transition: all 0.3s ease-in-out; transform: translateX(-50%); background-color: #EF5644; }
.header .menu li a:hover:after,
.header .menu li.is-active a:after { width: 100%; opacity: 1; }
.header .mobileMenu { position: relative; width: 30px; height: 30px; display: none; }
.header .mobileMenu span { position: absolute; right: 0; display: block; width: 30px; height: 2px; border-radius: 2px; text-indent: -9999px; transition: .2s; background-color: #fff; }
.header .mobileMenu span:before,
.header .mobileMenu span:after { position: absolute; left: 0; display: block; width: 100%; height: 2px; border-radius: 2px; transition-duration: .2s,.2s; content: ""; background-color: #fff; }
.header .mobileMenu span:before { top: -10px; }
.header .mobileMenu span:after { bottom: -10px; }
.header .mobileMenu.is-active span { background-color: transparent; }
.header .mobileMenu.is-active span:before { top: 0; transform: rotate(135deg); }
.header .mobileMenu.is-active span:after { bottom: 0; transform: rotate(-135deg); }

/* hero */
.hero { margin-bottom: 50px; width: 100%; }
.hero .swiper { width: 100%; }
.hero .swiper-slide { width: 100%; height: 700px; display: flex; align-items: center; position: relative; }
.hero .text { margin-left: auto; text-align: center; width: 100%; max-width: 520px; position: relative; z-index: 1; }
/* .hero .title { margin-bottom: 20px; font-size: 100px; line-height: 1; color: #fff; text-align: center; font-family: "Dynalight", sans-serif; } */
.hero .title,
.hero p { margin-bottom: 20px; text-align: center; font-size: 50px; line-height: 1.4; text-shadow: 0px 3px 5px #000; font-family: "Dynalight", sans-serif; line-height: 1; }
.hero .title { margin-bottom: 10px; }
.hero .btn { margin: 0 auto; } 
.hero .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.hero .bg img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.hero .bg:before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; content: ''; background: rgba(2, 2, 2, 0.3); }
.hero .swiper-pagination { position: absolute; left: 0; bottom: 50px!important; display: flex; justify-content: center; }
.hero .swiper-pagination-bullet { margin: 0; background-color: #fff; opacity: 0.5; }
.hero .swiper-pagination-bullet-active { opacity: 1; }

/* hero */
.heroInner { padding-top: 50px; margin-bottom: 50px; width: 100%; height: 500px; position: relative; }
.heroInner h1 { color: #fff; text-align: center; text-shadow: 0px 3px 5px #000; }
.heroInner.blog h1 { font-size: 69px; }
.heroInner .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; }
.heroInner .bg img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.heroInner .swiper { height: 100%; }
.heroInner .swiper-pagination { position: absolute; left: 0; bottom: 50px!important; display: flex; justify-content: center; }
.heroInner .swiper-pagination-bullet { margin: 0; background-color: #fff; opacity: 0.5; width: 12px; height: 12px; }
.heroInner .swiper-pagination-bullet-active { opacity: 1; }
.heroInner .tab { position: absolute; right: 20px; top: 10px; }
.heroInner .tab ul { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.heroInner .tab li a { padding: 0 10px; display: flex; justify-content: center; align-items: center; text-align: center; min-height: 40px; border-radius: 28px; color: #fff; text-transform: uppercase; border: 1px solid #969696; background-color: rgba(0,0,0,.07); }
.heroInner .tab li.active a,
.heroInner .tab li a:hover { color: #fff; border-color: #EF5644; background-color: #EF5644; }

/* text side */
.textSide { margin-bottom: 88px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; }
.textSide .left { width: 46%; }
.textSide .right { width: 50%; position:relative; }
.textSide h2 { margin-bottom: 10px; }
.textSide p { margin-bottom: 30px; }
.textSide .right .swiper { position: absolute; inset: 0; }
.textSide .swiper-slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 60px; }
.textSide .swiper-pagination { position: absolute; left: 0; bottom: 30px!important; display: flex; justify-content: center; }
.textSide .swiper-pagination-bullet { margin: 0; background-color: #fff; opacity: 0.5; width: 12px; height: 12px; }
.textSide .swiper-pagination-bullet-active { opacity: 1; }

/* contact side */
.contactSide { margin-bottom: 88px; width: 100%; }
.contactSide h2 { margin-bottom: 25px; font-family: 'Poppins', sans-serif; font-weight: 400; text-align: center; font-size: 48px; }
.contactSide .form { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; }
.contactSide .input { width: 100%; }
.contactSide .input.half { width:calc(50% - 10px); }
.contactSide input[type="text"],
.contactSide input[type="number"],
.contactSide input[type="email"],
.contactSide input[type="password"],
.contactSide input[type="search"],
.contactSide textarea { padding: 0 38px; width: 100%; height: 74px; font-size: 18px; color: #282828; border-radius: 37px; border: 0; background-color: #fff; }
.contactSide input[type="text"]:focus,
.contactSide input[type="number"]:focus,
.contactSide input[type="email"]:focus,
.contactSide input[type="password"]:focus,
.contactSide input[type="search"]:focus,
.contactSide textarea { border: 0; outline: none; }
.contactSide input[type="text"]::placeholder,
.contactSide input[type="number"]::placeholder,
.contactSide input[type="email"]::placeholder,
.contactSide input[type="password"]::placeholder,
.contactSide input[type="search"]::placeholder,
.contactSide textarea { color: #282828; }
.contactSide textarea { padding-top: 20px; padding-bottom: 20px; height: 260px; }
.contactSide .button { width: 100%; display: flex; justify-content: center; }

/* about side */
.aboutSide { margin-bottom: 88px; width: 100%; }
.aboutSide p { text-align: center; }
.aboutSide .button { display: flex; justify-content: center; }

/* team side */
.teamSide { margin-bottom: 88px; width: 100%; }
.teamSide .team-heading { text-align:center; max-width:600px; width: 100%; margin:0 auto 60px; }
.teamSide .team-card{ background:#fff; border-radius:18px; overflow:hidden; text-align:center; box-shadow:0 10px 30px rgba(0,0,0,.08); transition:.4s; }
.teamSide .team-img{ height:200px; overflow:hidden; }
.teamSide .team-img img{ width:100%; height:100%; object-fit:cover; transition:.5s; }
.teamSide .team-card:hover img{ transform:scale(1.1); }
.teamSide .team-content{ padding:25px 20px; text-align: left; }
.teamSide .team-content h3{ font-size:25px; color:#222; }
.teamSide .team-content span{ display:block; font-size:14px; color:#222; font-weight:600; margin:6px 0 12px; }
.teamSide .swiper-button-next,
.teamSide .swiper-button-prev{ margin-top: -40px; width: 40px; height: 40px; border-radius: 10px; background-color: #EF5644; }
.teamSide .swiper-button-next::after,
.teamSide .swiper-button-prev::after { font-size: 18px; color: #fff; }
.teamSide .swiper-pagination { margin-top: 20px; position: relative; }
.teamSide .swiper-pagination-bullet { opacity: 0.3; background-color: #fff; }
.teamSide .swiper-pagination-bullet-active{ opacity: 1; background:#fff; }
.teamSide .socialIcons { display: flex; gap: 20px;}
.teamSide .socialIcons li a { color: #9ca3af; transition: color 0.3s ease; }
.teamSide .socialIcons li a:hover { color: #4b5563; }
.teamSide .socialIcons svg { width: 20px; height: 20px; fill: currentColor; }

/* content side */
.contentSide { margin-bottom: 88px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; }
.contentSide .list { padding-top: 34px; width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; border-top: 2px solid #4d4d4d; }
.contentSide .list li a { display: block; overflow: hidden; color: #282828; border-radius: 20px; background-color: #fff; }
.contentSide .list li a img { width: 100%; height: auto; }
.contentSide .list li a:hover { color: #EF5644; }
.contentSide .title { padding: 15px 15px; font-weight: 700; }
.contentSide .block { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; }
.contentSide .left { width: 47%; }
.contentSide .right { width: 50%; position: relative; }
.contentSide .image { width: 100%; }
.contentSide .right img,
.contentSide .image img { width: 100%; height: auto; border-radius: 60px; }
.contentSide .right .swiper { position: absolute; inset: 0; }
.contentSide .swiper-slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 60px; }
.contentSide .nomadBlock { padding-top: 34px; margin-top: 30px; width: 100%; border-top: 2px solid #4d4d4d; }
.contentSide h3 { margin-bottom: 34px; font-family: 'Poppins', sans-serif; font-weight: 500; text-align: center; }
.contentSide .form { margin-bottom: 30px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
.contentSide .select { width: 100%; }
.contentSide select { padding: 0 50px 0 35px; font-size: 20px; width: 100%; height: 54px; appearance: none; border-radius: 28px; background: #fff url(../images/select-arrow.png) right 25px center no-repeat; }
.contentSide select:focus { outline: none; }
.contentSide .galleryList { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.contentSide .item > a { width: 100%; height: 100%; display: block; overflow: hidden; color: #282828; border-radius: 20px; background-color: #fff; }
.contentSide .item figure { width: 100%; height: 180px; }
.contentSide .item img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.contentSide .item > a:hover { color: #EF5644; }
.contentSide .stateList { padding: 4px 10px; margin-bottom: 10px; display: inline-flex; border-radius: 10px; background-color: #D9D9D9; }
.contentSide .stateList li { font-size: 8px; display: flex; align-items: center; color: #282828; }
.contentSide .stateList li::after { margin: 0 5px; content: ''; width: 1px; height: 8px; background-color: #545454; }
.contentSide .stateList li:last-child::after { display: none; }
.contentSide .text { padding: 15px; font-size: 15px; }
.contentSide .button { margin-top: 50px; width: 100%; display: flex; justify-content: center; }
.contentSide .galleryList.twoItem { grid-template-columns: repeat(2, 1fr); }
.contentSide .galleryList.twoItem figure { height: 240px; }
.contentSide .swiper-pagination { position: absolute; left: 0; bottom: 30px!important; display: flex; justify-content: center; }
.contentSide .swiper-pagination-bullet { margin: 0; background-color: #fff; opacity: 0.5; width: 12px; height: 12px; }
.contentSide .swiper-pagination-bullet-active { opacity: 1; }

/* gallery side */
.gallerySide { margin-bottom: 88px; width: 100%; }
.gallerySide .tab { margin-bottom: 65px; width: 100%; }
.gallerySide .tab ul { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
.gallerySide .tab li a { padding: 0 10px; display: flex; justify-content: center; align-items: center; text-align: center; min-height: 54px; border-radius: 28px; color: #A3A3A3; text-transform: uppercase; border: 1px solid #969696; }
.gallerySide .tab li.active a,
.gallerySide .tab li a:hover { color: #fff; border-color: #EF5644; background-color: #EF5644; }
.gallerySide .block { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.gallerySide .item { width: 100%; position: relative; cursor: pointer; }
.gallerySide .item a { width: 100%; display: block; }
.gallerySide .item img { width: 100%; height: auto; }
.gallerySide .item figure {
  position: relative;
  height: 195px;
}

.gallerySide .item figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 10px 12px; /* 👈 more space */
  font-size: 14px;
  color: #fff;
  line-height: 1.4;
  background: linear-gradient(to top, rgba(0,0,0,0.85), rgba(0,0,0,0.2));
  z-index: 2;

  /* 👇 prevent overflow cutting */
  display: -webkit-box;
  -webkit-line-clamp: 2;  /* max 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gallerySide .item .number {
  position: absolute;
  background: #000; /* solid background */
  color: #fff;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 4px;
  z-index: 5;
}
.gallerySide .item figure img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.gallerySide .item h4 { font-size: 18px; width: 100%; }
.gallerySide .blogBlock { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.gallerySide .blogBlock .left { width: 47%; }
.gallerySide .blogBlock .right { width: 50%; position: relative; }
.gallerySide .blogBlock .right img { width: 100%; height: 100%; border-radius: 60px; }
.gallerySide .right .swiper { position: absolute; inset: 0; }
.gallerySide .swiper-slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 60px; }
.gallerySide h4 { margin-bottom: 15px; font-size: 34px; }
.gallerySide .swiper-pagination { position: absolute; left: 0; bottom: 30px!important; display: flex; justify-content: center; }
.gallerySide .swiper-pagination-bullet { margin: 0; background-color: #fff; opacity: 0.5; width: 12px; height: 12px; }
.gallerySide .swiper-pagination-bullet-active { opacity: 1; }
.gallerySide .number { position: absolute; right: 0; bottom: 0; padding: 4px 10px; background-color: rgba(0,0,0,0.7); color: #fff; font-size: 14px; border-radius: 5px 0 0 0; }
.gallery-card h4 { font-size: 18px; }

/* popup */
/* =========================
   MAIN POPUP
========================= */

.customPopup{
    position:fixed;
    inset:0;

    background:rgba(0,0,0,0.96);

    display:none;

    justify-content:center;
    align-items:center;

    z-index:99999;

    overflow:hidden;
}

.customPopup.active{
    display:flex;
}

/* =========================
   INNER WRAPPER
========================= */

.popupInner{
    width:95%;
    height:100vh;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:40px;

    position:relative;
}

/* =========================
   CLOSE BUTTON
========================= */

.popupClose{
    position:fixed;

    top:20px;
    right:20px;

    width:48px;
    height:48px;

    border-radius:50%;

    background:#e74c3c;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    z-index:9999;

    transition:.3s;
}

.popupClose:hover{
    transform:scale(1.08);
}

.popupClose svg{
    width:24px;
    height:24px;

    fill:#fff;
}

/* =========================
   LEFT IMAGE SECTION
========================= */

.popupLeft{
    flex:1;

    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    height:90vh;

    overflow:hidden;
}

/* MAIN IMAGE */

.popupLeft img{
    max-width:100%;
    max-height:90vh;

    width:auto;
    height:auto;

    object-fit:contain;

    border-radius:4px;

    cursor:pointer;
}

/* =========================
   IMAGE ARROWS
========================= */

.popupArrow{
    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:54px;
    height:54px;

    border:none;
    border-radius:50%;

    background:#e74c3c;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    z-index:100;

    transition:.3s;
}

.popupArrow:hover{
    transform:translateY(-50%) scale(1.08);
}

/* LEFT */

.prevBtn{
    left:20px;
}

/* RIGHT */

.nextBtn{
    right:20px;
}

/* SVG */

.popupArrow svg{
    width:22px;
    height:22px;

    stroke:#fff;
    fill:none;
    stroke-width:2;
}

/* =========================
   RIGHT SIDEBAR
========================= */

.popupRight{
    width:320px;
    min-width:320px;

    height:90vh;

    overflow-y:auto;

    padding-right:5px;
}

/* =========================
   COUNTER
========================= */

.popupTop{
    text-align:center;

    margin-bottom:20px;
}

.popupCounter{
    color:#fff;

    font-size:18px;
    font-weight:600;
}

/* =========================
   THUMBNAILS
========================= */

.popupThumbs{
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:12px;
}

.popupThumbs img{
    width:100%;
    height:82px;

    object-fit:cover;

    cursor:pointer;

    opacity:.6;

    border:2px solid transparent;

    transition:.3s;
}

.popupThumbs img:hover{
    opacity:1;
    transform:scale(1.03);
}

.popupThumbs img.active{
    opacity:1;

    border-color:#e74c3c;
}

/* =========================
   PAGINATION
========================= */

.popupPages{
    margin-top:22px;

    display:flex;
    justify-content:center;

    gap:10px;
}

.popupPages button{
    width:36px;
    height:36px;

    border:none;

    background:#333;
    color:#fff;

    cursor:pointer;

    transition:.3s;
}

.popupPages button:hover{
    background:#555;
}

.popupPages button.active{
    background:#e74c3c;
}

/* =========================
   FULLSCREEN VIEWER
========================= */

.imageViewer{
    position:fixed;
    inset:0;

    background:#000;

    display:none;

    align-items:center;
    justify-content:center;

    z-index:999999999;
}

.imageViewer.active{
    display:flex;
}

/* FULL IMAGE */

.imageViewer img{
    max-width:100%;
    max-height:100vh;

    object-fit:contain;
}

/* =========================
   VIEWER CLOSE
========================= */

.viewerClose{
    position:absolute;

    top:20px;
    right:25px;

    width:54px;
    height:54px;

    border-radius:50%;

    background:#cc1818;

    color:#fff;

    font-size:34px;
    line-height:54px;

    text-align:center;

    cursor:pointer;

    z-index:999;
}

/* =========================
   VIEWER ARROWS
========================= */

.viewerArrow{
    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:60px;
    height:60px;

    border:none;
    border-radius:50%;

    background:#cc1818;

    color:#fff;

    font-size:38px;

    cursor:pointer;

    z-index:999;
}

.viewerPrev{
    left:20px;
}

.viewerNext{
    right:20px;
}

/* =========================
   MOBILE
========================= */

@media(max-width:768px){

    .popupInner{
        flex-direction:column;

        gap:20px;
    }

    .popupLeft{
        width:100%;
        height:65vh;
    }

    .popupRight{
        width:100%;
        min-width:100%;

        height:25vh;
    }

    .popupThumbs{
        display:flex;

        overflow-x:auto;

        gap:10px;
    }

    .popupThumbs img{
        min-width:110px;
        height:80px;
    }

    .popupArrow{
        width:45px;
        height:45px;
    }

}
/* =========================
   MOBILE ARROW COLOR FIX
========================= */

@media(max-width:768px){

    .popupArrow,
    .viewerArrow{

        background:#e74c3c !important;

        opacity:1 !important;

        border:none !important;

    }

    .popupArrow svg{

        stroke:#fff !important;
        fill:none !important;

    }

    .viewerArrow{

        color:#fff !important;

    }

    /* Better visibility */

    .prevBtn{
        left:10px;
    }

    .nextBtn{
        right:10px;
    }

    .viewerPrev{
        left:10px;
    }

    .viewerNext{
        right:10px;
    }

}

/* photodetail side */
.photodetailSide { margin-bottom: 88px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
.photodetailSide .left-panel{ width: calc(100% - 320px); display:flex; align-items:center; justify-content:center; position:relative; }
.photodetailSide .main-image{ position:relative; width: 100%; }
.photodetailSide .main-image img{ width: 100%; max-width:100%; cursor:pointer; }
.photodetailSide .swiper{ display:none; }
.photodetailSide .right-panel{ width: 280px; }
.photodetailSide .photo-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:15px; }
.photodetailSide .nav-btn{ cursor:pointer; padding:5px 10px; border:1px solid #333; background:#EF5644; }
.photodetailSide .thumbnails{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; min-height: 230px; }
.photodetailSide .thumbnails img{ width:100%; cursor:pointer; border:1px solid #222; opacity:0.6; transition:0.2s; }
.photodetailSide .thumbnails img.active,
.photodetailSide .thumbnails img:hover{ opacity:1; border:1px solid orange; }
.photodetailSide .pagination{ text-align:center; margin-top:15px; }
.photodetailSide .pagination span{ cursor:pointer; padding:5px 8px; margin:0 3px; border:1px solid #333; }
.photodetailSide .pagination span.active-page{ background:#EF5644; color: #fff; }

/* 🔥 SMOOTH LIGHTBOX */
.lightbox{ position:fixed; z-index:9999; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.75); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease; }
.lightbox.active{ opacity:1; visibility:visible; }
.lightbox img{ max-width:90%; max-height:90vh; object-fit:contain; transform:scale(.9); transition:transform .3s ease; }
.lightbox.active img{ transform:scale(1); }
.close-btn{ position:absolute; top:25px; right:35px; font-size:40px; color:white; cursor:pointer; z-index:10000; }

/* footer side */
.footerSide { padding-top: 30px; padding-bottom: 30px; display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; font-size: 16px; background-color: #4D4D4D; }
.footerSide .left { width: 40%; }
.footerSide .center { width: 25%; }
.footerSide .right { width: 34%; }
.footerSide .link { width: 100%; }
.footerSide .link li { padding-left: 22px; margin-bottom: 7px; width: 100%; position: relative; }
.footerSide .link li:last-child { margin-bottom: 0; }
.footerSide .link li::before { width: 10px; height: 10px; position: absolute; left: 0; top: 8px; content: ''; background: url(../images/arrow.png) no-repeat; background-size: contain; }
.footerSide .link li a { text-decoration: none; color: #fff; }
.footerSide .link li a:hover { color: #d9d9d9; }
.footerSide .social { width: 100%; }
.footerSide .social li { width: 100%; }
.footerSide .social li a { display: inline-flex; align-items: center; gap: 15px; color: #fff; }
.footerSide .social li a img { width: 40px; height: auto; }
.footerSide .social li a:hover { opacity: 0.7; }
.footerSide .logo { margin-bottom: 15px; width: 100%; display: inline-block; }
.footerSide .copyright { margin-bottom: 15px; width: 100%; }
.footerSide .footerLink { display: flex; flex-wrap: wrap; }
.footerSide .footerLink li { display: flex; align-items: center; }
.footerSide .footerLink li:after { margin: 0 10px; display: block; width: 2px; height: 18px; content: ''; background-color: #fff; }
.footerSide .footerLink li:last-child::after { display: none; }
.footerSide .footerLink li a { color: #fff; }
.footerSide .footerLink li a:hover { color: #d9d9d9; }

.expandable-text .trigger { color: #EF5644; outline: none; background: none; border: none; cursor: pointer; }
.expandable-text .expanded-content { display: none; }

@media screen and (max-width: 1400px)  {
    .header .logo { width: 300px; }
    .header .menu { gap: 25px; }
    .header .menu li a { font-size: 18px; }
}

@media screen and (max-width: 1140px)  {
    body { font-size: 18px;
     }
    .centered { padding-left: 35px; padding-right: 35px; }
    .header .logo { width: 240px; }
    .header .menu { gap: 20px; }
    .header .menu li a { font-size: 16px; }
}

@media screen and (min-width: 991px)  {
    .header .menu { display: flex!important; }
}

@media screen and (max-width: 991px)  {
    body { font-size: 16px; }
    h2 { font-size: 60px; }
    h3 { font-size: 35px; }
    .btn { font-size: 16px; }

    .header { min-height: 80px; }
    .header .logo { width: 240px; }
    .header .mobileMenu { display: flex; align-items: center; }
    .header .menu { padding: 20px; position: absolute; left: 0; top: 80px; width: 100%; height: calc(100vh - 80px); overflow-y: auto; display: none; background-color: #282828; }
    .header .menu li { margin: 0 0 15px 0; width: 100%; }
    .header .menu li a { font-size: 16px; }

    .hero .text { max-width: 400px; }
    /* .hero .title { font-size: 80px; } */
    .hero .title,
    .hero p { font-size: 34px; }
    .hero .swiper-slide { height: 500px; }
    .hero .swiper-pagination { bottom: 30px!important; }

    .contentSide .list { grid-template-columns: repeat(3, 1fr); }
    .contentSide .galleryList { grid-template-columns: repeat(3, 1fr); }
    .contentSide select { font-size: 16px; }
    .contentSide .galleryList.twoItem figure { height: 200px; }

    .gallerySide .item figure { height: 140px; }

    .footerSide .social li a img { width: 40px; }
}

@media screen and (max-width: 767px)  {
    h1 { font-size: 65px; }
    h2 { font-size: 45px; }
    h3 { font-size: 28px; }
    .btn { padding: 0 30px; font-size: 14px; min-height: 50px; }

    .hero .swiper-slide { height: 400px; }
    .hero .text { max-width: 300px; }
    /* .hero .title { font-size: 65px; } */
    .hero .title,
    .hero p { font-size: 30px; }

    .heroInner { height: 300px; }
    .heroInner.blog h1 { font-size: 45px; }
    .heroInner .tab { top: unset; bottom: 15px; }

    .textSide { margin-bottom: 50px; }
    .textSide .left { margin-bottom: 40px; width: 100%; }
    .textSide .right { width: 100%; }
    .textSide .right img { margin: 0 auto; border-radius: 30px; }
    .textSide .right .swiper { position: relative; inset: unset; }
    .textSide .right .swiper-slide img { border-radius: 30px; }

    .contactSide { margin-bottom: 50px; }
    .contactSide h2 { font-size: 30px; }
    .contactSide .input.half { width: 100%; }
    .contactSide input[type="text"], .contactSide input[type="number"], .contactSide input[type="email"], .contactSide input[type="password"], .contactSide input[type="search"], .contactSide textarea { padding-left: 30px; padding-right: 30px; font-size: 16px; height: 60px; }
    .contactSide textarea { padding-top: 20px; padding-bottom: 20px; height: 150px; }

    .aboutSide { margin-bottom: 50px; }

    .teamSide { margin-bottom: 50px; }
    .teamSide .team-heading { margin-bottom: 40px; }
    .teamSide .swiper-slide { width: 250px; }

    .contentSide .left { margin-bottom: 30px; width: 100%; }
    .contentSide .right { width: 100%; }
    .contentSide .right img,
    .contentSide .image img { border-radius: 30px; }
    .contentSide .list { grid-template-columns: repeat(2, 1fr); }
    .contentSide .galleryList { grid-template-columns: repeat(2, 1fr); }
    .contentSide .form { gap: 20px; }
    .contentSide select { padding: 0 20px; background-position: right 20px center; }
    .contentSide .item figure { height: 200px; }
    .contentSide .right .swiper { position: relative; inset: unset; }
    .contentSide .right .swiper-slide img { border-radius: 30px; }

    .gallerySide { margin-bottom: 50px; }
    .gallerySide .tab { margin-bottom: 30px; }
    .gallerySide .tab ul { gap: 15px; }
    .gallerySide .tab a { font-size: 14px; }
    .gallerySide .block { grid-template-columns: repeat(2, 1fr); }
    .gallerySide .blogBlock .left { width: 100%; order: 1; }
    .gallerySide .blogBlock .right { margin-bottom: 30px; width: 100%; }
    .gallerySide .blogBlock .right img { border-radius: 30px; }
    .gallerySide h4 { font-size: 28px; }
    .gallerySide .right .swiper { position: relative; inset: unset; }
    .gallerySide .swiper-slide img { border-radius: 30px; }
    .gallerySide .item figure { height: 160px; }


    .popupInner { flex-direction:column; gap:20px; }
    .popupRight{width:100%;}
    .popupThumbs{grid-template-columns:repeat(4,1fr);}

    .photodetailSide { margin-bottom: 50px; }
    .photodetailSide .left-panel{ width: 100%; }
    .photodetailSide .right-panel{ display:none; }
    .photodetailSide .main-image{ border:none; padding:0; width:100%; height:100%; }
    .photodetailSide #mainImage { display:none; }
    .photodetailSide .swiper{ display:block; width:100%; height:100%; }
    .photodetailSide .swiper-slide{ display:flex; align-items:center; justify-content:center; }
    .photodetailSide .swiper-slide img{ width:100%; height:100%; object-fit:contain; }
    .photodetailSide .swiper-button-next, 
    .photodetailSide .swiper-button-prev { width: 36px; height: 36px; border-radius: 5px; background-color: #EF5644; }
    .photodetailSide .swiper-button-next::after, 
    .photodetailSide .swiper-button-prev::after { font-size: 18px; font-weight: 700; color: #fff; }

    .footerSide { font-size: 14px; }
    .footerSide .left { width: 56%; }
    .footerSide .center { width: 40%; }
    .footerSide .right { margin-top: 20px; width: 100%; }
    .footerSide .social li a { gap: 10px; }
    .footerSide .social li a img { width: 32px; }
    .footerSide .logo { width: 250px; }
    .footerSide .footerLink li:after { width: 1px; height: 16px; }
}

@media screen and (max-width: 480px)  {
    .contentSide .list { grid-template-columns: repeat(1, 1fr); }
    .contentSide .galleryList { grid-template-columns: repeat(1, 1fr); }
    .contentSide .form { grid-template-columns: repeat(1, 1fr); }
    .contentSide .galleryList.twoItem { grid-template-columns: repeat(1, 1fr); }
    
    .popupThumbs{grid-template-columns:repeat(3,1fr);}
    .popupTop button{width:30px;height:30px;font-size:16px;}
    .popupPages button{width:30px;height:30px;font-size:14px;}

    .gallerySide .item figure { height: 120px; }
}
span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 8px;
    height: 8px;
}
span.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
}