@charset "utf-8";

/* Purchase page visual layer. Order creation and gateway handling remain in buy.html. */
body:has(#buy-page) {
  background: #0b121a;
  color: #eee9e2;
  padding-bottom: 94px;
}
body:has(#buy-page)::before,
body:has(#buy-page)::after { display: none; }
#buy-page {
  --site-bg: #0b121a;
  --site-card: #17212b;
  --site-panel: #17212b;
  --site-border: rgba(224, 212, 196, .16);
  --bg-secondary: #111b25;
  --text-primary: #eee9e2;
  --text-secondary: #b8c0c3;
  --color-primary: #d8a170;
  --color-primary-500: #d8a170;
  --color-primary-600: #c48b5e;
  --color-secondary: #ad7752;
  --link: #edb887;
  --link-hover: #f5cba3;
  background: #0b121a;
  color: var(--text-primary);
}
#buy-page .topbar,
#buy-page .topbar.scrolled {
  background: rgba(9, 16, 24, .95);
  border-bottom: 1px solid rgba(226, 209, 188, .16);
  box-shadow: none;
}
#buy-page .topbar::before { display: none; }
#buy-page .topbar-inner { min-height: 76px; padding: 6px 0; }
#buy-page .brand span,
#buy-page .footer .brand span {
  background: none;
  color: #dfaa79;
  -webkit-text-fill-color: currentColor;
  font: 600 25px/1.2 "Noto Serif SC", "Songti SC", "SimSun", serif;
  letter-spacing: .08em;
}
#buy-page .brand small { color: #aeb6b9; font-size: 12px; font-weight: 400; }
#buy-page .brand small::before { color: #d8a170; }
#buy-page .nav a,
#buy-page .nav a[style] { color: #c3c6c7 !important; font-size: 14px; font-weight: 400; }
#buy-page .nav a.active,
#buy-page .nav a:hover { color: #f0bd8f !important; background: transparent; }
#buy-page .nav a::before { display: none; }
#buy-page .nav a::after,
#buy-page .nav a.active::after { background: #e2ad7d; box-shadow: none; height: 1px; }
#buy-page .mobile-menu-toggle { color: #e8dfd2; }

#buy-page .buy-hero {
  min-height: 540px;
  display: flex;
  align-items: center;
  padding: 90px 0;
  text-align: left;
  background: linear-gradient(90deg,rgba(5,10,16,.96) 0%,rgba(5,10,16,.87) 48%,rgba(5,10,16,.43) 100%),url("../study-bg.webp") center 53%/cover no-repeat;
}
#buy-page .buy-hero::before,
#buy-page .buy-hero::after { display: none; }
#buy-page .buy-hero .buy-container { width: 100%; }
#buy-page .buy-hero-badge {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0 0 0 22px;
  font: 500 12px/1.5 var(--font-family-sans);
  letter-spacing: .24em;
  color: #dfaa79;
  position: relative;
  animation: none;
}
#buy-page .buy-hero-badge::before { content: ""; width: 12px; height: 1px; background: currentColor; position: absolute; left: 0; top: 50%; }
#buy-page .buy-hero h1 {
  font: 600 clamp(55px, 5.8vw, 84px)/1.23 "Noto Serif SC", "Songti SC", "SimSun", serif;
  letter-spacing: -.04em;
  max-width: 780px;
  margin: 34px 0 20px;
  color: #f4f0e9;
}
#buy-page .buy-hero h1.buy-blade-heading { position: relative; }
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  #buy-page .buy-hero h1.buy-blade-heading::after {
    content: attr(data-glint);
    position: absolute;
    top: 0;
    left: 0;
    width: max-content;
    white-space: pre;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 47%, rgba(255,244,218,.55) 49%, #fffefa 50%, rgba(255,222,177,.62) 51%, transparent 53%) 100% 0 / 300% 100% no-repeat;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 .1em rgba(255,248,228,.95)) drop-shadow(0 0 .27em rgba(238,172,108,.7));
    animation: buy-blade-sweep 3s linear infinite;
  }
}
@keyframes buy-blade-sweep {
  0% { background-position: 100% 0; }
  60%, 100% { background-position: 0% 0; }
}
@media (prefers-reduced-motion: reduce) {
  #buy-page .buy-hero h1.buy-blade-heading::after { display: none; }
}
#buy-page .buy-hero-sub { margin: 0; max-width: 610px; color: #cad0d0; font-size: 17px; line-height: 1.9; }
#buy-page .buy-hero-price { justify-content: flex-start; gap: 20px; margin: 27px 0 28px; }
#buy-page .buy-hero-now { font: 600 54px/1 "Noto Serif SC", "Songti SC", serif; color: #e5ad7d; }
#buy-page .buy-hero-old { font-size: 17px; color: #aeb8bc; }
#buy-page .buy-hero-save { border-radius: 3px; background: rgba(226, 173, 125, .15); border: 1px solid rgba(226, 173, 125, .44); color: #e8b78e; font-size: 12px; font-weight: 500; padding: 6px 10px; }
#buy-page .buy-hero-trust { justify-content: flex-start; gap: 14px 25px; color: #bac2c3; font-size: 12px; }
#buy-page .buy-hero-trust span::before { content: "✓"; color: #e2ad7d; margin-right: 8px; }
#buy-page .buy-stats { background: #111b25; border-color: rgba(224,212,196,.13); }
#buy-page .buy-stats-grid { padding: 28px 24px; }
#buy-page .buy-stat { color: #aeb8bd; font-size: 12px; }
#buy-page .buy-stat-num { font: 600 28px/1.3 "Noto Serif SC", "Songti SC", serif; color: #e2ad7d; }
#buy-page .section { border-color: rgba(224,212,196,.13); padding: 88px 0; }
#buy-page #pricing { background: #0d151e; }
#buy-page .section h2 { font: 600 clamp(38px,4vw,56px)/1.2 "Noto Serif SC", "Songti SC", serif; letter-spacing: -.025em; color: #f0e9df; }
#buy-page .section .lead { color: #b4bdc0; font-size: 16px; }
#buy-page .buy-plans { gap: 20px; margin-top: 46px; }
#buy-page .plan-card { background: linear-gradient(155deg,#1b252d,#111b24 70%); border: 1px solid rgba(224,212,196,.19); border-radius: 8px; padding: 35px; box-shadow: none; }
#buy-page .plan-card:hover { border-color: rgba(226,173,125,.6); box-shadow: 0 15px 42px rgba(0,0,0,.24); }
#buy-page .plan-card.selected { border-color: #d7a475; box-shadow: 0 0 0 3px rgba(226,173,125,.11); }
#buy-page .plan-card.selected::after { color: #e7b98f; font-size: 12px; }
#buy-page .buy-badge,
#buy-page .buy-badge-alt { border-radius: 3px; background: #9d6b48; box-shadow: none; font-size: 11px; font-weight: 500; letter-spacing: .09em; }
#buy-page .buy-badge-alt { background: #485663; }
#buy-page .buy-plan-name { font: 600 29px/1.25 "Noto Serif SC", "Songti SC", serif; margin-top: 16px; }
#buy-page .buy-price-big { color: #e6b383; font: 600 49px/1 "Noto Serif SC", "Songti SC", serif; }
#buy-page .buy-ribbon { border-radius: 3px; transform: none; background: rgba(226,173,125,.14); color: #e3b78e; font-size: 12px; }
#buy-page .buy-features li { color: #d7dbd8; border-top: 1px solid rgba(224,212,196,.1); padding: 11px 0; font-size: 14px; }
#buy-page .buy-features li::before { content: "✓"; color: #dfad80; }
#buy-page #features,
#buy-page #faq { background: #111b25 !important; }
#buy-page .mini { background: #17232d; border: 1px solid rgba(224,212,196,.13); border-radius: 6px; box-shadow: none; }
#buy-page .mini::before { display: none; }
#buy-page .mini:hover { transform: none; border-color: rgba(226,173,125,.42); box-shadow: none; }
#buy-page .mini h4 { color: #e9e4db; }
#buy-page .mini p { color: #b8c0c3; }
#buy-page #trust,
#buy-page #checkout { background: #0d151e; }
#buy-page .buy-trust-item { color: #d8d9d5; }
#buy-page .buy-trust-item svg { color: #dca876; }
#buy-page #trust .panel { background: linear-gradient(145deg,#1b282f,#14202a) !important; border-color: rgba(226,173,125,.42) !important; box-shadow: none; }
#buy-page #trust .panel p { color: #d7dcd9 !important; }
#buy-page .faq-item { border-radius: 5px; background: #17232d; border-color: rgba(224,212,196,.16); }
#buy-page .faq-item[open] { border-color: rgba(226,173,125,.5); }
#buy-page .faq-item summary { color: #ece5dc; }
#buy-page .faq-body { color: #bac3c5; }
#buy-page .pay-option { border-radius: 5px; color: #fff; font: 700 16px var(--font-family-sans); transition: filter .2s ease,box-shadow .2s ease,transform .2s ease; }
#buy-page .pay-option[data-type="alipay"] { border: 1px solid #65a6ff; background: #1268df !important; }
#buy-page .pay-option[data-type="wxpay"] { border: 1px solid #62d494; background: #067a3e !important; }
#buy-page .pay-option:hover { filter: brightness(1.12); transform: translateY(-2px); box-shadow: 0 7px 20px rgba(0,0,0,.22); }
#buy-page .pay-option.selected { box-shadow: 0 0 0 3px #edbd93,0 0 0 6px rgba(237,189,147,.18); transform: none; }
#buy-page .buy-email-tip { background: #17232d; border: 1px solid rgba(224,212,196,.18); color: #c9cfcd; border-radius: 5px; }
#buy-page .buy-guarantee { color: #b8c0c3; }
#buy-page .buy-company-link { margin: 20px 0 0; font-size: 14px; }
#buy-page .buy-company-link a { color: #e9b98c; text-underline-offset: 5px; }
#buy-page .buy-company-link a:hover { color: #ffd2a6; }
#buy-page .footer { background: #091019; border-top: 1px solid rgba(224,212,196,.13); color: #aeb8bc; }
#buy-page .footer strong { color: #ece3d7; }
.progress-bar { height: 1px; background: #dca876; box-shadow: none; }
.back-to-top { background: #9d6b48; color: #f9efe2; box-shadow: none; }
.pay-bar { background: rgba(9,16,24,.96); border-top: 1px solid rgba(226,173,125,.34); box-shadow: 0 -12px 35px rgba(0,0,0,.25); padding: 13px 24px; }
.pay-bar-price { font: 600 31px/1 "Noto Serif SC", "Songti SC", serif; color: #e6af7e; }
.pay-bar-unit,.pay-bar-count { color: #aeb8bc; }
.pay-btn { max-width: 370px; background: linear-gradient(135deg,#edbb8e,#b4774b); color: #151310; border-radius: 5px; box-shadow: none; font: 600 17px var(--font-family-sans); }
.pay-btn:hover { box-shadow: 0 7px 24px rgba(226,173,125,.22); }
#buy-page a:focus-visible,#buy-page button:focus-visible,.pay-btn:focus-visible { outline: 2px solid #e9b98c; outline-offset: 3px; }
@media(max-width:760px) {
  #buy-page .topbar-inner { min-height: 60px; padding: 8px 18px; }
  #buy-page .brand span { font-size: 20px; }
  #buy-page .brand small { display: none; }
  #buy-page .nav { gap: 0; background: #101b25; border-color: rgba(226,173,125,.22); }
  #buy-page .nav a { font-size: 12px; padding: 9px 8px; white-space: nowrap; }
  #buy-page .buy-hero { min-height: 0; padding: 76px 0 70px; background-position: 65% center; }
  #buy-page .buy-hero h1 { font-size: clamp(47px,9vw,66px); }
  #buy-page .buy-hero-sub { font-size: 15px; }
  #buy-page .buy-stats-grid { grid-template-columns: repeat(2,1fr); gap: 24px 10px; }
  #buy-page .section { padding: 68px 0; }
  #buy-page .plan-card { padding: 30px 24px; }
  .pay-bar { padding: 10px 16px; }
  .pay-btn { padding: 15px; font-size: 14px; }
}
@media(max-width:480px) {
  #buy-page .topbar-inner { display: flex; padding: 10px 18px; }
  #buy-page .buy-hero { padding: 58px 0 56px; }
  #buy-page .buy-hero h1 { font-size: 45px; }
  #buy-page .buy-hero-price { gap: 12px; }
  #buy-page .buy-hero-now { font-size: 47px; }
  #buy-page .buy-hero-trust { display: grid; gap: 9px; }
  #buy-page .buy-pay-options { gap: 10px; }
  .pay-bar-info { min-width: 78px; }
  .pay-bar-price { font-size: 25px; }
}