/* ============================================================
   SmartRevIQ — shared stylesheet (single source of truth)
   Linked on every page, after the theme styles.
   Update design tokens / components HERE once → applies site-wide.
   New sections should use these CSS variables and .srq-* classes
   so styling stays consistent across pages and future updates.
   ============================================================ */

:root{
  /* Brand colors */
  --srq-teal:#1990BE;        /* primary brand teal */
  --srq-teal-hover:#0069aa;
  --srq-teal-deep:#0d3a4a;   /* dark bands */
  --srq-gold:#FECD29;        /* accent (logo gold) */
  --srq-ink:#002e5b;         /* headings on light */
  --srq-text:#444;           /* body text */
  --srq-muted:#8a9097;       /* captions/footnotes */
  --srq-soft:#eef3f5;        /* soft light band */
  --srq-card:#fbfbfb;        /* card surface */
  --srq-border:#e3e3e3;

  /* Typography */
  --srq-font:'Segoe UI', system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
  --srq-font-head: Poppins, var(--srq-font);
}

/* Consistent body font on every page (headings keep Poppins from the theme) */
body{ font-family: var(--srq-font); }

/* ---- Reusable section + component classes (use these in new content) ---- */
.srq-section{ padding:60px 11%; }
@media (max-width:768px){ .srq-section{ padding:46px 6%; } }
.srq-section h2{ color:var(--srq-ink); font-size:2rem; text-wrap:balance; }
.srq-section p{ text-wrap:pretty; }

/* Bands */
.srq-band-teal{ background:var(--srq-teal); color:#fff; }
.srq-band-teal h2{ color:#fff; }
.srq-band-deep{ background:var(--srq-teal-deep); color:#fff; }
.srq-band-deep h2{ color:#fff; }
.srq-band-soft{ background:var(--srq-soft); }

/* Buttons */
.srq-btn{ display:inline-block; margin:6px; padding:13px 26px; border:2px solid #fff; border-radius:28px;
  color:#fff; text-decoration:none; font-weight:600; letter-spacing:.04em; transition:background .25s,color .25s; }
.srq-btn:hover{ background:#fff; color:var(--srq-teal-hover); }
.srq-btn--solid{ background:#fff; color:var(--srq-teal-hover); }
.srq-btn--solid:hover{ background:var(--srq-soft); color:var(--srq-teal-hover); }
.srq-btn--teal{ background:var(--srq-teal); border-color:var(--srq-teal); color:#fff; }
.srq-btn--teal:hover{ background:var(--srq-teal-hover); border-color:var(--srq-teal-hover); color:#fff; }

/* Cards */
.srq-card{ text-align:left; padding:24px; border:1px solid var(--srq-border); border-radius:12px; background:var(--srq-card); }
.srq-card h3{ color:var(--srq-teal); font-size:1.1rem; margin:0 0 8px; }
.srq-card p{ color:var(--srq-text); font-size:.97rem; line-height:1.55; margin:0; }

/* Grid helper */
.srq-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px; max-width:1100px; margin:0 auto; }
@media (min-width:992px){ .srq-grid.is-3{ grid-template-columns:repeat(3,1fr);} .srq-grid.is-4{ grid-template-columns:repeat(4,1fr);} }
