/* ══ Loading Screen ══ */
.loading-screen{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:100vh;background:var(--ink);gap:12px;padding:20px;
}
.ls-logo{animation:lsLogoIn .9s cubic-bezier(.34,1.56,.64,1) forwards;opacity:0;transform:scale(.45);}
@keyframes lsLogoIn{to{opacity:1;transform:scale(1);}}
.ls-text{
  color:rgba(255,255,255,.75);font-family:'Tajawal',sans-serif;font-size:16px;
  animation:lsFadeUp .5s .65s ease forwards;opacity:0;transform:translateY(8px);
}
@keyframes lsFadeUp{to{opacity:1;transform:translateY(0);}}
.ls-dots{display:inline-flex;gap:7px;animation:lsFadeUp .4s .95s ease forwards;opacity:0;}
.ls-dot{
  width:7px;height:7px;border-radius:50%;background:var(--brass);
  animation:lsDot 1.4s 1.1s infinite ease-in-out;
}
.ls-dot:nth-child(2){animation-delay:1.3s;}.ls-dot:nth-child(3){animation-delay:1.5s;}
@keyframes lsDot{0%,80%,100%{transform:scale(.6);opacity:.3;}40%{transform:scale(1.25);opacity:1;}}

﻿/* ========== Logo Animation ========== */
.logo-svg-wrap{display:block;line-height:0;}
.logo-svg-wrap svg{display:block;}
/* Draw-on animation for logo paths */
@keyframes logoDraw{
  from{opacity:0;transform:scaleX(.82) translateX(6px);}
  to{opacity:1;transform:scaleX(1) translateX(0);}
}
@keyframes logoGlow{
  0%,100%{filter:drop-shadow(0 0 0px transparent);}
  50%{filter:drop-shadow(0 0 7px rgba(198,139,62,.55));}
}
.logo-svg-wrap svg{
  animation:logoDraw .55s cubic-bezier(.22,1,.36,1) both, logoGlow 3.5s ease-in-out 1.2s infinite;
  transform-origin:center;
}
.logo:hover .logo-svg-wrap svg{
  filter:drop-shadow(0 0 10px rgba(224,174,99,.7)) !important;
  transition:filter .3s;
}
/* ========== Page / Section Transitions ========== */
@keyframes fadeUp{
  from{opacity:0;transform:translateY(18px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes fadeIn{
  from{opacity:0;}
  to{opacity:1;}
}
.page-anim{animation:fadeUp .38s cubic-bezier(.22,1,.36,1) both;}
.hero-anim{animation:fadeIn .5s ease both;}
/* Cards stagger */
@keyframes cardPop{
  from{opacity:0;transform:translateY(22px) scale(.97);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
.pcard{animation:cardPop .35s cubic-bezier(.22,1,.36,1) both;}
.pcard:nth-child(1){animation-delay:.03s;}
.pcard:nth-child(2){animation-delay:.07s;}
.pcard:nth-child(3){animation-delay:.11s;}
.pcard:nth-child(4){animation-delay:.15s;}
.pcard:nth-child(5){animation-delay:.18s;}
.pcard:nth-child(6){animation-delay:.20s;}
.pcard:nth-child(n+7){animation-delay:.22s;}
/* Panel pop */
.panel{animation:fadeUp .32s cubic-bezier(.22,1,.36,1) both;}
/* Stat cards */
.stat-card{animation:cardPop .35s cubic-bezier(.22,1,.36,1) both;}
.stat-card:nth-child(1){animation-delay:.04s;}
.stat-card:nth-child(2){animation-delay:.09s;}
.stat-card:nth-child(3){animation-delay:.14s;}
.stat-card:nth-child(n+4){animation-delay:.18s;}
/* Button press feel */
.btn{transition:.18s;will-change:transform;}
.btn:active{transform:scale(.96);}
/* Cat chips */
.cat-chip{transition:.2s;}
/* Toast */
#toast{transition:opacity .22s,transform .22s;}
/* Header tabs */
nav.maintabs button{transition:.18s;}
/* Cart badge pulse */
@keyframes badgePulse{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.18);}
}
.cart-badge{animation:badgePulse 1.6s ease-in-out infinite;}