/* 睿之禾 2026 redesign — warm editorial system */
:root {
  --blue: #173f36 !important;
  --blue-dark: #0d2c26 !important;
  --blue-light: #dce9df !important;
  --text: #17221e !important;
  --text-sec: #53615b !important;
  --text-ter: #829089 !important;
  --border: #cfd8d2 !important;
  --bg: #f4f0e7 !important;
  --white: #fffdf7 !important;
  --accent: #ed6a3a;
  --shadow: 8px 8px 0 #173f36 !important;
  --radius: 2px !important;
}

body {
  font-family: "Noto Serif SC", "Songti SC", "STSong", serif !important;
  color: var(--text) !important;
  background: var(--bg) !important;
  background-image: radial-gradient(rgba(23,63,54,.1) .7px, transparent .7px) !important;
  background-size: 14px 14px !important;
}

nav {
  position: sticky !important;
  height: 78px !important;
  padding: 0 clamp(20px, 5vw, 72px) !important;
  background: rgba(244,240,231,.94) !important;
  border: 0 !important;
  border-bottom: 2px solid var(--text) !important;
  backdrop-filter: blur(12px) !important;
}
.nav-logo-icon, .footer-logo-icon { background: var(--accent) !important; border-radius: 50% !important; }
.nav-logo-name, .footer-logo-name { color: var(--text) !important; letter-spacing: .12em !important; }
.nav-links a { color: var(--text) !important; }
.nav-cta, .btn-primary { background: var(--text) !important; border-radius: 0 !important; box-shadow: 5px 5px 0 var(--accent) !important; }
.nav-cta:hover, .btn-primary:hover { background: var(--accent) !important; box-shadow: 5px 5px 0 var(--text) !important; }

.hero {
  min-height: calc(100vh - 78px) !important;
  padding: 70px clamp(20px, 7vw, 110px) !important;
  background: transparent !important;
  gap: clamp(40px, 8vw, 120px) !important;
}
.hero-content { max-width: 650px !important; }
.hero-badge, .section-label, .badge {
  color: var(--text) !important;
  background: #f4d66a !important;
  border: 1px solid var(--text) !important;
  border-radius: 0 !important;
  letter-spacing: .12em !important;
}
.hero-badge-dot, .badge-dot { background: var(--accent) !important; }
.hero-title, .section-title, .download-title, .title {
  font-family: "Noto Serif SC", "Songti SC", serif !important;
  color: var(--text) !important;
  letter-spacing: -.04em !important;
}
.hero-title { font-size: clamp(48px, 7vw, 88px) !important; line-height: 1.02 !important; }
.hero-title span, .download-title span, .title span { color: var(--accent) !important; font-style: italic; }
.hero-desc, .section-desc, .desc { color: var(--text-sec) !important; }
.btn-outline { border: 2px solid var(--text) !important; border-radius: 0 !important; background: #fffdf7 !important; }

.phone-mockup {
  background: var(--text) !important;
  border: 2px solid var(--text) !important;
  border-radius: 150px 150px 18px 18px !important;
  box-shadow: 18px 18px 0 #f4d66a !important;
  transform: rotate(4deg) !important;
}
.phone-screen { background: linear-gradient(180deg,#ed6a3a 0 30%,#e8e1d3 30%) !important; }
.phone-messages { background: #e8e1d3 !important; }
.msg-out .msg-bubble, .phone-send-btn { background: var(--text) !important; }
.float-badge { border: 1px solid var(--text) !important; border-radius: 0 !important; box-shadow: 6px 6px 0 rgba(23,63,54,.22) !important; }

.stats { background: var(--text) !important; border: 0 !important; padding: 38px 5vw !important; }
.stat-number { color: #f4d66a !important; font-size: clamp(20px,2.4vw,32px) !important; }
.stat-label { color: #d9e2dd !important; }
.section { padding: 110px clamp(20px, 6vw, 90px) !important; }
.features { background: #fffdf7 !important; border-bottom: 2px solid var(--text); }
.features-grid { gap: 0 !important; border: 2px solid var(--text); max-width: 1180px !important; }
.feature-card {
  background: transparent !important; border: 0 !important; border-right: 1px solid var(--text) !important;
  border-bottom: 1px solid var(--text) !important; border-radius: 0 !important; box-shadow: none !important;
}
.feature-card:hover { background: #f4d66a !important; transform: none !important; }
.feature-icon { color: var(--text) !important; background: transparent !important; border: 1px solid var(--text); border-radius: 50% !important; }
.feature-title, .step-title, .security-point-title { color: var(--text) !important; }
.feature-desc, .step-desc, .security-point-desc { color: var(--text-sec) !important; }
.how { background: #f4d66a !important; }
.how-card { border: 2px solid var(--text) !important; border-radius: 0 !important; box-shadow: 12px 12px 0 var(--accent) !important; background: #fffdf7 !important; }
.how-card-avatar, .how-card-btn, .step-num { background: var(--text) !important; border-radius: 0 !important; }
.invite-code-box { background: #e6efe9 !important; border: 1px dashed var(--text) !important; border-radius: 0 !important; }
.security { background: var(--accent) !important; }
.security .section-label { background: #fffdf7 !important; }
.security .section-title, .security .section-desc, .security-point-title, .security-point-desc { color: #fffdf7 !important; }
.security-point-icon { background: transparent !important; color: #fffdf7 !important; border: 1px solid #fffdf7; border-radius: 50% !important; }
.security-shield { background: #f4d66a !important; border: 2px solid var(--text) !important; box-shadow: 14px 14px 0 var(--text) !important; }
.security-shield-icon { color: var(--text) !important; }
.download { background: #fffdf7 !important; color: var(--text) !important; }
.download-desc, .download-search-hint { color: var(--text-sec) !important; }
.store-btn { background: var(--text) !important; border: 2px solid var(--text) !important; border-radius: 0 !important; }
.store-btn:last-of-type { background: var(--accent) !important; }
.search-pill { background: #f4d66a !important; color: var(--text) !important; border: 1px solid var(--text); }
footer { background: var(--text) !important; }

/* Support page */
.wrap { padding: 56px 20px 72px !important; }
.container { max-width: 1120px !important; }
.wrap .hero { min-height: auto !important; display: block !important; padding: 64px !important; border: 2px solid var(--text) !important; border-radius: 0 !important; box-shadow: 12px 12px 0 #f4d66a !important; background: #fffdf7 !important; }
.wrap .hero::after { display: none !important; }
.grid { gap: 32px !important; }
.card { background: #fffdf7 !important; border: 2px solid var(--text) !important; border-radius: 0 !important; box-shadow: none !important; }
.item, .contact-chip { background: #e6efe9 !important; border: 1px solid var(--text) !important; border-radius: 0 !important; }
.item strong, .contact-value, .tips strong { color: var(--text) !important; }
.card p, .card li { color: var(--text-sec) !important; }
.contact-icon { background: var(--accent) !important; color: white !important; border-radius: 50% !important; }
.tips { background: #f4d66a !important; border: 1px solid var(--text) !important; border-radius: 0 !important; }
.footer { color: var(--text-sec) !important; }

@media (max-width: 768px) {
  nav { height: 66px !important; }
  .nav-links { display: none !important; }
  .hero { flex-direction: column !important; padding: 54px 20px 70px !important; }
  .hero-visual { transform: scale(.76) !important; margin: -20px 0 -70px !important; }
  .stats { display: grid !important; grid-template-columns: 1fr 1fr; }
  .features-grid { grid-template-columns: 1fr !important; }
  .section { padding: 76px 20px !important; }
  .wrap .hero { padding: 36px 24px !important; }
  .grid { grid-template-columns: 1fr !important; }
}
