@charset "UTF-8";
/* =========================================================
   Globaler JET-Pill-Button
   - frei verwendbar mit .btn-jet-pill
   - bestehender Slider-Button bleibt ohne HTML-Änderung erhalten
   ========================================================= */
.btn-jet-pill,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill {
  --jet-btn-bg: #134093;
  --jet-btn-fg: #FBBA00;
  --jet-btn-radius: 50px;
  --jet-btn-pad-y: .95rem;
  --jet-btn-pad-x: 1.5rem;
  --jet-btn-icon-size: 1.2rem;
  --jet-btn-icon-gap: .8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--jet-btn-icon-gap);
  width: fit-content;
  max-width: 100%;
  padding: var(--jet-btn-pad-y) var(--jet-btn-pad-x);
  border: 0;
  border-radius: var(--jet-btn-radius);
  background-color: var(--jet-btn-bg) !important;
  color: var(--jet-btn-fg) !important;
  text-decoration: none !important;
  font-family: 'jet_set_sansbold', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none; }

/* Content-Pills */
.btn-jet-pill {
  --jet-btn-font-size: 0.65rem;
  font-size: var(--jet-btn-font-size); }

/* Slider-Button */
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill {
  --jet-btn-font-size: 1.1rem;
  font-size: var(--jet-btn-font-size); }

.btn-jet-pill:hover,
.btn-jet-pill:focus,
.btn-jet-pill:active,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill:hover,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill:focus,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill:active {
  background-color: var(--jet-btn-bg) !important;
  color: var(--jet-btn-fg) !important;
  text-decoration: none !important;
  transform: none !important; }

/* Text im Button */
.btn-jet-pill > span,
.btn-jet-pill .btn-jet-pill__text,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill .offer-jet__cta-text {
  white-space: nowrap;
  line-height: 1; }

/* Icon im Button */
.btn-jet-pill > svg,
.btn-jet-pill > .arrow-icon,
.btn-jet-pill .btn-jet-pill__icon,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill .offer-jet__cta-icon {
  width: var(--jet-btn-icon-size);
  height: var(--jet-btn-icon-size);
  display: block;
  flex: 0 0 var(--jet-btn-icon-size);
  fill: currentColor; }

.btn-jet-pill > svg path,
.btn-jet-pill > .arrow-icon path,
.btn-jet-pill .btn-jet-pill__icon path,
.swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill .offer-jet__cta-icon path {
  fill: currentColor; }

@media (max-width: 576px) {
  .btn-jet-pill,
  .swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill {
    --jet-btn-pad-y: .45rem;
    --jet-btn-pad-x: 1.1rem;
    --jet-btn-icon-size: 1.05rem;
    --jet-btn-icon-gap: .6rem; }

  .btn-jet-pill {
    --jet-btn-font-size: 0.65rem; }

  .swiper-slide .offer-jet .offer-jet__cta.offer-jet__cta--pill {
    --jet-btn-font-size: .95rem; } }
/* =========================================================
   Offer / Slider
   ========================================================= */
.swiper-slide .offer-jet,
.swiper-slide .offer-jet * {
  box-sizing: border-box; }

.swiper-slide .offer-jet {
  --jet-blue: #134093;
  --jet-legal: #1a1a1a;
  --outer-radius: 0px;
  --stage-radius: 0px;
  --pad: 2rem;
  --legal-gap: .75rem;
  --legal-size: .85rem;
  --ratio-x: 52;
  --ratio-y: 33;
  --badge-scale: 0.58;
  --badge-offset-x: 0%;
  --badge-offset-y: 0%;
  --product-scale: 0.66;
  --product-shift: -48%;
  background: #fff;
  border-radius: var(--outer-radius);
  overflow: hidden; }

.swiper-slide .offer-jet .featurekachel,
.swiper-slide .offer-jet .bigcard,
.swiper-slide .offer-jet .card,
.swiper-slide .offer-jet .card-body,
.swiper-slide .offer-jet .card-img-overlay,
.swiper-slide .offer-jet .card-footer,
.swiper-slide .offer-jet .preis-svg,
.swiper-slide .offer-jet .full-kachel-img {
  all: unset !important;
  display: contents !important; }

.swiper-slide .offer-jet .offer-jet__footer {
  display: none !important; }

.swiper-slide .offer-jet .offer-jet__stage {
  position: relative;
  aspect-ratio: var(--ratio-x)/var(--ratio-y);
  height: auto;
  margin: 0 !important;
  border-radius: var(--stage-radius);
  overflow: hidden;
  display: grid;
  grid-template-rows: 1fr auto;
  grid-template-columns: 1fr auto;
  align-items: center;
  column-gap: var(--legal-gap);
  padding: var(--pad);
  background-color: #d8b59d;
  background-image: url("../images/2026/jet-tankstellen-kachel-bg-bistro.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center; }

@supports not (aspect-ratio: 1/1) {
  .swiper-slide .offer-jet .offer-jet__stage {
    height: 0;
    padding-top: calc(100% * var(--ratio-y) / var(--ratio-x)); } }
.swiper-slide .offer-jet .offer-jet__title {
  position: absolute;
  top: var(--pad);
  left: var(--pad);
  margin: 0;
  color: #fff;
  font-family: 'jet_set_sansbold', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 1.6rem;
  line-height: 1.15;
  font-weight: 700;
  z-index: 4;
  width: 42%; }

.swiper-slide .offer-jet .offer-jet__badge {
  position: absolute;
  z-index: 1;
  width: calc(100% * var(--badge-scale)) !important;
  height: auto !important;
  max-width: none !important;
  right: var(--badge-offset-x);
  top: var(--badge-offset-y);
  object-fit: contain;
  object-position: right top;
  pointer-events: none; }

.swiper-slide .offer-jet .offer-jet__product {
  position: absolute;
  z-index: 2;
  width: calc(100% * var(--product-scale));
  height: auto;
  left: 0;
  top: 50%;
  transform: translateY(var(--product-shift));
  object-fit: contain; }

/* Im Slider nur noch Positionierung */
.swiper-slide .offer-jet .offer-jet__cta {
  grid-row: 2;
  grid-column: 2;
  align-self: center;
  justify-self: end;
  position: static;
  z-index: 10;
  pointer-events: auto; }

/* Legal */
.swiper-slide .offer-jet .offer-jet__legal {
  grid-row: 2;
  grid-column: 1;
  position: static;
  margin: 0;
  color: var(--jet-legal);
  font-family: 'jet_set_sansregular', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: var(--legal-size);
  line-height: 1.3;
  max-width: 95%; }

/* ---------------- Mobile ≤576px ---------------- */
@media (max-width: 576px) {
  .swiper-slide .offer-jet {
    --pad: 1.25rem;
    --badge-scale: 0.54;
    --product-scale: 0.75;
    --product-shift: -52%;
    --ratio-x: 52;
    --ratio-y: 38;
    --legal-size: .45rem; }

  .swiper-slide .offer-jet .offer-jet__title {
    font-size: 1.25rem;
    width: 52%; }

  .swiper-slide .offer-jet .offer-jet__stage {
    background-position: center center; } }
/* =========================================================
   Bestehende Double-Button-Variante
   ========================================================= */
.jet-card-button.jet-card-button-double {
  padding-top: .6rem;
  padding-bottom: .6rem;
  align-items: center; }
  .jet-card-button.jet-card-button-double span {
    text-align: center;
    line-height: 1.05;
    white-space: normal;
    margin-right: .5rem; }
  .jet-card-button.jet-card-button-double svg,
  .jet-card-button.jet-card-button-double .arrow-icon {
    flex-shrink: 0;
    display: block;
    width: .9rem;
    height: .9rem; }

@media (max-width: 767.98px) {
  .jet-card-button.jet-card-button-double span {
    font-size: .65rem;
    line-height: 1.05;
    margin-right: .5rem; }
  .jet-card-button.jet-card-button-double svg,
  .jet-card-button.jet-card-button-double .arrow-icon {
    width: .9rem;
    height: .9rem; } }
/* =========================================================
   Swiper
   ========================================================= */
.offerslide.swiper-fade .swiper-slide:not(.swiper-slide-active) a {
  pointer-events: none; }

.offerslide.swiper-fade .swiper-slide:not(.swiper-slide-active) button {
  pointer-events: none; }

.offerslide.swiper-fade .swiper-slide.swiper-slide-active {
  z-index: 2; }

/*# sourceMappingURL=kachel-neu.css.map */
