/* ==========================================================================
   MoonSonics Theme — Core Stylesheet
   Visual direction: premium cinematic sound-design storefront, adapted for MoonSonics
   Font loaded via <link> in layout.html for non-blocking render
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Design Tokens (CSS Custom Properties)
   -------------------------------------------------------------------------- */

:root {
  /* Color System — MoonSonics Studio Black palette */
  --ms-bg-primary: #000000;
  --ms-bg-secondary: #0f0f0f;
  --ms-bg-tertiary: #151515;
  --ms-surface: #1a1a1a;
  --ms-surface-elevated: #262626;
  --ms-surface-input: #323232;

  --ms-text-primary: #ffffff;
  --ms-text-body: #b5b5b5;
  --ms-text-muted: #8c8c8c;
  /* #7a7a7a ≈ 4.9:1 on #000，满足 WCAG AA；原 #646464 仅 3.7:1 导致小字看不清 */
  --ms-text-faint: #7a7a7a;

  --ms-accent: #FF5050;
  --ms-accent-hover: #d83a3a;
  --ms-accent-soft: rgba(255, 80, 80, 0.12);
  --ms-cta: #ffcf40;

  --ms-border: #262626;
  --ms-border-light: #333333;

  /* Typography */
  /* 思源黑体 (Source Han Sans) — served as "Noto Sans SC" via Google Fonts; same typeface */
  --ms-font-display: "Roboto Condensed", "Noto Sans SC", "Source Han Sans SC", "PingFang SC", -apple-system, sans-serif;
  --ms-font-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --ms-font-mono: "SF Mono", "JetBrains Mono", "Fira Code", monospace;

  /* Font Sizes — Boom hierarchy scaled for web */
  --ms-fs-h1: 3.5rem;       /* 56px */
  --ms-fs-h2: 2.5rem;       /* 40px */
  --ms-fs-h3: 1.75rem;      /* 28px */
  --ms-fs-h4: 1.25rem;      /* 20px */
  --ms-fs-body: 1rem;       /* 16px */
  --ms-fs-base: 1rem;       /* alias of body size, referenced by product detail styles */
  --ms-fs-small: 0.8125rem; /* 13px */
  --ms-fs-xs: 0.75rem;      /* 12px */

  --ms-lh-tight: 1.1;
  --ms-lh-display: 1.2;
  --ms-lh-body: 1.6;

  /* Spacing — Boom 120px scaled to 80px for web */
  --ms-space-section: 5rem;    /* 80px section padding */
  --ms-space-section-sm: 3rem; /* 48px */
  --ms-space-block: 2rem;      /* 32px */
  --ms-space-element: 1rem;    /* 16px */
  --ms-space-tight: 0.5rem;    /* 8px */

  /* Layout */
  --ms-container-max: 1600px;
  --ms-container-wide: 1920px;
  --ms-container-narrow: 800px;

  /* Borders — Apple flat refinement (2px border, 3px radius) */
  --ms-border-width: 1.5px;
  --ms-border-width-button: 1.5px;
  --ms-radius-xs: 2px;
  --ms-radius-sm: 3px;
  --ms-radius-md: 6px;
  --ms-radius-lg: 8px;

  /* Transitions — slow and restrained */
  --ms-transition: 0.2s ease;
  --ms-transition-slow: 0.4s ease;

  /* Header */
  --ms-header-height: 64px;
  --ms-header-bg: rgba(0, 0, 0, 0.85);
  --ms-header-blur: saturate(180%) blur(20px);
}

/* --------------------------------------------------------------------------
   2. Reset & Base
   -------------------------------------------------------------------------- */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  /* Dark canvas + color-scheme prevent white flash during scroll / overscroll repaint */
  background-color: #000000;
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}

body {
  font-family: var(--ms-font-body);
  font-size: var(--ms-fs-body);
  line-height: var(--ms-lh-body);
  color: var(--ms-text-body);
  background-color: var(--ms-bg-primary);
  min-height: 100vh;
  /* clip (not hidden) avoids creating a scroll container that breaks sticky header and causes scroll flicker */
  overflow-x: hidden;
  overflow-x: clip;
  font-feature-settings: "kern", "liga";
}

a {
  color: var(--ms-accent);
  text-decoration: none;
  transition: color var(--ms-transition);
}

a:hover {
  color: var(--ms-accent-hover);
}

/* 键盘焦点指示器：统一 accent 描边，兼顾可访问性与精致感 */
:focus-visible {
  outline: 2px solid var(--ms-accent);
  outline-offset: 2px;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol {
  list-style: none;
}

input, button, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

/* --------------------------------------------------------------------------
   3. Typography — Boom Library DNA
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ms-font-display);
  color: var(--ms-text-primary);
  line-height: var(--ms-lh-display);
  font-weight: 700;
}

h1 {
  font-size: var(--ms-fs-h1);
  line-height: var(--ms-lh-tight);
}

h2 {
  font-size: var(--ms-fs-h2);
}

h3 {
  font-size: var(--ms-fs-h3);
}

h4 {
  font-size: var(--ms-fs-h4);
}

/* English eyebrow / label — uppercase condensed */
.ms-eyebrow {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-accent);
}

.ms-heading-uppercase {
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

p {
  margin-bottom: var(--ms-space-element);
}

/* --------------------------------------------------------------------------
   4. Layout — Container & Section System
   -------------------------------------------------------------------------- */

.ms-container {
  max-width: var(--ms-container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}

.ms-container--wide {
  max-width: var(--ms-container-wide);
}

.ms-container--narrow {
  max-width: var(--ms-container-narrow);
}

/* 文章页宽屏容器：宽屏居中显示，提升阅读版面 */
.ms-container--article-wide {
  max-width: 1080px;
}

.ms-section {
  padding: var(--ms-space-section) 0;
}

.ms-section--secondary {
  background-color: var(--ms-bg-secondary);
}

.ms-section--tertiary {
  background-color: var(--ms-bg-tertiary);
}

.ms-section--tight {
  padding: var(--ms-space-section-sm) 0;
}

/* Alternating background rhythm — Boom signature */
.ms-section:not(.ms-section--secondary):not(.ms-section--tertiary):nth-of-type(even) {
  background-color: var(--ms-bg-secondary);
}

/* --------------------------------------------------------------------------
   5. Grid System
   -------------------------------------------------------------------------- */

.ms-grid {
  display: grid;
  gap: 1.5rem;
}

.ms-grid--2 { grid-template-columns: repeat(2, 1fr); }
.ms-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ms-grid--4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
  .ms-grid--3, .ms-grid--4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .ms-grid--2, .ms-grid--3, .ms-grid--4 { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   6. Buttons — Boom outline style × Apple flat refinement
   -------------------------------------------------------------------------- */

.ms-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1;
  padding: 0 1.5rem;
  height: 44px;
  border: var(--ms-border-width-button) solid;
  border-radius: var(--ms-radius-sm);
  cursor: pointer;
  transition: all var(--ms-transition);
  white-space: nowrap;
  text-decoration: none;
}

/* Primary — accent fill */
.ms-btn--primary {
  background-color: var(--ms-accent);
  border-color: var(--ms-accent);
  color: #ffffff;
}

.ms-btn--primary:hover {
  background-color: var(--ms-accent-hover);
  border-color: var(--ms-accent-hover);
  color: #ffffff;
}

/* Outline — white border */
.ms-btn--outline {
  background-color: transparent;
  border-color: var(--ms-btn-bg, var(--ms-text-primary));
  color: var(--ms-btn-bg, var(--ms-text-primary));
}

.ms-btn--outline:hover {
  background-color: var(--ms-btn-bg, var(--ms-text-primary));
  color: var(--ms-btn-text, var(--ms-bg-primary));
}

/* Ghost — minimal border */
.ms-btn--ghost {
  background-color: transparent;
  border-color: var(--ms-border-light);
  color: var(--ms-text-body);
}

.ms-btn--ghost:hover {
  border-color: var(--ms-text-body);
  color: var(--ms-text-primary);
}

/* Size variants */
.ms-btn--sm {
  height: 36px;
  padding: 0 1rem;
  font-size: var(--ms-fs-xs);
}

.ms-btn--lg {
  height: 52px;
  padding: 0 2rem;
  font-size: var(--ms-fs-body);
}

.ms-btn--block {
  display: flex;
  width: 100%;
}

/* --------------------------------------------------------------------------
   7. Header / Navigation
   -------------------------------------------------------------------------- */

/* Top bar：高亮渐变 + 左右无缝滚动 */
.ms-top-bar {
  background: linear-gradient(90deg, #ffcf40, #ff5050, #ff8a00, #ffcf40);
  background-size: 300% 100%;
  animation: ms-topbar-glow 8s linear infinite;
  overflow: hidden;
  white-space: nowrap;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.ms-top-bar__viewport {
  overflow: hidden;
}

.ms-top-bar__track {
  display: flex;
  width: max-content;
  animation: ms-topbar-scroll var(--ms-top-bar-speed, 22s) linear infinite;
}

.ms-top-bar__group {
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 0.4rem 0;
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #111111;
}

.ms-top-bar__group a {
  color: inherit;
  text-decoration: none;
}

.ms-top-bar__group a:hover {
  text-decoration: underline;
}

.ms-top-bar__sep {
  opacity: 0.55;
}

@keyframes ms-topbar-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes ms-topbar-glow {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 300% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ms-top-bar__track {
    animation: none;
  }
  .ms-top-bar {
    animation: none;
    background: var(--ms-cta);
  }
  .ms-slogan--marquee .ms-slogan__text {
    animation: none;
    padding-left: 0;
    white-space: normal;
  }
  .ms-hero__slide {
    transition: none;
  }
  .ms-fade-in,
  .ms-hero__heading,
  .ms-hero__desc,
  .ms-hero__eyebrow {
    animation: none !important;
    transition: none !important;
  }
}

.ms-header {
  position: relative;
  z-index: 100;
  background-color: #000000;
  border-bottom: 1px solid var(--ms-border);
  height: var(--ms-header-height);
  display: flex;
  align-items: center;
  /* Promote to its own GPU layer so the sticky header does not repaint/flicker on scroll */
  transform: translateZ(0);
  backface-visibility: hidden;
}
/* 导航栏吸顶（后台「页头设置 → 导航栏吸顶」开关控制） */
.ms-header--sticky {
  position: sticky;
  top: 0;
}

.ms-header__inner {
  /* 3 equal columns keep the nav truly centered on the page, regardless of logo/actions width */
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: 100%;
  max-width: var(--ms-container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
  gap: 2rem;
}

.ms-header__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  justify-self: start;
}

.ms-header__logo img {
  height: var(--ms-logo-height, 32px);
  width: auto;
}

.ms-header__logo-text {
  font-family: var(--ms-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--ms-text-primary);
  letter-spacing: 0.02em;
}

.ms-nav {
  display: flex;
  align-items: center;
  gap: 2rem;
  justify-self: center;
}

.ms-nav__link {
  font-family: var(--ms-font-display);
  font-size: var(--ms-nav-font-size, var(--ms-fs-small));
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-text-body);
  transition: color var(--ms-transition);
}

.ms-nav__link:hover {
  color: var(--ms-text-primary);
}

.ms-nav__link--active {
  color: var(--ms-accent);
}

.ms-header__actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
  justify-self: end;
}

.ms-header__icon-btn {
  background: none;
  border: none;
  color: var(--ms-text-body);
  cursor: pointer;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color var(--ms-transition);
}

.ms-header__icon-btn:hover {
  color: var(--ms-text-primary);
}

/* Search: 放大镜图标，悬停/聚焦时展开输入框 */
.ms-header__search {
  position: relative;
  display: flex;
  align-items: center;
  height: 36px;
  min-width: 36px;
}

.ms-header__search-icon {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ms-text-body);
  cursor: pointer;
  pointer-events: none;
  transition: color var(--ms-transition);
}

.ms-header__search input {
  background: none;
  border: none;
  outline: none;
  color: var(--ms-text-primary);
  width: 0;
  padding: 0;
  opacity: 0;
  font-size: var(--ms-fs-small);
  cursor: pointer;
  transition: width var(--ms-transition-slow), padding var(--ms-transition-slow), opacity var(--ms-transition-slow);
}

.ms-header__search:hover input,
.ms-header__search:focus-within input {
  width: 190px;
  padding: 0.4rem 0.75rem 0.4rem 1.9rem;
  opacity: 1;
  cursor: text;
  border-bottom: 1px solid var(--ms-border-light);
  background: transparent;
}

.ms-header__search:hover .ms-header__search-icon,
.ms-header__search:focus-within .ms-header__search-icon {
  color: var(--ms-cta);
}

.ms-header__search input::placeholder {
  color: var(--ms-text-faint);
}

/* Mobile menu toggle */
.ms-header__menu-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--ms-text-primary);
  cursor: pointer;
  padding: 0.5rem;
}

@media (max-width: 768px) {
  .ms-nav {
    display: none;
  }
  .ms-header__menu-toggle {
    display: flex;
  }
  .ms-header__search:hover input,
  .ms-header__search:focus-within input {
    width: 120px;
  }
}

/* Nav position variants (导航位置 from Theme Settings)
   默认 1fr auto 1fr 让导航绝对居中；左/右变体改为 auto 1fr auto，
   再用 justify-self 把导航贴向 Logo 侧或操作区侧（justify-self 在 auto 中列无效） */
.ms-header--nav-left .ms-header__inner,
.ms-header--nav-right .ms-header__inner {
  grid-template-columns: auto 1fr auto;
}
.ms-header--nav-left .ms-nav {
  justify-self: start;
}
.ms-header--nav-right .ms-nav {
  justify-self: end;
}

/* Back to top button */
.ms-back-to-top {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 95;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--ms-border-light);
  background-color: var(--ms-bg-tertiary);
  color: var(--ms-text-body);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity var(--ms-transition), transform var(--ms-transition), background var(--ms-transition), visibility var(--ms-transition);
}
.ms-back-to-top--visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.ms-back-to-top:hover {
  background-color: var(--ms-accent);
  border-color: var(--ms-accent);
  color: #ffffff;
}

/* Pagination */
.ms-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: var(--ms-space-block);
}
.ms-pagination__info {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
}

/* --------------------------------------------------------------------------
   8. Footer
   -------------------------------------------------------------------------- */

.ms-footer {
  background-color: var(--ms-bg-secondary);
  border-top: 1px solid var(--ms-border);
  padding: var(--ms-space-section) 0 var(--ms-space-block);
}

.ms-footer__inner {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  max-width: var(--ms-container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}

@media (max-width: 768px) {
  .ms-footer__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

.ms-footer__brand {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h4);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--ms-text-primary);
  margin-bottom: var(--ms-space-element);
}

.ms-footer__about {
  color: var(--ms-text-muted);
  font-size: var(--ms-fs-small);
  line-height: var(--ms-lh-body);
}

.ms-footer__col-title {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-text-primary);
  margin-bottom: var(--ms-space-element);
}

.ms-footer__link {
  display: block;
  color: var(--ms-text-muted);
  font-size: var(--ms-fs-small);
  padding: 0.25rem 0;
  transition: color var(--ms-transition);
}

.ms-footer__link:hover {
  color: var(--ms-accent);
}

.ms-footer__social {
  display: flex;
  gap: 1rem;
  margin-top: var(--ms-space-element);
}

.ms-footer__social a {
  color: var(--ms-text-muted);
  transition: color var(--ms-transition);
}

.ms-footer__social a:hover {
  color: var(--ms-accent);
}

.ms-footer__social iconify-icon {
  font-size: 22px;
}

.ms-footer__bottom {
  max-width: var(--ms-container-max);
  margin: var(--ms-space-block) auto 0;
  padding: var(--ms-space-element) 1.5rem 0;
  border-top: 1px solid var(--ms-border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem 2rem;
  flex-wrap: wrap;
  font-size: var(--ms-fs-small);
  color: var(--ms-text-faint);
}
.ms-footer__copyright { min-width: 0; }
.ms-footer__records { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.65rem 1.25rem; margin-left:auto; }
.ms-footer__record { color:var(--ms-text-faint); text-decoration:none; white-space:nowrap; transition:color var(--ms-transition); }
.ms-footer__record:hover { color:var(--ms-text-primary); }

/* --------------------------------------------------------------------------
   9. Product Card
   -------------------------------------------------------------------------- */

.ms-product-card {
  display: block;
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
  overflow: hidden;
  transition: transform var(--ms-transition-slow), background-color var(--ms-transition);
  text-decoration: none;
}

.ms-product-card:hover {
  transform: translateY(-4px);
  background-color: var(--ms-bg-tertiary);
}

.ms-product-card__image {
  aspect-ratio: 1;
  overflow: hidden;
  background-color: var(--ms-bg-tertiary);
}

.ms-product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--ms-transition-slow);
}

.ms-product-card:hover .ms-product-card__image img {
  transform: scale(1.05);
}

.ms-product-card__info {
  padding: 1.25rem;
}

.ms-product-card__name {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h4);
  font-weight: 700;
  color: var(--ms-text-primary);
  margin-bottom: 0.5rem;
  line-height: 1.3;
}

.ms-product-card__desc {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  margin-bottom: var(--ms-space-element);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ms-product-card__price {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.ms-product-card__price-current {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h4);
  font-weight: 700;
  color: var(--ms-accent);
}

.ms-product-card__price-original {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-faint);
  text-decoration: line-through;
}

/* --------------------------------------------------------------------------
   10. Product Detail（Boom 风格：图片适中、文字层次清晰、颜色克制）
   -------------------------------------------------------------------------- */

/* Hero 大图区：背景图 + 商品信息叠加（参考 Boom Library shop-detail-wrapper） */
.ms-product-hero {
  position: relative;
  min-height: 600px;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #0a0a0a;
  overflow: hidden;
}

.ms-product-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0.85) 100%);
  z-index: 1;
}

.ms-product-hero__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 480px) 1fr;
  gap: 3rem;
  align-items: center;
  width: 100%;
  max-width: var(--ms-container-max);
  margin: 0 auto;
  padding: 4rem 2rem;
}

@media (max-width: 768px) {
  .ms-product-hero {
    min-height: auto;
  }
  .ms-product-hero__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2.5rem 1.5rem;
  }
}

.ms-product-hero__gallery {
  background: rgba(0, 0, 0, 0.45);
  border-radius: var(--ms-radius-md);
  padding: 1.25rem;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.ms-product-hero__gallery-main {
  aspect-ratio: 1;
  border-radius: var(--ms-radius-sm);
  overflow: hidden;
}

.ms-product-hero__gallery-main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ms-product-hero__gallery-thumbs {
  display: flex;
  gap: 0.625rem;
  margin-top: 0.625rem;
}

.ms-product-hero__gallery-thumb {
  width: 56px;
  height: 56px;
  border-radius: var(--ms-radius-xs);
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color 0.2s;
}

.ms-product-hero__gallery-thumb:hover {
  border-color: rgba(255, 255, 255, 0.4);
}

.ms-product-hero__gallery-thumb--active {
  border-color: var(--ms-accent);
}

.ms-product-hero__gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ms-product-hero__info {
  background: rgba(0, 0, 0, 0.55);
  border-radius: var(--ms-radius-md);
  padding: 2rem;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.ms-product-hero__title {
  font-family: var(--ms-font-display), sans-serif;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: -0.02em;
  color: #ffffff;
  margin-bottom: 0.5rem;
  line-height: 1.1;
}

.ms-product-hero__note {
  color: rgba(255, 255, 255, 0.65);
  font-size: var(--ms-fs-base);
  margin-bottom: 1rem;
}

.ms-product-hero__specs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
  margin-bottom: 1rem;
}

.ms-product-hero__spec {
  display: inline-flex;
  align-items: baseline;
  gap: 0.375rem;
  font-size: var(--ms-fs-small);
  color: rgba(255, 255, 255, 0.55);
}

.ms-product-hero__spec-name {
  color: rgba(255, 255, 255, 0.35);
}

.ms-product-hero__desc {
  color: rgba(255, 255, 255, 0.7);
  font-size: var(--ms-fs-base);
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.ms-product-hero__price {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.ms-product-hero__price-current {
  font-size: var(--ms-fs-h2);
  font-weight: 700;
  color: #ffffff;
}

.ms-product-hero__price-original {
  font-size: var(--ms-fs-base);
  color: rgba(255, 255, 255, 0.35);
  text-decoration: line-through;
}

.ms-product-hero__cta shop-buy-box {
  display: block;
}

.ms-product-detail {
  display: grid;
  grid-template-columns: minmax(0, 540px) 1fr;
  gap: 4rem;
  align-items: start;
}

@media (max-width: 768px) {
  .ms-product-detail {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .ms-product-detail .ms-product-gallery {
    position: static;
  }
}

.ms-product-gallery {
  max-width: 540px;
}

.ms-product-detail .ms-product-gallery {
  position: sticky;
  top: calc(var(--ms-header-height) + 1rem);
}

.ms-product-gallery__main {
  aspect-ratio: 1;
  border-radius: var(--ms-radius-md);
  overflow: hidden;
  background-color: var(--ms-bg-secondary);
  border: 1px solid var(--ms-border);
  margin-bottom: var(--ms-space-element);
}

.ms-product-gallery__main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ms-product-gallery__thumbs {
  display: flex;
  gap: 0.5rem;
}

.ms-product-gallery__thumb {
  width: 64px;
  height: 64px;
  border-radius: var(--ms-radius-sm);
  overflow: hidden;
  cursor: pointer;
  border: var(--ms-border-width) solid transparent;
  opacity: 0.7;
  transition: border-color var(--ms-transition), opacity var(--ms-transition);
}

.ms-product-gallery__thumb:hover {
  opacity: 1;
}

.ms-product-gallery__thumb--active {
  border-color: var(--ms-accent);
  opacity: 1;
}

.ms-product-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ms-product-info__title {
  font-family: var(--ms-font-display);
  font-size: clamp(1.9rem, 3vw, 2.7rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: #e0e0e0;
  margin-bottom: var(--ms-space-element);
}

.ms-product-info__desc {
  color: var(--ms-text-muted);
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: var(--ms-space-block);
}

.ms-product-info__price {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  padding-top: 1.5rem;
  margin-bottom: var(--ms-space-block);
  border-top: 1px solid var(--ms-border);
}

.ms-product-info__price-current {
  font-family: var(--ms-font-display);
  font-size: 2.6rem;
  font-weight: 700;
  color: var(--ms-cta);
}

.ms-product-info__price-original {
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-faint);
  text-decoration: line-through;
}

.ms-product-info__cta {
  margin-top: 0.5rem;
}

.ms-product-content {
  margin-top: var(--ms-space-section);
  max-width: var(--ms-container-narrow);
}

.ms-product-content__description {
  color: #c9c9c9;
  font-size: 1.05rem;
  line-height: 1.85;
}

/* Boom 风格富文本排版：Roboto Condensed 全大写粗体标题 + 克制字号 */
.ms-product-content__description h2 {
  font-family: var(--ms-font-display);
  font-size: 1.5rem;      /* 24px，对齐 Boom 特性标题 */
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.2;
  color: #ffffff;
  margin-top: 3rem;
  margin-bottom: 0.75rem;
}
.ms-product-content__description h3 {
  font-family: var(--ms-font-display);
  font-size: 1.15rem;     /* 18px，对齐 Boom 副标题 */
  font-weight: 400;
  letter-spacing: 0.02em;
  color: #ffffff;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}
.ms-product-content__description p {
  margin-bottom: var(--ms-space-element);
  max-width: 68ch;
}
/* 用户评价引述（Boom 引述风格） */
.ms-product-content__description blockquote {
  margin: 2rem 0;
  padding: 1rem 0 1rem 1.5rem;
  border-left: 3px solid var(--ms-accent);
  color: #e5e5e5;
  font-size: 1.15rem;
}
.ms-product-content__description blockquote p {
  margin: 0;
}

.ms-spec-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--ms-space-block);
}

.ms-spec-table th,
.ms-spec-table td {
  text-align: left;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--ms-border);
}

.ms-spec-table th {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  text-transform: uppercase;
  color: var(--ms-text-muted);
  width: 200px;
}

.ms-spec-table td {
  color: var(--ms-text-primary);
  font-size: var(--ms-fs-small);
}

/* --------------------------------------------------------------------------
   11. Audio Player (for product detail)
   -------------------------------------------------------------------------- */

.ms-audio-player {
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
  padding: 1.5rem;
  margin: var(--ms-space-block) 0;
}

.ms-audio-player__title {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-text-muted);
  margin-bottom: var(--ms-space-element);
}

.ms-audio-player__controls {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.ms-audio-player__play-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: var(--ms-border-width-button) solid var(--ms-accent);
  background-color: var(--ms-accent-soft);
  color: var(--ms-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--ms-transition);
  flex-shrink: 0;
}

.ms-audio-player__play-btn:hover {
  background-color: var(--ms-accent);
  color: #ffffff;
}

.ms-audio-player__progress {
  flex: 1;
  height: 4px;
  background-color: var(--ms-surface-elevated);
  border-radius: 2px;
  cursor: pointer;
  position: relative;
}

.ms-audio-player__progress-fill {
  height: 100%;
  background-color: var(--ms-accent);
  border-radius: 2px;
  width: 0%;
  transition: width 0.1s linear;
}

.ms-audio-player__time {
  font-family: var(--ms-font-mono);
  font-size: var(--ms-fs-xs);
  color: var(--ms-text-muted);
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   12. Article / Post
   -------------------------------------------------------------------------- */

.ms-article-header {
  margin-bottom: var(--ms-space-block);
}

.ms-article-header__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  margin-bottom: var(--ms-space-element);
}

.ms-article-header__meta a {
  color: var(--ms-text-body);
}

.ms-article-content {
  color: var(--ms-text-body);
  line-height: var(--ms-lh-body);
}

.ms-article-content h2,
.ms-article-content h3,
.ms-article-content h4 {
  margin-top: var(--ms-space-block);
  margin-bottom: var(--ms-space-element);
  color: var(--ms-text-primary);
}

.ms-article-content p {
  margin-bottom: var(--ms-space-element);
}

.ms-article-content img {
  border-radius: var(--ms-radius-md);
  margin: var(--ms-space-element) 0;
}

.ms-article-content pre {
  background-color: #0b0b0b;
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius-md);
  padding: 1.5rem;
  overflow-x: auto;
  font-family: var(--ms-font-mono);
  font-size: var(--ms-fs-small);
  line-height: 1.7;
  margin: var(--ms-space-element) 0;
}

/* Halo PluginShiki 高亮输出适配：覆盖浅色内联背景，保持深色沉浸 */
.ms-article-content pre.shiki {
  background-color: #0b0b0b !important;
  border: 1px solid var(--ms-border);
}

.ms-article-content pre code {
  background: none;
  padding: 0;
  font-size: inherit;
}

/* 行内代码：高亮展示（颜色可在后台「文章页设置」中用色轮选择） */
.ms-article-content :not(pre) > code {
  font-family: var(--ms-font-mono);
  font-size: 0.9em;
  background-color: var(--ms-bg-tertiary);
  border: 1px solid var(--ms-code-color, var(--ms-accent));
  color: var(--ms-code-color, var(--ms-accent));
  padding: 0.15em 0.45em;
  border-radius: 5px;
}

/* 正文排版预设（后台「文章页设置 → 正文排版预设」驱动） */
.ms-article--center  { text-align: center; }
.ms-article--right   { text-align: right; }
.ms-article--justify { text-align: justify; }
.ms-article--indent  p { text-indent: 2em; }
.ms-article--tight   p { margin-bottom: 0.5em; line-height: 1.6; }
.ms-article--relaxed p { margin-bottom: 2em; line-height: 2; font-size: 1.15em; }

/* 文章表格：恢复边框 */
.ms-article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--ms-space-element) 0;
  font-size: 0.95em;
}
.ms-article-content th,
.ms-article-content td {
  border: 1px solid var(--ms-border);
  padding: 0.6rem 1rem;
  text-align: left;
  vertical-align: top;
}
.ms-article-content th {
  background-color: var(--ms-bg-tertiary);
  color: var(--ms-text-primary);
  font-weight: 700;
}
.ms-article-content tr:nth-child(even) td {
  background-color: rgba(255, 255, 255, 0.02);
}

.ms-article-content pre::-webkit-scrollbar {
  height: 8px;
}
.ms-article-content pre::-webkit-scrollbar-thumb {
  background: var(--ms-border-light);
  border-radius: 4px;
}

/* 宽屏文章页：标题更大气、段落更舒展 */
.ms-container--article-wide .ms-article-header h1 {
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  line-height: var(--ms-lh-tight);
}
.ms-container--article-wide .ms-article-content p {
  font-size: 1.0625rem;
}

.ms-article-content blockquote {
  border-left: 3px solid var(--ms-accent);
  padding-left: 1.5rem;
  margin: var(--ms-space-element) 0;
  color: var(--ms-text-muted);
  font-style: italic;
}

/* --------------------------------------------------------------------------
   13. Pagination
   -------------------------------------------------------------------------- */

.ms-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: var(--ms-space-block);
}

.ms-pagination__btn {
  min-width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: var(--ms-border-width) solid var(--ms-border-light);
  border-radius: var(--ms-radius-sm);
  background-color: transparent;
  color: var(--ms-text-body);
  font-size: var(--ms-fs-small);
  cursor: pointer;
  transition: all var(--ms-transition);
  padding: 0 0.75rem;
}

.ms-pagination__btn:hover:not(:disabled) {
  border-color: var(--ms-text-body);
  color: var(--ms-text-primary);
}

.ms-pagination__btn--active {
  border-color: var(--ms-accent);
  color: var(--ms-accent);
}

.ms-pagination__btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.ms-pagination__info {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  padding: 0 1rem;
}

/* --------------------------------------------------------------------------
   14. Filter Bar (product list)
   -------------------------------------------------------------------------- */

.ms-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: var(--ms-space-block);
  flex-wrap: wrap;
}

.ms-filter-bar__left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ms-select {
  background-color: var(--ms-surface-input);
  border: var(--ms-border-width) solid var(--ms-border-light);
  border-radius: var(--ms-radius-sm);
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  color: var(--ms-text-primary);
  font-size: var(--ms-fs-small);
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%238c8c8c' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
}

.ms-input {
  background-color: var(--ms-surface-input);
  border: var(--ms-border-width) solid var(--ms-border-light);
  border-radius: var(--ms-radius-sm);
  padding: 0.5rem 0.75rem;
  color: var(--ms-text-primary);
  font-size: var(--ms-fs-small);
  outline: none;
  transition: border-color var(--ms-transition);
}

.ms-input:focus {
  border-color: var(--ms-accent);
}

.ms-input::placeholder {
  color: var(--ms-text-faint);
}

/* --------------------------------------------------------------------------
   15. Breadcrumb
   -------------------------------------------------------------------------- */

.ms-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  margin-bottom: var(--ms-space-block);
}

.ms-breadcrumb a {
  color: var(--ms-text-muted);
}

.ms-breadcrumb a:hover {
  color: var(--ms-accent);
}

.ms-breadcrumb__separator {
  color: var(--ms-text-faint);
}

/* --------------------------------------------------------------------------
   16. Utility
   -------------------------------------------------------------------------- */

.ms-text-center { text-align: center; }
.ms-text-left { text-align: left; }
.ms-text-right { text-align: right; }

.ms-mt-0 { margin-top: 0; }
.ms-mt-1 { margin-top: var(--ms-space-tight); }
.ms-mt-2 { margin-top: var(--ms-space-element); }
.ms-mt-3 { margin-top: var(--ms-space-block); }
.ms-mt-4 { margin-top: var(--ms-space-section-sm); }

.ms-mb-0 { margin-bottom: 0; }
.ms-mb-1 { margin-bottom: var(--ms-space-tight); }
.ms-mb-2 { margin-bottom: var(--ms-space-element); }
.ms-mb-3 { margin-bottom: var(--ms-space-block); }
.ms-mb-4 { margin-bottom: var(--ms-space-section-sm); }

.ms-hidden { display: none; }
.ms-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Fade-in animation disabled to prevent scroll flicker */
.ms-fade-in {
  opacity: 1;
}

.ms-fade-in.ms-visible {
  opacity: 1;
}

/* --------------------------------------------------------------------------
   17. Shop Module Overrides — integrate shop web components with dark theme
   -------------------------------------------------------------------------- */

/* Ensure shop web components inherit dark theme */
shop-buy-box,
shop-page-cart,
shop-page-checkout,
shop-page-payments {
  display: block;
  color: var(--ms-text-body);
}

/* Shop entry container alignment */
.shop-entry {
  max-width: var(--ms-container-max) !important;
  margin: 0 auto;
  padding: var(--ms-space-section) 1.5rem;
  color: var(--ms-text-body);
}

/* 全宽横幅/面包屑紧贴吸顶导航，消除 shop-entry 顶内边距造成的黑条 */
.shop-entry > .ms-hero--banner:first-child {
  margin-top: calc(-1 * var(--ms-space-section));
}
.shop-entry > .ms-breadcrumb:first-child {
  margin-top: -3.5rem;
}

/* Shop product card dark theme override */
.shop-product-card {
  background-color: var(--ms-bg-secondary) !important;
  border-radius: var(--ms-radius-md) !important;
  overflow: hidden;
  transition: transform var(--ms-transition-slow), background-color var(--ms-transition) !important;
}

.shop-product-card:hover {
  transform: translateY(-4px) !important;
  background-color: var(--ms-bg-tertiary) !important;
}

.shop-product-card__name {
  color: var(--ms-text-primary) !important;
}

.shop-product-card__description {
  color: var(--ms-text-muted) !important;
}

.shop-product-card__price-current {
  color: var(--ms-accent) !important;
  font-family: var(--ms-font-display) !important;
  font-weight: 700 !important;
}

/* Shop buttons dark theme */
.shop-btn {
  border-radius: var(--ms-radius-sm) !important;
  font-family: var(--ms-font-display) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}

/* Shop inputs */
.shop-select,
.shop-input {
  background-color: var(--ms-surface-input) !important;
  border: var(--ms-border-width) solid var(--ms-border-light) !important;
  border-radius: var(--ms-radius-sm) !important;
  color: var(--ms-text-primary) !important;
}

/* Shop pagination */
.shop-pagination__button {
  border-radius: var(--ms-radius-sm) !important;
  font-family: var(--ms-font-display) !important;
  text-transform: uppercase !important;
}

/* Shop product detail */
.shop-product-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
}

@media (max-width: 768px) {
  .shop-product-detail {
    grid-template-columns: 1fr;
  }
}

.shop-product-info__title {
  color: var(--ms-text-primary) !important;
}

.shop-product-content__description {
  color: var(--ms-text-body) !important;
}

.shop-product-content__specs {
  border-collapse: collapse;
  width: 100%;
}

.shop-product-content__specs td {
  border-bottom: 1px solid var(--ms-border);
  padding: 0.75rem 1rem;
  color: var(--ms-text-body);
}

/* Floating CTA bar */
.ms-floating-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000000;
  border-top: 1px solid var(--ms-border);
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  z-index: 90;
  transform: translateY(100%);
  transition: transform var(--ms-transition);
}

.ms-floating-cta--visible {
  transform: translateY(0);
}

.ms-floating-cta__info {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.ms-floating-cta__title {
  font-family: var(--ms-font-display);
  font-weight: 700;
  color: var(--ms-text-primary);
}

.ms-floating-cta__price {
  font-family: var(--ms-font-display);
  font-weight: 700;
  color: var(--ms-accent);
}

@media (max-width: 640px) {
  .ms-floating-cta__info {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }
}

/* --------------------------------------------------------------------------
   18. Homepage Modules
   -------------------------------------------------------------------------- */

/* Hero */
.ms-hero {
  position: relative;
  min-height: var(--ms-hero-height, 70vh);
  display: flex;
  align-items: center;
  overflow: hidden;
}

.ms-hero__slides {
  position: absolute;
  inset: 0;
}

.ms-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ms-hero__slide--active {
  opacity: 1;
  pointer-events: auto;
}

.ms-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
}

.ms-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,calc(var(--ms-hero-overlay, 75%) * 0.5)) 0%, rgba(0,0,0,var(--ms-hero-overlay, 75%)) 100%);
  z-index: 1;
}

.ms-hero__content {
  position: relative;
  z-index: 2;
  max-width: 820px;
  padding: var(--ms-space-section) 1.5rem;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* Carousel arrows */
.ms-hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--ms-border-light);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--ms-text-primary);
  transition: background var(--ms-transition), color var(--ms-transition);
}

.ms-hero__arrow:hover {
  background: var(--ms-accent);
  border-color: var(--ms-accent);
}

.ms-hero__arrow--prev {
  left: 1.5rem;
}

.ms-hero__arrow--next {
  right: 1.5rem;
}

@media (max-width: 768px) {
  .ms-hero__arrow {
    display: none;
  }
}

/* Carousel dots */
.ms-hero__dots {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 0.5rem;
}

.ms-hero__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background var(--ms-transition);
}

.ms-hero__dot--active {
  background: var(--ms-accent);
}

.ms-hero__heading {
  font-size: clamp(2.5rem, 5vw, 4rem);
  line-height: var(--ms-lh-tight);
  margin: var(--ms-space-element) 0;
  color: var(--ms-text-primary);
}

.ms-hero__desc {
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-body);
  margin-bottom: var(--ms-space-block);
  line-height: var(--ms-lh-body);
}

/* Section header */
.ms-section-header {
  margin-bottom: var(--ms-space-block);
}

.ms-section-header h2 {
  margin-bottom: var(--ms-space-tight);
}

.ms-section-header p {
  color: var(--ms-text-muted);
  font-size: var(--ms-fs-h4);
}

/* Category card */
.ms-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ms-space-element);
  padding: var(--ms-space-block) var(--ms-space-element);
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
  text-decoration: none;
  transition: background-color var(--ms-transition), transform var(--ms-transition);
}

.ms-category-card:hover {
  background-color: var(--ms-bg-tertiary);
  transform: translateY(-2px);
}
.ms-home-categories .ms-category-card.ms-category-card--media {
  padding: var(--ms-space-element);
  min-height: 0;
}

.ms-category-card__icon {
  color: var(--ms-icon-color, var(--ms-accent));
}
.ms-category-card__icon iconify-icon {
  width: var(--ms-icon-size, 48px);
  height: var(--ms-icon-size, 48px);
  display: block;
}
.ms-category-card__media {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: var(--ms-radius-md);
  background: var(--ms-bg-tertiary);
}
.ms-category-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ms-category-card__name {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-text-primary);
}

/* Feature block */
.ms-feature-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}

.ms-feature-block--reverse .ms-feature-block__image {
  order: 2;
}

.ms-feature-block__image img {
  border-radius: var(--ms-radius-lg);
  width: 100%;
}

.ms-feature-block__text h2 {
  margin-bottom: var(--ms-space-element);
}

.ms-feature-block__text > div {
  color: var(--ms-text-body);
  line-height: var(--ms-lh-body);
  margin-bottom: var(--ms-space-block);
}

@media (max-width: 768px) {
  .ms-feature-block {
    grid-template-columns: 1fr;
  }
  .ms-feature-block--reverse .ms-feature-block__image {
    order: 0;
  }
}

/* Testimonial card */
.ms-testimonial-card {
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
  padding: var(--ms-space-block);
}

.ms-testimonial-card__quote {
  font-size: var(--ms-fs-h4);
  line-height: var(--ms-lh-body);
  color: var(--ms-text-body);
  margin-bottom: var(--ms-space-element);
  font-style: italic;
}

.ms-testimonial-card__author {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  text-transform: uppercase;
  color: var(--ms-accent);
}

/* Client logos */
.ms-client-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}

.ms-client-logos__item {
  display: flex;
  align-items: center;
  opacity: 0.6;
  transition: opacity var(--ms-transition);
}

.ms-client-logos__item:hover {
  opacity: 1;
}

.ms-client-logos__item img {
  max-height: var(--ms-logo-size, 48px);
  width: auto;
  filter: grayscale(1) brightness(1.2);
}

.ms-client-logos__item span {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-muted);
}

/* Brand story */
.ms-brand-story {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}

.ms-brand-story__image img {
  border-radius: var(--ms-radius-lg);
  width: 100%;
}

.ms-brand-story__text h2 {
  margin: var(--ms-space-element) 0;
}

.ms-brand-story__text > div {
  color: var(--ms-text-body);
  line-height: var(--ms-lh-body);
}

@media (max-width: 768px) {
  .ms-brand-story {
    grid-template-columns: 1fr;
  }
}

/* Post card (latest posts) */
.ms-post-card {
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
  overflow: hidden;
  transition: transform var(--ms-transition-slow), background-color var(--ms-transition);
}

.ms-post-card:hover {
  transform: translateY(-4px);
  background-color: var(--ms-bg-tertiary);
}

.ms-post-card__link {
  display: block;
  text-decoration: none;
}

.ms-post-card__image {
  aspect-ratio: 16/9;
  overflow: hidden;
}

.ms-post-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ms-post-card__info {
  padding: 1.25rem;
}

.ms-post-card__title {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h4);
  font-weight: 700;
  color: var(--ms-text-primary);
  margin-bottom: 0.5rem;
}

.ms-post-card__excerpt {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Promo banner */
.ms-promo-banner {
  position: relative;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ms-promo-banner__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
}

.ms-promo-banner__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}

.ms-promo-banner__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: var(--ms-space-section) 1.5rem;
}

.ms-promo-banner__content h2 {
  font-size: var(--ms-fs-h1);
  margin-bottom: var(--ms-space-block);
  color: var(--ms-text-primary);
}

/* --------------------------------------------------------------------------
   19. Custom Templates — post_product, post_tutorial, page_brand
   -------------------------------------------------------------------------- */

/* Article excerpt (used in custom post templates) */
.ms-article-header__excerpt {
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-muted);
  margin-top: var(--ms-space-element);
  line-height: var(--ms-lh-body);
}

/* Padding top utility */
.ms-pt-3 {
  padding-top: var(--ms-space-block);
}

/* Purchase bar (post_product.html) */
.ms-purchase-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: var(--ms-space-block);
  background-color: var(--ms-surface);
  border: var(--ms-border-width) solid var(--ms-border-light);
  border-radius: var(--ms-radius-md);
}

.ms-purchase-bar__info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.ms-purchase-bar__price {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h3);
  font-weight: 700;
  color: var(--ms-accent);
}

.ms-purchase-bar__label {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

@media (max-width: 640px) {
  .ms-purchase-bar {
    flex-direction: column;
    text-align: center;
  }
}

/* Tutorial layout (post_tutorial.html) */
.ms-tutorial-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 3rem;
  align-items: start;
}

.ms-tutorial-toc {
  position: sticky;
  top: calc(var(--ms-header-height) + 1rem);
  padding: var(--ms-space-block) var(--ms-space-element);
  background-color: var(--ms-bg-secondary);
  border-radius: var(--ms-radius-md);
}

.ms-tutorial-toc__title {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ms-text-muted);
  margin-bottom: var(--ms-space-element);
}

.ms-tutorial-toc__nav {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.ms-tutorial-toc__link {
  display: block;
  font-size: var(--ms-fs-small);
  color: var(--ms-text-body);
  text-decoration: none;
  padding: 0.25rem 0;
  transition: color var(--ms-transition);
}

.ms-tutorial-toc__link:hover {
  color: var(--ms-accent);
}

/* Tutorial content — step markers on h2 */
.ms-tutorial-content h2 {
  position: relative;
  padding-left: 3rem;
  margin-top: 3rem;
}

.ms-tutorial-content h2::before {
  content: counter(tutorial-step);
  counter-increment: tutorial-step;
  position: absolute;
  left: 0;
  top: -0.25rem;
  width: 2rem;
  height: 2rem;
  background-color: var(--ms-accent);
  color: var(--ms-text-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-small);
  font-weight: 700;
}

.ms-tutorial-content {
  counter-reset: tutorial-step;
}

@media (max-width: 1024px) {
  .ms-tutorial-layout {
    grid-template-columns: 1fr;
  }

  .ms-tutorial-toc {
    position: static;
    order: 2;
  }
}

/* Brand story page (page_brand.html) */
.ms-brand-content {
  font-size: var(--ms-fs-h4);
  line-height: 1.8;
  color: var(--ms-text-body);
}

.ms-brand-content h2 {
  font-family: var(--ms-font-display);
  font-size: var(--ms-fs-h2);
  color: var(--ms-text-primary);
  margin-top: 3rem;
  margin-bottom: var(--ms-space-block);
}

.ms-brand-content p {
  margin-bottom: var(--ms-space-block);
}

.ms-brand-content img {
  border-radius: var(--ms-radius-lg);
  margin: var(--ms-space-block) 0;
}

/* ==========================================================================
   19. Boom Library 风格布局（首页重构）
   视觉 DNA：黑色舞台 + 黄色 CTA + Roboto Condensed 巨字 + 大留白
   ========================================================================== */

/* --- 黄色 CTA 按钮（Boom 标志性）--- */
.ms-btn--cta {
  background-color: var(--ms-btn-bg, var(--ms-cta));
  border-color: var(--ms-btn-bg, var(--ms-cta));
  color: var(--ms-btn-text, #111111);
}
.ms-btn--cta:hover {
  background-color: #ffffff;
  border-color: #ffffff;
  color: #111111;
}
.ms-btn--boom {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}

/* --- 区块大标题（display 级）--- */
.ms-heading-boom {
  font-family: var(--ms-font-display);
  font-size: clamp(1.9rem, 4vw, 3.4rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: var(--ms-lh-tight);
  color: var(--ms-text-primary);
}

/* --- 大留白节奏（Boom 120px → 调性更大 160px）--- */
.ms-section--boom {
  padding: 8rem 0;
}
@media (max-width: 768px) {
  .ms-section--boom {
    padding: 4.5rem 0;
  }
}

/* --- Hero 巨字 --- */
.ms-hero__content--boom {
  text-align: center;
  max-width: 1100px;
}
.ms-hero__eyebrow {
  font-size: var(--ms-fs-small);
  letter-spacing: 0.35em;
  margin-bottom: 1.5rem;
}
.ms-hero__heading--boom {
  font-family: var(--ms-font-display);
  font-size: clamp(3rem, 9vw, 8rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 0.95;
  color: var(--ms-text-primary);
  text-shadow: 0 4px 40px rgba(0, 0, 0, 0.6);
}
.ms-hero__desc--boom {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  color: var(--ms-text-body);
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}
.ms-hero__content--boom .ms-btn--boom {
  margin-top: 0.5rem;
}

/* --- 品牌标语条 --- */
.ms-slogan {
  padding: 7rem 0;
  border-bottom: 1px solid var(--ms-border);
  background-image: var(--ms-slogan-bg, none);
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .ms-slogan {
    padding: 4rem 0;
  }
}
.ms-slogan__inner {
  text-align: center;
  max-width: none;
}
.ms-slogan__text {
  font-family: var(--ms-font-display);
  font-size: clamp(1.8rem, 4vw, 3.2rem);
  font-weight: 300;
  line-height: 1.25;
  color: var(--ms-text-primary);
}
.ms-slogan__highlight {
  font-weight: 700;
  color: var(--ms-accent);
}

/* --- 产品分类大卡 --- */
.ms-home-categories .ms-category-card {
  background-color: var(--ms-bg-secondary);
  border: 1px solid var(--ms-border);
  border-radius: 20px;
  padding: 3.5rem 1.5rem;
  min-height: 200px;
  justify-content: center;
  transition: transform var(--ms-transition-slow), border-color var(--ms-transition), background-color var(--ms-transition);
}
.ms-home-categories .ms-category-card:hover {
  transform: translateY(-6px);
  border-color: var(--ms-cta);
  background-color: var(--ms-bg-tertiary);
}
.ms-home-categories .ms-category-card__icon {
  color: var(--ms-icon-color, var(--ms-cta));
  margin-bottom: 1rem;
}
.ms-home-categories .ms-category-card__name {
  font-size: 1.25rem;
  letter-spacing: 0.08em;
}

/* --- 产品卡 hover 提示文字（Boom 标志性交互）--- */
.ms-product-card {
  position: relative;
}
.ms-product-card__image {
  position: relative;
}
.ms-product-card__image::after {
  content: "CLICK FOR MORE DETAILS";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  font-family: var(--ms-font-display);
  font-size: 1.4rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.55);
  opacity: 0;
  transition: opacity var(--ms-transition-slow);
  pointer-events: none;
}
.ms-product-card:hover .ms-product-card__image::after {
  opacity: 1;
}
.ms-product-card:hover .ms-product-card__image img {
  transform: scale(1.03);
}

/* --- 旗舰专区（大图 + 大文字）--- */
.ms-feature-block--boom {
  gap: 5rem;
}
.ms-feature-block--boom .ms-feature-block__image {
  border-radius: var(--ms-radius-lg);
  overflow: hidden;
}
.ms-feature-block--boom .ms-feature-block__image img {
  width: 100%;
  height: auto;
  transition: transform var(--ms-transition-slow);
}
.ms-feature-block--boom .ms-feature-block__image:hover img {
  transform: scale(1.03);
}
.ms-feature-block--boom .ms-feature-block__text h2 {
  font-size: clamp(2rem, 4vw, 3.6rem);
  margin: 1rem 0 1.5rem;
}
.ms-feature-block__desc {
  font-size: var(--ms-fs-h4);
  line-height: 1.8;
  color: var(--ms-text-body);
  margin-bottom: 2rem;
}

/* --- 证言卡（更大引语）--- */
.ms-testimonial-card--boom {
  padding: 2rem 1.5rem;
}
.ms-testimonial-card--boom .ms-testimonial-card__quote {
  font-size: 1.1rem;
  line-height: 1.7;
}

/* --- 品牌故事沉浸区 --- */
.ms-story {
  position: relative;
  min-height: 75vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.ms-story__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
}
.ms-story__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.85) 100%);
  z-index: 1;
}
.ms-story__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 8rem 1.5rem;
}
.ms-story__eyebrow {
  margin-bottom: 1.25rem;
}
.ms-story__title {
  font-family: var(--ms-font-display);
  font-size: clamp(2.2rem, 5vw, 4.5rem);
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.05;
  color: var(--ms-text-primary);
  margin-bottom: 1.5rem;
}
.ms-story__text {
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-body);
  max-width: 760px;
  margin: 0 auto 2.5rem;
  line-height: 1.8;
}

/* --- 邮件订阅区 --- */
.ms-subscribe {
  padding: 7rem 0;
  background-color: var(--ms-bg-tertiary);
  border-top: 1px solid var(--ms-border);
}
@media (max-width: 768px) {
  .ms-subscribe {
    padding: 4rem 0;
  }
}
.ms-subscribe__inner {
  text-align: center;
  max-width: 760px;
}
.ms-subscribe__desc {
  font-size: var(--ms-fs-h4);
  color: var(--ms-text-muted);
  margin: 1rem 0 2.5rem;
}
.ms-subscribe__form {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}
.ms-subscribe__input {
  flex: 1;
  min-width: 280px;
  height: 52px;
  padding: 0 1.25rem;
  background-color: var(--ms-surface-input);
  border: 1px solid var(--ms-border-light);
  border-radius: var(--ms-radius-sm);
  color: var(--ms-text-primary);
  font-size: var(--ms-fs-body);
}
.ms-subscribe__input::placeholder {
  color: var(--ms-text-faint);
}
.ms-subscribe__btn {
  height: 52px;
  padding: 0 2.25rem;
  font-size: var(--ms-fs-small);
}
.ms-subscribe__msg {
  margin-top: 1.25rem;
  color: var(--ms-accent);
}

/* ==========================================================================
   20. 文字/图片大小控制（后台「首页设置/文章设置」驱动）
   用法：在模板元素上 th:classappend 对应的类即可覆盖默认字号/尺寸
   ========================================================================== */
.ms-fs-t-small   { font-size: clamp(1.1rem, 2vw, 1.6rem)  !important; }
.ms-fs-t-medium  { font-size: clamp(1.5rem, 3vw, 2.4rem)  !important; }
.ms-fs-t-large   { font-size: clamp(2.2rem, 4.5vw, 3.6rem) !important; }
.ms-fs-t-xlarge  { font-size: clamp(3rem, 6vw, 5.2rem)     !important; }

.ms-fs-b-small   { font-size: 0.875rem !important; }
.ms-fs-b-medium  { font-size: 1.05rem   !important; }
.ms-fs-b-large   { font-size: 1.25rem   !important; }
.ms-fs-b-xlarge  { font-size: 1.5rem    !important; }

.ms-img-small    { max-width: 55%  !important; }
.ms-img-medium   { max-width: 75%  !important; }
.ms-img-large    { max-width: 95%  !important; }
.ms-img-full     { width: 100%     !important; }

/* 商品/分类卡片列数控制（图片大小设置驱动） */
.ms-grid--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1024px) {
  .ms-grid--5 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .ms-grid--5 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .ms-grid--5 { grid-template-columns: 1fr; }
}

/* Hero 背景图大小控制 */
.ms-hero--img-small .ms-hero__bg  { background-size: 65% auto; background-position: center; }
.ms-hero--img-medium .ms-hero__bg { background-size: 85% auto; background-position: center; }
.ms-hero--img-full .ms-hero__bg   { background-size: cover; }

/* 品牌故事背景图大小控制 */
.ms-story--img-small .ms-story__bg  { background-size: 65% auto; background-position: center; }
.ms-story--img-medium .ms-story__bg { background-size: 85% auto; background-position: center; }
.ms-story--img-full .ms-story__bg   { background-size: cover; }

/* 客户 Logo 大小控制 */
.ms-client-logos--small  { font-size: 0.85rem; }
.ms-client-logos--small img  { max-height: 32px; }
.ms-client-logos--medium { font-size: 1rem; }
.ms-client-logos--medium img { max-height: 44px; }
.ms-client-logos--large  { font-size: 1.2rem; }
.ms-client-logos--large img  { max-height: 56px; }
.ms-client-logos--full   { font-size: 1.4rem; }
.ms-client-logos--full img   { max-height: 72px; }

/* 店铺商品卡片大小（后台「商品列表页设置」驱动） */
.ms-product-card--small .ms-product-card__info { padding: 0.75rem; }
.ms-product-card--small .ms-product-card__name { font-size: 1rem; }
.ms-product-card--small .ms-product-card__desc { font-size: 0.85rem; }
.ms-product-card--small .ms-product-card__price-current { font-size: 1rem; }
.ms-product-card--large .ms-product-card__info { padding: 1.5rem; }
.ms-product-card--large .ms-product-card__name { font-size: 1.5rem; }
.ms-product-card--large .ms-product-card__desc { font-size: 1.05rem; }
.ms-product-card--large .ms-product-card__price-current { font-size: 1.35rem; }

/* 文章列表按分类分组（archives.html，白色渐变分割线） */
.ms-archive-cat__title {
  font-family: var(--ms-font-display);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 1.5rem;
  color: var(--ms-accent);
  margin: 3.5rem 0 0.5rem;
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}
.ms-archive-cat__count {
  font-size: var(--ms-fs-small);
  color: var(--ms-text-faint);
  letter-spacing: 0;
}
.ms-archive-row {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--ms-border);
  transition: padding-left var(--ms-transition);
}
.ms-archive-row:hover {
  padding-left: 0.75rem;
}
.ms-archive-row__date {
  color: var(--ms-text-faint);
  font-size: var(--ms-fs-small);
  min-width: 90px;
  font-variant-numeric: tabular-nums;
}
.ms-archive-row__title {
  color: var(--ms-text-primary);
  font-size: var(--ms-fs-h4);
  text-decoration: none;
  flex: 1;
}
.ms-archive-row__title:hover {
  color: var(--ms-accent);
}
.ms-archive-divider {
  height: 1px;
  margin: 3.5rem 0 0;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.28), transparent);
}

/* ==========================================================================
   21. 文章左侧目录（TOC）
   固定在最左侧，不占文档流，不影响正文居中；大屏显示、小屏隐藏
   ========================================================================== */
.ms-toc {
  position: fixed;
  left: 28px;
  top: 50%;
  transform: translateY(-50%);
  width: 210px;
  max-height: 70vh;
  overflow-y: auto;
  z-index: 50;
  padding: 0.25rem 0 0.25rem 0.75rem;
  border-left: 0;
  font-size: var(--ms-fs-small);
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ms-toc::-webkit-scrollbar { display: none; width: 0; height: 0; }
.ms-toc__title {
  font-family: var(--ms-font-display);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.75rem;
  color: var(--ms-text-faint);
  margin-bottom: 0.75rem;
}
.ms-toc__link {
  display: block;
  padding: 0.3rem 0 0.3rem 0.75rem;
  color: var(--ms-text-muted);
  text-decoration: none;
  border-left: 2px solid transparent;
  margin-left: -0.75rem;
  line-height: 1.45;
  transition: color var(--ms-transition), border-color var(--ms-transition);
}
.ms-toc__link:hover {
  color: var(--ms-text-primary);
}
.ms-toc__link--h3 {
  padding-left: 1.75rem;
}
.ms-toc__link--h4 {
  padding-left: 2.75rem;
}
.ms-toc__link.active {
  color: var(--ms-accent);
  border-left-color: var(--ms-accent);
}
/* 正文标题滚动定位补偿（吸顶导航高度） */
.ms-article-content h2,
.ms-article-content h3,
.ms-article-content h4 {
  scroll-margin-top: 96px;
}

@media (min-width: 1200px) and (max-width: 1599px) {
  .ms-toc {
    left: 16px;
    width: 170px;
    font-size: 0.8rem;
  }
}
@media (max-width: 1199px) {
  .ms-toc {
    display: none;
  }
}

/* ==========================================================================
   22. 评论组件美化（Halo PluginCommentWidget CSS 变量定制）
   ========================================================================== */
:root {
  --halo-cw-primary-1-color: var(--ms-accent);
  --halo-cw-primary-2-color: #b33434;
  --halo-cw-primary-3-color: rgba(255, 80, 80, 0.3);
  --halo-cw-text-1-color: #ffffff;
  --halo-cw-text-2-color: #d6d6d6;
  --halo-cw-text-3-color: #9a9a9a;
  --halo-cw-muted-1-color: #2b2b2b;
  --halo-cw-muted-2-color: #202020;
  --halo-cw-muted-3-color: #151515;
  --halo-cw-base-rounded: 12px;
  --halo-cw-avatar-rounded: 50%;
  --halo-cw-avatar-size: 40px;
  --halo-cw-base-font-size: 0.9375rem;
  --halo-cw-base-font-family: var(--ms-font-body);
}
/* 评论容器排版 */
.ms-comments {
  margin-top: 3rem;
}
/* 评论输入框/按钮微调 */
.ms-comments [data-component="comment-form"] textarea {
  background-color: var(--ms-bg-tertiary) !important;
  color: var(--ms-text-primary) !important;
}

/* ==========================================================================
   23. 商品购买区（shop-buy-box）深色主题覆盖
   商城版默认样式是浅色主题（黑字白底），在深色主题下严重撞色。
   设计：卡片式容器 + 清晰垂直节奏——价格 / 规格 / 操作三组信息
   分层排布，微标题统一大写小字号，去除荧光分割线，消除拥挤感。
   ========================================================================== */

/* 宿主元素：默认透明，融入所在面板（Hero 毛玻璃面板内不再套盒） */
shop-buy-box {
  display: block;
}

/* 裸布局（info 模块，无毛玻璃面板包裹）时才给卡片容器，隔绝页面背景噪声 */
.ms-product-info__cta shop-buy-box {
  background: rgba(10, 10, 10, 0.6);
  border: 1px solid var(--ms-border);
  border-radius: 10px;
  padding: 1.75rem;
}

/* Hero 面板内：购买区与上方描述之间用细发丝线分隔，形成清晰分区 */
.ms-product-hero__cta {
  margin-top: 1.75rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* 内部垂直节奏；清除浅色主题残留的白底与边框 */
.buy-box {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* 价格组：基线对齐，微标签 + 大号价格 */
.buy-box__price {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  border: none !important;
  padding: 0 !important;
}
.buy-box__price-label {
  color: var(--ms-text-faint) !important;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.buy-box__price-value {
  color: #ffffff !important;
  font-weight: 700;
  font-size: 2.4rem !important;
  line-height: 1;
  font-family: var(--ms-font-display);
}

/* 规格组：微标题 + 选项组，层次分明 */
.buy-box__spec {
  display: block;
}
.buy-box__spec-label {
  display: block;
  color: var(--ms-text-faint) !important;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 0.625rem;
}
.buy-box__spec-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* 规格选项（含禁用态 --disable）：深色边框、选中红色高亮 */
.buy-box__spec-option,
.buy-box__spec-option--disabled,
.buy-box__spec-option--disable {
  background-color: var(--ms-bg-tertiary) !important;
  border: 1px solid var(--ms-border) !important;
  color: var(--ms-text-body) !important;
  padding: 0.6rem 1.2rem !important;
  font-size: 0.95rem !important;
  border-radius: 6px !important;
  min-width: 52px;
  transition: border-color var(--ms-transition), color var(--ms-transition), background-color var(--ms-transition);
}
.buy-box__spec-option:hover,
.buy-box__spec-option--disabled:hover,
.buy-box__spec-option--disable:hover {
  border-color: var(--ms-accent) !important;
  color: var(--ms-text-primary) !important;
}
.buy-box__spec-option--selected,
.buy-box__spec-option--active {
  border-color: var(--ms-accent) !important;
  color: var(--ms-accent) !important;
  background-color: var(--ms-accent-soft) !important;
}

/* 数量选择器（含外框容器）：全部深色化，消除白色外边缘 */
.shop-quantity,
.shop-quantity__btn,
.shop-quantity__input {
  background-color: var(--ms-bg-tertiary) !important;
  color: var(--ms-text-primary) !important;
  border-color: var(--ms-border) !important;
}
.shop-quantity {
  border-radius: 6px !important;
  overflow: hidden;
}

/* 操作按钮行：等宽并排，无分割线 */
.buy-box__actions {
  display: flex;
  gap: 0.75rem;
  border: none !important;
  padding: 0 !important;
}
.buy-box__actions .shop-btn-primary,
.buy-box__actions .shop-btn-secondary {
  flex: 1 1 0;
}

/* 加入购物车（Boom 标志性红色大按钮） */
.shop-btn-primary {
  background-color: #ff5050 !important;
  border-color: #ff5050 !important;
  color: #ffffff !important;
  font-size: 1.15rem !important;
  font-weight: 700;
  letter-spacing: 0.04em;
  border-radius: 5px;
  padding: 0.85rem 1.5rem;
}
.shop-btn-primary:hover {
  background-color: #ff6b6b !important;
  border-color: #ff6b6b !important;
  color: #ffffff !important;
}
/* 立即购买（Boom 深灰次按钮） */
.shop-btn-secondary {
  background-color: #2a2a2a !important;
  border-color: #2a2a2a !important;
  color: #ffffff !important;
  font-size: 1.15rem !important;
  font-weight: 600;
  border-radius: 5px;
  padding: 0.85rem 1.5rem;
}
.shop-btn-secondary:hover {
  background-color: #3c3c3c !important;
  border-color: #3c3c3c !important;
  color: #ffffff !important;
}

/* 吸底条按钮：与 Boom 红色购买按钮保持一致 */
.ms-floating-cta .ms-btn--primary {
  background-color: #ff5050 !important;
  border-color: #ff5050 !important;
  color: #ffffff !important;
}
.ms-floating-cta .ms-btn--primary:hover {
  background-color: #ff6b6b !important;
  border-color: #ff6b6b !important;
}

/* ==========================================================================
   24. 商品二级页面（Boom 风格落地页 + 后台商品界面定制）
   ========================================================================== */
.shop-entry {
  --custom-accent: #ff5050;
  /* 商城版组件默认是浅色主题（白卡片/黑字），在深色主题下撞色刺眼；
     这里覆盖商城设计变量为深色主题值，一次性适配购物车/结算/购买框 */
  --shop-color-base-100: #151515;
  --shop-color-base-200: #1a1a1a;
  --shop-color-base-300: #1f1f1f;
  --shop-color-base-content: #e5e5e5;
  --shop-color-primary: #ff5050;
  --shop-color-primary-content: #ffffff;
  --shop-color-secondary: #2a2a2a;
  --shop-color-secondary-content: #e5e5e5;
  --shop-color-accent: #ff5050;
  --shop-color-accent-content: #ffffff;
  --shop-color-neutral: #a3a3a3;
  --shop-color-neutral-content: #171717;
  --shop-color-info: #8a97a6;
  --shop-color-info-content: #171717;
  --shop-color-success: #6a8f74;
  --shop-color-success-content: #171717;
  --shop-color-warning: #b89a5a;
  --shop-color-warning-content: #171717;
  --shop-color-error: #c97878;
  --shop-color-error-content: #171717;
  --shop-gray-50: #1a1a1a;
  --shop-gray-100: #1f1f1f;
  --shop-gray-200: #262626;
  --shop-gray-300: #333333;
  --shop-gray-400: #525252;
  --shop-gray-500: #737373;
  --shop-gray-600: #a3a3a3;
  --shop-gray-700: #d4d4d4;
  --shop-gray-800: #e6e6e6;
  --shop-gray-900: #f5f5f5;
}

/* 横幅图 */
.ms-product-banner {
  border-radius: var(--ms-radius-lg);
  overflow: hidden;
  margin-bottom: var(--ms-space-block);
}
.ms-product-banner img {
  width: 100%;
  height: auto;
  display: block;
}

/* 标题区 */
.ms-product-head {
  margin-bottom: var(--ms-space-block);
}
.ms-product-head__title {
  font-family: var(--ms-font-display);
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: #ffffff;
}
.ms-product-head__note {
  color: var(--ms-text-muted);
  font-size: 1.05rem;
  margin-top: 0.75rem;
  max-width: 60ch;
}
.ms-product-head__specs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}
.ms-product-head__spec {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.9rem;
  background-color: var(--ms-bg-tertiary);
  border: 1px solid var(--ms-border);
  border-radius: 999px;
  font-size: var(--ms-fs-small);
}
.ms-product-head__spec-name {
  color: var(--ms-text-faint);
}
.ms-product-head__spec-vals {
  color: var(--ms-text-primary);
}

/* 布局变体：图片右 / 居中大图 */
.ms-product-detail--reverse {
  direction: rtl;
}
.ms-product-detail--reverse > * {
  direction: ltr;
}
.ms-product-detail--center {
  grid-template-columns: 1fr;
}
.ms-product-detail--center .ms-product-gallery {
  position: static;
  max-width: 100%;
}
.ms-product-detail--center .ms-product-gallery__main {
  aspect-ratio: 16 / 9;
}
.ms-product-detail--center .ms-product-info {
  max-width: 720px;
}

/* 自定义立即购买按钮（强调色驱动，点击进入官方付款） */
.ms-product-buynow {
  margin-top: var(--ms-space-block);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
.ms-product-buynow__btn {
  background-color: var(--custom-accent, #ff5050);
  color: #ffffff;
  border: none;
  font-family: var(--ms-font-display);
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1rem 2.5rem;
  border-radius: 6px;
  cursor: pointer;
  transition: filter var(--ms-transition), transform var(--ms-transition);
}
.ms-product-buynow__btn:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}
.ms-product-buynow__hint {
  color: var(--ms-text-faint);
  font-size: var(--ms-fs-small);
}

/* 强调色应用到官方购买区按钮与选中态 */
.shop-entry .shop-btn-primary {
  background-color: var(--custom-accent, #ff5050) !important;
  border-color: var(--custom-accent, #ff5050) !important;
}
.shop-entry .shop-btn-primary:hover {
  background-color: var(--custom-accent, #ff5050) !important;
  border-color: var(--custom-accent, #ff5050) !important;
  filter: brightness(1.1);
}
.shop-entry .buy-box__spec-option--selected,
.shop-entry .buy-box__spec-option--active {
  border-color: var(--custom-accent, #ff5050) !important;
  color: var(--custom-accent, #ff5050) !important;
}

/* 卖点列表（Features 模块） */
.ms-product-features__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
  margin-top: var(--ms-space-block);
}
.ms-product-features__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background-color: var(--ms-bg-secondary);
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius-md);
  color: var(--ms-text-primary);
  font-size: 1rem;
}
.ms-product-features__mark {
  color: var(--custom-accent, #ff5050);
  font-size: 0.85rem;
}

/* ==========================================================================
   25. 首页区块颜色 / 位置增强（后台色轮 + 布局选项）
   ========================================================================== */

/* Hero 轮播：眉题 / 标题 / 描述 / 按钮颜色 */
.ms-hero .ms-hero__eyebrow {
  color: var(--ms-hero-eyebrow-color, var(--ms-accent));
}
.ms-hero .ms-hero__heading--boom {
  color: var(--ms-hero-heading-color, #ffffff);
}
.ms-hero .ms-hero__desc--boom {
  color: var(--ms-hero-desc-color, #e5e5e5);
}
.ms-hero .ms-btn--cta.ms-btn--boom {
  background-color: var(--ms-hero-cta-bg, var(--ms-cta));
  border-color: var(--ms-hero-cta-bg, var(--ms-cta));
  color: var(--ms-hero-cta-text, #111111);
}
.ms-hero .ms-btn--cta.ms-btn--boom:hover {
  background-color: #ffffff;
  border-color: #ffffff;
  color: #111111;
}

/* Hero 轮播：文字与按钮位置 */
.ms-hero__content--align-center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.ms-hero__content--align-left {
  text-align: left;
  margin-left: 0;
  margin-right: auto;
  padding-left: clamp(1.5rem, 5vw, 7rem);
}
.ms-hero__content--align-left .ms-hero__desc--boom {
  margin-left: 0;
  margin-right: auto;
}
.ms-hero__content--align-left-bias {
  text-align: left;
  margin-left: 15%;
  margin-right: auto;
}
.ms-hero__content--align-left-bias .ms-hero__desc--boom {
  margin-left: 0;
  margin-right: auto;
}
.ms-hero__content--align-right {
  text-align: right;
  margin-left: auto;
  margin-right: 0;
  padding-right: clamp(1.5rem, 5vw, 7rem);
}
.ms-hero__content--align-right .ms-hero__desc--boom {
  margin-left: auto;
  margin-right: 0;
}
.ms-hero__content--align-right-bias {
  text-align: right;
  margin-left: auto;
  margin-right: 15%;
}
.ms-hero__content--align-right-bias .ms-hero__desc--boom {
  margin-left: auto;
  margin-right: 0;
}
.ms-hero__content--align-custom {
  text-align: left;
  margin-left: var(--ms-hero-align-x, 30%);
  margin-right: auto;
}
.ms-hero__content--align-custom .ms-hero__desc--boom {
  margin-left: 0;
  margin-right: auto;
}
/* 文字与按钮对齐方式（独立于位置，覆盖 align 类的 text-align） */
.ms-hero__content--text-left {
  text-align: left;
}
.ms-hero__content--text-left .ms-hero__desc--boom {
  margin-left: 0;
  margin-right: auto;
}
.ms-hero__content--text-center {
  text-align: center;
}
.ms-hero__content--text-center .ms-hero__desc--boom {
  margin-left: auto;
  margin-right: auto;
}
.ms-hero__content--text-right {
  text-align: right;
}
.ms-hero__content--text-right .ms-hero__desc--boom {
  margin-left: auto;
  margin-right: 0;
}
/* 移动端：偏左/偏右/自定义的百分比边距过大，收窄为贴边；
   竖屏下 cover 背景裁剪过大，将超过 70vh 的 hero 高度封顶 */
@media (max-width: 768px) {
  .ms-hero__content--align-left-bias,
  .ms-hero__content--align-right-bias,
  .ms-hero__content--align-custom {
    margin-left: 0;
    margin-right: 0;
  }
  .ms-hero {
    min-height: min(var(--ms-hero-height, 70vh), 70vh);
  }
}

/* 品牌标语：文字颜色 */
.ms-slogan .ms-slogan__text {
  color: var(--ms-slogan-color, var(--ms-text-primary));
}

/* 品牌故事：按钮颜色 + 内容位置 */
.ms-story .ms-story__content .ms-btn--cta {
  background-color: var(--ms-story-cta-bg, var(--ms-cta));
  border-color: var(--ms-story-cta-bg, var(--ms-cta));
}
.ms-story__content--align-left {
  align-items: flex-start;
  text-align: left;
}
.ms-story__content--align-left .ms-story__text {
  margin-left: 0;
}
.ms-story__content--align-right {
  align-items: flex-end;
  text-align: right;
}
.ms-story__content--align-right .ms-story__text {
  margin-right: 0;
}
.ms-story__content--align-center {
  align-items: center;
  text-align: center;
}

/* 页脚自定义链接 + 图标 */
.ms-footer__custom-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  margin-top: 1rem;
}
.ms-footer__link--custom {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}
.ms-footer__link-icon {
  font-size: 1.1em;
  flex: none;
}

/* ==========================================================================
   26. 首页模块布局预设（layout 字段）
   ========================================================================== */

/* 精选产品：横向滚动轮播 */
.ms-home-products--carousel {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 1.25rem;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.75rem;
  -webkit-overflow-scrolling: touch;
}
.ms-home-products--carousel .ms-product-card {
  flex: 0 0 clamp(220px, 26vw, 300px);
  scroll-snap-align: start;
}

/* 精选产品：杂志首图（首个大图 + 其余小图） */
.ms-home-products--featured {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-flow: dense;
}
.ms-home-products--featured .ms-product-card:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
.ms-home-products--featured .ms-product-card:first-child .ms-product-card__image img {
  aspect-ratio: 1 / 1;
}

/* 精选产品：列表式（左图右文） */
.ms-home-products--list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ms-home-products--list .ms-product-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
}
.ms-home-products--list .ms-product-card__image {
  width: 120px;
  flex: none;
}
.ms-home-products--list .ms-product-card__info {
  flex: 1;
}

/* 用户评价：横向滚动轮播 */
.ms-testimonials--carousel {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 1.25rem;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
.ms-testimonials--carousel .ms-testimonial-card {
  flex: 0 0 clamp(260px, 32vw, 380px);
  scroll-snap-align: start;
}

/* 用户评价：单列居中 */
.ms-testimonials--single {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 760px;
  margin: 0 auto;
}

/* 品牌故事：分屏图文（左图右文） */
.ms-story--split {
  display: flex;
  align-items: stretch;
}
.ms-story--split .ms-story__bg {
  position: relative;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50%;
  height: auto;
  flex: none;
}
.ms-story--split .ms-story__overlay {
  display: none;
}
.ms-story--split .ms-story__content {
  position: static;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 50%;
  padding: 4rem 3rem;
  color: var(--ms-text-primary);
  background: var(--ms-bg-primary);
}

/* 品牌标语：左对齐 */
.ms-slogan--left .ms-slogan__text {
  text-align: left;
}
/* 品牌标语：跑马灯滚动 */
.ms-slogan--marquee {
  overflow: hidden;
}
.ms-slogan--marquee .ms-slogan__inner {
  text-align: left !important;
}
.ms-slogan--marquee .ms-slogan__text {
  display: inline-block;
  white-space: nowrap;
  animation: ms-marquee 20s linear infinite;
  padding-left: 100%;
}
@keyframes ms-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* 产品分类：横向滚动 */
.ms-home-categories--carousel {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 1.25rem;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.5rem;
}
.ms-home-categories--carousel > * {
  flex: 0 0 clamp(200px, 24vw, 280px);
  scroll-snap-align: start;
}

/* 客户 Logo：网格排列 */
.ms-client-logos--layout-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 1.5rem;
}

/* 旗舰专区：上下排列（图上文下） */
.ms-feature-block--top {
  flex-direction: column;
}

/* 邮件订阅：左右分栏 */
.ms-subscribe--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: center;
  text-align: left;
}

/* ==========================================================================
   26b. 首页模块布局预设扩充（新增 layout 选项）
   ========================================================================== */

/* Hero：分屏（左文字右图） */
.ms-hero--layout-split .ms-hero__slide {
  justify-content: flex-start;
}
.ms-hero--layout-split .ms-hero__bg {
  left: 50%;
  right: 0;
  width: 50%;
}
.ms-hero--layout-split .ms-hero__overlay {
  background: linear-gradient(to right, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.55) 55%, rgba(0,0,0,0.35) 100%);
}
.ms-hero--layout-split .ms-hero__content {
  margin-left: 0;
  margin-right: auto;
  max-width: 50%;
  text-align: left;
  padding-left: 5%;
}
@media (max-width: 768px) {
  .ms-hero--layout-split .ms-hero__bg { left: 0; width: 100%; }
  .ms-hero--layout-split .ms-hero__content { max-width: 100%; padding-left: 1.5rem; }
}

/* Hero：极简（淡化遮罩、更宽文字） */
.ms-hero--layout-minimal .ms-hero__overlay {
  background: rgba(0,0,0,0.28);
}
.ms-hero--layout-minimal .ms-hero__content {
  max-width: 960px;
}

/* 品牌标语：横幅背景（带大图 + 遮罩） */
.ms-slogan--banner {
  position: relative;
  background-image: var(--ms-slogan-bg, none);
  background-size: cover;
  background-position: center;
  padding: 5.5rem 2rem;
}
.ms-slogan--banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 0;
}
.ms-slogan--banner .ms-slogan__inner {
  position: relative;
  z-index: 1;
}

/* 产品分类：列表式 */
.ms-home-categories--list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.ms-home-categories--list .ms-category-card {
  flex-direction: row;
  justify-content: flex-start;
  gap: 1rem;
  text-align: left;
  padding: 1.25rem 1.5rem;
}

/* 精选产品：瀑布流 */
.ms-home-products--masonry {
  display: block;
  columns: 3;
  column-gap: 1.25rem;
}
.ms-home-products--masonry .ms-product-card {
  break-inside: avoid;
  display: block;
  margin-bottom: 1.25rem;
}
@media (max-width: 768px) {
  .ms-home-products--masonry { columns: 2; }
}
@media (max-width: 480px) {
  .ms-home-products--masonry { columns: 1; }
}

/* 旗舰专区：文字叠加图上 */
.ms-feature-block--overlay {
  position: relative;
  display: block;
  min-height: 440px;
  border-radius: var(--ms-radius-lg);
  overflow: hidden;
}
.ms-feature-block--overlay .ms-feature-block__image {
  position: absolute;
  inset: 0;
  border-radius: 0;
}
.ms-feature-block--overlay .ms-feature-block__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ms-feature-block--overlay .ms-feature-block__text {
  position: relative;
  z-index: 1;
  padding: 3rem;
  background: linear-gradient(to right, rgba(0,0,0,0.9), rgba(0,0,0,0.45));
  border-radius: 0;
  color: #ffffff;
}
.ms-feature-block--overlay .ms-feature-block__text > div,
.ms-feature-block--overlay .ms-feature-block__desc {
  color: rgba(255,255,255,0.82);
}
@media (max-width: 768px) {
  .ms-feature-block--overlay { min-height: auto; }
  .ms-feature-block--overlay .ms-feature-block__text { padding: 2rem 1.5rem; }
}

/* 用户评价：瀑布流 */
.ms-testimonials--masonry {
  display: block;
  columns: 3;
  column-gap: 1.25rem;
}
.ms-testimonials--masonry .ms-testimonial-card {
  break-inside: avoid;
  margin-bottom: 1.25rem;
}
@media (max-width: 768px) {
  .ms-testimonials--masonry { columns: 2; }
}
@media (max-width: 480px) {
  .ms-testimonials--masonry { columns: 1; }
}

/* 客户 Logo：无缝跑马灯 */
.ms-client-logos--layout-marquee {
  overflow: hidden;
  display: flex;
  flex-wrap: nowrap;
  gap: 3rem;
  animation: ms-marquee 25s linear infinite;
}
.ms-client-logos--layout-marquee:hover {
  animation-play-state: paused;
}

/* 品牌故事：文字叠加图上（卡片化） */
.ms-story--overlay .ms-story__content {
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: var(--ms-radius-lg);
  padding: 3rem;
}

/* 邮件订阅：通栏背景 */
.ms-subscribe--fullwidth {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  padding: 4rem 2rem;
  background: var(--ms-bg-secondary);
  border-top: 1px solid var(--ms-border);
  border-bottom: 1px solid var(--ms-border);
}

/* 模块文字对齐方式（text_align：左/中/右） */
.ms-ta-left {
  text-align: left !important;
}
.ms-ta-center {
  text-align: center !important;
}
.ms-ta-right {
  text-align: right !important;
}
/* 子元素直接 text-align 的覆盖（如品牌标语 layout「左对齐」作用于 .ms-slogan__text） */
.ms-ta-left .ms-slogan__text {
  text-align: left !important;
}
.ms-ta-center .ms-slogan__text {
  text-align: center !important;
}
.ms-ta-right .ms-slogan__text {
  text-align: right !important;
}
/* 表单 / 按钮等 flex 容器跟随对齐 */
.ms-ta-left .ms-subscribe__form {
  justify-content: flex-start;
}
.ms-ta-center .ms-subscribe__form {
  justify-content: center;
}
.ms-ta-right .ms-subscribe__form {
  justify-content: flex-end;
}

/* 九宫格抽奖 */
.ms-lottery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  max-width: 480px;
  margin: 0 auto;
}
.ms-lottery__cell {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ms-bg-secondary);
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius-md);
  padding: 0.75rem;
  text-align: center;
  font-size: var(--ms-fs-small);
  color: var(--ms-text-primary);
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
  word-break: break-all;
}
.ms-lottery__cell--active {
  background: var(--ms-accent-soft, rgba(255, 80, 80, 0.15));
  border-color: var(--ms-accent);
  color: var(--ms-accent);
  transform: scale(1.04);
}
.ms-lottery__cell--btn {
  background: transparent;
  border: none;
  padding: 0;
}
.ms-lottery__btn {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: var(--ms-radius-md);
  background: var(--ms-accent);
  color: #ffffff;
  font-weight: 700;
  font-size: var(--ms-fs-base);
  cursor: pointer;
  transition: opacity 0.2s, transform 0.2s;
}
.ms-lottery__btn:hover {
  transform: scale(1.03);
}
.ms-lottery__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* 抽奖中奖弹窗 */
.ms-lottery-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.ms-lottery-modal__mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}
.ms-lottery-modal__dialog {
  position: relative;
  background: var(--ms-bg-elevated, var(--ms-bg-secondary));
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius-lg);
  padding: 2.5rem 2rem 2rem;
  max-width: 420px;
  width: 100%;
  text-align: center;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
  animation: ms-modal-in 0.25s ease;
}
@keyframes ms-modal-in {
  from { opacity: 0; transform: translateY(16px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.ms-lottery-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  color: var(--ms-text-muted);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
}
.ms-lottery-modal__close:hover {
  color: var(--ms-text-primary);
}
.ms-lottery-modal__title {
  margin: 0 0 1rem;
  font-size: 1.5rem;
  color: var(--ms-accent);
  font-weight: 700;
}
.ms-lottery-modal__prize {
  margin: 0 0 0.5rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--ms-text-primary);
}
.ms-lottery-modal__desc {
  margin: 0 0 1.5rem;
  font-size: var(--ms-fs-base);
  color: var(--ms-text-body);
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}
.ms-lottery-modal__btn {
  width: 100%;
}

/* ==========================================================================
   27. 响应式断点补全 + 组件重叠修复
   ========================================================================== */

/* 精选产品杂志首图：移动端降级 */
@media (max-width: 1024px) {
  .ms-home-products--featured { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .ms-home-products--featured { grid-template-columns: 1fr; }
  .ms-home-products--featured .ms-product-card:first-child { grid-column: auto; grid-row: auto; }
}

/* 品牌故事分屏：移动端上下排列 */
@media (max-width: 768px) {
  .ms-story--split { flex-direction: column; }
  .ms-story--split .ms-story__bg { width: 100%; height: 240px; }
  .ms-story--split .ms-story__content { width: 100%; padding: 2rem 1.5rem; }
}

/* 邮件订阅分栏：移动端单列 */
@media (max-width: 768px) {
  .ms-subscribe--split { grid-template-columns: 1fr; }
}

/* 返回顶部按钮与商品详情页吸底购买条重叠：CTA 可见时上移 */
.ms-back-to-top {
  transition: opacity var(--ms-transition), transform var(--ms-transition), background var(--ms-transition), visibility var(--ms-transition), bottom var(--ms-transition);
}
body:has(.ms-floating-cta--visible) .ms-back-to-top {
  bottom: calc(76px + 1.5rem);
}

/* ==========================================================================
   28. Boom 风格商品落地页模块
   （对齐 boomlibrary.com 设计语言：Roboto Condensed 全大写粗体标题、
   克制字号、#000/#141414 交替特性区、浅色 FAQ 区、红色强调线）
   ========================================================================== */

/* 大标语区（Slogan）——商品落地页专用（避免与首页品牌标语 .ms-slogan 类名冲突） */
.ms-product-slogan {
  margin: var(--ms-space-section) 0 var(--ms-space-block);
  max-width: 860px;
}
.ms-product-slogan__title {
  font-family: var(--ms-font-display);
  font-size: clamp(1.9rem, 3.2vw, 2.6rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #ffffff;
  line-height: 1.15;
}
.ms-product-slogan__subtitle {
  font-family: var(--ms-font-display);
  font-size: 1.15rem;
  color: #ffffff;
  margin-top: 0.75rem;
}
.ms-product-slogan__body {
  color: var(--ms-text-body);
  margin-top: 1.25rem;
  line-height: 1.85;
  max-width: 68ch;
}

/* 特性图文分区：#000 / #141414 交替背景，图文左右交替 */
.ms-feature-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
  padding: 3.25rem 2rem;
  margin-top: 0.5rem;
  background-color: #000000;
  border-radius: var(--ms-radius-md);
}
.ms-feature-split--alt {
  background-color: #141414;
}
.ms-feature-split--alt .ms-feature-split__media {
  order: -1;
}
.ms-feature-split__text h2 {
  font-family: var(--ms-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #ffffff;
  line-height: 1.3;
}
.ms-feature-split__text h3 {
  font-family: var(--ms-font-display);
  font-size: 1.15rem;
  font-weight: 400;
  color: #ffffff;
  margin-top: 0.75rem;
}
.ms-feature-split__text p {
  color: var(--ms-text-body);
  margin-top: 1.1rem;
  line-height: 1.85;
}
.ms-feature-split__media img {
  width: 100%;
  display: block;
  border-radius: var(--ms-radius-md);
}
@media (max-width: 768px) {
  .ms-feature-split {
    grid-template-columns: 1fr;
    padding: 2rem 1.25rem;
    gap: 1.5rem;
  }
  .ms-feature-split--alt .ms-feature-split__media {
    order: 0;
  }
}

/* 使用场景卡片（TYPICAL USE CASES） */
.ms-usecases {
  margin-top: var(--ms-space-section);
}
.ms-usecases__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.ms-usecases__item {
  background-color: var(--ms-bg-secondary);
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius-md);
  padding: 1.25rem 1.4rem;
}
.ms-usecases__item h3 {
  font-family: var(--ms-font-display);
  font-size: 1.05rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #ffffff;
}
.ms-usecases__item p {
  color: var(--ms-text-body);
  margin-top: 0.6rem;
  font-size: 0.95rem;
  line-height: 1.7;
}

/* 用户评价（Testimonials） */
.ms-testimonials {
  margin-top: var(--ms-space-section);
}
.ms-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.25rem;
  margin-top: 1.5rem;
}
.ms-testimonials__item {
  margin: 0;
  background-color: var(--ms-bg-secondary);
  border-left: 3px solid var(--custom-accent, var(--ms-accent));
  border-radius: var(--ms-radius-md);
  padding: 1.5rem;
}
.ms-testimonials__item blockquote {
  margin: 0;
  color: #e5e5e5;
  line-height: 1.7;
  font-size: 1rem;
}
.ms-testimonials__item figcaption {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.ms-testimonials__author {
  color: #ffffff;
  font-family: var(--ms-font-display);
  font-weight: 700;
}
.ms-testimonials__credit {
  color: var(--ms-text-muted);
  font-size: 0.85rem;
}

/* FAQ 浅色背景手风琴（Boom 下半页浅色区） */
.ms-faq {
  background-color: #f2f2f2;
  color: #323232;
  border-radius: var(--ms-radius-lg);
  margin-top: var(--ms-space-section);
  padding: 3rem 2.5rem;
}
.ms-faq__title {
  font-family: var(--ms-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #323232;
}
.ms-faq__list {
  margin-top: 1.5rem;
  max-width: 860px;
}
.ms-faq__item {
  border-bottom: 1px solid #d8d8d8;
  padding: 1rem 0;
}
.ms-faq__item summary {
  font-family: var(--ms-font-display);
  font-weight: 700;
  font-size: 1.05rem;
  color: #323232;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.ms-faq__item summary::-webkit-details-marker {
  display: none;
}
.ms-faq__item summary::after {
  content: "+";
  font-size: 1.3rem;
  line-height: 1;
  color: #323232;
  flex-shrink: 0;
}
.ms-faq__item[open] summary::after {
  content: "−";
}
.ms-faq__item p {
  color: #525252;
  margin-top: 0.6rem;
  line-height: 1.7;
  max-width: 78ch;
}
@media (max-width: 640px) {
  .ms-faq {
    padding: 2rem 1.25rem;
  }
}

/* ==========================================================================
   27. 模块化系统增强（页内横幅 / 自定义代码 / 背景变体）
   ========================================================================== */

/* 区块背景：主背景色变体（primary = 显式使用主背景） */
.ms-section--primary {
  background: var(--ms-bg-primary);
}

/* 页内横幅（banner 模块）：比首页 Hero 更紧凑 */
.ms-hero--banner {
  min-height: var(--ms-hero-height, 48vh);
}
.ms-hero--banner .ms-hero__heading--boom {
  font-size: clamp(2rem, 5vw, 3.75rem);
}
.ms-hero--banner .ms-hero__desc--boom {
  font-size: clamp(0.95rem, 1.4vw, 1.15rem);
}
.ms-hero__content--banner {
  padding-top: var(--ms-header-height, 64px);
}

/* 自定义代码模块 */
.ms-custom-html {
  padding: 4rem 0;
  overflow-wrap: break-word;
}
.ms-custom-html img {
  max-width: 100%;
  height: auto;
}


/* Typography preset classes (selected in Halo theme settings) */
html.ms-font--source_han {
  --ms-font-display: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", sans-serif;
  --ms-font-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
}
html.ms-font--inter {
  --ms-font-display: "Inter", "Noto Sans SC", "Source Han Sans SC", sans-serif;
  --ms-font-body: "Inter", "Noto Sans SC", "Source Han Sans SC", sans-serif;
}
html.ms-font--roboto_condensed {
  --ms-font-display: "Roboto Condensed", "Noto Sans SC", "Source Han Sans SC", sans-serif;
  --ms-font-body: "Noto Sans SC", "Source Han Sans SC", sans-serif;
}
html.ms-font--montserrat {
  --ms-font-display: "Montserrat", "Noto Sans SC", "Source Han Sans SC", sans-serif;
  --ms-font-body: "Noto Sans SC", "Source Han Sans SC", sans-serif;
}
html.ms-font--oswald {
  --ms-font-display: "Oswald", "Noto Sans SC", "Source Han Sans SC", sans-serif;
  --ms-font-body: "Noto Sans SC", "Source Han Sans SC", sans-serif;
}
html.ms-font--ibm_plex {
  --ms-font-display: "IBM Plex Sans", "Noto Sans SC", "Source Han Sans SC", sans-serif;
  --ms-font-body: "IBM Plex Sans", "Noto Sans SC", "Source Han Sans SC", sans-serif;
}
html.ms-font--system {
  --ms-font-display: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --ms-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ========================================================================== 
   0.26.0 — Homepage Builder 2.0 / Studio Black design system
   Original MoonSonics implementation inspired by premium sound-design sites.
   ========================================================================== */

:root {
  --ms-surface: #161616;
  --ms-surface-elevated: #1b1b1b;
  --ms-text-primary: #f5f5f5;
  --ms-text-muted: #858585;
  --ms-border: #262626;
  --ms-section-v2: 7rem;
  --ms-module-title-size-default: clamp(2.4rem, 4vw, 4.75rem);
  --ms-module-text-size-default: 1.0625rem;
  --ms-heading-weight: 700;
  --ms-button-radius: 4px;
}

/* ---------- Global premium refinements ---------- */
body {
  letter-spacing: 0.005em;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: var(--ms-heading-weight, 700);
}

.ms-btn {
  border-radius: var(--ms-button-radius, 4px);
  min-height: 46px;
  padding: 0.78rem 1.5rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.ms-btn--lg {
  min-height: 52px;
  padding: 0.92rem 1.8rem;
}

.ms-btn--ghost {
  background: transparent;
  color: var(--ms-text-primary);
  border: 1px solid rgba(255,255,255,.34);
}

.ms-btn--ghost:hover {
  color: var(--ms-text-primary);
  border-color: rgba(255,255,255,.72);
  background: rgba(255,255,255,.06);
}

.ms-module-shell .ms-btn {
  font-size: var(--ms-module-button-text-size, var(--ms-fs-small));
}
.ms-module-shell .ms-btn--sm {
  font-size: var(--ms-module-button-text-size, var(--ms-fs-xs));
}
.ms-module-shell .ms-btn--lg {
  font-size: var(--ms-module-button-text-size, var(--ms-fs-body));
}

.ms-heading-boom,
.ms-module-shell h2 {
  font-size: var(--ms-module-title-size, var(--ms-module-title-size-default));
  line-height: var(--ms-module-title-line-height, 1.02);
  letter-spacing: -0.025em;
  color: var(--ms-module-title-color, var(--ms-text-primary));
  max-width: min(100%, var(--ms-module-title-max-width, 1180px));
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  text-wrap: balance;
}

.ms-module-shell p {
  font-size: var(--ms-module-text-size, var(--ms-module-text-size-default));
  color: var(--ms-module-text-color, var(--ms-text-body));
}

.ms-section-header__desc,
.ms-banner-v2__copy > p,
.ms-feature-v2__copy > p,
.ms-media-showcase-v2__copy > p,
.ms-story-v2__copy > p,
.ms-subscribe-v2__copy > p {
  max-width: min(100%, var(--ms-module-text-max-width, 820px));
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  text-wrap: pretty;
}

.ms-module-shell .ms-eyebrow {
  font-size: var(--ms-module-eyebrow-size, .78rem);
  color: var(--ms-module-eyebrow-color, var(--ms-accent));
  letter-spacing: .22em;
  line-height: 1.4;
}

.ms-module-shell .ms-module-subtitle {
  font-size: var(--ms-module-subtitle-size, var(--ms-module-text-size, var(--ms-module-text-size-default)));
}

.ms-text-highlight {
  color: var(--ms-highlight-color, var(--ms-accent));
  font-weight: inherit;
}

.ms-arrow-link {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--ms-text-primary);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ms-arrow-link:hover { color: var(--ms-accent); }

/* ---------- Module shell: one place controls cross-module behavior ---------- */
.ms-module-shell {
  position: relative;
  isolation: isolate;
}

.ms-module-shell > section,
.ms-module-shell > .ms-spacer-v2 {
  position: relative;
}

.ms-module-shell--dummy { display: none; }

.ms-module-space--none > .ms-section { padding-block: 0 !important; }
.ms-module-space--compact > .ms-section { padding-block: 3.5rem !important; }
.ms-module-space--normal > .ms-section { padding-block: 5.25rem !important; }
.ms-module-space--cinematic > .ms-section { padding-block: 7rem !important; }

.ms-module-width--narrow .ms-container { max-width: 980px; }
.ms-module-width--standard .ms-container { max-width: 1280px; }
.ms-module-width--wide .ms-container { max-width: 1600px; }
.ms-module-width--full .ms-container { max-width: none; padding-inline: 0; }

.ms-module-bg--primary > section { background: var(--ms-bg-primary) !important; }
.ms-module-bg--secondary > section { background: var(--ms-bg-secondary) !important; }
.ms-module-bg--tertiary > section { background: var(--ms-bg-tertiary) !important; }
.ms-module-bg--transparent > section { background: transparent !important; }

.ms-module-divider--top > section { border-top: 1px solid var(--ms-border); }
.ms-module-divider--bottom > section { border-bottom: 1px solid var(--ms-border); }
.ms-module-divider--both > section { border-top: 1px solid var(--ms-border); border-bottom: 1px solid var(--ms-border); }

.ms-module-align--left .ms-section-header { text-align: left; margin-left: 0; margin-right: auto; }
.ms-module-align--center .ms-section-header { text-align: center; margin-left: auto; margin-right: auto; }
.ms-module-align--right .ms-section-header { text-align: right; margin-left: auto; margin-right: 0; }

.ms-home-v2 .ms-section-header {
  max-width: min(100%, var(--ms-module-title-max-width, 1180px));
  margin: 0 0 3.25rem;
}

.ms-home-v2 .ms-section-header .ms-eyebrow {
  display: block;
  margin-bottom: 1.1rem;
}

.ms-home-v2 .ms-section-header__desc {
  max-width: 760px;
  margin: 1.15rem 0 0;
  line-height: 1.75;
}

.ms-module-align--center .ms-section-header__desc { margin-left: auto; margin-right: auto; }
.ms-module-align--right .ms-section-header__desc { margin-left: auto; }
.ms-module-align--center .ms-heading-boom { margin-left: auto; margin-right: auto; }
.ms-module-align--right .ms-heading-boom { margin-left: auto; }

/* Keep the header box itself aligned after .ms-home-v2 .ms-section-header sets its margin. */
.ms-home-v2 .ms-module-align--left .ms-section-header { text-align:left; margin-left:0; margin-right:auto; }
.ms-home-v2 .ms-module-align--center .ms-section-header { text-align:center; margin-left:auto; margin-right:auto; }
.ms-home-v2 .ms-module-align--right .ms-section-header { text-align:right; margin-left:auto; margin-right:0; }

/* Per-element heading alignment. These controls intentionally override module-wide text alignment. */
.ms-module-eyebrow-align--left .ms-eyebrow { display:block; text-align:left; margin-left:0; margin-right:auto; }
.ms-module-eyebrow-align--center .ms-eyebrow { display:block; text-align:center; margin-left:auto; margin-right:auto; }
.ms-module-eyebrow-align--right .ms-eyebrow { display:block; text-align:right; margin-left:auto; margin-right:0; }
.ms-module-title-align--left .ms-heading-boom { text-align:left; margin-left:0; margin-right:auto; }
.ms-module-title-align--center .ms-heading-boom { text-align:center; margin-left:auto; margin-right:auto; }
.ms-module-title-align--right .ms-heading-boom { text-align:right; margin-left:auto; margin-right:0; }
.ms-module-subtitle-align--left .ms-module-subtitle { text-align:left; margin-left:0; margin-right:auto; }
.ms-module-subtitle-align--center .ms-module-subtitle { text-align:center; margin-left:auto; margin-right:auto; }
.ms-module-subtitle-align--right .ms-module-subtitle { text-align:right; margin-left:auto; margin-right:0; }

.ms-home-v2 .ms-section-cta {
  margin-top: 3rem;
}

/* 高级“文字对齐”对内容型模块统一生效；Hero 由独立的内容位置设置控制。 */
.ms-module-align--left :is(.ms-banner-v2__copy,.ms-feature-v2__copy,.ms-media-showcase-v2__copy,.ms-story-v2__copy,.ms-subscribe-v2__copy,.ms-statement-v2__inner) { text-align:left; }
.ms-module-align--center :is(.ms-banner-v2__copy,.ms-feature-v2__copy,.ms-media-showcase-v2__copy,.ms-story-v2__copy,.ms-subscribe-v2__copy,.ms-statement-v2__inner) { text-align:center; margin-inline:auto; }
.ms-module-align--right :is(.ms-banner-v2__copy,.ms-feature-v2__copy,.ms-media-showcase-v2__copy,.ms-story-v2__copy,.ms-subscribe-v2__copy,.ms-statement-v2__inner) { text-align:right; margin-left:auto; }
.ms-module-align--center :is(.ms-banner-v2__copy,.ms-feature-v2__copy,.ms-media-showcase-v2__copy,.ms-story-v2__copy,.ms-subscribe-v2__copy) p { margin-left:auto; margin-right:auto; }
.ms-module-align--right :is(.ms-banner-v2__copy,.ms-feature-v2__copy,.ms-media-showcase-v2__copy,.ms-story-v2__copy,.ms-subscribe-v2__copy) p { margin-left:auto; }
.ms-module-align--center .ms-statement-v2__text { margin-inline:auto; }
.ms-module-align--right .ms-statement-v2__text { margin-left:auto; }

.ms-grid-cols--2,
.ms-grid-cols--3,
.ms-grid-cols--4,
.ms-grid-cols--5 {
  display: grid;
  gap: 1.5rem;
}
.ms-grid-cols--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ms-grid-cols--3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ms-grid-cols--4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
.ms-grid-cols--5 { grid-template-columns: repeat(5,minmax(0,1fr)); }

/* ---------- Media focal point (per-module advanced setting) ---------- */
.ms-module-image-pos--center :is(.ms-hero__bg,.ms-banner-v2,.ms-story-v2) { background-position: center center; }
.ms-module-image-pos--left :is(.ms-hero__bg,.ms-banner-v2,.ms-story-v2) { background-position: left center; }
.ms-module-image-pos--right :is(.ms-hero__bg,.ms-banner-v2,.ms-story-v2) { background-position: right center; }
.ms-module-image-pos--top :is(.ms-hero__bg,.ms-banner-v2,.ms-story-v2) { background-position: center top; }
.ms-module-image-pos--bottom :is(.ms-hero__bg,.ms-banner-v2,.ms-story-v2) { background-position: center bottom; }

.ms-module-image-pos--center :is(.ms-banner-v2__media img,.ms-feature-v2__media img,.ms-media-showcase-v2__media img,.ms-media-showcase-v2__media video,.ms-story-v2__media img) { object-position: center center; }
.ms-module-image-pos--left :is(.ms-banner-v2__media img,.ms-feature-v2__media img,.ms-media-showcase-v2__media img,.ms-media-showcase-v2__media video,.ms-story-v2__media img) { object-position: left center; }
.ms-module-image-pos--right :is(.ms-banner-v2__media img,.ms-feature-v2__media img,.ms-media-showcase-v2__media img,.ms-media-showcase-v2__media video,.ms-story-v2__media img) { object-position: right center; }
.ms-module-image-pos--top :is(.ms-banner-v2__media img,.ms-feature-v2__media img,.ms-media-showcase-v2__media img,.ms-media-showcase-v2__media video,.ms-story-v2__media img) { object-position: center top; }
.ms-module-image-pos--bottom :is(.ms-banner-v2__media img,.ms-feature-v2__media img,.ms-media-showcase-v2__media img,.ms-media-showcase-v2__media video,.ms-story-v2__media img) { object-position: center bottom; }

/* ---------- Hero v2 ---------- */
.ms-hero--v-cinematic,
.ms-hero--v-editorial,
.ms-hero--v-edge {
  min-height: var(--ms-hero-height, 90vh);
  border-bottom: 1px solid var(--ms-border);
  background: #030303;
}

.ms-hero--v-cinematic .ms-hero__overlay {
  background:
    linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.74) 33%, rgba(0,0,0,.22) 67%, rgba(0,0,0,.34) 100%),
    linear-gradient(0deg, rgba(0,0,0,.58), transparent 48%);
  opacity: var(--ms-hero-overlay, 72%);
}

.ms-hero--v-editorial .ms-hero__overlay {
  background: linear-gradient(90deg, rgba(0,0,0,.92), rgba(0,0,0,.62) 45%, rgba(0,0,0,.34));
  opacity: var(--ms-hero-overlay, 72%);
}

.ms-hero--v-edge .ms-hero__overlay {
  background: linear-gradient(0deg, rgba(0,0,0,.82), rgba(0,0,0,.18) 72%);
  opacity: var(--ms-hero-overlay, 72%);
}

.ms-hero--v-editorial .ms-hero__bg { transform: scale(1.015); filter: saturate(.86) contrast(1.04); }
.ms-hero--v-edge .ms-hero__bg { filter: saturate(.82) contrast(1.06); }

.ms-hero__content--boom {
  width: 100%;
  padding-top: clamp(7rem, 14vh, 11rem);
  padding-bottom: clamp(5rem, 10vh, 8rem);
}

.ms-hero__content--boom > * { max-width: 980px; }
.ms-hero--v-editorial .ms-hero__content--boom > * { max-width: 1180px; }
.ms-hero--v-edge .ms-hero__content--boom > * { max-width: 1380px; }

.ms-hero .ms-hero__eyebrow {
  font-size: var(--ms-hero-slide-eyebrow-size, var(--ms-module-eyebrow-size, .78rem));
}

.ms-hero__heading--boom {
  font-size: var(--ms-hero-slide-title-size, var(--ms-module-title-size, clamp(3.5rem, 6vw, 7rem)));
  line-height: var(--ms-module-title-line-height, .96);
  letter-spacing: -.045em;
  text-wrap: balance;
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  max-width: min(100%, var(--ms-hero-slide-title-max-width, var(--ms-module-title-max-width, 1100px)));
  margin: 1.15rem 0 1.35rem;
}

.ms-hero--v-editorial .ms-hero__heading--boom { font-size: var(--ms-hero-slide-title-size, var(--ms-module-title-size, clamp(3.2rem, 5vw, 6.25rem))); }
.ms-hero--v-edge .ms-hero__heading--boom { font-size: var(--ms-hero-slide-title-size, var(--ms-module-title-size, clamp(4.5rem, 7vw, 8.5rem))); }

.ms-hero__desc--boom {
  max-width: min(100%, var(--ms-hero-slide-description-max-width, var(--ms-module-text-max-width, 680px)));
  font-size: var(--ms-hero-slide-description-size, var(--ms-module-text-size, clamp(1.05rem, 1.45vw, 1.35rem)));
  line-height: 1.65;
  color: var(--ms-module-text-color, rgba(255,255,255,.74));
  margin-bottom: 0;
}

.ms-hero__slide .ms-btn {
  font-size: var(--ms-hero-slide-button-text-size, var(--ms-module-button-text-size, var(--ms-fs-small)));
}
.ms-hero__slide .ms-btn--sm { font-size: var(--ms-hero-slide-button-text-size, var(--ms-module-button-text-size, var(--ms-fs-xs))); }
.ms-hero__slide .ms-btn--lg { font-size: var(--ms-hero-slide-button-text-size, var(--ms-module-button-text-size, var(--ms-fs-body))); }

.ms-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 2rem;
}

.ms-home-v2 .ms-hero__arrow {
  width: 50px;
  height: 50px;
  border-color: rgba(255,255,255,.28);
  background: rgba(0,0,0,.28);
  backdrop-filter: blur(8px);
}

.ms-home-v2 .ms-hero__dots { bottom: 2.2rem; }
.ms-home-v2 .ms-hero__dot { width: 26px; height: 2px; border-radius: 0; background: rgba(255,255,255,.38); }
.ms-home-v2 .ms-hero__dot--active { width: 54px; background: var(--ms-accent); }

/* ---------- Banner ---------- */
.ms-banner-v2 {
  min-height: var(--ms-banner-height, 480px);
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--ms-bg-secondary);
  border-block: 1px solid var(--ms-border);
}

.ms-banner-v2__inner {
  width: 100%;
  display: grid;
  align-items: center;
  min-height: inherit;
}

.ms-banner-v2__copy {
  position: relative;
  z-index: 2;
  max-width: min(100%, var(--ms-module-title-max-width, 1180px));
  padding-block: 5rem;
}
.ms-banner-v2__copy .ms-heading-boom { margin: .9rem 0 1.25rem; }
.ms-banner-v2__copy p { max-width: min(100%, var(--ms-module-text-max-width, 820px)); line-height: 1.7; margin-bottom: 1.7rem; }

.ms-banner-v2--immersive,
.ms-banner-v2--minimal { background-image: var(--ms-banner-image, none); background-size: cover; background-position: center; }
.ms-banner-v2--immersive::before,
.ms-banner-v2--minimal::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.58) 48%,rgba(0,0,0,.3));
  opacity: var(--ms-banner-overlay, 62%);
  z-index: 0;
}
.ms-banner-v2--minimal .ms-banner-v2__copy { margin-inline: auto; text-align: center; }
.ms-banner-v2--minimal .ms-banner-v2__copy p { margin-inline: auto; }

.ms-banner-v2--split .ms-banner-v2__inner { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 5rem; }
.ms-banner-v2__media { height: min(520px,calc(var(--ms-banner-height) - 3rem)); overflow: hidden; }
.ms-banner-v2__media img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Statement ---------- */
.ms-statement-v2 {
  overflow: hidden;
  background: var(--ms-bg-primary);
  border-bottom: 1px solid var(--ms-border);
  background-image: linear-gradient(rgba(0,0,0,.82),rgba(0,0,0,.82)), var(--ms-statement-image, none);
  background-size: cover;
  background-position: center;
}
.ms-statement-v2__inner { padding-block: clamp(5rem,9vw,9rem); }
.ms-statement-v2__text {
  margin: 0;
  max-width: min(100%, var(--ms-module-title-max-width, 1600px));
  font-family: var(--ms-font-display);
  font-size: var(--ms-slogan-size, var(--ms-module-text-size, clamp(2.8rem,5vw,6.5rem)));
  font-weight: var(--ms-heading-weight,700);
  line-height: var(--ms-module-title-line-height, 1.02);
  letter-spacing: -.045em;
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  text-wrap: balance;
  color: var(--ms-module-text-color,var(--ms-text-primary));
}
.ms-statement-v2__text strong { color: var(--ms-highlight-color, var(--ms-accent)); font-weight: inherit; }
.ms-statement-v2--framed .ms-statement-v2__inner { border-inline: 1px solid var(--ms-border); padding-inline: clamp(2rem,5vw,6rem); }
.ms-statement-v2--ticker { padding-block: 2.2rem; border-block: 1px solid var(--ms-border); }
.ms-statement-v2__ticker { overflow: hidden; }
.ms-statement-v2__ticker-track { width: max-content; display: flex; gap: 4rem; animation: msTicker 32s linear infinite; }
.ms-statement-v2__ticker-track span { font-family: var(--ms-font-display); font-size: clamp(2rem,3.5vw,4.5rem); font-weight: 700; color: var(--ms-text-primary); white-space: nowrap; }
.ms-statement-v2__ticker-track span::after { content:" / "; color: var(--ms-accent); margin-left:4rem; }
@keyframes msTicker { to { transform: translateX(-50%); } }

/* ---------- Collections ---------- */
.ms-home-categories-section { background: var(--ms-bg-primary); }
.ms-categories-v2 { gap: 1.25rem; }
.ms-collection-card {
  position: relative;
  min-height: 380px;
  overflow: hidden;
  background: var(--ms-bg-tertiary);
  border: 1px solid var(--ms-border);
  color: var(--ms-text-primary);
  isolation: isolate;
}
.ms-collection-card__media { position:absolute; inset:0; z-index:-2; }
.ms-collection-card__media img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.65,.2,1), filter .45s ease; filter:saturate(.82) brightness(.73); }
.ms-collection-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,.08) 68%); }
.ms-collection-card__body { min-height:inherit; display:flex; flex-direction:column; justify-content:flex-end; padding:1.5rem; }
.ms-collection-card__body h3 { font-size:var(--ms-module-item-title-size, clamp(1.4rem,2vw,2.15rem)); letter-spacing:-.02em; margin:.5rem 0 .4rem; }
.ms-collection-card__body p { font-size:var(--ms-module-item-text-size, .92rem); color:rgba(255,255,255,.68); max-width:32ch; margin:0 0 1rem; }
.ms-collection-card__icon { font-size:var(--ms-icon-size,48px); color:var(--ms-icon-color,var(--ms-accent)); margin-bottom:1.4rem; }
.ms-collection-card .ms-arrow-link { margin-top:.8rem; opacity:.76; }
.ms-collection-card:hover { color:var(--ms-text-primary); border-color:#3b3b3b; }
.ms-collection-card:hover img { transform:scale(1.035); filter:saturate(.95) brightness(.82); }

.ms-categories-v2--editorial .ms-collection-card { min-height: 500px; }
.ms-categories-v2--editorial .ms-collection-card:nth-child(3n+1) { grid-column: span 2; }
.ms-categories-v2--minimal .ms-categories-v2 { gap:0; border-top:1px solid var(--ms-border); }
.ms-categories-v2--minimal .ms-collection-card { min-height:110px; border-width:0 0 1px; background:transparent; }
.ms-categories-v2--minimal .ms-collection-card__media { display:none; }
.ms-categories-v2--minimal .ms-collection-card::after { display:none; }
.ms-categories-v2--minimal .ms-collection-card__body { display:grid; grid-template-columns:1fr auto; align-items:center; padding:1.5rem 0; }
.ms-categories-v2--minimal .ms-collection-card__body h3 { font-size:var(--ms-module-item-title-size, 2rem); }
.ms-categories-v2--minimal .ms-collection-card__body p { grid-column:1; }
.ms-categories-v2--minimal .ms-arrow-link { grid-column:2; grid-row:1 / span 2; font-size:1.25rem; }

/* ---------- Products ---------- */
.ms-products-v2-section { background: var(--ms-bg-secondary); }
.ms-products-v2 { gap: 1.3rem; }
.ms-product-card--v2 {
  display:block;
  background:transparent;
  border:0;
  color:var(--ms-text-primary);
  overflow:hidden;
}
.ms-product-card--v2 .ms-product-card__image { aspect-ratio: 1 / 1; overflow:hidden; background:#111; border:1px solid var(--ms-border); }
.ms-product-card--v2 .ms-product-card__image img { width:100%; height:100%; object-fit:cover; transition:transform .55s cubic-bezier(.2,.65,.2,1),filter .35s ease; filter:saturate(.9); }
.ms-product-card--v2 .ms-product-card__info { padding:1.15rem .1rem 0; }
.ms-product-card--v2 .ms-product-card__kicker { display:block; color:var(--ms-accent); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; margin-bottom:.5rem; }
.ms-product-card--v2 .ms-product-card__name { font-size:var(--ms-module-item-title-size, 1.22rem); line-height:1.22; letter-spacing:-.015em; margin:0 0 .45rem; }
.ms-product-card--v2 .ms-product-card__desc { font-size:var(--ms-module-item-text-size, .86rem); line-height:1.55; color:var(--ms-text-muted); margin:.4rem 0 .75rem; }
.ms-product-card--v2 .ms-product-card__price { margin-top:.45rem; }
.ms-product-card--v2 .ms-product-card__price-current { color:var(--ms-text-primary); font-weight:700; }
.ms-product-card--v2:hover { color:var(--ms-text-primary); }
.ms-product-card--v2:hover .ms-product-card__image img { transform:scale(1.025); filter:saturate(1); }

.ms-products-v2--poster .ms-product-card--v2 { position:relative; min-height:460px; border:1px solid var(--ms-border); }
.ms-products-v2--poster .ms-product-card--v2 .ms-product-card__image { position:absolute; inset:0; aspect-ratio:auto; border:0; z-index:0; }
.ms-products-v2--poster .ms-product-card--v2 .ms-product-card__image::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.94),rgba(0,0,0,.04) 68%); }
.ms-products-v2--poster .ms-product-card--v2 .ms-product-card__info { position:absolute; inset:auto 0 0; z-index:1; padding:1.5rem; }
.ms-products-v2--poster .ms-product-card__name { font-size:var(--ms-module-item-title-size, 1.65rem); }
.ms-products-v2--compact .ms-products-v2 { gap:.75rem; }
.ms-products-v2--compact .ms-product-card__info { padding-top:.75rem; }
.ms-products-v2--compact .ms-product-card__name { font-size:var(--ms-module-item-title-size, 1rem); }
.ms-home-products-hint { color:var(--ms-text-muted); margin-top:1rem; font-size:.84rem; }
.ms-home-products-hint.is-empty {
  display: block;
  margin: 0;
  padding: 2.4rem 0;
  border-top: 1px solid var(--ms-border);
  border-bottom: 1px solid var(--ms-border);
  font-size: 1rem;
  letter-spacing: .03em;
}

/* ---------- Feature / Media split ---------- */
.ms-feature-v2 { background:var(--ms-bg-primary); overflow:hidden; }
.ms-feature-v2__inner { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:center; gap:clamp(3rem,6vw,8rem); }
.ms-feature-v2--reverse .ms-feature-v2__media { order:2; }
.ms-feature-v2--reverse .ms-feature-v2__copy { order:1; }
.ms-feature-v2--top .ms-feature-v2__inner { grid-template-columns:1fr; gap:2.5rem; }
.ms-feature-v2--top .ms-feature-v2__media { width:100%; }
.ms-feature-v2--top .ms-feature-v2__media img { aspect-ratio:16/7; }
.ms-feature-v2--top .ms-feature-v2__copy { max-width:980px; }
.ms-feature-v2__media { overflow:hidden; background:#101010; border:1px solid var(--ms-border); }
.ms-feature-v2__media img { width:100%; aspect-ratio:1.25/1; object-fit:cover; }
.ms-feature-v2__copy { max-width:720px; }
.ms-feature-v2__copy .ms-heading-boom { margin:.9rem 0 1.25rem; }
.ms-feature-v2__copy p { line-height:1.78; margin-bottom:1.8rem; }
.ms-feature-v2--framed .ms-feature-v2__inner { background:var(--ms-bg-tertiary); border:1px solid var(--ms-border); padding:clamp(1rem,2.5vw,2.5rem); }
.ms-feature-v2--full_bleed { padding-block:0 !important; min-height:680px; }
.ms-feature-v2--full_bleed .ms-container { max-width:none; padding:0; }
.ms-feature-v2--full_bleed .ms-feature-v2__inner { min-height:680px; gap:0; }
.ms-feature-v2--full_bleed .ms-feature-v2__media { height:100%; min-height:680px; border:0; }
.ms-feature-v2--full_bleed .ms-feature-v2__media img { height:100%; min-height:680px; aspect-ratio:auto; }
.ms-feature-v2--full_bleed .ms-feature-v2__copy { padding:clamp(3rem,7vw,8rem); }

/* ---------- Feature grid ---------- */
.ms-feature-grid-v2 { background:var(--ms-bg-secondary); }
.ms-feature-grid-v2__grid { display:grid; gap:1px; background:var(--ms-border); border:1px solid var(--ms-border); }
.ms-feature-item-v2 { position:relative; background:var(--ms-bg-secondary); padding:2rem; min-height:300px; overflow:hidden; }
.ms-feature-item-v2__media { margin:-2rem -2rem 1.8rem; height:210px; overflow:hidden; }
.ms-feature-item-v2__media img { width:100%; height:100%; object-fit:cover; }
.ms-feature-item-v2__icon { display:block; font-size:2.25rem; color:var(--ms-accent); margin-bottom:3.5rem; }
.ms-feature-item-v2__number { display:block; font-family:var(--ms-font-display); font-size:4rem; line-height:1; color:#2d2d2d; margin-bottom:3.5rem; }
.ms-feature-item-v2 h3 { font-size:var(--ms-module-item-title-size, 1.55rem); margin:.6rem 0 .85rem; }
.ms-feature-item-v2 p { font-size:var(--ms-module-item-text-size, .95rem); line-height:1.65; color:var(--ms-text-muted); }
.ms-feature-grid-v2--lines .ms-feature-grid-v2__grid { background:transparent; border:0; gap:0 3rem; }
.ms-feature-grid-v2--lines .ms-feature-item-v2 { background:transparent; border-top:1px solid var(--ms-border); padding:2rem 0 3rem; min-height:0; }
.ms-feature-grid-v2--lines .ms-feature-item-v2__icon { margin-bottom:2rem; }

/* ---------- Feature tabs ---------- */
.ms-feature-tabs-v2 { background:var(--ms-bg-primary); }
.ms-feature-tabs-v2__nav { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.ms-feature-tabs-v2__tab { appearance:none; border:1px solid var(--ms-border); background:#0d0d0d; color:var(--ms-text-muted); padding:.9rem 1.25rem; cursor:pointer; font:inherit; font-weight:700; border-radius:var(--ms-button-radius); transition:.2s ease; }
.ms-feature-tabs-v2__tab:hover { color:var(--ms-text-primary); border-color:#444; }
.ms-feature-tabs-v2__tab.is-active { background:var(--ms-text-primary); color:#050505; border-color:var(--ms-text-primary); }
.ms-feature-tabs-v2__panels { border:1px solid var(--ms-border); background:var(--ms-bg-secondary); }
.ms-feature-tabs-v2__panel { display:none; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); min-height:520px; }
.ms-feature-tabs-v2__panel.is-active { display:grid; }
.ms-feature-tabs-v2__copy { padding:clamp(2.5rem,5vw,5rem); align-self:center; }
.ms-feature-tabs-v2__copy h3 { font-size:var(--ms-module-item-title-size, clamp(2.4rem,4vw,4.8rem)); line-height:1; letter-spacing:-.035em; margin-bottom:1rem; }
.ms-feature-tabs-v2__copy h4 { font-size:var(--ms-module-item-text-size, 1.2rem); margin-bottom:1rem; color:var(--ms-text-primary); }
.ms-feature-tabs-v2__copy p { font-size:var(--ms-module-item-text-size, var(--ms-module-text-size, var(--ms-module-text-size-default))); line-height:1.75; }
.ms-feature-tabs-v2__media { min-height:520px; }
.ms-feature-tabs-v2__media img { width:100%; height:100%; object-fit:cover; }
.ms-feature-tabs-v2--minimal .ms-feature-tabs-v2__panels { border-inline:0; }
.ms-feature-tabs-v2--minimal .ms-feature-tabs-v2__tab { background:transparent; border-width:0 0 2px; border-radius:0; }
.ms-feature-tabs-v2--minimal .ms-feature-tabs-v2__tab.is-active { background:transparent; color:var(--ms-text-primary); border-color:var(--ms-accent); }

/* ---------- Media showcase ---------- */
.ms-media-showcase-v2 { background:var(--ms-bg-primary); }
.ms-media-showcase-v2__inner { display:grid; gap:2.5rem; }
.ms-media-showcase-v2__copy { max-width:980px; }
.ms-media-showcase-v2__copy .ms-heading-boom { margin:.9rem 0 1rem; }
.ms-media-showcase-v2__copy p { max-width:760px; line-height:1.7; }
.ms-media-showcase-v2__media { overflow:hidden; background:#080808; border:1px solid var(--ms-border); aspect-ratio:16/8.5; }
.ms-media-showcase-v2__media img,
.ms-media-showcase-v2__media video,
.ms-media-showcase-v2__media iframe { width:100%; height:100%; object-fit:cover; border:0; }
.ms-media-showcase-v2--cinematic .ms-container { max-width:none; padding-inline:clamp(1.5rem,4vw,4rem); }
.ms-media-showcase-v2--cinematic .ms-media-showcase-v2__media { aspect-ratio:21/9; }
.ms-media-showcase-v2--split .ms-media-showcase-v2__inner { grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); align-items:center; gap:5rem; }
.ms-media-showcase-v2--split .ms-media-showcase-v2__media { aspect-ratio:4/3; }

/* ---------- Photo Journal / Recording Gallery ---------- */
.ms-photo-gallery-v2 { background: var(--ms-bg-primary); overflow: hidden; }
.ms-photo-gallery-v2__header .ms-section-header { margin-bottom: 3rem; }
.ms-photo-gallery-v2__stage-frame { position: relative; }
.ms-photo-gallery-v2__stage {
  --ms-photo-gap: 6px;
  position: relative;
  min-height: var(--ms-photo-height, 720px);
  display: grid;
  gap: var(--ms-photo-gap);
  overflow: hidden;
}
.ms-photo-gallery-v2--gap-none .ms-photo-gallery-v2__stage { --ms-photo-gap: 0px; }
.ms-photo-gallery-v2--gap-small .ms-photo-gallery-v2__stage { --ms-photo-gap: 6px; }
.ms-photo-gallery-v2--gap-medium .ms-photo-gallery-v2__stage { --ms-photo-gap: 16px; }
.ms-photo-gallery-v2--gap-large .ms-photo-gallery-v2__stage { --ms-photo-gap: 32px; }
.ms-photo-gallery-v2__item {
  position: relative;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: #0c0c0c;
  border: 1px solid rgba(255,255,255,.05);
}
.ms-photo-gallery-v2__item img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transform: scale(1.001);
  transition: transform .7s cubic-bezier(.2,.65,.2,1), filter .45s ease;
  filter: saturate(.9) contrast(1.02);
}
.ms-photo-gallery-v2__item:hover img { transform: scale(1.02); filter: saturate(1) contrast(1.03); }
.ms-photo-gallery-v2__item figcaption {
  position: absolute;
  inset: auto 0 0;
  z-index: 2;
  display: grid;
  gap: .35rem;
  padding: 3.5rem 1.5rem 1.35rem;
  background: linear-gradient(0deg, rgba(0,0,0,.82), transparent);
  color: #fff;
}
.ms-photo-gallery-v2__item figcaption strong { font-size: var(--ms-module-item-title-size, 1rem); line-height: 1.4; }
.ms-photo-gallery-v2__meta { color: rgba(255,255,255,.62); font-size: var(--ms-module-item-text-size, .72rem); letter-spacing: .12em; text-transform: uppercase; }

.ms-photo-gallery-v2--full_bleed .ms-photo-gallery-v2__stage { max-width: none; padding-inline: 0; grid-template-columns: 1fr; }
.ms-photo-gallery-v2--full_bleed .ms-photo-gallery-v2__item { min-height: var(--ms-photo-height, 720px); }
.ms-photo-gallery-v2--full_bleed .ms-photo-gallery-v2__item:nth-child(n+2) { display: none; }

.ms-photo-gallery-v2--split_vertical .ms-photo-gallery-v2__stage { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ms-photo-gallery-v2--split_vertical .ms-photo-gallery-v2__item { min-height: var(--ms-photo-height, 720px); }
.ms-photo-gallery-v2--split_vertical .ms-photo-gallery-v2__item:nth-child(n+3) { display: none; }

.ms-photo-gallery-v2--split_horizontal .ms-photo-gallery-v2__stage { grid-template-columns: 1fr; grid-template-rows: repeat(2,minmax(0,1fr)); }
.ms-photo-gallery-v2--split_horizontal .ms-photo-gallery-v2__item { min-height: 0; }
.ms-photo-gallery-v2--split_horizontal .ms-photo-gallery-v2__item:nth-child(n+3) { display: none; }

.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__stage { display: block; min-height: var(--ms-photo-height, 720px); isolation: isolate; }
.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__item { position: absolute; inset: 0; border: 0; }
.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__item:nth-child(1) { z-index: 2; clip-path: polygon(0 0, 64% 0, 49% 100%, 0 100%); }
.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__item:nth-child(2) { z-index: 1; clip-path: polygon(59% 0, 100% 0, 100% 100%, 44% 100%); }
.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__item:nth-child(n+3) { display: none; }
.ms-photo-gallery-v2--diagonal .ms-photo-gallery-v2__item:nth-child(1)::after {
  content:""; position:absolute; top:-10%; right:42%; width:1px; height:120%; background:rgba(255,255,255,.22); transform:rotate(8deg); transform-origin:center;
}

.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__stage {
  grid-template-columns: repeat(12,minmax(0,1fr));
  grid-template-rows: repeat(2,minmax(240px,1fr));
  min-height: var(--ms-photo-height, 720px);
}
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+1) { grid-column: span 5; grid-row: span 2; clip-path: polygon(0 0, 96% 0, 100% 92%, 7% 100%); }
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+2) { grid-column: span 4; clip-path: polygon(3% 4%, 100% 0, 94% 100%, 0 92%); }
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+3) { grid-column: span 3; clip-path: polygon(8% 0, 100% 6%, 94% 94%, 0 100%); }
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+4) { grid-column: span 3; clip-path: polygon(0 8%, 94% 0, 100% 92%, 6% 100%); }
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+5) { grid-column: span 4; clip-path: polygon(5% 0, 100% 8%, 93% 100%, 0 94%); }
.ms-photo-gallery-v2--mosaic .ms-photo-gallery-v2__item:nth-child(6n+6) { grid-column: span 7; min-height: 320px; }

.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__stage {
  display: block;
  height: var(--ms-filmstrip-height, 340px);
  min-height: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 0;
}
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__belt {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: var(--ms-photo-gap);
  width: max-content;
  min-width: 100%;
  height: 100%;
  min-height: 0;
  transform: translate3d(0,0,0);
  transform-origin: left center;
}
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__stage::-webkit-scrollbar { display: none; width: 0; height: 0; }
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__stage.is-auto-looping { scroll-behavior: auto; }
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__stage.is-auto-looping .ms-photo-gallery-v2__belt { will-change: transform; }
.ms-photo-gallery-v2--filmstrip [data-ms-filmstrip-clone="true"] { pointer-events: none; }
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__item {
  flex: 0 0 auto;
  width: auto;
  height: 100%;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 1 / 1;
  border-radius: 0;
}
.ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.ms-photo-gallery-v2--filmstrip-ratio-square .ms-photo-gallery-v2__item { aspect-ratio: 1 / 1; }
.ms-photo-gallery-v2--filmstrip-ratio-portrait .ms-photo-gallery-v2__item { aspect-ratio: 4 / 5; }
.ms-photo-gallery-v2--filmstrip-ratio-classic .ms-photo-gallery-v2__item { aspect-ratio: 4 / 3; }
.ms-photo-gallery-v2--filmstrip-ratio-photo .ms-photo-gallery-v2__item { aspect-ratio: 3 / 2; }
.ms-photo-gallery-v2--filmstrip-ratio-cinema .ms-photo-gallery-v2__item { aspect-ratio: 16 / 9; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-0 { aspect-ratio: 1 / 1; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-1 { aspect-ratio: 4 / 5; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-2 { aspect-ratio: 3 / 2; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-3 { aspect-ratio: 4 / 3; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-4 { aspect-ratio: 16 / 9; }
.ms-photo-gallery-v2--filmstrip-ratio-editorial .ms-photo-gallery-v2__item--editorial-5 { aspect-ratio: 1 / 1; }
.ms-photo-gallery-v2--filmstrip-corner-sharp .ms-photo-gallery-v2__item { border-radius: 0; }
.ms-photo-gallery-v2--filmstrip-corner-subtle .ms-photo-gallery-v2__item { border-radius: 4px; }
.ms-photo-gallery-v2--filmstrip-corner-soft .ms-photo-gallery-v2__item { border-radius: 12px; }
.ms-photo-gallery-v2__nav {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: clamp(44px, 3vw, 58px);
  height: clamp(64px, 6vw, 96px);
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.42);
  color: rgba(255,255,255,.94);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, opacity .2s ease, transform .2s ease;
}
.ms-photo-gallery-v2__nav:hover { background: rgba(0,0,0,.68); border-color: rgba(255,255,255,.38); }
.ms-photo-gallery-v2__nav:focus-visible { outline: 2px solid var(--ms-accent); outline-offset: 3px; }
.ms-photo-gallery-v2__nav span { font-size: clamp(2rem, 3vw, 3.2rem); line-height: .8; transform: translateY(-.04em); }
.ms-photo-gallery-v2__nav--prev { left: clamp(12px, 2.2vw, 34px); }
.ms-photo-gallery-v2__nav--next { right: clamp(12px, 2.2vw, 34px); }
@media (max-width: 768px) {
  .ms-photo-gallery-v2--filmstrip .ms-photo-gallery-v2__stage {
    height: min(var(--ms-filmstrip-height, 340px), 68vw);
  }
  .ms-photo-gallery-v2--filmstrip-ratio-portrait .ms-photo-gallery-v2__stage {
    height: min(var(--ms-filmstrip-height, 340px), 88vw);
  }
  .ms-photo-gallery-v2__nav { width: 42px; height: 64px; }
}

/* ---------- Use cases ---------- */
.ms-use-cases-v2 { background:var(--ms-bg-secondary); }
.ms-use-cases-v2__grid { display:grid; gap:1.25rem; }
.ms-use-case-v2 { position:relative; min-height:420px; color:var(--ms-text-primary); background:#111; border:1px solid var(--ms-border); overflow:hidden; isolation:isolate; }
.ms-use-case-v2__media { position:absolute; inset:0; z-index:-2; }
.ms-use-case-v2__media img { width:100%; height:100%; object-fit:cover; filter:brightness(.62) saturate(.85); transition:.5s ease; }
.ms-use-case-v2::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(0,0,0,.92),rgba(0,0,0,.1) 68%); }
.ms-use-case-v2__body { position:absolute; inset:auto 0 0; padding:1.6rem; }
.ms-use-case-v2 h3 { font-size:var(--ms-module-item-title-size, 2rem); margin:.5rem 0 .6rem; }
.ms-use-case-v2 p { font-size:var(--ms-module-item-text-size, .92rem); line-height:1.6; color:rgba(255,255,255,.68); }
.ms-use-case-v2:hover { color:var(--ms-text-primary); border-color:#424242; }
.ms-use-case-v2:hover img { transform:scale(1.035); filter:brightness(.7) saturate(.95); }
.ms-use-cases-v2--text_grid .ms-use-case-v2 { min-height:260px; }
.ms-use-cases-v2--text_grid .ms-use-case-v2__media { display:none; }
.ms-use-cases-v2--text_grid .ms-use-case-v2::after { display:none; }
.ms-use-cases-v2--text_grid .ms-use-case-v2__body { position:static; padding:2rem; }

/* ---------- Stats ---------- */
.ms-stats-v2 { background:var(--ms-bg-primary); }
.ms-stats-v2__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); border-block:1px solid var(--ms-border); }
.ms-stat-v2 { padding:2.3rem 1.5rem; border-right:1px solid var(--ms-border); }
.ms-stat-v2:last-child { border-right:0; }
.ms-stat-v2 strong { display:block; font-family:var(--ms-font-display); font-size:var(--ms-module-item-title-size, clamp(2.5rem,4vw,5rem)); line-height:1; letter-spacing:-.045em; color:var(--ms-text-primary); }
.ms-stat-v2 span { display:block; margin-top:.75rem; font-size:var(--ms-module-item-text-size, 1rem); font-weight:700; color:var(--ms-text-primary); }
.ms-stat-v2 small { display:block; margin-top:.35rem; color:var(--ms-text-muted); font-size:var(--ms-module-item-text-size, .85rem); line-height:1.5; }
.ms-stats-v2--panels .ms-stats-v2__grid { gap:1rem; border:0; }
.ms-stats-v2--panels .ms-stat-v2 { border:1px solid var(--ms-border); background:var(--ms-bg-tertiary); }
.ms-stats-v2--minimal .ms-stats-v2__grid { border:0; }
.ms-stats-v2--minimal .ms-stat-v2 { border:0; padding-left:0; }

/* ---------- Testimonials ---------- */
.ms-testimonials-v2 { background:var(--ms-bg-tertiary); }
.ms-testimonials-v2__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.ms-testimonial-v2 { margin:0; padding:2rem; background:#0d0d0d; border:1px solid var(--ms-border); min-height:300px; display:flex; flex-direction:column; justify-content:space-between; }
.ms-testimonial-v2 blockquote { font-family:var(--ms-font-display); font-size:var(--ms-module-item-title-size, 1.35rem); line-height:1.45; color:var(--ms-text-primary); }
.ms-testimonial-v2 figcaption { display:flex; align-items:center; gap:.85rem; margin-top:2rem; }
.ms-testimonial-v2 figcaption img { width:44px; height:44px; border-radius:50%; object-fit:cover; }
.ms-testimonial-v2 figcaption span { display:grid; gap:.2rem; }
.ms-testimonial-v2 figcaption strong { color:var(--ms-text-primary); font-size:var(--ms-module-item-text-size, .9rem); }
.ms-testimonial-v2 figcaption small { color:var(--ms-text-muted); font-size:var(--ms-module-item-text-size, .75rem); }
.ms-testimonials-v2--spotlight .ms-testimonials-v2__grid { grid-template-columns:minmax(0,1.8fr) repeat(2,minmax(0,.6fr)); }
.ms-testimonials-v2--spotlight .ms-testimonial-v2.is-primary { grid-row:span 2; min-height:620px; background:#090909; }
.ms-testimonials-v2--spotlight .ms-testimonial-v2.is-primary blockquote { font-size:var(--ms-module-item-title-size, clamp(2rem,3.5vw,4rem)); line-height:1.12; letter-spacing:-.03em; }
.ms-testimonials-v2--rail .ms-testimonials-v2__grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.75rem; }
.ms-testimonials-v2--rail .ms-testimonial-v2 { min-width:min(520px,80vw); scroll-snap-align:start; }

/* ---------- Logo wall ---------- */
.ms-logos-v2 { background:var(--ms-bg-primary); overflow:hidden; }
.ms-logos-v2__viewport { overflow:hidden; }
.ms-logos-v2__track { display:flex; align-items:center; gap:1px; }
.ms-logo-v2 { min-width:180px; min-height:116px; display:flex; align-items:center; justify-content:center; padding:1.5rem 2rem; color:var(--ms-text-muted); filter:grayscale(1); opacity:.72; transition:.2s ease; }
.ms-logo-v2 img { max-width:150px; height:var(--ms-logo-size,48px); object-fit:contain; }
.ms-logo-v2 span { font-weight:700; letter-spacing:.06em; }
.ms-logo-v2:hover { filter:none; opacity:1; color:var(--ms-text-primary); }
.ms-logos-v2--framed .ms-logo-v2 { border:1px solid var(--ms-border); margin-right:-1px; }
.ms-logos-v2--marquee .ms-logos-v2__track { width:max-content; animation:msLogoRail 34s linear infinite; }
@keyframes msLogoRail { to { transform:translateX(-50%); } }

/* ---------- Story ---------- */
.ms-story-v2 { position:relative; min-height:680px; display:flex; align-items:center; overflow:hidden; background:var(--ms-bg-primary); }
.ms-story-v2--immersive { background-image:var(--ms-story-image,none); background-size:cover; background-position:center; }
.ms-story-v2--immersive::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.98),rgba(0,0,0,.72) 52%,rgba(0,0,0,.3));
  opacity:var(--ms-story-overlay,66%);
}
.ms-story-v2__inner { position:relative; width:100%; z-index:1; }
.ms-story-v2__copy { max-width:760px; padding-block:6rem; }
.ms-story-v2__copy .ms-heading-boom { margin:.9rem 0 1.25rem; }
.ms-story-v2__copy p { line-height:1.8; margin-bottom:1.8rem; }
.ms-story-v2--split { min-height:auto; padding-block:7rem; }
.ms-story-v2--split .ms-story-v2__inner { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:5rem; align-items:center; }
.ms-story-v2--split .ms-story-v2__media { min-height:520px; overflow:hidden; border:1px solid var(--ms-border); }
.ms-story-v2--split .ms-story-v2__media img { width:100%; height:100%; min-height:520px; object-fit:cover; }

/* ---------- Editorial ---------- */
.ms-editorial-v2 { background:var(--ms-bg-primary); }
.ms-editorial-v2__grid { display:grid; gap:1.25rem; }
.ms-editorial-card-v2 { display:block; color:var(--ms-text-primary); border-top:1px solid var(--ms-border); padding-top:1rem; }
.ms-editorial-card-v2__media { aspect-ratio:16/10; overflow:hidden; background:#111; margin-bottom:1.15rem; }
.ms-editorial-card-v2__media img { width:100%; height:100%; object-fit:cover; filter:saturate(.85); transition:.45s ease; }
.ms-editorial-card-v2__body h3 { font-size:var(--ms-module-item-title-size, 1.65rem); line-height:1.18; margin:.55rem 0 .7rem; }
.ms-editorial-card-v2__body p { font-size:var(--ms-module-item-text-size, .92rem); line-height:1.62; color:var(--ms-text-muted); }
.ms-editorial-card-v2:hover { color:var(--ms-text-primary); }
.ms-editorial-card-v2:hover img { transform:scale(1.025); filter:saturate(1); }
.ms-editorial-v2--poster .ms-editorial-card-v2 { position:relative; min-height:460px; border:1px solid var(--ms-border); padding:0; overflow:hidden; }
.ms-editorial-v2--poster .ms-editorial-card-v2__media { position:absolute; inset:0; margin:0; aspect-ratio:auto; }
.ms-editorial-v2--poster .ms-editorial-card-v2__media::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.95),rgba(0,0,0,.08) 65%); }
.ms-editorial-v2--poster .ms-editorial-card-v2__body { position:absolute; inset:auto 0 0; padding:1.5rem; }
.ms-editorial-v2--minimal .ms-editorial-v2__grid { display:block; border-top:1px solid var(--ms-border); }
.ms-editorial-v2--minimal .ms-editorial-card-v2 { display:grid; grid-template-columns:160px 1fr; gap:2rem; padding:1.25rem 0; border-bottom:1px solid var(--ms-border); border-top:0; }
.ms-editorial-v2--minimal .ms-editorial-card-v2__media { margin:0; aspect-ratio:16/10; }

/* ---------- FAQ ---------- */
.ms-faq-v2 { background:var(--ms-bg-secondary); }
.ms-faq-v2__list { max-width:1100px; border-top:1px solid var(--ms-border); }
.ms-faq-item-v2 { border-bottom:1px solid var(--ms-border); }
.ms-faq-item-v2__question { width:100%; display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; border:0; background:transparent; color:var(--ms-text-primary); text-align:left; padding:1.55rem 0; font:inherit; font-size:var(--ms-module-item-title-size, 1.08rem); font-weight:700; cursor:pointer; }
.ms-faq-item-v2__icon { font-size:1.6rem; color:var(--ms-text-muted); transition:transform .25s ease; font-weight:300; }
.ms-faq-item-v2__answer { display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
.ms-faq-item-v2__answer > p { overflow:hidden; margin:0; max-width:850px; font-size:var(--ms-module-item-text-size, var(--ms-module-text-size, var(--ms-module-text-size-default))); line-height:1.75; color:var(--ms-text-muted); }
.ms-faq-item-v2.is-open .ms-faq-item-v2__answer { grid-template-rows:1fr; }
.ms-faq-item-v2.is-open .ms-faq-item-v2__answer > p { padding-bottom:1.6rem; }
.ms-faq-item-v2.is-open .ms-faq-item-v2__icon { transform:rotate(45deg); color:var(--ms-accent); }
.ms-faq-v2--two_column .ms-faq-v2__list { max-width:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 4rem; }
.ms-faq-v2--two_column .ms-faq-item-v2__question { cursor:default; }
.ms-faq-v2--two_column .ms-faq-item-v2__icon { display:none; }

/* ---------- Subscribe ---------- */
.ms-subscribe-v2 { background:var(--ms-bg-primary); }
.ms-subscribe-v2__inner { border:1px solid var(--ms-border); background:linear-gradient(120deg,#121212,#090909); padding:clamp(2.5rem,5vw,5rem); display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.8fr); gap:4rem; align-items:center; }
.ms-subscribe-v2__copy .ms-heading-boom { margin:.8rem 0 1rem; }
.ms-subscribe-v2__form { display:flex; gap:.65rem; }
.ms-subscribe-v2__form input { flex:1; min-width:0; height:52px; border:1px solid #353535; background:#050505; color:var(--ms-text-primary); padding:0 1rem; outline:none; border-radius:var(--ms-button-radius); }
.ms-subscribe-v2__form input:focus { border-color:#666; }
.ms-subscribe-v2--inline .ms-subscribe-v2__inner { border-width:1px 0; background:transparent; padding-inline:0; }

/* ---------- Spacer ---------- */
.ms-spacer-v2 { position:relative; }
.ms-spacer-v2--small { height:32px; }
.ms-spacer-v2--medium { height:64px; }
.ms-spacer-v2--large { height:112px; }
.ms-spacer-v2--xl { height:160px; }
.ms-spacer-v2--line::after { content:""; position:absolute; left:50%; top:50%; width:min(1600px,calc(100% - 3rem)); height:1px; background:var(--ms-border); transform:translate(-50%,-50%); }

/* ---------- Header desktop refinement ---------- */
@media (min-width: 1025px) {
  .ms-header { border-bottom-color:#1e1e1e; background:rgba(3,3,3,.91); }
  .ms-header__inner { max-width:var(--ms-container-max); }
  .ms-nav { gap:clamp(1.6rem,2.4vw,2.8rem); }
  .ms-nav a { color:#bcbcbc; font-weight:500; letter-spacing:.015em; }
  .ms-nav a:hover { color:#fff; }
  .ms-header__icon-btn { color:#bdbdbd; }
  .ms-header__icon-btn:hover { color:#fff; }
}

/* ---------- Desktop-first safeguards ---------- */
@media (max-width: 1200px) {
  .ms-grid-cols--5 { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .ms-categories-v2--editorial .ms-collection-card:nth-child(3n+1) { grid-column:span 1; }
  .ms-testimonials-v2--spotlight .ms-testimonials-v2__grid { grid-template-columns:1fr 1fr; }
  .ms-testimonials-v2--spotlight .ms-testimonial-v2.is-primary { grid-column:span 2; grid-row:auto; min-height:420px; }
}

@media (max-width: 900px) {
  .ms-grid-cols--4,.ms-grid-cols--5 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ms-grid-cols--3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ms-banner-v2--split .ms-banner-v2__inner,
  .ms-feature-v2__inner,
  .ms-feature-tabs-v2__panel,
  .ms-media-showcase-v2--split .ms-media-showcase-v2__inner,
  .ms-story-v2--split .ms-story-v2__inner,
  .ms-subscribe-v2__inner { grid-template-columns:1fr; gap:2rem; }
  .ms-feature-v2--reverse .ms-feature-v2__media,.ms-feature-v2--reverse .ms-feature-v2__copy { order:initial; }
  .ms-faq-v2--two_column .ms-faq-v2__list { grid-template-columns:1fr; }
  .ms-testimonials-v2__grid { grid-template-columns:1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .ms-statement-v2__ticker-track,
  .ms-logos-v2--marquee .ms-logos-v2__track { animation:none; }
}

.ms-home-v2 {
  background: var(--ms-bg-primary);
  color: var(--ms-text-body);
}


/* v0.26.9 final alignment guarantees. Placed last so module-specific margin shorthands cannot undo centering. */
.ms-home-v2 .ms-module-eyebrow-align--left .ms-eyebrow { display:block; text-align:left; margin-left:0 !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-eyebrow-align--center .ms-eyebrow { display:block; text-align:center; margin-left:auto !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-eyebrow-align--right .ms-eyebrow { display:block; text-align:right; margin-left:auto !important; margin-right:0 !important; }
.ms-home-v2 .ms-module-title-align--left .ms-heading-boom { text-align:left; margin-left:0 !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-title-align--center .ms-heading-boom { text-align:center; margin-left:auto !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-title-align--right .ms-heading-boom { text-align:right; margin-left:auto !important; margin-right:0 !important; }
.ms-home-v2 .ms-module-subtitle-align--left .ms-module-subtitle { text-align:left; margin-left:0 !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-subtitle-align--center .ms-module-subtitle { text-align:center; margin-left:auto !important; margin-right:auto !important; }
.ms-home-v2 .ms-module-subtitle-align--right .ms-module-subtitle { text-align:right; margin-left:auto !important; margin-right:0 !important; }