.offer-popup .modal-dialog{
    max-width: 750px;
}

.offer-popup .modal-body img{
    width: 100%;
}

.offer-popup .modal-content{
    background: unset;
    border: 0;
}

.offer-popup .modal-header{
    border: 0;
    padding: 0;
    margin-bottom: 10px;
}

.offer-popup .modal-header button{
    filter: brightness(0) invert(1);
    box-shadow: unset;
    outline: none;
}

.offer-popup .modal-body{
    padding: 0;
}

/* --------------------------------------------------------
2. 					Start slider CSS
-----------------------------------------------------------*/
.main_slider_area{
	font-family: "Playfair Display",serif;
	padding-bottom: 90px;
	position: relative;
}

/* Slider button link styling */
.carousel-caption-inner .slider-btn-link {
	transition: all 0.3s ease;
}

/* Mobile responsive styles for slider button */
@media only screen and (max-width: 767px) {
	.carousel-caption-inner {
		padding: 5px !important;
	}
	
	.carousel-caption-inner .slider-btn-link {
		font-size: 14px !important;
		padding: 5px 18px !important;
	}
}

@media only screen and (max-width: 479px) {
	.carousel-caption-inner {
		padding: 4px !important;
	}
	
	.carousel-caption-inner .slider-btn-link {
		font-size: 12px !important;
		padding: 4px 14px !important;
	}
}



/* --------------------------------------------------------
 					end slider CSS
-----------------------------------------------------------*/
.slider-img{
height:500px;
object-fit:cover;
}

/* content base */
.slider-content{
position:absolute;
top:50%;
transform:translateY(-50%);
color:#fff;
max-width:900px;
}

/* left slide */
.left-content{
left:8%;
text-align:left;
}

/* right slide */
.right-content{
right:8%;
text-align:right;
}

/* yellow button */
.btn-yellow{
background:#ffc107;
color:#fff; /* button text white */
padding:12px 28px;
font-weight:600;
border-radius:5px;
}

/* animations */
.animate-title{
animation:slideUp 1s ease;
font-size:42px;
}

.animate-text{
animation:slideUp 1.3s ease;
font-size:20px;
}

.animate-btn{
animation:slideUp 1.6s ease;
}

@keyframes slideUp{
from{
opacity:0;
transform:translateY(40px);
}
to{
opacity:1;
transform:translateY(0);
}
}

/* Mobile */
@media (max-width:768px){

.slider-img{
height:300px;
}

.slider-content{
left:20px;
right:20px;
text-align:left;
}

/* decrease text size */
.animate-title{
font-size:20px;
}

.animate-text{
font-size:13px;
}

.btn-yellow{
padding:8px 18px;
font-size:12px;
}

}


/* Mobile View */
@media (max-width: 768px) {

  .work-section .work-step-card .step-icon {
    background-color: #F0F0F0;
    border-radius: 100%;
    max-width: 90px;
    min-width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
  }

  .work-section .work-step-card .step-icon img {
    max-width: 45px;
    height: auto;
  }

  .work-section .work-step-card span {
    font-size: 12px;
  }

  .work-section .work-step-card h4 {
    font-size: 16px;
  }

  .work-section .work-step-card p {
    font-size: 13px;
    line-height: 1.5;
  }

}




/* GOA DMC SECTION  */
:root {
    --tf-orange: #F26522;
    --tf-cyan: #29ABE2;
    --tf-black: #1C1C1C;
    --tf-white: #FFFFFF;
  }

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

  .tf-slider-section {
    background: #fff;
    padding: 60px 0 50px;
    overflow: hidden;
    font-family: 'Poppins', sans-serif;
    width: 100%;
  }

  /* ── HEADER ── */
  .tf-slider-header {
    text-align: center;
    margin-bottom: 40px;
    padding: 0 20px;
  }

  .tf-slider-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--tf-orange);
    font-weight: 600;
    margin-bottom: 10px;
  }

  .tf-slider-eyebrow::before,
  .tf-slider-eyebrow::after {
    content: '';
    width: 30px;
    height: 2px;
    background: var(--tf-orange);
    border-radius: 2px;
  }

  .tf-slider-heading {
    font-family: 'Playfair Display', serif;
    font-size: clamp(24px, 4vw, 44px);
    color: var(--tf-black);
    line-height: 1.2;
  }

  .tf-hl-orange { color: var(--tf-orange); }
  .tf-hl-cyan   { color: var(--tf-cyan); }

  /* ── INFINITE SLIDER WRAPPER ── */
  .tf-slider-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
  }

  /* The belt — holds original + 2 cloned sets for seamless loop */
  .tf-slider-belt {
    display: flex;
    gap: 20px;
    width: max-content;
    will-change: transform;
  }

  /* ── CARD BASE ── */
  .tf-card {
    flex-shrink: 0;
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 6px 28px rgba(0,0,0,0.11);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    /* width set via JS / media */
  }

  .tf-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 44px rgba(0,0,0,0.17);
  }

  .tf-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    inset: 0;
    transition: transform 0.6s ease;
  }

  .tf-card:hover .tf-card-img { transform: scale(1.06); }

  /* ── TEXT CARD ── */
  .tf-card--text {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 30px 24px;
    min-height: 380px;
  }

  .tf-color-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
  }

  .tf-bg-orange .tf-color-overlay {
    background: linear-gradient(155deg, rgba(242,101,34,0.83) 0%, rgba(200,55,10,0.94) 100%);
  }

  .tf-bg-cyan .tf-color-overlay {
    background: linear-gradient(155deg, rgba(41,171,226,0.83) 0%, rgba(15,120,175,0.94) 100%);
  }

  .tf-card-content {
    position: relative;
    z-index: 2;
  }

  .tf-txt-icon {
    font-size: 34px;
    margin-bottom: 12px;
    display: block;
  }

  .tf-txt-tag {
    display: inline-block;
    font-size: 9px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.92);
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 30px;
    padding: 4px 11px;
    margin-bottom: 11px;
    font-weight: 500;
  }

  .tf-txt-title {
    font-family: 'Playfair Display', serif;
    font-size: 20px;
    color: #fff;
    margin: 0 0 9px;
    line-height: 1.25;
  }

  .tf-txt-desc {
    font-size: 12.5px;
    color: rgba(255,255,255,0.88);
    line-height: 1.6;
  }

  /* ── IMAGE CARD ── */
  .tf-card--image {
    min-height: 420px;
  }

  .tf-img-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(to top,
      rgba(8,18,28,0.90) 0%,
      rgba(8,18,28,0.10) 52%,
      transparent 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 28px 24px;
  }

  .tf-img-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 9px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #fff;
    border-radius: 30px;
    padding: 5px 13px;
    margin-bottom: 11px;
    width: fit-content;
    font-weight: 600;
  }

  .tf-badge-orange { background: var(--tf-orange); }
  .tf-badge-cyan   { background: var(--tf-cyan); }

  .tf-img-title {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    color: #fff;
    line-height: 1.2;
    margin: 0 0 7px;
  }

  .tf-img-desc {
    font-size: 12.5px;
    color: rgba(255,255,255,0.76);
    line-height: 1.5;
  }

  .tf-img-cta {
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
    text-decoration: none;
    width: fit-content;
    padding: 8px 18px;
    border-radius: 30px;
    color: #fff;
    transition: gap 0.2s, opacity 0.2s;
  }

  .tf-cta-orange { background: var(--tf-orange); }
  .tf-cta-cyan   { background: var(--tf-cyan); }
  .tf-img-cta:hover { gap: 13px; opacity: 0.88; }

  /* ── PROGRESS BAR ── */
  .tf-progress-wrap {
    width: 90%;
    max-width: 600px;
    margin: 30px auto 0;
    height: 3px;
    background: #eee;
    border-radius: 3px;
    overflow: hidden;
  }

  .tf-progress-bar {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--tf-orange), var(--tf-cyan));
    border-radius: 3px;
  }

  /* ── NAV ── */
  .tf-slider-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 24px;
  }

  .tf-nav-btn {
    width: 42px; height: 42px;
    border-radius: 50%;
    border: 2px solid var(--tf-orange);
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s;
    color: var(--tf-orange);
  }

  .tf-nav-btn:hover { background: var(--tf-orange); color: #fff; }
  .tf-nav-btn svg { width: 16px; height: 16px; }

  .tf-nav-dots { display: flex; gap: 7px; align-items: center; }

  .tf-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #ddd;
    cursor: pointer;
    transition: all 0.3s;
    border: none; padding: 0;
  }

  .tf-dot.tf-dot--active {
    background: var(--tf-orange);
    width: 22px;
    border-radius: 4px;
  }