/*/Users/vyacheslavkomarov/Documents/Python/Посадочная Школа Акция/pythonProject2/UNLANDING/landing/static/landing/css/extra.css*/
.sticky-offer-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #fff;
  box-shadow: 0 0 40px 0 rgba(255,60,0,0.18);
  z-index: 9999;
  animation: fadeInUp 0.7s cubic-bezier(.7,1.7,.6,.97);
  border-radius: 0 0 18px 18px;
}

.sticky-offer-container {
  max-width: 1550px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 18px 30px 12px 30px;
  justify-content: space-between;
}

.sticky-offer-text {
  font-size: 1.25rem;
  font-weight: 700;
  color: #ff4900;
  display: flex;
  align-items: center;
  gap: 15px;
  letter-spacing: -1px;
  white-space: nowrap;
}
.wow-gradient {
  background: linear-gradient(90deg,#ff7b00,#fd0c6b 60%);
  color: #fff;
  padding: 5px 14px;
  border-radius: 20px;
  font-size: 1.12rem;
  font-weight: 700;
  margin-left: 10px;
  box-shadow: 0 4px 20px -7px #fd0c6b66;
  letter-spacing: -0.5px;
  animation: gradientPulse 1.5s infinite alternate;
}

.sticky-timer-block {
  display: flex;
  gap: 10px;
  align-items: center;
}

.timer-unit {
  background: #fff6f0;
  border-radius: 15px;
  padding: 7px 19px 5px 19px;
  box-shadow: 0 1px 8px 0 rgba(255,60,0,0.07);
  text-align: center;
  min-width: 60px;
  margin: 0 2px;
}
.timer-value {
  font-size: 1.7rem;
  font-weight: 800;
  color: #ff7b00;
  display: block;
  letter-spacing: 1.5px;
}
.timer-label {
  font-size: 0.88rem;
  color: #222;
  opacity: 0.7;
  margin-top: -6px;
  display: block;
}

.sticky-action-block {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}

.sticky-offer-btn {
  background: #111;
  color: #fff !important;
  font-weight: 800;
  border-radius: 16px;
  font-size: 1.13rem;
  padding: 13px 42px 13px 32px;
  position: relative;
  transition: 0.18s box-shadow, 0.22s background;
  box-shadow: 0 3px 16px -3px #0003;
  overflow: visible;
}

.sticky-offer-btn:hover {
  background: #ff7b00;
  color: #fff !important;
  box-shadow: 0 8px 32px -8px #fd0c6b33;
}
.wow-tag {
  display: inline-block;
  position: absolute;
  left: 12px; top: -16px;
  background: #fff;
  color: #222;
  font-weight: 700;
  font-size: 0.97rem;
  border-radius: 7px;
  padding: 3px 13px;
  box-shadow: 0 2px 9px 0 #fd0c6b16;
  transform: rotate(-8deg);
  letter-spacing: 0.5px;
  border: 2px solid #ff7b00;
  z-index: 3;
}

.sticky-offer-close {
  font-size: 1.8rem;
  color: #ff6161;
  cursor: pointer;
  margin-left: 18px;
  transition: 0.1s;
}
.sticky-offer-close:hover { color: #e53935; }

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px);}
  to { opacity: 1; transform: translateY(0);}
}
@keyframes gradientPulse {
  from { box-shadow: 0 4px 14px -7px #fd0c6b33; }
  to   { box-shadow: 0 8px 22px -7px #fd0c6b; }
}
.pulse-wow {
  animation: pulseWow 2s infinite;
}
@keyframes pulseWow {
  0% { transform: scale(1);}
  40% { transform: scale(1.04);}
  100% { transform: scale(1);}
}

/* Планшеты и телефоны: компактная версия sticky bar */
@media (max-width: 991.98px) {
  .sticky-offer-container {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
  }

  .sticky-offer-bottom {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap;
    gap: 20px !important;
    width: 100% !important;
  }

  .sticky-timer-block {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 10px !important;
    text-align: center !important;
  }

  .sticky-action-block {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    position: relative !important;
  }

  .sticky-offer-btn {
    font-size: 1rem !important;
    padding: 10px 24px !important;
    white-space: nowrap !important;
    border-radius: 999px !important;
    font-weight: bold !important;
    background-color: #000 !important;
    color: #fff !important;
  }

  .wow-tag {
    position: absolute !important;
    top: -12px !important;
    left: 50% !important;
    transform: translateX(-50%) rotate(-10deg) !important;
    font-size: 0.7rem !important;
    background: #ff6600 !important;
    color: #fff !important;
    padding: 2px 6px !important;
    border-radius: 8px !important;
    z-index: 2 !important;
    white-space: nowrap !important;
    font-weight: bold !important;
  }
}