Fix schedule

Fix BOM
Disallow Robots
2026-05-06 20:49:10 +07:00 · 2026-05-04 12:10:35 +07:00 · 2026-05-04 11:56:52 +07:00 · 2026-05-04 11:55:20 +07:00 · 2026-05-04 11:24:25 +07:00 · 2026-05-04 11:19:21 +07:00
31 changed files with 5671 additions and 1687 deletions
--- a/.githooks/pre-commit
+++ b/.githooks/pre-commit
@@ -0,0 +1,19 @@
+#!/bin/bash
+# Cache-busting: update ?v= query param in all HTML files when CSS/JS change.
+# Version = first 8 chars of a combined hash of style.css + main.js.
+
+REPO_ROOT=$(git rev-parse --show-toplevel)
+CSS="$REPO_ROOT/css/style.css"
+JS="$REPO_ROOT/js/main.js"
+
+VERSION=$(cat "$CSS" "$JS" | git hash-object --stdin | cut -c1-8)
+
+HTML_FILES=$(find "$REPO_ROOT" -name "index.html" -not -path "*/raw/*")
+
+for file in $HTML_FILES; do
+  sed -i -E "s|(\.\.\/)?css/style\.css(\?v=[^\"']*)?|\1css/style.css?v=$VERSION|g" "$file"
+  sed -i -E "s|(\.\.\/)?js/main\.js(\?v=[^\"']*)?|\1js/main.js?v=$VERSION|g" "$file"
+  git add "$file"
+done
+
+echo "Cache-bust version: $VERSION"
--- a/assets/bachata.png
+++ b/assets/bachata.png
--- a/assets/kizomba.png
+++ b/assets/kizomba.png
--- a/assets/latin-escape-danang.jpg
+++ b/assets/latin-escape-danang.jpg
--- a/assets/palm-fronds-left.png
+++ b/assets/palm-fronds-left.png
--- a/assets/palm-fronds-left2.png
+++ b/assets/palm-fronds-left2.png
--- a/assets/palm-fronds-right.png
+++ b/assets/palm-fronds-right.png
--- a/assets/palm-fronds2.png
+++ b/assets/palm-fronds2.png
--- a/assets/salsa.png
+++ b/assets/salsa.png
--- a/assets/spotify.png
+++ b/assets/spotify.png
--- a/assets/xperience.jpg
+++ b/assets/xperience.jpg
--- a/assets/youtubemusic.png
+++ b/assets/youtubemusic.png
--- a/classes.html
+++ b/classes.html
@@ -1,254 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Dance Classes — SaborFlow Da Nang</title>
-  <meta name="description" content="Latin dance classes in Da Nang. Find Salsa, Bachata, Kizomba, and Zouk classes for all levels.">
-  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-<body>
-
-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html">Home</a></li>
-        <li><a href="schedule.html">Schedule</a></li>
-        <li><a href="connect.html">Connect</a></li>
-        <li><a href="studios.html">Studios</a></li>
-        <li><a href="classes.html" class="active">Classes</a></li>
-        <li><a href="festivals.html">Festivals</a></li>
-      </ul>
-    </div>
-  </nav>
-
-  <div class="container">
-    <div class="page-header">
-      <p class="section-label">Da Nang &middot; Hoi An</p>
-      <h1>Dance Classes</h1>
-      <p class="subtitle">Whether you&rsquo;re just starting out or looking to sharpen your moves &mdash; there&rsquo;s a class for you.</p>
-    </div>
-
-    <div class="filter-bar">
-      <button class="filter-pill active" data-filter="all">All</button>
-      <button class="filter-pill" data-filter="salsa">Salsa</button>
-      <button class="filter-pill" data-filter="bachata">Bachata</button>
-      <button class="filter-pill" data-filter="kizomba">Kizomba</button>
-      <button class="filter-pill" data-filter="zouk">Zouk</button>
-      <button class="filter-pill" data-filter="beginner">Beginner</button>
-      <button class="filter-pill" data-filter="advanced">Advanced</button>
-    </div>
-
-    <div class="card-grid">
-
-      <!-- Lucho Giraldes — Salsa -->
-      <div class="card filterable-card" data-styles="salsa,beginner,intermediate,advanced">
-        <div class="card-body">
-          <div class="card-title">Lucho Giraldes — Salsa</div>
-          <div class="tags">
-            <span class="tag tag-salsa">Salsa On1</span>
-            <span class="tag tag-salsa">Salsa On2</span>
-            <span class="tag tag-beginner">Beginner</span>
-            <span class="tag tag-intermediate">Intermediate</span>
-            <span class="tag tag-advanced">Advanced</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Lucho Giraldes &mdash; 20+ years experience</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>Various venues in Da Nang (see website for details)</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Check website for current schedule</span>
-          </div>
-          <div class="card-links">
-            <a href="https://salsadanang.com" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
-              salsadanang.com
-            </a>
-            <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-              @salsadanang
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- Daisy Nguyen -->
-      <div class="card filterable-card" data-styles="bachata,kizomba,intermediate">
-        <div class="card-body">
-          <div class="card-title">Daisy Nguyen</div>
-          <div class="tags">
-            <span class="tag tag-bachata">Bachata</span>
-            <span class="tag tag-kizomba">Kizomba</span>
-            <span class="tag tag-intermediate">Intermediate</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Daisy Nguyen &mdash; local instructor &amp; social organizer</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>Da Nang (venues change &mdash; follow for updates)</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Tuesday at Caliz Bar &middot; Sunday at Corner Bar</span>
-          </div>
-          <div class="card-links">
-            <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-              Check Instagram
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- Frog Goose — Bachata Workshop -->
-      <div class="card filterable-card" data-styles="bachata,beginner,intermediate">
-        <div class="card-body">
-          <div class="card-title">Frog Goose — Bachata Workshop</div>
-          <div class="tags">
-            <span class="tag tag-bachata">Bachata</span>
-            <span class="tag tag-beginner">Beginner</span>
-            <span class="tag tag-intermediate">Intermediate</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Luu Nhat Phuong, Phong &amp; Shai</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>292 Vo Nguyen Giap, Ngu Hanh Son, Da Nang</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Every Monday &mdash; Workshop 8:30 PM &middot; Social from 9:30 PM</span>
-          </div>
-          <div class="card-links">
-            <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-              Facebook
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- Sean Kim — Kizomba & Bachata -->
-      <div class="card filterable-card" data-styles="kizomba,bachata,intermediate">
-        <div class="card-body">
-          <div class="card-title">Sean Kim — Kizomba &amp; Bachata</div>
-          <div class="tags">
-            <span class="tag tag-kizomba">Kizomba</span>
-            <span class="tag tag-bachata">Bachata</span>
-            <span class="tag tag-intermediate">Intermediate</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Sean Kim &mdash; organizer of the Wednesday Bachata Kiz Night</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>Ket Fai Bar, Da Nang</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Wednesday &mdash; Kizomba from 19:30 &middot; Bachata from 21:00</span>
-          </div>
-          <div class="card-links">
-            <a href="connect.html" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-              Contact via SaborFlow
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- 50 Decibels -->
-      <div class="card filterable-card" data-styles="kizomba,zouk,salsa,bachata,beginner">
-        <div class="card-body">
-          <div class="card-title">50 Decibels</div>
-          <div class="tags">
-            <span class="tag tag-kizomba">Kizomba</span>
-            <span class="tag tag-zouk">Zouk</span>
-            <span class="tag tag-salsa">Salsa</span>
-            <span class="tag tag-bachata">Bachata</span>
-            <span class="tag tag-beginner">Beginner-friendly</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>36 Đ. Ng. Thi Si, Bac My An, Ngu Hanh Son, Da Nang</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Monday 9 PM &mdash; Kizomba &amp; Zouk night</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <span>Friday 9 PM &mdash; Latin Vibes (Salsa, Bachata, Kizomba)</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg>
-            <span>~$3 USD cover</span>
-          </div>
-        </div>
-      </div>
-
-    </div>
-
-    <div class="mt-3" style="background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center">
-      <p style="color:var(--muted);margin-bottom:1rem">Teaching in Da Nang and not listed here? Get in touch.</p>
-      <a href="connect.html" class="btn btn-ghost">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-        <span>Contact Us</span>
-      </a>
-    </div>
-  </div>
-
-  <footer class="footer" style="margin-top:4rem">
-    <div class="container">
-      <div class="footer-inner">
-        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
-        </div>
-      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
-    </div>
-  </footer>
-
-  <script src="js/main.js"></script>
-</body>
-</html>
--- a/classes/index.html
+++ b/classes/index.html
@@ -0,0 +1,393 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Dance Classes — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="Latin dance classes in Da Nang. Find Salsa, Bachata, Kizomba, and Zouk classes for all levels.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/classes/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Dance Classes — Sabor Flow Da Nang">
+  <meta property="og:description" content="Latin dance classes in Da Nang. Find Salsa, Bachata, Kizomba, and Zouk classes for all levels.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/classes/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav">
+    <button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes" class="active">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes" class="active">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Dance <em>Classes</em></h1>
+      <div class="info">
+        Whether you're just starting out or looking to sharpen your moves &mdash; there's a class for you in Da Nang and
+        Hoi An.
+      </div>
+    </div>
+
+    <div class="sfB-toolbar">
+      <div class="sfB-pills">
+        <button class="filter-pill active" data-filter="all">All</button>
+        <button class="filter-pill" data-filter="salsa">Salsa</button>
+        <button class="filter-pill" data-filter="bachata">Bachata</button>
+        <button class="filter-pill" data-filter="kizomba">Kizomba</button>
+        <button class="filter-pill" data-filter="zouk">Zouk</button>
+        <button class="filter-pill" data-filter="beginner">Beginner</button>
+        <button class="filter-pill" data-filter="advanced">Advanced</button>
+      </div>
+    </div>
+
+    <div class="sfB-cards two">
+
+      <!-- Lucho Giraldes — Salsa -->
+      <div class="sfB-card-x filterable-card" data-styles="salsa,beginner,intermediate,advanced">
+        <div class="stripe salsa"></div>
+        <h3>Lucho Giraldes — Salsa</h3>
+        <div class="ts">
+          <span class="sfB-chip salsa">Salsa On1</span>
+          <span class="sfB-chip salsa">Salsa On2</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">👤</span><span>Lucho Giraldes &mdash; 20+ years experience</span></div>
+          <div class="row"><span class="ic">📍</span><span>Various venues in Da Nang (see website)</span></div>
+          <div class="row"><span class="ic">📅</span><span>Check website for current schedule</span></div>
+          <div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate · Advanced</span></div>
+        </div>
+        <div class="links">
+          <a href="https://salsadanang.com" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <circle cx="12" cy="12" r="10" />
+              <line x1="2" y1="12" x2="22" y2="12" />
+              <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
+            </svg>
+            salsadanang.com
+          </a>
+          <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            @salsadanang
+          </a>
+        </div>
+      </div>
+
+      <!-- Daisy Nguyen -->
+      <div class="sfB-card-x filterable-card" data-styles="bachata,kizomba,intermediate">
+        <div class="stripe bachata"></div>
+        <h3>Daisy Nguyen</h3>
+        <div class="ts">
+          <span class="sfB-chip bachata">Bachata</span>
+          <span class="sfB-chip kizomba">Kizomba</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">👤</span><span>Daisy Nguyen &mdash; local instructor &amp; social
+              organizer</span></div>
+          <div class="row"><span class="ic">📍</span><span>Da Nang (venues change &mdash; follow for updates)</span>
+          </div>
+          <div class="row"><span class="ic">📅</span><span>Tuesday at Caliz Bar · Sunday at Corner Bar</span></div>
+        </div>
+        <div class="links">
+          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            Check Instagram
+          </a>
+        </div>
+      </div>
+
+      <!-- Frog Goose — Bachata Workshop -->
+      <div class="sfB-card-x filterable-card" data-styles="bachata,beginner,intermediate">
+        <div class="stripe bachata"></div>
+        <h3>Frog Goose — Bachata Workshop</h3>
+        <div class="ts">
+          <span class="sfB-chip bachata">Bachata</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">👥</span><span>Luu Nhat Phuong, Phong &amp; Shai</span></div>
+          <div class="row"><span class="ic">📍</span><span>292 Vo Nguyen Giap, Ngu Hanh Son, Da Nang</span></div>
+          <div class="row"><span class="ic">📅</span><span>Every Monday &mdash; Workshop 8:30 PM · Social 9:30 PM</span>
+          </div>
+          <div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate</span></div>
+        </div>
+        <div class="links">
+          <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            Facebook
+          </a>
+        </div>
+      </div>
+
+      <!-- Sean Kim — Kizomba & Bachata -->
+      <div class="sfB-card-x filterable-card" data-styles="kizomba,bachata,intermediate">
+        <div class="stripe kizomba"></div>
+        <h3>Sean Kim — Kizomba &amp; Bachata</h3>
+        <div class="ts">
+          <span class="sfB-chip kizomba">Kizomba</span>
+          <span class="sfB-chip bachata">Bachata</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">👤</span><span>Sean Kim &mdash; organizer of the Wednesday Bachata Kiz
+              Night</span></div>
+          <div class="row"><span class="ic">📍</span><span>Ket Fai Bar, Da Nang</span></div>
+          <div class="row"><span class="ic">📅</span><span>Wednesday &mdash; Kizomba 7:30 PM · Bachata 9 PM</span></div>
+        </div>
+        <div class="links">
+          <a href="/connect">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
+              <polyline points="22,6 12,13 2,6" />
+            </svg>
+            Contact via Sabor Flow
+          </a>
+        </div>
+      </div>
+
+      <!-- LearnToDance Da Nang -->
+      <div class="sfB-card-x filterable-card" data-styles="salsa,bachata,kizomba,zouk">
+        <div class="stripe multi"></div>
+        <h3>LearnToDance Da Nang</h3>
+        <div class="ts">
+          <span class="sfB-chip salsa">Salsa</span>
+          <span class="sfB-chip bachata">Bachata</span>
+          <span class="sfB-chip kizomba">Kizomba</span>
+          <span class="sfB-chip zouk">Zouk</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">📍</span><span>Da Nang, Vietnam</span></div>
+          <div class="row"><span class="ic">📞</span><span><a href="tel:+84855085903">+84 85 508 5903</a></span></div>
+        </div>
+        <div class="links">
+          <a href="https://www.facebook.com/groups/LearnToDanceDANANG" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            Facebook
+          </a>
+          <a href="https://www.instagram.com/LearnToDanceDANANG" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            Instagram
+          </a>
+          <a href="https://www.tiktok.com/@LearnToDanceDANANG" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5" />
+            </svg>
+            TikTok
+          </a>
+          <a href="https://youtube.com/@LearnToDanceDANANG" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path
+                d="M22.54 6.42a2.78 2.78 0 0 0-1.95-1.96C18.88 4 12 4 12 4s-6.88 0-8.59.46A2.78 2.78 0 0 0 1.46 6.42 29 29 0 0 0 1 12a29 29 0 0 0 .46 5.58 2.78 2.78 0 0 0 1.95 1.96C5.12 20 12 20 12 20s6.88 0 8.59-.46a2.78 2.78 0 0 0 1.95-1.96A29 29 0 0 0 23 12a29 29 0 0 0-.46-5.58z" />
+              <polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02" />
+            </svg>
+            YouTube
+          </a>
+          <a href="https://chat.whatsapp.com/IFdIfpIxztw6tgTe6ZaD2y" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+            </svg>
+            WhatsApp
+          </a>
+          <a href="https://zalo.me/g/wvnlyh104" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+            </svg>
+            Zalo
+          </a>
+          <a href="https://x.com/LearnToDanceDN" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M4 4l16 16M20 4L4 20" />
+            </svg>
+            X
+          </a>
+          <a href="mailto:learntodancedanang@gmail.com">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
+              <polyline points="22,6 12,13 2,6" />
+            </svg>
+            Email
+          </a>
+        </div>
+      </div>
+
+      <!-- SoulKiz Da Nang -->
+      <div class="sfB-card-x filterable-card" data-styles="kizomba">
+        <div class="stripe kizomba"></div>
+        <h3>SoulKiz Da Nang</h3>
+        <div class="ts">
+          <span class="sfB-chip kizomba">Kizomba</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">📍</span><span>Da Nang, Vietnam</span></div>
+          <div class="row"><span class="ic">📞</span><span><a href="tel:+84776868193">+84 77 686 8193</a> &mdash;
+              WhatsApp &amp; Zalo</span></div>
+        </div>
+        <div class="links">
+          <a href="https://www.facebook.com/soulkizdanang" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            SoulKiz Da Nang
+          </a>
+          <a href="https://www.instagram.com/soulkizdanang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            @soulkizdanang
+          </a>
+          <a href="mailto:soulkizdanang@gmail.com">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
+              <polyline points="22,6 12,13 2,6" />
+            </svg>
+            Email
+          </a>
+        </div>
+      </div>
+
+      <!-- 50 Decibels -->
+      <div class="sfB-card-x filterable-card" data-styles="kizomba,zouk,salsa,bachata,beginner">
+        <div class="stripe multi"></div>
+        <h3>50 Decibels</h3>
+        <div class="ts">
+          <span class="sfB-chip kizomba">Kizomba</span>
+          <span class="sfB-chip zouk">Zouk</span>
+          <span class="sfB-chip salsa">Salsa</span>
+          <span class="sfB-chip bachata">Bachata</span>
+        </div>
+        <div class="info">
+          <div class="row"><span class="ic">📍</span><span>36 Ng. Thi Si, Bac My An, Ngu Hanh Son, Da Nang</span></div>
+          <div class="row"><span class="ic">📅</span><span>Monday 9 PM &mdash; Kizomba &amp; Zouk night</span></div>
+          <div class="row"><span class="ic">📅</span><span>Friday 9 PM &mdash; Latin Vibes (Salsa, Bachata,
+              Kizomba)</span></div>
+          <div class="row"><span class="ic">💵</span><span>~$3 USD cover · Beginner-friendly</span></div>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="sfB-suggest">
+      <p>Teaching in Da Nang and not listed here? Get in touch.</p>
+      <a href="/connect" class="sfB-btn ghost">Contact Us</a>
+    </div>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+</body>
+
+</html>
--- a/connect.html
+++ b/connect.html
@@ -1,140 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Connect — SaborFlow Da Nang</title>
-  <meta name="description" content="Follow SaborFlow Da Nang on Instagram and get in touch with the Latin dance community.">
-  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-<body>
-
-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html">Home</a></li>
-        <li><a href="schedule.html">Schedule</a></li>
-        <li><a href="connect.html" class="active">Connect</a></li>
-        <li><a href="studios.html">Studios</a></li>
-        <li><a href="classes.html">Classes</a></li>
-        <li><a href="festivals.html">Festivals</a></li>
-      </ul>
-    </div>
-  </nav>
-
-  <div class="container">
-    <div class="page-header">
-      <p class="section-label">Stay in the loop</p>
-      <h1>Connect</h1>
-      <p class="subtitle">Follow for the latest socials, photos, and community news.</p>
-    </div>
-
-    <!-- Instagram profile card -->
-    <div class="ig-profile-card">
-      <img src="assets/logo.jpg" alt="SaborFlow Da Nang" class="ig-avatar">
-      <div class="ig-handle">@saborflowdanang</div>
-      <p class="ig-desc">Photos, videos, and announcements from Da Nang's Latin dance community. Social dances almost every day of the week.</p>
-      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="btn btn-primary">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-        <span>Open on Instagram</span>
-      </a>
-    </div>
-
-    <!-- Latest posts -->
-    <p class="section-label" style="margin-bottom:1.5rem">Latest posts</p>
-
-    <!--
-      HOW TO ADD REAL INSTAGRAM EMBEDS:
-      1. Open instagram.com and go to any post from @saborflowdanang
-      2. Click the three dots on the post → "Embed"
-      3. Copy the embed code and paste it here, replacing one of the placeholders below.
-      The <script> tag at the bottom of the page loads them automatically.
-    -->
-    <div class="ig-embeds">
-
-      <div class="ig-placeholder">
-        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" style="color:var(--muted)"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-        <p>Latest posts from the community</p>
-        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" style="color:var(--teal);font-size:.75rem;letter-spacing:.1em;font-weight:600;text-transform:uppercase">View on Instagram</a>
-      </div>
-
-      <div class="ig-placeholder">
-        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" style="color:var(--muted)"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2" ry="2"/></svg>
-        <p>Videos, reels, and social dance moments</p>
-        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" style="color:var(--teal);font-size:.75rem;letter-spacing:.1em;font-weight:600;text-transform:uppercase">View on Instagram</a>
-      </div>
-
-      <div class="ig-placeholder">
-        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" style="color:var(--muted)"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
-        <p>Workshops, festivals, and special events</p>
-        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" style="color:var(--teal);font-size:.75rem;letter-spacing:.1em;font-weight:600;text-transform:uppercase">View on Instagram</a>
-      </div>
-
-    </div>
-
-    <!-- Contact -->
-    <div class="contact-box">
-      <p class="section-label">Get in touch</p>
-      <h2 style="margin-bottom:1rem">Want to collaborate?</h2>
-      <p style="color:var(--muted);max-width:540px;margin:0 auto 2rem">
-        Want to host a social? Suggest a venue? Collaborate on an event? Or just say hi?
-        We&rsquo;d love to hear from you &mdash; we don&rsquo;t bite, we just dance.
-      </p>
-      <div class="contact-ctas">
-        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="btn btn-primary">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-          <span>DM on Instagram</span>
-        </a>
-        <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="btn btn-ghost">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-          <span>Join the Facebook Group</span>
-        </a>
-      </div>
-    </div>
-  </div>
-
-  <footer class="footer" style="margin-top:4rem">
-    <div class="container">
-      <div class="footer-inner">
-        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
-        </div>
-      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
-    </div>
-  </footer>
-
-  <script async src="//www.instagram.com/embed.js"></script>
-  <script src="js/main.js"></script>
-</body>
-</html>
--- a/connect/index.html
+++ b/connect/index.html
@@ -0,0 +1,211 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Connect — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="Follow Sabor Flow Da Nang on Instagram and get in touch with the Latin dance community.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/connect/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Connect — Sabor Flow Da Nang">
+  <meta property="og:description" content="Follow Sabor Flow Da Nang on Instagram and get in touch with the Latin dance community.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/connect/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav">
+    <button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect" class="active">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect" class="active">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Stay <em>Connected</em></h1>
+      <div class="info">
+        Sabor Flow lives on Instagram and inside a few group chats. There's no app, no email list, no spam &mdash; just
+        messages from real dancers about real parties. Pick whichever channel fits.
+      </div>
+    </div>
+
+    <!-- Instagram profile hero -->
+    <div class="sfB-connect-hero">
+      <div class="ch-left">
+        <div class="ava"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+        <div>
+          <div class="h">@saborflowdanang</div>
+          <h2>The Instagram is the source of truth.</h2>
+          <p>Photos, videos, and announcements from Da Nang's Latin dance community. Social dances almost every day of
+            the
+            week.</p>
+        </div>
+      </div>
+      <div class="ch-right">
+        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+            stroke-linecap="round" stroke-linejoin="round">
+            <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+            <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+            <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+          </svg>
+          Follow on Instagram
+        </a>
+        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn ghost">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+            stroke-linecap="round" stroke-linejoin="round">
+            <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+          </svg>
+          DM Us
+        </a>
+      </div>
+    </div>
+
+    <!-- Instagram grid -->
+    <div style="margin-top: 48px;">
+      <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;">
+        <h2
+          style="font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 28px; letter-spacing: -1px;">
+          Latest from the <em
+            style="font-family: 'Caveat Brush', cursive; font-style: normal; font-weight: 400; color: var(--sf-coral);">floor</em>
+        </h2>
+        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener"
+          style="font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--sf-gold); letter-spacing: 1px; text-decoration: none;">VIEW
+          ALL ↗</a>
+      </div>
+      <div class="sfB-igrid">
+        <div class="ig">
+          <span class="heart">♡ 142</span>
+          <span class="lbl">// caliz · sensual night</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 89</span>
+          <span class="lbl">// shai · workshop</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 211</span>
+          <span class="lbl">// hoi an · la riva</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 67</span>
+          <span class="lbl">// malibu · salsa</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 178</span>
+          <span class="lbl">// bachata party</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 93</span>
+          <span class="lbl">// ket fai · kizomba</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 134</span>
+          <span class="lbl">// last call · sunday</span>
+        </div>
+        <div class="ig">
+          <span class="heart">♡ 256</span>
+          <span class="lbl">// vlx · da nang</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- Collaborate banner -->
+    <div class="sfB-collab">
+      <div class="l">/ COLLABORATE</div>
+      <h2>Run a venue? <em>Teach?</em><br>DJ Latin?</h2>
+      <p>We're always looking to expand the floor. If you're an instructor, DJ, or you run a bar that wants to host a
+        Latin night &mdash; let's talk. Sabor Flow is non-profit and connects people, never charges.</p>
+      <div class="acts">
+        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary">Get
+          in touch ↗</a>
+      </div>
+    </div>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+</body>
+
+</html>
--- a/css/fireflies.css
+++ b/css/fireflies.css
@@ -0,0 +1,362 @@
+.firefly {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  width: 0.4vw;
+  height: 0.4vw;
+  margin: -0.2vw 0 0 9.8vw;
+  animation: ease 200s alternate infinite;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.firefly::before,
+.firefly::after {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  transform-origin: -10vw;
+}
+
+.firefly::before {
+  background: black;
+  opacity: 0.4;
+  animation: drift ease alternate infinite;
+}
+
+.firefly::after {
+  background: white;
+  opacity: 0;
+  box-shadow: 0 0 0vw 0vw #f5b800;
+  animation: drift ease alternate infinite, flash ease infinite;
+}
+
+.firefly:nth-child(1) { animation-name: move1; }
+.firefly:nth-child(1)::before { animation-duration: 15s; }
+.firefly:nth-child(1)::after  { animation-duration: 15s, 7421ms; animation-delay: 0ms, 3911ms; }
+
+.firefly:nth-child(2) { animation-name: move2; }
+.firefly:nth-child(2)::before { animation-duration: 10s; }
+.firefly:nth-child(2)::after  { animation-duration: 10s, 9632ms; animation-delay: 0ms, 6894ms; }
+
+.firefly:nth-child(3) { animation-name: move3; }
+.firefly:nth-child(3)::before { animation-duration: 17s; }
+.firefly:nth-child(3)::after  { animation-duration: 17s, 10384ms; animation-delay: 0ms, 5172ms; }
+
+.firefly:nth-child(4) { animation-name: move4; }
+.firefly:nth-child(4)::before { animation-duration: 14s; }
+.firefly:nth-child(4)::after  { animation-duration: 14s, 6650ms; animation-delay: 0ms, 2460ms; }
+
+.firefly:nth-child(5) { animation-name: move5; }
+.firefly:nth-child(5)::before { animation-duration: 18s; }
+.firefly:nth-child(5)::after  { animation-duration: 18s, 9291ms; animation-delay: 0ms, 7133ms; }
+
+.firefly:nth-child(6) { animation-name: move6; }
+.firefly:nth-child(6)::before { animation-duration: 12s; }
+.firefly:nth-child(6)::after  { animation-duration: 12s, 8177ms; animation-delay: 0ms, 5726ms; }
+
+.firefly:nth-child(7) { animation-name: move7; }
+.firefly:nth-child(7)::before { animation-duration: 11s; }
+.firefly:nth-child(7)::after  { animation-duration: 11s, 11123ms; animation-delay: 0ms, 4875ms; }
+
+.firefly:nth-child(8) { animation-name: move8; }
+.firefly:nth-child(8)::before { animation-duration: 16s; }
+.firefly:nth-child(8)::after  { animation-duration: 16s, 7804ms; animation-delay: 0ms, 1569ms; }
+
+.firefly:nth-child(9) { animation-name: move9; }
+.firefly:nth-child(9)::before { animation-duration: 9s; }
+.firefly:nth-child(9)::after  { animation-duration: 9s, 10591ms; animation-delay: 0ms, 8344ms; }
+
+.firefly:nth-child(10) { animation-name: move10; }
+.firefly:nth-child(10)::before { animation-duration: 13s; }
+.firefly:nth-child(10)::after  { animation-duration: 13s, 7098ms; animation-delay: 0ms, 3250ms; }
+
+.firefly:nth-child(11) { animation-name: move11; }
+.firefly:nth-child(11)::before { animation-duration: 17s; }
+.firefly:nth-child(11)::after  { animation-duration: 17s, 11444ms; animation-delay: 0ms, 2128ms; }
+
+.firefly:nth-child(12) { animation-name: move12; }
+.firefly:nth-child(12)::before { animation-duration: 15s; }
+.firefly:nth-child(12)::after  { animation-duration: 15s, 8769ms; animation-delay: 0ms, 6512ms; }
+
+.firefly:nth-child(13) { animation-name: move13; }
+.firefly:nth-child(13)::before { animation-duration: 10s; }
+.firefly:nth-child(13)::after  { animation-duration: 10s, 6115ms; animation-delay: 0ms, 1010ms; }
+
+.firefly:nth-child(14) { animation-name: move14; }
+.firefly:nth-child(14)::before { animation-duration: 18s; }
+.firefly:nth-child(14)::after  { animation-duration: 18s, 10420ms; animation-delay: 0ms, 7548ms; }
+
+.firefly:nth-child(15) { animation-name: move15; }
+.firefly:nth-child(15)::before { animation-duration: 12s; }
+.firefly:nth-child(15)::after  { animation-duration: 12s, 9712ms; animation-delay: 0ms, 4666ms; }
+
+@keyframes move1 {
+  0%   { transform: translateX(-28vw) translateY(17vh)  scale(0.54); }
+  5%   { transform: translateX(31vw)  translateY(-42vh) scale(0.91); }
+  10%  { transform: translateX(-9vw)  translateY(44vh)  scale(0.47); }
+  15%  { transform: translateX(12vw)  translateY(-6vh)  scale(0.72); }
+  20%  { transform: translateX(-44vw) translateY(-28vh) scale(0.85); }
+  25%  { transform: translateX(39vw)  translateY(23vh)  scale(0.39); }
+  30%  { transform: translateX(-16vw) translateY(7vh)   scale(0.98); }
+  35%  { transform: translateX(45vw)  translateY(-31vh) scale(0.63); }
+  40%  { transform: translateX(-36vw) translateY(33vh)  scale(0.78); }
+  45%  { transform: translateX(6vw)   translateY(-48vh) scale(0.51); }
+  50%  { transform: translateX(27vw)  translateY(14vh)  scale(0.94); }
+  55%  { transform: translateX(-21vw) translateY(-11vh) scale(0.66); }
+  60%  { transform: translateX(48vw)  translateY(39vh)  scale(0.43); }
+  65%  { transform: translateX(-3vw)  translateY(-35vh) scale(0.88); }
+  70%  { transform: translateX(-49vw) translateY(4vh)   scale(0.58); }
+  75%  { transform: translateX(18vw)  translateY(48vh)  scale(0.75); }
+  80%  { transform: translateX(-30vw) translateY(-44vh) scale(0.99); }
+  85%  { transform: translateX(36vw)  translateY(-2vh)  scale(0.62); }
+  90%  { transform: translateX(-13vw) translateY(29vh)  scale(0.81); }
+  95%  { transform: translateX(4vw)   translateY(-19vh) scale(0.46); }
+  100% { transform: translateX(42vw)  translateY(9vh)   scale(0.69); }
+}
+
+@keyframes move2 {
+  0%     { transform: translateX(14vw)  translateY(-33vh) scale(0.82); }
+  6.25%  { transform: translateX(-41vw) translateY(28vh)  scale(0.48); }
+  12.5%  { transform: translateX(36vw)  translateY(41vh)  scale(0.93); }
+  18.75% { transform: translateX(-12vw) translateY(-7vh)  scale(0.57); }
+  25%    { transform: translateX(5vw)   translateY(49vh)  scale(0.76); }
+  31.25% { transform: translateX(-47vw) translateY(-21vh) scale(0.64); }
+  37.5%  { transform: translateX(23vw)  translateY(-45vh) scale(0.99); }
+  43.75% { transform: translateX(-2vw)  translateY(18vh)  scale(0.38); }
+  50%    { transform: translateX(44vw)  translateY(-14vh) scale(0.86); }
+  56.25% { transform: translateX(-29vw) translateY(3vh)   scale(0.71); }
+  62.5%  { transform: translateX(11vw)  translateY(36vh)  scale(0.52); }
+  68.75% { transform: translateX(-38vw) translateY(-49vh) scale(0.89); }
+  75%    { transform: translateX(49vw)  translateY(10vh)  scale(0.44); }
+  81.25% { transform: translateX(-17vw) translateY(45vh)  scale(0.96); }
+  87.5%  { transform: translateX(30vw)  translateY(-27vh) scale(0.67); }
+  93.75% { transform: translateX(-5vw)  translateY(24vh)  scale(0.79); }
+  100%   { transform: translateX(19vw)  translateY(-39vh) scale(0.55); }
+}
+
+@keyframes move3 {
+  0%   { transform: translateX(-22vw) translateY(38vh)  scale(0.71); }
+  7%   { transform: translateX(41vw)  translateY(-15vh) scale(0.44); }
+  14%  { transform: translateX(-8vw)  translateY(-43vh) scale(0.89); }
+  21%  { transform: translateX(33vw)  translateY(27vh)  scale(0.56); }
+  28%  { transform: translateX(-47vw) translateY(11vh)  scale(0.93); }
+  35%  { transform: translateX(19vw)  translateY(-48vh) scale(0.38); }
+  42%  { transform: translateX(-34vw) translateY(35vh)  scale(0.77); }
+  49%  { transform: translateX(7vw)   translateY(-21vh) scale(0.62); }
+  56%  { transform: translateX(48vw)  translateY(16vh)  scale(0.85); }
+  63%  { transform: translateX(-15vw) translateY(-37vh) scale(0.49); }
+  70%  { transform: translateX(26vw)  translateY(44vh)  scale(0.96); }
+  77%  { transform: translateX(-43vw) translateY(-9vh)  scale(0.68); }
+  84%  { transform: translateX(12vw)  translateY(31vh)  scale(0.81); }
+  91%  { transform: translateX(-29vw) translateY(-46vh) scale(0.53); }
+  100% { transform: translateX(38vw)  translateY(8vh)   scale(0.74); }
+}
+
+@keyframes move4 {
+  0%   { transform: translateX(17vw)  translateY(-44vh) scale(0.83); }
+  10%  { transform: translateX(-39vw) translateY(21vh)  scale(0.57); }
+  20%  { transform: translateX(46vw)  translateY(-33vh) scale(0.42); }
+  30%  { transform: translateX(-11vw) translateY(49vh)  scale(0.76); }
+  40%  { transform: translateX(28vw)  translateY(-7vh)  scale(0.91); }
+  50%  { transform: translateX(-47vw) translateY(36vh)  scale(0.64); }
+  60%  { transform: translateX(8vw)   translateY(-28vh) scale(0.48); }
+  70%  { transform: translateX(37vw)  translateY(13vh)  scale(0.87); }
+  80%  { transform: translateX(-24vw) translateY(-41vh) scale(0.73); }
+  90%  { transform: translateX(44vw)  translateY(24vh)  scale(0.55); }
+  100% { transform: translateX(-16vw) translateY(-18vh) scale(0.98); }
+}
+
+@keyframes move5 {
+  0%   { transform: translateX(-32vw) translateY(5vh)   scale(0.66); }
+  8%   { transform: translateX(23vw)  translateY(-38vh) scale(0.91); }
+  16%  { transform: translateX(-48vw) translateY(29vh)  scale(0.47); }
+  24%  { transform: translateX(11vw)  translateY(-13vh) scale(0.78); }
+  32%  { transform: translateX(40vw)  translateY(42vh)  scale(0.53); }
+  40%  { transform: translateX(-7vw)  translateY(-47vh) scale(0.84); }
+  48%  { transform: translateX(35vw)  translateY(18vh)  scale(0.39); }
+  56%  { transform: translateX(-26vw) translateY(34vh)  scale(0.95); }
+  64%  { transform: translateX(49vw)  translateY(-22vh) scale(0.61); }
+  72%  { transform: translateX(-14vw) translateY(-6vh)  scale(0.76); }
+  80%  { transform: translateX(6vw)   translateY(47vh)  scale(0.43); }
+  88%  { transform: translateX(-41vw) translateY(-31vh) scale(0.88); }
+  100% { transform: translateX(29vw)  translateY(11vh)  scale(0.57); }
+}
+
+@keyframes move6 {
+  0%   { transform: translateX(36vw)  translateY(-46vh) scale(0.52); }
+  9%   { transform: translateX(-19vw) translateY(14vh)  scale(0.87); }
+  18%  { transform: translateX(42vw)  translateY(37vh)  scale(0.69); }
+  27%  { transform: translateX(-44vw) translateY(-25vh) scale(0.94); }
+  36%  { transform: translateX(15vw)  translateY(8vh)   scale(0.41); }
+  45%  { transform: translateX(-3vw)  translateY(-49vh) scale(0.73); }
+  54%  { transform: translateX(47vw)  translateY(31vh)  scale(0.58); }
+  63%  { transform: translateX(-38vw) translateY(-12vh) scale(0.82); }
+  72%  { transform: translateX(21vw)  translateY(45vh)  scale(0.46); }
+  81%  { transform: translateX(-29vw) translateY(-34vh) scale(0.97); }
+  90%  { transform: translateX(9vw)   translateY(19vh)  scale(0.64); }
+  100% { transform: translateX(-46vw) translateY(42vh)  scale(0.79); }
+}
+
+@keyframes move7 {
+  0%   { transform: translateX(-11vw) translateY(-27vh) scale(0.88); }
+  6%   { transform: translateX(44vw)  translateY(39vh)  scale(0.53); }
+  12%  { transform: translateX(-33vw) translateY(-14vh) scale(0.74); }
+  18%  { transform: translateX(18vw)  translateY(48vh)  scale(0.41); }
+  24%  { transform: translateX(-48vw) translateY(-39vh) scale(0.86); }
+  30%  { transform: translateX(7vw)   translateY(22vh)  scale(0.63); }
+  36%  { transform: translateX(39vw)  translateY(-41vh) scale(0.97); }
+  42%  { transform: translateX(-22vw) translateY(7vh)   scale(0.48); }
+  48%  { transform: translateX(13vw)  translateY(-19vh) scale(0.79); }
+  54%  { transform: translateX(-45vw) translateY(43vh)  scale(0.55); }
+  60%  { transform: translateX(31vw)  translateY(-5vh)  scale(0.92); }
+  66%  { transform: translateX(-6vw)  translateY(-44vh) scale(0.67); }
+  72%  { transform: translateX(48vw)  translateY(28vh)  scale(0.38); }
+  78%  { transform: translateX(-17vw) translateY(15vh)  scale(0.81); }
+  84%  { transform: translateX(26vw)  translateY(-32vh) scale(0.44); }
+  90%  { transform: translateX(-40vw) translateY(36vh)  scale(0.71); }
+  100% { transform: translateX(4vw)   translateY(-10vh) scale(0.59); }
+}
+
+@keyframes move8 {
+  0%   { transform: translateX(43vw)  translateY(14vh)  scale(0.77); }
+  11%  { transform: translateX(-24vw) translateY(-48vh) scale(0.43); }
+  22%  { transform: translateX(9vw)   translateY(32vh)  scale(0.89); }
+  33%  { transform: translateX(-46vw) translateY(-7vh)  scale(0.61); }
+  44%  { transform: translateX(34vw)  translateY(47vh)  scale(0.96); }
+  55%  { transform: translateX(-13vw) translateY(-23vh) scale(0.52); }
+  66%  { transform: translateX(22vw)  translateY(-38vh) scale(0.75); }
+  77%  { transform: translateX(-38vw) translateY(17vh)  scale(0.48); }
+  88%  { transform: translateX(46vw)  translateY(-11vh) scale(0.83); }
+  100% { transform: translateX(-7vw)  translateY(41vh)  scale(0.67); }
+}
+
+@keyframes move9 {
+  0%     { transform: translateX(-27vw) translateY(31vh)  scale(0.58); }
+  7.69%  { transform: translateX(16vw)  translateY(-45vh) scale(0.83); }
+  15.38% { transform: translateX(-43vw) translateY(8vh)   scale(0.47); }
+  23.08% { transform: translateX(38vw)  translateY(-19vh) scale(0.92); }
+  30.77% { transform: translateX(-9vw)  translateY(48vh)  scale(0.61); }
+  38.46% { transform: translateX(47vw)  translateY(-36vh) scale(0.79); }
+  46.15% { transform: translateX(-21vw) translateY(25vh)  scale(0.44); }
+  53.85% { transform: translateX(6vw)   translateY(-12vh) scale(0.96); }
+  61.54% { transform: translateX(-49vw) translateY(43vh)  scale(0.53); }
+  69.23% { transform: translateX(29vw)  translateY(-7vh)  scale(0.74); }
+  76.92% { transform: translateX(-14vw) translateY(-41vh) scale(0.87); }
+  84.62% { transform: translateX(41vw)  translateY(33vh)  scale(0.39); }
+  92.31% { transform: translateX(-32vw) translateY(-26vh) scale(0.68); }
+  100%   { transform: translateX(11vw)  translateY(17vh)  scale(0.91); }
+}
+
+@keyframes move10 {
+  0%     { transform: translateX(48vw)  translateY(-39vh) scale(0.54); }
+  12.5%  { transform: translateX(-31vw) translateY(22vh)  scale(0.79); }
+  25%    { transform: translateX(17vw)  translateY(-14vh) scale(0.43); }
+  37.5%  { transform: translateX(-42vw) translateY(45vh)  scale(0.86); }
+  50%    { transform: translateX(4vw)   translateY(-28vh) scale(0.67); }
+  62.5%  { transform: translateX(36vw)  translateY(11vh)  scale(0.94); }
+  75%    { transform: translateX(-18vw) translateY(-49vh) scale(0.51); }
+  87.5%  { transform: translateX(45vw)  translateY(37vh)  scale(0.72); }
+  100%   { transform: translateX(-8vw)  translateY(-6vh)  scale(0.85); }
+}
+
+@keyframes move11 {
+  0%     { transform: translateX(22vw)  translateY(44vh)  scale(0.69); }
+  8.33%  { transform: translateX(-46vw) translateY(-17vh) scale(0.84); }
+  16.67% { transform: translateX(13vw)  translateY(-42vh) scale(0.52); }
+  25%    { transform: translateX(-28vw) translateY(36vh)  scale(0.93); }
+  33.33% { transform: translateX(47vw)  translateY(-8vh)  scale(0.41); }
+  41.67% { transform: translateX(-7vw)  translateY(27vh)  scale(0.76); }
+  50%    { transform: translateX(34vw)  translateY(-46vh) scale(0.58); }
+  58.33% { transform: translateX(-41vw) translateY(13vh)  scale(0.87); }
+  66.67% { transform: translateX(18vw)  translateY(49vh)  scale(0.46); }
+  75%    { transform: translateX(-3vw)  translateY(-33vh) scale(0.73); }
+  83.33% { transform: translateX(43vw)  translateY(19vh)  scale(0.61); }
+  91.67% { transform: translateX(-36vw) translateY(-24vh) scale(0.95); }
+  100%   { transform: translateX(9vw)   translateY(38vh)  scale(0.77); }
+}
+
+@keyframes move12 {
+  0%     { transform: translateX(-15vw) translateY(-8vh)  scale(0.89); }
+  9.09%  { transform: translateX(39vw)  translateY(46vh)  scale(0.54); }
+  18.18% { transform: translateX(-43vw) translateY(-31vh) scale(0.71); }
+  27.27% { transform: translateX(24vw)  translateY(15vh)  scale(0.38); }
+  36.36% { transform: translateX(-8vw)  translateY(-43vh) scale(0.82); }
+  45.45% { transform: translateX(46vw)  translateY(28vh)  scale(0.66); }
+  54.55% { transform: translateX(-33vw) translateY(7vh)   scale(0.91); }
+  63.64% { transform: translateX(11vw)  translateY(-37vh) scale(0.48); }
+  72.73% { transform: translateX(-47vw) translateY(41vh)  scale(0.74); }
+  81.82% { transform: translateX(27vw)  translateY(-14vh) scale(0.57); }
+  90.91% { transform: translateX(-19vw) translateY(32vh)  scale(0.43); }
+  100%   { transform: translateX(42vw)  translateY(-26vh) scale(0.85); }
+}
+
+@keyframes move13 {
+  0%     { transform: translateX(31vw)  translateY(-21vh) scale(0.61); }
+  5.56%  { transform: translateX(-44vw) translateY(34vh)  scale(0.78); }
+  11.11% { transform: translateX(8vw)   translateY(46vh)  scale(0.43); }
+  16.67% { transform: translateX(-26vw) translateY(-11vh) scale(0.92); }
+  22.22% { transform: translateX(47vw)  translateY(-47vh) scale(0.55); }
+  27.78% { transform: translateX(-12vw) translateY(19vh)  scale(0.84); }
+  33.33% { transform: translateX(36vw)  translateY(-3vh)  scale(0.47); }
+  38.89% { transform: translateX(-49vw) translateY(42vh)  scale(0.73); }
+  44.44% { transform: translateX(19vw)  translateY(-28vh) scale(0.96); }
+  50%    { transform: translateX(-7vw)  translateY(11vh)  scale(0.58); }
+  55.56% { transform: translateX(44vw)  translateY(38vh)  scale(0.41); }
+  61.11% { transform: translateX(-37vw) translateY(-44vh) scale(0.79); }
+  66.67% { transform: translateX(14vw)  translateY(24vh)  scale(0.64); }
+  72.22% { transform: translateX(-31vw) translateY(-16vh) scale(0.87); }
+  77.78% { transform: translateX(42vw)  translateY(48vh)  scale(0.52); }
+  83.33% { transform: translateX(-22vw) translateY(-37vh) scale(0.95); }
+  88.89% { transform: translateX(6vw)   translateY(29vh)  scale(0.68); }
+  100%   { transform: translateX(-48vw) translateY(7vh)   scale(0.83); }
+}
+
+@keyframes move14 {
+  0%     { transform: translateX(-34vw) translateY(-19vh) scale(0.76); }
+  11.11% { transform: translateX(26vw)  translateY(47vh)  scale(0.49); }
+  22.22% { transform: translateX(-11vw) translateY(-38vh) scale(0.91); }
+  33.33% { transform: translateX(43vw)  translateY(12vh)  scale(0.62); }
+  44.44% { transform: translateX(-48vw) translateY(29vh)  scale(0.85); }
+  55.56% { transform: translateX(17vw)  translateY(-43vh) scale(0.53); }
+  66.67% { transform: translateX(-6vw)  translateY(36vh)  scale(0.74); }
+  77.78% { transform: translateX(38vw)  translateY(-8vh)  scale(0.41); }
+  88.89% { transform: translateX(-23vw) translateY(21vh)  scale(0.97); }
+  100%   { transform: translateX(9vw)   translateY(-49vh) scale(0.66); }
+}
+
+@keyframes move15 {
+  0%   { transform: translateX(45vw)  translateY(38vh)  scale(0.57); }
+  7%   { transform: translateX(-17vw) translateY(-46vh) scale(0.82); }
+  14%  { transform: translateX(32vw)  translateY(13vh)  scale(0.44); }
+  21%  { transform: translateX(-43vw) translateY(27vh)  scale(0.93); }
+  28%  { transform: translateX(8vw)   translateY(-34vh) scale(0.61); }
+  35%  { transform: translateX(-27vw) translateY(-8vh)  scale(0.75); }
+  42%  { transform: translateX(48vw)  translateY(42vh)  scale(0.48); }
+  49%  { transform: translateX(-9vw)  translateY(-22vh) scale(0.89); }
+  56%  { transform: translateX(23vw)  translateY(-48vh) scale(0.54); }
+  63%  { transform: translateX(-38vw) translateY(16vh)  scale(0.71); }
+  70%  { transform: translateX(14vw)  translateY(39vh)  scale(0.96); }
+  77%  { transform: translateX(-47vw) translateY(-13vh) scale(0.43); }
+  84%  { transform: translateX(37vw)  translateY(-27vh) scale(0.78); }
+  91%  { transform: translateX(-21vw) translateY(44vh)  scale(0.62); }
+  100% { transform: translateX(5vw)   translateY(-3vh)  scale(0.85); }
+}
+
+@keyframes drift {
+  0%   { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+
+@keyframes flash {
+  0%, 30%, 100% {
+    opacity: 0;
+    box-shadow: 0 0 0vw 0vw #f5b800;
+  }
+  5% {
+    opacity: 1;
+    box-shadow: 0 0 2vw 0.4vw #f5b800;
+  }
+}
--- a/css/style.css
+++ b/css/style.css
--- a/festivals.html
+++ b/festivals.html
@@ -1,182 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Festivals — SaborFlow Da Nang</title>
-  <meta name="description" content="Latin dance festivals in Da Nang, Vietnam. Multi-day events with international artists, workshops, and social dancing.">
-  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-<body>
-
-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html">Home</a></li>
-        <li><a href="schedule.html">Schedule</a></li>
-        <li><a href="connect.html">Connect</a></li>
-        <li><a href="studios.html">Studios</a></li>
-        <li><a href="classes.html">Classes</a></li>
-        <li><a href="festivals.html" class="active">Festivals</a></li>
-      </ul>
-    </div>
-  </nav>
-
-  <div class="container">
-    <div class="page-header">
-      <p class="section-label">Da Nang 2026</p>
-      <h1>Festivals</h1>
-      <p class="subtitle">Multi-day Latin dance events right here in Da Nang &mdash; workshops, performances, and non-stop social dancing.</p>
-    </div>
-
-    <!-- Latin Escape Da Nang 2026 -->
-    <div class="festival-card festival-card-le">
-      <div class="festival-poster">
-        <div class="festival-poster-content">
-          <h2>Latin Escape Da Nang</h2>
-          <div class="festival-dates">May 15 &ndash; 17, 2026</div>
-        </div>
-      </div>
-      <div class="festival-body">
-        <div class="festival-meta">
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <strong>May 15&ndash;17, 2026</strong>
-          </div>
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            Royal Lotus Hotel &middot; <strong>My Khe Beach, Da Nang</strong>
-          </div>
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>
-            <strong>Bachata &middot; Kizomba</strong>
-          </div>
-        </div>
-        <div class="tags" style="margin-bottom:1rem">
-          <span class="tag tag-bachata">Bachata</span>
-          <span class="tag tag-kizomba">Kizomba</span>
-        </div>
-        <p class="festival-desc">
-          A destination-style festival set against the backdrop of Da Nang&rsquo;s stunning beach. Three days of workshops, social parties, and performances with international artists. The perfect excuse to combine dancing with a beach getaway.
-        </p>
-        <div class="festival-links">
-          <a href="https://www.facebook.com/latin.escape.danang/" target="_blank" rel="noopener" class="btn btn-ghost">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Facebook
-          </a>
-          <a href="https://www.instagram.com/latin.escape.danang/" target="_blank" rel="noopener" class="btn btn-ghost">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            Instagram
-          </a>
-          <a href="https://www.tickettailor.com/events/latinescapedanang" target="_blank" rel="noopener" class="btn btn-primary">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z"/></svg>
-            Buy Tickets
-          </a>
-        </div>
-      </div>
-    </div>
-
-    <!-- Vietnam Latin Xperience 2026 -->
-    <div class="festival-card festival-card-vlx">
-      <div class="festival-poster">
-        <div class="festival-poster-content">
-          <h2>Vietnam Latin Xperience</h2>
-          <div class="festival-dates">October 2 &ndash; 4, 2026</div>
-        </div>
-      </div>
-      <div class="festival-body">
-        <div class="festival-meta">
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
-            <strong>October 2&ndash;4, 2026</strong>
-          </div>
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            Da Nang Beach &middot; <strong>Da Nang</strong>
-          </div>
-          <div class="festival-meta-item">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>
-            <strong>Salsa &middot; Bachata &middot; Kizomba &middot; Zouk &amp; more</strong>
-          </div>
-        </div>
-        <div class="tags" style="margin-bottom:1rem">
-          <span class="tag tag-salsa">Salsa</span>
-          <span class="tag tag-bachata">Bachata</span>
-          <span class="tag tag-kizomba">Kizomba</span>
-          <span class="tag tag-zouk">Zouk</span>
-          <span class="tag tag-tango">Urban Kiz</span>
-          <span class="tag tag-tango">Konpa</span>
-        </div>
-        <p class="festival-desc">
-          Now in its 7th edition and recently moved to Da Nang, the Vietnam Latin Xperience (VLX) is one of Southeast Asia&rsquo;s most beloved Latin festivals. Three days of workshops, bootcamps, and social parties with a warm, family-like community vibe. International artists, beautiful beach setting, unforgettable nights.
-        </p>
-        <div class="festival-links">
-          <a href="https://vietnamlatinxperience.com" target="_blank" rel="noopener" class="btn btn-ghost">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
-            Website
-          </a>
-          <a href="https://www.facebook.com/VietnamLatinXperience/" target="_blank" rel="noopener" class="btn btn-ghost">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Facebook
-          </a>
-          <a href="https://www.tickettailor.com" target="_blank" rel="noopener" class="btn btn-primary">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z"/></svg>
-            Buy Tickets
-          </a>
-        </div>
-      </div>
-    </div>
-
-    <div style="background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center">
-      <p style="color:var(--muted);margin-bottom:1rem">Know of a festival we should add? Or organizing one yourself?</p>
-      <a href="connect.html" class="btn btn-ghost">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-        <span>Tell Us About It</span>
-      </a>
-    </div>
-  </div>
-
-  <footer class="footer" style="margin-top:4rem">
-    <div class="container">
-      <div class="footer-inner">
-        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
-        </div>
-      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
-    </div>
-  </footer>
-
-  <script src="js/main.js"></script>
-</body>
-</html>
--- a/festivals/index.html
+++ b/festivals/index.html
@@ -0,0 +1,262 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Festivals — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="Latin dance festivals in Da Nang, Vietnam. Multi-day events with international artists, workshops, and social dancing.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/festivals/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Festivals — Sabor Flow Da Nang">
+  <meta property="og:description" content="Latin dance festivals in Da Nang, Vietnam. Multi-day events with international artists, workshops, and social dancing.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/festivals/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav">
+    <button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals" class="active">Festivals</a>
+    <a href="/playlists">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals" class="active">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Da Nang <em>Festivals</em></h1>
+      <div class="info">
+        Multi-day Latin dance events right here in Da Nang &mdash; workshops, performances, and non-stop social dancing
+        with international artists.
+      </div>
+    </div>
+
+    <!-- Latin Escape Da Nang 2026 -->
+    <div class="sfB-fest">
+      <div class="poster coral"
+        style="background: linear-gradient(160deg, rgba(50,10,10,0.48) 0%, rgba(15,4,4,0.72) 100%), url('../assets/latin-escape-danang.jpg') center/cover no-repeat;">
+        <span class="pill">Festival · 2026</span>
+        <div>
+          <div class="name">Latin <em>Escape</em></div>
+          <div class="dates">May 15 – 17, 2026</div>
+        </div>
+      </div>
+      <div class="body">
+        <div class="meta">
+          <div class="item">
+            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
+              <line x1="16" y1="2" x2="16" y2="6" />
+              <line x1="8" y1="2" x2="8" y2="6" />
+              <line x1="3" y1="10" x2="21" y2="10" />
+            </svg>
+            <span><b>May 15–17, 2026</b></span>
+          </div>
+          <div class="item">
+            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" />
+              <circle cx="12" cy="10" r="3" />
+            </svg>
+            <span>Royal Lotus Hotel · <b>My Khe Beach, Da Nang</b></span>
+          </div>
+        </div>
+        <div class="styles">
+          <span class="sfB-chip bachata">Bachata</span>
+          <span class="sfB-chip kizomba">Kizomba</span>
+        </div>
+        <p>A destination-style festival set against the backdrop of Da Nang's stunning beach. Three days of workshops,
+          social parties, and performances with international artists. The perfect excuse to combine dancing with a
+          beach getaway.</p>
+        <div class="acts">
+          <a href="https://www.facebook.com/latin.escape.danang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            Facebook
+          </a>
+          <a href="https://www.instagram.com/latin.escape.danang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            Instagram
+          </a>
+          <a href="https://www.tickettailor.com/events/latinescapedanang" target="_blank" rel="noopener"
+            class="primary">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path
+                d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z" />
+            </svg>
+            Buy Tickets
+          </a>
+        </div>
+      </div>
+    </div>
+
+    <!-- Vietnam Latin Xperience 2026 -->
+    <div class="sfB-fest">
+      <div class="poster teal"
+        style="background: linear-gradient(160deg, rgba(8,25,30,0.48) 0%, rgba(3,12,16,0.72) 100%), url('../assets/xperience.jpg') center/cover no-repeat;">
+        <span class="pill">Festival · 2026</span>
+        <div>
+          <div class="name">Vietnam Latin <em>Xperience</em></div>
+          <div class="dates">October 2 – 4, 2026</div>
+        </div>
+      </div>
+      <div class="body">
+        <div class="meta">
+          <div class="item">
+            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
+              <line x1="16" y1="2" x2="16" y2="6" />
+              <line x1="8" y1="2" x2="8" y2="6" />
+              <line x1="3" y1="10" x2="21" y2="10" />
+            </svg>
+            <span><b>October 2–4, 2026</b></span>
+          </div>
+          <div class="item">
+            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" />
+              <circle cx="12" cy="10" r="3" />
+            </svg>
+            <span>Da Nang Beach · <b>Da Nang</b></span>
+          </div>
+        </div>
+        <div class="styles">
+          <span class="sfB-chip salsa">Salsa</span>
+          <span class="sfB-chip bachata">Bachata</span>
+          <span class="sfB-chip kizomba">Kizomba</span>
+          <span class="sfB-chip zouk">Zouk</span>
+        </div>
+        <p>Now in its 7th edition and recently moved to Da Nang, the Vietnam Latin Xperience (VLX) is one of Southeast
+          Asia's most beloved Latin festivals. Three days of workshops, bootcamps, and social parties with a warm,
+          family-like community vibe.</p>
+        <div class="acts">
+          <a href="https://vietnamlatinxperience.com" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <circle cx="12" cy="12" r="10" />
+              <line x1="2" y1="12" x2="22" y2="12" />
+              <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
+            </svg>
+            Website
+          </a>
+          <a href="https://www.facebook.com/VietnamLatinXperience/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            Facebook
+          </a>
+          <a href="https://www.tickettailor.com/events/besolatinovietnam/1872818" target="_blank" rel="noopener"
+            class="primary">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path
+                d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z" />
+            </svg>
+            Buy Tickets
+          </a>
+        </div>
+      </div>
+    </div>
+
+    <div class="sfB-suggest">
+      <p>Know of a festival we should add? Or organizing one yourself?</p>
+      <a href="/connect" class="sfB-btn ghost">Tell Us About It</a>
+    </div>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+</body>
+
+</html>
--- a/index.html
+++ b/index.html
@@ -1,175 +1,292 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
 <html lang="en">
+
 <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>SaborFlow Da Nang — Latin Dance Community</title>
-  <meta name="description" content="Da Nang's Latin dance community. Weekly socials, studios, classes, and festivals for Salsa, Bachata, Kizomba, and Zouk.">
+  <title>Sabor Flow Da Nang — Dance community</title>
+  <meta name="description"
+    content="Da Nang's Latin dance community. Weekly socials, studios, classes, and festivals for Salsa, Bachata, Kizomba, and Zouk.">
  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Sabor Flow Da Nang — Dance community">
+  <meta property="og:description" content="Da Nang's Latin dance community. Weekly socials, studios, classes, and festivals for Salsa, Bachata, Kizomba, and Zouk.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh"}</script>
 </head>
+
 <body>

-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html" class="active">Home</a></li>
-        <li><a href="schedule.html">Schedule</a></li>
-        <li><a href="connect.html">Connect</a></li>
-        <li><a href="studios.html">Studios</a></li>
-        <li><a href="classes.html">Classes</a></li>
-        <li><a href="festivals.html">Festivals</a></li>
-      </ul>
+  <!-- Background blobs -->
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
    </div>
+  </div>
+
+  <!-- Mobile nav overlay -->
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav" aria-label="Mobile navigation">
+    <button class="mnav-close" id="sfB-mobile-nav-close" aria-label="Close menu">✕</button>
+    <a href="/" class="active">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists">Playlists</a>
  </nav>

-  <!-- HERO -->
-  <section class="hero">
-    <div class="hero-content">
-      <p class="hero-eyebrow">Da Nang &middot; Vietnam</p>
-      <img src="assets/logo.jpg" alt="SaborFlow Da Nang" class="hero-logo">
-      <h1 class="hero-title">SaborFlow</h1>
-      <div class="hero-rule"></div>
-      <p class="hero-subtitle">Latin Dance Community</p>
-      <div class="hero-ctas">
-        <a href="schedule.html" class="btn btn-primary">
-          <span>Weekly Schedule</span>
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
-        </a>
-        <div class="hero-divider"></div>
-        <a href="studios.html" class="cta-link">
-          Studios
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
-        </a>
-        <div class="hero-divider"></div>
-        <a href="festivals.html" class="cta-link">
-          Festivals
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
-        </a>
+  <!-- Topbar -->
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">
+        Sabor Flow
+        <span class="city">Da Nang</span>
      </div>
-    </div>
-  </section>
+    </a>

-  <!-- ABOUT -->
-  <section>
-    <div class="container">
-      <p class="section-label">What We Are</p>
-      <h2 style="margin-bottom:2.5rem">Community. Music. Dance.</h2>
-      <div class="grid-tight about-grid">
-        <div class="about-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
-          <h3>Social Dancing</h3>
-          <p>Almost-daily gatherings at bars, clubs, and restaurants in Da Nang and Hoi An. Everyone is welcome — beginner or seasoned pro, no judgment.</p>
+    <nav class="sfB-nav" aria-label="Main navigation">
+      <a href="/" class="active">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <!-- Hero -->
+  <section class="sfB-hero">
+    <div class="left">
+      <div class="kicker">
+        <span class="dot"></span>
+        Dance Community · Da Nang · Hoi An
+      </div>
+
+      <h1>
+        <em class="glow">Sabor Flow</em>
+        <span class="vn"><span>DA NANG</span></span>
+      </h1>
+
+      <p class="lead">
+        Latin social dance almost every night of the week. Salsa, Bachata, Kizomba, Zouk — at bars and restaurants
+        across Da Nang and Hoi An. Everyone welcome, no partner needed.
+      </p>
+
+      <div class="ctas">
+        <a href="/schedule" class="sfB-btn primary">
+          Weekly Schedule
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"
+            stroke-linecap="round" stroke-linejoin="round">
+            <line x1="5" y1="12" x2="19" y2="12" />
+            <polyline points="12 5 19 12 12 19" />
+          </svg>
+        </a>
+        <a href="/festivals" class="sfB-btn ghost">Upcoming Festivals</a>
+      </div>
+
+      <div class="meta-row">
+        <div class="item">
+          <div class="v">10+</div>
+          <div class="l">Socials/week</div>
        </div>
-        <div class="about-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>
-          <h3>Salsa &middot; Bachata &middot; Kizomba</h3>
-          <p>The best Latin rhythms all week long. Salsa, Bachata, Kizomba, and the fast-growing Zouk. Great music, warm people, genuine connection.</p>
+        <div class="item">
+          <div class="v">4</div>
+          <div class="l">Dance styles</div>
        </div>
-        <div class="about-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>
-          <h3>Community First</h3>
-          <p>A free, non-profit initiative by two Vietnamese women passionate about dance. Here to support and grow Da Nang's Latin dance scene.</p>
+        <div class="item">
+          <div class="v">2</div>
+          <div class="l">Cities</div>
+        </div>
+        <div class="item">
+          <div class="v">∞</div>
+          <div class="l">Good vibes</div>
        </div>
      </div>
    </div>
-  </section>

-  <!-- COMING UP -->
-  <section>
-    <div class="container">
-      <p class="section-label">This Week</p>
-      <h2 style="margin-bottom:2.5rem">Coming Up</h2>
-      <div class="grid-tight teaser-grid" id="schedule-teaser"></div>
-      <div class="mt-3">
-        <a href="schedule.html" class="cta-link">
-          View full schedule
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
-        </a>
+    <!-- Card stack (decorative) -->
+    <div class="hero-right" aria-hidden="true">
+      <div class="sfB-stack-card c1">
+        <div class="ph"></div>
+        <span class="tag">Bachata</span>
      </div>
-    </div>
-  </section>
-
-  <!-- INSTAGRAM -->
-  <section>
-    <div class="container">
-      <div class="ig-banner">
-        <p class="section-label" style="justify-content:center">Stay Connected</p>
-        <h2 style="margin-bottom:0.65rem">Follow the Community</h2>
-        <p>Catch the latest social dance photos, videos, and event announcements.</p>
-        <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="btn btn-primary">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-          <span>@saborflowdanang</span>
-        </a>
+      <div class="sfB-stack-card c2">
+        <div class="ph"></div>
+        <span class="tag">Kizomba</span>
      </div>
-    </div>
-  </section>
-
-  <!-- EXPLORE -->
-  <section>
-    <div class="container">
-      <p class="section-label">Explore</p>
-      <h2 style="margin-bottom:2.5rem">Find Your Scene</h2>
-      <div class="grid-tight explore-grid">
-        <a href="studios.html" class="explore-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="2" width="16" height="20" rx="2"/><path d="M9 22v-4h6v4"/><path d="M8 6h.01M16 6h.01M8 10h.01M16 10h.01"/></svg>
-          <div class="card-title">Dance Studios</div>
-          <p class="card-text">Dedicated schools offering Salsa, Bachata, Kizomba and more in Da Nang.</p>
-        </a>
-        <a href="classes.html" class="explore-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/></svg>
-          <div class="card-title">Dance Classes</div>
-          <p class="card-text">From total beginner to advanced — find the right class for your level.</p>
-        </a>
-        <a href="festivals.html" class="explore-card">
-          <svg class="card-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
-          <div class="card-title">Festivals</div>
-          <p class="card-text">Multi-day events with international artists, workshops, and socials.</p>
-        </a>
+      <div class="sfB-stack-card c3">
+        <div class="ph"></div>
+        <span class="tag">Salsa</span>
      </div>
-    </div>
-  </section>
-
-  <footer class="footer">
-    <div class="container">
-      <div class="footer-inner">
+      <div class="badge">
+        <div class="ic">🎶</div>
        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
+          <div class="t">Socials almost every night</div>
+          <div class="s">Da Nang · Hoi An</div>
        </div>
      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
+    </div>
+  </section>
+
+  <!-- Marquee -->
+  <div class="sfB-marquee" aria-hidden="true">
+    <div class="track">
+      <span>Salsa</span>
+      <span>Bachata</span>
+      <span>Kizomba</span>
+      <span>Zouk</span>
+      <span>Da Nang</span>
+      <span>Hoi An</span>
+      <span>Salsa</span>
+      <span>Bachata</span>
+      <span>Kizomba</span>
+      <span>Zouk</span>
+      <span>Da Nang</span>
+      <span>Hoi An</span>
+      <span>Salsa</span>
+      <span>Bachata</span>
+      <span>Kizomba</span>
+      <span>Zouk</span>
+      <span>Da Nang</span>
+      <span>Hoi An</span>
+      <span>Salsa</span>
+      <span>Bachata</span>
+      <span>Kizomba</span>
+      <span>Zouk</span>
+      <span>Da Nang</span>
+      <span>Hoi An</span>
+    </div>
+  </div>
+
+  <!-- Pillars -->
+  <section class="sfB-pillars">
+    <div class="head">
+      <h2>What we <em>do</em></h2>
+      <span class="num">— 01 / 03</span>
+    </div>
+    <div class="sfB-grid3">
+      <div class="sfB-pcard c1">
+        <span class="num">01</span>
+        <div class="arr">→</div>
+        <h3>Social <em>Dancing</em></h3>
+        <p>Almost-daily gatherings at bars, clubs, and restaurants. Small cover charge, great music, warm people.
+          Beginner or pro — everyone is welcome.</p>
+      </div>
+      <div class="sfB-pcard c2">
+        <span class="num">02</span>
+        <div class="arr">→</div>
+        <h3>Multiple <em>Styles</em></h3>
+        <p>Salsa, Bachata, Kizomba, and the fast-growing Zouk. Each night has its own vibe and music ratio — find the
+          scene that moves you.</p>
+      </div>
+      <div class="sfB-pcard c3">
+        <span class="num">03</span>
+        <div class="arr">→</div>
+        <h3><em>Community</em> First</h3>
+        <p>A free, non-profit initiative by two Vietnamese women passionate about dance. Here to support and grow Da
+          Nang's Latin dance scene.</p>
+      </div>
+    </div>
+  </section>
+
+  <!-- Coming up teaser -->
+  <section class="sfB-coming">
+    <div class="head">
+      <h2>Coming up <em>this week</em></h2>
+      <a href="/schedule">
+        Full schedule
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <line x1="5" y1="12" x2="19" y2="12" />
+          <polyline points="12 5 19 12 12 19" />
+        </svg>
+      </a>
+    </div>
+    <div class="sfB-coming-row" id="sfB-coming-row"></div>
+  </section>
+
+  <!-- CTA block -->
+  <div class="sfB-cta">
+    <div>
+      <div class="quote">
+        Dance is how we <em>connect</em> — no language needed.
+      </div>
+      <div class="who">Sabor Flow Da Nang</div>
+    </div>
+    <div class="cta-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">
+        Follow on Instagram
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+      </a>
+    </div>
+  </div>
+
+  <!-- Footer -->
+  <footer class="sfB-foot">
+    <div>
+      <strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
    </div>
  </footer>

-  <script src="js/main.js"></script>
+  <script src="js/main.js?v=0a14c10d"></script>
 </body>
-</html>
+
+</html>
--- a/js/main.js
+++ b/js/main.js
@@ -1,82 +1,395 @@
 // ============================================================
-// SaborFlow Da Nang — main.js
+// Sabor Flow Da Nang — main.js
 // Update SCHEDULE array monthly when the weekly program changes.
 // ============================================================

 const SCHEDULE = [
-  { day: 'Monday',    venue: 'Webe Coffee',       social: 'BOM',                music: '8 Bachata · 1 Salsa · 1 Kizomba',  city: 'Da Nang', organizer: 'Luu Phuong & Shai' },
-  { day: 'Tuesday',   venue: 'La Riva',            social: 'Latino Dancing',     music: '2 Salsa · 2 Bachata · 2 Kizomba',  city: 'Hoi An',  organizer: 'David Tavares' },
-  { day: 'Tuesday',   venue: 'Caliz Bar',          social: 'Sensual Night',      music: '3 Bachata · 2 Salsa · 2 Kizomba',  city: 'Da Nang', organizer: 'Daisy Nguyen' },
-  { day: 'Wednesday', venue: 'Ket Fai Bar',        social: 'Bachata Kiz Night',  music: 'Kizomba 19:30 · Bachata 21:00',    city: 'Da Nang', organizer: 'Sean Kim' },
-  { day: 'Thursday',  venue: 'Malibu',             social: 'Salsa Nights',       music: '2 Salsa · 2 Bachata',              city: 'Da Nang', organizer: 'Lucho Giraldes' },
-  { day: 'Friday',    venue: 'An Thuong By Night', social: 'Dance Unity Party',  music: '2 Salsa · 2 Bachata · 2 Kizomba',  city: 'Da Nang', organizer: 'Nadiya Yagfarova' },
-  { day: 'Saturday',  venue: 'La Riva',            social: 'Latino Dancing',     music: '2 Salsa · 2 Bachata · 2 Kizomba',  city: 'Hoi An',  organizer: 'David Tavares' },
-  { day: 'Saturday',  venue: 'An Thuong By Night', social: 'Bachata Party',      music: 'Only Bachata',                     city: 'Da Nang', organizer: 'Vaclav & Kseniya' },
-  { day: 'Sunday',    venue: 'Last Call',          social: 'Latin Dance Social', music: '3 Bachata · 2 Salsa',              city: 'Da Nang', organizer: 'Vaclav & Kseniya' },
-  { day: 'Sunday',    venue: 'Corner Bar',         social: 'Sunday Latin',       music: '3 Bachata · 2 Salsa · 3 Kizomba',  city: 'Da Nang', organizer: 'Daisy Nguyen' },
+  {
+    day: 'Monday',
+    name: 'Bachata on Mondays',
+    when: '8:00 PM – 11:00 PM',
+    fee: '100k VND',
+    venue: 'Webe Coffee',
+    address: '14–16 Nguyễn Hữu Thông, An Hải, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/DiRPZrr4wyW1Wy1eA',
+    music: '8 Bachata · 1 Salsa · 1 Kizomba',
+    city: 'Da Nang',
+    organizer: ['Frog and Goose'],
+    organizerUrl: ['https://www.instagram.com/fgbachata/'],
+    offer: '1 drink included · Workshop included',
+    vibe: 'Workshop (8PM–9:30PM) & Social',
+  },
+  {
+    day: 'Tuesday',
+    name: 'SBK',
+    when: '9:00 PM – 11:30 PM',
+    fee: '100k VND',
+    venue: 'Cáliz',
+    address: '47–49 An Thượng 3, Ngũ Hành Sơn, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/JUBLZ5qHxkwXCe5u7',
+    music: '2 Salsa · 3 Bachata · 2 Kizomba',
+    city: 'Da Nang',
+    organizer: ['Daisy Nguyen'],
+    organizerUrl: ['https://www.facebook.com/minhtrang610'],
+    offer: '50k for first 10 ladies',
+    vibe: 'Elegant Wine Bar',
+  },
+  {
+    day: 'Wednesday',
+    name: 'Kiz & Bachata',
+    when: '7:30 PM – Late',
+    fee: 'FREE',
+    venue: 'Kết Fai',
+    address: '138 Đỗ Bá, Ngũ Hành Sơn, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/W6nRJfwr2Vhy8iK66',
+    music: 'Kizomba · Bachata',
+    city: 'Da Nang',
+    organizer: ['Sean Kim'],
+    organizerUrl: ['https://www.facebook.com/happynowkkop'],
+    offer: 'Buy 1 Cocktail, Get 1 Wine',
+    vibe: 'Kizomba (7:30PM–9:15PM) & Bachata (9:30PM–Late) · Chill bar',
+  },
+  {
+    day: 'Thursday',
+    name: 'Salsa & Bachata',
+    when: '9:00 PM – 11:30 PM',
+    fee: '100k VND',
+    venue: 'Malibu Beach Club',
+    address: 'Bãi tắm, 3 Võ Nguyên Giáp, An Hải, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/GZQC5micBRunbVNP8',
+    music: '2 Salsa · 2 Bachata',
+    city: 'Da Nang',
+    organizer: ['Lucho Giraldes'],
+    organizerUrl: ['https://www.facebook.com/luchogiraldespersonal'],
+    offer: 'Beach club snacks available',
+    vibe: 'Open-air Sea Breeze',
+  },
+  {
+    day: 'Friday',
+    name: 'Salsa & Bachata',
+    when: '8:00 PM – Late',
+    fee: '100k VND',
+    venue: 'An Thượng By Night',
+    address: '100 Lã Xuân Oai, Ngũ Hành Sơn, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/R6mH4uQfAZtUWiH87',
+    music: '2 Salsa · 2 Bachata · 2 Kizomba',
+    city: 'Da Nang',
+    organizer: ['Nadya Yafarova'],
+    organizerUrl: ['https://www.facebook.com/yagfarova'],
+    offer: 'Free for first 10 ladies',
+    vibe: 'Community Family',
+  },
+  {
+    day: 'Saturday',
+    name: '100% Kizomba',
+    when: '8:00 PM – 11:00 PM',
+    fee: '100k VND',
+    venue: 'LiiDy Studio',
+    address: '75 Thái Phiên, Hải Châu, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/GZ5UtDPFafW1BCSP9',
+    music: 'Kizomba',
+    city: 'Da Nang',
+    organizer: ['Kate Bvote'],
+    organizerUrl: ['https://www.facebook.com/kate.bovt'],
+    offer: '1 Drinking water included',
+    vibe: 'Deep Connection',
+  },
+  {
+    day: 'Sunday',
+    name: 'SBK',
+    when: '8:30 PM – Late',
+    fee: '50k VND',
+    venue: 'The Workshop',
+    address: '35 Chế Lan Viên, Ngũ Hành Sơn, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/xxVwTocSQHKU1Ejd8',
+    music: '2 Salsa · 3 Bachata · 3 Kizomba',
+    city: 'Da Nang',
+    organizer: ['Daisy Nguyen'],
+    organizerUrl: ['https://www.facebook.com/minhtrang610'],
+    offer: '1-hr Kiz session included',
+    vibe: 'Festival style rotation',
+  },
+  {
+    day: 'Sunday',
+    name: 'Salsa & Bachata',
+    when: '8:00 PM – 11:30 PM',
+    fee: '100k VND',
+    venue: 'An Thượng By Night',
+    address: '100 Lã Xuân Oai, Ngũ Hành Sơn, Đà Nẵng',
+    mapUrl: 'https://maps.app.goo.gl/R6mH4uQfAZtUWiH87',
+    music: '2 Salsa · 2 Bachata',
+    city: 'Da Nang',
+    organizer: ['Vaclav', 'Ksenia Tokareva'],
+    organizerUrl: ['https://www.facebook.com/vasek.nemec.1', 'https://www.facebook.com/omks234'],
+    offer: '1 drink included & 10% discount on meals',
+    vibe: 'Workshop (8PM–9PM) & Social',
+  },
 ];

-// ---- Navigation ----
+const DAYS_ORDER = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+
+function getTodayName() {
+  return DAYS_ORDER[new Date().getDay()];
+}
+
+// Parse "2 Salsa · 3 Bachata · 1 Kizomba" into sfB-chip spans
+function musicToChips(music) {
+  const styleMap = { salsa: 'salsa', bachata: 'bachata', kizomba: 'kizomba', zouk: 'zouk' };
+  return music.split('·').map(s => s.trim()).filter(Boolean).map(segment => {
+    let cls = '';
+    for (const [key, val] of Object.entries(styleMap)) {
+      if (segment.toLowerCase().includes(key)) { cls = val; break; }
+    }
+    return `<span class="sfB-chip ${cls}">${segment}</span>`;
+  }).join('');
+}
+
+// Build organizer name(s) as linked text
+function organizerLinks(organizer, organizerUrl, stopProp) {
+  const stop = stopProp ? ' onclick="event.stopPropagation()"' : '';
+  return organizer.map((name, i) => {
+    const url = organizerUrl && organizerUrl[i];
+    return url ? `<a href="${url}" target="_blank" rel="noopener"${stop}>${name}</a>` : name;
+  }).join(' & ');
+}
+
+// ---- Nav (mobile) ----
 function initNav() {
-  const hamburger = document.getElementById('hamburger');
-  const navLinks  = document.getElementById('nav-links');
-  if (!hamburger || !navLinks) return;
+  const hamburger = document.getElementById('sfB-hamburger');
+  const mobileNav = document.getElementById('sfB-mobile-nav');
+  const closeBtn = document.getElementById('sfB-mobile-nav-close');

-  hamburger.addEventListener('click', () => {
-    const isOpen = navLinks.classList.toggle('open');
-    hamburger.setAttribute('aria-expanded', String(isOpen));
+  if (!hamburger || !mobileNav) return;
+
+  hamburger.addEventListener('click', () => mobileNav.classList.add('open'));
+  if (closeBtn) closeBtn.addEventListener('click', () => mobileNav.classList.remove('open'));
+
+  mobileNav.querySelectorAll('a').forEach(link => {
+    link.addEventListener('click', () => mobileNav.classList.remove('open'));
  });

-  navLinks.querySelectorAll('a').forEach(link => {
-    link.addEventListener('click', () => navLinks.classList.remove('open'));
+  mobileNav.addEventListener('click', e => {
+    if (e.target === mobileNav) mobileNav.classList.remove('open');
  });
 }

-// ---- Schedule: full table ----
-function renderScheduleTable() {
-  const tbody = document.getElementById('schedule-tbody');
-  if (!tbody) return;
+// ---- Event detail modal ----
+let _sortedSchedule = [];

-  tbody.innerHTML = SCHEDULE.map(row => `
-    <tr>
-      <td data-label="Day">
-        <span class="day-badge day-${row.day.toLowerCase()}">${row.day}</span>
-      </td>
-      <td data-label="Venue" class="venue-name">${row.venue}</td>
-      <td data-label="Social" class="social-name">${row.social}</td>
-      <td data-label="Music"  class="music-text">${row.music}</td>
-      <td data-label="City"><span class="city-badge">${row.city}</span></td>
-      <td data-label="Organizer" class="organizer-text">${row.organizer}</td>
-    </tr>
-  `).join('');
+function openEventModal(row) {
+  const modal = document.getElementById('sfB-ev-modal');
+  if (!modal) return;
+
+  const now = new Date();
+  const offset = (DAYS_ORDER.indexOf(row.day) - now.getDay() + 7) % 7;
+  const date = new Date(now);
+  date.setDate(now.getDate() + offset);
+  const dateLabel = `${date.getDate()}/${date.getMonth() + 1}`;
+
+  document.getElementById('sfB-ev-modal-day').textContent = `${dateLabel} · ${row.day} · ${row.when}`;
+  document.getElementById('sfB-ev-modal-name').textContent = row.name;
+
+  const orgLinks = organizerLinks(row.organizer, row.organizerUrl, false);
+
+  document.getElementById('sfB-ev-modal-body').innerHTML = `
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Venue</span>
+      <span class="sfB-ev-val">
+        <a href="${row.mapUrl}" target="_blank" rel="noopener">📍 ${row.venue}</a>
+        <span class="sfB-ev-address">${row.address}</span>
+      </span>
+    </div>
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Music</span>
+      <span class="sfB-ev-val sfB-ev-chips">${musicToChips(row.music)}</span>
+    </div>
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Host</span>
+      <span class="sfB-ev-val"><span>${orgLinks}</span></span>
+    </div>
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Entry</span>
+      <span class="sfB-ev-val sfB-ev-fee">${row.fee}</span>
+    </div>
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Offer</span>
+      <span class="sfB-ev-val sfB-ev-offer">${row.offer}</span>
+    </div>
+    <div class="sfB-ev-row">
+      <span class="sfB-ev-label">Vibe</span>
+      <span class="sfB-ev-val">${row.vibe}</span>
+    </div>
+  `;
+
+  modal.classList.add('open');
+  document.body.style.overflow = 'hidden';
 }

-// ---- Home: "Coming up this week" teaser (3 events starting from today) ----
-function renderScheduleTeaser() {
-  const container = document.getElementById('schedule-teaser');
+function initEventModal() {
+  const modal = document.getElementById('sfB-ev-modal');
+  if (!modal) return;
+
+  function closeModal() {
+    modal.classList.remove('open');
+    document.body.style.overflow = '';
+  }
+
+  document.getElementById('sfB-ev-modal-close').addEventListener('click', closeModal);
+  document.getElementById('sfB-ev-modal-overlay').addEventListener('click', closeModal);
+  document.addEventListener('keydown', e => {
+    if (e.key === 'Escape' && modal.classList.contains('open')) closeModal();
+  });
+}
+
+// ---- Schedule: dynamic filter pills ----
+function renderScheduleFilters(events) {
+  const container = document.getElementById('sfB-schedule-pills');
  if (!container) return;

-  const DAYS = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
-  const today = DAYS[new Date().getDay()];
-  const startIdx = DAYS.indexOf(today);
-  const order = [...DAYS.slice(startIdx), ...DAYS.slice(0, startIdx)];
+  const styleOptions = [
+    { key: 'salsa', label: 'Salsa' },
+    { key: 'bachata', label: 'Bachata' },
+    { key: 'kizomba', label: 'Kizomba' },
+    { key: 'zouk', label: 'Zouk' },
+  ];
+  const cityOptions = [
+    { key: 'hoian', label: 'Hoi An', match: 'hoi an' },
+  ];
+
+  const activeStyles = styleOptions.filter(s =>
+    events.some(e => e.music.toLowerCase().includes(s.key))
+  );
+  const activeCities = cityOptions.filter(c =>
+    events.some(e => e.city.toLowerCase().includes(c.match))
+  );
+
+  container.innerHTML = [
+    '<button class="filter-pill active" data-filter="all">All</button>',
+    ...activeStyles.map(s => `<button class="filter-pill" data-filter="${s.key}">${s.label}</button>`),
+    ...activeCities.map(c => `<button class="filter-pill" data-filter="${c.key}">${c.label}</button>`),
+  ].join('');
+
+  container.querySelectorAll('.filter-pill').forEach(pill => {
+    pill.addEventListener('click', () => {
+      container.querySelectorAll('.filter-pill').forEach(p => p.classList.remove('active'));
+      pill.classList.add('active');
+      const f = pill.dataset.filter;
+      document.querySelectorAll('#sfB-schedule-list .sfB-row').forEach(row => {
+        if (f === 'all') { row.style.display = ''; return; }
+        const music = row.dataset.music || '';
+        const city = row.dataset.city || '';
+        const matchCity = f === 'danang' ? 'da nang' : f === 'hoian' ? 'hoi an' : f;
+        row.style.display = (music.includes(f) || city.includes(matchCity)) ? '' : 'none';
+      });
+    });
+  });
+}
+
+// ---- Schedule: full list (schedule.html) ----
+function renderScheduleList() {
+  const list = document.getElementById('sfB-schedule-list');
+  if (!list) return;
+
+  const now = new Date();
+  const todayName = DAYS_ORDER[now.getDay()];
+  const startIdx = DAYS_ORDER.indexOf(todayName);
+
+  const dayOffset = {};
+  DAYS_ORDER.forEach(name => {
+    dayOffset[name] = (DAYS_ORDER.indexOf(name) - startIdx + 7) % 7;
+  });
+
+  _sortedSchedule = [...SCHEDULE].sort((a, b) => dayOffset[a.day] - dayOffset[b.day]);
+
+  renderScheduleFilters(_sortedSchedule);
+
+  list.innerHTML = _sortedSchedule.map((row, i) => {
+    const isToday = row.day === todayName;
+    const offset = dayOffset[row.day];
+    const date = new Date(now);
+    date.setDate(now.getDate() + offset);
+    const dayNum = `${date.getDate()}/${date.getMonth() + 1}`;
+
+    const orgHtml = organizerLinks(row.organizer, row.organizerUrl, true);
+
+    return `
+      <div class="sfB-row${isToday ? ' today' : ''}" data-idx="${i}"
+           data-music="${row.music.toLowerCase()}"
+           data-city="${row.city.toLowerCase()}"
+           tabindex="0" role="button" aria-label="View details for ${row.name}">
+        <div class="col-day">
+          <div class="day-line">
+            <span class="date-num">${dayNum}</span>
+            <span class="name">${row.day}</span>
+          </div>
+          ${isToday ? '<span class="tonight-label">▶ Tonight</span>' : ''}
+        </div>
+        <div class="col-when">${row.when}</div>
+        <div class="col-social">${row.name}</div>
+        <div class="col-org">${orgHtml}</div>
+        <div class="col-music">${musicToChips(row.music)}</div>
+        <div class="col-venue">
+          <span class="pin">📍</span>
+          <a href="${row.mapUrl}" target="_blank" rel="noopener" onclick="event.stopPropagation()">${row.venue}</a>
+        </div>
+      </div>`;
+  }).join('');
+
+  list.querySelectorAll('.sfB-row').forEach(el => {
+    function openRow() {
+      const idx = parseInt(el.dataset.idx, 10);
+      openEventModal(_sortedSchedule[idx]);
+    }
+    el.addEventListener('click', openRow);
+    el.addEventListener('keydown', e => {
+      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openRow(); }
+    });
+  });
+}
+
+// ---- Home: "Coming up" teaser (4 cards starting from today) ----
+function renderScheduleTeaser() {
+  const container = document.getElementById('sfB-coming-row');
+  if (!container) return;
+
+  const now = new Date();
+  const today = getTodayName();
+  const startIdx = DAYS_ORDER.indexOf(today);
+  const order = [...DAYS_ORDER.slice(startIdx), ...DAYS_ORDER.slice(0, startIdx)];
+
+  const dayOffset = {};
+  DAYS_ORDER.forEach(name => {
+    dayOffset[name] = (DAYS_ORDER.indexOf(name) - startIdx + 7) % 7;
+  });

  const sorted = [...SCHEDULE].sort(
    (a, b) => order.indexOf(a.day) - order.indexOf(b.day)
  );

-  container.innerHTML = sorted.slice(0, 3).map(row => `
-    <div class="teaser-card">
-      <div class="teaser-day">${row.day}</div>
-      <div class="teaser-social">${row.social}</div>
-      <div class="teaser-venue">@ ${row.venue}</div>
-      <div class="teaser-meta">${row.music} &middot; ${row.city}</div>
-    </div>
-  `).join('');
+  container.innerHTML = sorted.slice(0, 4).map(row => {
+    const offset = dayOffset[row.day];
+    const date = new Date(now);
+    date.setDate(now.getDate() + offset);
+    const dayNum = `${date.getDate()}/${date.getMonth() + 1}`;
+    const orgText = row.organizer.join(' & ');
+    return `
+    <a href="/schedule/" class="sfB-tcard">
+      <div class="day"><span class="day-date">${dayNum}</span> ${row.day}</div>
+      <div class="when">${row.when || ''}</div>
+      <h4>${row.name}</h4>
+      <div class="organizer">${orgText}</div>
+      <div class="at">@ ${row.venue} · ${row.city}</div>
+      <div class="chips">${musicToChips(row.music)}</div>
+    </a>
+  `;
+  }).join('');
 }

 // ---- Filter pills (studios.html / classes.html) ----
 function initFilters() {
+  const cards = document.querySelectorAll('.filterable-card');
+  if (!cards.length) return;
+
  const pills = document.querySelectorAll('.filter-pill');
  if (!pills.length) return;

@@ -86,7 +399,7 @@ function initFilters() {
      pill.classList.add('active');

      const filter = pill.dataset.filter;
-      document.querySelectorAll('.filterable-card').forEach(card => {
+      cards.forEach(card => {
        if (filter === 'all') {
          card.classList.remove('hidden');
        } else {
@@ -100,10 +413,59 @@ function initFilters() {
  });
 }

+// ---- Palm fronds: lock sizes AND positions to px at load so nothing recalculates on mobile scroll ----
+function lockPalmSizes() {
+  const vw = window.innerWidth;
+  const vh = window.innerHeight;
+  const clamp = (val, min, max) => Math.min(Math.max(val, min), max);
+
+  const config = {
+    'corner-tl': { size: clamp(vw * 0.40, 100, 620), pos: { top: vh * -0.08, left: vw * -0.15 } },
+    'corner-tr': { size: clamp(vw * 0.40, 100, 620), pos: { top: vh * -0.08, right: vw * -0.10 } },
+    'corner-bl': { size: clamp(vw * 0.40, 100, 620), pos: { bottom: vh * -0.08, left: vw * -0.15 } },
+    'corner-br': { size: clamp(vw * 0.40, 100, 620), pos: { bottom: vh * -0.08, right: vw * -0.10 } },
+    'corner-ml': { size: clamp(vw * 0.49, 120, 760), pos: { top: vh * 0.32, left: vw * -0.15 } },
+    'corner-ml2': { size: clamp(vw * 0.45, 110, 700), pos: { top: vh * 0.62, left: vw * -0.10 } },
+    'corner-mr': { size: clamp(vw * 0.44, 110, 680), pos: { top: vh * 0.22, right: vw * -0.10 } },
+    'corner-mr2': { size: clamp(vw * 0.48, 115, 740), pos: { top: vh * 0.70, right: vw * -0.10 } },
+  };
+
+  document.querySelectorAll('.sfB-palm').forEach(el => {
+    for (const cls of el.classList) {
+      const cfg = config[cls];
+      if (!cfg) continue;
+      const px = cfg.size + 'px';
+      el.style.width = px;
+      el.style.height = px;
+      for (const [prop, val] of Object.entries(cfg.pos)) {
+        el.style[prop] = val + 'px';
+      }
+      break;
+    }
+  });
+}
+
+// ---- Fireflies ----
+function initFireflies() {
+  const container = document.createElement('div');
+  container.setAttribute('aria-hidden', 'true');
+  for (let i = 0; i < 15; i++) {
+    const fly = document.createElement('div');
+    fly.className = 'firefly';
+    container.appendChild(fly);
+  }
+  document.body.prepend(container);
+}
+
 // ---- Init ----
 document.addEventListener('DOMContentLoaded', () => {
+  initFireflies();
  initNav();
-  renderScheduleTable();
+  renderScheduleList();
  renderScheduleTeaser();
  initFilters();
+  initEventModal();
+  const yearEl = document.getElementById('footer-year');
+  if (yearEl) yearEl.textContent = new Date().getFullYear();
+  lockPalmSizes();
 });
--- a/js/playlists-data-yt.js
+++ b/js/playlists-data-yt.js
--- a/js/playlists-data.js
+++ b/js/playlists-data.js
--- a/playlists/index.html
+++ b/playlists/index.html
@@ -0,0 +1,660 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Playlists — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="Curated Spotify and YouTube Music playlists for Bachata, Salsa, Kizomba and Zouk. Practice, social dance, or just enjoy.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/playlists/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Playlists — Sabor Flow Da Nang">
+  <meta property="og:description" content="Curated Spotify and YouTube Music playlists for Bachata, Salsa, Kizomba and Zouk. Practice, social dance, or just enjoy.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/playlists/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav">
+    <button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists" class="active">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists" class="active">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Dance <em>Playlists</em></h1>
+      <div class="info">
+        Curated playlists for every mood and level — practice at home, warm up before a social, or just enjoy the music.
+        Available on <b>Spotify</b> and <b>YouTube Music</b>.
+      </div>
+    </div>
+
+    <!-- BACHATA -->
+    <section class="sfB-pl-section">
+      <div class="sfB-pl-section-head">
+        <h2 class="sfB-pl-title">Bachata</h2>
+      </div>
+      <div class="sfB-pl-platform-group">
+        <div class="sfB-pl-grid5">
+          <!-- Spotify -->
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Bachata Lovers</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>3h 22min</span><span>60 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Romantic</span>
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Modern</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/37i9dQZF1DX7MTlMMRl0MD" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="1">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Bachata Classics</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>6h 55min</span><span>100 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Classics</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Most Popular</span>
+              <span class="sfB-pl-tag">Intermediate</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/37i9dQZF1DX65py6HnnlE1" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="0">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Bachata Mix</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>3h 10min</span><span>50 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Varied</span>
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Social</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/37i9dQZF1EIcxvNLzr8YIy" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="2">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">The Sound of Bachata Dominicana</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>14h 36min</span><span>221 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Dominican</span>
+              <span class="sfB-pl-tag">Traditional</span>
+              <span class="sfB-pl-tag">Intermediate</span>
+              <span class="sfB-pl-tag">Authentic</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/6ZOErPbFr6wWQ687g0TQGB" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="11">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Top Hits Bachata 2026</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>5h 53min</span><span>104 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Modern</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Fast</span>
+              <span class="sfB-pl-tag">New Releases</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/3LlsDvsZrhFoFjCED6YHqJ" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="13">Songs</button>
+            </div>
+          </div>
+          <!-- YouTube Music -->
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">Mix bachata Romeo Santos, Aventura, Prince Royce</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>2h 54min</span><span>42 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Most Popular</span>
+              <span class="sfB-pl-tag">Singalong</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Mainstream</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PL1pEq9XJAIquSaz-Y_Vky-BsQIWRmHEqQ" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="1">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">BACHATA 2025 · 2026 🌍</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>17h 15min</span><span>281 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Modern</span>
+              <span class="sfB-pl-tag">New Releases</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Popular</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PLSmJ3-FUDAdYcdd1dWck9OYltTx5IqEJg" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="0">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">bachata dominicana</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>1h 41min</span><span>26 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Dominican</span>
+              <span class="sfB-pl-tag">Authentic</span>
+              <span class="sfB-pl-tag">Traditional</span>
+              <span class="sfB-pl-tag">Danceable</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PLPb4IcL2X0GlbYGmoAM0K-Gn3qj577fk8" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="5">Songs</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- SALSA -->
+    <section class="sfB-pl-section">
+      <div class="sfB-pl-section-head">
+        <h2 class="sfB-pl-title">Salsa</h2>
+      </div>
+      <div class="sfB-pl-platform-group">
+        <div class="sfB-pl-grid5">
+          <!-- Spotify -->
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Salsa Mix</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>4h</span><span>50 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Varied</span>
+              <span class="sfB-pl-tag">Party</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/37i9dQZF1EQlZ5S0kXf8kf" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="6">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Salsa Top 50</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>2h 39min</span><span>40 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Most Popular</span>
+              <span class="sfB-pl-tag">Modern</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Current</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/3UfntaJRD0JsFgZKK1lpzG" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="10">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Salsa Top 100</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>13h 48min</span><span>212 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Essentials</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Classics</span>
+              <span class="sfB-pl-tag">Reference</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/04Yx3q5s7MLF2yXKDulyVS" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="9">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Puerto Rican Salsa Top 100</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>13h 24min</span><span>198 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Puerto Rican</span>
+              <span class="sfB-pl-tag">Classics</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Collector's</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/4P81PgkKWOIKsSBL358koq" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="8">Songs</button>
+            </div>
+          </div>
+          <!-- YouTube Music -->
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">Salsa Cubana Para Bailar</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>1h 29min</span><span>20 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Cuban</span>
+              <span class="sfB-pl-tag">Danceable</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Intermediate</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PLgO3YxRWGM_oMz-QRaXJrJxaHa1bAgPbo" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="2">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">Salsa On2 Social Dancing</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>24h 6min</span><span>457 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">On2</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Intermediate</span>
+              <span class="sfB-pl-tag">Dancers</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PLBnkKhSWQL-ezbIu-tqib-i4WzLFumapu" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="4">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card ytmusic">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
+              <span class="sfB-pl-name">Salsa Music Miami Beach</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>46 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Tropical</span>
+              <span class="sfB-pl-tag">Varied</span>
+              <span class="sfB-pl-tag">Atmosphere</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://music.youtube.com/playlist?list=PL4-E0r_Z8JUvu786sHBIrxgCsEhxQJS6J" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-yt-index="3">Songs</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- KIZOMBA -->
+    <section class="sfB-pl-section">
+      <div class="sfB-pl-section-head">
+        <h2 class="sfB-pl-title">Kizomba</h2>
+      </div>
+      <div class="sfB-pl-platform-group">
+        <div class="sfB-pl-grid5">
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Kizomba Top Hits</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>5h 23min</span><span>104 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Romantic</span>
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Smooth</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/0Pk8kSKJ5vO5yIA36kzGMu" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="3">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">New Kizomba 2024</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>12h 24min</span><span>211 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Modern</span>
+              <span class="sfB-pl-tag">New Releases</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Party</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/2OGQUlFwbnC3AsEEWjMNN1" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="7">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Kizomba</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>8h 23min</span><span>156 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Clear Tempo</span>
+              <span class="sfB-pl-tag">Classes</span>
+              <span class="sfB-pl-tag">Beginner</span>
+              <span class="sfB-pl-tag">Practice</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/4ggFP6oGoumfOobdzvvY2V" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="4">Songs</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- ZOUK -->
+    <section class="sfB-pl-section">
+      <div class="sfB-pl-section-head">
+        <h2 class="sfB-pl-title">Zouk</h2>
+      </div>
+      <div class="sfB-pl-platform-group">
+        <div class="sfB-pl-grid5">
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Zouk Station</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>2h 2min</span><span>40 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Kompa-Zouk</span>
+              <span class="sfB-pl-tag">Modern</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/37i9dQZF1DWZjVBCh3y4ph" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="15">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">The Sound of Zouk</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>24h 48min</span><span>325 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Essentials</span>
+              <span class="sfB-pl-tag">Discovery</span>
+              <span class="sfB-pl-tag">Varied</span>
+              <span class="sfB-pl-tag">Reference</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/7mNGeqFpLOFebS0QrGXU2N" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="12">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">Zouk</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>1h 59min</span><span>36 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Classes</span>
+              <span class="sfB-pl-tag">Clear Tempo</span>
+              <span class="sfB-pl-tag">Beginner</span>
+              <span class="sfB-pl-tag">Practice</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/7M7sDdZMHhpN0huB5moMjY" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="16">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">ZOUK BRAZIL 2026</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>19h</span><span>337 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Brazilian Zouk</span>
+              <span class="sfB-pl-tag">Social</span>
+              <span class="sfB-pl-tag">Modern</span>
+              <span class="sfB-pl-tag">Dancers</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/2V5jTlSJxy8pISP8b4k3L8" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="14">Songs</button>
+            </div>
+          </div>
+          <div class="sfB-pl-card spotify">
+            <div class="sfB-pl-header">
+              <div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
+              <span class="sfB-pl-name">The Best of Kompa Zouk 2025 BY OSOCITY</span>
+            </div>
+            <div class="sfB-pl-spacer"></div>
+            <div class="sfB-pl-meta"><span>4h 50min</span><span>85 songs</span></div>
+            <div class="sfB-pl-tags">
+              <span class="sfB-pl-tag">Kompa-Zouk</span>
+              <span class="sfB-pl-tag">Party</span>
+              <span class="sfB-pl-tag">Popular</span>
+              <span class="sfB-pl-tag">Atmosphere</span>
+            </div>
+            <div class="sfB-pl-actions">
+              <a href="https://open.spotify.com/playlist/6bPKhzRuXrc4yePSBCcals" target="_blank" rel="noopener" class="sfB-pl-btn play">▶ Play</a>
+              <button class="sfB-pl-btn songs" data-pl-index="5">Songs</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <div class="sfB-suggest">
+      <p>Got a playlist we should add? Share it with us!</p>
+      <a href="/connect" class="sfB-btn ghost">Contact Us</a>
+    </div>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <!-- SONGS MODAL -->
+  <div id="sfB-songs-modal" class="sfB-modal" style="display:none" aria-hidden="true" role="dialog" aria-modal="true">
+    <div class="sfB-modal-overlay"></div>
+    <div class="sfB-modal-box">
+      <div class="sfB-modal-head">
+        <div class="sfB-modal-title-wrap">
+          <img src="" alt="Decorative palm frond" class="sfB-modal-logo" id="sfB-modal-logo">
+          <h3 id="sfB-modal-title"></h3>
+        </div>
+        <button class="sfB-modal-close" id="sfB-modal-close" aria-label="Close">✕</button>
+      </div>
+      <div class="sfB-modal-body" id="sfB-modal-body"></div>
+    </div>
+  </div>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+  <script src="../js/playlists-data.js"></script>
+  <script src="../js/playlists-data-yt.js"></script>
+  <script>
+    (function () {
+      var modal = document.getElementById('sfB-songs-modal');
+      var modalTitle = document.getElementById('sfB-modal-title');
+      var modalBody = document.getElementById('sfB-modal-body');
+      var modalLogo = document.getElementById('sfB-modal-logo');
+      var modalClose = document.getElementById('sfB-modal-close');
+      var modalOverlay = modal.querySelector('.sfB-modal-overlay');
+
+      function openModal(data, idx, platform) {
+        var pl = data[idx];
+        if (!pl) return;
+        modalTitle.textContent = pl.name;
+        modalLogo.src = platform === 'ytmusic' ? '../assets/youtubemusic.png' : '../assets/spotify.png';
+        modalLogo.alt = platform === 'ytmusic' ? 'YouTube Music' : 'Spotify';
+        modalBody.innerHTML = pl.songs.map(function (s, i) {
+          return '<div class="sfB-song-row">' +
+            '<span class="sfB-song-num">' + (i + 1) + '</span>' +
+            '<div class="sfB-song-info">' +
+              '<div class="sfB-song-name">' + escHtml(s.n) + '</div>' +
+              (s.a ? '<div class="sfB-song-artist">' + escHtml(s.a) + '</div>' : '') +
+            '</div>' +
+            '<span class="sfB-song-dur">' + escHtml(s.d) + '</span>' +
+          '</div>';
+        }).join('');
+        modal.style.cssText = 'display:flex;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9000;align-items:center;justify-content:center;';
+        document.documentElement.style.overflowY = 'hidden';
+      }
+
+      function closeModal() {
+        modal.style.display = 'none';
+        document.documentElement.style.overflowY = '';
+        modalBody.innerHTML = '';
+      }
+
+      function escHtml(str) {
+        return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+      }
+
+      document.querySelectorAll('.sfB-pl-btn.songs[data-pl-index]').forEach(function (btn) {
+        btn.addEventListener('click', function (e) {
+          e.stopPropagation();
+          openModal(PLAYLISTS_DATA, parseInt(btn.dataset.plIndex, 10), 'spotify');
+        });
+      });
+
+      document.querySelectorAll('.sfB-pl-btn.songs[data-yt-index]').forEach(function (btn) {
+        btn.addEventListener('click', function (e) {
+          e.stopPropagation();
+          openModal(PLAYLISTS_DATA_YT, parseInt(btn.dataset.ytIndex, 10), 'ytmusic');
+        });
+      });
+
+      modalClose.addEventListener('click', closeModal);
+      modalOverlay.addEventListener('click', closeModal);
+      document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeModal(); });
+    })();
+  </script>
+</body>
+
+</html>
--- a/robots.txt
+++ b/robots.txt
@@ -0,0 +1,4 @@
+User-agent: *
+Disallow: /
+
+Sitemap: https://saborflow.ai1.ovh/sitemap.xml
--- a/schedule.html
+++ b/schedule.html
@@ -1,99 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Weekly Schedule — SaborFlow Da Nang</title>
-  <meta name="description" content="The weekly Latin social dance schedule in Da Nang and Hoi An. Salsa, Bachata, Kizomba, Zouk — every day of the week.">
-  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-<body>
-
-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html">Home</a></li>
-        <li><a href="schedule.html" class="active">Schedule</a></li>
-        <li><a href="connect.html">Connect</a></li>
-        <li><a href="studios.html">Studios</a></li>
-        <li><a href="classes.html">Classes</a></li>
-        <li><a href="festivals.html">Festivals</a></li>
-      </ul>
-    </div>
-  </nav>
-
-  <div class="container">
-    <div class="page-header">
-      <p class="section-label">Da Nang &middot; Hoi An</p>
-      <h1>Weekly Schedule</h1>
-      <p class="subtitle">Your guide to social dancing — every single week.</p>
-    </div>
-
-    <div class="schedule-note">
-      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
-      <span>Music ratios (e.g. <strong style="color:var(--text)">2 Salsa · 2 Bachata · 2 Kizomba</strong>) show approximate songs per style per rotation. Schedules may change — follow <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" style="color:var(--teal)">@saborflowdanang</a> and the <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" style="color:var(--teal)">Da Nang SBK group</a> for real-time updates. Pop-up parties for <strong style="color:var(--text)">Zouk</strong> and <strong style="color:var(--text)">Tango</strong> are announced there too.</span>
-    </div>
-
-    <div class="schedule-table-wrap">
-      <table class="schedule-table">
-        <thead>
-          <tr>
-            <th>Day</th>
-            <th>Venue</th>
-            <th>Social</th>
-            <th>Music</th>
-            <th>City</th>
-            <th>Organizer</th>
-          </tr>
-        </thead>
-        <tbody id="schedule-tbody"></tbody>
-      </table>
-    </div>
-
-    <p class="mt-3" style="color:var(--muted);font-size:.78rem">Schedule updated monthly &mdash; last update: <strong style="color:var(--text);font-weight:500">April 2026</strong></p>
-  </div>
-
-  <footer class="footer" style="margin-top:4rem">
-    <div class="container">
-      <div class="footer-inner">
-        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
-        </div>
-      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
-    </div>
-  </footer>
-
-  <script src="js/main.js"></script>
-</body>
-</html>
--- a/schedule/index.html
+++ b/schedule/index.html
@@ -0,0 +1,155 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Weekly Schedule — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="The weekly Latin social dance schedule in Da Nang and Hoi An. Salsa, Bachata, Kizomba, Zouk — every day of the week.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/schedule/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Weekly Schedule — Sabor Flow Da Nang">
+  <meta property="og:description" content="The weekly Latin social dance schedule in Da Nang and Hoi An. Salsa, Bachata, Kizomba, Zouk — every day of the week.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/schedule/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav" aria-label="Mobile navigation">
+    <button class="mnav-close" id="sfB-mobile-nav-close" aria-label="Close menu">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule" class="active">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule" class="active">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Weekly <em>Schedule</em></h1>
+      <div class="info">
+        Music ratios (e.g. <b>2 Salsa · 2 Bachata · 2 Kizomba</b>) show approximate songs per style per rotation.
+        Schedules may change — follow <a href="https://www.instagram.com/saborflowdanang/" target="_blank"
+          rel="noopener">@saborflowdanang</a> for real-time updates.
+      </div>
+    </div>
+
+    <div class="sfB-toolbar">
+      <div class="sfB-pills" id="sfB-schedule-pills"></div>
+    </div>
+    <p class="sfB-sched-hint">Tap any event to see entry fee, special offers &amp; vibe.</p>
+
+    <div class="sfB-list" id="sfB-schedule-list"></div>
+
+    <div class="sfB-ev-modal" id="sfB-ev-modal" role="dialog" aria-modal="true" aria-labelledby="sfB-ev-modal-name">
+      <div class="sfB-modal-overlay" id="sfB-ev-modal-overlay"></div>
+      <div class="sfB-ev-modal-box">
+        <div class="sfB-ev-head">
+          <div>
+            <div class="sfB-ev-day-time" id="sfB-ev-modal-day"></div>
+            <div class="sfB-ev-name" id="sfB-ev-modal-name"></div>
+          </div>
+          <button class="sfB-modal-close" id="sfB-ev-modal-close" aria-label="Close">✕</button>
+        </div>
+        <div class="sfB-ev-body" id="sfB-ev-modal-body"></div>
+      </div>
+    </div>
+
+    <p class="footnote">Schedule updated monthly &mdash; last update: <strong style="color:var(--sf-gold)"
+        id="schedule-last-update"></strong></p>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+  <script>
+    // Dynamic last-update label
+    (function () {
+      const el = document.getElementById('schedule-last-update');
+      if (el) {
+        const now = new Date();
+        el.textContent = now.toLocaleString('en-US', { month: 'long', year: 'numeric' });
+      }
+    })();
+
+  </script>
+</body>
+
+</html>
--- a/sitemap.xml
+++ b/sitemap.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+  <url><loc>https://saborflow.ai1.ovh/</loc><priority>1.0</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/schedule/</loc><priority>0.9</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/studios/</loc><priority>0.8</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/classes/</loc><priority>0.8</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/festivals/</loc><priority>0.8</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/connect/</loc><priority>0.7</priority></url>
+  <url><loc>https://saborflow.ai1.ovh/playlists/</loc><priority>0.6</priority></url>
+</urlset>
--- a/studios.html
+++ b/studios.html
@@ -1,191 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Dance Studios — SaborFlow Da Nang</title>
-  <meta name="description" content="Latin dance studios in Da Nang, Vietnam. Find schools teaching Salsa, Bachata, Kizomba, and Zouk.">
-  <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-<body>
-
-  <nav class="nav">
-    <div class="nav-container">
-      <a href="index.html" class="nav-brand">
-        <img src="assets/logo.jpg" alt="SaborFlow">
-        <span class="nav-brand-name">SABORFLOW</span>
-      </a>
-      <button class="nav-hamburger" id="hamburger" aria-label="Toggle menu" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <ul class="nav-links" id="nav-links">
-        <li><a href="index.html">Home</a></li>
-        <li><a href="schedule.html">Schedule</a></li>
-        <li><a href="connect.html">Connect</a></li>
-        <li><a href="studios.html" class="active">Studios</a></li>
-        <li><a href="classes.html">Classes</a></li>
-        <li><a href="festivals.html">Festivals</a></li>
-      </ul>
-    </div>
-  </nav>
-
-  <div class="container">
-    <div class="page-header">
-      <p class="section-label">Da Nang</p>
-      <h1>Dance Studios</h1>
-      <p class="subtitle">Dedicated schools and venues where you can take Latin dance lessons.</p>
-    </div>
-
-    <div class="filter-bar">
-      <button class="filter-pill active" data-filter="all">All</button>
-      <button class="filter-pill" data-filter="salsa">Salsa</button>
-      <button class="filter-pill" data-filter="bachata">Bachata</button>
-      <button class="filter-pill" data-filter="kizomba">Kizomba</button>
-      <button class="filter-pill" data-filter="zouk">Zouk</button>
-    </div>
-
-    <div class="card-grid">
-
-      <!-- Frog Goose Bachata School -->
-      <div class="card studio-card filterable-card" data-styles="bachata">
-        <div class="card-stripe"></div>
-        <div class="card-body">
-          <div class="card-title">Frog Goose Bachata School</div>
-          <div class="tags">
-            <span class="tag tag-bachata">Bachata</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>292 Vo Nguyen Giap, Bac My Phu, Ngu Hanh Son, Da Nang</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
-            <span>Monday workshops 8:30 PM &middot; Social from 9:30 PM</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Luu Nhat Phuong, Phong &amp; Shai</span>
-          </div>
-          <div class="card-links">
-            <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-              Facebook
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- Salsa Da Nang -->
-      <div class="card studio-card filterable-card" data-styles="salsa">
-        <div class="card-stripe"></div>
-        <div class="card-body">
-          <div class="card-title">Salsa Da Nang</div>
-          <div class="tags">
-            <span class="tag tag-salsa">Salsa On1</span>
-            <span class="tag tag-salsa">Salsa On2</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>Da Nang (various venues &mdash; check website for current location)</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg>
-            <span>Lucho Giraldes &mdash; 20+ years experience, professional performer</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/></svg>
-            <span>Beginner &middot; Intermediate &middot; Advanced</span>
-          </div>
-          <div class="card-links">
-            <a href="https://salsadanang.com" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
-              Website
-            </a>
-            <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-              Instagram
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <!-- LearnToDanceDANANG -->
-      <div class="card studio-card filterable-card" data-styles="salsa,bachata,kizomba,zouk">
-        <div class="card-stripe"></div>
-        <div class="card-body">
-          <div class="card-title">LearnToDance Da Nang</div>
-          <div class="tags">
-            <span class="tag tag-salsa">Salsa</span>
-            <span class="tag tag-bachata">Bachata</span>
-            <span class="tag tag-kizomba">Kizomba</span>
-            <span class="tag tag-zouk">Zouk</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
-            <span>Da Nang</span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.7 13a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.61 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 9.91a16 16 0 0 0 6.09 6.09l.95-.95a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
-            <span><a href="tel:+84855085903" style="color:var(--orange)">+84 85 508 5903</a></span>
-          </div>
-          <div class="card-info">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-            <span><a href="mailto:LearnToDanceDANANG@gmail.com" style="color:var(--orange)">LearnToDanceDANANG@gmail.com</a></span>
-          </div>
-          <div class="card-links">
-            <a href="mailto:LearnToDanceDANANG@gmail.com" class="card-link">
-              <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-              Email
-            </a>
-          </div>
-        </div>
-      </div>
-
-    </div>
-
-    <div class="mt-3" style="background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center">
-      <p style="color:var(--muted);margin-bottom:1rem">Know a studio we&rsquo;re missing? Let us know.</p>
-      <a href="connect.html" class="btn btn-ghost">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
-        <span>Contact Us</span>
-      </a>
-    </div>
-  </div>
-
-  <footer class="footer" style="margin-top:4rem">
-    <div class="container">
-      <div class="footer-inner">
-        <div>
-          <a href="index.html" class="footer-brand">
-            <img src="assets/logo.jpg" alt="SaborFlow">
-            <span class="footer-brand-name">SABORFLOW</span>
-          </a>
-          <p class="footer-tagline">Da Nang's Latin dance community</p>
-        </div>
-        <nav class="footer-nav">
-          <a href="index.html">Home</a>
-          <a href="schedule.html">Schedule</a>
-          <a href="connect.html">Connect</a>
-          <a href="studios.html">Studios</a>
-          <a href="classes.html">Classes</a>
-          <a href="festivals.html">Festivals</a>
-        </nav>
-        <div class="footer-social">
-          <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg>
-            @saborflowdanang
-          </a>
-          <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="footer-social-link">
-            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
-            Da Nang SBK Group
-          </a>
-        </div>
-      </div>
-      <div class="footer-bottom">Made with love for the Da Nang dance community</div>
-    </div>
-  </footer>
-
-  <script src="js/main.js"></script>
-</body>
-</html>
--- a/studios/index.html
+++ b/studios/index.html
@@ -0,0 +1,255 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Dance Studios — Sabor Flow Da Nang</title>
+  <meta name="description"
+    content="Latin dance studios in Da Nang, Vietnam. Find schools teaching Salsa, Bachata, Kizomba, and Zouk.">
+  <link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
+    rel="stylesheet">
+  <link rel="stylesheet" href="../css/style.css?v=0a14c10d">
+  <link rel="stylesheet" href="../css/fireflies.css">
+  <link rel="canonical" href="https://saborflow.ai1.ovh/studios/">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Sabor Flow Da Nang">
+  <meta property="og:title" content="Dance Studios — Sabor Flow Da Nang">
+  <meta property="og:description" content="Latin dance studios in Da Nang, Vietnam. Find schools teaching Salsa, Bachata, Kizomba, and Zouk.">
+  <meta property="og:url" content="https://saborflow.ai1.ovh/studios/">
+  <meta property="og:image" content="https://saborflow.ai1.ovh/assets/logo.jpg">
+  <script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Sabor Flow Da Nang","url":"https://saborflow.ai1.ovh","logo":"https://saborflow.ai1.ovh/assets/logo.jpg","sameAs":["https://www.instagram.com/saborflowdanang/","https://www.facebook.com/groups/sbkdanang"]}</script>
+</head>
+
+<body>
+
+  <div class="sfB-bg" aria-hidden="true">
+    <span></span><span></span><span></span><span></span><span></span>
+    <div class="sfB-palms">
+      <img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:8s;animation-delay:0s">
+      <img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:12deg;animation-duration:9s;animation-delay:-2s">
+      <img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:11deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:9deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
+      <img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt="Decorative palm frond"
+        style="--sway:13deg;animation-duration:9.5s;animation-delay:-3s">
+      <img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt="Decorative palm frond"
+        style="--sway:10deg;animation-duration:11.5s;animation-delay:-1s">
+    </div>
+  </div>
+
+  <nav class="sfB-mobile-nav" id="sfB-mobile-nav">
+    <button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
+    <a href="/">Home</a>
+    <a href="/schedule">Schedule</a>
+    <a href="/connect">Connect</a>
+    <a href="/studios" class="active">Studios</a>
+    <a href="/classes">Classes</a>
+    <a href="/festivals">Festivals</a>
+    <a href="/playlists">Playlists</a>
+  </nav>
+
+  <header class="sfB-topbar">
+    <a href="/" class="logo">
+      <div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
+      <div class="name">Sabor Flow<span class="city">Da Nang</span></div>
+    </a>
+    <nav class="sfB-nav">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios" class="active">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="topbar-right">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+          stroke-linecap="round" stroke-linejoin="round">
+          <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+          <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+          <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+        </svg>
+        @saborflowdanang
+      </a>
+      <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
+        <span></span><span></span><span></span>
+      </button>
+    </div>
+  </header>
+
+  <main class="sfB-page">
+    <div class="sfB-page-head">
+      <h1>Dance <em>Studios</em></h1>
+      <div class="info">
+        Dedicated schools and venues where you can take Latin dance lessons in Da Nang. Filter by style to find your
+        perfect fit.
+      </div>
+    </div>
+
+    <div class="sfB-toolbar">
+      <div class="sfB-pills">
+        <button class="filter-pill active" data-filter="all">All</button>
+        <button class="filter-pill" data-filter="salsa">Salsa</button>
+        <button class="filter-pill" data-filter="bachata">Bachata</button>
+        <button class="filter-pill" data-filter="kizomba">Kizomba</button>
+        <button class="filter-pill" data-filter="zouk">Zouk</button>
+      </div>
+    </div>
+
+    <div class="sfB-cards">
+
+      <!-- Frog Goose Bachata School -->
+      <div class="sfB-card-x filterable-card" data-styles="bachata">
+        <div class="stripe bachata"></div>
+        <h3>Frog Goose Bachata School</h3>
+        <div class="ts">
+          <span class="sfB-chip bachata">Bachata</span>
+        </div>
+        <div class="info">
+          <div class="row">
+            <span class="ic">📍</span>
+            <span><a href="https://maps.app.goo.gl/HsLtwAJboR5cEGoC7" target="_blank" rel="noopener">4 Khuê Mỹ Đông 2,
+                Đà Nẵng</a></span>
+          </div>
+          <div class="row">
+            <span class="ic">👥</span>
+            <span>Luu Nhat Phuong &amp; Shai</span>
+          </div>
+          <div class="row">
+            <span class="ic">📞</span>
+            <span><a href="tel:+84963692112">+84 963 692 112</a></span>
+          </div>
+        </div>
+        <div class="links">
+          <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+            </svg>
+            Facebook
+          </a>
+          <a href="https://wa.me/84963692112" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+            </svg>
+            WhatsApp
+          </a>
+          <a href="https://zalo.me/84963692112" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+            </svg>
+            Zalo
+          </a>
+          <a href="https://www.instagram.com/fgbachata/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            Instagram
+          </a>
+          <a href="https://www.youtube.com/@FrogGoosedance" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path
+                d="M22.54 6.42a2.78 2.78 0 0 0-1.95-1.96C18.88 4 12 4 12 4s-6.88 0-8.59.46A2.78 2.78 0 0 0 1.46 6.42 29 29 0 0 0 1 12a29 29 0 0 0 .46 5.58 2.78 2.78 0 0 0 1.95 1.96C5.12 20 12 20 12 20s6.88 0 8.59-.46a2.78 2.78 0 0 0 1.95-1.96A29 29 0 0 0 23 12a29 29 0 0 0-.46-5.58z" />
+              <polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02" />
+            </svg>
+            YouTube
+          </a>
+        </div>
+      </div>
+
+      <!-- Salsa Da Nang -->
+      <div class="sfB-card-x filterable-card" data-styles="salsa">
+        <div class="stripe salsa"></div>
+        <h3>JK Dance Studio</h3>
+        <div class="ts">
+          <span class="sfB-chip salsa">Salsa On1</span>
+          <span class="sfB-chip salsa">Salsa On2</span>
+        </div>
+        <div class="info">
+          <div class="row">
+            <span class="ic">📍</span>
+            <span><a href="https://maps.app.goo.gl/vtDCvo6mPY1KrYor5" target="_blank" rel="noopener">31 Phạm Cự Lượng,
+                An Hải, Đà Nẵng</a></span>
+          </div>
+          <div class="row">
+            <span class="ic">👤</span>
+            <span>Lucho Giraldes</span>
+          </div>
+          <div class="row">
+            <span class="ic">📞</span>
+            <span><a href="tel:+84328548025">+84 32 854 8025</a></span>
+          </div>
+        </div>
+        <div class="links">
+          <a href="https://salsadanang.com" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <circle cx="12" cy="12" r="10" />
+              <line x1="2" y1="12" x2="22" y2="12" />
+              <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
+            </svg>
+            Website
+          </a>
+          <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
+              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
+            </svg>
+            Instagram
+          </a>
+          <a href="https://wa.me/84328548025" target="_blank" rel="noopener">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+            </svg>
+            WhatsApp
+          </a>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="sfB-suggest">
+      <p>Know a studio we're missing? Let us know.</p>
+      <a href="/connect" class="sfB-btn ghost">Contact Us</a>
+    </div>
+  </main>
+
+  <footer class="sfB-foot">
+    <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
+    </div>
+    <nav class="foot-links">
+      <a href="/">Home</a>
+      <a href="/schedule">Schedule</a>
+      <a href="/connect">Connect</a>
+      <a href="/studios">Studios</a>
+      <a href="/classes">Classes</a>
+      <a href="/festivals">Festivals</a>
+      <a href="/playlists">Playlists</a>
+    </nav>
+    <div class="foot-social">
+      <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
+    </div>
+  </footer>
+
+  <script src="../js/main.js?v=0a14c10d"></script>
+</body>
+
+</html>
Author	SHA1	Message	Date
Javier Blanco	ac9fd4cf42	Fix schedule	2026-05-06 20:49:10 +07:00
Javier Blanco	c76e471161	Fix BOM	2026-05-04 12:10:35 +07:00
Javier Blanco	f3c9f54c37	Disallow Robots	2026-05-04 11:56:52 +07:00
Javier Blanco	94415def5a	SEO	2026-05-04 11:55:20 +07:00
Javier Blanco	b9309b8276	Add fireflies 2	2026-05-04 11:24:25 +07:00
Javier Blanco	b31f5b5cd2	Add fireflies	2026-05-04 11:19:21 +07:00
Javier Blanco	1a0f293305	Add Playlists 2	2026-05-04 11:06:56 +07:00
Javier Blanco	85ee79cf3d	Add Playlists	2026-05-02 21:43:58 +07:00
Javier Blanco	9b13ac93de	Add Playlists page with Spotify and YouTube Music links for BSKZ New page at /playlists listing 40 curated playlists (5 Spotify + 5 YouTube Music per dance style) for Bachata, Salsa, Kizomba and Zouk. Each card shows mood tags and links directly to the playlist or search. Navigation updated across all pages. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-02 15:07:28 +07:00
Javier Blanco	f7e43a57fe	Fix palm trees 6	2026-05-02 14:56:44 +07:00
Javier Blanco	2a297ea3d8	Fix palm trees 5	2026-05-02 14:52:56 +07:00
Javier Blanco	b50ad2eb23	Fix palm trees 4	2026-05-02 14:51:08 +07:00
Javier Blanco	9fc2eb4b89	Fix logo on menu	2026-05-02 13:06:04 +07:00
Javier Blanco	593092215d	Fix style 2	2026-05-02 13:03:48 +07:00
Javier Blanco	2bf1b0f6ef	Fix filter style	2026-05-02 12:58:33 +07:00
Javier Blanco	2d671a8ce2	Fix responsive filters	2026-05-02 12:54:30 +07:00
Javier Blanco	d796a978d8	Fix palm trees 3	2026-05-02 12:51:26 +07:00
Javier Blanco	3c47ffafec	Fix palm trees	2026-05-02 12:43:56 +07:00
Javier Blanco	ca3a5e8926	Fix cache	2026-05-02 12:38:58 +07:00
Javier Blanco	f7d44cb26a	Fix palm trees 3	2026-05-02 12:35:11 +07:00
Javier Blanco	cd241981b4	Fix palm trees 2	2026-05-02 12:33:00 +07:00
Javier Blanco	559a2e9132	Fix palm trees	2026-05-02 12:30:22 +07:00
Javier Blanco	ab99588e14	Improve background	2026-05-02 12:26:14 +07:00
Javier Blanco	acfc16f9fd	Little fixes	2026-05-02 12:17:53 +07:00
Javier Blanco	fafde0a3d2	Fix little bug	2026-05-02 11:36:18 +07:00
Javier Blanco	0e0148d0fd	Palmtrees background	2026-05-02 11:31:21 +07:00
Javier Blanco	4b954eaa7e	Fix animations	2026-05-02 07:23:13 +07:00
Javier Blanco	2cde8401d3	Some improvments	2026-05-01 21:19:07 +07:00
Javier Blanco	02685b8e0b	Add dance photos to hero card stack Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-01 20:43:51 +07:00
Javier Blanco	c96e098f38	Redesign	2026-05-01 10:06:52 +07:00
Javier Blanco	fc3327d1ce	Constrain marquee to 1300px with fade masks on sides Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-01 10:03:37 +07:00
Javier Blanco	5fb9372c89	Fix marquee loop gap on ultra-wide screens 4 repetitions (was 2) + translateX(-25%) so one cycle always shifts exactly one set of items. Covers monitors up to ~4800px without a visible seam. Perceived scroll speed unchanged. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-01 10:01:09 +07:00
Javier Blanco	461bea46cc	Constrain layout for ultra-wide screens Add --sf-max-w (1280px) and --sf-pad (40px) tokens. Full-bleed sections (topbar, footer) use max() padding to keep backgrounds edge-to-edge while centering content. Content sections (hero, pillars, coming, cta, page) use max-width + margin-inline: auto. Mobile/tablet breakpoints unchanged. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-01 09:49:10 +07:00
Javier Blanco	3d353ed00f	Redesign: Tropical Heat (Direction B) visual overhaul Full aesthetic rewrite across all pages — new design system based on the Claude Design handoff (Direction B). New color tokens, Bricolage Grotesque + Caveat Brush typography, blob backgrounds, sticky blur nav, responsive grid layouts, JS-driven schedule renderer, filter pills, marquee, and connect page with ig grid and collab banner. All internal Home links use href=/. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-05-01 09:42:34 +07:00
Javier Blanco	e4f8d9f8f0	Add Google Maps links to schedule venues Each venue in the schedule table is now a link that opens Google Maps. Real place page used where found (Caliz, Webe Coffee); search fallback for the rest. Pin icon appears on hover. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:43:47 +07:00
Javier Blanco	a4a4b44531	Prevent hero title line break on Sabor Flow Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:37:08 +07:00
Javier Blanco	606bd1c3d1	Hero title stacked: Sabor Flow above, Da Nang below Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:34:18 +07:00
Javier Blanco	55ed12cda2	Brand name stacked: SABOR FLOW above, DA NANG below Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:29:49 +07:00
Javier Blanco	05852d6a61	Hero and brand name visual hierarchy - Hero: "Sabor Flow" large + "Da Nang" inline, smaller and muted - Nav/footer brand: "SABOR FLOW" bold + "Da Nang" smaller and muted - No line break between the two parts in either context Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:25:45 +07:00
Javier Blanco	60074f00ce	Rename brand from Saborflow to Sabor Flow Da Nang - Page titles and meta: Sabor Flow Da Nang - Nav/footer brand (uppercase): SABOR FLOW DA NANG - Hero h1 and visible text: Sabor Flow Da Nang - Instagram URLs and @saborflowdanang handle unchanged Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>	2026-04-30 22:20:44 +07:00