/* ========== Medical Certificates Playful Design ========== */
/* Фирменная тёплая оранжевая палитра «Медицинских справок» поверх корпоративного слоя */

/* ========== Playful Color Palette ========== */
:root {
  --cf-orange: #F57C00;
  --cf-orange-deep: #E65100;
  --cf-orange-light: #FFB74D;
  --cf-amber: #FFC107;
  --cf-coral: #FF7043;
  --cf-gold: #FFB300;
  --cf-teal: #26A69A;
  --cf-cream: #FFF3E0;
  --cf-warm: #FFF8F0;
}

/* ========== Floating Decorative Background ========== */
.medical-certificates-page .specialty-hero {
  position: relative;
}

.why-section {
  position: relative;
  overflow: hidden;
}

.why-section::after {
  content: '';
  position: absolute;
  top: 10%;
  right: -2%;
  width: 130px;
  height: 130px;
  background: radial-gradient(circle, rgba(245, 124, 0, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  animation: float-bg-cf 7s ease-in-out infinite;
}

.services-section {
  position: relative;
  overflow: hidden;
}

.services-section::after {
  content: '';
  position: absolute;
  bottom: 5%;
  left: -2%;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle, rgba(255, 193, 7, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  animation: float-bg-cf 8s ease-in-out infinite reverse;
}

.portal-section {
  position: relative;
  overflow: hidden;
}

.portal-section::after {
  content: '';
  position: absolute;
  top: 25%;
  right: -4%;
  width: 90px;
  height: 90px;
  background: radial-gradient(circle, rgba(255, 179, 0, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  animation: float-bg-cf 6s ease-in-out infinite;
}

.reviews-section {
  position: relative;
  overflow: hidden;
}

.reviews-section::after {
  content: '';
  position: absolute;
  top: 20%;
  left: -3%;
  width: 80px;
  height: 80px;
  background: radial-gradient(circle, rgba(255, 112, 67, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  animation: float-bg-cf 9s ease-in-out infinite reverse;
}

@keyframes float-bg-cf {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0.5; }
  50% { transform: translateY(-20px) scale(1.1); opacity: 0.8; }
}

/* ========== Hero - Playful Additions ========== */

/* Оранжевое слово «Медицинские справки» */
.specialty-hero__title .highlight-certificates {
  color: var(--cf-orange) !important;
  font-weight: 900 !important;
  position: relative;
}

.specialty-hero__title .highlight-certificates::after {
  content: ' 📄';
  font-size: 0.5em;
  display: inline-block;
  animation: doc-wiggle 2.5s ease-in-out infinite;
}

@keyframes doc-wiggle {
  0%, 100% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(-10deg) scale(1.15); }
}

/* Плавающие символы вокруг заголовка */
.specialty-hero__title::before {
  content: '✎';
  position: absolute;
  top: -25px;
  left: -35px;
  font-size: 24px;
  color: var(--cf-amber);
  animation: symbol-float-cf 3s ease-in-out infinite;
}

.specialty-hero__title::after {
  content: '✓';
  position: absolute;
  bottom: -20px;
  right: -25px;
  font-size: 20px;
  color: var(--cf-orange);
  animation: symbol-float-cf 3.5s ease-in-out infinite 0.8s;
}

@keyframes symbol-float-cf {
  0%, 100% { transform: translateY(0) rotate(0deg); opacity: 0.7; }
  50% { transform: translateY(-10px) rotate(10deg); opacity: 1; }
}

/* Иконки фич — разные тёплые цвета */
.specialty-hero__feature:nth-child(1) .specialty-hero__feature-icon {
  background: linear-gradient(135deg, #F57C00, #E65100) !important;
}
.specialty-hero__feature:nth-child(2) .specialty-hero__feature-icon {
  background: linear-gradient(135deg, #FFB300, #FF8F00) !important;
}
.specialty-hero__feature:nth-child(3) .specialty-hero__feature-icon {
  background: linear-gradient(135deg, #26A69A, #00897B) !important;
}
.specialty-hero__feature:nth-child(4) .specialty-hero__feature-icon {
  background: linear-gradient(135deg, #FF7043, #F4511E) !important;
}

/* ========== Section Titles - Warm Underline ========== */
.section-title {
  position: relative;
  display: inline-block;
}

.section-title::after {
  content: '';
  display: block;
  width: 80px;
  height: 5px;
  margin: 12px auto 0;
  border-radius: 10px;
  background: linear-gradient(90deg, #F57C00, #FFB300, #FFB74D, #FF7043);
  animation: gradient-shift-cf 3s ease-in-out infinite;
  background-size: 200% 100%;
}

@keyframes gradient-shift-cf {
  0%, 100% { background-position: 0% 50%; width: 80px; }
  50% { background-position: 100% 50%; width: 120px; }
}

/* ========== Why Section - Warm Cards ========== */
.why-section__card {
  position: relative;
  overflow: visible !important;
}

.why-section__card:nth-child(1) .why-section__card-icon {
  background: linear-gradient(135deg, #F57C00, #E65100) !important;
}

.why-section__card:nth-child(2) .why-section__card-icon {
  background: linear-gradient(135deg, #FFB300, #FF8F00) !important;
}

.why-section__card:nth-child(3) .why-section__card-icon {
  background: linear-gradient(135deg, #26A69A, #00897B) !important;
}

.why-section__card:nth-child(4) .why-section__card-icon {
  background: linear-gradient(135deg, #FF7043, #F4511E) !important;
}

.why-section__card:nth-child(5) .why-section__card-icon {
  background: linear-gradient(135deg, #FFB74D, #FF9800) !important;
}

.why-section__card:nth-child(6) .why-section__card-icon {
  background: linear-gradient(135deg, #F4511E, #D84315) !important;
}

.why-section__card:hover {
  transform: translateY(-10px) scale(1.03) !important;
}

.why-section__card:hover .why-section__card-icon {
  animation: icon-wiggle-cf 0.5s ease-in-out !important;
}

@keyframes icon-wiggle-cf {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-8deg) scale(1.1); }
  50% { transform: rotate(8deg) scale(1.15); }
  75% { transform: rotate(-5deg) scale(1.1); }
}

/* ========== Services Section - Warm Accordion ========== */
.services-section__item:nth-child(1) .services-section__header-icon {
  color: #F57C00 !important;
}
.services-section__item:nth-child(2) .services-section__header-icon {
  color: #FF8F00 !important;
}
.services-section__item:nth-child(3) .services-section__header-icon {
  color: #26A69A !important;
}
.services-section__item:nth-child(4) .services-section__header-icon {
  color: #FF7043 !important;
}
.services-section__item:nth-child(5) .services-section__header-icon {
  color: #FFB300 !important;
}
.services-section__item:nth-child(6) .services-section__header-icon {
  color: #E65100 !important;
}

.services-section__item--active .services-section__header-icon {
  background: linear-gradient(135deg, #F57C00, #FF7043) !important;
  color: white !important;
  animation: icon-pop-cf 0.4s ease-out !important;
}

@keyframes icon-pop-cf {
  0% { transform: scale(0.8); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1.1); }
}

.services-section__list-icon {
  background: linear-gradient(135deg, rgba(245, 124, 0, 0.12), rgba(255, 193, 7, 0.12)) !important;
  color: #F57C00 !important;
}

.services-section__list-form i {
  color: #FF8F00 !important;
}

.services-section__btn {
  background: linear-gradient(135deg, #F57C00, #FF7043) !important;
  box-shadow: 0 4px 20px rgba(245, 124, 0, 0.3) !important;
}

.services-section__btn:hover {
  box-shadow: 0 8px 30px rgba(245, 124, 0, 0.5) !important;
}

/* ========== Portal Section - Warm ========== */
.portal-section__list li {
  border-left: 3px solid #F57C00 !important;
}

.portal-section__list i {
  color: #F57C00 !important;
}

.portal-section__note {
  border-left-color: #F57C00 !important;
}

.portal-section__note i {
  color: #F57C00 !important;
}

.portal-section__logo-card:nth-child(1) i {
  color: #F57C00 !important;
}
.portal-section__logo-card:nth-child(2) i {
  color: #26A69A !important;
}
.portal-section__logo-card:nth-child(3) i {
  color: #FF8F00 !important;
}
.portal-section__logo-card:nth-child(4) i {
  color: #F4511E !important;
}

/* ========== Reviews Section - Warm ========== */
.reviews-section__card-avatar {
  background: linear-gradient(135deg, #F57C00, #FFB300) !important;
}

.reviews-section__card-rating i.filled {
  color: #FFB300 !important;
  animation: star-pop-cf 0.3s ease-out;
}

@keyframes star-pop-cf {
  0% { transform: scale(0.5); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

.reviews-section__card-verified {
  color: #F57C00 !important;
}

.reviews-section__link {
  color: #F57C00 !important;
  background: rgba(245, 124, 0, 0.08) !important;
}

.reviews-section__link:hover {
  background: #F57C00 !important;
  color: white !important;
}

/* ========== CTA Section - Warm Accent ========== */
.cta-section__btn--solid {
  background: linear-gradient(135deg, #F57C00, #FF7043) !important;
  color: white !important;
}

/* ========== Exams Section (обследования) - Warm ========== */
.certificates-exams__card:nth-child(1) .certificates-exams__icon-bg {
  background: linear-gradient(135deg, #F57C00, #FF8F00) !important;
  box-shadow: 0 10px 30px rgba(245, 124, 0, 0.3) !important;
}
.certificates-exams__card:nth-child(2) .certificates-exams__icon-bg {
  background: linear-gradient(135deg, #26A69A, #00897B) !important;
  box-shadow: 0 10px 30px rgba(38, 166, 154, 0.3) !important;
}
.certificates-exams__card:nth-child(3) .certificates-exams__icon-bg {
  background: linear-gradient(135deg, #FFB300, #FF8F00) !important;
  box-shadow: 0 10px 30px rgba(255, 179, 0, 0.3) !important;
}
.certificates-exams__card:nth-child(4) .certificates-exams__icon-bg {
  background: linear-gradient(135deg, #FF7043, #F4511E) !important;
  box-shadow: 0 10px 30px rgba(255, 112, 67, 0.3) !important;
}

.certificates-exams__badge {
  background: linear-gradient(135deg, #F57C00, #FF7043) !important;
  box-shadow: 0 4px 15px rgba(245, 124, 0, 0.3) !important;
}

.certificates-exams__subtitle {
  color: #F57C00 !important;
}

.certificates-exams__list i {
  color: #F57C00 !important;
}

/* ========== Responsive ========== */
@media (max-width: 768px) {
  .specialty-hero__title::before,
  .specialty-hero__title::after {
    display: none;
  }
}