/* ============================================================
   Penta Solutions LLC - Static site stylesheet
   Converted from the React/Vite/Tailwind source.
   Design tokens mirror the original src/index.css.
============================================================ */

:root {
  --background: #f8fafc;
  --foreground: #0b2b5b;   /* navy text */
  --primary: #0b2b5b;      /* Navy */
  --primary-rgb: 11, 43, 91;
  --secondary: #2a7de1;    /* Accent blue */
  --secondary-rgb: 42, 125, 225;
  --accent: #d4a849;       /* Gold */
  --accent-rgb: 212, 168, 73;
  --muted: #dbe5f0;
  --muted-foreground: #65758b;
  --border: #e1e7ef;
  --card: #ffffff;
  --soft: #f8fafc;
  --soft-2: #f1f5f9;
  --radius: 24px;

  --shadow-sm: 0 2px 4px 0 rgba(var(--primary-rgb), .05);
  --shadow: 0 4px 8px -2px rgba(var(--primary-rgb), .1);
  --shadow-md: 0 8px 16px -4px rgba(var(--primary-rgb), .1);
  --shadow-lg: 0 12px 24px -8px rgba(var(--primary-rgb), .15);
  --shadow-xl: 0 24px 48px -12px rgba(var(--primary-rgb), .2);
  --shadow-2xl: 0 35px 60px -15px rgba(var(--primary-rgb), .3);
}

* { box-sizing: border-box; margin: 0; padding: 0; border-color: var(--border); }

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  background: var(--background);
  color: var(--foreground);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  overflow-x: hidden;
}

::selection { background: rgba(var(--secondary-rgb), .3); }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; }

.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.container-narrow { max-width: 960px; }

/* ---------- Helpers ---------- */
.text-center { text-align: center; }
.relative { position: relative; }
.z10 { position: relative; z-index: 10; }
.mx-auto { margin-left: auto; margin-right: auto; }
.max-w-3xl { max-width: 768px; }
.max-w-2xl { max-width: 672px; }
.max-w-4xl { max-width: 896px; }
.max-w-5xl { max-width: 1024px; }
.max-w-6xl { max-width: 1152px; }
.eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--secondary); margin-bottom: 12px; }
.eyebrow.gold { color: var(--accent); }
.text-gradient {
  background: linear-gradient(90deg, var(--primary), var(--secondary), var(--accent));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.muted { color: var(--muted-foreground); }

/* ---------- Section helpers ---------- */
.section { padding: 96px 0; }
.section-tight { padding: 80px 0; }
.bg-navy { background: var(--primary); color: #fff; }
.bg-white { background: #fff; }
.bg-soft { background: var(--soft-2); }

.section-head { max-width: 768px; margin: 0 auto 64px; text-align: center; }
.section-head h3 { font-size: clamp(28px, 4vw, 40px); font-weight: 700; margin-bottom: 24px; line-height: 1.15; }
.section-head p { font-size: 18px; color: var(--muted-foreground); }
.section-head.on-navy p { color: rgba(255,255,255,.7); }

/* ============================================================
   Buttons
============================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 9999px; font-weight: 600; cursor: pointer; border: 1px solid transparent;
  padding: 10px 24px; font-size: 14px; line-height: 1;
  transition: background-color .25s ease, color .25s ease, box-shadow .3s ease, transform .3s ease;
}
.btn svg { width: 1.1em; height: 1.1em; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: #0a2650; box-shadow: 0 12px 24px -8px rgba(var(--primary-rgb), .35); transform: translateY(-2px); }
.btn-white { background: #fff; color: var(--primary); border-color: var(--border); }
.btn-white:hover { background: rgba(var(--muted-foreground-rgb, 100,117,139), .06); box-shadow: var(--shadow-lg); }
.btn-lg { padding: 16px 32px; font-size: 18px; }
.btn-xl { padding: 20px 40px; font-size: 18px; font-weight: 700; }
.btn-block { width: 100%; }
.btn-ghost-white { background: #fff; color: var(--primary); }
.btn-ghost-white:hover { background: var(--accent); color: var(--primary); box-shadow: 0 12px 24px -8px rgba(var(--accent-rgb), .4); transform: translateY(-4px); }
.btn-accent { background: var(--accent); color: var(--primary); font-weight: 700; }
.btn-accent:hover { background: #fff; }
.link-arrow { display: inline-flex; align-items: center; gap: 4px; color: var(--primary); font-weight: 600; transition: color .25s; }
.link-arrow:hover { color: var(--secondary); }

/* ============================================================
   Top bar + Header / Nav
============================================================ */
.topbar { background: var(--primary); color: #fff; font-size: 13px; padding: 8px 0; position: relative; z-index: 50; }
.topbar .container { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; }
.topbar-left, .topbar-right { display: flex; align-items: center; gap: 16px; }
.topbar a, .topbar span { display: inline-flex; align-items: center; gap: 6px; }
.topbar a { transition: color .2s; }
.topbar a:hover { color: var(--accent); }
.topbar svg { width: 14px; height: 14px; }
.hipaa-pill { color: var(--accent); font-weight: 600; background: rgba(255,255,255,.1); padding: 2px 10px; border-radius: 9999px; }
.topbar-addr { opacity: .9; }

.site-header {
  position: sticky; top: 0; z-index: 40;
  background: rgba(255,255,255,.8); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(var(--secondary-rgb), .08);
  padding: 20px 0; transition: padding .3s ease, box-shadow .3s ease, background .3s ease;
}
.site-header.scrolled { padding: 12px 0; background: rgba(255,255,255,.7); backdrop-filter: blur(16px); box-shadow: var(--shadow-md); border-bottom-color: rgba(255,255,255,.3); }
.site-header .container { display: flex; align-items: center; justify-content: space-between; }
.brand img { height: 48px; width: auto; }
.site-header.scrolled .brand img { height: 40px; }

.main-nav { display: flex; align-items: center; gap: 4px; }
.nav-item { position: relative; }
.nav-link {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 12px; border-radius: 6px; font-weight: 500; font-size: 14px;
  color: rgba(var(--primary-rgb), .82); transition: color .2s, background .2s;
}
.nav-link:hover { color: var(--primary); background: rgba(var(--muted-foreground-rgb, 100,117,139), .08); }
.nav-link.active { color: var(--secondary); font-weight: 600; }
.nav-link .chev { width: 14px; height: 14px; opacity: .5; transition: transform .2s; }
.nav-item:hover .nav-link .chev { transform: rotate(180deg); }

.dropdown {
  position: absolute; top: 100%; left: 0; padding-top: 8px; width: 256px; z-index: 50;
  opacity: 0; transform: translateY(8px); pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.nav-item:hover .dropdown { opacity: 1; transform: translateY(0); pointer-events: auto; }
.dropdown-inner { background: #fff; border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-xl); padding: 8px; display: flex; flex-direction: column; }
.dropdown-inner a { padding: 8px 16px; font-size: 14px; color: rgba(var(--primary-rgb), .82); border-radius: 8px; transition: color .2s, background .2s; }
.dropdown-inner a:hover { color: var(--primary); background: var(--soft-2); }

.header-cta { display: flex; align-items: center; }
.menu-toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; color: var(--foreground); }
.menu-toggle svg { width: 24px; height: 24px; }

/* Mobile menu */
.mobile-menu { display: none; position: fixed; inset: 0; z-index: 30; padding-top: 140px; background: rgba(255,255,255,.97); backdrop-filter: blur(16px); overflow-y: auto; }
.mobile-menu.open { display: block; }
.mobile-menu-inner { display: flex; flex-direction: column; gap: 24px; padding: 24px; }
.mobile-group > a.mob-top { font-size: 20px; font-weight: 600; color: var(--primary); }
.mobile-sub { display: flex; flex-direction: column; gap: 8px; padding-left: 16px; border-left: 2px solid var(--muted); margin-top: 8px; }
.mobile-sub a { color: rgba(var(--primary-rgb), .7); padding: 4px 0; }

/* ============================================================
   Footer
============================================================ */
.site-footer { background: var(--primary); color: #fff; padding: 80px 0 32px; border-radius: 48px 48px 0 0; margin-top: 80px; }
.footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px; margin-bottom: 64px; }
.footer-col h4 { font-size: 18px; font-weight: 600; margin-bottom: 24px; }
.footer-brand { display: flex; flex-direction: column; gap: 24px; }
.footer-brand img { height: 48px; width: auto; filter: brightness(0) invert(1); align-self: flex-start; }
.footer-brand p { color: rgba(255,255,255,.7); font-size: 14px; line-height: 1.7; }
.footer-contact { display: flex; flex-direction: column; gap: 12px; font-size: 14px; color: rgba(255,255,255,.8); }
.footer-contact a, .footer-contact span { display: inline-flex; align-items: flex-start; gap: 8px; transition: color .2s; }
.footer-contact a:hover { color: var(--accent); }
.footer-contact svg { width: 16px; height: 16px; color: var(--accent); flex-shrink: 0; margin-top: 2px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.footer-col ul a { color: rgba(255,255,255,.7); transition: color .2s; }
.footer-col ul a:hover { color: var(--accent); }
.footer-col ul a.gold { color: var(--accent); margin-top: 8px; display: inline-block; }
.footer-col ul a.gold:hover { text-decoration: underline; }
.newsletter { display: flex; flex-direction: column; gap: 12px; }
.newsletter input { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: 8px; padding: 10px 16px; font-size: 14px; color: #fff; }
.newsletter input::placeholder { color: rgba(255,255,255,.4); }
.newsletter input:focus { outline: none; box-shadow: 0 0 0 2px var(--accent); }
.newsletter button { background: var(--accent); color: var(--primary); font-weight: 600; padding: 10px 16px; border-radius: 8px; font-size: 14px; border: none; cursor: pointer; transition: background .2s; }
.newsletter button:hover { background: rgba(var(--accent-rgb), .9); }
.footer-badge { margin-top: 24px; display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); padding: 8px 16px; border-radius: 12px; font-size: 14px; font-weight: 500; }
.footer-badge svg { width: 20px; height: 20px; color: var(--accent); }
.footer-bottom { padding-top: 32px; border-top: 1px solid rgba(255,255,255,.1); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; font-size: 12px; color: rgba(255,255,255,.5); }
.footer-bottom .links { display: flex; gap: 16px; }
.footer-bottom .links a:hover { color: #fff; }

/* ============================================================
   Hero (home)
============================================================ */
.hero { position: relative; padding: 96px 0 128px; overflow: hidden; }
.hero .blob { position: absolute; border-radius: 9999px; filter: blur(96px); opacity: .5; z-index: 0; }
.hero .blob-1 { top: 0; right: 0; width: 800px; height: 800px; background: rgba(var(--secondary-rgb), .1); transform: translate(33%, -50%); }
.hero .blob-2 { bottom: 0; left: 0; width: 600px; height: 600px; background: rgba(var(--primary-rgb), .05); transform: translate(-33%, 33%); }
.hero-inner { position: relative; z-index: 10; max-width: 896px; margin: 0 auto; text-align: center; }
.badge-pill { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.6); backdrop-filter: blur(8px); border: 1px solid var(--border); padding: 6px 16px; border-radius: 9999px; font-size: 14px; font-weight: 500; color: var(--primary); margin-bottom: 32px; box-shadow: var(--shadow-sm); }
.badge-pill svg { width: 16px; height: 16px; color: var(--secondary); }
.hero h1 { font-size: clamp(44px, 7vw, 84px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.02; margin-bottom: 24px; }
.hero h1 .line1 { display: block; margin-bottom: 8px; }
.hero p.sub { font-size: clamp(18px, 2.2vw, 22px); color: var(--muted-foreground); margin: 0 auto 40px; max-width: 672px; line-height: 1.7; }
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; }

/* Stats card */
.stats { position: relative; z-index: 20; margin: -40px 16px 0; background: var(--primary); border-radius: 24px; box-shadow: var(--shadow-2xl); overflow: hidden; padding: 48px 0; }
.stats .container { position: relative; z-index: 10; }
.stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; }
.stat { padding: 16px 24px; }
.stat:not(:first-child) { border-left: 1px solid rgba(255,255,255,.1); }
.stat .num { font-size: clamp(36px, 5vw, 48px); font-weight: 700; color: #fff; margin-bottom: 8px; }
.stat .label { color: var(--accent); font-weight: 500; font-size: 15px; text-transform: uppercase; letter-spacing: .08em; }

/* ============================================================
   Cards / grids
============================================================ */
.grid { display: grid; gap: 24px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-lg { gap: 32px; }

.glass-card {
  background: rgba(255,255,255,.6); backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.5); box-shadow: var(--shadow-xl);
  padding: 32px; border-radius: 32px; height: 100%;
  transition: transform .3s ease, box-shadow .3s ease;
}
.glass-card:hover { transform: translateY(-8px); }
.icon-badge { width: 64px; height: 64px; border-radius: 16px; background: rgba(var(--secondary-rgb), .1); color: var(--secondary); display: flex; align-items: center; justify-content: center; margin-bottom: 24px; transition: background .3s, color .3s; }
.icon-badge svg { width: 32px; height: 32px; }
.glass-card:hover .icon-badge, .svc-card:hover .icon-badge { background: var(--secondary); color: #fff; }
.card-title { font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.card-desc { color: var(--muted-foreground); line-height: 1.65; margin-bottom: 24px; }
.card-arrow-link { display: inline-flex; align-items: center; gap: 4px; color: var(--primary); font-weight: 600; transition: color .25s; }
.glass-card:hover .card-arrow-link { color: var(--secondary); }
.card-arrow-link .arrow { opacity: 0; transform: translateX(-8px); transition: opacity .3s, transform .3s; }
.glass-card:hover .card-arrow-link .arrow { opacity: 1; transform: translateX(0); }

/* Simple/service card */
.svc-card { display: block; height: 100%; background: #fff; border: 1px solid var(--border); padding: 32px; border-radius: 24px; box-shadow: var(--shadow-sm); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.svc-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: rgba(var(--secondary-rgb), .3); }
.svc-card .icon-badge { background: var(--soft-2); }
.svc-card h3 { font-size: 20px; font-weight: 700; margin-bottom: 12px; transition: color .25s; }
.svc-card:hover h3 { color: var(--primary); }
.svc-card p { color: var(--muted-foreground); font-size: 14px; line-height: 1.65; }

/* ============================================================
   Home: RCM process + testimonials + CTA
============================================================ */
.split { display: flex; flex-wrap: wrap; align-items: center; gap: 64px; }
.split > * { flex: 1 1 360px; }
.check-list { list-style: none; display: flex; flex-direction: column; gap: 16px; margin: 0 0 32px; }
.check-list li { display: flex; align-items: center; gap: 12px; }
.check-list li svg { width: 24px; height: 24px; color: var(--accent); flex-shrink: 0; }
.check-list li span { font-weight: 500; }

.metric-panel { position: relative; border-radius: 32px; overflow: hidden; box-shadow: var(--shadow-2xl); border: 1px solid rgba(var(--secondary-rgb), .15); background: var(--soft-2); padding: 32px; min-height: 400px; display: flex; align-items: center; justify-content: center; }
.metric-panel .grad { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(var(--primary-rgb), .05), rgba(var(--secondary-rgb), .1)); }
.metric-grid { position: relative; z-index: 10; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; width: 100%; }
.metric-card { background: #fff; padding: 16px; border-radius: 12px; box-shadow: var(--shadow-sm); display: flex; align-items: flex-start; gap: 16px; }
.metric-card.shift { transform: translateY(32px); }
.metric-card .ico { padding: 8px; border-radius: 8px; display: flex; }
.metric-card .ico svg { width: 20px; height: 20px; }
.ico.green { background: #dcfce7; color: #15803d; }
.ico.blue { background: #dbeafe; color: #1d4ed8; }
.ico.orange { background: #ffedd5; color: #c2410c; }
.ico.purple { background: #f3e8ff; color: #7e22ce; }
.metric-card .lbl { font-size: 14px; color: var(--muted-foreground); }
.metric-card .val { font-weight: 700; font-size: 20px; }

.testimonial { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); padding: 32px; border-radius: 32px; height: 100%; display: flex; flex-direction: column; justify-content: space-between; transition: background .25s; }
.testimonial:hover { background: rgba(255,255,255,.1); }
.testimonial p { color: rgba(255,255,255,.8); font-style: italic; line-height: 1.7; margin-bottom: 24px; }
.testimonial .who { display: flex; align-items: center; gap: 16px; }
.testimonial .avatar { width: 48px; height: 48px; border-radius: 9999px; background: rgba(var(--secondary-rgb), .3); display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; }
.testimonial .name { font-weight: 700; }
.testimonial .role { font-size: 14px; color: var(--accent); }

.cta-box { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--primary), var(--secondary)); border-radius: 48px; padding: 64px 40px; text-align: center; color: #fff; box-shadow: var(--shadow-2xl); }
.cta-box .inner { position: relative; z-index: 10; max-width: 768px; margin: 0 auto; }
.cta-box svg.badge { width: 64px; height: 64px; margin: 0 auto 24px; color: var(--accent); }
.cta-box h2 { font-size: clamp(32px, 5vw, 52px); font-weight: 700; margin-bottom: 24px; }
.cta-box p { font-size: 20px; color: rgba(255,255,255,.9); margin-bottom: 40px; }

/* ============================================================
   Inner page heroes
============================================================ */
.page-hero { padding: 128px 0 80px; background: var(--primary); color: #fff; position: relative; overflow: hidden; }
.page-hero .grad { position: absolute; inset: 0; background: linear-gradient(135deg, var(--primary), var(--primary) 55%, rgba(var(--secondary-rgb), .3)); }
.page-hero .grad.vert { background: linear-gradient(to bottom, var(--primary), rgba(var(--secondary-rgb), .2)); }
.page-hero .glow { position: absolute; top: 0; right: 0; width: 500px; height: 500px; background: rgba(var(--secondary-rgb), .2); border-radius: 9999px; filter: blur(100px); }
.page-hero .container { position: relative; z-index: 10; }
.page-hero h1 { font-size: clamp(36px, 6vw, 68px); font-weight: 700; margin-bottom: 24px; line-height: 1.05; }
.page-hero p { font-size: clamp(18px, 2.2vw, 21px); color: rgba(255,255,255,.8); line-height: 1.7; }
.page-hero .tag { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.1); padding: 4px 12px; border-radius: 9999px; font-size: 14px; font-weight: 500; color: var(--accent); margin-bottom: 24px; border: 1px solid rgba(255,255,255,.2); }

/* Mission / vision & value cards */
.info-card { background: var(--soft-2); border: 1px solid var(--border); padding: 40px; border-radius: 24px; height: 100%; box-shadow: var(--shadow-sm); transition: box-shadow .25s; }
.info-card:hover { box-shadow: var(--shadow-lg); }
.info-card.navy { background: var(--primary); color: #fff; border-color: rgba(255,255,255,.1); box-shadow: var(--shadow-lg); }
.info-card .lead-icon { width: 48px; height: 48px; color: var(--secondary); margin-bottom: 24px; }
.info-card.navy .lead-icon { color: var(--accent); }
.info-card h2 { font-size: 24px; font-weight: 700; margin-bottom: 16px; }
.info-card p { font-size: 18px; line-height: 1.7; color: var(--muted-foreground); }
.info-card.navy p { color: rgba(255,255,255,.8); }

.value-card { background: #fff; padding: 32px; border-radius: 24px; box-shadow: var(--shadow-sm); border: 1px solid var(--border); height: 100%; display: flex; flex-direction: column; align-items: center; text-align: center; }
.value-card .lead-icon { width: 40px; height: 40px; color: var(--secondary); margin-bottom: 24px; }
.value-card h3 { font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.value-card p { color: var(--muted-foreground); }

/* ============================================================
   Contact page
============================================================ */
.form-card { background: #fff; border-radius: 24px; padding: 40px; box-shadow: var(--shadow-xl); border: 1px solid var(--border); }
.form-card h3 { font-size: 24px; font-weight: 700; margin-bottom: 32px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 24px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 14px; font-weight: 500; }
.field input, .field textarea { width: 100%; background: var(--soft); border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; font-size: 15px; font-family: inherit; color: var(--foreground); transition: box-shadow .2s, border-color .2s; }
.field textarea { resize: none; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--secondary); box-shadow: 0 0 0 3px rgba(var(--secondary-rgb), .3); }
.field.full { margin-bottom: 24px; }
.contact-info { display: flex; flex-direction: column; justify-content: center; gap: 40px; }
.contact-info h2 { font-size: clamp(26px, 3vw, 32px); font-weight: 700; margin-bottom: 16px; }
.contact-info .intro p { font-size: 18px; color: var(--muted-foreground); line-height: 1.7; }
.contact-cards { display: flex; flex-direction: column; gap: 24px; }
.contact-cards .item { display: flex; align-items: flex-start; gap: 16px; padding: 24px; background: var(--soft); border-radius: 16px; border: 1px solid var(--border); }
.contact-cards .item .ico { background: rgba(var(--primary-rgb), .1); color: var(--primary); padding: 12px; border-radius: 12px; display: flex; }
.contact-cards .item .ico svg { width: 24px; height: 24px; }
.contact-cards .item h4 { font-size: 18px; font-weight: 700; margin-bottom: 4px; }
.contact-cards .item p { color: var(--muted-foreground); margin-bottom: 4px; }
.contact-cards .item a { color: var(--secondary); font-weight: 600; font-size: 18px; }
.contact-cards .item a:hover { text-decoration: underline; }

/* ============================================================
   Resources
============================================================ */
.res-head { display: flex; align-items: center; gap: 12px; margin-bottom: 40px; border-bottom: 1px solid var(--border); padding-bottom: 16px; }
.res-head svg { width: 32px; height: 32px; color: var(--secondary); }
.res-head h2 { font-size: clamp(24px, 3vw, 30px); font-weight: 700; }
.post-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; height: 100%; display: flex; flex-direction: column; transition: box-shadow .25s; }
.post-card:hover { box-shadow: var(--shadow-lg); }
.post-thumb { height: 192px; background: var(--soft-2); display: flex; align-items: center; justify-content: center; color: rgba(var(--muted-foreground-rgb, 100,117,139), .5); font-size: 14px; }
.post-body { padding: 24px; flex-grow: 1; display: flex; flex-direction: column; }
.post-meta { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: var(--muted-foreground); margin-bottom: 12px; }
.post-meta .cat { font-weight: 600; color: var(--secondary); text-transform: uppercase; letter-spacing: .06em; }
.post-body h3 { font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.post-body p { color: var(--muted-foreground); font-size: 14px; flex-grow: 1; margin-bottom: 16px; }
.post-body a { color: var(--primary); font-weight: 600; font-size: 14px; transition: color .2s; }
.post-body a:hover { color: var(--secondary); }
.case-card { background: var(--soft); border: 1px solid var(--border); padding: 32px; border-radius: 24px; height: 100%; transition: border-color .25s; }
.case-card:hover { border-color: var(--secondary); }
.case-tag { display: inline-block; background: var(--primary); color: #fff; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 9999px; margin-bottom: 16px; }
.case-card h3 { font-size: 24px; font-weight: 700; margin-bottom: 12px; }
.case-card p { color: var(--muted-foreground); margin-bottom: 24px; }

/* ============================================================
   Technology
============================================================ */
.ehr-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; max-width: 1024px; margin: 0 auto 96px; }
.ehr-card { background: #fff; border: 1px solid var(--border); height: 96px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-weight: 700; color: rgba(var(--primary-rgb), .7); box-shadow: var(--shadow-sm); transition: box-shadow .25s, border-color .25s; }
.ehr-card:hover { box-shadow: var(--shadow-md); border-color: var(--secondary); }

/* ============================================================
   Service detail template
============================================================ */
.svc-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 64px; }
.svc-main h2 { font-size: 30px; font-weight: 700; margin-bottom: 24px; }
.prose { color: var(--muted-foreground); font-size: 18px; line-height: 1.8; }
.prose p { margin-bottom: 20px; }
.side-card { background: var(--soft); border: 1px solid var(--border); border-radius: 24px; padding: 32px; margin-bottom: 32px; }
.side-card h3 { font-size: 20px; font-weight: 700; margin-bottom: 24px; }
.benefit-list { list-style: none; display: flex; flex-direction: column; gap: 16px; }
.benefit-list li { display: flex; align-items: flex-start; gap: 12px; }
.benefit-list li svg { width: 20px; height: 20px; color: var(--secondary); flex-shrink: 0; margin-top: 2px; }
.benefit-list li span { color: var(--muted-foreground); }
.side-cta { background: var(--primary); color: #fff; border-radius: 24px; padding: 32px; text-align: center; }
.side-cta h3 { font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.side-cta p { color: rgba(255,255,255,.8); font-size: 14px; margin-bottom: 24px; }
.sticky-col { position: sticky; top: 128px; }

/* ============================================================
   RCM interactive stepper
============================================================ */
.rcm-wrap { display: flex; flex-wrap: wrap; gap: 32px; }
.rcm-steps { flex: 1 1 320px; display: flex; flex-direction: column; gap: 8px; position: relative; }
.rcm-steps .rail { position: absolute; left: 24px; top: 40px; bottom: 40px; width: 2px; background: var(--border); z-index: 0; }
.rcm-step { position: relative; z-index: 10; display: flex; align-items: center; gap: 16px; padding: 16px; border-radius: 16px; text-align: left; border: 1px solid transparent; background: transparent; cursor: pointer; transition: background .3s, border-color .3s, box-shadow .3s; width: 100%; }
.rcm-step:hover { background: var(--soft-2); }
.rcm-step.active { background: #fff; border-color: var(--secondary); box-shadow: 0 12px 24px -8px rgba(var(--secondary-rgb), .2); }
.rcm-step .badge { width: 48px; height: 48px; flex-shrink: 0; border-radius: 9999px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 18px; background: #fff; border: 1px solid var(--border); color: var(--muted-foreground); transition: background .3s, color .3s; }
.rcm-step.active .badge { background: var(--secondary); color: #fff; border-color: var(--secondary); }
.rcm-step .name { font-weight: 600; font-size: 18px; color: rgba(var(--primary-rgb), .7); }
.rcm-step.active .name { color: var(--primary); }
.rcm-detail { flex: 1 1 480px; }
.rcm-panel { background: #fff; border-radius: 32px; padding: 48px; box-shadow: var(--shadow-xl); border: 1px solid var(--border); min-height: 500px; display: flex; flex-direction: column; }
.rcm-content { flex-grow: 1; display: flex; flex-direction: column; }
.rcm-content .icon-badge { background: rgba(var(--secondary-rgb), .1); color: var(--secondary); margin-bottom: 32px; }
.rcm-content h3 { font-size: 30px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.rcm-content .desc { font-size: 20px; color: var(--muted-foreground); margin-bottom: 40px; line-height: 1.6; }
.rcm-content .bh { font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 16px; margin-top: auto; }
.rcm-benefits { list-style: none; display: flex; flex-direction: column; gap: 16px; }
.rcm-benefits li { display: flex; align-items: center; gap: 12px; background: var(--soft); padding: 16px; border-radius: 12px; border: 1px solid rgba(var(--border-rgb, 225,231,239), .5); }
.rcm-benefits li svg { width: 24px; height: 24px; color: var(--accent); flex-shrink: 0; }
.rcm-benefits li span { font-weight: 500; color: rgba(var(--primary-rgb), .8); }
.rcm-mobile-nav { display: none; justify-content: space-between; align-items: center; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--border); }
.rcm-mobile-nav button { background: none; border: none; color: var(--primary); font-weight: 500; cursor: pointer; font-size: 15px; }
.rcm-mobile-nav button:disabled { opacity: .3; cursor: default; }
.rcm-mobile-nav .count { font-size: 14px; font-weight: 700; color: var(--muted-foreground); }

/* ============================================================
   Legal + 404
============================================================ */
.legal { min-height: 60vh; padding: 128px 0 80px; }
.legal-card { max-width: 896px; margin: 0 auto; background: #fff; padding: 48px; border-radius: 32px; box-shadow: var(--shadow-sm); border: 1px solid var(--border); }
.legal-card h1 { font-size: 36px; font-weight: 700; margin-bottom: 32px; }
.legal-card p { color: var(--muted-foreground); font-size: 18px; line-height: 1.8; margin-bottom: 16px; }
.legal-card .back { margin-top: 32px; padding-top: 32px; border-top: 1px solid var(--border); }
.legal-card .back a { color: var(--secondary); }
.legal-card .back a:hover { text-decoration: underline; }
.notfound { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 40px; }
.notfound h1 { font-size: 96px; font-weight: 700; color: var(--primary); margin-bottom: 16px; }
.notfound h2 { font-size: 24px; font-weight: 700; margin-bottom: 16px; }
.notfound p { color: var(--muted-foreground); margin-bottom: 32px; }

/* ============================================================
   Scroll-reveal animations (framer-motion equivalents)
============================================================ */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }

@keyframes heroBadge { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: scale(1); } }
@keyframes heroUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.hero-anim { opacity: 0; animation-fill-mode: forwards; }
.hero-anim.a-badge { animation: heroBadge .5s ease forwards; }
.hero-anim.a-1 { animation: heroUp .6s ease .1s forwards; }
.hero-anim.a-2 { animation: heroUp .6s ease .2s forwards; }
.hero-anim.a-3 { animation: heroUp .6s ease .3s forwards; }

/* RCM panel swap animation */
@keyframes rcmIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }
.rcm-content.swap { animation: rcmIn .3s ease; }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
  .hero-anim { opacity: 1; }
}

/* ============================================================
   Responsive
============================================================ */
@media (max-width: 1024px) {
  .main-nav, .header-cta { display: none; }
  .menu-toggle { display: block; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .ehr-grid { grid-template-columns: repeat(3, 1fr); }
  .svc-layout { grid-template-columns: 1fr; gap: 40px; }
  .sticky-col { position: static; }
  .rcm-steps .rail { display: none; }
  .rcm-mobile-nav { display: flex; }
}
@media (max-width: 768px) {
  .section { padding: 64px 0; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr; }
  .stat:not(:first-child) { border-left: none; border-top: 1px solid rgba(255,255,255,.1); }
  .footer-grid { grid-template-columns: 1fr; gap: 40px; }
  .form-row { grid-template-columns: 1fr; }
  .ehr-grid { grid-template-columns: repeat(2, 1fr); }
  .metric-card.shift { transform: none; }
  .split { gap: 40px; }
  .rcm-panel { padding: 28px; }
  .cta-box { padding: 48px 24px; }
  .site-footer { border-radius: 32px 32px 0 0; }
}
@media (max-width: 480px) {
  .topbar-addr { display: none; }
}

/* ============================================================
   Penta enhancements (added): RCM orbit, specialties, assoc,
   service images, contact map, logo optimization
   ============================================================ */

/* --- Logo sizing / placement optimization --- */
.site-header .brand { display: inline-flex; align-items: center; gap: 10px; line-height: 0; }
.site-header .brand img { height: 40px; width: auto; object-fit: contain; }
.site-header.scrolled .brand img { height: 32px; }
@media (max-width: 640px){ .site-header .brand img { height: 34px; } }

/* --- Homepage specialties grid --- */
.spec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 14px; }
.spec-card { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border: 1px solid var(--border); border-radius: 12px; background: #fff; text-decoration: none; color: var(--foreground); font-weight: 600; font-size: 15px; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.spec-card:hover { transform: translateY(-3px); box-shadow: 0 16px 30px -18px rgba(var(--primary-rgb), .45); border-color: var(--secondary); }
.spec-card .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; }
.spec-card .arr { margin-left: auto; width: 16px; height: 16px; color: var(--secondary); opacity: 0; transform: translateX(-4px); transition: opacity .18s ease, transform .18s ease; }
.spec-card:hover .arr { opacity: 1; transform: translateX(0); }

/* --- Association strip (grayscale -> full color on hover) --- */
.assoc-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 40px; }
.assoc-item { display: flex; align-items: center; justify-content: center; }
.assoc-item img { height: 62px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .6; transition: filter .35s ease, opacity .35s ease, transform .35s ease; }
.assoc-item img:hover { filter: grayscale(0); opacity: 1; transform: scale(1.06); }

/* --- Service page hero image --- */
.svc-hero-img { margin: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(var(--primary-rgb), .5); }
.svc-hero-img img { width: 100%; height: auto; display: block; }

/* --- Contact map --- */
.contact-map { border-radius: 16px; overflow: hidden; border: 1px solid var(--border); box-shadow: 0 24px 50px -30px rgba(var(--primary-rgb), .5); }
.contact-map iframe { display: block; width: 100%; height: 440px; border: 0; }

/* --- RCM orbit / spiral (ported from reference, themed to Penta) --- */
.rcm-orbit-sec .section-head { margin-bottom: 34px; }
.mp-orbit { position: relative; width: min(600px, 92vw); height: min(600px, 92vw); margin: 6px auto 0; }
.mp-spiral-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 1; }
.mp-spiral-lines line { stroke: var(--secondary); stroke-width: 2; stroke-linecap: round; opacity: .4; stroke-dasharray: 100; stroke-dashoffset: 100; }
.mp-spiral.live .mp-spiral-lines line { animation: mpDrawLine .7s cubic-bezier(.22,1,.36,1) forwards; animation-delay: var(--d, 0s); }
@keyframes mpDrawLine { to { stroke-dashoffset: 0; } }
.mp-orbit-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30%; height: 30%; border-radius: 50%; background: radial-gradient(circle at 50% 40%, var(--secondary), var(--primary)); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 22px 50px -18px rgba(var(--secondary-rgb), .65); z-index: 3; }
.mp-spiral.live .mp-orbit-center { animation: mpCorePop .6s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes mpCorePop { from { transform: translate(-50%,-50%) scale(.6); opacity: 0; } to { transform: translate(-50%,-50%) scale(1); opacity: 1; } }
.mp-orbit-center span { font-size: 26px; font-weight: 800; line-height: 1; }
.mp-orbit-center b { font-size: 13px; font-weight: 600; opacity: .95; margin-top: 3px; }
.mp-orbit-center em { font-style: normal; font-size: 10px; opacity: .82; margin-top: 4px; }
.mp-node { position: absolute; z-index: 4; width: 48px; height: 48px; transform: translate(-50%,-50%); text-decoration: none; }
.mp-spiral .mp-node { opacity: 0; }
.mp-spiral.live .mp-node { animation: mpNodePop .5s cubic-bezier(.34,1.56,.64,1) forwards; animation-delay: var(--d, 0s); }
@keyframes mpNodePop { from { opacity: 0; transform: translate(-50%,-50%) scale(.2); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
.mp-node-dot { width: 48px; height: 48px; border-radius: 50%; background: #fff; color: var(--secondary); border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px -12px rgba(0,0,0,.3); transition: transform .2s ease, background .2s ease, color .2s ease; }
.mp-node-dot svg { width: 20px; height: 20px; }
.mp-node:hover { z-index: 6; }
.mp-node:hover .mp-node-dot { background: var(--secondary); color: #fff; transform: scale(1.16); }
.mp-node-lbl { position: absolute; top: 56px; left: 50%; transform: translateX(-50%); width: 116px; text-align: center; font-size: 11px; font-weight: 600; color: var(--muted-foreground, #5b6b82); line-height: 1.25; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .mp-spiral-lines line { animation: none; stroke-dashoffset: 0; } .mp-spiral .mp-node { opacity: 1; } .mp-spiral.live .mp-node, .mp-spiral.live .mp-orbit-center { animation: none; } }
@media (max-width: 640px) {
  .mp-orbit { width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .mp-spiral-lines, .mp-orbit-center { display: none; }
  .mp-node { position: static !important; width: auto; height: auto; transform: none !important; opacity: 1 !important; display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
  .mp-node-lbl { position: static; transform: none; width: auto; text-align: left; }
}

/* ===== PENTA REV2 OVERRIDES ===== */
/* remove gradients -> solid Penta colors */
.text-gradient{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:currentColor!important;color:var(--primary)!important;}
.cta-box{background:var(--primary)!important;}
.page-hero .grad{background:var(--primary)!important;}
.page-hero .grad.vert{background:var(--primary)!important;}
.metric-panel .grad{background:rgba(var(--secondary-rgb),.06)!important;}
.mp-orbit-center{background:var(--secondary)!important;}
/* logo sizing + footer (dark logo on navy -> render white) */
.site-header .brand img{height:46px!important;}
.site-header.scrolled .brand img{height:38px!important;}
.footer-brand img{filter:brightness(0) invert(1);height:44px;width:auto;}
@media(max-width:640px){.site-header .brand img{height:38px!important;}}
/* bigger association logos */
.assoc-row{gap:64px!important;}
.assoc-item img{height:96px!important;}
@media(max-width:640px){.assoc-item img{height:64px!important;}.assoc-row{gap:36px!important;}}
/* specialties single-line marquee (right -> left) */
.spec-marquee{overflow:hidden;position:relative;padding:6px 0;}
.spec-track{display:flex;flex-wrap:nowrap;align-items:center;gap:14px;width:max-content;animation:specScroll 70s linear infinite;}
.spec-marquee:hover .spec-track{animation-play-state:paused;}
.spec-card{flex:0 0 auto;white-space:nowrap;}
.spec-card .spec-ico{width:20px;height:20px;flex:none;color:var(--secondary);display:inline-flex;align-items:center;justify-content:center;}
.spec-card .spec-ico svg{width:20px;height:20px;}
@keyframes specScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.spec-track{animation:none;flex-wrap:wrap;justify-content:center}}
/* service card icons */
.glass-card .svc-ico{width:48px;height:48px;border-radius:12px;background:rgba(var(--secondary-rgb),.1);color:var(--secondary);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.glass-card .svc-ico svg{width:24px;height:24px;}

/* ===== PENTA REV3 OVERRIDES ===== */
.stat{display:flex;flex-direction:column;align-items:center}
.stat-ico{width:44px;height:44px;margin:0 auto 12px;border-radius:12px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:#fff}
.stat-ico svg{width:22px;height:22px}
.testimonial{position:relative}
.testimonial .quote-ico{width:30px;height:30px;color:var(--accent);opacity:.55;margin-bottom:10px;display:block}
.footer-col h4{display:flex;align-items:center;gap:8px}
.footer-col h4 .fh-ico{width:16px;height:16px;flex:none;color:var(--accent)}
.newsletter button,form.newsletter button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.newsletter button .send-ico,form.newsletter button .send-ico{width:16px;height:16px;flex:none}
/* Accessibility: visible keyboard focus (WCAG 2.2, >=3:1) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--secondary);outline-offset:2px;border-radius:4px}

/* ===== PENTA REV4 SPECIALTY CATEGORY STRIP ===== */
/* Reference-inspired numbered category rail */
#specialties{overflow:hidden}
#specialties .section-head{margin-bottom:38px}
#specialties .spec-marquee{overflow:hidden;padding:18px 4px 26px}
#specialties .spec-track{align-items:stretch;gap:16px;animation-duration:92s}
#specialties .spec-marquee:hover .spec-track,
#specialties .spec-marquee:focus-within .spec-track{animation-play-state:paused}
#specialties .spec-card{
  position:relative;flex:0 0 216px;width:216px;height:218px;padding:22px;
  display:flex;flex-direction:column;align-items:flex-start;gap:0;
  white-space:normal;overflow:hidden;border:1px solid var(--border);
  border-radius:16px;background:#fff;color:var(--primary);
  box-shadow:0 14px 32px -28px rgba(var(--primary-rgb),.5);
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background-color .28s ease,color .28s ease;
}
#specialties .spec-number{font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--secondary);transition:color .28s ease}
#specialties .spec-icon-wrap{
  width:48px;height:48px;margin:20px 0 16px;border-radius:14px;
  display:grid;place-items:center;background:rgba(var(--secondary-rgb),.1);
  color:var(--secondary);transition:background-color .28s ease,color .28s ease,transform .28s ease;
}
#specialties .spec-icon-wrap .spec-ico{width:25px;height:25px;color:inherit;display:grid;place-items:center}
#specialties .spec-icon-wrap .spec-ico svg{width:25px;height:25px}
#specialties .spec-kicker{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-foreground);transition:color .28s ease}
#specialties .spec-name{margin-top:4px;font-size:17px;line-height:1.2;font-weight:800;max-width:170px}
#specialties .spec-arrow{
  position:absolute;right:18px;bottom:18px;width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;background:var(--primary);color:#fff;
  opacity:0;transform:translateX(-8px);transition:opacity .25s ease,transform .25s ease,background-color .25s ease;
}
#specialties .spec-arrow .arr{width:16px;height:16px;margin:0;color:inherit;opacity:1;transform:none}
#specialties .spec-card:hover,#specialties .spec-card:focus-visible{
  transform:translateY(-8px);background:var(--primary);border-color:var(--primary);color:#fff;
  box-shadow:0 24px 42px -24px rgba(var(--primary-rgb),.75)
}
#specialties .spec-card:hover .spec-number,#specialties .spec-card:focus-visible .spec-number{color:var(--accent)}
#specialties .spec-card:hover .spec-kicker,#specialties .spec-card:focus-visible .spec-kicker{color:rgba(255,255,255,.72)}
#specialties .spec-card:hover .spec-icon-wrap,#specialties .spec-card:focus-visible .spec-icon-wrap{background:rgba(255,255,255,.14);color:#fff;transform:scale(1.06) rotate(-3deg)}
#specialties .spec-card:hover .spec-arrow,#specialties .spec-card:focus-visible .spec-arrow{opacity:1;transform:translateX(0);background:var(--secondary)}
/* Requested association-logo scale */
.assoc-item img{height:120px!important}
@media(max-width:900px){
  #specialties .spec-card{flex-basis:196px;width:196px;height:206px;padding:20px}
  .assoc-item img{height:92px!important}
}
@media(max-width:640px){
  #specialties .section-head{margin-bottom:24px}
  #specialties .spec-marquee{padding-top:10px}
  #specialties .spec-track{gap:12px}
  #specialties .spec-card{flex-basis:176px;width:176px;height:196px;padding:18px}
  #specialties .spec-icon-wrap{width:43px;height:43px;margin:16px 0 14px}
  #specialties .spec-name{font-size:15px}
  .assoc-item img{height:72px!important}
}
@media(prefers-reduced-motion:reduce){
  #specialties .spec-track{animation:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;gap:16px}
  #specialties .spec-card{width:100%;min-width:0}
  #specialties .spec-track .spec-card:nth-child(n+26){display:none}
}
@media(prefers-reduced-motion:reduce) and (max-width:900px){#specialties .spec-track{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce) and (max-width:520px){#specialties .spec-track{grid-template-columns:1fr}}

/* ============ PENTA REV5 SERVICE DETAIL ============ */
.svc-feature{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;background:#eef4ff;border:1px solid rgba(11,43,91,.06);border-radius:28px;padding:44px}
.svc-rows .svc-feature+.svc-feature{margin-top:28px}
.svc-feature.tint-gold{background:#fbf4e6}
.svc-feature-rev .svc-feature-media{order:2}
.svc-feature-media{display:flex;justify-content:center}
.svc-illus{width:100%;max-width:480px;height:auto;display:block;transition:transform .5s ease}
.svc-feature:hover .svc-illus{transform:translateY(-6px) scale(1.02)}
.svc-feature-body h2,.svc-feature-body h3{margin:0 0 14px}
.svc-feature-body .prose p{margin:0 0 12px;color:#475569;line-height:1.7}
.svc-inline-cta{display:inline-flex;align-items:center;gap:8px;margin-top:10px}
.svc-inline-cta svg{transition:transform .3s ease}
.svc-inline-cta:hover svg{transform:translateX(4px)}
.section-head{max-width:720px;margin:0 auto 40px;text-align:center}
.section-head h3{margin:0 0 10px}
.section-head p{color:#475569;margin:0}
.svc-benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.svc-benefit-card{background:#fff;border:1px solid rgba(11,43,91,.08);border-radius:20px;padding:30px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.svc-benefit-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px -20px rgba(11,43,91,.35);border-color:rgba(42,125,225,.35)}
.svc-benefit-ico{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:rgba(42,125,225,.1);color:#2a7de1;margin-bottom:18px;transition:background .3s ease,color .3s ease}
.svc-benefit-card:hover .svc-benefit-ico{background:#0b2b5b;color:#fff}
.svc-benefit-card h4{margin:0 0 8px;font-size:18px}
.svc-benefit-card p{margin:0;color:#475569;line-height:1.65;font-size:15px}
.svc-hands-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.svc-hand{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid rgba(11,43,91,.08);border-radius:18px;padding:22px 24px;transition:transform .3s ease,box-shadow .3s ease}
.svc-hand:hover{transform:translateY(-4px);box-shadow:0 16px 32px -22px rgba(11,43,91,.4)}
.svc-hand-ico{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:rgba(212,168,73,.16);color:#d4a849}
.svc-hand h4{margin:0 0 4px;font-size:16px}
.svc-hand p{margin:0;color:#475569;font-size:14px;line-height:1.6}
.svc-cta-band{background:#0b2b5b;border-radius:26px;padding:52px 40px;text-align:center;color:#fff}
.svc-cta-band h3{margin:0 0 10px;color:#fff}
.svc-cta-band p{margin:0 0 22px;color:rgba(255,255,255,.8)}
@media (max-width:900px){.svc-feature{grid-template-columns:1fr;padding:30px;gap:26px}.svc-feature-rev .svc-feature-media{order:0}.svc-benefit-grid{grid-template-columns:1fr}.svc-hands-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.svc-illus,.svc-benefit-card,.svc-hand,.svc-inline-cta svg{transition:none!important}.svc-feature:hover .svc-illus,.svc-benefit-card:hover,.svc-hand:hover{transform:none!important}}

/* ===== PENTA REV6 LEGAL TYPOGRAPHY ===== */
.legal-card h2{font-size:24px;font-weight:700;margin:36px 0 12px;color:var(--primary)}
.legal-card h2:first-of-type{margin-top:8px}
.legal-card h3{font-size:19px;font-weight:600;margin:22px 0 8px}
.legal-card .legal-updated{font-size:15px;color:var(--muted-foreground);margin:-16px 0 28px}
.legal-card ul{margin:0 0 16px;padding-left:22px}
.legal-card li{color:var(--muted-foreground);font-size:17px;line-height:1.75;margin-bottom:8px}
.legal-card a{color:var(--secondary)}
.legal-card a:hover{text-decoration:underline}

/* ============ PENTA REV7 : FAQ + REAL IMAGERY + HERO VIDEO ============ */
/* --- Hero video (homepage) --- */
.hero.hero--media{position:relative;overflow:hidden;color:#fff}
.hero.hero--media .hero-media{position:absolute;inset:0;z-index:0}
.hero.hero--media .hero-video{width:100%;height:100%;object-fit:cover;display:block}
.hero.hero--media .hero-media-scrim{position:absolute;inset:0;}
.hero.hero--media .container{position:relative;z-index:1}
.hero.hero--media h1,.hero.hero--media .sub{color:#fff}
.hero.hero--media .sub{opacity:.94}
.hero.hero--media .text-gradient{background:linear-gradient(90deg,#f4d58d,#ffffff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
@media (prefers-reduced-motion: reduce){.hero.hero--media .hero-video{display:none}.hero.hero--media .hero-media{background:#0b2b5b}}

/* --- Service intro: real photo variant --- */
.svc-illus--photo{width:100%;max-width:560px;height:auto;border-radius:18px;box-shadow:0 24px 60px -18px rgba(11,43,91,.45);border:1px solid rgba(11,43,91,.08);background:#fff;object-fit:cover}

/* --- Technology ecosystem media band --- */
.tech-hero-media{padding-top:8px}
.tech-media-frame{margin:0;border-radius:22px;overflow:hidden;position:relative;box-shadow:0 30px 80px -28px rgba(3,12,28,.6);border:1px solid rgba(11,43,91,.12)}
.tech-media-frame img{display:block;width:100%;height:auto}
.tech-media-frame figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 22px 16px;color:#eaf2ff;font-size:14px;letter-spacing:.2px;background:linear-gradient(to top,rgba(3,10,24,.85),rgba(3,10,24,0))}

/* --- FAQ hero --- */
.faq-hero{position:relative;overflow:hidden;color:#fff;padding:96px 0 84px}
.faq-hero-bg{position:absolute;inset:0;background:url('assets/img/faq-hero.jpg') center/cover no-repeat;transform:scale(1.03)}
.faq-hero-scrim{position:absolute;inset:0;background:linear-gradient(120deg,rgba(6,20,44,.9) 0%,rgba(9,30,64,.8) 45%,rgba(11,43,91,.62) 100%)}
.faq-hero .container{position:relative;z-index:1}
.faq-hero-inner{max-width:820px}
.faq-hero h1{color:#fff;font-size:clamp(34px,5vw,56px);font-weight:800;line-height:1.05;margin:0 0 18px}
.faq-hero p{color:#dbe6f7;font-size:clamp(16px,1.6vw,19px);line-height:1.65;margin:0 0 28px;max-width:680px}
.faq-hero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* --- FAQ body --- */
.faq-section{background:var(--background,#f8fafc)}
.faq-cat{margin-bottom:44px}
.faq-cat:last-child{margin-bottom:0}
.faq-cat-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.faq-cat-ico{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#0b2b5b,#2a7de1);box-shadow:0 10px 24px -10px rgba(42,125,225,.7)}
.faq-cat-ico svg{width:22px;height:22px}
.faq-cat-head h2{font-size:clamp(22px,2.6vw,28px);font-weight:700;color:#0b2b5b;margin:0}
.faq-list{display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid rgba(11,43,91,.1);border-radius:14px;overflow:hidden;transition:box-shadow .2s ease,border-color .2s ease}
.faq-item[open]{border-color:rgba(42,125,225,.5);box-shadow:0 16px 40px -22px rgba(11,43,91,.5)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-weight:600;color:#0b2b5b;font-size:clamp(15px,1.6vw,17px)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:#2a7de1}
.faq-item summary:focus-visible{outline:2px solid #2a7de1;outline-offset:2px;border-radius:10px}
.faq-plus{flex:none;width:22px;height:22px;color:#2a7de1;transition:transform .25s ease}
.faq-item[open] .faq-plus{transform:rotate(45deg)}
.faq-answer{padding:0 22px 20px;color:var(--muted-foreground,#4c5a72);line-height:1.7;font-size:15.5px}
.faq-answer p{margin:0}
@media (max-width:640px){.faq-hero{padding:72px 0 60px}.faq-item summary{padding:16px 18px}.faq-answer{padding:0 18px 18px}}
/* ============ END PENTA REV7 ============ */

/* ============ PENTA REV8 : SERVICES PHOTOS + SPECIALTIES ============ */
/* --- Services hero photo --- */
.page-hero--photo{position:relative;overflow:hidden}
.page-hero--photo .ph-photo{position:absolute;inset:0;background:url('../img/services-hero.jpg') center center/cover no-repeat;transform:scale(1.03)}
.page-hero--photo .grad{position:absolute;inset:0;background:linear-gradient(115deg,rgba(6,20,44,.72) 0%,rgba(9,30,64,.5) 50%,rgba(8,26,54,.66) 100%)!important}
.page-hero--photo .container{position:relative;z-index:1}

/* --- Service card photo --- */
.svc-card{overflow:hidden;padding:0!important;display:flex;flex-direction:column}
.svc-card-media{display:block;width:100%;aspect-ratio:16/10;overflow:hidden;background:#0b2b5b}
.svc-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.svc-card:hover .svc-card-media img{transform:scale(1.06)}
.svc-card>h3{margin:18px 20px 0}
.svc-card>p{margin:8px 20px 22px}

/* --- Specialties tile grid --- */
.spec-section{background:linear-gradient(180deg,#fff 0%,var(--background,#f8fafc) 100%)}
.spec-tile-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.spec-tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:12px;text-align:center;padding:24px 14px;background:#fff;border:1px solid rgba(11,43,91,.1);border-radius:16px;color:#0b2b5b;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.spec-tile:hover{transform:translateY(-4px);border-color:rgba(42,125,225,.5);box-shadow:0 18px 40px -20px rgba(11,43,91,.5)}
.spec-tile-ico{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#0b2b5b,#2a7de1);box-shadow:0 10px 22px -10px rgba(42,125,225,.7);transition:transform .3s ease}
.spec-tile:hover .spec-tile-ico{transform:scale(1.08) rotate(-3deg)}
.spec-tile-ico svg{width:26px;height:26px}
.spec-tile-name{font-weight:600;font-size:14.5px;line-height:1.3}
@media (max-width:1024px){.spec-tile-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:760px){.spec-tile-grid{grid-template-columns:repeat(3,1fr);gap:12px}.spec-tile{padding:18px 10px}.spec-tile-ico{width:46px;height:46px}}
@media (max-width:440px){.spec-tile-grid{grid-template-columns:repeat(2,1fr)}}
/* ============ END PENTA REV8 ============ */

/* ================= PENTA REV9 : MEDICAL SPECIALTIES + MINIMAL ICONS + HERO ================= */

/* --- Services page: Medical Specialties preview cards (4 per row) --- */
.msp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.msp-card{display:flex;align-items:flex-start;gap:14px;padding:20px;border:1px solid #e2ebf7;border-radius:16px;background:#fff;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.msp-card:hover{border-color:var(--secondary);box-shadow:0 14px 30px -20px rgba(11,43,91,.35);transform:translateY(-2px)}
.msp-ico{flex:0 0 auto;width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:rgba(42,125,225,.09);color:var(--secondary)}
.msp-ico svg{width:24px;height:24px}
.msp-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.msp-name{font-weight:700;color:var(--primary);font-size:1rem;line-height:1.2}
.msp-desc{font-size:.82rem;color:#5b6b82;line-height:1.35}
@media(max-width:1024px){.msp-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.msp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.msp-grid{grid-template-columns:1fr}}

/* --- Minimal blue outline icon system (site-wide) --- */
.fh-ico svg,.spec-ico svg,.svc-hand-ico svg,.svc-benefit-ico svg,.lead-icon svg,.faq-cat-ico svg,.svc-ico svg,.stat-ico svg,.quote-ico svg,.msp-ico svg,.ico svg{
  fill:none !important;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}
/* strip chip fills/gradients so icons read as clean blue outlines like the reference */
.svc-benefit-ico,.faq-cat-ico,.lead-icon,.svc-hand-ico{
  background:rgba(42,125,225,.09) !important;box-shadow:none !important;color:var(--secondary) !important;
}
.svc-benefit-ico svg,.faq-cat-ico svg,.lead-icon svg,.svc-hand-ico svg,.svc-ico svg{stroke:var(--secondary) !important}
.spec-ico svg{stroke:currentColor !important}

/* --- Home hero: left aligned + very light overlay + readable contrast --- */
.hero--media .hero-inner{text-align:left;margin-left:0;max-width:780px}
.hero--media .hero-cta{justify-content:flex-start}
.hero--media .hero-inner h1{text-shadow:0 2px 22px rgba(4,12,28,.55)}
.hero--media .hero-inner .sub{text-shadow:0 1px 14px rgba(4,12,28,.55)}
.hero--media .line1.text-gradient{background:linear-gradient(90deg,#7fb4ff,#eaf3ff);-webkit-background-clip:text;background-clip:text}

/* --- Every page-hero heading left aligned --- */
.page-hero .container>.reveal{text-align:left}

/* --- Home specialties strip: minimal hover --- */
#specialties .spec-card:hover,#specialties .spec-card:focus-visible{transform:none;box-shadow:0 10px 24px -18px rgba(11,43,91,.5);border-color:var(--secondary)}
#specialties .spec-card:hover .spec-icon-wrap,#specialties .spec-card:focus-visible .spec-icon-wrap{transform:none;background:rgba(255,255,255,.14)}
#specialties .spec-card:hover .spec-arrow,#specialties .spec-card:focus-visible .spec-arrow{transform:none}

/* --- Specialty detail page: flat-vector illustration band --- */
.spec-illus-section{padding-top:8px;padding-bottom:8px}
.spec-illus-band{max-width:720px;margin:0 auto}
.spec-illus-img{display:block;width:100%;height:auto;border-radius:20px;border:1px solid #e2ebf7;box-shadow:0 24px 50px -34px rgba(11,43,91,.4)}

/* ===================== PENTA REV10 : PHOTO HEROES + PHOTO SPECIALTY CARDS + BIGGER LOGO + WEBM ===================== */

/* Bigger logo */
.site-header .brand img{height:56px!important;}
@media(max-width:640px){.site-header .brand img{height:44px!important;}}

/* Photo hero (service + specialty detail) */
.page-hero--photo{position:relative;overflow:hidden;}
.page-hero--photo .ph-photo{position:absolute;inset:0;z-index:0;background-position:center;background-size:cover;background-repeat:no-repeat;transform:scale(1.02);}
.page-hero--photo .glow{z-index:1;}
.page-hero--photo .grad{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(6,20,44,.88),rgba(9,30,64,.66) 52%,rgba(11,43,91,.42))!important;}
.page-hero--photo .container{position:relative;z-index:2;}
.page-hero--photo h1,.page-hero--photo p{color:#fff!important;}
.page-hero--photo p{color:rgba(255,255,255,.9)!important;}

/* Specialty cards -> photo cards (services #specialties) */
#specialties .msp-grid{align-items:stretch;}
.msp-card--photo{display:flex;flex-direction:column;padding:0;overflow:hidden;border-radius:16px;background:#fff;border:1px solid rgba(11,43,91,.10);box-shadow:0 1px 2px rgba(11,43,91,.04);transition:border-color .18s ease,box-shadow .18s ease;height:100%;}
.msp-card--photo .msp-media{display:block;width:100%;aspect-ratio:16/10;overflow:hidden;background:#eef3fb;}
.msp-card--photo .msp-media img{width:100%;height:100%;object-fit:cover;display:block;}
.msp-card--photo .msp-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:5px;text-align:left;}
.msp-card--photo .msp-name{font-weight:700;color:var(--foreground);font-size:1.02rem;line-height:1.2;}
.msp-card--photo .msp-desc{color:#5b6b82;font-size:.86rem;line-height:1.4;}

/* Minimal (no) hover on specialty cards under services */
#specialties .msp-card,#specialties .msp-card--photo,#specialties .msp-card:hover,#specialties .msp-card--photo:hover{transform:none!important;}
#specialties .msp-card--photo:hover{box-shadow:0 6px 18px rgba(11,43,91,.08);border-color:var(--secondary);}
#specialties .msp-card--photo:hover .msp-media img{transform:none!important;}

/* REV10 fix: translucent scrim for vertical-gradient photo heroes (technology) */
.page-hero--photo .grad.vert{background:linear-gradient(160deg,rgba(6,20,44,.78),rgba(9,30,64,.52) 55%,rgba(11,43,91,.4))!important;}

/* ===================== PENTA REV11 : MOBILE NO-HORIZONTAL-SLIDE ===================== */
html{overflow-x:hidden;}
html,body{max-width:100%;overscroll-behavior-x:none;}
.spec-marquee,#specialties .spec-marquee{max-width:100%;overflow-x:hidden;}
.spec-track{max-width:100%;}

/* ==========================================================================
   REV12 - header/hero, RCM, testimonials, specialty preview, blog, mobile
   ========================================================================== */

/* ---------- A. Transparent header over hero, solid white on scroll ------- */
.topbar {
  position: absolute; top: 0; left: 0; right: 0; z-index: 70;
  background: transparent; border-bottom: 1px solid rgba(255,255,255,.16);
  padding: 9px 0;
}
.topbar, .topbar a, .topbar span, .topbar svg { color: #fff; }
.topbar a:hover { opacity: .82; }

.site-header {
  position: fixed; top: 40px; left: 0; right: 0; z-index: 65;
  background: transparent; border-bottom: 1px solid transparent; padding: 14px 0;
  transition: background .3s ease, box-shadow .3s ease, top .3s ease,
              padding .3s ease, border-color .3s ease;
}
.site-header.scrolled {
  top: 0; padding: 10px 0; background: #fff;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 10px 30px -18px rgba(var(--primary-rgb), .55);
}
.site-header:not(.scrolled) .brand img { filter: brightness(0) invert(1); }
.site-header:not(.scrolled) .nav-link { color: #fff; }
.site-header:not(.scrolled) .nav-link:hover { color: #fff; opacity: .85; }
.site-header:not(.scrolled) .nav-link .chev { color: #fff; }
.site-header:not(.scrolled) .menu-toggle { color: #fff; }
.site-header:not(.scrolled) .header-cta .btn-primary {
  background: #fff; color: var(--primary); border-color: #fff;
}
.site-header:not(.scrolled) .header-cta .btn-primary:hover {
  background: rgba(255,255,255,.9);
}

/* Clearance so content is never hidden behind the fixed header */
.hero { padding-top: 178px; }
.page-hero { padding-top: 196px; }
.faq-hero { padding-top: 178px; }
main > section:first-child:not(.hero):not(.page-hero):not(.faq-hero) {
  padding-top: 190px;
}

/* ---------- Hero display type (word-level gradient) ---------------------- */
.hero-display {
  font-weight: 800; line-height: 1.02; letter-spacing: -.032em;
  font-size: clamp(2.6rem, 6.4vw, 5.1rem); margin: 0 0 18px;
}
.hero-display .hd-line { display: block; }
.hd-w1 { color: #4f9dff; }
.hd-w2 {
  background: linear-gradient(90deg, #9fc8ff 0%, #dfeaf7 55%, #c9d3de 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
}
.hd-w3 { color: #fff; }

/* ---------- B. Larger RCM orbit ----------------------------------------- */
.rcm-orbit--xl .mp-orbit { width: min(760px, 94vw); height: min(760px, 94vw); }
@media (min-width: 641px) {
  .rcm-orbit--xl .mp-node { width: 58px; height: 58px; }
}

/* ---------- C. Testimonial marquee (left to right) ---------------------- */
.tm-marquee { position: relative; }
.tm-viewport {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.tm-shift {
  transform: translateX(var(--tm-shift, 0px));
  transition: transform .5s cubic-bezier(.22,.61,.36,1);
}
.tm-track {
  display: flex; gap: 24px; width: max-content;
  animation: tmScroll 78s linear infinite;
}
.tm-marquee.is-paused .tm-track { animation-play-state: paused; }
.tm-marquee:hover .tm-track { animation-play-state: paused; }
.tm-cell { flex: 0 0 380px; max-width: 380px; display: flex; }
.tm-cell > .testimonial { width: 100%; }
@keyframes tmScroll {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}
.tm-controls {
  display: flex; gap: 10px; justify-content: center; margin-top: 34px;
}
.tm-btn {
  width: 44px; height: 44px; border-radius: 999px; display: grid;
  place-items: center; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22); color: #fff; cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.tm-btn:hover { background: rgba(255,255,255,.18); transform: translateY(-2px); }
.tm-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.tm-btn svg { width: 17px; height: 17px; }
.i-pause { display: block; }
.i-play  { display: none; }
.tm-marquee.is-paused .i-pause { display: none; }
.tm-marquee.is-paused .i-play  { display: block; }
@media (max-width: 640px) {
  .tm-cell { flex: 0 0 82vw; max-width: 82vw; }
  .tm-track { gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .tm-track { animation: none; }
}

/* ---------- D. Specialty hover preview (replaces the blue hover) -------- */
#specialties .spec-card:hover,
#specialties .spec-card:focus-visible {
  background: #fff !important;
  border-color: var(--secondary) !important;
  color: var(--primary) !important;
  transform: translateY(-4px);
}
#specialties .spec-card:hover .spec-number,
#specialties .spec-card:focus-visible .spec-number { color: var(--muted-foreground) !important; }
#specialties .spec-card:hover .spec-kicker,
#specialties .spec-card:focus-visible .spec-kicker { color: var(--secondary) !important; }
#specialties .spec-card:hover .spec-name,
#specialties .spec-card:hover .spec-title,
#specialties .spec-card:focus-visible .spec-name,
#specialties .spec-card:focus-visible .spec-title { color: var(--primary) !important; }
#specialties .spec-card:hover .spec-arrow,
#specialties .spec-card:focus-visible .spec-arrow { color: var(--secondary) !important; }
#specialties .spec-card:hover .spec-icon-wrap,
#specialties .spec-card:focus-visible .spec-icon-wrap {
  background: rgba(var(--secondary-rgb), .12) !important;
}
#specialties .spec-card:hover .spec-ico,
#specialties .spec-card:focus-visible .spec-ico { color: var(--secondary) !important; }

/* Icon legibility: 48-unit viewBox drawn at 26px needs a heavier stroke */
#specialties .spec-icon-wrap { background: rgba(var(--secondary-rgb), .10); }
#specialties .spec-icon-wrap .spec-ico { color: var(--secondary); }
#specialties .spec-icon-wrap .spec-ico svg {
  width: 26px; height: 26px; stroke-width: 2.6;
}

.spec-preview {
  position: fixed; inset: 0; z-index: 120; display: none;
  align-items: center; justify-content: center;
  opacity: 0; transition: opacity .28s ease;
}
.spec-preview.is-open { display: flex; opacity: 1; }
.spec-preview-scrim {
  position: absolute; inset: 0; background: rgba(11,43,91,.55);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
.spec-preview-card {
  position: relative; display: grid; grid-template-columns: 42% 58%;
  width: min(940px, 66vw); min-height: min(430px, 46vh);
  background: #fff; border-radius: 24px; overflow: hidden;
  box-shadow: var(--shadow-2xl);
  transform: translateY(10px) scale(.985);
  transition: transform .28s cubic-bezier(.22,.61,.36,1);
}
.spec-preview.is-open .spec-preview-card { transform: none; }
.spec-preview-media {
  background-size: cover; background-position: center;
  background-color: var(--soft-2); min-height: 240px;
}
.spec-preview-body {
  padding: 38px 40px; display: flex; flex-direction: column;
  justify-content: center; min-width: 0;
}
.spec-preview-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--secondary); margin-bottom: 12px;
}
.spec-preview-body h3 {
  font-size: clamp(1.7rem, 2.1vw, 2.1rem); line-height: 1.12;
  color: var(--primary); margin: 0 0 10px; letter-spacing: -.02em;
}
.spec-preview-tag {
  font-size: 15px; font-weight: 600; color: var(--secondary); margin: 0 0 14px;
}
.spec-preview-desc {
  font-size: 15px; line-height: 1.65; color: var(--muted-foreground);
  margin: 0 0 22px;
}
.spec-preview-cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 700; color: var(--primary); font-size: 15px;
}
.spec-preview-cta svg { width: 16px; height: 16px; }
@media (max-width: 900px) { .spec-preview { display: none !important; } }

/* ---------- Blog cards + article pages ---------------------------------- */
.post-card--link { display: flex; text-decoration: none; color: inherit; }
.post-card--link:hover { box-shadow: var(--shadow-lg); }
.post-card--link:hover .post-h3 { color: var(--secondary); }
.post-thumb--img {
  background-size: cover; background-position: center; min-height: 190px;
}
.post-h3 { transition: color .2s ease; }
.post-p { color: var(--muted-foreground); }
.post-more { font-weight: 700; color: var(--primary); margin-top: auto; }

.post-hero-meta {
  display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px;
  color: rgba(255,255,255,.86); font-size: 14px;
}
.post-prose { max-width: 760px; margin: 0 auto; }
.post-prose h2 {
  font-size: clamp(1.45rem, 2.3vw, 1.9rem); color: var(--primary);
  margin: 42px 0 14px; letter-spacing: -.02em;
}
.post-prose h3 {
  font-size: 1.18rem; color: var(--primary); margin: 30px 0 10px;
}
.post-prose p, .post-prose li {
  font-size: 16.5px; line-height: 1.78; color: #46586f;
}
.post-prose p { margin: 0 0 18px; }
.post-prose ul, .post-prose ol { margin: 0 0 20px; padding-left: 22px; }
.post-prose li { margin-bottom: 9px; }
.post-prose strong { color: var(--primary); }
.post-callout {
  background: var(--soft-2); border-left: 4px solid var(--secondary);
  border-radius: 14px; padding: 20px 24px; margin: 26px 0;
}
.post-callout p { margin: 0; }
.post-cta {
  margin-top: 44px; padding: 30px; border-radius: 20px;
  background: var(--primary); color: #fff; text-align: center;
}
.post-cta h3 { color: #fff; margin: 0 0 8px; font-size: 1.35rem; }
.post-cta p { color: rgba(255,255,255,.82); margin: 0 0 18px; }
.post-rel-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;
}
.post-rel {
  display: flex; gap: 16px; align-items: center; background: #fff;
  border: 1px solid var(--border); border-radius: 16px; padding: 14px;
  text-decoration: none; color: inherit; transition: box-shadow .2s ease;
}
.post-rel:hover { box-shadow: var(--shadow-md); }
.post-rel-media {
  width: 92px; height: 72px; border-radius: 10px; flex: none;
  background-size: cover; background-position: center;
}
.post-rel-body { min-width: 0; }
.post-rel-title { font-weight: 700; color: var(--primary); line-height: 1.35; }
@media (max-width: 700px) {
  .post-rel-grid { grid-template-columns: 1fr; }
}

/* ---------- E. Mobile: compact metric panel, no horizontal overflow ----- */
.split, .split > * { min-width: 0; }
.metric-panel, .metric-grid, .metric-grid > *, .metric-card, .metric-card > * {
  min-width: 0;
}
.metric-panel { box-sizing: border-box; max-width: 100%; }

@media (max-width: 900px) {
  .topbar { display: none; }
  .site-header {
    top: 0; background: #fff; border-bottom: 1px solid var(--border);
  }
  .site-header .brand img { filter: none; }
  .site-header .nav-link, .site-header .menu-toggle { color: var(--primary); }
  .site-header .header-cta .btn-primary {
    background: var(--primary); color: #fff; border-color: var(--primary);
  }
  .hero { padding-top: 128px; }
  .page-hero { padding-top: 138px; }
  .faq-hero { padding-top: 128px; }
  main > section:first-child:not(.hero):not(.page-hero):not(.faq-hero) {
    padding-top: 132px;
  }
  .mobile-menu-inner { padding-top: 92px; }
  .metric-panel { min-height: 0; padding: 22px; }
}

@media (max-width: 640px) {
  .metric-panel {
    min-height: 0; padding: 14px; border-radius: 20px; overflow: hidden;
    width: 100%; margin-left: 0; margin-right: 0;
  }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .metric-card { padding: 12px 10px; transform: none !important; flex-wrap: wrap; }
}

@media (max-width: 380px) {
  .metric-grid { grid-template-columns: 1fr; }
}

/* ---------- REV12 F: testimonial card internals ------------------------- */
.tm-quote {
  font-size: 16px; line-height: 1.7; color: rgba(255,255,255,.9);
  margin: 14px 0 22px;
}
.tm-author {
  display: flex; flex-direction: column; gap: 2px;
  border-top: 1px solid rgba(255,255,255,.14); padding-top: 16px;
  margin-top: auto;
}
.tm-name { font-weight: 700; color: #fff; font-size: 15px; }
.tm-role { font-size: 13.5px; color: rgba(255,255,255,.62); }
.tm-cell > .testimonial { display: flex; flex-direction: column; }

/* ==========================================================================
   REV13 - hero gradient, transparent header, gold icons, drag marquee
   ========================================================================== */

/* Design tokens as HSL triplets. Deliberately NEW names: overwriting
   --primary etc. would break every existing var(--primary) hex reference. */
:root {
  --c-background: 210 33% 98%;
  --c-foreground: 216 79% 20%;
  --c-border: 214 32% 91%;
  --c-input: 214 32% 91%;
  --c-ring: 213 75% 52%;
  --c-card: 0 0% 100%;
  --c-primary: 216 79% 20%;
  --c-primary-foreground: 0 0% 100%;
  --c-secondary: 213 75% 52%;
  --c-secondary-foreground: 0 0% 100%;
  --c-accent: 41 62% 56%;
  --c-accent-foreground: 216 79% 20%;
  --c-muted: 210 40% 90%;
  --c-muted-foreground: 215 16% 47%;
  --gold-light: #d4a849;
}

/* ---------- Hero headline ----------------------------------------------- */
/* Gradient spans "Innovate. Elevate." as one run: primary -> secondary -> accent */
.hero-display .hd-line--grad {
  display: inline-block;
  background-image: linear-gradient(
    to right,
    hsl(var(--c-primary)) 0%,
    hsl(var(--c-secondary)) 50%,
    hsl(var(--c-accent)) 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: #0000;
  -webkit-text-fill-color: transparent;
}
.hero-display .hd-line--grad .hd-w1,
.hero-display .hd-line--grad .hd-w2 {
  background: none;
  color: inherit;
  -webkit-text-fill-color: inherit;
}
.hero-display .hd-w3 {
  color: #0b2b5b;
  -webkit-text-fill-color: #0b2b5b;
  background: none;
}

/* ---------- Header: fully transparent until scrolled, blurred after ------ */
.topbar {
  background: transparent !important;
  border-bottom: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.site-header:not(.scrolled) {
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.site-header.scrolled {
  background: rgba(255, 255, 255, .85);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  backdrop-filter: blur(14px) saturate(160%);
}

/* ---------- Bigger logo -------------------------------------------------- */
.site-header .brand img {
  height: 62px !important;
  transition: height .3s ease;
}
.site-header.scrolled .brand img { height: 52px !important; }
@media (max-width: 900px) {
  .site-header .brand img,
  .site-header.scrolled .brand img { height: 46px !important; }
}

/* ---------- Tags removed sitewide --------------------------------------- */
.tag,
.page-hero .tag,
.spec-preview-tag { display: none !important; }

/* ---------- Specialty marquee: faster, draggable, card-level pause ------- */
#specialties .spec-track { animation-duration: 38s; }

.spec-drag {
  transform: translateX(var(--spec-shift, 0px));
  will-change: transform;
}
#specialties .spec-marquee {
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  touch-action: pan-y;
}
#specialties .spec-marquee.is-dragging { cursor: grabbing; }
#specialties .spec-marquee img,
#specialties .spec-marquee a { -webkit-user-drag: none; }

/* Container hover must NOT pause; only hovering an actual card pauses. */
.spec-marquee:hover .spec-track { animation-play-state: running; }
#specialties .spec-marquee:focus-within .spec-track { animation-play-state: running; }
#specialties .spec-marquee.card-hover .spec-track,
#specialties .spec-marquee.is-dragging .spec-track { animation-play-state: paused; }

/* ---------- Specialty icons: light gold ---------------------------------- */
#specialties .spec-icon-wrap { background: rgba(212, 168, 73, .14); }
#specialties .spec-icon-wrap .spec-ico { color: var(--gold-light); }
#specialties .spec-card:hover .spec-icon-wrap,
#specialties .spec-card:focus-visible .spec-icon-wrap {
  background: rgba(212, 168, 73, .22) !important;
}
#specialties .spec-card:hover .spec-icon-wrap .spec-ico,
#specialties .spec-card:focus-visible .spec-icon-wrap .spec-ico {
  color: var(--gold-light) !important;
}

/* ---------- Preview panel: true fade, never steals the hover ------------- */
/* The scrim used to sit under the cursor, firing mouseleave on the card ->
   close -> mouseenter -> open, which is what caused the flashing. */
.spec-preview {
  display: flex !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none !important;
  transition: opacity .32s ease, visibility 0s linear .32s;
}
/* Scrim stays inert; only the panel itself takes the cursor, so it can be
   hovered without ever stealing hover from the card underneath. */
.spec-preview.is-open .spec-preview-card {
  pointer-events: auto !important;
  cursor: pointer;
}

.spec-preview.is-open {
  visibility: visible;
  opacity: 1;
  transition: opacity .32s ease, visibility 0s linear 0s;
}
.spec-preview-card {
  transform: translateY(12px) scale(.985);
  transition: transform .38s cubic-bezier(.22, .61, .36, 1);
}
.spec-preview.is-open .spec-preview-card { transform: none; }
@media (max-width: 900px) {
  .spec-preview { display: none !important; }
}

/* ---------- Testimonials: pause button gone, card-level pause ------------ */
.tm-pause, .i-play, .i-pause { display: none !important; }
.tm-marquee:hover .tm-track { animation-play-state: running; }
.tm-marquee.card-hover .tm-track { animation-play-state: paused; }

/* ======================================================================
   REV14 - topbar removed, nav right-aligned, header CTA removed
   ====================================================================== */

/* Topbar is stripped from the markup; this is a safety net. */
.topbar { display: none !important; }

/* Header now sits flush against the top of the viewport (was top:40px to
   clear the topbar). */
.site-header { top: 0 !important; }

/* Push the nav to the right edge now that the CTA no longer holds it there. */
.site-header .container { justify-content: flex-start; }
.main-nav { margin-left: auto; }
.header-cta { display: none !important; }

/* Reclaim the 40px the topbar used to occupy. Scoped to desktop so the
   existing <=900px clearances stay untouched. */
@media (min-width: 901px) {
  .hero { padding-top: 138px; }
  .page-hero { padding-top: 156px; }
  .faq-hero { padding-top: 138px; }
  main > section:first-child:not(.hero):not(.page-hero):not(.faq-hero) {
    padding-top: 150px;
  }
}

/* ======================================================================
   REV15 - hero backdrop gradient, ASRM always colour, testimonial
           direction flipped to match the specialties marquee
   ====================================================================== */

/* NOTE: the reference gradient belongs on the headline text, not the hero
   backdrop. It now lives in rev16.css. Removing the override that sat here
   restores the hero video and its original translucent navy scrim. */

/* ---------- Association logos -------------------------------------------- */
/* ASRM stays in full colour at rest instead of desaturated. */
.assoc-item img {
  filter: grayscale(0) !important;
  opacity: 1 !important;
}

/* Grow on hover (and colour up, which also covers ASRM). */
.assoc-item img:hover {
  filter: grayscale(0) !important;
  opacity: 1 !important;
  transform: scale(1.12) !important;
}

/* ---------- Testimonial marquee direction -------------------------------- */
/* Redefining the keyframes here wins over the earlier declaration, so the
   track now travels right-to-left exactly like specScroll. */
@keyframes tmScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ======================================================================
   REV16 - headline text gradient from the supplied reference image
   ====================================================================== */

/* Same stops sampled from the reference, applied to the headline run
   "Innovate. Elevate." instead of the hero backdrop. Vertical, matching the
   orientation of the reference image. Only background-image is redeclared -
   the background-clip / transparent-fill setup from rev13.css still applies. */
.hero-display .hd-line--grad {
    background-image: linear-gradient(180deg, #050505 0%, #1128aa 35%);
}

/* ---------- Responsive --------------------------------------------------- */
/* ===================== REV18 - mobile responsiveness ===================== */

/* 1. RCM orbit stage cards spilled 183px past their container on phones.
      The <=640px rule already sets height:auto, but .rcm-orbit--xl (line 943)
      has higher specificity and re-locked the box to a square, so the 13 cards
      overflowed and collided with the section below.
      Scoped to <=640px ONLY: between 641-900px the nodes are still absolutely
      positioned around a circular orbit, and height:auto would collapse it. */
@media (max-width: 640px) {
  .mp-orbit,
  .rcm-orbit-sec .mp-orbit,
  .rcm-orbit--xl .mp-orbit {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .mp-node,
  .rcm-orbit--xl .mp-node {
    width: auto !important;
    height: auto !important;
    min-height: 60px;
  }
  .mp-node-dot { flex: 0 0 auto; }
  .mp-node-lbl { font-size: 12px; line-height: 1.3; }
}

/* 2. Mobile menu: content ran 1088px tall inside an 844px viewport, leaving the
      last links past the fold. Tighten spacing and guarantee scrolling. */
@media (max-width: 900px) {
  .mobile-menu {
    padding-top: 0 !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  .mobile-menu-inner {
    padding-top: 84px !important;
    padding-bottom: 48px;
    gap: 14px;
  }
}

/* 4. Photo heroes bled 4-6px past the viewport edge (scale(1.03) on an
      inset:0 layer). Contain the bleed rather than remove the effect. */
.page-hero--photo, .faq-hero { overflow: hidden; }

/* ============ REV19 - taller hero, centred copy, soft light wash ============ */

/* 1. Taller hero. Copy is centred horizontally and pinned to the lower third
      so it sits below the researcher's face in the video. */
.hero.hero--media {
  min-height: 92vh;
  display: flex;
  align-items: flex-end;
  padding-bottom: 9vh;
}
.hero.hero--media > .container { width: 100%; }
.hero--media .hero-inner {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 980px;
}
.hero--media .hero-cta { justify-content: center !important; }
.hero--media .hero-inner .sub {
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (min-width: 901px) {
  .hero.hero--media { min-height: 100vh; padding-bottom: 10vh; }
}
@media (max-width: 640px) {
  .hero.hero--media { min-height: 86vh; padding-bottom: 7vh; }
}

/* --- REV19b: lift the footage so the researcher sits higher, freeing the
       lower half of the frame for the copy, then tighten the copy block. --- */
.hero.hero--media .hero-media { overflow: hidden; }
.hero.hero--media .hero-video {
  position: absolute;
  left: 0;
  width: 100%;
  height: 122%;
  top: -22%;
  object-fit: cover;
  object-position: center top;
}
@media (min-width: 901px) {
  .hero.hero--media { padding-bottom: 6vh; }
  .hero--media .hero-inner h1 { margin-bottom: 18px !important; }
  .hero--media .hero-inner .sub {
    margin-bottom: 30px !important;
    font-size: 30px;
    font-weight: 500;
    max-width: 720px;
  }
}
@media (max-width: 900px) {
  .hero.hero--media .hero-video { height: 114%; top: -14%; }
}

/* --- REV19c: phones crop the footage to a narrow centre strip, so the
       researcher fills the frame. Lift the video further and compact the copy
       so it still lands below her face. --- */
@media (max-width: 640px) {
  .hero.hero--media { min-height: 92vh; padding-bottom: 5vh; }
  .hero.hero--media .hero-video { height: 134%; top: -34%; }
  .hero--media .hero-inner h1 {
    font-size: 34px !important;
    line-height: 1.06 !important;
    margin-bottom: 14px !important;
  }
  .hero--media .hero-inner .sub {
    font-size: 15px !important;
    line-height: 1.5 !important;
    max-width: 340px;
    margin-bottom: 20px !important;
  }
  .hero--media .hero-cta { gap: 10px; }
  .hero--media .hero-cta .btn {
    padding: 12px 18px !important;
    font-size: 14px !important;
  }
}

/* ============================= REV20 ============================= */

/* Hero CTA row: centred, with breathing room beneath it. */
.hero--media .hero-cta {
  justify-content: center !important;
  margin-bottom: 50px;
}

/* Mobile: the toggle sat right next to the logo because REV14 set the header
   container to flex-start, and the desktop nav that carried margin-left:auto
   is hidden below 900px. Push the toggle to the far right edge. */
@media (max-width: 900px) {
  .site-header .container { justify-content: space-between !important; }
  .site-header .menu-toggle { margin-left: auto !important; margin-right: 0; }
}

/* ============================= REV21 ============================= */

/* Home hero heading: flat #1128aa. The headline was painted with a gradient
   clipped to the text (background-clip:text + transparent fill), so the fill
   has to be reset as well or the colour would never show. */
.hero--media .hero-display .hd-line--grad,
.hero--media .hero-display .hd-line--grad .hd-w1,
.hero--media .hero-display .hd-line--grad .hd-w2,
.hero--media .hero-display .hd-w3 {
  background: none;
  background-image: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: #1128aa;
  -webkit-text-fill-color: #1128aa;
}

/* Remove the hover effect from the large white button only. Restates the
   resting values so .btn-white:hover cannot repaint it, and cancels the
   inherited lift/shadow. Small and extra-large white buttons are untouched. */
.btn.btn-white.btn-lg:hover,
.btn.btn-white.btn-lg:focus-visible {
  background: #fff;
  color: var(--primary);
  border-color: var(--border);
  box-shadow: none;
  transform: none;
}

/* ============================= REV22 =============================
   Home hero headline: single line + full-width text gradient
   (primary -> secondary -> accent), and navy RCM orbit core.
   ================================================================= */

/* The hero sits on top of looping video footage (assets/video/hero.webm) that
   is bright in its lower half, so the clipped gradient needs a scrim behind it
   and the old dark text-shadow has to go, otherwise the navy stop disappears. */

/* Wider hero container so the enlarged headline still fits on one line. */
.hero.hero--media > .container { max-width: min(1680px, 96vw); }

.hero--media .hero-display {
  display: block;
  white-space: nowrap;
  font-size: clamp(28px, 4.9vw, 84px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.02 !important;
  margin-bottom: 24px !important;
  --tw-gradient-position: to right;
  background-image: linear-gradient(
    to right,
    hsl(var(--c-primary)) 0%,
    hsl(var(--c-secondary)) 50%,
    hsl(var(--c-accent)) 100%
  ) !important;
  -webkit-background-clip: text;
  background-clip: text !important;
  color: #1128aa !important;
  -webkit-text-fill-color: #1128aa !important;
}

.hero--media .hero-display .hd-line,
.hero--media .hero-display .hd-line--grad,
.hero--media .hero-display .hd-w1,
.hero--media .hero-display .hd-w2,
.hero--media .hero-display .hd-w3 {
  display: inline !important;
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

.hero--media .hero-display .hd-line + .hd-line::before {
  content: " ";
}

/* Phones: the REV19c rule forces 34px with !important, which would break the
   single-line headline on narrow screens. */
@media (max-width: 640px) {
  .hero--media .hero-inner h1.hero-display {
    white-space: normal !important;
    font-size: 34px !important;
    line-height: 1.06 !important;
    margin-bottom: 20px !important;
  }
}

/* RCM orbit core -> brand navy */
.mp-orbit-center { background: #0b2b5b !important; }

/* ============================= REV23 =============================
   1. Home hero headline (.hero-anim.a-1.hero-display) -> flat #0b2b5b
   2. Logo always #0b2b5b (artwork itself is recoloured) + larger
   ================================================================= */

.hero-display,
.hero--media .hero-display,
h1.hero-anim.a-1.hero-display,
.hero--media .hero-inner h1.hero-display,
.hero-display .hd-line,
.hero-display .hd-line--grad,
.hero--media .hero-display .hd-line,
.hero--media .hero-display .hd-line--grad,
.hero-display .hd-w1,
.hero-display .hd-w2,
.hero-display .hd-w3,
.hero--media .hero-display .hd-w1,
.hero--media .hero-display .hd-w2,
.hero--media .hero-display .hd-w3 {
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  color: #0b2b5b !important;
  -webkit-text-fill-color: #0b2b5b !important;
}

/* Bigger header logo, always in brand navy (#0b2b5b) */
.site-header .brand img,
.site-header:not(.scrolled) .brand img,
.site-header.scrolled .brand img {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}
.site-header .brand img {
  height: 84px !important;
  width: auto;
  transition: height .3s ease;
}
.site-header.scrolled .brand img { height: 70px !important; }
@media (max-width: 900px) {
  .site-header .brand img,
  .site-header.scrolled .brand img { height: 62px !important; }
}
@media (max-width: 640px) {
  .site-header .brand img,
  .site-header.scrolled .brand img { height: 54px !important; }
}

/* Footer logo: keep the navy artwork legible on the navy footer */
.footer-brand img {
  height: 62px;
  width: auto;
  filter: brightness(0) invert(1);
}

/* ============================================================
   Footer social icons — brand gold (#d4a849)
   ============================================================ */
.footer-social {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}
.footer-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: #d4a849;
  line-height: 0;
  transition: transform .25s ease, opacity .25s ease;
}
.footer-social a:hover,
.footer-social a:focus-visible {
  transform: translateY(-2px);
  opacity: .88;
}
.footer-social .social-ico {
  display: block;
  width: 26px;
  height: 26px;
}
@media (max-width: 640px) {
  .footer-social a { width: 36px; height: 36px; }
  .footer-social .social-ico { width: 24px; height: 24px; }
}

/* ============================================================
   Header logo — white on inner pages, original color on scroll
   The landing page (body.home) keeps the logo in its brand
   colours at all times.
   ============================================================ */
.site-header .brand img,
.site-header .custom-logo-link img {
  transition: filter .3s ease, height .3s ease;
}
body:not(.home) .site-header:not(.scrolled) .brand img,
body:not(.home) .site-header:not(.scrolled) .custom-logo-link img {
  filter: brightness(0) invert(1) !important;
  -webkit-filter: brightness(0) invert(1) !important;
}
body:not(.home) .site-header.scrolled .brand img,
body:not(.home) .site-header.scrolled .custom-logo-link img {
  filter: none !important;
  -webkit-filter: none !important;
}

/* ============================================================
   Services page hero — CTA aligned to the far left
   .hero-cta is centred by default, so override it inside the
   photo hero where the copy is left-aligned.
   ============================================================ */
.page-hero .hero-cta,
.page-hero--photo .hero-cta {
  justify-content: flex-start !important;
}