/* ==========================================================================
   Site-wide preloader — food / health / fitness theme
   ========================================================================== */

.yfc-preloader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  touch-action: none;
  overscroll-behavior: contain;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #f8f4ec 0%, #eef6f0 45%, #e8f0e4 100%);
  transition: opacity 0.45s ease, visibility 0.45s ease;
}

.yfc-preloader--done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.yfc-preloader__inner {
  text-align: center;
  padding: var(--sp-6);
  max-width: 320px;
}

/* Orbiting food / fitness icons */
.yfc-preloader__stage {
  position: relative;
  width: 148px;
  height: 148px;
  margin: 0 auto var(--sp-5);
}

.yfc-preloader__ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 3px solid rgba(44, 94, 59, 0.12);
}

.yfc-preloader__ring--spin {
  border-color: transparent;
  border-top-color: var(--forest);
  border-right-color: var(--honey);
  animation: yfcSpin 1.1s linear infinite;
}

.yfc-preloader__ring--pulse {
  inset: 10px;
  border-color: rgba(241, 196, 15, 0.25);
  animation: yfcPulse 1.8s ease-in-out infinite;
}

.yfc-preloader__core {
  position: absolute;
  inset: 28px;
  border-radius: 50%;
  background: var(--white);
  box-shadow: 0 8px 28px rgba(44, 94, 59, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: yfcCoreBob 2s ease-in-out infinite;
}

.yfc-preloader__core img {
  background: transparent;
  width: 52px;
  height: 52px;
  object-fit: contain;
}

.yfc-preloader__orbit {
  position: absolute;
  inset: -4px;
  animation: yfcSpin 4s linear infinite reverse;
}

.yfc-preloader__icon {
  position: absolute;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--white);
  box-shadow: 0 4px 14px rgba(44, 94, 59, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  line-height: 1;
}

.yfc-preloader__icon--1 { top: 0; left: 50%; transform: translateX(-50%); }
.yfc-preloader__icon--2 { top: 50%; right: 0; transform: translateY(-50%); }
.yfc-preloader__icon--3 { bottom: 0; left: 50%; transform: translateX(-50%); }
.yfc-preloader__icon--4 { top: 50%; left: 0; transform: translateY(-50%); }

.yfc-preloader__brand {
  font-family: var(--font-heading, 'Playfair Display', serif);
  font-size: var(--text-2xl);
  font-weight: 800;
  letter-spacing: 0.08em;
  margin: 0 0 var(--sp-1);
  background: linear-gradient(135deg, #2C5E3B 0%, #7E9F3D 48%, #F1C40F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.yfc-preloader__tagline {
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--matcha);
  margin: 0 0 var(--sp-2);
}

.yfc-preloader__text {
  font-size: var(--text-sm);
  color: var(--cacao-light);
  margin: 0 0 var(--sp-4);
  min-height: 1.4em;
  animation: yfcTextFade 2.4s ease-in-out infinite;
}

.yfc-preloader__bar {
  width: 180px;
  height: 5px;
  margin: 0 auto;
  background: rgba(44, 94, 59, 0.1);
  border-radius: 999px;
  overflow: hidden;
}

.yfc-preloader__bar span {
  display: block;
  height: 100%;
  width: 40%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--forest), var(--honey));
  animation: yfcBarSlide 1.2s ease-in-out infinite;
}

@keyframes yfcSpin {
  to { transform: rotate(360deg); }
}

@keyframes yfcPulse {
  0%, 100% { transform: scale(1); opacity: 0.6; }
  50% { transform: scale(1.04); opacity: 1; }
}

@keyframes yfcCoreBob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@keyframes yfcBarSlide {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}

@keyframes yfcTextFade {
  0%, 100% { opacity: 0.65; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .yfc-preloader__ring--spin,
  .yfc-preloader__orbit,
  .yfc-preloader__core,
  .yfc-preloader__bar span,
  .yfc-preloader__text {
    animation: none;
  }
}