/* ============================================================
   VapeAurora · Base — 重置、排版、焦点态、氛围层
   ============================================================ */

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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 96px;   /* 避开 sticky 头部 */
}

body {
  margin: 0;
  background: var(--aur-bg);
  color: var(--aur-text);
  font-family: var(--aur-font-body);
  font-size: var(--aur-f-body);
  line-height: var(--aur-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4 {
  font-family: var(--aur-font);
  font-weight: 600;
  line-height: var(--aur-lh-tight);
  letter-spacing: var(--aur-tr-tight);
  margin: 0;
  text-wrap: balance;          /* 标题换行更均衡 */
}

p { margin: 0; text-wrap: pretty; }

a { color: inherit; text-decoration: none; }

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

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

/* ---- 焦点态：键盘可见，2px + 2px 偏移 ---- */
:focus-visible {
  outline: 2px solid var(--aur-accent);
  outline-offset: 2px;
  border-radius: var(--aur-r-sm);
}
:focus:not(:focus-visible) { outline: none; }

/* ---- 只给键盘用户显示跳转链接 ---- */
.skip-link {
  position: absolute; top: -100px; left: var(--aur-s4);
  z-index: 200; padding: 12px 20px;
  background: var(--aur-accent); color: #04120F;
  font-weight: 700; border-radius: var(--aur-r-sm);
  transition: top var(--aur-dur-fast) var(--aur-ease-out);
}
.skip-link:focus { top: var(--aur-s4); }

/* ============================================================
   氛围层：极光光带 + 颗粒噪点
   不用「白底紫渐变」；极光只做环境光，不承载信息
   ============================================================ */

.aur-atmosphere {
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  overflow: hidden;
}
/* 顶部极光光带：品牌名 VapeAurora 的视觉锚点 */
.aur-atmosphere::before {
  content: "";
  position: absolute;
  top: -32vh; left: 50%;
  width: 140vw; height: 78vh;
  transform: translateX(-50%);
  background:
    radial-gradient(48% 42% at 22% 62%, rgba(79, 216, 196, .20), transparent 68%),
    radial-gradient(42% 38% at 52% 58%, rgba(111, 184, 245, .16), transparent 66%),
    radial-gradient(40% 40% at 82% 64%, rgba(169, 139, 240, .15), transparent 66%);
  filter: blur(46px);
}
/* 颗粒：消除大面积纯色的塑料感 */
.aur-atmosphere::after {
  content: "";
  position: absolute; inset: 0;
  opacity: .032;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

/* ============================================================
   入场序列：一次编排好的错峰揭示（间隔 90ms）
   ============================================================ */

.aur-reveal {
  opacity: 0;
  transform: translateY(26px);
}
.aur-reveal.aur-in {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--aur-dur-slow) var(--aur-ease-out),
    transform var(--aur-dur-slow) var(--aur-ease-out);
}
/* 降级：无动效偏好时立即呈现，绝不隐藏内容 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .aur-reveal, .aur-reveal.aur-in {
    opacity: 1; transform: none; transition: none;
  }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* 仅在支持滚动触发的浏览器上隐藏初始态，
   避免 JS 失效导致内容永久不可见 */
html.aur-js .aur-reveal { opacity: 0; transform: translateY(26px); }
html.aur-js .aur-reveal.aur-in { opacity: 1; transform: none; }
html:not(.aur-js) .aur-reveal { opacity: 1; transform: none; }

/* ---- 屏幕阅读器专用 ---- */
.aur-sr {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.aur-shell { position: relative; z-index: 1; }
.aur-wrap {
  width: 100%; max-width: var(--aur-maxw);
  margin-inline: auto; padding-inline: var(--aur-gutter);
}