/* Wobble underline on nav/links */
.hf-link{position:relative;text-decoration:none}
.hf-link::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:currentColor;transition:right .35s cubic-bezier(.22,.61,.36,1)}
.hf-link:hover::after{right:0}

/* Fade+slide reveal */
@keyframes hfReveal{from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)}}
.hf-reveal{opacity:0;animation:hfReveal .45s ease-out .05s forwards}

/* Subtle hover tilt/zoom for product visuals */
.hf-tilt{transition:transform .25s ease, box-shadow .25s ease; will-change:transform}
.hf-tilt:hover{transform:translateY(-2px) scale(1.01); box-shadow:0 8px 30px rgba(2,6,23,.12)}

/* Toast */
#hfToast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);background:#111827;color:#fff;padding:10px 14px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.2);opacity:0;pointer-events:none;transition:opacity .25s, transform .25s;z-index:9999}
#hfToast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Admin glass */
.shadow-card { box-shadow: 0 16px 40px rgba(2, 6, 23, .12); }
/* --- Order tracker --- */
.hf-tracker{position:relative}
.hf-tracker__rail{
  position:relative;height:6px;border-radius:9999px;overflow:hidden;
  background:linear-gradient(90deg,#e2e8f0,#cbd5e1);
}
.hf-tracker__fill{
  position:absolute;left:0;top:0;height:100%;width:0%;border-radius:9999px;
  background:linear-gradient(90deg,#10b981,#059669);
  transition:width .8s cubic-bezier(.4,0,.2,1);
}
.hf-step{display:flex;flex-direction:column;align-items:center;gap:.5rem}
.hf-pin{
  width:28px;height:28px;border-radius:9999px;background:#e2e8f0;border:2px solid #cbd5e1;
  display:grid;place-items:center;font-weight:700;color:#64748b;transition:all .3s ease;
  box-shadow:0 6px 18px rgba(2,6,23,.08);
  backdrop-filter:saturate(1.2);
}
.hf-step.done .hf-pin{background:#10b981;color:#fff;border-color:#059669;transform:scale(1.05)}
.hf-step.current .hf-pin{background:#34d399;color:#0f172a;border-color:#10b981;animation:hf-pulse 1.6s infinite}
.hf-label{font-size:.75rem;color:#475569;text-align:center;max-width:7rem}
.hf-date{font-size:.70rem;color:#94a3b8}
@keyframes hf-pulse{
  0%{box-shadow:0 0 0 0 rgba(16,185,129,.45)}
  70%{box-shadow:0 0 0 10px rgba(16,185,129,0)}
  100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}
}
@media (max-width:640px){
  .hf-label{max-width:5rem}
}

.prose-hf{color:#334155;line-height:1.75;font-size:1rem}
.prose-hf h1{font-size:1.875rem;font-weight:800;margin:1.25rem 0 .75rem}
.prose-hf h2{font-size:1.5rem;font-weight:700;margin:1.2rem 0 .6rem}
.prose-hf h3{font-size:1.25rem;font-weight:700;margin:1rem 0 .5rem}
.prose-hf p{margin:.75rem 0}
.prose-hf ul{margin:.75rem 0 .75rem 1.25rem;list-style:disc}
.prose-hf ol{margin:.75rem 0 .75rem 1.25rem;list-style:decimal}
.prose-hf blockquote{border-left:4px solid #10b981;padding-left:.9rem;color:#475569;background:#ecfdf5;margin:1rem 0}
.prose-hf pre,.prose-hf code{background:#0f172a0d;border-radius:.375rem;padding:.2rem .4rem}
.prose-hf pre{padding:.75rem;overflow:auto}
.prose-hf img{max-width:100%;height:auto;border-radius:.5rem;margin:1rem 0}
.prose-hf table{border-collapse:collapse;width:100%;margin:1rem 0}
.prose-hf table td,.prose-hf table th{border:1px solid #e2e8f0;padding:.5rem .6rem}
.prose-hf a{color:#0ea5e9;text-decoration:underline}
.prose-hf iframe{max-width:100%}