/* ============================================================
   seo.css — presentation only.

   Heading levels on this site are now chosen for document
   structure, never for size. These rules keep the previous
   appearance while the tag underneath changes, so nothing in
   the visual design moves.
   ============================================================ */

/* ---------------------------------------- h4-sized headings */
.h4-like{
  font-family:var(--font-ui);
  font-weight:600;
  font-size:1.08rem;
  line-height:1.35;
  color:var(--primary);
  margin:0 0 .6em;
}
.section-dark .h4-like{color:#fff}
.card h3.h4-like,.card h2.h4-like{margin-bottom:.5rem}
.step h3.h4-like{margin-bottom:.4rem}

/* --------------------------------- h3-sized service headings */
.card h2.card-h{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.15rem,1.7vw,1.4rem);
  line-height:1.25;
  color:var(--primary);
  margin:0 0 .5rem;
}
.card h2.card-h a{color:var(--primary)}
.card h2.card-h a:hover{color:var(--cta-hover)}

/* ------------------------------------ blog card headings (h2) */
.bcard-body h2{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.08rem;
  line-height:1.25;
  color:var(--primary);
  margin:0 0 .45rem;
}
.bcard-body h2 a{color:var(--primary)}
.bcard-body h2 a:hover{color:var(--cta-hover)}

/* --------------------------------------- callout / lead cards */
.callout h2{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1rem;
  line-height:1.3;
  margin:0 0 .6em;
  color:var(--primary-dark);
}
.callout-danger h2{color:#991B1B}
.inquiry-head h2{
  font-family:var(--font-display);
  font-weight:700;
  color:#fff;
  margin:0;
  font-size:1.22rem;
  line-height:1.25;
}

/* ------------------------------------------- footer headings */
.main-footer h2.f-head{
  font-family:var(--font-ui);
  font-weight:600;
  color:#fff;
  font-size:.86rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  line-height:1.35;
  margin:0 0 18px;
  position:relative;
  padding-bottom:10px;
}
.main-footer h2.f-head::after{
  content:"";position:absolute;left:0;bottom:0;
  width:34px;height:2px;background:var(--cta);
}

/* ------------------------------- subtitle following an <h1> */
.page-hero-sub[role="doc-subtitle"],
[role="doc-subtitle"]{font-style:normal}

/* -------------------------------------------- abbreviations */
abbr[title]{
  text-decoration:none;
  border-bottom:1px dotted currentColor;
  cursor:help;
}
.brand-sub abbr[title],
.risk-bar abbr[title],
.f-reg abbr[title],
.hero-badge abbr[title],
.ticker-track abbr[title]{border-bottom:0;cursor:inherit}

/* --------------------------------------------- <address> blocks */
address{font-style:normal;margin:0 0 1rem}
address.f-addr{margin:0;display:inline}

/* ---------------------------------------- data-table captions */
.table-wrap caption,
table.table-basic caption,
table.price-table caption{
  caption-side:top;
  text-align:left;
  font-size:.82rem;
  color:var(--muted,#64748B);
  padding:0 0 8px;
}

/* --------------------------- visually hidden, still announced */
.vh{
  position:absolute!important;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ------------------------------------------ insights search box */
.blog-search{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin-top:18px;max-width:520px;
}
.blog-search label{
  flex:0 0 100%;
  font-family:var(--font-ui);font-size:.78rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.72);
}
.blog-search input[type=search]{
  flex:1 1 220px;min-width:0;
  padding:10px 14px;border-radius:var(--r-sm);
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);color:#fff;
  font-family:var(--font-ui);font-size:.9rem;
}
.blog-search input[type=search]::placeholder{color:rgba(255,255,255,.5)}
.blog-search input[type=search]:focus{
  outline:none;border-color:var(--cta);background:rgba(255,255,255,.13);
}
.blog-search .btn{flex:0 0 auto}

/* An uploaded logo replaces the icon + wordmark; keep it inside the header. */
.brand .brand-logo{height:46px;width:auto;max-width:210px;object-fit:contain}
.f-brand .brand-logo{height:42px;width:auto;max-width:190px;object-fit:contain}
@media (max-width:991px){ .brand .brand-logo{height:38px;max-width:160px} }

/* The footer shows the Footer logo from Settings → Identity. If that field is
   empty the website logo stands in, and when it is too dark for the deep-blue
   footer it is placed on a light plate so it cannot disappear. */
.f-brand .brand-logo.on-dark-plate{background:#fff;border-radius:9px;padding:7px 11px;max-width:200px}
.f-brand .brand-logo.on-dark{background:none;padding:0}
