feat: mobile UX, admin polish, rate limiting, and media assets

- Mobile responsiveness improvements across admin and public sections
- Admin: bookings modal, open-day page, team page, layout polish
- Added rate limiting, CSRF hardening, auth-edge improvements
- Scroll reveal, floating contact, back-to-top, Yandex map fixes
- Schedule filters refactor, team profile/info component updates
- New useTrainerPhotos hook
- Added class, team, master-class, and news images

src/components/sections/MasterClasses.tsx

@@ -6,6 +6,7 @@ import { Calendar, Clock, User, MapPin, Instagram, X } from "lucide-react";
 import { SectionHeading } from "@/components/ui/SectionHeading";
 import { Reveal } from "@/components/ui/Reveal";
 import { SignupModal } from "@/components/ui/SignupModal";
+import { useFocusTrap } from "@/hooks/useFocusTrap";
 import type { SiteContent, MasterClassItem, MasterClassSlot, ScheduleLocation } from "@/types";
 import { formatMarkup } from "@/lib/markup";
 
@@ -119,6 +120,7 @@ function MasterClassDetail({
   const slots = item.slots ?? [];
   const duration = slots[0] ? calcDuration(slots[0]) : "";
   const locAddress = locations?.find(l => l.name === item.location)?.address;
+  const focusTrapRef = useFocusTrap<HTMLDivElement>(true);
 
   useEffect(() => {
     document.body.style.overflow = "hidden";
@@ -130,6 +132,7 @@ function MasterClassDetail({
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/70 backdrop-blur-sm" onClick={onClose}>
       <div
+        ref={focusTrapRef}
         role="dialog"
         aria-modal="true"
         aria-label={item.title}
@@ -158,7 +161,7 @@ function MasterClassDetail({
             <button
               onClick={onClose}
               aria-label="Закрыть"
-              className="h-9 w-9 flex items-center justify-center rounded-full text-white/50 hover:text-white hover:bg-white/10 transition-colors shrink-0 -mr-2"
+              className="h-11 w-11 flex items-center justify-center rounded-full text-white/50 hover:text-white hover:bg-white/10 transition-colors shrink-0 -mr-2"
             >
               <X size={18} />
             </button>
@@ -264,7 +267,13 @@ function MasterClassCard({
   const isFull = maxP > 0 && currentRegs >= maxP;
 
   return (
-    <div className="group relative flex w-full max-w-sm flex-col overflow-hidden rounded-2xl bg-black cursor-pointer" onClick={onDetail}>
+    <div
+      className="group relative flex w-full max-w-sm flex-col overflow-hidden rounded-2xl bg-black cursor-pointer"
+      onClick={onDetail}
+      onKeyDown={(e) => { if (e.key === "Enter" || e.key === " ") { e.preventDefault(); onDetail(); } }}
+      role="button"
+      tabIndex={0}
+    >
       {/* Full-bleed image or placeholder */}
       <div className="relative aspect-[3/4] sm:aspect-[2/3] w-full overflow-hidden">
         {item.image ? (
@@ -425,9 +434,9 @@ export function MasterClasses({ data, regCounts = {}, popups, locations }: Maste
             </div>
           ) : (
             <div className="mx-auto mt-10 flex max-w-5xl flex-wrap justify-center gap-5">
-              {upcoming.map((item) => (
+              {upcoming.map((item, idx) => (
                 <MasterClassCard
-                  key={item.title}
+                  key={`${item.title}-${idx}`}
                   item={item}
                   currentRegs={regCounts[item.title] ?? 0}
                   onSignup={() => setSignupTitle(item.title)}