/* ==========================================================================
   Nuvessa Intimates — Base Framework
   Global typography, buttons, header, footer, WhatsApp CTA, mobile.
   Depends on: nuvessa-tokens.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Global typography & page shell
   -------------------------------------------------------------------------- */
body.nuv-body {
  background: var(--nuv-sand);
  color: var(--nuv-text);
  font-family: var(--nuv-font-body);
  font-size: var(--nuv-fs-body);
  line-height: var(--nuv-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.nuv-body h1, .nuv-body h2, .nuv-body h3,
.nuv-body h4, .nuv-body h5, .nuv-body h6,
.nuv-body .entry-title, .nuv-body .woocommerce-loop-product__title {
  font-family: var(--nuv-font-head);
  font-weight: 500;
  color: var(--nuv-ink);
  line-height: var(--nuv-lh-tight);
  letter-spacing: 0.005em;
}

.nuv-body a { color: var(--nuv-ink); transition: color var(--nuv-transition); }
.nuv-body a:hover { color: var(--nuv-forest); }

/* ---------------------------------------------------------------
   WooCommerce Blocks（购物车 / 结账）
   全局 a 规则会把区块按钮文字染成深色，而按钮底是深绿 → 看不见。
   这里让区块按钮恢复正常对比度。
   --------------------------------------------------------------- */
.nuv-body .wc-block-components-button,
.nuv-body .wp-block-woocommerce-proceed-to-checkout-block a,
.nuv-body .wc-block-cart__submit-button,
.nuv-body a.wc-forward,
.nuv-body a.checkout-button,
.nuv-body #place_order,
.nuv-body .wc-block-components-button:visited {
  color: #fff !important;
  background-color: var(--nuv-forest, #1F3A34) !important;
  border-color: var(--nuv-forest, #1F3A34) !important;
}
.nuv-body .wc-block-components-button:hover,
.nuv-body .wp-block-woocommerce-proceed-to-checkout-block a:hover,
.nuv-body .wc-block-cart__submit-button:hover,
.nuv-body a.wc-forward:hover,
.nuv-body a.checkout-button:hover,
.nuv-body #place_order:hover {
  color: #fff !important;
  background-color: var(--nuv-forest-soft, #2E554C) !important;
  border-color: var(--nuv-forest-soft, #2E554C) !important;
}

/* 区块里的次要按钮（返回购物车等）保持描边样式 */
.nuv-body .wc-block-components-button.is-outlined,
.nuv-body .wc-block-components-button--link,
.nuv-body .wc-block-components-button.is-link {
  color: var(--nuv-forest, #1F3A34) !important;
  background-color: transparent !important;
  border-color: var(--nuv-forest, #1F3A34) !important;
}

/* 数字输入框 / 移除链接等保持深色可读 */
.nuv-body .wc-block-cart-item__remove-link,
.nuv-body .wc-block-components-totals-coupon-link {
  color: var(--nuv-forest, #1F3A34) !important;
}

.nuv-wrap { max-width: var(--nuv-container); margin: 0 auto; padding: 0 20px; }
.nuv-wrap--narrow { max-width: var(--nuv-container-narrow); }

.nuv-eyebrow {
  font-family: var(--nuv-font-body);
  font-size: var(--nuv-fs-xs);
  font-weight: 500;
  letter-spacing: var(--nuv-ls-eyebrow);
  text-transform: uppercase;
  color: var(--nuv-forest);
  margin: 0 0 14px;
}
.nuv-eyebrow--muted { color: var(--nuv-text-muted); }
.nuv-eyebrow--invert { color: var(--nuv-amethyst-soft); }
.nuv-eyebrow--light { color: var(--nuv-amethyst-soft); }

.nuv-lede {
  font-size: 1.05rem;
  color: var(--nuv-text-muted);
  max-width: 62ch;
  margin: 0 auto;
}

/* --------------------------------------------------------------------------
   2. Buttons — lingerie brand: deep plum primary, softer radius
   -------------------------------------------------------------------------- */
.nuv-btn,
.nuv-body .nuv-btn,
.nuv-body a.nuv-btn,
.nuv-body button.nuv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 15px 34px;
  font-family: var(--nuv-font-body);
  font-size: var(--nuv-fs-sm);
  font-weight: 500;
  letter-spacing: var(--nuv-ls-btn);
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid var(--nuv-forest);
  border-radius: var(--nuv-radius-pill);
  background: var(--nuv-forest);
  color: var(--nuv-sand);
  cursor: pointer;
  transition: all var(--nuv-transition);
  line-height: 1;
}

.nuv-body .nuv-btn:hover {
  background: var(--nuv-forest-soft);
  border-color: var(--nuv-forest-soft);
  color: var(--nuv-white);
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(90, 31, 45, .22);
}

/* Ghost — plum outline on light backgrounds */
.nuv-btn--ghost,
.nuv-body a.nuv-btn--ghost {
  background: transparent;
  color: var(--nuv-forest);
  border-color: var(--nuv-forest);
}
.nuv-body .nuv-btn--ghost:hover {
  background: var(--nuv-forest);
  color: var(--nuv-sand);
  border-color: var(--nuv-forest);
}

/* Light — ivory fill (for use on plum/dark backgrounds) */
.nuv-btn--light,
.nuv-body a.nuv-btn--light {
  background: var(--nuv-sand);
  border-color: var(--nuv-sand);
  color: var(--nuv-forest);
}
.nuv-body .nuv-btn--light:hover {
  background: var(--nuv-white);
  border-color: var(--nuv-white);
  color: var(--nuv-forest);
}

/* Outline on image / dark — ivory hairline */
.nuv-btn--outline-light,
.nuv-body a.nuv-btn--outline-light {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .55);
  color: #fff;
  backdrop-filter: blur(2px);
}
.nuv-body .nuv-btn--outline-light:hover {
  background: var(--nuv-sand);
  border-color: var(--nuv-sand);
  color: var(--nuv-forest);
}

/* Outline — plum hairline on light backgrounds */
.nuv-btn--outline,
.nuv-body a.nuv-btn--outline {
  background: transparent;
  border-color: var(--nuv-line-strong);
  color: var(--nuv-forest);
}
.nuv-body .nuv-btn--outline:hover {
  background: var(--nuv-forest);
  border-color: var(--nuv-forest);
  color: var(--nuv-sand);
}

/* WhatsApp button — brand-adjacent green, restrained */
.nuv-btn--wa,
.nuv-body a.nuv-btn--wa {
  background: #25D366;
  border-color: #25D366;
  color: #0B141A;
}
.nuv-body .nuv-btn--wa:hover {
  background: #1FB855;
  border-color: #1FB855;
  color: #0B141A;
}
.nuv-btn--wa .nuv-ico { flex: 0 0 auto; }

.nuv-btn--block { width: 100%; }

/* --------------------------------------------------------------------------
   3. Section rhythm
   -------------------------------------------------------------------------- */
.nuv-section { padding: var(--nuv-section-y) 0; }
.nuv-section--ivory { background: var(--nuv-sand); }
.nuv-section--white { background: var(--nuv-white); }
.nuv-section--dark {
  background: var(--nuv-forest-deep);
  color: var(--nuv-text-invert);
}
.nuv-body .nuv-section--dark h1,
.nuv-body .nuv-section--dark h2,
.nuv-body .nuv-section--dark h3,
.nuv-body .nuv-section--dark h4,
.nuv-section--dark h1, .nuv-section--dark h2,
.nuv-section--dark h3, .nuv-section--dark h4 {
  color: #fff !important;
}
.nuv-body .nuv-section--dark .nuv-lede,
.nuv-section--dark .nuv-lede { color: var(--nuv-text-invert-m); }
.nuv-body .nuv-section--dark p,
.nuv-section--dark p { color: var(--nuv-text-invert-m); }

.nuv-section-head { text-align: center; margin-bottom: var(--nuv-gap-lg); }
.nuv-section-head h2 { margin: 0 0 12px; }

/* Hairline divider */
.nuv-hr { height: 1px; background: var(--nuv-line); border: 0; margin: 0; }
.nuv-section--dark .nuv-hr { background: var(--nuv-line-dark); }

/* --------------------------------------------------------------------------
   4. Header — announcement bar + sticky nav
   -------------------------------------------------------------------------- */
.nuv-announce {
  background: var(--nuv-forest-deep);
  color: var(--nuv-text-invert);
  font-size: var(--nuv-fs-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  padding: 9px 16px;
}
.nuv-announce strong { color: var(--nuv-amethyst-soft); font-weight: 500; }
.nuv-announce a { color: inherit; text-decoration: none; }
.nuv-announce a:hover { color: var(--nuv-amethyst-soft); }

/* Header shell overrides for Astra */
.nuv-body .site-header,
.nuv-body .ast-primary-header-bar {
  background: var(--nuv-white) !important;
  border-bottom: 1px solid var(--nuv-line);
}
.nuv-body .site-header .ast-builder-menu .menu-item > .menu-link {
  font-family: var(--nuv-font-body);
  font-size: var(--nuv-fs-sm);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nuv-text);
}
.nuv-body .site-header .ast-builder-menu .menu-item > .menu-link:hover,
.nuv-body .site-header .ast-builder-menu .current-menu-item > .menu-link {
  color: var(--nuv-forest);
}

/* Brand lockup (used when no logo image is set) */
.nuv-brand { display: inline-flex; flex-direction: column; line-height: 1.05; }
.nuv-brand__name {
  font-family: var(--nuv-font-head);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--nuv-forest);
  text-transform: none;
}
.nuv-brand__sub {
  font-family: var(--nuv-font-body);
  font-size: 0.6rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--nuv-forest);
  margin-top: 3px;
}

/* Header utility actions */
.nuv-head-actions { display: inline-flex; align-items: center; gap: 14px; }
.nuv-head-actions a { text-decoration: none; color: var(--nuv-ink); }
.nuv-head-actions a:hover { color: var(--nuv-forest); }

/* --------------------------------------------------------------------------
   5. Footer
   -------------------------------------------------------------------------- */
.nuv-footer {
  background: var(--nuv-forest-deep);
  color: var(--nuv-text-invert-m);
  padding: var(--nuv-gap-xl) 0 0;
  font-size: var(--nuv-fs-sm);
}
.nuv-footer a { color: var(--nuv-text-invert-m); text-decoration: none; transition: color var(--nuv-transition); }
.nuv-footer a:hover { color: var(--nuv-amethyst-soft); }

.nuv-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: var(--nuv-gap-lg);
  padding-bottom: var(--nuv-gap-xl);
}
.nuv-footer__brand .nuv-brand__name { color: var(--nuv-white); }
.nuv-footer__brand p { margin: 16px 0 0; max-width: 34ch; line-height: 1.8; }

.nuv-footer h4 {
  font-family: var(--nuv-font-body);
  font-size: var(--nuv-fs-xs);
  font-weight: 600;
  letter-spacing: var(--nuv-ls-eyebrow);
  text-transform: uppercase;
  color: var(--nuv-white);
  margin: 0 0 18px;
}
.nuv-footer ul { list-style: none; margin: 0; padding: 0; }
.nuv-footer li { margin-bottom: 11px; }

.nuv-footer__bottom {
  border-top: 1px solid var(--nuv-line-dark);
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  font-size: var(--nuv-fs-xs);
  letter-spacing: 0.04em;
}

/* Footer contact row */
.nuv-footer__contact { display: flex; flex-direction: column; gap: 10px; }
.nuv-footer__contact a { display: inline-flex; align-items: center; gap: 9px; }

/* 社交链接（页脚） */
.nuv-social {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
.nuv-social__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(246, 242, 234, .22);
  color: var(--nuv-text-invert-m, #BFCEC8);
  transition: color .22s ease, border-color .22s ease, background .22s ease;
}
.nuv-social__link:hover,
.nuv-social__link:focus-visible {
  color: var(--nuv-forest-deep, #142824);
  background: var(--nuv-gold-lt, #D3C09A);
  border-color: var(--nuv-gold-lt, #D3C09A);
}
.nuv-social__link svg { width: 17px; height: 17px; display: block; }

@media (max-width: 544px) {
  .nuv-social { margin-top: 16px; }
  .nuv-social__link { width: 42px; height: 42px; }
}

/* Footer B2B badge row */
.nuv-footer__badges {
  display: flex; flex-wrap: wrap; gap: 10px 22px;
  padding: 20px 0 0; margin-top: 8px;
  border-top: 1px solid var(--nuv-line-dark);
  font-size: var(--nuv-fs-xs); letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--nuv-text-invert-m);
}
.nuv-footer__badges span { display: inline-flex; align-items: center; gap: 8px; }

/* --------------------------------------------------------------------------
   6. WhatsApp sticky CTA (mobile) + floating button
   -------------------------------------------------------------------------- */
.nuv-wa-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9990;
  width: 54px; height: 54px;
  border-radius: 50%;
  background: #25D366;
  color: #0B141A;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: var(--nuv-shadow-lg);
  transition: transform var(--nuv-transition);
}
.nuv-wa-float:hover { transform: scale(1.07); color: #0B141A; }
.nuv-wa-float .nuv-ico { width: 26px; height: 26px; }

/* --------------------------------------------------------------------------
   10. Email output (Cloudflare-obfuscation-safe)
   JS 生成 <a>；无 JS 时显示 "user (at) domain" 可读文本。
   -------------------------------------------------------------------------- */
.nuv-mail { display: inline; }
.nuv-mail a {
  color: var(--nuv-forest);
  border-bottom: 1px solid var(--nuv-rose);
  text-decoration: none;
  transition: color var(--nuv-transition);
}
.nuv-mail a:hover { color: var(--nuv-forest); }
.nuv-mail__plain {
  font-family: var(--nuv-font-body);
  color: var(--nuv-text-muted);
  word-break: break-word;
}
.nuv-footer__mail a { color: var(--nuv-text-invert-m); border-bottom-color: var(--nuv-gold); }
.nuv-footer__mail a:hover { color: var(--nuv-amethyst-soft); }
.nuv-footer__mail .nuv-mail__plain { color: var(--nuv-text-invert-m); }

/* --------------------------------------------------------------------------
   11. Responsive — mobile first polish
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .nuv-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--nuv-gap); }
}

@media (max-width: 767px) {
  .nuv-footer__grid { grid-template-columns: 1fr; gap: var(--nuv-gap-lg); }
  .nuv-footer__bottom { flex-direction: column; text-align: center; }
  .nuv-footer { padding-top: var(--nuv-gap-lg); }
  .nuv-footer__grid { padding-bottom: var(--nuv-gap-lg); }
  .nuv-brand__name { font-size: 1.28rem; }
  .nuv-announce { font-size: 0.68rem; letter-spacing: 0.06em; }
  .nuv-btn, .nuv-body a.nuv-btn { padding: 13px 22px; }
  .nuv-wa-float { width: 50px; height: 50px; right: 14px; bottom: 14px; }
}

/* Accessibility: honour reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .nuv-body *, .nuv-body *::before, .nuv-body *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}