/* RAM Blog V2 — the only blog stylesheet. Content: four public classes only. */
body.ramv2.ram-blog-page { background: #07111f; }
.ram-blog, .ram-blog *, .ram-blog *::before, .ram-blog *::after { box-sizing: border-box; }
.ram-blog { width: 100%; color: #1f2a37; font-family: 'Source Sans 3', sans-serif; font-size: 18px; line-height: 1.65; padding: 0 24px 64px; }
.ram-blog a { color: #165f91; text-underline-offset: 4px; }
.ram-blog a:hover { color: #0b1726; text-decoration: underline; }
.ram-blog a:focus-visible, .ram-blog summary:focus-visible { outline: 3px solid #1c6fa8; outline-offset: 5px; }
.ram-blog h1, .ram-blog h2, .ram-blog h3 { color: #0b1726; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 0; text-transform: none !important; }
.ram-blog h1 { margin: 12px 0 24px; font-size: clamp(32px, 3.2vw, 46px); line-height: 1.17; }
.ram-blog h2 { font-size: 30px; line-height: 1.25; }
.ram-blog h3 { font-size: 23px; line-height: 1.35; }
.ram-blog-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px 12px; max-width: 1180px; margin: 0 auto; padding: 20px 0; color: #b6c6d8; font-size: 14px; }
.ram-blog-breadcrumb a { color: #e8eef5; text-decoration: none; }
.ram-blog-breadcrumb a:hover { color: #f2c200; }
.ram-blog-surface { max-width: 1180px; margin: 0 auto; background: #fff; border-radius: 16px; overflow: hidden; border-top: 4px solid #f2c200; }
.ram-blog-heading, .ram-blog-index-heading { padding: 48px 32px 30px; max-width: 804px; margin: 0 auto; }
.ram-blog-eyebrow { margin: 0 0 10px; color: #526375; font-size: 13px; font-weight: 700; letter-spacing: 1.1px; text-transform: uppercase; }
.ram-blog-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; font-size: 14px; color: #526375; line-height: 1.5; }
.ram-blog-meta a { color: #165f91; font-weight: 600; }
.ram-blog-cover { max-width: 100%; margin: 0 40px 38px; background: #f2f5f8; border-radius: 12px; overflow: hidden; }
.ram-blog-cover img { display: block; width: 100%; height: auto; max-height: 480px; object-fit: contain; }
.ram-blog-content { width: calc(100% - 64px); max-width: 740px; margin: 0 auto; padding-bottom: 48px; overflow-wrap: anywhere; }
.ram-blog-content > :first-child { margin-top: 0; }
.ram-blog-content h2 { margin: 44px 0 18px; scroll-margin-top: 24px; }
.ram-blog-content h3 { margin: 30px 0 14px; }
.ram-blog-content p { margin: 0 0 20px; }
.ram-blog-content ul, .ram-blog-content ol { margin: 0 0 24px; padding-left: 26px; }
.ram-blog-content li { margin: 9px 0; padding-left: 3px; }
.ram-blog-content li > p { margin: 0; }
.ram-blog-content li::marker { color: #526375; font-weight: 600; }
.ram-blog-content strong { font-weight: 700; }
.ram-blog-content figure { margin: 28px 0; }
.ram-blog-content img { max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: 8px; max-height: 340px; object-fit: contain; }
.ram-blog-content figcaption { margin-top: 10px; font-size: 15px; color: #526375; text-align: center; }
.ram-blog-content table { display: block; max-width: 100%; width: 100%; overflow-x: auto; border-collapse: collapse; margin: 24px 0; font-size: 16px; line-height: 1.5; border: 1px solid #dce4eb; -webkit-overflow-scrolling: touch; }
.ram-blog-content caption { text-align: left; padding: 12px; font-weight: 700; }
.ram-blog-content th, .ram-blog-content td { padding: 12px 14px; text-align: left; vertical-align: top; border: 1px solid #dce4eb; min-width: 100px; }
.ram-blog-content th { background: #0b1726; color: #fff; font-weight: 600; }
.ram-blog-content tbody tr:nth-child(even) { background: #f4f7fa; }
.ram-blog-content blockquote { margin: 28px 0; padding: 22px 26px; border-left: 4px solid #f2c200; background: #f6f8fa; }
.ram-blog-content blockquote cite { display: block; color: #526375; font-size: 15px; font-style: normal; }
.ram-blog-content code { padding: 2px 6px; background: #eaf0f5; border-radius: 4px; font-size: .88em; color: #163a57; }
.ram-blog-content hr { border: 0; border-top: 1px solid #dce4eb; margin: 32px 0; }
.ram-blog-content .ram-lead { font-size: 22px; line-height: 1.55; color: #273e53; margin-bottom: 30px; }
.ram-blog-content .ram-callout { margin: 26px 0; padding: 22px 24px; background: #f2f6fa; border: 1px solid #dce4eb; border-left: 4px solid #1c6fa8; border-radius: 0 8px 8px 0; }
.ram-blog-content .ram-callout > :last-child { margin-bottom: 0; }
.ram-blog-content .ram-faq { margin: 24px 0 36px; }
.ram-blog-content .ram-faq details { border-bottom: 1px solid #dce4eb; padding: 0; }
.ram-blog-content .ram-faq details:first-of-type { border-top: 1px solid #dce4eb; }
.ram-blog-content .ram-faq summary { padding: 20px 6px; cursor: pointer; color: #0b1726; font-weight: 700; line-height: 1.5; }
.ram-blog-content .ram-faq summary::marker { color: #1c6fa8; }
.ram-blog-content .ram-faq details[open] { background: #f6f8fa; }
.ram-blog-content .ram-faq details > :not(summary) { margin-left: 22px; margin-right: 18px; }
.ram-blog-content .ram-cta { margin: 36px 0 0; padding: 28px; background: #0b1726; border-top: 4px solid #f2c200; border-radius: 10px; color: #e8eef5; }
.ram-blog-content .ram-cta h2, .ram-blog-content .ram-cta h3 { color: #fff; margin-top: 0; }
.ram-blog-content .ram-cta a { display: inline-block; background: #f2c200; color: #0b1726; font-weight: 700; padding: 12px 20px; margin: 4px 0 12px; border-radius: 6px; text-decoration: none; line-height: 1.4; }
.ram-blog-content .ram-cta a:hover { background: #ffda35; }
.ram-blog-content .ram-cta > :last-child { margin-bottom: 0; }
.ram-blog-content .ram-cta code { background: transparent; color: inherit; }
.ram-blog-related { padding: 36px 40px 40px; border-top: 1px solid #dce4eb; background: #f5f7fa; }
.ram-blog-section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.ram-blog-section-head h2 { margin: 0; }
.ram-blog-section-head > a { font-size: 15px; font-weight: 600; max-width: 340px; }
.ram-blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ram-blog-card { border: 1px solid #dce4eb; border-radius: 10px; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.ram-blog-card-image { display: block; aspect-ratio: 1200 / 630; overflow: hidden; background: #eaf0f5; }
.ram-blog-card-image img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ram-blog-card-image:hover img { transform: none; }
.ram-blog-no-image { display: grid; height: 100%; place-items: center; color: #526375; font-weight: 700; font-size: 15px; }
.ram-blog-card-copy { padding: 22px; display: flex; flex-direction: column; flex: 1; }
.ram-blog-card .ram-blog-meta { font-size: 12px; gap: 5px 10px; }
.ram-blog-card h3 { margin: 14px 0 12px; font-size: 23px; }
.ram-blog-card h3 a { color: #0b1726; text-decoration: none; }
.ram-blog-card p { font-size: 16px; line-height: 1.6; margin: 0 0 20px; }
.ram-blog-read { font-size: 15px; font-weight: 700; margin-top: auto; }
.ram-blog-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.ram-blog-product { padding: 16px; background: #fff; border: 1px solid #dce4eb; border-radius: 10px; }
.ram-blog-product > a { display: flex; height: 100%; flex-direction: column; text-decoration: none; }
.ram-blog-product img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.ram-blog-product h3 { font-size: 20px; margin: 18px 0; }
.ram-blog-index-heading { max-width: none; padding: 44px 40px 24px; }
.ram-blog-index-heading h1 { margin-bottom: 18px; }
.ram-blog-index-heading > p:last-child { max-width: 740px; margin: 0; color: #526375; }
.ram-blog-categories { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 40px; padding: 0 0 30px; border-bottom: 1px solid #dce4eb; }
.ram-blog-categories a { font-size: 15px; font-weight: 600; padding: 9px 15px; border: 1px solid #ced9e3; border-radius: 6px; text-decoration: none; }
.ram-blog-categories a[aria-current], .ram-blog-categories a:hover { background: #0b1726; border-color: #0b1726; color: #fff; }
.ram-blog-list { padding: 32px 40px 48px; }
.ram-blog-pagination { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.ram-blog-pagination .page-numbers { padding: 8px 14px; border: 1px solid #ced9e3; border-radius: 5px; }
.ram-blog-pagination .current { background: #0b1726; color: #fff; }
.ram-blog .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
  .ram-blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ram-blog-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ram-blog { padding: 0 12px 32px; font-size: 17px; }
  .ram-blog-breadcrumb { padding: 15px 4px; font-size: 13px; }
  .ram-blog-surface { border-radius: 10px; }
  .ram-blog-heading, .ram-blog-index-heading { padding: 28px 20px 24px; }
  .ram-blog h1 { font-size: 32px; line-height: 1.2; margin: 10px 0 20px; }
  .ram-blog h2 { font-size: 27px; }
  .ram-blog h3 { font-size: 22px; }
  .ram-blog-eyebrow { font-size: 11px; letter-spacing: .8px; }
  .ram-blog-meta { font-size: 13px; gap: 7px 13px; }
  .ram-blog-cover { margin: 0 12px 28px; border-radius: 6px; }
  .ram-blog-content { width: calc(100% - 40px); padding-bottom: 32px; }
  .ram-blog-content .ram-lead { font-size: 20px; }
  .ram-blog-content .ram-callout, .ram-blog-content blockquote { padding: 18px; }
  .ram-blog-content .ram-cta { padding: 22px 18px; }
  .ram-blog-content table { font-size: 14px; }
  .ram-blog-content th, .ram-blog-content td { padding: 10px; }
  .ram-blog-content h2 { margin-top: 34px; }
  .ram-blog-section-head { align-items: start; flex-direction: column; gap: 12px; }
  .ram-blog-related { padding: 28px 20px; }
  .ram-blog-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ram-blog-product-grid { gap: 12px; }
  .ram-blog-product { padding: 12px; }
  .ram-blog-product h3 { font-size: 18px; }
  .ram-blog-categories { margin: 0 20px; padding-bottom: 24px; gap: 8px; }
  .ram-blog-categories a { font-size: 14px; padding: 9px 11px; }
  .ram-blog-list { padding: 24px 20px 32px; }
  .ram-blog-card-copy { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) { .ram-blog * { transition: none !important; } }
