/* Mini-blog « Guides pour hôtes » : lecture confortable, habillage de l'offre (jetons de landing.css). */
.rental-blog main { padding-bottom: var(--space-8); }
main .blog-article,main .blog-index { max-width: 760px; margin: 0 auto; padding: var(--space-7) 0 var(--space-6); }
main .blog-article header h1,main .blog-index h1 { font-size: clamp(32px, 5.2vw, 48px); line-height: 1.1; max-width: 18ch; margin: 0 0 var(--space-5); }
main .blog-article header .offer-eyebrow a { text-decoration: none; }
main .blog-lede { font-size: 19px; line-height: 1.55; color: var(--ink); max-width: 60ch; margin: 0 0 var(--space-5); }
main .blog-meta { font-size: 13px; color: var(--ink-muted); margin: 0; }
main .blog-body { margin-top: var(--space-6); }
main .blog-body > :first-child { margin-top: 0; }
main .blog-body h2 { font-size: clamp(24px, 3.4vw, 30px); line-height: 1.2; margin: var(--space-7) 0 16px; letter-spacing: -.02em; }
main .blog-body h3 { font-size: 20px; margin: var(--space-6) 0 12px; }
main .blog-body p,main .blog-body li { font-size: 17px; line-height: 1.7; max-width: 68ch; }
main .blog-body p { margin: 0 0 16px; }
main .blog-body ul,main .blog-body ol { margin: 0 0 var(--space-5); padding-left: 1.3em; }
main .blog-body li { margin-bottom: 12px; }
main .blog-body li::marker { color: var(--petrol); }
main .blog-body a { color: var(--petrol); text-decoration: underline; text-underline-offset: 3px; }
main .blog-body blockquote { margin: var(--space-5) 0; padding: var(--space-5) var(--space-6); background: var(--paper); border-left: 3px solid var(--petrol); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
main .blog-body blockquote p { margin: 0; font-size: 16px; }
main .blog-body code { font: 14px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; background: var(--paper); padding: 2px 6px; border-radius: 4px; }
main .blog-body pre { margin: var(--space-5) 0; padding: var(--space-5); background: var(--paper); border: 1px solid var(--rule); color: var(--ink); border-radius: var(--radius-md); overflow-x: auto; }
main .blog-body pre code { background: none; padding: 0; color: inherit; font-size: 14px; }
main .blog-offer { margin: var(--space-7) 0; padding: var(--space-6); background: var(--mineral); border-radius: var(--radius-xl); }
main .blog-offer h2 { margin: 0 0 12px; font-size: 28px; }
main .blog-offer p { margin: 0 0 16px; max-width: 56ch; }
main .blog-offer-price { font-size: 15px; }
main .blog-offer-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); }
main .blog-offer-actions a:not(.button) { text-decoration: underline; text-underline-offset: 3px; }
main .blog-more { margin-top: var(--space-7); padding-top: var(--space-6); border-top: 1px solid var(--rule); }
main .blog-more h2 { font-size: 20px; margin: 0 0 16px; }
main .blog-more ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
main .blog-more a { text-decoration: underline; text-underline-offset: 3px; }
main .blog-cards { list-style: none; margin: var(--space-7) 0 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--rule); }
main .blog-cards li { border-bottom: 1px solid var(--rule); }
main .blog-cards a { display: grid; gap: 6px; padding: var(--space-5) 0; text-decoration: none; }
main .blog-cards strong { font: 550 22px/1.25 var(--font-display); letter-spacing: -.02em; }
main .blog-cards a:hover strong { color: var(--petrol); }
main .blog-cards span:not(.blog-meta) { color: var(--ink-muted); max-width: 60ch; }
main .blog-teaser-list { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
main .blog-teaser-list a { display: grid; gap: 8px; height: 100%; padding: var(--space-5); background: var(--paper); border-radius: var(--radius-md); text-decoration: none; }
main .blog-teaser-list strong { font: 550 18px/1.3 var(--font-display); }
main .blog-teaser-list span { font-size: 14px; color: var(--ink-muted); }
@media (max-width: 760px) {
  main .blog-article,main .blog-index { padding-top: var(--space-6); }
  main .blog-body p,main .blog-body li { font-size: 16px; }
  main .blog-offer { padding: var(--space-5); border-radius: var(--radius-lg, 20px); }
  main .blog-teaser-list { grid-template-columns: 1fr; }
}
