/* Conteúdo editorial e comercial exclusivo da página VPS Brasil e seus guias. */
.vps-product-page > main { display: block; }
.vps-product-page .vps-hero h1 { font-size: clamp(2.125rem, 4vw, 3.5rem); line-height: 1.08; text-wrap: balance; }
.vps-product-page .vps-plano-slider-card__head h3 { display: block; margin-top: .25rem; color: #172554; font-size: 2rem; letter-spacing: -.045em; }
.vps-seo-container { width: min(calc(100% - 2.5rem), 1116px); margin-inline: auto; }
.vps-seo-breadcrumb { position: absolute; z-index: 2; top: 9rem; left: max(1.25rem, calc((100% - 1116px) / 2)); display: flex; gap: .65rem; color: #64748B; font-size: .75rem; }
.vps-seo-breadcrumb a { color: #6D28D9; }
.vps-seo-facts .vps-metrica-item__number { font-size: clamp(1.7rem, 3vw, 2.6rem); }
.vps-seo-facts .vps-seo-facts__systems { font-size: clamp(1.3rem, 2vw, 1.8rem); }
.vps-seo-comparison { margin-top: 1.75rem; padding: 1.5rem; border: 1px solid #E2E8F0; border-radius: 1.25rem; background: white; }
.vps-seo-comparison h3 { font-size: 1.15rem; color: #0F172A; }
.vps-seo-comparison__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-top: 1.25rem; }
.vps-seo-comparison h4 { color: #6D28D9; font-size: .95rem; }
.vps-seo-comparison p { color: #64748B; font-size: .875rem; line-height: 1.75; margin-top: .5rem; }
.vps-seo-comparison .vps-seo-help { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid #F1F5F9; }
.vps-seo-help a, .vps-editorial a { color: #6D28D9; text-decoration: underline; text-underline-offset: .18em; }
.vps-seo-testimonial { max-width: 760px; margin: 2rem auto; padding: 1.5rem; text-align: left; border: 1px solid #E9D5FF; border-radius: 1rem; background: white; }
.vps-seo-testimonial blockquote { color: #334155; font-size: 1rem; line-height: 1.8; }
.vps-seo-testimonial figcaption { display: grid; gap: .25rem; margin-top: 1rem; }
.vps-seo-testimonial figcaption strong { color: #0F172A; font-weight: 700 !important; }
.vps-seo-testimonial figcaption span, .vps-seo-testimonial small { color: #64748B; font-size: .8rem; }
.vps-seo-guides { padding: 4.5rem 0; background: #F8FAFC; border-top: 1px solid #E2E8F0; }
.vps-seo-heading { max-width: 720px; margin: 0 auto 2rem; text-align: center; }
.vps-seo-heading > span { color: #7C3AED; font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; }
.vps-seo-heading h2 { margin-top: .75rem; color: #0F172A; font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.15; letter-spacing: -.04em; }
.vps-seo-heading p { margin-top: 1rem; color: #64748B; line-height: 1.7; }
.vps-seo-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.vps-seo-guide-grid article { display: flex; flex-direction: column; align-items: flex-start; padding: 1.5rem; background: white; border: 1px solid #E2E8F0; border-radius: 1.25rem; }
.vps-seo-guide-grid article > span { color: #7C3AED; font-size: .75rem; }
.vps-seo-guide-grid h3 { margin-top: 1rem; color: #0F172A; font-size: 1.15rem; line-height: 1.4; }
.vps-seo-guide-grid p { margin-top: .75rem; margin-bottom: 1.25rem; color: #64748B; font-size: .9rem; line-height: 1.75; }
.vps-seo-text-link { display: inline-flex; align-items: center; gap: .5rem; margin-top: auto; color: #6D28D9; font-size: .85rem; }
.vps-seo-guide-grid a:focus-visible, .vps-editorial a:focus-visible, .vps-seo-breadcrumb a:focus-visible { outline: 2px solid #7C3AED; outline-offset: 4px; border-radius: .2rem; }
.vps-guide-page { background: white; }
.vps-guide-hero { padding: 11rem 0 3rem; background: #F8FAFC; border-bottom: 1px solid #E2E8F0; }
.vps-guide-hero .vps-seo-breadcrumb { position: static; margin-bottom: 1.5rem; flex-wrap: wrap; }
.vps-guide-hero h1 { max-width: 850px; color: #0F172A; font-size: clamp(2rem, 4.2vw, 3.5rem); line-height: 1.1; letter-spacing: -.045em; }
.vps-guide-hero p { max-width: 780px; margin-top: 1.25rem; color: #64748B; font-size: 1.1rem; line-height: 1.8; }
.vps-guide-author { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 1.5rem; color: #64748B; font-size: .8rem; }
.vps-guide-author a { color: #6D28D9; }
.vps-editorial { width: min(100% - 2.5rem, 800px); margin: 3rem auto; color: #475569; font-size: 1rem; line-height: 1.85; }
.vps-editorial section { margin-top: 2.75rem; scroll-margin-top: 8rem; }
.vps-editorial h2 { margin-bottom: 1rem; color: #0F172A; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; letter-spacing: -.025em; }
.vps-editorial h3 { margin: 1.5rem 0 .75rem; color: #0F172A; font-size: 1.15rem; }
.vps-editorial p + p { margin-top: 1rem; }
.vps-editorial ul, .vps-editorial ol { margin: 1rem 0; padding-left: 1.35rem; }
.vps-editorial ul { list-style: disc; }
.vps-editorial ol { list-style: decimal; }
.vps-editorial li + li { margin-top: .5rem; }
.vps-editorial .vps-guide-toc { padding: 1.25rem 1.5rem; background: #FAF5FF; border: 1px solid #E9D5FF; border-radius: 1rem; }
.vps-guide-table-wrap { overflow-x: auto; border: 1px solid #E2E8F0; border-radius: .8rem; }
.vps-editorial table { width: 100%; border-collapse: collapse; font-size: .875rem; line-height: 1.6; }
.vps-editorial th, .vps-editorial td { padding: .9rem 1rem; text-align: left; border-bottom: 1px solid #E2E8F0; vertical-align: top; }
.vps-editorial th { color: #0F172A; background: #F8FAFC; }
.vps-editorial tr:last-child td { border-bottom: 0; }
.vps-guide-cta { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 2rem; }
.vps-guide-cta a, .vps-guide-cta button { display: inline-flex; align-items: center; justify-content: center; padding: .85rem 1.2rem; border: 1px solid #DDD6FE; border-radius: .75rem; color: #6D28D9; background: white; font: inherit; font-size: .9rem; text-decoration: none; cursor: pointer; }
.vps-guide-cta a:first-child { color: white; background: #7C3AED; border-color: #7C3AED; }
@media (max-width: 767px) {
  .vps-seo-guide-grid, .vps-seo-comparison__grid { grid-template-columns: 1fr; }
  .vps-seo-breadcrumb { top: 8.3rem; }
  .vps-seo-comparison { padding: 1.25rem; }
  .vps-guide-hero { padding-top: 9rem; }
  .vps-guide-hero h1 { max-width: 100%; font-size: clamp(1.85rem, 9vw, 2.4rem); overflow-wrap: anywhere; }
}
@media (max-width: 480px) {
  .vps-guide-page .site-header .mac-cta-purple,
  .vps-product-page .site-header .mac-cta-purple { display: none; }
  .vps-guide-page .site-header .nav-floating-bar > div:last-child,
  .vps-product-page .site-header .nav-floating-bar > div:last-child { gap: .5rem; }
}