@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
:root {
  --red: #091B44;
  --gold: #BC9E68;
  --white: #ffffff;
  --off-white: #fafafa;
  --sky-blue: #00bfff;
  --black: #000000;
  --black-30: #0000004c;
  --jet-black: #373736;
  --gray: #656565;
  --blue: #091B44;
  --primary-font: "Inter", sans-serif;
  --secondary-font: "Cormorant Garamond", sans-serif;
  --h1-size: 58px;
  --h2-size: 42px;
  --h3-size: 36px;
  --h4-size: 32px;
  --h5-size: 24px;
  --h6-size: 22px;
  --p-size: 16px;
  --h1-line-height: 55px;
  --h2-line-height: 46px;
  --h3-line-height: 44px;
  --h4-line-height: 39px;
  --h5-line-height: 36px;
  --h6-line-height: 24px;
  --p-line-height: 24px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  width: 100%;
  height: 100%;
  background-color: var(--white);
  color: var(--gray);
  font: 500 var(--p-size)/var(--p-line-height) var(--primary-font);
}

 .row {
    margin-left: -15px;
    margin-right: -15px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

[class*='col-'] {
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

.col-1 {
    max-width: 8.33333333%;
    flex: 0 0 8.33333333%;
}

.col-2 {
    max-width: 16.66666667%;
    flex: 0 0 16.66666667%;
}

.col-3 {
    max-width: 25%;
    flex: 0 0 25%;
}

.col-4 {
    max-width: 33.33333333%;
    flex: 0 0 33.33333333%;
}

.col-5 {
    max-width: 41.66666667%;
    flex: 0 0 41.66666667%;
}

.col-6 {
    max-width: 50%;
    flex: 0 0 50%;
}

.col-7 {
    max-width: 58.33333333%;
    flex: 0 0 58.33333333%;
}

.col-8 {
    max-width: 66.66666667%;
    flex: 0 0 66.66666667%;
}

.col-9 {
    max-width: 75%;
    flex: 0 0 75%;
}

.col-10 {
    max-width: 83.33333333%;
    flex: 0 0 83.33333333%;
}

.col-11 {
    max-width: 91.66666667%;
    flex: 0 0 91.66666667%;
}

.col-12 {
    max-width: 100%;
    flex: 0 0 100%;
}

.no-guttor {
    margin-right: 0;
    margin-left: 0;
}

.no-guttor>[class*='col-'] {
    padding-right: 0;
    padding-left: 0;
}

ul {
  list-style: none;
}

iframe,
img,
video,
svg {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

h1 {
  font: 700 var(--h1-size)/var(--h1-line-height) var(--secondary-font);
  margin-bottom: 24px;
  text-transform: uppercase;
  color: var(--white);
}

h2 {
  font: 700 var(--h2-size)/var(--h2-line-height) var(--secondary-font);
  margin-bottom: 20px;
  text-transform: uppercase;
  color: var(--blue);
}

h3 {
  font: 700 var(--h3-size)/var(--h3-line-height) var(--secondary-font);
  margin-bottom: 20px;
}

h4 {
  font: 600 var(--h4-size)/var(--h4-line-height) var(--secondary-font);
  margin-bottom: 18px;
}

h5 {
  font: 600 var(--h5-size)/var(--h5-line-height) var(--secondary-font);
  margin-bottom: 16px;
}

h6 {
  font: 700 var(--h6-size)/var(--h6-line-height) var(--secondary-font);
  margin-bottom: 14px;
}

p {
  font: 400 var(--p-size)/var(--p-line-height) var(--primary-font);
  margin-bottom: 16px;
}

a {
  text-decoration: none;
  outline: none;
}

a:hover {
  color: inherit;
}

a:is(:focus, :focus-visible) {
  outline: 1px solid var(--red);
  box-shadow: none;
}

p a {
  color: var(--sky-blue);
}

p a:hover {
  color: var(--red);
}

::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  /* background: var(--off-white); */
  /* box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px; */
}

::-webkit-scrollbar-thumb {
  background: var(--jet-black);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--gray);
}

::-moz-selection {
  color: var(--red);
  background: var(--off-white);
}

::selection {
  color: var(--red);
  background: var(--off-white);
}


:is(h1, h2, h3, h4, h5, h6, p):last-child {
  margin-bottom: 0;
}

.ml-34 {
  margin-left: 34px;
}

.container {
  width: 100%;
  max-width: 1610px;
  margin-inline: auto;
  padding-inline: 20px;
}

.primaryBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  border: none;
  border-radius: 0;
  outline: none;
  padding: 12px 16px;
  background-color: var(--gold);
  color: var(--white);
  font: 300 16px/16px var(--primary-font);
  transition: all 0.25s ease-in-out;
  text-transform: uppercase;
}

.secondaryBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  border: 1px solid var(--gold);
  border-radius: 0;
  outline: none;
  padding: 12px 16px;
  background-color: unset;
  color: var(--gold);
  font: 300 16px/16px var(--primary-font);
  transition: all 0.25s ease-in-out;
  text-transform: uppercase;
}

.btn-dark {
  background-color: var(--jet-black);
  font-size: 16px;
  padding: 24px 55px;
}

.primaryBtn:hover,
.secondaryBtn:hover {
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
  transform: translateY(-2px);
  color: var(--white);
  border-color: var(--white);
}


/* HEADER CSS  */

#header-main {
    position: absolute;
    width: 100%;
    padding: 17px 0;
    z-index: 1000;
}
 
.site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo {
    text-align: center;
}

.logo h2 {
    margin: 0;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 30px;
    color: var(--white);
}

.logo span { 
    font-size: var(--h6-size);
    text-transform: uppercase;
    font-family: var(--primary-font);
    margin-top: 0;
    display: block;
    color: var(--white);
    font-weight: 300;
}

/* Main Css */

.section {
    padding-top: 60px;
    padding-bottom: 60px;
}

.align-center {
    align-items: center;
    justify-content: space-between;
}

.section-hero{
    position:relative;
    overflow:hidden;
}
.slick-dotted.slick-slider {
    margin-bottom: 0 !important;
}

.hero-slide::before {
    content: '';
    position: absolute;
    width: 100%;
    background-color: #00000052;
    height: 100%;
    z-index: 0;
    background-repeat: no-repeat;
    background-size: cover;
}

.hero-slide .container {
    z-index: 5;
}

.hero-slide{
    position:relative;
    min-height:100vh;
    display:flex !important;
    align-items:center;
    /* background:linear-gradient(90deg,#091b44fa,#091b44); */
    background-image: url('/assets/img/banner_slid01.jpg');
    background-repeat: no-repeat;
    background-size: cover;

}

.slid01 {
    background-image: url('/assets/img/old_showroom.jpg') !important;
    background-position: center;
}

.slid02 {
    background-image: url('/assets/img/new_showroom.jpg') !important;
    background-position: center;
}

.slid03 {
    background-image: url('/assets/img/banner_slid02.jpg') !important;
}

.slid04 {
    background-image: url('/assets/img/banner_slid03.jpg') !important;
}

.slid05 {
    background-image: url('/assets/img/banner_slid04.jpg') !important;
}


.hero-bg{
    position:absolute;
    inset:0;
    z-index:1;
}

.hero-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.hero-slide .container{
    display:flex;
    align-items:center;
    justify-content: end;
}

.banner-img img{
    display:block;
}



.section-hero .hero-content p.span-text {
    font-size: var(--p-size);
    color: var(--white);
    font-weight: 300;
}

.font-md {
    font-size: 18px;
    color: var(--white);
    font-weight: 200;
}

.list-item {
    display: flex;
    justify-content: space-between;
    margin-top: 23px;
}

.img-box {
    display: flex;
    align-items: center;
    gap: 5px;
}

.img-box img {
    height: 54px;
    width: 54px;
    object-fit: contain;
}

.img-box span {
    color: var(--white);
    font-family: var(--primary-font);
    font-size: 20px;
    font-weight: 200;
}

.right-border {
    position: relative;
}

.right-border::before {
    content: '';
    background-color: var(--white);
    width: 1px;
    height: 50px;
    right: -45px;
    position: absolute;
    opacity: 0.6;
}

.font-sm {
    color: var(--gray);
    font-family: var(--primary-font);
    font-size: 16px;
    font-weight: 400;
}

.about-content h2 {
    margin-bottom: 10px;
}

.mt-10 {
    margin-top: 10px;
}

.top-marquee {
    width: 100%;
    background: var(--gold);
    overflow: hidden;
    white-space: nowrap;
    padding: 18px 0 10px 0;
}

.marquee-track {
    display: inline-flex;
    align-items: center;
    gap: 80px;
    animation: marquee 30s linear infinite;
}

.marquee-track span {
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.marquee-track span img {
    width: 20px;
    height: 24px;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.top-marquee:hover .marquee-track {
    animation-play-state: paused;
}

.section-collections {
    background-image: url('/assets/img/collection_bg.png');
    background-size: cover;
    background-repeat: no-repeat;
}

 .collections-content {
    max-width: 900px;
    margin: auto;
    text-align: center;
}

.collections-card {
    margin-top: 40px;
}

.collections-content h2 {
    margin-bottom: 5px;
    margin-top: 5px;
}

.collections-card {
    display: grid;
    grid-template-columns: repeat(4  , 1fr);
    gap: 25px;
}

.collections-card .card-item h6 {
    color: var(--blue);
    text-transform: uppercase;
    margin-top: 15px;
    margin-bottom: 12px;
}

.section-contact {
    padding-top: 90px;
    padding-bottom: 90px;
    background-image: url('/assets/img/cta-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
}

 .cta-content .font-sm {
    color: var(--white);
}

 .cta-content h2 {
    color: var(--white);
    margin-top: 8px;
    margin-bottom: 10px;
}

 .cta-content p {
    color: var(--white);
    margin-bottom: 10px;
}

.why-choose-content {
    text-align: center;
}

.why-card{
    text-align:center;
    padding:35px 40px;
    position:relative;
}

.why-card img{
    width:45px;
    height:45px;
    margin-bottom: 0;
}

.why-card h6 {
    color: var(--blue);
    text-transform: uppercase;
    margin-top: 15px;
    margin-bottom: 12px;}


.why-grid {
    display: flex;
    justify-content: space-between;
    margin-top: 25px;
}

.why-grid .w-2 img {
    width: auto;
    height: 100%;
}

.section-why-choose .bg-border {
    position: relative;
}

/* .section-why-choose .bg-border::after{
    content: '';
    width: 70%;
    border-bottom: 0.1px solid transparent;
    background: linear-gradient(to right, rgb(76 76 76 / 8%) 0%, var(--gold) 100%);
    height: 1px;
    display: block;
    margin: 0 auto;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
} */

.section-why-choose .bg-border img {
    width: auto;
    height: 1px;
    object-fit: contain;
    margin: auto;
    display: block;
}

.section-book {
    background-color: var(--blue);
}

.section-book .book-img {
    display: grid;
    grid-template-columns: repeat(3 , 1fr);
    gap: 20px;
    margin-top: 20px;
}

.contact-form{
    background: var(--blue);
    padding: 0 30px 0 30px;
}

.contact-form .form-group{
    margin-bottom:20px;
}

.contact-form input,
.contact-form textarea{
	width: 100%;
	border: none;
	border: 1px solid rgba(255, 255, 255, 0.4);
	background: transparent;
	color: #fff;
	font-size: 14px;
	padding: 10px 10px;
	outline: none;
	font-family: var(--primary-font);
	font-weight: 300;
}

.contact-form textarea{
    height:50px;
    resize:none;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
    color:#fff;
    opacity:1;
}

/* .enquiry-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#c9a45b;
    color:#fff;
    border:none;
    padding:12px 22px;
    font-size:16px;
    text-transform:uppercase;
    cursor:pointer;
}

.enquiry-btn .icon{
    font-size:18px;
} */

.custom-faq{
    width:100%;
}

.faq-item{
    border-bottom:1px solid #d9d9d9;
}

.faq-btn{
    width:100%;
    background:none;
    border:none;
    padding:18px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    text-align:left;
    font-size:16px;
    font-weight:400;
    color: var(--gray);
    font-family: var(--primary-font);
}

.faq-btn span{
    padding-right:20px;
}

.faq-btn i{
    font-size:14px;
    transition:all .4s ease;
}

.faq-content{
    max-height:0;
    overflow:hidden;
    transition:max-height .5s ease-in-out;
}

.faq-content p{
    margin:0;
    padding:0 0 16px;
}

.faq-item.active .faq-btn i{
    transform:rotate(180deg);
}

.pr-30 {
    padding-right: 30px;
}

.pl-30 {
    padding-left: 30px;
}

.faqs-box .row{
    position: relative;
}

.faqs-box .row::after{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    transform: translateX(-50%);

    background: linear-gradient(
        to bottom,
        rgb(76 76 76 / 8%) 0%,
        var(--gold) 100%
    );
}

.faqs-box {
    margin-top: 35px;
}

.pt-0 {
    padding-top: 0;
}


.divider-section {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 20px;
    padding: 0 0;
}

.divider-section .line {
    flex: 1;
    height: 1px;
    background: linear-gradient(
        to right,
        transparent,
        var(--gold),
        transparent
    );
}

.divider-section .star-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.divider-section .star-wrap img {
    width: 18px;
    height: auto;
    display: block;
}

.align-left {
    text-align: left !important;
}

.stories-section {
    padding-left: calc((100% - 1610px) / 2);
    padding-right: 0;
    overflow: hidden;
}

.stories-wrapper .story-card {
    padding: 17px;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
    border-top: 2px solid var(--gold);
}

.stories-wrapper .story-card .author {
    display: flex;
    align-items: end;
    justify-content: space-between;
    margin-top: 15px;
}

.stories-wrapper .story-card .author img {
    width: 60px;
    height: 45px;
    object-fit: contain;
}

.stories-wrapper .story-card span {
    font-family: var(--primary-font);
    font-weight: 500;
    font-size: 16px;
    color: var(--blue);
    margin-bottom: 4px;
    display: block;
}

.stories-wrapper .story-card p {
    margin-bottom: 0;
    color: #808080;
}

.stories-wrapper .story-card .author h6 {
    font-family: var(--primary-font);
    font-weight: 500;
    font-size: 18px;
    color: var(--blue);
    margin-bottom: 4px;
    display: block;
    text-transform: uppercase;
}

.stories-slider .slick-track {
    display: flex;
    gap: 36px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.slick-track:after, .slick-track:before {
    display: none !important;
}

.slid-btn .arrow-icon svg {
    font-size: 25px;
    width: 38px;
    height: 38px;
    fill: var(--gold);
    color: var(--gold);
    border: 1px solid var(--gold);
    padding: 6px;
}

.slid-btn .arrow-icon svg:hover {
    background-color: var(--gold);
    fill: var(--white);
    color: var(--white);
}

.slid-btn {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.pd-0 {
    padding: 0 !important;
}

.site-footer {
    padding-top: 47px;
    background-color: var(--blue);
}

.footer-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-social {
    display: flex;
    gap: 15px;
}

/* .footer-social a {
    background-color: var(--white);
    padding: 6px;
    border-radius: 5px;
} */

.footer-social a i{
    color: var(--blue);
    font-size: 17px;
    line-height: 22px;
    transition: 0.3s;
    background-color: var(--white);
    padding: 4px;
    border-radius: 3px;
    width: 30px;
    text-align: center;
    align-items: center;
    margin: auto;
    height: 30px;
}

.footer-social a:hover{
    color: var(--gold);
}

.footer-item i {
    color: var(--white);
}

.footer-item {
    display: flex;
    gap: 8px;
    align-items: center;
}

.footer-item a {
    color: var(--white);
    font-family: var(--primary-font);
    font-weight: 300;
}

.footer-copyright p {
    color: var(--white);
    font-weight: 300;
    text-align: center;
    font-size: 16px;
}

.white-border {
    background-color: #ffffff38;
    height: 1px;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 20px;
}

.footer-copyright {
    padding-bottom: 16px;
}

.sm-logo {
    display: none;
}

.banner-img {
    display: none;
}

.map_content {
    padding: 30px 30px 20px 0;
}

.map_content iframe {
    width: 100%;
    height: 300px;
    border: 0;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);

}

.info-box {
    background-color: #fff;
    padding: 0;
}

.info-box img {
    display: block;
}

.contact_info {
    margin-top: 15px;
}

.contact_info h5{
    margin-bottom:5px;
    color:#000;
}


.contact-item{
    display:flex;
    align-items:flex-start;
    gap: 5px;
    margin-bottom: 5px;
}

.contact-item i{
    font-size:16px;
    color:var(--gold);
    margin-top:3px;
    min-width:22px;
}

.contact-item a{
    color:var(--gray);
    text-decoration:none;
    line-height:1.6;
    transition:0.3s;
    font: 400 var(--p-size)/var(--p-line-height) var(--primary-font);
}

.contact-item a:hover{
    color: var(--gold);
}


.about-stats{
    display:flex;
    gap:30px;
    margin:20px 0;
    flex-wrap:wrap;
}

.about-stats .stat-item h3{
    font-size:30px;
    font-weight:700;
    margin-bottom:5px;
    color: var(--blue);
}

.about-stats .stat-item p{
    margin:0;
    font-size:15px;
    color:#666;
}

.logo a img {
    max-width: 210px;
}

.about-img-slider {
    width: 100%;
}

.about-img-slider img {
    width: 100%;
    display: block;
    border-radius: 0;
}

.about-img-slider .slick-dots {
    bottom: 15px;
}

.about-img-slider .slick-prev,
.about-img-slider .slick-next {
    z-index: 2;
}

.about-img-slider .slick-prev {
    left: 15px;
}

.about-img-slider .slick-next {
    right: 15px;
}



.story-card p {
    max-height: 4.5em;
    line-height: 1.5em;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
}

/* Small scrollbar */
.story-card p::-webkit-scrollbar {
    width: 4px;
}

/* .story-card p::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
} */

.story-card p::-webkit-scrollbar-thumb {
    background: #999;
    border-radius: 10px;
}

/* .story-card p::-webkit-scrollbar-thumb:hover {
    background: #666;
} */


.contact-form h3 {
    color: #fff;
    margin-bottom: 10px;
}

.form-description {
    color: #fff;
}

/* Phone + Preferred Time Side by Side */
.contact-form .form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
    width: 100%;
}

.contact-form label {
    color: #fff;
    font-size: 15px;
	margin-bottom: 3px;
	display: block;
    font-weight: 400;
}

.form-note {
    color: #fff;
    margin-top: 10px;
}

.contact-form .form-row .form-group {
    width: 50%;
    margin: 0;
}


/* Jewellery Select */
.contact-form select {
	width: 100%;
	padding: 10px;
	border: 1px solid rgba(255, 255, 255, 0.35);
	border-radius: 0;
	background: transparent;
	color: #fff;
	font-size: 14px;
	outline: none;
	cursor: pointer;
	appearance: auto;
}

.contact-form select:focus {
    border-color: rgba(255, 255, 255, 0.7);
}


/* Dropdown Options */
.contact-form select option {
    background: #fff;
    color: #222;
    padding: 10px;
}


/* Mobile */
@media (max-width: 767px) {

    .contact-form .form-row {
        flex-direction: column;
        gap: 10px;
    }
    
    .contact-form .form-row {
        margin-bottom: 10px;
    }

    .contact-form .form-row .form-group {
        width: 100%;
    }

}


/* =========================
   COLLECTION TABS
========================= */

.collections-tabs {
    margin-top: 20px;
}

.collection-tab-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 45px;
    margin-bottom: 30px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.collection-tab-btn {
    position: relative;
    border: 0;
    background: transparent;
    padding: 0 0 15px;
    font-family: "Cormorant Garamond", serif;
    font-size: 20px;
    font-weight: 500;
    text-transform: uppercase;
    color: #777;
    cursor: pointer;
    transition: all 0.3s ease;
}

.collection-tab-btn:hover {
    color: #111;
}

.collection-tab-btn.active {
    color: #111;
}

.collection-tab-btn.active::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 2px;
    background: #111;
}


/* =========================
   TAB CONTENT
========================= */

.collection-tab-content {
    display: none;
}

.collection-tab-content.active {
    display: block;
}


/* =========================
   SLICK SLIDER
========================= */

.collection-slider {
    margin: 0 -10px;
}

.collection-slide {
    padding: 0 10px;
}

.collection-slide img {
    display: block;
    width: 100%;
    /*height: 420px;*/
    object-fit: cover;
}


/* =========================
   SLICK ARROWS
========================= */

.collection-slider .slick-prev,
.collection-slider .slick-next {
    z-index: 5;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.15);
}

.collection-slider .slick-prev {
    left: 15px;
}

.collection-slider .slick-next {
    right: 15px;
}

.collection-slider .slick-prev:before,
.collection-slider .slick-next:before {
    color: #bc9e68;
    font-size: 20px;
    opacity: 1;
}


/* =========================
   DOTS
========================= */

.collection-slider .slick-dots {
    bottom: -35px;
}

.collection-slider .slick-dots li button:before {
    font-size: 8px;
}


/* =========================
   TABLET
========================= */

@media (max-width: 991px) {

    .collection-tab-buttons {
        gap: 25px;
    }

    .collection-tab-btn {
        font-size: 18px;
    }



}


/* =========================
   MOBILE
========================= */

@media (max-width: 767px) {

    .collection-tab-buttons {
        justify-content: flex-start;
        gap: 25px;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 0;
        margin-bottom: 15px;
    }

    .collection-tab-buttons::-webkit-scrollbar {
        display: none;
    }

    .collection-tab-btn {
        flex-shrink: 0;
        font-size: 16px;
    }

    .collection-slide {
        padding: 0 6px;
    }

    .collection-slider {
        margin: 0 -6px;
    }



    .collection-slider .slick-prev,
    .collection-slider .slick-next {
        width: 35px;
        height: 35px;
    }

}




