.hero .hero-bgr {
  --mask-height:var(--wp--preset--spacing--80);
  mask-image:
   linear-gradient(white, white),
    url('https://londontenantservices.com/wp-content/uploads/2026/05/hero-bottom.svg');
  mask-position: top, bottom;
  mask-repeat: no-repeat;
  mask-size: 100% calc(100% - var(--mask-height)),
             calc( 100% + 8px )  calc(var(--mask-height) + 2px );
  mask-composite: add;
}

.what::before {
   --mask-height:var(--wp--preset--spacing--80);
  mask-image:
   linear-gradient(white, white),
    url('https://londontenantservices.com/wp-content/uploads/2026/05/hero-bottom.svg');
  mask-position: top, bottom;
  mask-repeat: no-repeat;
  mask-size: 100% calc(100% - var(--mask-height)),
             calc( 100% + 8px )  calc(var(--mask-height) + 2px );
  mask-composite: add;
}

.different .dif-card {
  column-gap: var(--wp--preset--spacing--20);
  row-gap: var(--wp--preset--spacing--40);
  
}

.different .dif-card .icon{
  width: max(67px, 9.8vw);
  aspect-ratio: 1/1;
  object-fit: contain;
}

.different .dif-card p {
  font-weight: 500;
}
 .recent .tms-card a:hover {
    background-color: var(--wp--preset--color--accent-1);
    text-decoration: none;
  }

@media (max-width: 1024px) {
  .different .dif-card {
    flex-direction: column;
    align-items: center;
    row-gap: var(--wp--preset--spacing--20);
  }
  .different .dif-card .dif-text {
    display:flex;
    flex-direction: column;
    align-items: center;
  }
  .different .dif-card .dif-text p {
    text-align: center;
  }
 
}


@media (max-width: 768px) {
  .hero .hero-bgr {
    --mask-height: var(--wp--preset--spacing--60);
  }
  .what::before {
    --mask-height: var(--wp--preset--spacing--60);
  }
  .cards .tms-card h2, .cards .tms-card .cta {
    margin:0px !important;
  }
  .cards .tms-card .text {
    padding-bottom: var(--wp--preset--spacing--40) !important;
  }
}

