/* ============================================================
   主题 L02 · 碧海流光体 (Ocean Luster)
   深蓝底配碧蓝青渐变流光，Bodoni Moda 高对比衬线与水波涟漪，如深海光影
   字体: Bodoni Moda(400;700;900) + Inter(400;600;700)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@400;700;900&family=Inter:wght@400;600;700&display=swap');
:root{
  --c-bg:#050a1a;
  --c-bg-grad:radial-gradient(circle at 18% 16%,rgba(14,165,233,.22),transparent 45%),
              radial-gradient(circle at 82% 22%,rgba(6,182,212,.16),transparent 45%),
              radial-gradient(circle at 50% 95%,rgba(14,165,233,.13),transparent 50%),
              linear-gradient(165deg,#050a1a,#0a1428);
  --c-surface:rgba(12,28,56,.72);
  --c-surface-2:rgba(18,40,72,.60);
  --c-text:#eaf6ff;
  --c-muted:#7a9cc4;
  --c-accent:#0ea5e9;
  --c-accent-2:#06b6d4;
  --c-on-accent:#050a1a;
  --c-border:rgba(14,165,233,.18);
  --font-display:'Bodoni Moda',serif;
  --font-body:'Inter',sans-serif;
  --hero-grad:linear-gradient(115deg,#0ea5e9,#06b6d4 50%,#67e8f9);
  --nav-bg:rgba(5,10,26,.60);
  --nav-blur:blur(18px);
  --shadow:0 22px 55px rgba(6,182,212,.30);
  --radius:18px;
}
/* 水波涟漪层 —— 碧蓝光晕同心扩散，如海面波纹 */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(40% 30% at 20% 18%,rgba(14,165,233,.22),transparent 70%),
    radial-gradient(35% 28% at 55% 12%,rgba(6,182,212,.18),transparent 70%),
    radial-gradient(40% 30% at 80% 24%,rgba(103,232,249,.16),transparent 70%);
  filter:blur(10px);
  animation:oceanRipple 9s cubic-bezier(.45,.05,.55,.95) infinite alternate;
}
@keyframes oceanRipple{
  0%{transform:scale(1) translateY(0);opacity:.5}
  50%{transform:scale(1.08) translateY(-6px);opacity:.75}
  100%{transform:scale(1.12) translateY(-12px);opacity:.6}
}
/* 标题：Bodoni Moda 高对比衬线 + 碧蓝水波流光 */
.hero h1{font-weight:400;letter-spacing:-1px;font-family:var(--font-display)}
.hero h1 .grad{
  background:linear-gradient(115deg,#06b6d4,#0ea5e9 35%,#67e8f9 65%,#06b6d4);
  background-size:240% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  font-weight:900;letter-spacing:-2px;animation:oceanShimmer 6.5s ease-in-out infinite;
}
@keyframes oceanShimmer{
  0%{background-position:0% center}
  50%{background-position:120% center}
  100%{background-position:240% center}
}
/* 玻璃质感卡片 */
.album-card{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(14,165,233,.20)}
.album-card:hover{box-shadow:0 0 0 1px rgba(6,182,212,.45),0 34px 70px rgba(14,165,233,.40);border-color:rgba(103,232,249,.55);transform:translateY(-6px)}
.album-info{background:rgba(10,24,48,.50)}
.album-info h3{font-weight:700;font-family:var(--font-display)}
.album-badge{background:linear-gradient(115deg,#0ea5e9,#06b6d4);color:#050a1a;border:none}
.album-meta{border-top-color:rgba(14,165,233,.14)}
.album-meta .view{color:#67e8f9}
.section-head .kicker{background:linear-gradient(115deg,#0ea5e9,#06b6d4);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:6px;font-family:var(--font-display)}
.about-visual{background:linear-gradient(135deg,#0c4a6e,#0ea5e9 50%,#06b6d4);background-size:200% auto;animation:oceanShimmer 10s ease-in-out infinite;box-shadow:0 0 60px rgba(6,182,212,.40)}
.eyebrow{background:linear-gradient(115deg,#0ea5e9,#06b6d4) !important;color:#050a1a !important;letter-spacing:3px}
.btn.primary{background:linear-gradient(115deg,#0ea5e9,#06b6d4);color:#050a1a;box-shadow:0 12px 30px rgba(14,165,233,.45)}
.btn.ghost{background:rgba(255,255,255,.05);color:#eaf6ff;border-color:rgba(14,165,233,.22)}
.divider{background:linear-gradient(115deg,#0ea5e9,#06b6d4)}
.footer{background:#02060f;border-top:1px solid rgba(14,165,233,.10)}
.logo-mark{box-shadow:0 6px 24px rgba(14,165,233,.55)}
.nav-menu a:hover{color:#67e8f9;background:rgba(14,165,233,.10)}
.ts-swatch.ts-luster-ocean{background:linear-gradient(135deg,#0ea5e9,#06b6d4)}
.shape.s1{background:#0ea5e9 !important;opacity:.22 !important}
.shape.s2{background:#06b6d4 !important;opacity:.20 !important}
