:root{
  --tms-black:#0d0d0d;
  --tms-maroon:#6D2732;
  --tms-maroon-dark:#3d1017;
  --tms-cream:#F1E8E0;
  --tms-tan:#D1C7BC;
}
 /* ==========================================================
                "Marketing Agency" section     
 ========================================================== */
   /* ===== Base hero ===== */
.marketingAgency {
     position: relative;
     overflow: hidden;
     padding: clamp(40px, 6vw, 90px) clamp(20px, 5vw, 70px) clamp(50px, 7vw, 90px);
     background-color: #fff;
     height: 100vh;
     display: flex;
     justify-content: center;
     align-items: center;
}

.marketingAgency-video {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     z-index: 0;
}

.marketingAgency-overlay {
     position: absolute;
     inset: 0;
     background: #333030a8;
     z-index: 1;
}

.marketingAgency > .container-fluid {
     position: relative;
     z-index: 2;
}

.marketingAgency-heading {
     margin: 0;
     font-weight: 500;
     font-size: clamp(2.2rem, 5.5vw, 4.6rem);
     line-height: 1.4;
	 color:#fff;
}

.marketingAgency-heading .accent {
     font-size: clamp(2.6rem, 5.5vw, 5rem);
     font-weight: 500;
	 color:#fff;
}

.marketingAgency-chip {
     display: inline-block;
     width: clamp(90px, 35vw, 410px);
     height: clamp(36px, 5.5vw, 75px);
     border-radius: 25px;
     background-size: cover;
     background-position: center;
     vertical-align: middle;
     margin: 0 .12em;
     transform: translateY(-.06em);
}

.marketingAgency-paragraph {
     margin: 0 0 clamp(22px, 3.4vw, 32px);
     font-size: clamp(1rem, 1.4vw, 1.8rem);
     line-height: 1.5;
     color: #fff;
}

.marketingAgency-actions {
     display: flex;
     flex-wrap: wrap;
     gap: 14px;
     justify-content: flex-end;
}

.marketingAgency-btn {
     display: inline-flex;
     align-items: center;
     font-family: 'Helventica-Regular', sans-serif;
     line-height: 100%;
     justify-content: center;
     padding: 18px 35px;
     border-radius: 999px;
     background: #6D2732;
     border: 1px solid #ffffff91;
     color: #fff;
     font-size: 0.8rem;
     font-weight: 600;
     letter-spacing: .6px;
     text-decoration: none;
     white-space: nowrap;
     cursor: pointer;
     position: relative;
     overflow: hidden;
     z-index: 1;
     transition: border-color .3s cubic-bezier(.22, .9, .28, 1), transform .3s cubic-bezier(.22, .9, .28, 1);
}
.marketingAgency-btn::before {
     content: "";
     position: absolute;
     inset: 0;
     background: #fff;
     transform: translateX(-101%);
     transition: transform .4s cubic-bezier(.22, .9, .28, 1);
     z-index: -1;
     border-radius: 999px;
}
 .marketingAgency-btn span,
.marketingAgency-btn {
     transition: color .3s ease .05s, border-color .3s ease, transform .3s cubic-bezier(.22, .9, .28, 1);
}

/* Hover state */
.marketingAgency-btn:hover {
    color: #6D2732;
    transition: color .3s ease .1s;
    border: 1px solid #6D2732;
}

.marketingAgency-btn:hover::before {
     transform: translateX(0);
}
/* ===== Desktop: custom "watch showreel" cursor ===== */
@media (hover: hover) and (pointer: fine) {
     .marketingAgency { cursor: none; }
}

.showreel-cursor {
     position: absolute;
     top: 0;
     left: 0;
     width: 150px;
     height: 150px;
     pointer-events: none;
     transform: translate(-50%, -50%) scale(.85);
     opacity: 0;
     transition: opacity .25s ease, transform .25s ease;
     z-index: 3;
     align-items: center;
     justify-content: center;
     mix-blend-mode: difference;
}

.showreel-cursor.is-active { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.showreel-cursor.is-hidden-btn { opacity: 0; }

.showreel-cursor-ring {
     width: 100%;
     height: 100%;
     animation: showreel-spin 9s linear infinite;
}

@keyframes showreel-spin { to { transform: rotate(360deg); } }

.showreel-cursor-ring text {
     fill: #fff;
     mix-blend-mode: difference;
     font-size: 16px;
	 font-family: 'Helventica-Bold', sans-serif;
     letter-spacing: 2px;
	font-weight:500; 
}

.showreel-cursor-play {
     position: absolute;
     color: #fff;  
     font-size: 18px;
     transform: translateX(2px);
}

/* ===== Mobile / tablet: static rotating badge ===== */
.showreel-tap-hint {
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     width: clamp(96px, 24vw, 130px);
     height: clamp(96px, 24vw, 130px);
     z-index: 3;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     -webkit-tap-highlight-color: transparent;
}

.showreel-tap-hint-ring {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     animation: showreel-spin 9s linear infinite;
}

.showreel-tap-hint-ring text {
     fill: #fff;
     mix-blend-mode: difference;
     font-size: 11.5px;
     letter-spacing: 1.6px;
     text-transform: uppercase;
}

.showreel-tap-icon {
      position: absolute;
     color: #fff;
     mix-blend-mode: difference;
     font-size: 16px;
     transform: translateX(2px);
}

/* ===== Lightbox modal ===== */
.showreel-modal {
     position: fixed;
     inset: 0;
     z-index: 9999;
     display: flex;
     align-items: center;
     justify-content: center;
     opacity: 0;
     visibility: hidden;
     transition: opacity .35s ease;
}

.showreel-modal.is-open { opacity: 1; visibility: visible; }

.showreel-modal-backdrop {
     position: absolute;
     inset: 0;
     background: rgba(0, 0, 0, .9);
}

.showreel-modal-inner {
     position: relative;
     width: min(1100px, 92vw);
     aspect-ratio: 16 / 9;
     z-index: 1;
}

.showreel-modal-inner video {
     width: 100%;
     height: 100%;
     object-fit: contain;
     background: #000;
	 border-radius: 30px;
}

.showreel-modal-close {
     position: absolute;
     top: 24px;
     right: 24px;
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: rgb(2 2 2 / 35%);
     color: #fff;
     border: none;
     font-size: 26px;
     line-height: 1;
     cursor: pointer;
     z-index: 2;
     transition: background .25s ease;
}

.showreel-modal-close:hover { background: rgba(255, 255, 255, .22); }

/* ===== Responsive ===== */
@media (max-width:1445px) {
     .marketingAgency-chip {
          width: clamp(249px, 27vw, 410px);
          height: clamp(45px, 5.5vw, 75px);
     }
}

@media (max-width: 991.98px) {
     .marketingAgency {
          height: auto;
          min-height: 100vh;
          padding-top: clamp(100px, 18vh, 160px);
     }
     .showreel-tap-hint {
          top: clamp(60px, 12vh, 100px);
          transform: translateX(-50%);
     }
}

@media (max-width: 767.98px) {
	.marketingAgency {
          height: auto;
          min-height: 90vh;
	}
     .showreel-modal-inner {
        width: 90vw;
        aspect-ratio: auto;
        height: 72dvh;
        display: flex;
        align-items: center;
     }
     .showreel-modal-inner video {
          object-fit: cover;
          max-height: 100dvh;
     }
     .showreel-modal-close {
          top: 16px;
          right: 16px;
          width: 40px;
          height: 40px;
          font-size: 22px;
     }
}

@media (max-width: 700px) {
     .marketingAgency-actions {
          flex-direction: column;
          align-items: stretch;
     }
     .marketingAgency-btn {
          width: 100%;
     }
}

@media (max-width: 575.98px) {
     .showreel-tap-hint {
          top: clamp(50px, 10vh, 80px);
          width: 90px;
          height: 90px;
     }
     .showreel-tap-hint-ring text {
          font-size: 10px;
          letter-spacing: 1.2px;
     }
}

@media (max-width: 425px) {
     .marketingAgency {
          padding: clamp(40px, 6vw, 90px) clamp(5px, 1vw, 70px) clamp(50px, 7vw, 90px);
     }
     .marketingAgency-chip {
          width: 80%;
     }
}
 /* ==========================================================
                "Marketing Agency" section     
 ========================================================== */

 /* ==========================================================
                "What We Do" section     
 ========================================================== */

.what-we-do-section{ background:#fff; }

.what-we-do{
  margin:0 auto;
  padding:clamp(2.5rem, 6vw, 4.5rem) clamp(1.25rem, 4vw, 2rem);
}

.what-we-do .what-we-do-title{
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 120%;
  font-weight: 500;
}
.what-we-do .what-we-do-title .accent{
  font-size: clamp(2.3rem, 4vw, 3.3rem);
  font-weight: 500;
}

.wwd-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(1rem, 2vw, 1.5rem);
}

.wwd-tile{
  position:relative;
  border-radius:10px;
  border: 1px solid #6D2732;
  overflow:hidden;
  min-height:clamp(190px, 20vw, 240px);
  padding:clamp(1.25rem, 2.2vw, 2rem);
  display:flex;
  flex-direction:column;
  justify-content:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  isolation:isolate;
}

.wwd-tile:nth-child(odd){ background:var(--tms-cream); }
.wwd-tile:nth-child(even){ background:var(--tms-tan); }

.wwd-tile-heading{
  position:relative;
  z-index:2;
  margin:0 0 1rem;
  font-weight: 400;
  font-size: clamp(25px, 3vw, 34px);
  color: #000;
  transition:color .35s ease;
}

.wwd-tile-para{
  position:relative;
  z-index:2;
  margin:0;
  font-size: clamp(15px, 2vw, 18px);
  color: #000;
  transition:color .35s ease, opacity .35s ease;
}

.wwd-tile::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:var(--tile-bg);
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.06);
  transition:opacity .5s ease, transform .6s ease;
}

.wwd-tile::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background: rgba(109, 39, 50, 0.76);
  opacity:0;
  transition:opacity .5s ease;
}

.wwd-tile:hover,
.wwd-tile.is-active{
  box-shadow:0 16px 34px rgba(0,0,0,.22);
}

.wwd-tile:hover::before,
.wwd-tile:hover::after,
.wwd-tile.is-active::before,
.wwd-tile.is-active::after{
  opacity:1;
  transform:scale(1);
}

.wwd-tile:hover .wwd-tile-heading,
.wwd-tile:hover .wwd-tile-para,
.wwd-tile.is-active .wwd-tile-heading,
.wwd-tile.is-active .wwd-tile-para{
  color:#fff;
}

@media (max-width:1300px){
  .wwd-tile-heading {
    font-size: clamp(24px, 4vw, 30px);
  }
  .wwd-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:1024px){

}

@media (max-width:575.98px){
	
  .wwd-grid{ grid-template-columns:1fr; }
  .wwd-tile{ min-height:170px; }
}

 /* ==========================================================
                "What We Do" section     
 ========================================================== */



 /* ==========================================================
                "Why Businesses Choose Us" section         
 ========================================================== */

 .why-business-choose {
     position: relative;
     background-image: url('../images/home-nested/why-choose-bg.webp');
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     padding: 56px 20px 80px;
     overflow: hidden;
 }

 .why-business-choose .why-business-title {
     font-size: clamp(2rem, 4vw, 3rem);
     line-height: 120%;
     font-weight: 500;
 }

 .why-business-choose .why-business-title .accent {
     font-size: clamp(2.3rem, 4vw, 3.3rem);
     font-weight: 500;
 }

 .why-business-tiles { 
     margin: 0 auto;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     align-items: flex-start;
     gap: 15px; 
 }

 .business-tile {
     position: relative;
     width: 340px;
     height: 240px;
     border-radius: 15px;
     overflow: hidden;
     cursor: pointer;
     box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
     -webkit-tap-highlight-color: transparent;
     transition: height .55s cubic-bezier(.22, .9, .28, 1);
 }

 /* Grows taller on reveal — width stays fixed at 323px */
/*  .business-tile:hover,
 .business-tile.is-active {
     height: 380px;
 } */

 .business-tile .bg {
     position: absolute;
     inset: 0;
     background-size: cover;
     background-position: center;
     transition: opacity .5s cubic-bezier(.22, .9, .28, 1), transform .6s cubic-bezier(.22, .9, .28, 1);
 }

 .business-tile .overlay {
     position: absolute;
     inset: 0;
     background: #6D2732;
     opacity: 0;
     transform: translateY(6px);
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 24px;
     transition: opacity .4s cubic-bezier(.22, .9, .28, 1) .2s, transform .4s cubic-bezier(.22, .9, .28, 1) .2s;
 }

 .business-tile .overlay h3 {
     margin: 0;
     color: #fff;
     font-size: clamp(20px, 3vw, 25px);
     line-height: 120%;
	 padding-bottom: 15px; 
     font-weight: 700;
 }

 .business-tile .overlay p {
     margin: 0;
     color: #fff;
     font-size: clamp(12px, 1.8vw, 15px);
     line-height: 1.3;
 }

 /* Hover (desktop) and .is-active (touch) both trigger the swap */
 .business-tile:hover .bg,
 .business-tile.is-active .bg {
     opacity: 0;
     transform: scale(1.06);
 }

 .business-tile:hover .overlay,
 .business-tile.is-active .overlay {
     opacity: 1;
     transform: translateY(0);
 }
 @media (max-width:1500px) {
     .business-tile {
         width: 300px;
         height: 240px;
     }
 }
 @media (max-width:1420px) {
     .business-tile {
         width: 300px;
         height: 240px;
     }
 }

 @media (max-width:1300px) {
     .business-tile .overlay h3 {
          font-size: clamp(20px, 3vw, 22px);
     }
  
     .business-tile {
          width: 260px;
          height: 200px;
     }
 }

 @media (max-width:1150px) {
     .business-tile .overlay h3 {
          font-size: clamp(20px, 3vw, 21px);
     } 
     .why-business-choose {
          padding: 40px 20px 40px;
     } 
     .business-tile {
          width: 230px;
          height: 190px;
     }
 }

 @media (max-width:1040px) {

     .why-business-tiles {
         flex-direction: row;
         align-items: stretch;
         gap: 18px;
     }

     .business-tile,
     .business-tile:hover,
     .business-tile.is-active {
         width: 100%;
         max-width: 380px;
         height: 300px;
         display: flex;
         flex-direction: column;
         transition: none;
     }

     .business-tile .bg,
     .business-tile:hover .bg,
     .business-tile.is-active .bg {
         position: static;
         width: 100%;
         height: 190px;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
     }

     .business-tile .overlay,
     .business-tile:hover .overlay,
     .business-tile.is-active .overlay {
         min-height: 160px;
         position: static;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
         padding: 18px 20px 22px;
         gap: 8px;
     }

     .business-tile .overlay {
         justify-content: center;
     }

     .business-tile .overlay h3 {
         font-size: 20px;
		 padding-bottom: 5px;
     }

     .business-tile .overlay p {
         font-size: 15px;
     }
 }


 @media (max-width:990px) {
     .business-tile {
         width: calc(50% - 8px);
     }

     .why-business-tiles {
         flex-direction: row;
         align-items: stretch;
         gap: 18px;
     }

     .business-tile .overlay,
     .business-tile:hover .overlay,
     .business-tile.is-active .overlay {
         min-height: 180px;
         position: static;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
         padding: 18px 20px 22px;
         gap: 8px;
     }

     .business-tile,
     .business-tile:hover,
     .business-tile.is-active {
         width: 100%;
         max-width: 350px;
         height: 360px;
         display: flex;
         flex-direction: column;
         transition: none;
     }

     .business-tile .bg,
     .business-tile:hover .bg,
     .business-tile.is-active .bg {
         position: static;
         width: 100%;
         height: 190px;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
     }

     .business-tile .overlay,
     .business-tile:hover .overlay,
     .business-tile.is-active .overlay {
         position: static;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
         padding: 18px 20px 22px;
         gap: 8px;
     }

     .business-tile .overlay h3 {
         font-size: 20px;
     }

     .business-tile .overlay p {
         font-size: 15px;
     }
 }

 @media (max-width:768px) {

     .business-tile,
     .business-tile:hover,
     .business-tile.is-active {
         width: 100%;
         max-width: 420px;
         height: 350px;
         display: flex;
         flex-direction: column;
         transition: none;
     }

     .business-tile .bg,
     .business-tile:hover .bg,
     .business-tile.is-active .bg {
         position: static;
         width: 100%;
         height: 190px;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
     }

     .business-tile .overlay,
     .business-tile:hover .overlay,
     .business-tile.is-active .overlay {
         position: static;
         opacity: 1 !important;
         transform: none !important;
         transition: none;
         padding: 18px 20px 22px;
         gap: 8px;
     }

 }

 /* ---- Guard the badge against the heading on narrow screens ---- */
 @media (max-width:480px) {
     .why-business-choose {
         padding: 40px 20px 40px;
     }

     .why-business-title {
         margin-bottom: 28px;
     }
 }

 /* ==========================================================
                "Why Businesses Choose Us" section         
 ========================================================== */

 /* ==========================================================
                "Creative Services" section
    ========================================================== */

 .creative-services {
     width: 100%;
     padding: 60px 6vw;
     background: #fff;
     overflow: hidden;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .services-container {
     width: 100%;
     max-width: 1100px;
     margin: 0 auto;
 }


 /* -------------------------
   Heading
------------------------- */

 .services-heading {
     font-size: clamp(1.9rem, 4vw, 2.9rem);
     line-height: 120%;
     font-weight: 500;
 }

 .services-heading .accent {
     font-size: clamp(2.3rem, 5vw, 3.6rem);
     font-weight: 500;
 }


 /* -------------------------
   Main Layout
------------------------- */

 .services-content {
     display: grid;
     grid-template-columns: 370px minmax(300px, 1fr);
     gap: 10px;
     align-items: start;
 }


 /* -------------------------
   Tabs
------------------------- */

 .service-tabs {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     gap: 15px;
 }

 .service-tab {
     position: relative;
     width: 100%;
     min-height: 40px;
     padding: 0 0 0 0;
     margin: 0;
     border: 0;
     background: transparent;
     text-align: left;
     cursor: pointer;
     color: #AA9D8E;
     font-weight: 300;
     transition:
         color 0.3s ease,
         padding 0.3s ease;
 }

 .service-tab+.service-tab {
     margin-top: 7px;
 }

 .service-tab::before {
     content: "";
     position: absolute;
     left: 0;
     top: 50%;
     width: 4px;
     height: 0;
     background: #111;
     transform: translateY(-50%);
     transition: height 0.3s ease;
 }

 .service-tab span {
     font-size: clamp(1rem, 3vw, 1.2rem);
     display: block;
     padding: 8px 0;
     transition: transform 0.3s ease;
     font-family: 'Helventica-Regular', sans-serif;
 }

 .service-tab.active {
     color: #111;
     font-weight: 700;
 }

 .service-tab.active::before {
     height: 100%;
 }

 .service-tab.active span {
     transform: translateX(15px);
     font-size: clamp(1.1rem, 3vw, 1.35rem);
     font-family: 'Helventica-Bold', sans-serif;
 }
.service-tab:hover::before {
     height: 100%;
 }
 .service-tab:hover {
     color: #111;
     font-weight: 700;
 }
.service-tab:hover span {
     transform: translateX(15px);
     font-size: clamp(1.1rem, 3vw, 1.35rem);
     font-family: 'Helventica-Bold', sans-serif;
 }

 /* -------------------------
   Vertical Image Slider
------------------------- */

 .services-slider {
     position: relative;
     width: 100%;
     height: 630px;
     overflow: hidden;
     border-radius: 8px;
 }

 .slider-track {
     width: 100%;
     transition: transform 0.7s cubic-bezier(.77, 0, .18, 1);
 }

 .service-slide {
     position: relative;
     width: 100%;
     height: 630px;
     flex-shrink: 0;
     overflow: hidden;
     border-radius: 15px;
 }

 .service-slide img {
     display: block;
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

.service-slide-btn {
     position: absolute;
	overflow:hidden;
     left: 50%;
     bottom: 40px;
     z-index: 3;
     transform: translate(-50%, 40px);
     opacity: 0;
	  line-height: 100%;
     display: inline-block;
	 border: 1px solid #ffffff91;
     padding: 15px 32px;
     border-radius: 999px;
     background: #6D2732; 
     color: #fff;
     font-size: clamp(12px, 1.5vw, 14px);
     text-decoration: none;
     white-space: nowrap;
     transition: opacity .9s ease .35s, transform .9s ease-in-out .35s;
}
 
.service-slide-btn::before {
     content: "";
     position: absolute;
     inset: 0;
     background: #fff;
     transform: translateX(-100%);
     transition: transform .4s ease;
     z-index: -1;
     border-radius: 999px;
}
.service-slide.is-current .service-slide-btn:hover {
     color: #6D2732;
     transition: color .3s ease .1s;
	 border: 1px solid #6D2732;
}
.service-slide.is-current .service-slide-btn:hover::before {
     transform: translateX(0);
}
.service-slide.is-current .service-slide-btn {
     opacity: 1;
     transform: translate(-50%, 0);
	 text-transform: uppercase;
}
 /* Overlay - optional */

 .slide-overlay {
     position: absolute;
     left: 30px;
     bottom: 25px;
     color: white;
     z-index: 2;
     text-shadow: 0 2px 10px rgba(0, 0, 0, .4);
 }

 .slide-overlay h3 {
     margin: 0;
     font-size: 28px;
     line-height: 1;
 }

 .slide-overlay span {
     font-size: 13px;
     letter-spacing: 3px;
 }


 /* Dark gradient */

 .service-slide::after {
     content: "";
     position: absolute;
     inset: 0;
     /* background: linear-gradient(to top,
             rgba(0, 0, 0, .4),
             transparent 45%); */
     pointer-events: none;
 }


 /* -------------------------
   Tablet
------------------------- */
 @media (max-width: 1100px) {
     .services-content {
         grid-template-columns: 340px minmax(300px, 1fr);
     }
 }

 @media (max-width: 900px) {

     .creative-services {
         padding: 45px 5vw;
     }

     .services-content {
         grid-template-columns: 290px minmax(280px, 1fr);
         gap: 0px;
     }

     .service-tab.active span {
         font-size: 18px;
     }

     .service-tab span {
         font-size: 17px;
     }

     .services-slider,
     .service-slide {
         height: 500px;
     }
 }


 /* -------------------------
   Mobile
------------------------- */

 @media (max-width: 650px) {
     .services-heading {
         font-size: clamp(1.83rem, 4vw, 3rem);
     }

     .creative-services {
         padding: 35px 20px 50px;
     }

     .services-heading {
         text-align: left;
         margin-bottom: 30px;
     }

     .services-content {
         display: flex;
         flex-direction: column;
         gap: 25px;
     }


     /* Horizontal scrolling tabs */

     .service-tabs {
         width: calc(100vw - 40px);
         margin-left: 0;
         flex-direction: row;
         gap: 8px;
         overflow-x: auto;
         overflow-y: hidden;
         padding-bottom: 8px;
         scrollbar-width: none;
     }

     .service-tabs::-webkit-scrollbar {
         display: none;
     }

     .service-tab {
         width: auto;
         min-width: max-content;
         min-height: auto;
         padding: 7px 24px;
         border: 1px solid #d8d0ca;
         border-radius: 30px;
         font-size: 13px;
         white-space: nowrap;
     }

     .service-tab+.service-tab {
         margin-top: 0;
     }

     .service-tab::before {
         display: none;
     }

     .service-tab span {
         padding: 0;
     }

     .service-tab.active {
         background: #111;
         color: #fff;
         border-color: #111;
     }

     .service-tab.active span {
         transform: none;
     }


     /* Slider */

     .services-slider {
         height: 390px;
         border-radius: 7px;
     }

     .service-slide {
         height: 390px;
         border-radius: 15px;
     }

     .service-tab.active span {
         font-size: 15px;
     }

     .service-tab span {
         font-size: 15px;
     }
 }


 @media (max-width: 400px) {

     .creative-services {
         padding-left: 15px;
         padding-right: 15px;
     }

     .service-tabs {
         width: calc(100vw - 30px);
     }

     .services-slider,
     .service-slide {
         height: 330px;
     }

 }

 /* ==========================================================
                "Creative Services" section
 ========================================================== */



 /* =========================================
          INDUSTRIES SECTION
=========================================== */

 .industries-section {
     width: 100%;
     padding: 70px 0 80px;
     background: #F1E8E0;
     overflow: hidden;
 }

 .industries-container {
     width: 100%;
     max-width: 1400px;
     margin: 0 auto;
     padding: 0 32px;
 }


 /* =========================================
   HEADING
========================================= */

 .industries-heading {
     text-align: center;
     margin: 0 0 8px;
     font-size: clamp(1.9rem, 4vw, 2.9rem);
     line-height: 120%;
     font-weight: 500;
     color: #000;
 }

 .industries-heading .accent {
     font-size: clamp(2.3rem, 5vw, 3.6rem);
     font-weight: 500;
 }

 .industries-slider-wrapper {
     position: relative;
     width: 100%;
 }

 .industriesSwiper {
     width: 100%;
     overflow: hidden;
 }

 .industriesSwiper .swiper-slide {
     height: auto;
 }

 .industry-card {
     position: relative;
     width: 100%;
     height: 450px;
     overflow: hidden;
     border-radius: 15px;
     background: #fff;
     cursor: pointer;
 }

 .industry-card img {
     display: block;
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.6s ease;
 }

 /* Image zoom on hover */

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

/*  .industry-card:hover .industry-overlay {
     background: linear-gradient(180deg, rgba(50, 45, 42, 0) 0%, #322D2A 100%);
     transition: background 0.5s ease;
 } */

 .industry-overlay {
     position: absolute;
     inset: 0;
     display: flex;
     align-items: flex-end;
     padding: 25px;
     transition: background 0.5s ease;
	  background: linear-gradient(180deg, rgba(50, 45, 42, 0) 0%, #322D2A 100%);
 }


 .industry-content {
     width: 100%;
     transform: translateY(0px);
     transition:
         transform 0.5s cubic-bezier(.25, .8, .25, 1);
 }

 .industry-content .industry-card-heading {
     margin: 0 0 8px;
     color: #fff;
     text-align: center;
     display: block;
     font-size: clamp(19px, 4vw, 23px);
     font-weight: 700;
     line-height: 1.2;
     opacity: 1;
     transform: translateY(0px);
     transition:
         opacity 0.4s ease 0.08s,
         transform 0.4s ease 0.08s;
 }


 /* Description */

 .industry-content p {
     max-width: 270px;
     margin: 0 0 15px;
     color: rgba(255, 255, 255, 0.95);
     font-size: 15px;
     font-weight: 400;
     line-height: 1.45;
     opacity: 1;
     transform: translateY(0px);
     transition:
         opacity 0.4s ease 0.08s,
         transform 0.4s ease 0.08s;
 }


 /* Arrow */

 .industry-arrow {
     display: flex;
     align-items: center;
     justify-content: center;
     width: 43px;
     height: 43px;
     border: 1px solid #fff;
     border-radius: 50%;
     color: #fff;
     font-size: 23px;
     line-height: 1;
     opacity: 1;
     transform: translateY(15px);
     transition:
         opacity 0.4s ease 0.12s,
         transform 0.4s ease 0.12s,
         background 0.3s ease;
 }


 /* =========================================
   HOVER REVEAL
========================================= */

/*  .industry-card:hover .industry-content {
     transform: translateY(0);
 }

 .industry-card:hover .industry-content p,
 .industry-card:hover .industry-arrow,
 .industry-card:hover .industry-card-heading {
     opacity: 1;
     transform: translateY(0);
 }

 .industry-card:hover .industry-arrow:hover {
     background: #fff;
     color: #000;
 } */

 .industry-prev,
 .industry-next {
     position: absolute;
     top: 50%;
     z-index: 20;
     display: flex;
     align-items: center;
     justify-content: center;
     width: 46px;
     height: 46px;
     padding: 0;
     border: 0;
     border-radius: 50%;
     background: #fff;
     color: #000;
     font-size: 22px;
     cursor: pointer;
     box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
     transition:
         background 0.3s ease,
         transform 0.3s ease;
 }

 .industry-prev:hover,
 .industry-next:hover {
     background: #6D2732;
     color: #fff;
 }

 .industry-prev {
     left: -23px;
 }

 .industry-next {
     right: -23px;
 }


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

 .industry-pagination {
     position: relative !important;
     margin-top: 25px;
     bottom: auto !important;
 }

 .industry-pagination .swiper-pagination-bullet {
     width: 10px;
     height: 10px;
     margin: 0 5px !important;
     opacity: 1;
     background: #AA9D8E;
 }

 .industry-pagination .swiper-pagination-bullet-active {
     background: #6D2732;
 }


 /* =========================================
   TABLET
========================================= */

 @media (max-width: 991px) {

     .industries-section {
         padding: 60px 0;
     }

     .industries-container {
         padding: 0 45px;
     }

     .industry-card {
         height: 420px;
     }

     .industry-prev {
         left: -20px;
     }

     .industry-next {
         right: -20px;
     }
 }


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

 @media (max-width: 767px) {

     .industries-section {
         padding: 50px 0 50px;
     }

     .industries-container {
         padding: 0 20px;
     }

     .industries-heading {
         margin-bottom: 28px;
     }

     /* 
     .industries-heading h2 {
         font-size: 30px;
     }

     .industries-heading h3 {
         font-size: 19px;
     } */


     /* One card on mobile */

     .industry-card {
         height: 390px;
         border-radius: 15px;
     }

     .industry-overlay {
         padding: 22px;
     }

     .industry-content .industry-card-heading {
         opacity: 1;
         transform: translateY(0px);
     }

     .industry-overlay {
         background: linear-gradient(180deg, rgba(50, 45, 42, 0) 0%, #322D2A 100%);
     }

     .industry-content {
         transform: translateY(0);
     }

     /* .industry-content h3 {
         font-size: 22px;
     } */
     .industry-content p {
         font-size: 14px;
         opacity: 1;
         transform: translateY(0);
     }

     .industry-arrow {
         opacity: 1;
         transform: translateY(0);
     }

     .industry-prev,
     .industry-next {
         display: none;
     }

     .industry-pagination {
         margin-top: 20px;
     }
 }


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

 @media (max-width: 480px) {

     .industries-container {
         padding: 0 15px;
     }

     .industry-card {
         height: 350px;
     }

     .industries-heading h2 {
         font-size: 27px;
     }

     .industries-heading h3 {
         font-size: 17px;
     }
 }

 /* ==================================================
               INDUSTRIES SECTION
=================================================== */


 /* ==========================================================
                "Serving Businesses" section
    ========================================================== */
 .serving-swiper .swiper-slide{
     position: relative;
}
 .serving-section {
     width: 100%;
     padding: 110px 0 110px;
     overflow: hidden;
     background-color: #fff;
 }
 .serving-heading {
     color: #000;
     padding: 0 15px;
     font-size: clamp(1.9rem, 4vw, 2.9rem);
     line-height: 120%;
     font-weight: 500; 
 }

 .serving-heading .accent {
     font-size: clamp(2.3rem, 5vw, 3.6rem);
     font-weight: 400;
 }

 .serving-swiper {
     width: 100%;
     position: relative;
 }

.serving-card-title{
     margin: 0 0 14px;
     font-size: clamp(1.4rem, 2.4vw, 2rem);
     font-weight: 700;
     line-height: 1.2;
     letter-spacing: .3px;
}

.serving-card-text{
     margin: 0 0 24px;
     font-size: clamp(.85rem, 1.1vw, .95rem);
     line-height: 1.4;
     color: rgba(255,255,255,.9);
}

 .serving-slide-img {
     width: 100%;
     height: clamp(550px, 55vw, 720px);
     object-fit: cover;
     display: block;
 }
.serving-card{
	 display: flex;
    flex-direction: column;
    justify-content: center;
     position: absolute;
	 width: clamp(450px, 35vw, 500px);
     top: 50%;
     right: 6%; 
     max-width: 100%; 
	 height:470px;
     padding: clamp(24px, 2.6vw, 36px) clamp(22px, 2.4vw, 32px);
     border-radius: 12px;
     background: linear-gradient(155deg, rgba(96,32,44,.55), rgba(52,18,26,.65));
     backdrop-filter: blur(8px);
     -webkit-backdrop-filter: blur(8px);
     color: #fff;  
     opacity: 0;
     transform: translate(40px, -50%);
     transition: opacity .7s ease, transform .7s ease;
     transition-delay: 0s;
}
 
.serving-swiper .swiper-slide-active .serving-card{
     opacity: 1;
     transform: translate(0, -50%);
     transition-delay: .35s;
}

.serving-card-btn {
    position: relative;
    overflow: hidden;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: max-content;
    padding: 13px 25px;
    line-height: 100%;
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 999px;
    color: #fff;
    text-decoration: none;
    font-size: clamp(11px, 1.4vw, 13px);
    font-weight: 600;
    letter-spacing: .6px;
    transition: color .3s ease .1s, border-color .25s ease;
} 
.serving-card-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #fff;
    transform: translateX(-101%);
    transition: transform .4s ease;
    z-index: -1;
    border-radius: 999px;
} 
.serving-card-btn:hover {
     color: #6D2732;
    border-color: #6D2732;
} 
.serving-card-btn:hover::before {
    transform: translateX(0);
} 
.serving-card-btn:hover svg path {
    fill: #6D2732;
}
@media (max-width:1200px){
	.serving-card{
		height:400px;
	}
}
/* Tablet */
@media (max-width: 991px){
     .serving-card{
         right: 5%;
         padding:40px 22px;
		 width: clamp(350px, 32vw, 412px);
     }
}

/* Mobile — overlay doesn't have room beside the image, so it sits
   as a bottom band across the slide instead of floating on the right */
@media (max-width: 575px){
     .serving-card{
          top: auto;
          bottom: 16px;
          right: 16px;
          left: 16px;
          width: auto;
          max-width: none;
          transform: translateY(24px);
          padding: 45px 20px;
     }

     .serving-swiper .swiper-slide-active .serving-card{
          transform: translateY(0);
     }

     .serving-card-text{
          margin-bottom: 16px;
     }
}

 /* ==========================================================
                "Serving Businesses" section
    ========================================================== */




 /* ==========================================================
                "Why Choose Us" section
    ========================================================== */
 .why-choose-section {
     background: #D9D9D9;
     width: 100%;
     padding: 110px 0px 110px;
 }

 .why-choose-heading {
     font-size: clamp(1.9rem, 4vw, 2.9rem);
     line-height: 120%;
     font-weight: 500;
 }

 .why-choose-heading .accent {
     font-size: clamp(2.3rem, 5vw, 3.6rem);
     font-weight: 400;
 }

 .why-choose-text {
     font-size: clamp(0.95rem, 2vw, 1.2rem);
     line-height: 1.7;
     max-width: 480px;
 }

 .why-choose-container {
     gap: 10rem;
 }

 /* Framed image treatment — rounded corners + soft border like a photo card */
 .why-choose-imgWrap {
     overflow: hidden;
     aspect-ratio: 4 / 4;
 }

 .why-choose-imgWrap img {
     object-fit: cover;
 }

 @media (max-width: 1199px) {
     .why-choose-container {
         gap: 5rem;
     }
 }

 /* Tablet */
 @media (max-width: 991px) {
     .why-choose-container {
         gap: 0rem;
     }

     .why-choose-section {
         padding: 90px 3px 90px;
     }

     .why-choose-text {
         max-width: 100%;
     }

     .why-choose-imgWrap {
         aspect-ratio: 16 / 10;
     }
 }

 /* Mobile */
 @media (max-width: 575px) {
     .why-choose-section {
         padding: 50px 3px 50px;
     }

     .why-choose-heading {
         text-align: center;
     }

     .why-choose-imgWrap {
         aspect-ratio: 4 / 5;
     }
 }


 /* ==========================================================
                "Why Choose Us" section
    ========================================================== */


 /* ==========================================================
                "Case Studies" section
    ========================================================== */
  .case-studies-section {
     background: #fff;
     width: 100%;
     padding: 110px 0px 110px;
}

#case-studies .case-studies-heading {
     font-size: clamp(1.9rem, 4vw, 2.9rem);
     line-height: 120%;
     font-weight: 500;
}

#case-studies .case-studies-heading .accent {
     font-size: clamp(2.3rem, 5vw, 3.6rem);
     font-weight: 400;
}

#case-studies .case-studies-stage {
     position: relative;
     width: 100%;
     border-radius: 20px;
     overflow: hidden;
     height: clamp(360px, 55vw, 750px);
}

#case-studies .case-bg-stack {
     position: absolute;
     inset: 0;
     height: 100%;
     width: 100%;
     overflow: hidden;
}

#case-studies .case-bg-track {
     display: flex;
     height: 100%;
     width: 100%;
     transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);
     will-change: transform;
}

#case-studies .case-bg-slide {
     position: relative;
     flex: 0 0 100%;
     width: 100%;
     height: 100%;
}

#case-studies .case-bg-slide img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
}

#case-studies .case-bg-slide.is-active {
     opacity: 1 !important;
     z-index: 1;
}



#case-studies .case-cards-wrap {
     position: absolute;
     left: 0;
     right: 0;
     bottom: clamp(10px, 10vw, 10px);
     padding: 0 clamp(16px, 3vw, 32px);
     z-index: 5;
}

#case-studies .case-cards-swiper {
     overflow: visible;
     height: 350px;
}

#case-studies .case-cards-swiper .swiper-wrapper {
     padding-bottom: 10px;
     align-items: center;
}



#case-studies .case-card {
     padding: 20px;
     position: relative;
     height: clamp(44px, 15vw, 200px);
     width: clamp(140px, 15vw, 200px);
     background: rgba(217, 217, 217, 0.45);
     border: 0.801251px solid #FFFFFF;
     backdrop-filter: blur(18.0281px);
     border-radius: 12.0188px;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     overflow: hidden;
     transition: height 0.45s cubic-bezier(0.4, 0, 0.2, 1),
         width 0.45s cubic-bezier(0.4, 0, 0.2, 1),
         background 0.4s ease,
         border-color 0.4s ease;
}

#case-studies .case-card.is-active {
     width: min(78%, calc(100% - 32px));
     height: clamp(190px, 28vw, 220px);
     background: rgba(109, 39, 50, 0.47);
     backdrop-filter: blur(12.4px);
     justify-content: flex-start;
     align-items: center;
     border: 0px solid #FFFFFF;
     padding: 22px 28px;
}

#case-studies .case-card-logo {
     padding: 10px 20px 10px 20px;
     max-width: 100%;
     max-height: 110px;
     object-fit: contain;
     position: absolute;
     transition: opacity 0.3s ease, max-height 0.4s ease;
}

#case-studies .logo-black {
     opacity: 0;
}

#case-studies .logo-white {
     opacity: 1;
}

#case-studies .case-card.is-active .logo-white {
     opacity: 0;
}

#case-studies .case-card.is-active .logo-black {
     opacity: 1;
     cursor: pointer;
}
#case-studies .case-card:nth-child(8) .case-card-logo { max-height: 160px; }

#case-studies .case-card:nth-child(1).is-active .case-card-logo { max-height: 55px; }
#case-studies .case-card:nth-child(2).is-active .case-card-logo { max-height: 120px; }
#case-studies .case-card:nth-child(3).is-active .case-card-logo { max-height: 110px; }
#case-studies .case-card:nth-child(4).is-active .case-card-logo { max-height: 90px; }
#case-studies .case-card:nth-child(5).is-active .case-card-logo { max-height: 90px; }
#case-studies .case-card:nth-child(6).is-active .case-card-logo { max-height: 100px; }
#case-studies .case-card:nth-child(7).is-active .case-card-logo { max-height: 100px; }
#case-studies .case-card:nth-child(8).is-active .case-card-logo { max-height: 130px; }
#case-studies .case-card:nth-child(9).is-active .case-card-logo { max-height: 100px; }

#case-studies .case-card-body {
     position: absolute;
     left: 14px;
     right: 14px;
     bottom: 16px;
     opacity: 0;
     transform: translateY(8px);
     transition: opacity 0.35s ease 0.15s, transform 0.35s ease 0.15s;
}

#case-studies .case-card-text {
     font-size: clamp(0.9rem, 1.1vw, 1.2rem);
     line-height: 1.4;
     color: #fff;
     margin: 0;
     font-weight: 500;
     padding: 0px 10px 10px 10px;
}


#case-studies .case-card.is-active .case-card-body {
     opacity: 1;
     transform: translateY(0);
}

#case-studies .case-card.is-active::after {
     content: '';
     position: absolute;
     inset: 0;
     border-radius: 12px;
     border: 0px solid rgba(255, 255, 255, 0.9);
     pointer-events: none;
}

/* -------------------------
   Active card layout: logo left, text + button right
------------------------- */

#case-studies .case-card-active-content {
     position: absolute;
     inset: 0;
     display: none;
     align-items: center;
     gap: clamp(16px, 3vw, 32px);
     padding: 20px 24px;
}

#case-studies .case-card.is-active .case-card-active-content {
     display: flex;
}

#case-studies .case-card-active-content .case-card-logo {
     position: static;
     opacity: 1;
     flex: 0 0 auto;
     max-width: clamp(90px, 14vw, 150px);
     padding: 0;
}

#case-studies .case-card.is-active .case-card-body {
     position: static;
     opacity: 1;
     transform: none;
     flex: 1 1 auto;
     display: flex;
     flex-direction: column;
     gap: 14px;
	 justify-content: center;
}

#case-studies .case-card-btn {
    position: relative;
    overflow: hidden;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    line-height: 100%;
    gap: 8px;
    align-self: flex-end;
    padding: 14px 20px;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 999px;
    color: #fff;
    font-size: clamp(11px, 1.4vw, 13px);
    letter-spacing: .04em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: color .3s ease .1s, border-color .3s ease;
}


#case-studies .case-card-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #fff;
    transform: translateX(-101%);
    transition: transform .4s ease;
    z-index: -1;
    border-radius: 999px;
}

#case-studies .case-card-btn:hover {
    color: #6D2732;
    border-color: #6D2732;
}

#case-studies .case-card-btn:hover::before {
    transform: translateX(0);
}

#case-studies .case-card-btn:hover svg path {
    fill: #6D2732;
}
/* -------------------------
   Nav arrows — top right, over the image
------------------------- */

#case-studies .case-nav {
     position: absolute;
     top: clamp(16px, 3vw, 24px);
     width: 38px;
     height: 38px;
     border-radius: 50%;
     background: rgba(109, 39, 50, 0.82);
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     z-index: 6;
     color: #333;
}

#case-studies .case-nav-prev {
     right: 60px;
}

#case-studies .case-nav-next {
     right: 14px;
}

@media (max-width: 991px) {
    #case-studies .case-card:nth-child(2).is-active .case-card-logo { max-height: 100px; }
    #case-studies .case-card:nth-child(3).is-active .case-card-logo { max-height: 90px; }
    #case-studies .case-card:nth-child(4).is-active .case-card-logo { max-height: 70px; }
    #case-studies .case-card:nth-child(5).is-active .case-card-logo { max-height: 60px; }
    #case-studies .case-card:nth-child(6).is-active .case-card-logo { max-height: 80px; }
    #case-studies .case-card:nth-child(7).is-active .case-card-logo { max-height: 80px; }
	#case-studies .case-card:nth-child(8).is-active .case-card-logo { max-height: 140px; }
    #case-studies .case-card:nth-child(9).is-active .case-card-logo { max-height: 100px; }
	
     #case-studies .case-card.is-active .case-card-logo {
         max-height: 40px;
         padding: 0px 10px;
     }

     #case-studies .case-card-text {
         padding: 0px 10px 0px 10px
     }

     .case-studies-section {
         padding: 90px 3px 90px;
     }

     #case-studies .case-studies-stage {
         height: clamp(420px, 70vw, 560px);
     }


     #case-studies .case-card {
         height: clamp(90px, 15vw, 200px);
         width: clamp(140px, 15vw, 200px);
     }
     #case-studies .case-card:nth-child(2) .case-card-logo { max-height: 90px; }
     #case-studies .case-card.is-active {
         height: clamp(150px, 45vw, 240px);
         width: 90%;
     }
}
@media (max-width:768px){
    #case-studies .case-card:nth-child(1).is-active .case-card-logo { max-height: 35px; }
    #case-studies .case-card:nth-child(2).is-active .case-card-logo { max-height: 85px; }
    #case-studies .case-card:nth-child(3).is-active .case-card-logo { max-height: 70px; }
    #case-studies .case-card:nth-child(4).is-active .case-card-logo { max-height: 60px; }
    #case-studies .case-card:nth-child(5).is-active .case-card-logo { max-height: 35px; }
    #case-studies .case-card:nth-child(6).is-active .case-card-logo { max-height: 80px; }
    #case-studies .case-card:nth-child(7).is-active .case-card-logo { max-height: 80px; }

}
@media (max-width: 575px) {
    #case-studies .case-card:nth-child(1).is-active .case-card-logo { max-height: 38px; }
    #case-studies .case-card:nth-child(2).is-active .case-card-logo { max-height: 86px; }
    #case-studies .case-card:nth-child(3).is-active .case-card-logo { max-height: 60px; }
    #case-studies .case-card:nth-child(4).is-active .case-card-logo { max-height: 50px; }
    #case-studies .case-card:nth-child(5).is-active .case-card-logo { max-height: 30px; }
    #case-studies .case-card:nth-child(6).is-active .case-card-logo { max-height: 70px; }
    #case-studies .case-card:nth-child(7).is-active .case-card-logo { max-height: 70px; }
    #case-studies .case-card-logo {
       max-height: 70px;
    }
    #case-studies .case-card:nth-child(4) .case-card-logo { max-height: 58px; }
    #case-studies .case-card:nth-child(6) .case-card-logo { max-height: 80px; }
    #case-studies .case-card:nth-child(7) .case-card-logo { max-height: 80px; }
     #case-studies .case-card.is-active .case-card-logo {
         max-height: 25px;
     }
	#case-studies .case-card-btn{
		align-self: center;
	}
     .case-studies-section {
         padding: 50px 3px 50px;
     }

     #case-studies .case-studies-stage {
         height: clamp(480px, 100vw, 560px);
         border-radius: 14px;
     }

     #case-studies .case-cards-wrap {
         bottom: 15px;
         padding: 0 12px;
     }

     #case-studies .case-card {
         height: clamp(90px, 15vw, 200px);
         width: clamp(140px, 15vw, 200px);
     }
	#case-studies .case-cards-swiper{
		height: 406px;
	}
     #case-studies .case-card.is-active {
          min-height: clamp(380px, 45vw, 240px);
          width: 94%;
     }

     #case-studies .case-card-active-content {
          flex-direction: column;
          align-items: flex-start;
          gap: 0px;
          padding: 18px;
     }

     #case-studies .case-nav {
         width: 32px;
         height: 32px;
         top: 12px;
     }

     #case-studies .case-nav-prev {
         right: 48px;
     }

     #case-studies .case-nav-next {
         right: 10px;
     }
	#case-studies .case-card-active-content .case-card-logo {
		 position: static;
		 opacity: 1;
		 flex: 0 0 auto;
		 max-width: clamp(150px, 14vw, 150px);
		 padding: 0;
    }
}
 /* ==========================================================
                "Case Studies" section
    ========================================================== */