/* ============================================================
   cms.css  —  styling for CMS pages (page.php) and rate widgets
   ============================================================ */

.cms-page { padding-top: 110px; padding-bottom: 60px; }
.cms-h1 { font-size: 34px; font-weight: 700; color: #0d264c; margin-bottom: 18px; }

/* ---- full-bleed jumbotron hero (every content page) ----
   Same pattern as the landing page: a full-width .container-fluid band (edge to
   edge, no gutter) carrying the background image, with an inner .container that
   centers the content. Top padding clears the fixed-top navbar (~110px).
   Headline sizes match the landing jumbotron's headline-1 / headline-2. */
.cms-hero {
  width: 100%;
  margin: 0;
  padding: 150px 15px 55px;
  background: #0d264c url("/ggr-hero-background.jpg") center center / cover no-repeat;
  text-align: center;
  color: #fff;
}
.cms-hero__title { font-size: 50px; font-weight: 700; color: #fff; margin: 0 0 14px; line-height: 1.12; }
.cms-hero__subtitle { font-size: 25px; font-weight: 400; color: #fff; margin: 0 auto; max-width: 820px; opacity: .95; }
.cms-hero__form { margin-top: 28px; }
/* Hero already clears the navbar, so the body no longer needs the big top gap. */
.cms-page--has-hero { padding-top: 40px; }
.cms-main { font-size: 16px; line-height: 1.65; color: #2b3a4d; }
.cms-main h2 { font-size: 24px; font-weight: 700; color: #0d264c; margin: 28px 0 12px; }
.cms-main h3 { font-size: 19px; font-weight: 600; color: #0d264c; margin: 22px 0 10px; }
.cms-main p { margin: 0 0 16px; }
.cms-main ul, .cms-main ol { margin: 0 0 16px 20px; }
.cms-main a { color: #0066FF; }

.cms-aside { font-size: 14px; }
.cms-aux { margin-top: 30px; }

/* ---- left sidebar: sticky table of contents ---- */
.cms-toc { position: sticky; top: 120px; border-left: 3px solid #e3e8ee; padding: 2px 0 2px 15px; margin-bottom: 26px; }
.cms-toc__title { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #8a97a8; font-weight: 700; margin-bottom: 12px; }
.cms-toc__list { list-style: none; margin: 0; padding: 0; }
.cms-toc__item { margin: 0 0 9px; line-height: 1.35; }
.cms-toc__item a { color: #2b3a4d; text-decoration: none; }
.cms-toc__item a:hover { color: #0066FF; }
.cms-toc__l3 { padding-left: 14px; font-size: 13px; }
/* anchor targets clear the fixed navbar when jumped to */
.cms-main h2, .cms-main h3 { scroll-margin-top: 90px; }

.cms-404 { padding: 80px 0; text-align: center; }
.cms-404 h1 { color: #0d264c; }

/* ---- rate-table widget ---- */
.rt-widget { background: #fff; border: 1px solid #e3e8ee; border-radius: 12px; padding: 18px 20px;
  margin: 22px 0; box-shadow: 0 2px 8px rgba(13,38,76,.05); }
.rt-heading { font-size: 18px; font-weight: 700; color: #0d264c; margin: 0 0 12px; }
.rt-intro { font-size: 14px; color: #516072; margin: -6px 0 12px; }

.rt-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.rt-table thead th { text-align: left; font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
  color: #8a97a8; font-weight: 600; padding: 0 10px 10px; border-bottom: 2px solid #eef1f6; }
.rt-table tbody td { padding: 14px 10px; border-bottom: 1px solid #eef1f6; vertical-align: middle; color: #2b3a4d; }
.rt-table tbody tr:last-child td { border-bottom: 0; }

.rt-prov { min-width: 170px; }
.rt-logo { width: 26px; height: 26px; object-fit: contain; border-radius: 5px; margin-right: 8px; vertical-align: middle; }
.rt-name { font-weight: 600; color: #0d264c; }
.rt-unit { font-size: 11px; color: #8a97a8; margin-left: 1px; }
.rt-feat { font-size: 13px; color: #516072; max-width: 240px; }
/* Plan-level table (product_plans): dollar rate and monthly service charge. */
.rt-rate { font-weight: 700; color: #0d264c; }
.rt-free { color: #1a9e6b; font-weight: 600; }

.rt-cta { text-align: right; white-space: nowrap; }
/* `.cms-main a` (0,1,1) outranks a bare `.rt-btn` (0,1,0), which painted the
   label #0066FF on the #0066FF button -- invisible. Match that specificity so
   the white label wins inside article content as well as outside it. */
.rt-btn,
.cms-main a.rt-btn { display: inline-block; background: #0066FF; color: #fff; border-radius: 8px;
  padding: 8px 16px; font-weight: 600; font-size: 13px; text-decoration: none; }
.rt-btn:hover,
.cms-main a.rt-btn:hover { background: #0052cc; color: #fff; text-decoration: none; }

.rt-note { font-size: 12px; color: #8a97a8; margin: 14px 0 0; }
.rt-empty { background: #f8fafc; border: 1px dashed #cdd6e2; border-radius: 10px; padding: 24px;
  text-align: center; color: #8a97a8; margin: 22px 0; }

@media (max-width: 767px) {
  .cms-page { padding-top: 90px; }
  .cms-page--has-hero { padding-top: 30px; }
  .cms-hero { padding: 120px 15px 38px; }
  .cms-hero__title { font-size: 30px; }
  .cms-hero__subtitle { font-size: 17px; }
  .rt-feat { display: none; }
  .rt-table thead th.rt-feat { display: none; }
}