[data-glass-flip-cards] {
  perspective: 1200px;
}

.glass-flip-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  width: 100%;
  box-sizing: border-box;
}

@media (min-width: 680px) {
  .glass-flip-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .glass-flip-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
  }
}

/* === HLAVNÍ KARTA === */
.glass-flip-card {
  position: relative;
  width: 100%;
  min-width: 0;
  cursor: pointer;
  outline: none;
  touch-action: manipulation;
  height: 100%; /* důležité pro stejnou výšku */
}

.glass-flip-card__inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.32s ease-out;
}

/* === SKLO - VÍCE BÍLÉ NA DESKTOPU === */
.glass-flip-card__face {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.25rem;
  box-sizing: border-box;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.85);
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 255, 255, 0.78)
  );
  box-shadow:
    0 18px 44px rgba(15, 23, 42, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass-flip-card__face {
    background: rgba(255, 255, 255, 0.97);
  }
}

.glass-flip-card__face--front {
  z-index: 2;
}

.glass-flip-card__face--back {
  transform: rotateY(180deg);
  justify-content: flex-start;
  overflow: hidden;           /* důležité */
  scrollbar-width: none;      /* Firefox */
  -ms-overflow-style: none;   /* IE/Edge */
}

.glass-flip-card__face--back::-webkit-scrollbar {
  display: none;              /* Chrome, Safari, Edge */
}

/* === TITULKY A TEXT === */
.glass-flip-card__title,
.glass-flip-card__subtitle,
.glass-flip-card__description {
  margin: 0;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: #0f172a;
}

.glass-flip-card__title {
  font-size: clamp(1rem, 2.4vw, 1.2rem);
  font-weight: 700;
  line-height: 1.25;
}

.glass-flip-card__subtitle {
  font-size: clamp(0.86rem, 2vw, 0.96rem);
  line-height: 1.45;
}

.glass-flip-card__description {
  font-size: clamp(0.86rem, 2vw, 0.95rem);
  line-height: 1.6;
}

/* Hover + Flip */
@media (hover: hover) and (pointer: fine) {
  .glass-flip-card:hover .glass-flip-card__inner,
  .glass-flip-card:focus-visible .glass-flip-card__inner {
    transform: rotateY(180deg);
  }
}

.glass-flip-card.is-flipped .glass-flip-card__inner {
  transform: rotateY(180deg);
}

/* Mobilní úpravy */
@media (max-width: 767px) {
  .glass-flip-card {
    min-height: 220px;
  }
  .glass-flip-card__face {
    padding: 1rem;
    background: linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.88),
      rgba(255, 255, 255, 0.75)
    );
  }
}

@media (hover: none) {
  .glass-flip-card {
    cursor: default;
    -webkit-tap-highlight-color: transparent;
  }
  .glass-flip-card__inner {
    transition: transform 0.18s ease-out;
  }
}