.tips-index-main, .tip-detail-main { min-height: 70vh; background: #fffdf7; }
.tips-index-hero { padding: 88px 0 64px; text-align: center; background: radial-gradient(circle at 20% 15%, #f4e6bd, transparent 30%), linear-gradient(145deg, #eef3e8, #fffaf0); }
.tips-index-hero h1 { margin: 8px 0 16px; font: 700 clamp(2.5rem, 7vw, 5rem)/1 Fraunces, serif; color: #244d33; }
.tips-index-hero p:last-child { max-width: 680px; margin: 0 auto; color: #455b49; font-size: 1.08rem; line-height: 1.7; }
.tips-pagination { display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 40px; }
.tips-pagination span { min-width: 120px; text-align: center; color: #455b49; }
.tips-pagination button:disabled { opacity: .45; cursor: not-allowed; }
.tip-detail-main { padding: 48px 0 96px; }
.tip-back { display: inline-flex; min-height: 44px; align-items: center; color: #315f3f; font-weight: 800; }
.tip-article { max-width: 820px; }
.tip-article-header { margin: 36px 0 40px; text-align: center; }
.tip-article-header time { color: #617065; }
.tip-article-header h1 { margin: 12px auto 16px; font: 700 clamp(2.25rem, 6vw, 4.4rem)/1.08 Fraunces, serif; color: #244d33; }
.tip-article-lead { max-width: 700px; margin: 0 auto; color: #4d6051; font-size: 1.12rem; line-height: 1.7; }
.tip-cover { width: 100%; max-height: 520px; margin-bottom: 48px; border-radius: 24px; object-fit: cover; box-shadow: 0 18px 42px rgba(32, 67, 43, .13); }
.tip-body { max-width: 72ch; margin: 0 auto; color: #29392d; font-size: 1.06rem; line-height: 1.78; }
.tip-body h2, .tip-body h3 { margin: 2em 0 .65em; font-family: Fraunces, serif; color: #244d33; line-height: 1.2; }
.tip-body h2 { font-size: 2rem; }.tip-body h3 { font-size: 1.45rem; }
.tip-body p, .tip-body ul, .tip-body ol, .tip-body blockquote { margin: 0 0 1.35em; }
.tip-body blockquote { padding: 18px 24px; border-left: 4px solid #b6802f; background: #f7f2e8; font-family: Fraunces, serif; font-size: 1.15rem; }
.tip-body img { display: block; max-width: 100%; height: auto; margin: 32px auto; border-radius: 18px; }
.tip-body a { color: #1d6640; text-decoration: underline; text-underline-offset: 3px; }
.tip-error { padding: 80px 0; text-align: center; }
@media (max-width: 720px) {
  .tips-index-hero { padding: 56px 0 44px; }
  .tip-detail-main { padding-top: 24px; }
  .tip-cover { margin-bottom: 32px; border-radius: 16px; }
  .tips-pagination { gap: 8px; }.tips-pagination span { min-width: 90px; }
}

