{"id":76,"date":"2026-03-25T12:55:52","date_gmt":"2026-03-25T12:55:52","guid":{"rendered":"https:\/\/aruk.qtechdemo.website\/?page_id=76"},"modified":"2026-03-26T09:13:41","modified_gmt":"2026-03-26T09:13:41","slug":"home","status":"publish","type":"page","link":"https:\/\/aruk.qtechdemo.website\/","title":{"rendered":"home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Arthur Murray London | Ballroom, Latin & Wedding Dance<\/title>\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Inter:wght@300;400;600;700&display=swap\" rel=\"stylesheet\">\r\n <style>\r\n \/* Force Brand Colors - Override Elementor & Theme Defaults *\/\r\n :root {\r\n --am-red: #d2020a !important;\r\n --am-black: #1a1a1a !important;\r\n --am-white: #ffffff !important;\r\n --am-gray: #f8f8f8 !important;\r\n }\r\n\r\n body {\r\n font-family: 'Inter', sans-serif !important;\r\n background-color: var(--am-white) !important;\r\n color: var(--am-black) !important;\r\n margin: 0;\r\n padding: 0;\r\n overflow-x: hidden;\r\n }\r\n\r\n h1, h2, h3, .font-serif {\r\n font-family: 'Playfair Display', serif !important;\r\n }\r\n\r\n \/* Override Elementor interference *\/\r\n .text-am-red { color: var(--am-red) !important; }\r\n .bg-am-red { background-color: var(--am-red) !important; }\r\n .border-am-red { border-color: var(--am-red) !important; }\r\n\r\n \/* Custom Animations *\/\r\n .reveal {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n transition: all 0.8s ease-out;\r\n }\r\n\r\n .reveal.active {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .star-sparkle {\r\n animation: sparkle 2s infinite;\r\n }\r\n\r\n @keyframes sparkle {\r\n 0%, 100% { opacity: 1; transform: scale(1); }\r\n 50% { opacity: 0.5; transform: scale(1.2); }\r\n }\r\n\r\n \/* Hero Selection Screen *\/\r\n #hero-bg {\r\n transition: background-image 0.8s cubic-bezier(0.4, 0, 0.2, 1);\r\n background-size: cover;\r\n background-position: center;\r\n }\r\n\r\n .dance-selector {\r\n transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n cursor: pointer;\r\n position: relative;\r\n padding: 0.5rem 1rem;\r\n border-radius: 4px;\r\n }\r\n\r\n .dance-selector.active {\r\n color: var(--am-red) !important;\r\n transform: scale(1.2) translateX(10px);\r\n text-shadow: 0 0 15px rgba(210, 2, 10, 0.5);\r\n }\r\n\r\n .dance-selector:hover {\r\n color: white !important;\r\n letter-spacing: 0.15em;\r\n }\r\n\r\n \/* Dynamic Swimming Animation *\/\r\n @keyframes swim-1 {\r\n 0%, 100% { transform: translate(0, 0); }\r\n 33% { transform: translate(5px, -15px); }\r\n 66% { transform: translate(-5px, -5px); }\r\n }\r\n @keyframes swim-2 {\r\n 0%, 100% { transform: translate(0, 0); }\r\n 33% { transform: translate(-8px, -10px); }\r\n 66% { transform: translate(8px, -15px); }\r\n }\r\n\r\n .swim-item-1 { animation: swim-1 6s ease-in-out infinite; }\r\n .swim-item-2 { animation: swim-2 8s ease-in-out infinite; }\r\n\r\n \/* Dance Cards *\/\r\n .dance-card {\r\n display: flex;\r\n flex-direction: column;\r\n height: 100%; \r\n transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n background: white !important;\r\n box-shadow: 0 10px 30px rgba(0,0,0,0.05);\r\n border-radius: 1.5rem;\r\n overflow: hidden;\r\n }\r\n\r\n .dance-card:hover {\r\n transform: translateY(-10px);\r\n box-shadow: 0 20px 40px rgba(0,0,0,0.1);\r\n }\r\n\r\n .dance-card-img-container {\r\n height: 240px;\r\n overflow: hidden;\r\n position: relative;\r\n }\r\n\r\n .dance-card-img-container img {\r\n width: 100% !important;\r\n height: 100% !important;\r\n object-fit: cover !important; \r\n }\r\n\r\n .dance-card-content {\r\n padding: 1.75rem !important;\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n background: white !important;\r\n }\r\n\r\n .dance-title {\r\n font-size: 1.5rem !important;\r\n font-weight: 700 !important;\r\n line-height: 1.2 !important;\r\n margin-bottom: 0.75rem !important;\r\n color: var(--am-black) !important;\r\n }\r\n\r\n .am-btn {\r\n background-color: var(--am-red) !important;\r\n color: white !important;\r\n padding: 0.75rem 1rem !important;\r\n border-radius: 0.5rem !important;\r\n font-weight: 700 !important;\r\n text-transform: uppercase !important;\r\n letter-spacing: 0.1em !important;\r\n font-size: 0.75rem !important;\r\n transition: all 0.3s ease !important;\r\n width: 100% !important;\r\n display: block !important;\r\n text-align: center !important;\r\n border: none !important;\r\n margin-top: 1rem !important;\r\n }\r\n\r\n .am-btn:hover {\r\n background-color: var(--am-black) !important;\r\n transform: scale(1.02);\r\n }\r\n\r\n \/* Video Section *\/\r\n .video-container {\r\n position: relative;\r\n width: 100%;\r\n height: 100vh !important;\r\n overflow: hidden;\r\n }\r\n\r\n .video-bg {\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n min-width: 100%;\r\n min-height: 100%;\r\n width: auto;\r\n height: auto;\r\n transform: translate(-50%, -50%);\r\n z-index: 0;\r\n object-fit: cover;\r\n }\r\n\r\n .video-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0, 0, 0, 0.6);\r\n z-index: 1;\r\n }\r\n\r\n .video-content {\r\n position: relative;\r\n z-index: 2;\r\n height: 100%;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n color: white;\r\n text-align: center;\r\n padding: 0 1.5rem;\r\n }\r\n\r\n \/* Benefit Circle Styling *\/\r\n .benefit-circle {\r\n width: 70px;\r\n height: 70px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 50%;\r\n border: 2px solid white !important;\r\n font-weight: bold;\r\n font-size: 1.25rem;\r\n margin-bottom: 1rem;\r\n transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n color: white !important;\r\n }\r\n\r\n .benefit-card:hover .benefit-circle {\r\n background-color: var(--am-red) !important;\r\n border-color: var(--am-red) !important;\r\n transform: rotateY(360deg);\r\n }\r\n\r\n \/* Gallery *\/\r\n .gallery-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n gap: 15px;\r\n padding: 15px;\r\n }\r\n\r\n .gallery-item {\r\n position: relative;\r\n height: 350px;\r\n overflow: hidden;\r\n background: #000;\r\n clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);\r\n transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);\r\n }\r\n\r\n .gallery-item:nth-child(even) {\r\n clip-path: polygon(0 10%, 100% 0, 100% 100%, 0% 100%);\r\n }\r\n\r\n .gallery-item img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n opacity: 0.8;\r\n transition: transform 0.8s ease;\r\n }\r\n\r\n .gallery-item:hover {\r\n clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);\r\n z-index: 10;\r\n }\r\n\r\n .gallery-item:hover img {\r\n transform: scale(1.1);\r\n opacity: 1;\r\n }\r\n\r\n \/* Slim Header Style *\/\r\n nav {\r\n background: white !important;\r\n color: var(--am-black) !important;\r\n padding-top: 0.5rem;\r\n padding-bottom: 0.5rem;\r\n border-bottom: 1px solid #f0f0f0;\r\n }\r\n\r\n \/* Sidebar Side Menus *\/\r\n .sidebar-left, .sidebar-right {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 2.5rem;\r\n font-weight: 900;\r\n font-style: italic;\r\n text-transform: uppercase;\r\n letter-spacing: 0.15em;\r\n font-size: 1.15rem;\r\n }\r\n\r\n \/* --- GLASS SHATTER EFFECT (AUTO-SHATTER & RECONNECT) --- *\/\r\n .glass-container {\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n min-height: 480px;\r\n overflow: hidden;\r\n background: #000;\r\n transition: all 0.5s ease;\r\n }\r\n\r\n .glass-shard {\r\n position: absolute;\r\n inset: 0;\r\n background-image: url('https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/ChatGPT-Image-Mar-25-2026-04_30_33-PM.png');\r\n background-size: cover;\r\n background-position: center;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n transition: all 1.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n filter: brightness(0.4) contrast(1.1) grayscale(0.2);\r\n border: 1px solid rgba(255,255,255,0.05);\r\n overflow: hidden;\r\n z-index: 10;\r\n }\r\n\r\n \/* Initial Clipping Masks *\/\r\n .shard-1 { clip-path: polygon(0 0, 100% 0, 48% 48%, 0 25%); }\r\n .shard-2 { clip-path: polygon(100% 0, 100% 85%, 48% 48%); }\r\n .shard-3 { clip-path: polygon(0 25%, 48% 48%, 40% 100%, 0 100%); }\r\n .shard-4 { clip-path: polygon(48% 48%, 100% 85%, 100% 100%, 40% 100%); }\r\n\r\n \/* Reflection glint effect *\/\r\n .glass-shard::after {\r\n content: '';\r\n position: absolute;\r\n top: -100%;\r\n left: -100%;\r\n width: 300%;\r\n height: 300%;\r\n background: linear-gradient(\r\n 45deg,\r\n transparent 45%,\r\n rgba(255, 255, 255, 0.05) 48%,\r\n rgba(255, 255, 255, 0.15) 50%,\r\n rgba(255, 255, 255, 0.05) 52%,\r\n transparent 55%\r\n );\r\n pointer-events: none;\r\n z-index: 55;\r\n opacity: 0;\r\n transition: opacity 0.5s ease;\r\n }\r\n\r\n \/* --- STATE: CONNECTED (IS-ACTIVE) --- *\/\r\n .glass-shard.is-active, .glass-container:hover .glass-shard {\r\n filter: brightness(1) contrast(1.1) grayscale(0);\r\n clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important;\r\n transform: translate(0, 0) scale(1) !important;\r\n border: none;\r\n z-index: 50;\r\n }\r\n\r\n .glass-shard.is-active::after {\r\n opacity: 1;\r\n animation: glass-reflection 3s infinite linear;\r\n }\r\n\r\n @keyframes glass-reflection {\r\n 0% { transform: translateX(-100%) translateY(-100%); }\r\n 40%, 100% { transform: translateX(100%) translateY(100%); }\r\n }\r\n\r\n \/* --- STATE: SHATTERED (IS-AWAY) --- *\/\r\n .glass-shard.is-away {\r\n opacity: 0.5;\r\n filter: brightness(0.3) blur(2px);\r\n }\r\n .shard-1.is-away { transform: translate(-60px, -60px) rotate(-10deg); }\r\n .shard-2.is-away { transform: translate(60px, -40px) rotate(10deg); }\r\n .shard-3.is-away { transform: translate(-40px, 60px) rotate(-5deg); }\r\n .shard-4.is-away { transform: translate(80px, 40px) rotate(15deg); }\r\n\r\n .shard-inner {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n text-align: center;\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n }\r\n\r\n .shard-content {\r\n color: white;\r\n font-weight: 900;\r\n text-transform: uppercase;\r\n letter-spacing: 0.25em;\r\n font-size: clamp(0.75rem, 2.5vw, 1.1rem);\r\n text-shadow: 0 4px 15px rgba(0,0,0,1);\r\n transition: all 0.6s ease;\r\n position: relative;\r\n z-index: 60;\r\n opacity: 0.3;\r\n }\r\n\r\n \/* Position content for the shards *\/\r\n .shard-1 .shard-content { transform: translateY(-25%) translateX(10%); }\r\n .shard-2 .shard-content { transform: translateX(25%) translateY(10%); }\r\n .shard-3 .shard-content { transform: translateY(25%) translateX(-15%); }\r\n .shard-4 .shard-content { transform: translateY(30%) translateX(15%); }\r\n\r\n .glass-shard.is-active .shard-content, .glass-container:hover .shard-content {\r\n opacity: 1;\r\n transform: scale(1.1) translate(0,0);\r\n text-shadow: 0 0 20px rgba(255,255,255,0.6);\r\n }\r\n\r\n \/* Mobile specific spacing fixes *\/\r\n @media (max-width: 768px) {\r\n .section-py { padding-top: 3rem; padding-bottom: 3rem; }\r\n .mobile-center-text { text-align: center !important; }\r\n \r\n .history-section {\r\n padding-top: 2.5rem !important;\r\n padding-bottom: 2.5rem !important;\r\n min-height: auto !important;\r\n height: auto !important;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n .history-title {\r\n font-size: 1.1rem !important; \r\n line-height: 1.4 !important;\r\n margin-bottom: 0.75rem !important;\r\n }\r\n .history-sub {\r\n font-size: 0.75rem !important; \r\n line-height: 1.4;\r\n }\r\n .history-line {\r\n margin: 0.75rem auto !important;\r\n width: 25px !important;\r\n }\r\n\r\n .glass-container { min-height: 400px; }\r\n .shard-content { font-size: 0.65rem; letter-spacing: 0.15em; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"antialiased\">\r\n\r\n <!-- Navigation -->\r\n <nav id=\"mainNav\" class=\"sticky top-0 w-full z-50 px-4 md:px-12\">\r\n <div class=\"max-w-7xl mx-auto flex justify-between items-center\">\r\n <div class=\"flex items-center justify-start shrink-0\" style=\"width: 120px; height: 60px;\">\r\n <img decoding=\"async\" id=\"mainNavLogo\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/R.png\" alt=\"Arthur Murray Logo\" class=\"w-full h-full object-contain\">\r\n <\/div>\r\n \r\n <div class=\"hidden lg:flex items-center space-x-8 font-medium uppercase text-[10px] tracking-widest text-zinc-900\">\r\n <a href=\"#\" class=\"hover:text-am-red transition\">Home<\/a>\r\n <a href=\"#about\" class=\"hover:text-am-red transition\">About Us<\/a>\r\n <a href=\"#dances\" class=\"hover:text-am-red transition\">Dances<\/a>\r\n <a href=\"#benefits\" class=\"hover:text-am-red transition\">Benefits<\/a>\r\n <a href=\"#wedding\" class=\"hover:text-am-red transition\">Wedding<\/a>\r\n <a href=\"#gallery\" class=\"hover:text-am-red transition\">Gallery<\/a>\r\n <a href=\"#contact\" class=\"hover:text-am-red transition\">Contact<\/a>\r\n\r\n <button class=\"bg-am-red text-white px-5 py-2 rounded-full font-bold text-[10px] uppercase tracking-widest shadow-lg ml-4 hover:scale-105 transition\">\r\n Enquire Now\r\n <\/button>\r\n <\/div>\r\n\r\n <button id=\"mobile-toggle\" class=\"lg:hidden p-2 text-zinc-900 focus:outline-none\">\r\n <svg class=\"w-7 h-7\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\"><\/path><\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/nav>\r\n\r\n <!-- Mobile Menu Overlay -->\r\n <div id=\"mobile-overlay\" class=\"fixed inset-0 bg-white z-[60] transform translate-x-full transition-transform duration-500 flex flex-col items-center justify-center space-y-8 text-zinc-950\">\r\n <button id=\"mobile-close\" class=\"absolute top-8 right-8\">\r\n <svg class=\"w-8 h-8\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"><\/path><\/svg>\r\n <\/button>\r\n <a href=\"#\" class=\"text-xl uppercase tracking-[0.2em] hover:text-am-red mobile-link\">Home<\/a>\r\n <a href=\"#about\" class=\"text-xl uppercase tracking-[0.2em] hover:text-am-red mobile-link\">About Us<\/a>\r\n <a href=\"#dances\" class=\"text-xl uppercase tracking-[0.2em] hover:text-am-red mobile-link\">Dances<\/a>\r\n <a href=\"#gallery\" class=\"text-xl uppercase tracking-[0.2em] hover:text-am-red mobile-link\">Gallery<\/a>\r\n <a href=\"#contact\" class=\"text-xl uppercase tracking-[0.2em] hover:text-am-red mobile-link\">Contact<\/a>\r\n <button class=\"bg-am-red text-white px-8 py-3 rounded-full font-bold text-xs uppercase tracking-widest\">Enquire Now<\/button>\r\n <\/div>\r\n\r\n <!-- Hero Section -->\r\n <section id=\"hero-bg\" class=\"relative h-screen w-full flex items-center justify-center overflow-hidden\" style=\"background-image: url('https:\/\/images.unsplash.com\/photo-1547153760-18fc86324498?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80');\">\r\n <div class=\"absolute inset-0 bg-black\/60 z-0\"><\/div>\r\n \r\n <div class=\"absolute left-10 z-20 hidden xl:flex sidebar-left\">\r\n <div class=\"dance-selector swim-item-1 text-white\/40\" onclick=\"changeHero(this, 'Tango', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/argentine-tango_compressed.webp')\">Tango<\/div>\r\n <div class=\"dance-selector swim-item-2 text-white\/40\" onclick=\"changeHero(this, 'Waltz', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/waltz_compressed.webp')\">Waltz<\/div>\r\n <div class=\"dance-selector swim-item-1 text-white\/40\" onclick=\"changeHero(this, 'Foxtrot', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/4th-asian-indoor-martial-arts-games-day-6-172621145-5c770ef146e0fb00011bf24e.jpg')\">Foxtrot<\/div>\r\n <\/div>\r\n\r\n <div class=\"text-center text-white z-10 px-6 relative w-full max-w-4xl\">\r\n <div class=\"mb-4\">\r\n <svg class=\"w-12 h-12 md:w-16 md:h-16 mx-auto text-am-red star-sparkle\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M12 1L14.39 8.26H22L15.81 12.75L18.19 20L12 15.52L5.81 20L8.19 12.75L2 8.26H9.61L12 1Z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <h1 class=\"text-4xl md:text-8xl font-bold mb-4 uppercase tracking-tighter leading-tight\">\r\n Feel like a <span class=\"italic text-am-red\">star<\/span>\r\n <\/h1>\r\n <h2 id=\"hero-dance-title\" class=\"text-xl md:text-5xl font-serif italic text-white\/90 transition-all duration-500\">\r\n Choose Your Experience\r\n <\/h2>\r\n <div class=\"mt-8 md:mt-12\">\r\n <button class=\"bg-am-red hover:bg-red-700 text-white px-8 md:px-12 py-4 md:py-5 rounded-full text-sm md:text-lg font-bold transition-all shadow-2xl uppercase tracking-widest border-2 border-am-red\">\r\n Start Dancing\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"absolute right-10 z-20 hidden xl:flex sidebar-right text-right\">\r\n <div class=\"dance-selector swim-item-2 text-white\/40\" onclick=\"changeHero(this, 'Cha Cha', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/ScreenShot2022-06-29at3.34.38pm.webp')\">Cha Cha<\/div>\r\n <div class=\"dance-selector swim-item-1 text-white\/40\" onclick=\"changeHero(this, 'Rumba', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/Image16_HMS-1024x559-1.webp')\">Rumba<\/div>\r\n <div class=\"dance-selector swim-item-2 text-white\/40\" onclick=\"changeHero(this, 'Wedding', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/390b425e6132b551fd52ba9c96d7fb7f.jpg')\">Wedding<\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- About Section (Learn to Dance) with Exploding & Reconnecting Glass -->\r\n <section id=\"about\" class=\"section-py py-16 md:py-32 px-6 md:px-12 bg-white relative overflow-hidden\">\r\n <div class=\"hidden lg:block absolute top-0 right-0 w-1\/3 h-full bg-zinc-50 z-0\"><\/div>\r\n \r\n <div class=\"max-w-7xl mx-auto relative z-10\">\r\n <div class=\"flex flex-col lg:flex-row gap-12 lg:gap-20 items-center\">\r\n \r\n <!-- Shatter Cycle Container -->\r\n <div class=\"w-full lg:w-1\/2 reveal\">\r\n <div class=\"relative\">\r\n <div class=\"absolute -top-4 -left-4 w-full h-full border-2 border-am-red rounded-2xl z-0 hidden md:block\"><\/div>\r\n <div class=\"relative z-10 overflow-hidden rounded-2xl shadow-2xl glass-container\">\r\n \r\n <div class=\"glass-shard shard-1\" data-shard=\"0\">\r\n <div class=\"shard-inner\">\r\n <div class=\"shard-content\">Private<br>Lessons<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"glass-shard shard-2\" data-shard=\"1\">\r\n <div class=\"shard-inner\">\r\n <div class=\"shard-content\">Group<br>Classes<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"glass-shard shard-3\" data-shard=\"2\">\r\n <div class=\"shard-inner\">\r\n <div class=\"shard-content\">Practice<br>Sessions<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"glass-shard shard-4\" data-shard=\"3\">\r\n <div class=\"shard-inner\">\r\n <div class=\"shard-content\">Social<br>Events<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <div class=\"absolute -bottom-6 -right-6 bg-am-red text-white p-6 rounded-xl shadow-xl z-[60] hidden md:block\">\r\n <span class=\"block text-4xl font-bold\">100+<\/span>\r\n <span class=\"text-[10px] uppercase tracking-widest font-bold\">Years of expertise<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Text Side -->\r\n <div class=\"w-full lg:w-1\/2 reveal\">\r\n <span class=\"text-am-red font-bold tracking-[0.3em] uppercase mb-4 block text-xs\">Our Heritage<\/span>\r\n <h2 class=\"text-3xl md:text-5xl lg:text-6xl font-bold mb-8 leading-[1.1] text-zinc-900\">\r\n Learn to Dance with <br class=\"hidden md:block\"> <span class=\"italic font-serif text-am-red\">Arthur Murray<\/span>\r\n <\/h2>\r\n <div class=\"space-y-6 text-zinc-600 text-base md:text-lg leading-relaxed\">\r\n <p class=\"font-medium text-zinc-800\">Looking to master the art of dance in London? Whether you\u2019re a complete beginner or looking to refine your technique, we offer a premier environment designed for your success.<\/p>\r\n <p>As part of the world-renowned Arthur Murray International Dance Studios, we bring a legacy of excellence to students of all levels. Our unique method makes learning to dance fast, fun, and easy.<\/p>\r\n \r\n <div class=\"pt-8\">\r\n <a href=\"#contact\" class=\"inline-block border-b-2 border-am-red pb-1 text-am-red font-bold uppercase tracking-widest text-sm hover:text-zinc-900 hover:border-zinc-900 transition\">\r\n Discover our method →\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Ballroom & Latin Section -->\r\n <section id=\"dances\" class=\"section-py py-16 md:py-24 px-6 md:px-12 bg-zinc-50\">\r\n <div class=\"max-w-7xl mx-auto mb-12 md:mb-16 reveal mobile-center-text\">\r\n <span class=\"text-am-red font-bold tracking-widest uppercase mb-2 block text-xs\">Dances we teach<\/span>\r\n <h2 class=\"text-4xl md:text-6xl font-bold text-zinc-900\">Ballroom & <span class=\"italic font-serif\">Latin<\/span><\/h2>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 md:gap-8\">\r\n <div class=\"dance-card reveal\">\r\n <div class=\"dance-card-img-container\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/Tango.webp\" alt=\"Tango\">\r\n <\/div>\r\n <div class=\"dance-card-content\">\r\n <div>\r\n <h3 class=\"dance-title\">Tango<\/h3>\r\n <p class=\"text-zinc-500 text-sm\">Master the passionate and dramatic movements of the Argentine classic.<\/p>\r\n <\/div>\r\n <button class=\"am-btn\">Learn More<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"dance-card reveal\" style=\"transition-delay: 0.1s;\">\r\n <div class=\"dance-card-img-container\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/Waltz.webp\" alt=\"Waltz\">\r\n <\/div>\r\n <div class=\"dance-card-content\">\r\n <div>\r\n <h3 class=\"dance-title\">Waltz<\/h3>\r\n <p class=\"text-zinc-500 text-sm\">Experience the grace and elegance of the most timeless ballroom dance.<\/p>\r\n <\/div>\r\n <button class=\"am-btn\">Learn More<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"dance-card reveal\" style=\"transition-delay: 0.2s;\">\r\n <div class=\"dance-card-img-container\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/Foxtrot-1.webp\" alt=\"Foxtrot\">\r\n <\/div>\r\n <div class=\"dance-card-content\">\r\n <div>\r\n <h3 class=\"dance-title\">Foxtrot<\/h3>\r\n <p class=\"text-zinc-500 text-sm\">A smooth, progressive dance characterized by long, flowing movements.<\/p>\r\n <\/div>\r\n <button class=\"am-btn\">Learn More<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"dance-card reveal\" style=\"transition-delay: 0.3s;\">\r\n <div class=\"dance-card-img-container\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/ChaCha.webp\" alt=\"Cha Cha\">\r\n <\/div>\r\n <div class=\"dance-card-content\">\r\n <div>\r\n <h3 class=\"dance-title\">Cha Cha<\/h3>\r\n <p class=\"text-zinc-500 text-sm\">A sassy and rhythmic Latin dance that brings joy to every step.<\/p>\r\n <\/div>\r\n <button class=\"am-btn\">Learn More<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Benefits Section -->\r\n <section id=\"benefits\" class=\"video-container\">\r\n <video autoplay muted loop playsinline class=\"video-bg\">\r\n <source src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/arthur.mp4\" type=\"video\/mp4\">\r\n <\/video>\r\n <div class=\"video-overlay\"><\/div>\r\n <div class=\"video-content\">\r\n <div class=\"max-w-4xl mx-auto w-full\">\r\n <h2 class=\"text-2xl md:text-5xl font-bold italic mb-10 md:mb-16\">\"Dancing is a main element of social activity\"<\/h2>\r\n <div class=\"grid grid-cols-2 md:grid-cols-4 gap-6 md:gap-12\">\r\n <div class=\"benefit-card flex flex-col items-center reveal\">\r\n <div class=\"benefit-circle\">01<\/div>\r\n <h3 class=\"font-bold text-white uppercase tracking-widest text-[10px] md:text-xs\">Confidence<\/h3>\r\n <\/div>\r\n <div class=\"benefit-card flex flex-col items-center reveal\" style=\"transition-delay: 0.1s;\">\r\n <div class=\"benefit-circle\">02<\/div>\r\n <h3 class=\"font-bold text-white uppercase tracking-widest text-[10px] md:text-xs\">Friendship<\/h3>\r\n <\/div>\r\n <div class=\"benefit-card flex flex-col items-center reveal\" style=\"transition-delay: 0.2s;\">\r\n <div class=\"benefit-circle\">03<\/div>\r\n <h3 class=\"font-bold text-white uppercase tracking-widest text-[10px] md:text-xs\">Health<\/h3>\r\n <\/div>\r\n <div class=\"benefit-card flex flex-col items-center reveal\" style=\"transition-delay: 0.3s;\">\r\n <div class=\"benefit-circle\">04<\/div>\r\n <h3 class=\"font-bold text-white uppercase tracking-widest text-[10px] md:text-xs\">Happiness<\/h3>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Wedding Section -->\r\n <section id=\"wedding\" class=\"section-py py-16 md:py-24 px-6 md:px-12 bg-white\">\r\n <div class=\"max-w-7xl mx-auto grid md:grid-cols-2 gap-10 md:gap-16 items-center\">\r\n <div class=\"order-2 md:order-1 reveal\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/ChatGPT-Image-Mar-17-2026-12_42_34-PM.png\" alt=\"Wedding\" class=\"rounded-2xl shadow-2xl w-full h-[350px] md:h-[500px] object-cover\">\r\n <\/div>\r\n <div class=\"order-1 md:order-2 reveal mobile-center-text\">\r\n <span class=\"text-am-red font-bold tracking-[0.3em] uppercase mb-4 block text-xs\">For the first dance<\/span>\r\n <h2 class=\"text-4xl md:text-6xl font-bold mb-6 md:mb-8\">Wedding Dance<\/h2>\r\n <p class=\"text-lg md:text-xl text-zinc-600 mb-6 md:mb-8 leading-relaxed italic\">\"All eyes are on you as you take the floor\u2026 This is a once in a lifetime moment.\"<\/p>\r\n <button class=\"bg-am-red text-white px-8 md:px-10 py-4 rounded-full font-bold text-sm md:text-lg hover:bg-zinc-900 transition-all shadow-xl uppercase tracking-widest\">\r\n Plan your dance\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- History Section - Compact for Phone -->\r\n <section class=\"relative history-section py-20 md:py-32 px-6 md:px-12 text-white text-center overflow-hidden\">\r\n <div class=\"absolute inset-0 z-0\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/kathrynMurray.jpg\" class=\"w-full h-full object-cover\" alt=\"Kathryn Murray Background\">\r\n <div class=\"absolute inset-0 bg-black\/75\"><\/div>\r\n <\/div>\r\n <div class=\"relative z-10 max-w-4xl mx-auto reveal px-4\">\r\n <h3 class=\"history-title text-xl md:text-5xl font-serif mb-3 md:mb-6 leading-tight\">\r\n \u201cArthur Murray was established in 1912\u201d, <br class=\"hidden md:block\">\r\n <span class=\"text-am-red italic\">a lifetime experience<\/span> in teaching the world to dance.\r\n <\/h3>\r\n <div class=\"history-line h-1 w-20 bg-am-red mx-auto mb-4 md:mb-8\"><\/div>\r\n <p class=\"history-sub text-xs md:text-2xl text-zinc-300 font-light\">\r\n Our dance studios have taught over <span class=\"text-white font-bold\">35 million people<\/span> worldwide.\r\n <\/p>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Gallery Section -->\r\n <section id=\"gallery\" class=\"section-py py-16 md:py-24 bg-white overflow-hidden\">\r\n <div class=\"max-w-7xl mx-auto mb-8 md:mb-12 px-6 reveal mobile-center-text\">\r\n <h2 class=\"text-4xl md:text-6xl font-bold text-zinc-900\">Studio <span class=\"italic text-am-red font-serif\">Moments<\/span><\/h2>\r\n <\/div>\r\n <div class=\"gallery-grid\">\r\n <div class=\"gallery-item reveal\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/IMG_9111_640x800.jpg\" alt=\"Arthur Murray London 1\">\r\n <\/div>\r\n <div class=\"gallery-item reveal\" style=\"transition-delay: 0.1s;\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/2e0d51_eb69aa63ac944e289dd047f12670f27emv2.avif\" alt=\"Arthur Murray London 2\">\r\n <\/div>\r\n <div class=\"gallery-item reveal\" style=\"transition-delay: 0.2s;\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/https___arthurmurrayfranchisee_com_syste.avif\" alt=\"Arthur Murray London 3\">\r\n <\/div>\r\n <div class=\"gallery-item reveal\" style=\"transition-delay: 0.3s;\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/2e0d51_a8db5d9d81c24e729f1ef4066e7db687mv2.jpg\" alt=\"Arthur Murray London 4\">\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Footer -->\r\n <footer id=\"contact\" class=\"bg-zinc-900 text-white pt-16 md:pt-24 pb-8 md:pb-12 px-6 md:px-12\">\r\n <div class=\"max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-10 md:gap-12 pb-12 md:pb-16 border-b border-zinc-800\">\r\n <div class=\"mobile-center-text\">\r\n <div style=\"width: 120px; height: 50px;\" class=\"mb-6 mx-auto md:mx-0\">\r\n <img decoding=\"async\" src=\"https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/R.png\" alt=\"Logo\" class=\"w-full h-full brightness-0 invert object-contain\">\r\n <\/div>\r\n <p class=\"text-zinc-400 text-sm leading-relaxed\">Our professional staff of instructors will provide students with all that they need while being taught to dance with confidence.<\/p>\r\n <\/div>\r\n <div class=\"mobile-center-text\">\r\n <h3 class=\"text-lg font-bold mb-6 text-am-red uppercase tracking-widest text-sm\">Contact Us<\/h3>\r\n <ul class=\"text-zinc-400 space-y-3 text-sm\">\r\n <li>bakerstreet@arthurmurray.co.uk<\/li>\r\n <li>07553 344439<\/li>\r\n <li>77 Baker Street, London, W1U 6RF<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"mobile-center-text\">\r\n <h3 class=\"text-lg font-bold mb-6 text-am-red uppercase tracking-widest text-sm\">Opening Hours<\/h3>\r\n <ul class=\"text-zinc-400 space-y-2 text-sm\">\r\n <li>Tue\u2013Fri: 1:00 PM \u2013 9:00 PM<\/li>\r\n <li>Sat: 11:00 AM \u2013 8:00 PM<\/li>\r\n <li>Mon, Sun: Closed<\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n <div class=\"max-w-7xl mx-auto pt-8 text-center text-zinc-600 text-[10px] uppercase tracking-widest\">\r\n \u00a9 2024 Arthur Murray London. All Rights Reserved.\r\n <\/div>\r\n <\/footer>\r\n\r\n <script>\r\n \/\/ Hero selection logic\r\n function changeHero(element, title, url) {\r\n const bg = document.getElementById('hero-bg');\r\n const heroTitle = document.getElementById('hero-dance-title');\r\n \r\n bg.style.backgroundImage = `url('${url}')`;\r\n heroTitle.style.opacity = '0';\r\n \r\n setTimeout(() => {\r\n heroTitle.innerText = title;\r\n heroTitle.style.opacity = '1';\r\n heroTitle.style.color = 'var(--am-red)';\r\n }, 300);\r\n\r\n document.querySelectorAll('.dance-selector').forEach(el => {\r\n el.classList.remove('active');\r\n el.style.color = 'rgba(255, 255, 255, 0.4)';\r\n });\r\n element.classList.add('active');\r\n element.style.color = 'white';\r\n }\r\n\r\n \/\/ Reveal animations\r\n function reveal() {\r\n const reveals = document.querySelectorAll(\".reveal\");\r\n reveals.forEach(el => {\r\n const windowHeight = window.innerHeight;\r\n const elementTop = el.getBoundingClientRect().top;\r\n if (elementTop < windowHeight - 80) {\r\n el.classList.add(\"active\");\r\n }\r\n });\r\n }\r\n\r\n \/\/ --- AUTOMATED GLASS CYCLE (SHATTER & RECONNECT EVERY 5S) ---\r\n function initGlassCycle() {\r\n const shards = document.querySelectorAll('.glass-shard');\r\n let currentShardIndex = 0;\r\n\r\n function startCycle() {\r\n \/\/ 1. Shatter: Move all shards away\r\n shards.forEach(s => {\r\n s.classList.remove('is-active');\r\n s.classList.add('is-away');\r\n });\r\n\r\n \/\/ 2. Wait 1.5s then Reconnect: Highlight the current shard\r\n setTimeout(() => {\r\n shards.forEach(s => s.classList.remove('is-away'));\r\n shards[currentShardIndex].classList.add('is-active');\r\n \r\n \/\/ Increment for next cycle\r\n currentShardIndex = (currentShardIndex + 1) % shards.length;\r\n }, 1500);\r\n }\r\n\r\n \/\/ Loop every 5 seconds\r\n setInterval(startCycle, 5000);\r\n startCycle(); \/\/ Initial call\r\n }\r\n\r\n window.addEventListener('scroll', reveal);\r\n \r\n const overlay = document.getElementById('mobile-overlay');\r\n const mobileToggle = document.getElementById('mobile-toggle');\r\n const mobileClose = document.getElementById('mobile-close');\r\n\r\n if (mobileToggle) mobileToggle.onclick = () => overlay.classList.remove('translate-x-full');\r\n if (mobileClose) mobileClose.onclick = () => overlay.classList.add('translate-x-full');\r\n \r\n window.onload = () => {\r\n reveal();\r\n initGlassCycle();\r\n const firstSelector = document.querySelector('.dance-selector');\r\n if (firstSelector && window.innerWidth > 1200) {\r\n changeHero(firstSelector, 'Tango', 'https:\/\/aruk.qtechdemo.website\/wp-content\/uploads\/2026\/03\/Tango.webp');\r\n }\r\n };\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Arthur Murray London | Ballroom, Latin & Wedding Dance Home About Us Dances Benefits Wedding Gallery Contact Enquire Now Home About Us Dances Gallery Contact Enquire Now Tango Waltz Foxtrot Feel like a star Choose Your Experience Start Dancing Cha Cha Rumba Wedding PrivateLessons GroupClasses PracticeSessions SocialEvents 100+ Years of expertise Our Heritage Learn to […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-76","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/pages\/76","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=76"}],"version-history":[{"count":5,"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/pages\/76\/revisions"}],"predecessor-version":[{"id":220,"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=\/wp\/v2\/pages\/76\/revisions\/220"}],"wp:attachment":[{"href":"https:\/\/aruk.qtechdemo.website\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=76"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}