/* Shared carousel / product-card strip — home + favorites */

.attributes-container {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
}

.attributes-container span {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  margin-right: var(--default-items-margin);
}

.attributes-container span svg {
  width: 16px;
  height: 16px;
}

.attributes-container span label {
  margin-left: calc(var(--default-items-margin) / 3);
}

.carusel-section {
  overflow: clip;
  z-index: 9;
  position: relative;
}

.carusel-section .constraint {
  width: calc(100% - (100% - var(--constraint-width)) / 2);
  margin: 0 0 0 calc((100% - var(--constraint-width)) / 2);
}

/* Second row: full-width strip; tabs/toolbar stay in the constraint above (home.php). */
.carusel-section .constraint.constraint--carousel {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  max-width: none;
}

.carusel-section .constraint:not(.constraint--carousel) .add-padding {
  padding: calc(var(--default-padding-frame) * 2) 0 calc(var(--default-padding-frame) * 1) var(--default-padding-frame);
}

.carusel-section .constraint:not(.constraint--carousel) .add-padding h1 {
  margin: 0;
}

.carusel-section .constraint.constraint--carousel .add-padding--carousel-only {
  padding: 0 0 calc(var(--default-padding-frame) * 2) 0;
  box-sizing: border-box;
}

/* Desktop / tablet: gutter matches column start; it scrolls away — no JS, no snap-back. */
@media screen and (min-width: 1020px) {
  .carusel-section .constraint--carousel .carusel-tabs-container {
    --carousel-inline-gutter: calc(max(0px, (100vw - var(--constraint-width)) / 2) + var(--default-padding-frame));
    padding-left: var(--carousel-inline-gutter);
    padding-right: var(--carousel-inline-gutter);
    width: 100%;
    box-sizing: border-box;
  }
}

.carusel-section.banner .constraint {
  width: var(--constraint-width);
  margin: 0 auto;
}

.carusel-section.banner .constraint .add-padding {
  padding: calc(var(--default-padding-frame) * 2) var(--default-padding-frame) calc(var(--default-padding-frame) * 1) var(--default-padding-frame);
}

.carusel-section.child-0 .constraint:not(.constraint--carousel) .add-padding {
  padding: 0 0 var(--carousel-first-section-padding-bottom) var(--default-padding-frame);
}

.carusel-section.child-0 .constraint.constraint--carousel .add-padding--carousel-only {
  padding: 0 0 var(--carousel-first-section-padding-bottom) 0;
}

.carusel-toolbar-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  z-index: 2;
  position: relative;
}

@media screen and (min-width: 1020px) {
  .carusel-toolbar-container {
    justify-self: start;
    width: calc(var(--constraint-width) - 2 * var(--default-padding-frame) - var(--default-items-margin));
  }
}

.carusel-toolbar-container .btn-contianer {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: calc(var(--default-items-margin) / 2);
}

.carusel-toolbar-container .btn-contianer button {
  box-sizing: border-box;
  width: 56px;
  height: 56px;
  min-width: 56px;
  min-height: 56px;
  padding: var(--default-button-padding);
  border-radius: 50%;
  border-color: transparent;
  background-color: var(--background-color);
  /* Figma: soft elevation (node 123:11335) */
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.07);
  fill: var(--primary-color);
  -webkit-transition: transform 250ms ease-in-out;
  -moz-transition: transform 250ms ease-in-out;
  -ms-transition: transform 250ms ease-in-out;
  -o-transition: transform 250ms ease-in-out;
  transition: transform 550ms ease-in-out;
}

.carusel-toolbar-container .btn-contianer button:disabled {
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.05);
  /*border-color: var(--color-shade-dark-100);*/
  background-color: var(--background-color);
  fill: var(--color-shade-dark-200);
}

.carusel-toolbar-container .btn-contianer button svg {
  fill: inherit;
}

.carusel-tabs {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  list-style: none;
  position: relative;
  z-index: 2;
}

.carusel-tabs>a {
  color: var(--color-shade-dark-300);
  margin: 0 var(--default-items-margin) 0 0;
  cursor: pointer;
}

.carusel-tabs>a h3 {
  margin-block-start: 0;
  margin-bottom: 0;
}

.carusel-tabs>a.active {
  display: block;
  color: var(--color-shade-dark-800);
}

.carusel-tabs-container>ul {
  display: none;
  flex-direction: row;
  flex-wrap: nowrap;
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 2;

}

.with-tabs .carusel-tabs-container {
  flex-wrap: nowrap;
}

.with-tabs .carusel-tabs-container>ul {
  flex-shrink: 1;
  width: 100%;

  height: 100%;
}

.carusel-section:not(.with-tabs) .chips-container .chip.smaller.leading-icon {
  background-color: transparent;
  color: var(--color-shade-dark-600);

}

/* Figma 123:10998 — metadata row: location, duration, TA (full cards / no-tabs only) */
.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--default-items-margin);
  row-gap: calc(var(--default-items-margin) / 2);
  margin-bottom: 0.75rem;
  /* Match TA chip min-height (32px) so duration-only rows don’t collapse to ~16px. */
  min-height: 2rem;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs>.carousel-attr-item {
  display: inline-flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: calc(var(--default-items-margin) / 4);
  margin-right: 0;
  box-sizing: border-box;
  font-weight: 700;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--primary-color);
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .carousel-attr-label {
  margin: 0;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .carousel-attr-icon {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  color: var(--primary-color);
  display: block;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .chip.carousel-attr-ta {
  margin: 0;
  height: auto;
  min-height: 32px;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  background-color: var(--background-color) !important;
  color: var(--primary-color);
  border: 1px solid var(--secondary-color-prim-900);
  border-radius: 900px;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .chip.carousel-attr-ta span {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  color: inherit;
}

.carusel-tabs-container>ul.active {
  display: flex;
}

.carusel-tabs-container>ul li {
  margin-right: var(--default-items-margin);
  padding: var(--default-items-padding);
  border-radius: var(--default-card-radius);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  aspect-ratio: 320 / 411;
  width: 320px;
  height: 411px;
  border: 1px solid rgba(249, 249, 249, 1);
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li {
  margin-right: var(--carousel-strip-item-gap);
}

.carusel-tabs-container>ul li:last-child {}

.with-tabs .carusel-tabs-container>ul li {
  aspect-ratio: 77 / 40;
  width: 308px;
  height: 160px;
  min-height: unset;
  min-width: unset;
  flex-shrink: 0;
  display: flex;
}


.carusel-tabs-container>ul li a {
  display: grid;
  height: 100%;
  width: 100%;
  grid-template-areas:
    "group-size action"
    "empty empty"
    "attributes attributes"
    "carousel-text carousel-text";
  grid-template-rows: min-content minmax(150px, 257px) 0.1fr min-content;
  position: relative;
  cursor: pointer;
}

.carusel-tabs-container>ul li a:hover .empty-space img {
  transform: scale(1.04);
}

.with-tabs .carusel-tabs-container>ul li a {
  grid-template-areas:
    "attributes attributes"
    "empty empty"
    "carousel-text carousel-text";
  grid-template-rows: min-content auto min-content;
  z-index: 2;
}

.with-tabs .carusel-tabs-container>ul li a::after {
  content: " ";
  display: block;
  width: calc(100% + (var(--default-items-padding) * 2));
  height: 120px;
  position: absolute;
  bottom: calc(var(--default-items-padding)* -1);
  left: calc(var(--default-items-padding)* -1);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(0 0 0 / 35%) 100%);
  z-index: 2;
}

.carusel-tabs-container>ul li a .empty-space {
  grid-row-start: group-size;
  grid-row-end: empty;
  grid-column-start: empty;
  grid-column-end: empty;
  position: absolute;
  width: calc(100% + (var(--default-items-padding) * 2));
  height: 257px;

  left: calc(var(--default-items-padding) * -1);
  top: calc(var(--default-items-padding) * -1);
  border-radius: var(--default-card-radius) var(--default-card-radius) 0 0;
  overflow: hidden;
}

.with-tabs .carusel-tabs-container>ul li a .empty-space {
  height: calc(100% + (var(--default-items-padding) * 2));
  grid-column-start: attributes;
  grid-column-end: attributes;
  grid-row-start: attributes;
  grid-row-end: carousel-text;
  border-radius: var(--default-card-radius);
}

.carusel-tabs-container>ul li a .empty-space img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-transition: transform 250ms ease-in-out;
  -moz-transition: transform 250ms ease-in-out;
  -ms-transition: transform 250ms ease-in-out;
  -o-transition: transform 250ms ease-in-out;
  transition: transform 250ms ease-in-out;
}

.carusel-tabs-container>ul li a .attributes-container {
  grid-area: attributes;
  position: relative;
  padding: 0 0 0;
  z-index: 9;
}

.with-tabs .carusel-tabs-container>ul li a .attributes-container {
  padding: 0 0 0;
}

.carusel-tabs-container>ul li a .attributes-container::after {
  content: " ";
  display: block;
  width: calc(100% + (var(--default-items-padding) * 2));
  height: 70px;
  position: absolute;
  top: -45px;
  left: calc(var(--default-items-padding) * -1);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 70%);
  /* Below real content: positioned ::after paints after in-flow chips unless they create a higher layer. */
  z-index: 0;
  pointer-events: none;
}

/* Chips/metadata sit in the same box as ::after; keep them above the fade (and clickable). */
.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs>* {
  position: relative;
  z-index: 1;
}

.with-tabs .carusel-tabs-container>ul li a .attributes-container::after {
  display: none;
}

.with-tabs .carusel-tabs-container>ul li a .attributes-container .time-label,
.with-tabs .carusel-tabs-container>ul li a .attributes-container .time-label:nth-child(1) {
  display: none;
}

.carusel-tabs-container>ul li a .attributes-container span label {
  text-transform: uppercase;
  color: var(--color-shade-dark-600);
  font-size: 0.9em;
}

.carusel-tabs-container>ul li a .attributes-container span.time-label label {
  text-transform: unset;
}

.carusel-tabs-container>ul li a .attributes-container span:last-child {
  margin-right: 0;
}

.with-tabs .carusel-tabs-container>ul li a .attributes-container span:nth-child(1) {
  display: flex;
  z-index: 9;
}

.carusel-tabs-container>ul li a .carousel-card-text {
  grid-area: carousel-text;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: 4px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.carusel-tabs-container>ul li a .tittle {
  flex: 1 1 0;
  min-width: 0;
  margin: calc(var(--default-items-margin) / 2) 0;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 4.35em;
}

.with-tabs .carusel-tabs-container>ul li a .tittle {
  margin: 0;
  color: #fff;
  min-height: 86px;
}

.carusel-tabs-container>ul li a .tittle p {
  margin-block-start: 0;
  margin-block-end: 0;
  color: inherit;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.25;
}

.with-tabs .carusel-tabs-container>ul li a .tittle p {
  font-weight: 600;
  font-size: 16px;
  line-height: normal;
}

.carusel-tabs-container>ul li a .carousel-price-stack {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 4px;
  padding-left: 8px;
  min-width: 0;
  position: relative;
}

.with-tabs .carusel-tabs-container>ul li a .carousel-card-text {
  position: relative;
  z-index: 3;
}

/* TOU-84 / Figma 123:10998 — full-height cards (no tabs): title block, then price row (from left, private right). */
.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-text {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: var(--carousel-card-title-pricing-gap);
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .tittle {
  flex: 0 1 auto;
  width: 100%;
  min-width: 0;
  margin: 0;
  justify-content: flex-start;
  /* Reserve ~2 lines at 18px so image height stays stable vs one-line titles. */
  min-height: 2.75rem;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .tittle p {
  font-weight: 500;
  font-size: 18px;
  line-height: normal;
  -webkit-line-clamp: 2;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-text-footer {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--default-items-margin);
  width: 100%;
  min-width: 0;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-text-footer .carousel-price-stack {
  flex: 1 1 auto;
  min-width: 0;
  align-items: flex-start;
  justify-content: flex-end;
  padding-left: 0;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-text-footer .price-from {
  align-items: flex-start;
  text-align: left;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-private-from {
  flex: 0 1 auto;
  margin: 0;
  max-width: 48%;
  font-family: inherit;
  font-weight: 500;
  font-size: 12px;
  line-height: normal;
  color: var(--color-shade-dark-300);
  text-align: right;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-text-footer>.carousel-card-private-from:only-child {
  margin-left: auto;
  max-width: 100%;
}

.carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .carousel-card-private-from span {
  font-weight: 500;
  white-space: nowrap;
}

.with-tabs .carusel-tabs-container>ul li a .carousel-price-stack {
  color: #fff;
}

.carusel-tabs-container>ul li a .price-from {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  text-align: right;
}

.carusel-tabs-container>ul li a .private-price {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  text-align: right;
}

.carusel-tabs-container>ul li a .private-price .private-price-label {
  font-weight: 700;
  margin-block-start: 0;
  margin-block-end: 0;
  text-transform: uppercase;
  font-size: 12px;
  line-height: normal;
  color: var(--color-shade-dark-600);
}

.with-tabs .carusel-tabs-container>ul li a .private-price .private-price-label {
  color: inherit;
}

.carusel-tabs-container>ul li a .private-price .private-price-value {
  font-weight: 700;
  margin-block-start: 0;
  margin-block-end: 0;
  font-size: 22px;
  line-height: 26px;
}

.carusel-tabs-container>ul li a .price-from .price-from-label {
  font-weight: 700;
  margin-block-start: 0;
  margin-block-end: 0;
  text-transform: uppercase;
  font-size: 12px;
  line-height: normal;
  color: var(--color-shade-dark-600);
}

.with-tabs .carusel-tabs-container>ul li a .price-from .price-from-label {
  color: inherit;
}

.carusel-tabs-container>ul li a .price-from .price-from-value {
  font-weight: 700;
  margin-block-start: 0;
  margin-block-end: 0;
  font-size: 22px;
  line-height: 26px;
}


.carusel-tabs-container>ul li a .group-size {
  grid-area: group-size;
  position: relative;
}

.carusel-tabs-container>ul li a .action-container {
  grid-area: action;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
}

.with-tabs .carusel-tabs-container>ul li a .action-container {
  display: none;
}

.carusel-tabs-container>ul li a .action-container .icon-button {
  background-color: var(--color-shade-dark-100);
}

.carusel-tabs-container>ul li a .action-container .icon-button:hover {
  background-color: var(--color-shade-dark-300);
}

.carusel-tabs-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  position: relative;
  overflow-x: auto;
  z-index: 3;
  padding: 0 0 calc(var(--default-items-padding) / 2);
  padding: 0 0 0;
}

.carusel-tabs-container::-webkit-scrollbar-button,
.carusel-tabs-container::-moz-scrollbar-button:decrement,
.carusel-tabs-container::-moz-scrollbar-button:increment,
.carusel-tabs-container::-webkit-scrollbar-button:decrement,
.carusel-tabs-container::-webkit-scrollbar-button:increment {
  display: none;
  width: 0px;
}

.carusel-tabs-container .featured-post {
  /* Parent uses align-items: center; stretch so height matches product cards (height:100% is unreliable here). */
  align-self: stretch;
  width: 250px;
  margin-right: calc(var(--default-items-margin) * 2);
  z-index: 2;
  flex-shrink: 0;
  min-height: 0;
  border-radius: var(--default-card-radius);
  overflow: hidden;
}

/* TOU-84: tighter strip gap between guide card and tour cards (no-tabs carousels only). */
.carusel-section:not(.with-tabs) .carusel-tabs-container .featured-post {
  margin-right: var(--carousel-strip-item-gap);
  height: 411px;
}

.carusel-tabs-container .featured-post .featured-post-cont {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: calc(var(--default-items-padding) * 2);
  flex-wrap: nowrap;
  height: 100%;
  min-height: 0;
  background-color: rgba(241, 250, 255, 1);
  border-radius: var(--default-card-radius);
  box-sizing: border-box;
}

.carusel-tabs-container .featured-post .featured-post-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: calc(var(--default-items-margin) / 2);
  margin-top: calc(var(--default-items-margin) / 2);
  min-height: 0;
  width: 100%;
}

.carusel-section.child-1 .featured-post .featured-post-cont {
  background-color: rgba(255, 251, 237, 1);
}

.carusel-section.child-2 .featured-post .featured-post-cont {
  background-color: rgba(243, 255, 248, 1);
}

.carusel-section.child-3 .featured-post .featured-post-cont {
  background-color: rgba(241, 250, 255, 1);
}

.carusel-section.child-4 .featured-post .featured-post-cont {
  background-color: rgba(255, 240, 247, 1);
}

.carusel-section.child-5 .featured-post .featured-post-cont {
  background-color: rgba(248, 240, 255, 1);
}

.carusel-section.child-6 .featured-post .featured-post-cont {
  background-color: rgba(255, 245, 240, 1);
}

/* Figma tip-card 475:7261 — soft gray orb bottom-right (#ddd @ 40%, blur); under pattern + content */
.carusel-tabs-container .featured-post .featured-post-cont::before {
  content: "";
  position: absolute;
  pointer-events: none;
  left: auto;
  top: auto;
  right: clamp(-18px, -10%, 0px);
  bottom: clamp(-20px, -12%, 0px);
  width: min(210px, 88%);
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(221, 221, 221, 0.4);
  filter: blur(72px);
  z-index: 0;
}

.carusel-tabs-container .featured-post .featured-post-cont::after {
  content: "";
  background-image: url("/media/images/static/gradient-card-home.png");
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  background-size: cover;
}

.carusel-tabs-container .featured-post .featured-post-cont>div {
  z-index: 1;
}

.carusel-tabs-container .featured-post .featured-post-cont .chips-container {
  width: 100%;
  flex-shrink: 0;
}

.carusel-tabs-container .featured-post .featured-post-cont .featured-post-body h3 {
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  text-overflow: ellipsis;
}

.carusel-tabs-container .featured-post .featured-post-cont .read-time {
  width: 100%;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.carusel-tabs-container .featured-post .featured-post-cont .read-time svg {
  flex-shrink: 0;
}

.carusel-tabs-container .featured-post .featured-post-cont .read-time .read-time-label {
  margin: 0 0 0 var(--chip-smaller-padding-top-bottom);
  font-family: 'Gabarito', sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.carusel-tabs-container .featured-post .featured-post-cont .toolbar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  flex-shrink: 0;
}

/* Figma tip-card padding; scoped so global .button.with-icon stays unchanged elsewhere */
.carusel-tabs-container .featured-post .featured-post-cont .toolbar .button.with-icon.featured-post-read-guide {
  box-sizing: border-box;
  width: 100%;
  justify-content: center;
  padding: var(--default-button-padding);
}

.carusel-tabs-container .featured-post .featured-post-cont .toolbar .button.with-icon span {
  font-weight: 600;
}

.carusel-section .constraint:not(.constraint--carousel) .add-padding .container>h1 {
  z-index: 2;
  position: relative;
  margin: 0 0 calc(var(--default-items-margin) * 2) 0;
}

.carusel-section:nth-child(1) .carusel-tabs-container .featured-post .featured-post-cont {
  background-color: rgba(255, 251, 237, 1);
}

.carusel-section:nth-child(2) .carusel-tabs-container .featured-post .featured-post-cont {
  background-color: rgba(243, 255, 248, 1);
}

.carusel-section:nth-child(3) .carusel-tabs-container .featured-post .featured-post-cont {
  background-color: rgba(241, 250, 255, 1);
}

.carusel-section .background-decoration-text {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;

}

.carusel-section.child-0 {
  background: linear-gradient(360deg, rgba(0, 0, 0, 0.1) 0%, rgba(255, 255, 255, 0) 100%);
}

.carusel-section .background-decoration-text h1 {
  color: rgba(249, 249, 249, 1);
  font-size: 22em;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-top: -2%;
  line-height: 1em;
}

.carusel-tabs-container::-webkit-scrollbar {
  background-color: transparent;
  border-radius: 8px;
  height: 0;
  width: 0;
}

.carusel-tabs-container::-webkit-scrollbar-button {
  display: none;
}


@media screen and (min-width:0px) and (max-width:1019px) {
  .carusel-toolbar-container .btn-contianer {
    display: none;
  }

  .with-tabs .carusel-tabs-container>ul li {
    width: 253px;
    height: 138px;
  }

  .with-tabs .carusel-tabs-container>ul li a .tittle {
    min-height: 74px;
  }

  .with-tabs .carusel-tabs-container>ul li a .price-from .price-from-value,
  .with-tabs .carusel-tabs-container>ul li a .private-price .private-price-value {
    font-size: 19px;
    line-height: 23px;
  }

  .with-tabs .carusel-tabs-container>ul li.previewing {}

  .carusel-tabs-container>ul li {
    width: 196px;
    height: 276px;
  }

  .carusel-tabs-container .featured-post {
    min-height: unset;
    width: 136px;
    height: 276px;
  }

  .carusel-tabs-container .featured-post .featured-post-cont {
    flex-wrap: nowrap;
  }

  .carusel-tabs-container .featured-post .featured-post-cont::before {
    width: min(118px, 92%);
    right: clamp(-8px, -6%, 0px);
    bottom: clamp(-12px, -8%, 0px);
    filter: blur(40px);
  }

  .carusel-tabs-container .featured-post .featured-post-cont .featured-post-body h3 {
    font-size: 1em;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
  }

  .carusel-tabs-container .featured-post .featured-post-cont .toolbar .button.with-icon.featured-post-read-guide {
    width: 100%;
    padding: var(--default-button-padding);
    justify-content: center;
  }

  .carusel-tabs-container .featured-post .featured-post-cont .toolbar .button.with-icon span {
    font-size: 0.875em;
  }

  .carusel-tabs-container .featured-post .featured-post-cont .toolbar .button.with-icon svg {
    display: none;
  }

  .carusel-tabs-container>ul li {
    background-color: #fff;
  }

  .carusel-tabs-container>ul li a .empty-space {
    height: 148px;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .empty-space {
    height: 100%;
  }

  .carusel-tabs-container>ul li a {
    grid-template-rows: min-content minmax(40px, 148px) 0.1fr min-content;
  }

  .carusel-tabs-container>ul li a .attributes-container {
    flex-wrap: nowrap;
  }

  .carusel-tabs-container>ul li a .attributes-container::after {
    height: 35px;
    top: -40px;
  }

  /* Narrow full cards: keep duration + TA on one row, tighter rhythm (no-tabs only). */
  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs {
    flex-wrap: nowrap;
    gap: calc(var(--default-items-margin) / 2);
    row-gap: 0;
    margin-bottom: 0.5rem;
    align-items: center;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs>.carousel-attr-item {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .carousel-attr-duration .carousel-attr-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 6.5rem;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .carousel-attr-icon {
    width: 0.875rem;
    height: 0.875rem;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .chip.carousel-attr-ta {
    flex: 0 0 auto;
    min-height: 28px;
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .carusel-section:not(.with-tabs) .carusel-tabs-container>ul li a .attributes-container.carousel-attrs--no-tabs .chip.carousel-attr-ta span {
    font-size: 0.6875rem;
  }

  .attributes-container span svg {
    width: 14px;
    height: 14px;
  }

  .carusel-section .chips-container .chip.smaller.leading-icon {
    margin: 0 0 0 0
  }

  .carusel-section .chips-container .chip.smaller,
  .carusel-tabs-container>ul li a .attributes-container .time-label {
    z-index: 3;
  }

  .carusel-section .constraint:not(.constraint--carousel) .add-padding {
    padding: calc(var(--default-padding-frame) * 2) var(--default-padding-frame) calc(var(--default-padding-frame) * 2) var(--default-padding-frame);
  }

  .carusel-section .constraint.constraint--carousel .add-padding--carousel-only {
    padding: 0 0 calc(var(--default-padding-frame) * 2) 0;
  }

  /* Scroll lives on inner <ul> for .with-tabs; keep container gutters neutral */
  .carusel-section .constraint--carousel .carusel-tabs-container {
    padding-left: 0;
    padding-right: 0;
  }

  .with-tabs .carusel-tabs-container {
    flex-wrap: nowrap;
    overflow-x: hidden;
    height: fit-content;
  }

  .with-tabs .carusel-tabs-container>ul {
    gap: var(--default-items-margin);
    scroll-behavior: smooth;
    scroll-snap-type: none;
    padding: var(--default-padding-frame) 235px var(--default-padding-frame) var(--default-padding-frame);
    align-items: center;
    scroll-padding-left: var(--default-padding-frame);
    scroll-padding-right: var(--default-padding-frame);
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }

  .with-tabs .carusel-tabs {
    margin-left: var(--default-padding-frame);
  }

  .with-tabs .carusel-tabs-container>ul li {
    margin-right: 0;
    outline-offset: 4px;
    scroll-snap-align: start;
  }

  .carusel-section.child-0 .constraint:not(.constraint--carousel) .add-padding {
    padding: 0 0 0 0;
  }

  .carusel-section.child-0 .constraint.constraint--carousel .add-padding--carousel-only {
    padding: 0 0 var(--carousel-first-section-padding-bottom) 0;
  }

  .carusel-section.child-0 {
    background: #fff;
  }
}