html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

body {
  background-image: url('/images/b.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  overscroll-behavior: none;
}

/* Overlay pentru lizibilitate */
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: -1;
}

/* CARDURI OPTIMIZATE PENTRU MOBILE */
.link-card {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  border: none;
  border-radius: 16px;
  padding: 16px;
  color: white;
  font-weight: bold;
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  min-height: 80px;
  display: flex;
  align-items: center;

  /* Pulsare mai subtila si mai profesionala */
  animation: sexy-pulse 2.5s infinite;
  box-shadow: 0 8px 20px rgba(220, 38, 38, 0.3);
}

@keyframes sexy-pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(220, 38, 38, 0.3);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 12px 25px rgba(220, 38, 38, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(220, 38, 38, 0.3);
  }
}

.link-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  transition: left 0.6s ease;
}

.link-card:hover::before {
  left: 100%;
}

.link-card:hover {
  animation: none;
  transform: translateY(-5px) scale(1.03);
  box-shadow: 0 18px 35px rgba(220, 38, 38, 0.6);
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.link-card:active {
  transform: translateY(-2px) scale(1.01);
  transition: all 0.1s ease;
}

/* Stiluri pentru iconite */
.icon-container {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 10px;
  padding: 10px;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  transition: all 0.3s ease;
}

.link-card:hover .icon-container {
  background: rgba(255, 255, 255, 0.3);
  transform: scale(1.1) rotate(5deg);
}

/* Card Telegram - un pic mai cald */
.telegram-card {
  background: linear-gradient(135deg, #0088cc 0%, #006699 100%);
  animation: sexy-pulse-telegram 2.5s infinite;
  box-shadow: 0 8px 20px rgba(0, 136, 204, 0.3);
}

@keyframes sexy-pulse-telegram {
  0% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(0, 136, 204, 0.3);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 12px 25px rgba(0, 136, 204, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(0, 136, 204, 0.3);
  }
}

.telegram-card:hover {
  box-shadow: 0 18px 35px rgba(0, 136, 204, 0.6);
  background: linear-gradient(135deg, #0099e6 0%, #0088cc 100%);
}

/* Card Discord - un pic mai rece */
.discord-card {
  background: linear-gradient(135deg, #5865f2 0%, #4752c4 100%);
  animation: sexy-pulse-discord 2.5s infinite;
  box-shadow: 0 8px 20px rgba(88, 101, 242, 0.3);
}

@keyframes sexy-pulse-discord {
  0% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(88, 101, 242, 0.3);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 12px 25px rgba(88, 101, 242, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(88, 101, 242, 0.3);
  }
}

.discord-card:hover {
  box-shadow: 0 18px 35px rgba(88, 101, 242, 0.6);
  background: linear-gradient(135deg, #6c79ff 0%, #5865f2 100%);
}

/* Card OnlyFans Romania */
.onlyfans-card {
  background: linear-gradient(135deg, #00aff0 0%, #0088cc 100%);
  animation: sexy-pulse-of 2.5s infinite;
  box-shadow: 0 8px 20px rgba(0, 175, 240, 0.3);
}

@keyframes sexy-pulse-of {
  0% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(0, 175, 240, 0.3);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 12px 25px rgba(0, 175, 240, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(0, 175, 240, 0.3);
  }
}

.onlyfans-card:hover {
  box-shadow: 0 18px 35px rgba(0, 175, 240, 0.6);
  background: linear-gradient(135deg, #22c4ff 0%, #00aff0 100%);
}

.onlyfans-card .icon-container {
  background: #fff;
  border-color: rgba(255, 255, 255, 0.95);
}

.onlyfans-card:hover .icon-container {
  background: #fff;
}

.onlyfans-icon-image {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

/* Card Cadou Special - stil auriu/rosu */
.gift-card {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  animation: sexy-pulse-gift 2.5s infinite;
  box-shadow: 0 8px 20px rgba(245, 158, 11, 0.3);
}

@keyframes sexy-pulse-gift {
  0% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.3);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 12px 25px rgba(245, 158, 11, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.3);
  }
}

.gift-card:hover {
  box-shadow: 0 18px 35px rgba(245, 158, 11, 0.6);
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
}

.fade-in {
  animation: fadeIn 1s ease-in-out;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* VERSIUNEA V2 OPTIMIZATA PENTRU TELEFON */
.title-text {
  text-shadow: 0 2px 10px rgba(0,0,0,0.5);
  position: relative;
  display: inline-block;
  padding-bottom: 12px;
}

.title-text::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #dc2626, transparent);
  overflow: hidden;
}

.title-text::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 30px; /* Mai lat pentru mobil */
  height: 3px; /* Mai gros pentru mobil */
  background: linear-gradient(90deg, transparent, #ffffff, #ff6b6b, #dc2626);
  animation: flow-line 3s infinite;
  z-index: 2;
  border-radius: 3px;
  box-shadow: 0 0 8px rgba(220, 38, 38, 0.7);
}

@keyframes flow-line {
  0% {
    left: -30px; /* Începe în afara ecranului */
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    left: calc(100% + 30px); /* Se termină în afara ecranului */
    opacity: 0;
  }
}

.glow {
  text-shadow: 0 0 10px rgba(220, 38, 38, 0.5);
}

.join-icon {
  transition: all 0.3s ease;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.2rem;
}

.link-card:hover .join-icon {
  transform: translateX(5px) scale(1.1);
  color: white;
}

.card-content {
  flex: 1;
  min-width: 0;
  padding-right: 10px;
}

.exclusive-badge {
  background: linear-gradient(135deg, rgba(255,255,255,0.3), rgba(255,255,255,0.2));
  color: white;
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 0.65rem;
  font-weight: 600;
  margin-left: 6px;
  border: 1px solid rgba(255,255,255,0.3);
  white-space: nowrap;
}

/* Media queries pentru dispozitive mobile - OPTIMIZAT */
@media (max-width: 768px) {
  .link-card {
    padding: 11px 12px;
    min-height: 60px;
    border-radius: 12px;
  }

  .icon-container {
    width: 34px;
    height: 34px;
    padding: 7px;
  }

  .card-content {
    padding-right: 6px;
  }

  .join-icon {
    font-size: 0.95rem;
  }

  .exclusive-badge {
    font-size: 0.58rem;
    padding: 2px 5px;
    margin-left: 4px;
  }

  .title-text {
    padding-bottom: 8px;
  }

  .title-text::before {
    height: 2px;
    width: 20px;
    box-shadow: 0 0 5px rgba(220, 38, 38, 0.6);
  }
}

/* Optimizare pentru telefoane foarte mici */
@media (max-width: 480px) {
  .title-text {
    font-size: 2.2rem !important;
    padding-bottom: 8px;
  }

  .title-text::before {
    height: 2px;
    width: 20px;
  }
}

/* Optimizare pentru performanța pe mobil - reduce tranzitiile pe scroll */
@media (prefers-reduced-motion: reduce) {
  .title-text::before {
    animation: none;
    width: 100%;
    opacity: 0.7;
  }
}