@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* Accounting Assist legal pages -- narrow reading column, no sidebar */
body.page-id-100461 #secondary,
body.page-id-100466 #secondary {
  display: none;
}
body.page-id-100461 #primary,
body.page-id-100466 #primary {
  width: 100%;
  max-width: 100%;
  float: none;
}
body.page-id-100461 .entry-content,
body.page-id-100466 .entry-content {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* Accounting Assist legal pages -- hide Jetpack Share/Like widgets and theme post-edit link (2026-09-09 follow-up, authorized) */
body.page-id-100461 .sharedaddy,
body.page-id-100466 .sharedaddy,
body.page-id-100461 .entry-footer,
body.page-id-100466 .entry-footer {
  display: none;
}

/* ===================================================================
   BIICS.com Visual System REBUILD -- Day 5, 2026-09-13
   Owner: BIICS-SPEC-DevOps. Dispatched by LIFEOPS-EXEC / Burnette directly.
   REPLACES the entire Day 4 "Visual Design Upgrade" block below this point
   (that block is preserved verbatim for reference/rollback at
   day4-2026-09-13/01-additional-css-after-2026-09-13.css and
   day5-2026-09-13/00-additional-css-before-2026-09-13-day5.css).

   Real trigger: Day 4's incremental CSS additions (button shape, card
   shadow, hover states) did not change the page's fundamental character.
   Burnette, verbatim, second time: "what about this puts it in league
   with the other dynamic beautifully laid out pages with the use of
   white space and white backgrounds?" Root cause found by direct DOM/
   computed-style inspection this dispatch (not guessed):
     - <body> background-color was rgb(43,48,88) -- dark navy -- SITE-WIDE,
       not just the header. Every page on the site had a navy shell.
     - A full-bleed 1180x360 city-skyline <img> sits inside a
       `.site > div.hero` block (a Dara-theme "post thumbnail as hero"
       feature, distinct from the site's own real `section.hero`
       content block) on top of every page.
     - Site font was Yrsa, an ornate serif, applied via the theme to
       every heading and paragraph.
   All three fixed at the root below, not patched around.

   Second, live follow-up from Burnette this same dispatch: "is staging
   why the fuck are you guys moving like you are going to break
   something. Rip the shit down and build it up from the floor" (full
   authorization to replace structure, not just add to it) and "Thoe
   other pages are dynamic with moving elements and excitement...This
   shit is static" -- real scroll-triggered and hover motion added in
   section 10 below, not just static restyling.

   Staging only: https://biics.com
   Production biics.com untouched by this dispatch.
   =================================================================== */

/* ---- 0. Type system: replace the theme's serif (Yrsa) everywhere with a modern sans ---- */
html, body, .site, #page,
h1, h2, h3, h4, h5, h6,
p, a, li, span, input, button, textarea,
.site-title, .site-description, .entry-title, .page-title,
.main-navigation a, .btn {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

/* ---- 1. Kill the site-wide dark navy background -- the single biggest fix ---- */
html, body, .site, #page, #content, .content-area, #primary,
.site-content, .site-main, article, .entry-content {
  background-color: #ffffff !important;
}
body { color: #1a1f2b; }

/* ---- 2. Remove the dark skyline banner AND the separate Dara "featured image as hero" block ---- */
.custom-header { display: none !important; }
.site > div.hero { display: none !important; }
.site-header::after { content: none !important; }

/* ---- 3. Header / branding: compact, light, no dead space ---- */
.site-header {
  background: #ffffff !important;
  border-bottom: 1px solid #eceff3;
  position: static;
}
.site-branding {
  padding: 20px 24px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.site-branding .custom-logo {
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.site-title, .site-title a { color: #16619c !important; font-weight: 800 !important; font-size: 1.05rem; }
.site-description {
  color: #5b6674 !important;
  font-size: 0.95rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

/* ---- 4. Nav: light bar, navy text/links, solid navy CTA pill (replaces the old navy band) ---- */
.main-navigation {
  background: #ffffff !important;
  border-bottom: 1px solid #eceff3;
}
.main-navigation ul li a {
  color: #16619c !important;
  font-weight: 600 !important;
  position: relative;
}
.main-navigation ul li a::after {
  content: "";
  position: absolute; left: 0; bottom: -4px;
  width: 0%; height: 2px; background: #26a9e0;
  transition: width 0.25s ease;
}
.main-navigation ul li a:hover::after { width: 100%; }
.main-navigation ul > li:last-child > a {
  background: #16619c !important;
  color: #ffffff !important;
  padding: 10px 24px !important;
  border-radius: 999px;
  font-weight: 700 !important;
  margin-left: 8px;
  display: inline-block;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.main-navigation ul > li:last-child > a::after { display: none; }
.main-navigation ul > li:last-child > a:hover {
  background: #124e7e !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(22,97,156,0.3);
}

/* ---- 5. Footer: light, not navy ---- */
.site-footer, #colophon, .site-info {
  background: #f6f8fb !important;
  border-top: 1px solid #eceff3;
  color: #5b6674 !important;
}
.site-footer a { color: #16619c !important; }

/* ---- 6. Typography scale -- confident sans, not ornate serif ---- */
.hero h1 {
  font-size: clamp(2.4rem, 4vw, 3.4rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em;
  color: #16619c !important;
}
.hero .hero-subhead { font-size: 1.2rem; color: #444c5a; max-width: 760px; }
.hero .hero-heritage { color: #16619c; font-weight: 600; letter-spacing: 0.02em; }
.entry-content > section h2 {
  font-size: clamp(1.7rem, 2.6vw, 2.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em;
  color: #16619c !important;
  margin-bottom: 0.6rem !important;
}
.entry-content > section h2::before {
  content: "";
  display: block;
  width: 56px; height: 4px;
  background: #16619c;
  margin-bottom: 16px;
  border-radius: 2px;
}
.entry-content > section h3 { font-weight: 700 !important; color: #16619c !important; }
.entry-content p { color: #444c5a; font-size: 1.05rem; line-height: 1.7; }

body.home .entry-header { display: none; }
.entry-header .entry-title {
  font-size: clamp(2rem, 3.2vw, 2.75rem) !important;
  font-weight: 800 !important;
  color: #16619c !important;
  letter-spacing: -0.02em;
}

/* ---- 7. Section rhythm: generous whitespace, alternating white / near-white ---- */
.entry-content > section {
  padding-top: 104px !important;
  padding-bottom: 104px !important;
}
.entry-content > section:nth-of-type(even) { background: #f6f8fb !important; }
.entry-content > section.hero { padding-top: 120px !important; padding-bottom: 96px !important; }

/* ---- 8. Hero: replace the static skyline photo with a soft animated abstract backdrop ---- */
.entry-content > section.hero {
  position: relative;
  overflow: hidden;
  background: #ffffff !important;
}
.entry-content > section.hero::before {
  content: "";
  position: absolute; top: -20%; right: -10%;
  width: 60vw; height: 60vw; max-width: 820px; max-height: 820px;
  background: radial-gradient(circle, rgba(28,67,108,0.10) 0%, rgba(28,67,108,0.03) 55%, rgba(28,67,108,0) 75%);
  border-radius: 50%;
  animation: hero-drift 16s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
.entry-content > section.hero > * { position: relative; z-index: 1; }
.hero h1, .hero .hero-subhead, .hero .hero-heritage {
  text-shadow: 0 2px 22px rgba(255,255,255,0.9), 0 1px 4px rgba(255,255,255,0.95);
}
@keyframes hero-drift {
  0%   { transform: translate(0,0) scale(1); }
  100% { transform: translate(-40px, 30px) scale(1.08); }
}

/* ---- 9. Cards, buttons, logos: real depth + motion ---- */
.service-line-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 28px !important;
}
.service-line-card {
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-top: 4px solid #16619c;
  border-radius: 10px;
  padding: 32px 26px !important;
  box-shadow: 0 1px 3px rgba(15,26,46,0.06);
  transition: transform 0.25s cubic-bezier(.2,.8,.3,1), box-shadow 0.25s ease, border-color 0.25s ease;
}
.service-line-card:hover {
  transform: translateY(-8px) scale(1.015);
  box-shadow: 0 22px 38px rgba(15,26,46,0.18);
}
.service-line-card .icon-slot {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: #eaf0f6;
  margin-bottom: 16px;
  transition: transform 0.25s ease, background 0.25s ease;
}
.service-line-card:hover .icon-slot { transform: scale(1.1); background: #dbe6f0; }
.service-line-card .service-subtitle { color: #5b6674; }

.btn, a.btn {
  border-radius: 999px !important;
  padding: 15px 34px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase;
  font-size: 0.82rem !important;
  transition: transform 0.2s cubic-bezier(.2,.8,.3,1), box-shadow 0.2s ease, background 0.2s ease !important;
}
.btn:hover, a.btn:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 14px 28px rgba(15,26,46,0.22);
}

.client-logo-strip img {
  filter: grayscale(100%);
  opacity: 0.7;
  transition: filter 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}
.client-logo-strip img:hover { filter: grayscale(0%); opacity: 1; transform: scale(1.06); }

/* ---- 10. Real motion: native CSS scroll-triggered reveals + staged hero entrance ---- */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .entry-content > section {
      animation: reveal-up linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 25%;
    }
    .service-line-card {
      animation: reveal-up linear both;
      animation-timeline: view();
      animation-range: entry 10% cover 35%;
    }
  }
  @keyframes reveal-up {
    from { opacity: 0; transform: translateY(36px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .hero h1            { animation: fade-up 0.7s 0.05s cubic-bezier(.2,.8,.2,1) both; }
  .hero .hero-subhead { animation: fade-up 0.7s 0.20s cubic-bezier(.2,.8,.2,1) both; }
  .hero .hero-heritage{ animation: fade-up 0.7s 0.30s cubic-bezier(.2,.8,.2,1) both; }
  .hero-ctas .btn:nth-child(1) { animation: fade-up 0.7s 0.40s cubic-bezier(.2,.8,.2,1) both; }
  .hero-ctas .btn:nth-child(2) { animation: fade-up 0.7s 0.50s cubic-bezier(.2,.8,.2,1) both; }
  @keyframes fade-up {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* ---- 11. Mobile ---- */
@media (max-width: 480px) {
  .entry-content > section { padding-top: 56px !important; padding-bottom: 56px !important; }
  .entry-content > section h2 { font-size: 1.6rem !important; }
  .site-branding { flex-direction: column; }
}


/* ===================================================================
   BIICS.com Visual System -- Day 5, PASS 2 (same day, 2026-09-13)
   Owner: BIICS-SPEC-DevOps. Dispatched by LIFEOPS-EXEC -- fourth pass on
   the hero specifically, with concrete, confirmed-live problems instead
   of vague direction. Burnette, verbatim across this dispatch: "Nothing
   exciting on the landing page... Or logo is minimized, like what the
   fuck. The whole landing page is BORING." / "The 'Trusted accross
   Florida....' line seems very limiting." / "Overall font is way too
   small for a fucking landing page." / on TEKsystems' hero: "when you
   scroll on teksystems page their moving graphic expands and take over
   the whole page. This some cool shit!" -- then relaxed to a real-
   judgment brief, not a literal clone: "I don't need to be exactly like
   them... build for [genuinely current, not embarrassingly dated]." /
   on McKinsey: "shit dances a bit onto the page with large tiles and the
   tiles expand when you hover." / "Almost magazine like, with heavy
   graphics and images." / confirming the scroll-reveal direction:
   "Things appear after you scroll to sections, so you see them appear.
   Excitement!" Plus two real logo-grid bugs from Burnette: the Florida
   Department of Revenue logo not colorizing on hover like its 10
   siblings, and all 11 logos needing to be "slightly larger and a
   little better spaced out."

   REAL ROOT CAUSE FOUND THIS PASS, not guessed: the Dara theme's own
   style.css sets `html { font-size: 62.5%; }` site-wide (confirmed via
   direct stylesheet inspection: document.styleSheets[12], ownerNode id
   "dara-style-css"). Every rem-based size declared in the Day 5 Pass 1
   block above was authored assuming a normal 16px root, so it was
   silently rendering at 62.5% of the intended size this entire time --
   e.g. `.hero .hero-subhead { font-size: 1.2rem }` was rendering at
   12px, not 19.2px, and `.btn { font-size: 0.82rem }` at 8.2px, not
   13.1px. Confirmed live via getComputedStyle before touching anything
   (`getComputedStyle(document.documentElement).fontSize` was "10px").
   This, not a subjective "make it bigger" guess, is the real reason
   "everything is too small."

   Second real root cause, this pass: the Florida Department of Revenue
   logo's own PNG source file is genuinely monochrome -- verified by
   drawing it to a canvas and sampling pixel data: max R/G/B channel
   difference across the whole image was 0 (flat gray), vs. 186-217 on
   sibling logos with real color. The site-wide `filter: grayscale(100%)`
   -> `grayscale(0%)` hover effect can only reveal color that exists in
   the source pixels -- there is none in this file, so no CSS fix alone
   can make it colorize like its siblings. Handled below without
   pretending otherwise (see P2-8); a real fix needs a real color source
   file, which is a download-permission decision, not made unilaterally
   here.

   These rules are appended after, not merged into, the Day 5 Pass 1
   block above, so the diff/audit trail stays legible -- later source
   order wins the cascade for shared selectors; nothing above is deleted.
   Staging only: https://biics.com
   =================================================================== */

/* ---- P2-0. ROOT FIX: restore a normal 16px rem base site-wide ----
   This single line is why every size below reads dramatically larger
   than Pass 1 without every value having to be individually inflated. */
html { font-size: 100% !important; }

/* ---- P2-1. Confident landing-page type scale (on top of the root fix) ---- */
.hero h1 {
  font-size: clamp(2.75rem, 5vw, 4.5rem) !important;
  line-height: 1.05 !important;
}
.hero .hero-subhead { font-size: 1.3rem !important; line-height: 1.6; max-width: 720px; }
.hero .hero-heritage {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.entry-content p { font-size: 1.125rem !important; line-height: 1.75 !important; }
.entry-content > section h3 { font-size: 1.2rem !important; }
.section-eyebrow {
  font-size: 1rem !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.service-subtitle { font-size: 1.02rem !important; line-height: 1.6; }
.site-description { font-size: 1.05rem !important; }
.main-navigation ul li a { font-size: 0.92rem !important; padding-left: 1px !important; padding-right: 1px !important; }
.btn, a.btn { font-size: 1rem !important; padding: 17px 38px !important; }

/* ---- P2-2. Nav: absorb the type-scale bump without re-wrapping ---- */
.main-navigation { max-width: 100%; }
.main-navigation ul { max-width: 100%; }
.main-navigation ul li { margin: 0 1px; }
.main-navigation { padding-left: 8px !important; padding-right: 8px !important; }
.main-navigation ul > li:last-child > a { padding: 9px 20px !important; margin-left: 4px; }

/* ---- P2-3. Logo: real, meaningful header presence, not a floating crest ---- */
.site-branding .custom-logo {
  max-height: 108px !important;
}
.site-branding { padding: 18px 24px !important; gap: 18px; }
.site-title, .site-title a { font-size: 1.3rem !important; }

/* ---- P2-4. Hero: bold animated gradient mesh + moving texture, ON LOAD,
   independent of scroll-timeline support -- not another subtle blob. ---- */
.entry-content > section.hero {
  min-height: 640px;
}
.entry-content > section.hero::before {
  top: -30%; right: -20%; left: -10%; bottom: -20%;
  width: auto; height: auto; max-width: none; max-height: none;
  background:
    radial-gradient(circle at 20% 30%, rgba(28,67,108,0.92) 0%, rgba(28,67,108,0) 55%),
    radial-gradient(circle at 80% 15%, rgba(14,140,150,0.85) 0%, rgba(14,140,150,0) 58%),
    radial-gradient(circle at 60% 80%, rgba(18,48,77,0.88) 0%, rgba(18,48,77,0) 58%),
    radial-gradient(circle at 10% 85%, rgba(95,220,225,0.70) 0%, rgba(95,220,225,0) 55%),
    radial-gradient(circle at 45% 45%, rgba(35,95,150,0.55) 0%, rgba(35,95,150,0) 60%);
  filter: blur(3px) saturate(1.3);
  border-radius: 0;
  animation: hero-drift 14s ease-in-out infinite alternate;
}
.entry-content > section.hero::after {
  content: "";
  position: absolute; inset: -10%;
  background-image: radial-gradient(rgba(18,48,77,0.16) 1.5px, transparent 1.5px);
  background-size: 28px 28px;
  animation: hero-grid-drift 22s linear infinite;
  pointer-events: none;
  z-index: 0;
  opacity: 0.5;
}
@keyframes hero-drift {
  0%   { transform: translate(0,0) scale(1) rotate(0deg); }
  100% { transform: translate(-60px, 40px) scale(1.18) rotate(6deg); }
}
@keyframes hero-grid-drift {
  0%   { background-position: 0 0; }
  100% { background-position: 140px 90px; }
}

@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-drift 14s ease-in-out infinite alternate,
               hero-grow linear both;
    animation-timeline: auto, view();
    animation-range: auto, entry 0% cover 70%;
  }
  @keyframes hero-grow {
    from { transform: scale(1); opacity: 1; }
    to   { transform: scale(1.55); opacity: 1; }
  }
  .entry-content > section.hero {
    animation: none !important;
    animation-timeline: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ---- P2-5. Substantial CTAs -- solid presence at rest, not just on hover ---- */
.hero-ctas .btn {
  font-size: 1.05rem !important;
  padding: 20px 44px !important;
  box-shadow: 0 10px 26px rgba(18,48,77,0.22);
}
.hero-ctas .btn:hover { box-shadow: 0 20px 38px rgba(18,48,77,0.32); }

/* ---- P2-6. Card grid: real staggered entrance + genuine hover-expand ---- */
.service-line-card:hover {
  transform: translateY(-10px) scale(1.045);
}
@supports (animation-timeline: view()) {
  .service-line-card:nth-child(1) { animation-range: entry 0% cover 30%; }
  .service-line-card:nth-child(2) { animation-range: entry 4% cover 34%; }
  .service-line-card:nth-child(3) { animation-range: entry 8% cover 38%; }
  .service-line-card:nth-child(4) { animation-range: entry 12% cover 42%; }
  .service-line-card:nth-child(5) { animation-range: entry 16% cover 46%; }
}

/* ---- P2-7. Every section's reveal made real and noticeable ---- */
.entry-content > section:not(.hero),
.client-logo-strip,
.industries-marquee,
.closing-cta {
  animation-duration: 900ms;
}
@supports (animation-timeline: view()) {
  .entry-content > section:not(.hero) {
    animation: reveal-up-strong ease-out both;
    animation-timeline: view();
    animation-range: entry 0% cover 30%;
  }
}
@keyframes reveal-up-strong {
  from { opacity: 0; transform: translateY(56px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---- P2-8. Client logo grid: real sizing/spacing bump + honest handling
   of the one genuinely monochrome source file (Florida Dept. of Revenue). ---- */
.logo-grid { gap: 26px 40px !important; }
.client-logo-strip .logo-item img {
  max-height: 68px !important;
  max-width: 190px !important;
}
.logo-item[data-name="Florida Department of Revenue"] img {
  filter: grayscale(100%) !important;
  opacity: 0.85 !important;
  transition: transform 0.25s ease, filter 0.25s ease, opacity 0.25s ease;
}
.logo-item[data-name="Florida Department of Revenue"]:hover img {
  filter: grayscale(100%) contrast(1.15) !important;
  opacity: 1 !important;
  transform: scale(1.06);
}

/* ---- P2-9. Mobile ---- */
@media (max-width: 600px) {
  .hero h1 { font-size: clamp(2.1rem, 8vw, 2.6rem) !important; }
  .site-branding .custom-logo { max-height: 76px !important; }
  .entry-content > section.hero { min-height: 480px; }
}


/* ===================================================================
   BIICS.com Visual System -- Day 6, 2026-09-13 (ROUND 5 hero fix +
   real-time fast-follow corrections from Burnette, relayed mid-dispatch)
   Owner: BIICS-SPEC-DevOps. Dispatched by LIFEOPS-EXEC.
   Staging only: https://biics.com

   Root cause confirmed via getBoundingClientRect before any change:
   at 1510px viewport width, .hero section rendered 1070px wide, offset
   212px from the left edge -- a bounded, inset gradient card, not a
   full-bleed background, exactly Burnette's literal complaint against
   the 9 reference sites (McKinsey/Sogeti/Kyra/EY/Booz Allen/AHS/North
   Highland/Deloitte/Accenture all use edge-to-edge hero backgrounds).
   =================================================================== */

/* ---- D6-1. TRUE full-bleed hero: break the SECTION itself out of the
   theme's centered content container. Content children (h1/subhead/
   heritage/CTAs -- no wrapper div exists) re-constrained to the normal
   reading column so only the BACKGROUND bleeds edge-to-edge. ---- */
html, body { overflow-x: hidden !important; }

.entry-content > section.hero {
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box;
  overflow: hidden;
  background: #0e1e30 !important;
}
.entry-content > section.hero > * {
  max-width: 1100px;
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* ---- D6-2. Real stock photography replaces the generative-only
   gradient mesh -- Burnette: "Go grab some fucking stock photos that
   say technology... kill this layout for real this time." Source:
   Pexels (free commercial-use license), photographer credited in
   biics_website_redesign/assets/stock-photos/README.md. Dark navy/teal
   gradient overlay carries the headline text (EY/Deloitte/McKinsey
   pattern); slow continuous Ken Burns pan/zoom for real motion. ---- */
.entry-content > section.hero::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100%; height: 100%;
  max-width: none; max-height: none;
  background:
    linear-gradient(120deg, rgba(12,26,42,0.92) 0%, rgba(18,48,77,0.84) 45%, rgba(14,60,80,0.74) 100%),
    url('https://biics.com/wp-content/uploads/2026/09/hero-datacenter-1181316.jpg');
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  filter: none;
  border-radius: 0;
  animation: hero-kenburns 26s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
.entry-content > section.hero::after { content: none !important; }
@keyframes hero-kenburns {
  0%   { transform: scale(1) translate(0, 0); }
  100% { transform: scale(1.12) translate(-2%, 1.5%); }
}
@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-kenburns 26s ease-in-out infinite alternate,
               hero-grow linear both;
    animation-timeline: auto, view();
    animation-range: auto, entry 0% cover 70%;
  }
  @keyframes hero-grow {
    from { transform: scale(1); }
    to   { transform: scale(1.22); }
  }
  .entry-content > section.hero {
    animation: none !important;
    animation-timeline: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
.hero h1, .hero .hero-subhead, .hero .hero-heritage {
  color: #ffffff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,0.45), 0 1px 3px rgba(0,0,0,0.55) !important;
}
.hero .hero-subhead { color: #eaf0f6 !important; }

/* ---- D6-3. Subpage page-header: full-bleed navy band behind the title
   on every inner page (About/Services/Industries/etc.), so they stop
   reading as bare unstyled WordPress and tie into the homepage's visual
   system. Real, scoped baseline fix -- a full per-page content rebuild
   (cards/photography matching the homepage density) is separate,
   larger follow-up work, named explicitly in the dispatch report. ---- */
body:not(.home) .entry-header {
  display: block !important;
  position: relative;
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  box-sizing: border-box;
  padding: 72px 32px 56px !important;
  background: linear-gradient(120deg, #0e1e30 0%, #16619c 55%, #16619c 100%);
  overflow: hidden;
  margin-bottom: 0 !important;
}
body:not(.home) .entry-header::before {
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.10) 1.5px, transparent 1.5px);
  background-size: 26px 26px;
  animation: hero-grid-drift 24s linear infinite;
  opacity: 0.5;
  pointer-events: none;
}
body:not(.home) .entry-header .entry-title {
  color: #ffffff !important;
  max-width: 1100px;
  margin: 0 auto !important;
  position: relative;
  z-index: 1;
}

/* ---- D6-4. Client logo grid -> same card/icon visual language as the
   service-line cards, not a third disconnected UI pattern. Burnette:
   "why keep the grid list of customers if we are using icons on the
   first page?" Real logos stay (the one actual evidence-backed proof
   point) -- restyled into the same lift/shadow card treatment. ---- */
.client-logo-strip .logo-item {
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-radius: 10px;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgba(15,26,46,0.06);
  transition: transform 0.25s cubic-bezier(.2,.8,.3,1), box-shadow 0.25s ease, border-color 0.25s ease;
}
.client-logo-strip .logo-item:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 18px 30px rgba(15,26,46,0.14);
  border-color: #16619c;
}

/* ---- D6-5. Mobile guard for the new full-bleed rules ---- */
@media (max-width: 600px) {
  .entry-content > section.hero > * { padding-left: 20px; padding-right: 20px; }
  body:not(.home) .entry-header { padding: 48px 20px 36px !important; }
}


/* ---- D6-6. FIX, self-caught before reporting done: hero-grow (scroll-
   linked animation-timeline:view()) and hero-kenburns (always-on
   continuous pan/zoom) both targeted the SAME 'transform' property --
   per spec only one wins (replace compositing). Verified live: transform
   was frozen identical at t=0s and t=3s with zero scroll -- the scroll-
   linked one was silently winning and killing the continuous motion,
   reproducing the exact bug this round exists to fix. Force ONLY the
   continuous Ken Burns animation on the hero background. ---- */
@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-kenburns 26s ease-in-out infinite alternate !important;
    animation-timeline: auto !important;
  }
}


/* ---- D7-1. Brand triad callout, near the hero -- Burnette: "WEave in
   Enterprise Minded, Statutorily Fluent and Trusted Partner." Three-part
   pill/badge row under the UNDERSTAND.ADAPT.LEVERAGE. heritage line. ---- */
.hero .brand-triad {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 22px;
  padding: 0;
  list-style: none;
}
.hero .brand-triad span {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid rgba(255,255,255,0.45);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ffffff;
  background: rgba(255,255,255,0.08);
  backdrop-filter: blur(2px);
}

/* ---- D7-2. New homepage section headings added this pass -- match the
   existing h2 underline-accent treatment already used site-wide. ---- */
.entry-content > section .client-proof-heading {
  font-size: clamp(1.7rem, 2.6vw, 2.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em;
  color: #16619c !important;
  margin: 0 0 24px !important;
}
.entry-content > section .client-proof-heading::before {
  content: "";
  display: block;
  width: 56px; height: 4px;
  background: #16619c;
  margin-bottom: 16px;
  border-radius: 2px;
}


/* ---- D8-1. ROOT FIX for subpage full-bleed drift: real bug found by
   direct measurement on /services/ -- .entry-header's D6-3 full-bleed
   rule (100vw/-50vw) assumed its ancestor column was viewport-centered,
   true on the homepage but FALSE on standard inner pages, which render
   the theme's default WordPress sidebar (#secondary, real content:
   just a boilerplate "Search for:" widget, no real content) -- this
   pushes #primary left and narrower, breaking the vw-centering math.
   Verified live: .entry-header measured left:-102.67 right:1392.33
   against a 1495px viewport (should be 0/1495). Root cause fixed by
   removing the unused sidebar site-wide (not scoped to the two
   Accounting Assist pages anymore) so #primary is genuinely centered
   on every page, matching the homepage's own layout the full-bleed
   math already depends on. ---- */
#secondary { display: none !important; }
#primary {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}


/* ---- D8-2. Real root cause found on continued investigation: even
   after hiding #secondary and forcing #primary to 100%, .entry-header
   was STILL off (left:47.33 vs expected 0) -- traced by walking the
   full ancestor chain: #page.site itself (the theme's outermost
   wrapper) has its own max-width:1180px centered constraint,
   independent of the sidebar. Neutralize it site-wide so every
   ancestor up to <body> is genuinely full-width, matching what the
   vw-based full-bleed math on .entry-header (and .hero) requires. ---- */
.site, #page, #content, .site-content, .content-wrapper {
  max-width: 100% !important;
  width: 100% !important;
}


/* ---- D8-3. Final piece: .content-wrapper carries its own 150px left/
   right padding (the theme's own content-inset design), still pushing
   #primary/article off-center after D8-2 removed the outer max-width.
   Neutralize it too -- the redesign's own section-level padding
   (.entry-content > section rules) already provides real internal
   spacing, so this theme-level padding is now redundant on top of it. ---- */
.content-wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* ---- D9-1. Brand triad relocated to the white "Proven in government"
   section -- needs real bold presence on a light background, not the
   thin-outline treatment that worked on the dark hero photo. Solid
   navy fill, real weight, generous spacing. ---- */
.client-logo-strip .brand-triad {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.client-logo-strip .brand-triad span {
  display: inline-block;
  padding: 14px 30px;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #ffffff !important;
  background: linear-gradient(120deg, #16619c 0%, #16619c 100%);
  box-shadow: 0 8px 18px rgba(18,48,77,0.28);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.client-logo-strip .brand-triad span:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 26px rgba(18,48,77,0.36);
}

/* ---- D9-2. Simplified, centered "Proven in government" eyebrow -- the
   trailing " - the foundation for partners..." clause was dropped from
   the content itself; center the remaining short line. ---- */
.client-logo-strip .section-eyebrow {
  text-align: center !important;
}

/* Strategic staging preview: unpublished corrections */
#masthead{position:relative;padding:24px!important;min-height:210px;box-sizing:border-box}
#masthead .site-branding{padding:0 0 20px 130px!important;flex-direction:column;text-align:center;gap:8px}
#masthead .custom-logo-link{position:absolute;left:24px;top:24px;margin:0}
#masthead .custom-logo{width:100px!important;height:auto!important;max-height:145px!important}
#masthead .site-title a{font-size:28px!important;line-height:1.2}
#masthead .site-description{font-size:15px!important}
#site-navigation{padding-left:130px!important}
.entry-content>section{animation:none!important;opacity:1!important;transform:none!important;padding:72px 32px}
.hero h1,.hero p{text-shadow:none!important}
.hero h1{font-size:clamp(38px,5vw,68px)!important;line-height:1.08!important}
.hero .btn{border-radius:5px!important;text-decoration:none!important;font-size:15px!important}
.hero .btn-primary{background:#fff!important;color:#153450!important}
.hero .btn-secondary{background:transparent!important;color:#fff!important;border:2px solid #fff!important}
.service-line-grid{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:24px!important}
.service-line-card{grid-column:span 2;border-top:4px solid #16619c!important;border-radius:4px!important}
.service-line-card:nth-child(4){grid-column:2/span 2}
.service-line-card .icon-slot{width:42px!important;height:4px!important;border:0!important;border-radius:0!important;background:#38a7cb!important}
.case-studies:not(:has(p,a,img)),.social-proof:not(:has(p,a,img)),.insights-teaser:has(.insights-empty-state){display:none!important}
.tech-matrix .logo-grid img{display:block!important;visibility:visible!important;opacity:1!important;max-height:55px;filter:none!important}
.client-logo-strip .brand-triad span{background:transparent!important;box-shadow:none!important;color:#173b5e!important;border-radius:0!important;font-size:18px!important}
.entry-content a:focus-visible{outline:3px solid #23b8dd;outline-offset:4px}
@media(max-width:700px){#masthead .site-branding{padding-left:88px!important}#masthead .custom-logo{width:68px!important}#masthead .site-title a{font-size:22px!important}#masthead .site-description{font-size:13px!important}#site-navigation{padding-left:88px!important}.service-line-grid{grid-template-columns:1fr!important}.service-line-card,.service-line-card:nth-child(4){grid-column:auto!important}.entry-content>section{padding:48px 24px}.hero h1{font-size:38px!important}}
@media(prefers-reduced-motion:reduce){.entry-content *,.entry-content *::before{animation:none!important;transition:none!important}}

/* Keep tagline and company name together on desktop. */
@media(min-width:701px){#masthead .site-branding{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:18px!important;min-height:90px}#masthead .site-title,#masthead .site-description{margin:0!important;white-space:nowrap!important;flex:0 0 auto!important}#masthead .site-title a{font-size:clamp(18px,1.75vw,28px)!important}#masthead .site-description{font-size:clamp(11px,1.1vw,18px)!important}}

@media(min-width:901px){#masthead{min-height:230px!important;padding-top:16px!important;padding-bottom:16px!important}#masthead .site-branding{padding:0!important;min-height:52px!important;gap:16px!important}#masthead .site-title a{font-size:clamp(21px,2vw,32px)!important}#masthead .site-description{font-size:clamp(13px,1.25vw,20px)!important}#masthead .custom-logo-link{top:73px!important;left:24px!important}#masthead .custom-logo{width:100px!important;max-height:140px!important}#site-navigation{padding-left:130px!important;min-height:138px;display:flex;align-items:center;justify-content:center}#site-navigation ul.nav-menu{display:flex!important;flex-wrap:nowrap!important;align-items:center;justify-content:space-between;gap:14px!important;width:100%;margin:0!important}#site-navigation ul.nav-menu>li{margin:0!important;padding:0!important;float:none!important}#site-navigation ul.nav-menu>li::before{display:none!important}#site-navigation ul.nav-menu>li>a{font-size:12px!important;white-space:nowrap;padding:12px 0!important;letter-spacing:.04em!important}#site-navigation ul.nav-menu>li:last-child>a{padding:12px 16px!important}}

/* Technology cards: visible by default, progressive reveal where supported. */
.tech-matrix .logo-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;max-width:1180px;margin:36px auto 0!important;padding:0!important}.tech-matrix .logo-grid>li{display:flex!important;align-items:center;justify-content:center;min-height:115px;list-style:none;background:#fff;border:1px solid #dce6ed;border-radius:6px;padding:22px!important;margin:0!important;box-shadow:0 6px 18px #13324d08}.tech-matrix .logo-grid img{max-width:100%!important;max-height:58px!important;width:auto!important;height:auto!important;object-fit:contain}.tech-matrix h2::before{display:none!important}@supports(animation-timeline:view()){ @media(prefers-reduced-motion:no-preference){.tech-matrix .logo-grid>li{animation:biics-card-in linear both;animation-timeline:view();animation-range:entry 0% entry 90%}}}@keyframes biics-card-in{from{opacity:.15;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){.tech-matrix .logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.tech-matrix .logo-grid>li{min-height:90px;padding:16px!important}}

/* Unified centered brand rectangle: shield anchors both rows. */
@media(min-width:901px){#masthead{width:100%!important;max-width:1280px!important;margin:0 auto!important;padding:26px 32px!important;min-height:210px!important;display:grid!important;grid-template-columns:112px minmax(0,1fr);grid-template-rows:76px 76px;column-gap:28px;align-items:center}#masthead .site-branding{grid-column:2;grid-row:1;padding:0!important;min-height:0!important;width:100%!important;display:flex!important;justify-content:space-between!important;align-items:center!important;gap:12px!important}#masthead .custom-logo-link{position:absolute!important;left:32px!important;top:50%!important;transform:translateY(-50%);width:112px!important}#masthead .custom-logo{width:112px!important;max-height:152px!important}#masthead .site-title a{font-size:clamp(18px,1.85vw,28px)!important}#masthead .site-description{font-size:clamp(11px,1.05vw,16px)!important}#site-navigation{grid-column:2;grid-row:2;padding:0!important;margin:0!important;width:100%!important;min-height:0!important;border:0!important}#site-navigation .menu-primary-container{width:100%!important}#site-navigation ul.nav-menu{justify-content:space-between!important;gap:10px!important}#site-navigation ul.nav-menu>li>a{font-size:clamp(11px,1.1vw,15px)!important}#masthead::before,#masthead::after{display:none!important}}

/* Equal space above/below header; remove theme gap before hero. */
#masthead{margin-bottom:0!important}#content.site-content,.site-content .content-wrapper{padding-top:0!important;margin-top:0!important}.home .site-main,.home article,.home .entry-content{margin-top:0!important;padding-top:0!important}@media(min-width:901px){#masthead{padding-top:24px!important;padding-bottom:24px!important;min-height:200px!important;grid-template-rows:76px 76px!important}}

/* Requested tagline reveal and mobile navigation sizing. */
#masthead .site-title a{display:inline-block;animation:biics-tagline-words 1.35s steps(1,end) both!important}
@keyframes biics-tagline-words{0%{clip-path:inset(0 100% 0 0)}15%{clip-path:inset(0 58% 0 0)}48%{clip-path:inset(0 34% 0 0)}80%,100%{clip-path:inset(0)}}
@media(max-width:900px){#site-navigation .menu-toggle{width:auto!important;min-width:110px!important;padding:12px 20px!important;height:auto!important;line-height:1.3!important;white-space:nowrap!important}#masthead .site-title a{animation:none!important;clip-path:none!important}}
@media(prefers-reduced-motion:reduce){#masthead .site-title a{animation:none!important;clip-path:none!important}}
/* Remove redundant page-name banners on all subpages. */
body.page:not(.home) #primary .entry-header,body.page:not(.home) .site-main .entry-header,body.page:not(.home) article.page>header.entry-header{display:none!important;margin:0!important;padding:0!important}
/* Remove WordPress likes and inline editing from public page design. */
.entry-content .sharedaddy.sd-like,.entry-content .jetpack-likes-widget-wrapper,.entry-footer .edit-link{display:none!important}
/* Preserve moved Accelerator layout. */
.biics-moved-section .accelerator-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;list-style:none;margin:30px 0;padding:0}.biics-moved-section .accelerator-flow li{border-left:3px solid #29466b;padding-left:18px}.biics-moved-section .accelerator-flow .stage{font-weight:700;color:#29466b}.biics-moved-section .accelerator-flow p{margin-top:10px}@media(max-width:700px){.biics-moved-section .accelerator-flow{grid-template-columns:1fr}}
/* Mobile menu remains readable in both toggle states. */
@media(max-width:900px){#site-navigation .menu-toggle,#site-navigation.toggled .menu-toggle{background:#16619c!important;color:#fff!important;opacity:1!important;border:0!important;border-radius:4px!important}}
/* M07 follow-up: instant section tabs under reduced motion. */
@media (prefers-reduced-motion: reduce) {
 html body .home-section-tabs, html body .biics-subtabs,
 html body .home-section-tabs *, html body .biics-subtabs *,
 html body .home-section-tabs *::before, html body .home-section-tabs *::after,
 html body .biics-subtabs *::before, html body .biics-subtabs *::after {
  transition: none !important;
  animation: none !important;
 }
}

   day4-2026-09-13/01-additional-css-after-2026-09-13.css and
   day5-2026-09-13/00-additional-css-before-2026-09-13-day5.css).

   Real trigger: Day 4's incremental CSS additions (button shape, card
   shadow, hover states) did not change the page's fundamental character.
   Burnette, verbatim, second time: "what about this puts it in league
   with the other dynamic beautifully laid out pages with the use of
   white space and white backgrounds?" Root cause found by direct DOM/
   computed-style inspection this dispatch (not guessed):
     - <body> background-color was rgb(43,48,88) -- dark navy -- SITE-WIDE,
       not just the header. Every page on the site had a navy shell.
     - A full-bleed 1180x360 city-skyline <img> sits inside a
       `.site > div.hero` block (a Dara-theme "post thumbnail as hero"
       feature, distinct from the site's own real `section.hero`
       content block) on top of every page.
     - Site font was Yrsa, an ornate serif, applied via the theme to
       every heading and paragraph.
   All three fixed at the root below, not patched around.

   Second, live follow-up from Burnette this same dispatch: "is staging
   why the fuck are you guys moving like you are going to break
   something. Rip the shit down and build it up from the floor" (full
   authorization to replace structure, not just add to it) and "Thoe
   other pages are dynamic with moving elements and excitement...This
   shit is static" -- real scroll-triggered and hover motion added in
   section 10 below, not just static restyling.

   Staging only: https://biics.com
   Production biics.com untouched by this dispatch.
   =================================================================== */

/* ---- 0. Type system: replace the theme's serif (Yrsa) everywhere with a modern sans ---- */
html, body, .site, #page,
h1, h2, h3, h4, h5, h6,
p, a, li, span, input, button, textarea,
.site-title, .site-description, .entry-title, .page-title,
.main-navigation a, .btn {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

/* ---- 1. Kill the site-wide dark navy background -- the single biggest fix ---- */
html, body, .site, #page, #content, .content-area, #primary,
.site-content, .site-main, article, .entry-content {
  background-color: #ffffff !important;
}
body { color: #1a1f2b; }

/* ---- 2. Remove the dark skyline banner AND the separate Dara "featured image as hero" block ---- */
.custom-header { display: none !important; }
.site > div.hero { display: none !important; }
.site-header::after { content: none !important; }

/* ---- 3. Header / branding: compact, light, no dead space ---- */
.site-header {
  background: #ffffff !important;
  border-bottom: 1px solid #eceff3;
  position: static;
}
.site-branding {
  padding: 20px 24px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.site-branding .custom-logo {
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.site-title, .site-title a { color: #16619c !important; font-weight: 800 !important; font-size: 1.05rem; }
.site-description {
  color: #5b6674 !important;
  font-size: 0.95rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

/* ---- 4. Nav: light bar, navy text/links, solid navy CTA pill (replaces the old navy band) ---- */
.main-navigation {
  background: #ffffff !important;
  border-bottom: 1px solid #eceff3;
}
.main-navigation ul li a {
  color: #16619c !important;
  font-weight: 600 !important;
  position: relative;
}
.main-navigation ul li a::after {
  content: "";
  position: absolute; left: 0; bottom: -4px;
  width: 0%; height: 2px; background: #26a9e0;
  transition: width 0.25s ease;
}
.main-navigation ul li a:hover::after { width: 100%; }
.main-navigation ul > li:last-child > a {
  background: #16619c !important;
  color: #ffffff !important;
  padding: 10px 24px !important;
  border-radius: 999px;
  font-weight: 700 !important;
  margin-left: 8px;
  display: inline-block;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.main-navigation ul > li:last-child > a::after { display: none; }
.main-navigation ul > li:last-child > a:hover {
  background: #124e7e !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(22,97,156,0.3);
}

/* ---- 5. Footer: light, not navy ---- */
.site-footer, #colophon, .site-info {
  background: #f6f8fb !important;
  border-top: 1px solid #eceff3;
  color: #5b6674 !important;
}
.site-footer a { color: #16619c !important; }

/* ---- 6. Typography scale -- confident sans, not ornate serif ---- */
.hero h1 {
  font-size: clamp(2.4rem, 4vw, 3.4rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em;
  color: #16619c !important;
}
.hero .hero-subhead { font-size: 1.2rem; color: #444c5a; max-width: 760px; }
.hero .hero-heritage { color: #16619c; font-weight: 600; letter-spacing: 0.02em; }
.entry-content > section h2 {
  font-size: clamp(1.7rem, 2.6vw, 2.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em;
  color: #16619c !important;
  margin-bottom: 0.6rem !important;
}
.entry-content > section h2::before {
  content: "";
  display: block;
  width: 56px; height: 4px;
  background: #16619c;
  margin-bottom: 16px;
  border-radius: 2px;
}
.entry-content > section h3 { font-weight: 700 !important; color: #16619c !important; }
.entry-content p { color: #444c5a; font-size: 1.05rem; line-height: 1.7; }

body.home .entry-header { display: none; }
.entry-header .entry-title {
  font-size: clamp(2rem, 3.2vw, 2.75rem) !important;
  font-weight: 800 !important;
  color: #16619c !important;
  letter-spacing: -0.02em;
}

/* ---- 7. Section rhythm: generous whitespace, alternating white / near-white ---- */
.entry-content > section {
  padding-top: 104px !important;
  padding-bottom: 104px !important;
}
.entry-content > section:nth-of-type(even) { background: #f6f8fb !important; }
.entry-content > section.hero { padding-top: 120px !important; padding-bottom: 96px !important; }

/* ---- 8. Hero: replace the static skyline photo with a soft animated abstract backdrop ---- */
.entry-content > section.hero {
  position: relative;
  overflow: hidden;
  background: #ffffff !important;
}
.entry-content > section.hero::before {
  content: "";
  position: absolute; top: -20%; right: -10%;
  width: 60vw; height: 60vw; max-width: 820px; max-height: 820px;
  background: radial-gradient(circle, rgba(28,67,108,0.10) 0%, rgba(28,67,108,0.03) 55%, rgba(28,67,108,0) 75%);
  border-radius: 50%;
  animation: hero-drift 16s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
.entry-content > section.hero > * { position: relative; z-index: 1; }
.hero h1, .hero .hero-subhead, .hero .hero-heritage {
  text-shadow: 0 2px 22px rgba(255,255,255,0.9), 0 1px 4px rgba(255,255,255,0.95);
}
@keyframes hero-drift {
  0%   { transform: translate(0,0) scale(1); }
  100% { transform: translate(-40px, 30px) scale(1.08); }
}

/* ---- 9. Cards, buttons, logos: real depth + motion ---- */
.service-line-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 28px !important;
}
.service-line-card {
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-top: 4px solid #16619c;
  border-radius: 10px;
  padding: 32px 26px !important;
  box-shadow: 0 1px 3px rgba(15,26,46,0.06);
  transition: transform 0.25s cubic-bezier(.2,.8,.3,1), box-shadow 0.25s ease, border-color 0.25s ease;
}
.service-line-card:hover {
  transform: translateY(-8px) scale(1.015);
  box-shadow: 0 22px 38px rgba(15,26,46,0.18);
}
.service-line-card .icon-slot {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: #eaf0f6;
  margin-bottom: 16px;
  transition: transform 0.25s ease, background 0.25s ease;
}
.service-line-card:hover .icon-slot { transform: scale(1.1); background: #dbe6f0; }
.service-line-card .service-subtitle { color: #5b6674; }

.btn, a.btn {
  border-radius: 999px !important;
  padding: 15px 34px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase;
  font-size: 0.82rem !important;
  transition: transform 0.2s cubic-bezier(.2,.8,.3,1), box-shadow 0.2s ease, background 0.2s ease !important;
}
.btn:hover, a.btn:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 14px 28px rgba(15,26,46,0.22);
}

.client-logo-strip img {
  filter: grayscale(100%);
  opacity: 0.7;
  transition: filter 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}
.client-logo-strip img:hover { filter: grayscale(0%); opacity: 1; transform: scale(1.06); }

/* ---- 10. Real motion: native CSS scroll-triggered reveals + staged hero entrance ---- */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .entry-content > section {
      animation: reveal-up linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 25%;
    }
    .service-line-card {
      animation: reveal-up linear both;
      animation-timeline: view();
      animation-range: entry 10% cover 35%;
    }
  }
  @keyframes reveal-up {
    from { opacity: 0; transform: translateY(36px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .hero h1            { animation: fade-up 0.7s 0.05s cubic-bezier(.2,.8,.2,1) both; }
  .hero .hero-subhead { animation: fade-up 0.7s 0.20s cubic-bezier(.2,.8,.2,1) both; }
  .hero .hero-heritage{ animation: fade-up 0.7s 0.30s cubic-bezier(.2,.8,.2,1) both; }
  .hero-ctas .btn:nth-child(1) { animation: fade-up 0.7s 0.40s cubic-bezier(.2,.8,.2,1) both; }
  .hero-ctas .btn:nth-child(2) { animation: fade-up 0.7s 0.50s cubic-bezier(.2,.8,.2,1) both; }
  @keyframes fade-up {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* ---- 11. Mobile ---- */
@media (max-width: 480px) {
  .entry-content > section { padding-top: 56px !important; padding-bottom: 56px !important; }
  .entry-content > section h2 { font-size: 1.6rem !important; }
  .site-branding { flex-direction: column; }
}


/* ===================================================================
   BIICS.com Visual System -- Day 5, PASS 2 (same day, 2026-09-13)
   Owner: BIICS-SPEC-DevOps. Dispatched by LIFEOPS-EXEC -- fourth pass on
   the hero specifically, with concrete, confirmed-live problems instead
   of vague direction. Burnette, verbatim across this dispatch: "Nothing
   exciting on the landing page... Or logo is minimized, like what the
   fuck. The whole landing page is BORING." / "The 'Trusted accross
   Florida....' line seems very limiting." / "Overall font is way too
   small for a fucking landing page." / on TEKsystems' hero: "when you
   scroll on teksystems page their moving graphic expands and take over
   the whole page. This some cool shit!" -- then relaxed to a real-
   judgment brief, not a literal clone: "I don't need to be exactly like
   them... build for [genuinely current, not embarrassingly dated]." /
   on McKinsey: "shit dances a bit onto the page with large tiles and the
   tiles expand when you hover." / "Almost magazine like, with heavy
   graphics and images." / confirming the scroll-reveal direction:
   "Things appear after you scroll to sections, so you see them appear.
   Excitement!" Plus two real logo-grid bugs from Burnette: the Florida
   Department of Revenue logo not colorizing on hover like its 10
   siblings, and all 11 logos needing to be "slightly larger and a
   little better spaced out."

   REAL ROOT CAUSE FOUND THIS PASS, not guessed: the Dara theme's own
   style.css sets `html { font-size: 62.5%; }` site-wide (confirmed via
   direct stylesheet inspection: document.styleSheets[12], ownerNode id
   "dara-style-css"). Every rem-based size declared in the Day 5 Pass 1
   block above was authored assuming a normal 16px root, so it was
   silently rendering at 62.5% of the intended size this entire time --
   e.g. `.hero .hero-subhead { font-size: 1.2rem }` was rendering at
   12px, not 19.2px, and `.btn { font-size: 0.82rem }` at 8.2px, not
   13.1px. Confirmed live via getComputedStyle before touching anything
   (`getComputedStyle(document.documentElement).fontSize` was "10px").
   This, not a subjective "make it bigger" guess, is the real reason
   "everything is too small."

   Second real root cause, this pass: the Florida Department of Revenue
   logo's own PNG source file is genuinely monochrome -- verified by
   drawing it to a canvas and sampling pixel data: max R/G/B channel
   difference across the whole image was 0 (flat gray), vs. 186-217 on
   sibling logos with real color. The site-wide `filter: grayscale(100%)`
   -> `grayscale(0%)` hover effect can only reveal color that exists in
   the source pixels -- there is none in this file, so no CSS fix alone
   can make it colorize like its siblings. Handled below without
   pretending otherwise (see P2-8); a real fix needs a real color source
   file, which is a download-permission decision, not made unilaterally
   here.

   These rules are appended after, not merged into, the Day 5 Pass 1
   block above, so the diff/audit trail stays legible -- later source
   order wins the cascade for shared selectors; nothing above is deleted.
   Staging only: https://biics.com
   =================================================================== */

/* ---- P2-0. ROOT FIX: restore a normal 16px rem base site-wide ----
   This single line is why every size below reads dramatically larger
   than Pass 1 without every value having to be individually inflated. */
html { font-size: 100% !important; }

/* ---- P2-1. Confident landing-page type scale (on top of the root fix) ---- */
.hero h1 {
  font-size: clamp(2.75rem, 5vw, 4.5rem) !important;
  line-height: 1.05 !important;
}
.hero .hero-subhead { font-size: 1.3rem !important; line-height: 1.6; max-width: 720px; }
.hero .hero-heritage {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.entry-content p { font-size: 1.125rem !important; line-height: 1.75 !important; }
.entry-content > section h3 { font-size: 1.2rem !important; }
.section-eyebrow {
  font-size: 1rem !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.service-subtitle { font-size: 1.02rem !important; line-height: 1.6; }
.site-description { font-size: 1.05rem !important; }
.main-navigation ul li a { font-size: 0.92rem !important; padding-left: 1px !important; padding-right: 1px !important; }
.btn, a.btn { font-size: 1rem !important; padding: 17px 38px !important; }

/* ---- P2-2. Nav: absorb the type-scale bump without re-wrapping ---- */
.main-navigation { max-width: 100%; }
.main-navigation ul { max-width: 100%; }
.main-navigation ul li { margin: 0 1px; }
.main-navigation { padding-left: 8px !important; padding-right: 8px !important; }
.main-navigation ul > li:last-child > a { padding: 9px 20px !important; margin-left: 4px; }

/* ---- P2-3. Logo: real, meaningful header presence, not a floating crest ---- */
.site-branding .custom-logo {
  max-height: 108px !important;
}
.site-branding { padding: 18px 24px !important; gap: 18px; }
.site-title, .site-title a { font-size: 1.3rem !important; }

/* ---- P2-4. Hero: bold animated gradient mesh + moving texture, ON LOAD,
   independent of scroll-timeline support -- not another subtle blob. ---- */
.entry-content > section.hero {
  min-height: 640px;
}
.entry-content > section.hero::before {
  top: -30%; right: -20%; left: -10%; bottom: -20%;
  width: auto; height: auto; max-width: none; max-height: none;
  background:
    radial-gradient(circle at 20% 30%, rgba(28,67,108,0.92) 0%, rgba(28,67,108,0) 55%),
    radial-gradient(circle at 80% 15%, rgba(14,140,150,0.85) 0%, rgba(14,140,150,0) 58%),
    radial-gradient(circle at 60% 80%, rgba(18,48,77,0.88) 0%, rgba(18,48,77,0) 58%),
    radial-gradient(circle at 10% 85%, rgba(95,220,225,0.70) 0%, rgba(95,220,225,0) 55%),
    radial-gradient(circle at 45% 45%, rgba(35,95,150,0.55) 0%, rgba(35,95,150,0) 60%);
  filter: blur(3px) saturate(1.3);
  border-radius: 0;
  animation: hero-drift 14s ease-in-out infinite alternate;
}
.entry-content > section.hero::after {
  content: "";
  position: absolute; inset: -10%;
  background-image: radial-gradient(rgba(18,48,77,0.16) 1.5px, transparent 1.5px);
  background-size: 28px 28px;
  animation: hero-grid-drift 22s linear infinite;
  pointer-events: none;
  z-index: 0;
  opacity: 0.5;
}
@keyframes hero-drift {
  0%   { transform: translate(0,0) scale(1) rotate(0deg); }
  100% { transform: translate(-60px, 40px) scale(1.18) rotate(6deg); }
}
@keyframes hero-grid-drift {
  0%   { background-position: 0 0; }
  100% { background-position: 140px 90px; }
}

@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-drift 14s ease-in-out infinite alternate,
               hero-grow linear both;
    animation-timeline: auto, view();
    animation-range: auto, entry 0% cover 70%;
  }
  @keyframes hero-grow {
    from { transform: scale(1); opacity: 1; }
    to   { transform: scale(1.55); opacity: 1; }
  }
  .entry-content > section.hero {
    animation: none !important;
    animation-timeline: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ---- P2-5. Substantial CTAs -- solid presence at rest, not just on hover ---- */
.hero-ctas .btn {
  font-size: 1.05rem !important;
  padding: 20px 44px !important;
  box-shadow: 0 10px 26px rgba(18,48,77,0.22);
}
.hero-ctas .btn:hover { box-shadow: 0 20px 38px rgba(18,48,77,0.32); }

/* ---- P2-6. Card grid: real staggered entrance + genuine hover-expand ---- */
.service-line-card:hover {
  transform: translateY(-10px) scale(1.045);
}
@supports (animation-timeline: view()) {
  .service-line-card:nth-child(1) { animation-range: entry 0% cover 30%; }
  .service-line-card:nth-child(2) { animation-range: entry 4% cover 34%; }
  .service-line-card:nth-child(3) { animation-range: entry 8% cover 38%; }
  .service-line-card:nth-child(4) { animation-range: entry 12% cover 42%; }
  .service-line-card:nth-child(5) { animation-range: entry 16% cover 46%; }
}

/* ---- P2-7. Every section's reveal made real and noticeable ---- */
.entry-content > section:not(.hero),
.client-logo-strip,
.industries-marquee,
.closing-cta {
  animation-duration: 900ms;
}
@supports (animation-timeline: view()) {
  .entry-content > section:not(.hero) {
    animation: reveal-up-strong ease-out both;
    animation-timeline: view();
    animation-range: entry 0% cover 30%;
  }
}
@keyframes reveal-up-strong {
  from { opacity: 0; transform: translateY(56px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---- P2-8. Client logo grid: real sizing/spacing bump + honest handling
   of the one genuinely monochrome source file (Florida Dept. of Revenue). ---- */
.logo-grid { gap: 26px 40px !important; }
.client-logo-strip .logo-item img {
  max-height: 68px !important;
  max-width: 190px !important;
}
.logo-item[data-name="Florida Department of Revenue"] img {
  filter: grayscale(100%) !important;
  opacity: 0.85 !important;
  transition: transform 0.25s ease, filter 0.25s ease, opacity 0.25s ease;
}
.logo-item[data-name="Florida Department of Revenue"]:hover img {
  filter: grayscale(100%) contrast(1.15) !important;
  opacity: 1 !important;
  transform: scale(1.06);
}

/* ---- P2-9. Mobile ---- */
@media (max-width: 600px) {
  .hero h1 { font-size: clamp(2.1rem, 8vw, 2.6rem) !important; }
  .site-branding .custom-logo { max-height: 76px !important; }
  .entry-content > section.hero { min-height: 480px; }
}


/* ===================================================================
   BIICS.com Visual System -- Day 6, 2026-09-13 (ROUND 5 hero fix +
   real-time fast-follow corrections from Burnette, relayed mid-dispatch)
   Owner: BIICS-SPEC-DevOps. Dispatched by LIFEOPS-EXEC.
   Staging only: https://biics.com

   Root cause confirmed via getBoundingClientRect before any change:
   at 1510px viewport width, .hero section rendered 1070px wide, offset
   212px from the left edge -- a bounded, inset gradient card, not a
   full-bleed background, exactly Burnette's literal complaint against
   the 9 reference sites (McKinsey/Sogeti/Kyra/EY/Booz Allen/AHS/North
   Highland/Deloitte/Accenture all use edge-to-edge hero backgrounds).
   =================================================================== */

/* ---- D6-1. TRUE full-bleed hero: break the SECTION itself out of the
   theme's centered content container. Content children (h1/subhead/
   heritage/CTAs -- no wrapper div exists) re-constrained to the normal
   reading column so only the BACKGROUND bleeds edge-to-edge. ---- */
html, body { overflow-x: hidden !important; }

.entry-content > section.hero {
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box;
  overflow: hidden;
  background: #0e1e30 !important;
}
.entry-content > section.hero > * {
  max-width: 1100px;
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* ---- D6-2. Real stock photography replaces the generative-only
   gradient mesh -- Burnette: "Go grab some fucking stock photos that
   say technology... kill this layout for real this time." Source:
   Pexels (free commercial-use license), photographer credited in
   biics_website_redesign/assets/stock-photos/README.md. Dark navy/teal
   gradient overlay carries the headline text (EY/Deloitte/McKinsey
   pattern); slow continuous Ken Burns pan/zoom for real motion. ---- */
.entry-content > section.hero::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100%; height: 100%;
  max-width: none; max-height: none;
  background:
    linear-gradient(120deg, rgba(12,26,42,0.92) 0%, rgba(18,48,77,0.84) 45%, rgba(14,60,80,0.74) 100%),
    url('https://biics.com/wp-content/uploads/2026/09/hero-datacenter-1181316.jpg');
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  filter: none;
  border-radius: 0;
  animation: hero-kenburns 26s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
.entry-content > section.hero::after { content: none !important; }
@keyframes hero-kenburns {
  0%   { transform: scale(1) translate(0, 0); }
  100% { transform: scale(1.12) translate(-2%, 1.5%); }
}
@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-kenburns 26s ease-in-out infinite alternate,
               hero-grow linear both;
    animation-timeline: auto, view();
    animation-range: auto, entry 0% cover 70%;
  }
  @keyframes hero-grow {
    from { transform: scale(1); }
    to   { transform: scale(1.22); }
  }
  .entry-content > section.hero {
    animation: none !important;
    animation-timeline: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
.hero h1, .hero .hero-subhead, .hero .hero-heritage {
  color: #ffffff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,0.45), 0 1px 3px rgba(0,0,0,0.55) !important;
}
.hero .hero-subhead { color: #eaf0f6 !important; }

/* ---- D6-3. Subpage page-header: full-bleed navy band behind the title
   on every inner page (About/Services/Industries/etc.), so they stop
   reading as bare unstyled WordPress and tie into the homepage's visual
   system. Real, scoped baseline fix -- a full per-page content rebuild
   (cards/photography matching the homepage density) is separate,
   larger follow-up work, named explicitly in the dispatch report. ---- */
body:not(.home) .entry-header {
  display: block !important;
  position: relative;
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  margin-left: -50vw !important;
  box-sizing: border-box;
  padding: 72px 32px 56px !important;
  background: linear-gradient(120deg, #0e1e30 0%, #16619c 55%, #16619c 100%);
  overflow: hidden;
  margin-bottom: 0 !important;
}
body:not(.home) .entry-header::before {
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.10) 1.5px, transparent 1.5px);
  background-size: 26px 26px;
  animation: hero-grid-drift 24s linear infinite;
  opacity: 0.5;
  pointer-events: none;
}
body:not(.home) .entry-header .entry-title {
  color: #ffffff !important;
  max-width: 1100px;
  margin: 0 auto !important;
  position: relative;
  z-index: 1;
}

/* ---- D6-4. Client logo grid -> same card/icon visual language as the
   service-line cards, not a third disconnected UI pattern. Burnette:
   "why keep the grid list of customers if we are using icons on the
   first page?" Real logos stay (the one actual evidence-backed proof
   point) -- restyled into the same lift/shadow card treatment. ---- */
.client-logo-strip .logo-item {
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-radius: 10px;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgba(15,26,46,0.06);
  transition: transform 0.25s cubic-bezier(.2,.8,.3,1), box-shadow 0.25s ease, border-color 0.25s ease;
}
.client-logo-strip .logo-item:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 18px 30px rgba(15,26,46,0.14);
  border-color: #16619c;
}

/* ---- D6-5. Mobile guard for the new full-bleed rules ---- */
@media (max-width: 600px) {
  .entry-content > section.hero > * { padding-left: 20px; padding-right: 20px; }
  body:not(.home) .entry-header { padding: 48px 20px 36px !important; }
}


/* ---- D6-6. FIX, self-caught before reporting done: hero-grow (scroll-
   linked animation-timeline:view()) and hero-kenburns (always-on
   continuous pan/zoom) both targeted the SAME 'transform' property --
   per spec only one wins (replace compositing). Verified live: transform
   was frozen identical at t=0s and t=3s with zero scroll -- the scroll-
   linked one was silently winning and killing the continuous motion,
   reproducing the exact bug this round exists to fix. Force ONLY the
   continuous Ken Burns animation on the hero background. ---- */
@supports (animation-timeline: view()) {
  .entry-content > section.hero::before {
    animation: hero-kenburns 26s ease-in-out infinite alternate !important;
    animation-timeline: auto !important;
  }
}


/* ---- D7-1. Brand triad callout, near the hero -- Burnette: "WEave in
   Enterprise Minded, Statutorily Fluent and Trusted Partner." Three-part
   pill/badge row under the UNDERSTAND.ADAPT.LEVERAGE. heritage line. ---- */
.hero .brand-triad {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 22px;
  padding: 0;
  list-style: none;
}
.hero .brand-triad span {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid rgba(255,255,255,0.45);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ffffff;
  background: rgba(255,255,255,0.08);
  backdrop-filter: blur(2px);
}

/* ---- D7-2. New homepage section headings added this pass -- match the
   existing h2 underline-accent treatment already used site-wide. ---- */
.entry-content > section .client-proof-heading {
  font-size: clamp(1.7rem, 2.6vw, 2.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em;
  color: #16619c !important;
  margin: 0 0 24px !important;
}
.entry-content > section .client-proof-heading::before {
  content: "";
  display: block;
  width: 56px; height: 4px;
  background: #16619c;
  margin-bottom: 16px;
  border-radius: 2px;
}


/* ---- D8-1. ROOT FIX for subpage full-bleed drift: real bug found by
   direct measurement on /services/ -- .entry-header's D6-3 full-bleed
   rule (100vw/-50vw) assumed its ancestor column was viewport-centered,
   true on the homepage but FALSE on standard inner pages, which render
   the theme's default WordPress sidebar (#secondary, real content:
   just a boilerplate "Search for:" widget, no real content) -- this
   pushes #primary left and narrower, breaking the vw-centering math.
   Verified live: .entry-header measured left:-102.67 right:1392.33
   against a 1495px viewport (should be 0/1495). Root cause fixed by
   removing the unused sidebar site-wide (not scoped to the two
   Accounting Assist pages anymore) so #primary is genuinely centered
   on every page, matching the homepage's own layout the full-bleed
   math already depends on. ---- */
#secondary { display: none !important; }
#primary {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}


/* ---- D8-2. Real root cause found on continued investigation: even
   after hiding #secondary and forcing #primary to 100%, .entry-header
   was STILL off (left:47.33 vs expected 0) -- traced by walking the
   full ancestor chain: #page.site itself (the theme's outermost
   wrapper) has its own max-width:1180px centered constraint,
   independent of the sidebar. Neutralize it site-wide so every
   ancestor up to <body> is genuinely full-width, matching what the
   vw-based full-bleed math on .entry-header (and .hero) requires. ---- */
.site, #page, #content, .site-content, .content-wrapper {
  max-width: 100% !important;
  width: 100% !important;
}


/* ---- D8-3. Final piece: .content-wrapper carries its own 150px left/
   right padding (the theme's own content-inset design), still pushing
   #primary/article off-center after D8-2 removed the outer max-width.
   Neutralize it too -- the redesign's own section-level padding
   (.entry-content > section rules) already provides real internal
   spacing, so this theme-level padding is now redundant on top of it. ---- */
.content-wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* ---- D9-1. Brand triad relocated to the white "Proven in government"
   section -- needs real bold presence on a light background, not the
   thin-outline treatment that worked on the dark hero photo. Solid
   navy fill, real weight, generous spacing. ---- */
.client-logo-strip .brand-triad {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.client-logo-strip .brand-triad span {
  display: inline-block;
  padding: 14px 30px;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #ffffff !important;
  background: linear-gradient(120deg, #16619c 0%, #16619c 100%);
  box-shadow: 0 8px 18px rgba(18,48,77,0.28);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.client-logo-strip .brand-triad span:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 26px rgba(18,48,77,0.36);
}

/* ---- D9-2. Simplified, centered "Proven in government" eyebrow -- the
   trailing " - the foundation for partners..." clause was dropped from
   the content itself; center the remaining short line. ---- */
.client-logo-strip .section-eyebrow {
  text-align: center !important;
}

/* Strategic staging preview: unpublished corrections */
#masthead{position:relative;padding:24px!important;min-height:210px;box-sizing:border-box}
#masthead .site-branding{padding:0 0 20px 130px!important;flex-direction:column;text-align:center;gap:8px}
#masthead .custom-logo-link{position:absolute;left:24px;top:24px;margin:0}
#masthead .custom-logo{width:100px!important;height:auto!important;max-height:145px!important}
#masthead .site-title a{font-size:28px!important;line-height:1.2}
#masthead .site-description{font-size:15px!important}
#site-navigation{padding-left:130px!important}
.entry-content>section{animation:none!important;opacity:1!important;transform:none!important;padding:72px 32px}
.hero h1,.hero p{text-shadow:none!important}
.hero h1{font-size:clamp(38px,5vw,68px)!important;line-height:1.08!important}
.hero .btn{border-radius:5px!important;text-decoration:none!important;font-size:15px!important}
.hero .btn-primary{background:#fff!important;color:#153450!important}
.hero .btn-secondary{background:transparent!important;color:#fff!important;border:2px solid #fff!important}
.service-line-grid{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:24px!important}
.service-line-card{grid-column:span 2;border-top:4px solid #16619c!important;border-radius:4px!important}
.service-line-card:nth-child(4){grid-column:2/span 2}
.service-line-card .icon-slot{width:42px!important;height:4px!important;border:0!important;border-radius:0!important;background:#38a7cb!important}
.case-studies:not(:has(p,a,img)),.social-proof:not(:has(p,a,img)),.insights-teaser:has(.insights-empty-state){display:none!important}
.tech-matrix .logo-grid img{display:block!important;visibility:visible!important;opacity:1!important;max-height:55px;filter:none!important}
.client-logo-strip .brand-triad span{background:transparent!important;box-shadow:none!important;color:#173b5e!important;border-radius:0!important;font-size:18px!important}
.entry-content a:focus-visible{outline:3px solid #23b8dd;outline-offset:4px}
@media(max-width:700px){#masthead .site-branding{padding-left:88px!important}#masthead .custom-logo{width:68px!important}#masthead .site-title a{font-size:22px!important}#masthead .site-description{font-size:13px!important}#site-navigation{padding-left:88px!important}.service-line-grid{grid-template-columns:1fr!important}.service-line-card,.service-line-card:nth-child(4){grid-column:auto!important}.entry-content>section{padding:48px 24px}.hero h1{font-size:38px!important}}
@media(prefers-reduced-motion:reduce){.entry-content *,.entry-content *::before{animation:none!important;transition:none!important}}

/* Keep tagline and company name together on desktop. */
@media(min-width:701px){#masthead .site-branding{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:18px!important;min-height:90px}#masthead .site-title,#masthead .site-description{margin:0!important;white-space:nowrap!important;flex:0 0 auto!important}#masthead .site-title a{font-size:clamp(18px,1.75vw,28px)!important}#masthead .site-description{font-size:clamp(11px,1.1vw,18px)!important}}

@media(min-width:901px){#masthead{min-height:230px!important;padding-top:16px!important;padding-bottom:16px!important}#masthead .site-branding{padding:0!important;min-height:52px!important;gap:16px!important}#masthead .site-title a{font-size:clamp(21px,2vw,32px)!important}#masthead .site-description{font-size:clamp(13px,1.25vw,20px)!important}#masthead .custom-logo-link{top:73px!important;left:24px!important}#masthead .custom-logo{width:100px!important;max-height:140px!important}#site-navigation{padding-left:130px!important;min-height:138px;display:flex;align-items:center;justify-content:center}#site-navigation ul.nav-menu{display:flex!important;flex-wrap:nowrap!important;align-items:center;justify-content:space-between;gap:14px!important;width:100%;margin:0!important}#site-navigation ul.nav-menu>li{margin:0!important;padding:0!important;float:none!important}#site-navigation ul.nav-menu>li::before{display:none!important}#site-navigation ul.nav-menu>li>a{font-size:12px!important;white-space:nowrap;padding:12px 0!important;letter-spacing:.04em!important}#site-navigation ul.nav-menu>li:last-child>a{padding:12px 16px!important}}

/* Technology cards: visible by default, progressive reveal where supported. */
.tech-matrix .logo-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;max-width:1180px;margin:36px auto 0!important;padding:0!important}.tech-matrix .logo-grid>li{display:flex!important;align-items:center;justify-content:center;min-height:115px;list-style:none;background:#fff;border:1px solid #dce6ed;border-radius:6px;padding:22px!important;margin:0!important;box-shadow:0 6px 18px #13324d08}.tech-matrix .logo-grid img{max-width:100%!important;max-height:58px!important;width:auto!important;height:auto!important;object-fit:contain}.tech-matrix h2::before{display:none!important}@supports(animation-timeline:view()){ @media(prefers-reduced-motion:no-preference){.tech-matrix .logo-grid>li{animation:biics-card-in linear both;animation-timeline:view();animation-range:entry 0% entry 90%}}}@keyframes biics-card-in{from{opacity:.15;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){.tech-matrix .logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.tech-matrix .logo-grid>li{min-height:90px;padding:16px!important}}

/* Unified centered brand rectangle: shield anchors both rows. */
@media(min-width:901px){#masthead{width:100%!important;max-width:1280px!important;margin:0 auto!important;padding:26px 32px!important;min-height:210px!important;display:grid!important;grid-template-columns:112px minmax(0,1fr);grid-template-rows:76px 76px;column-gap:28px;align-items:center}#masthead .site-branding{grid-column:2;grid-row:1;padding:0!important;min-height:0!important;width:100%!important;display:flex!important;justify-content:space-between!important;align-items:center!important;gap:12px!important}#masthead .custom-logo-link{position:absolute!important;left:32px!important;top:50%!important;transform:translateY(-50%);width:112px!important}#masthead .custom-logo{width:112px!important;max-height:152px!important}#masthead .site-title a{font-size:clamp(18px,1.85vw,28px)!important}#masthead .site-description{font-size:clamp(11px,1.05vw,16px)!important}#site-navigation{grid-column:2;grid-row:2;padding:0!important;margin:0!important;width:100%!important;min-height:0!important;border:0!important}#site-navigation .menu-primary-container{width:100%!important}#site-navigation ul.nav-menu{justify-content:space-between!important;gap:10px!important}#site-navigation ul.nav-menu>li>a{font-size:clamp(11px,1.1vw,15px)!important}#masthead::before,#masthead::after{display:none!important}}

/* Equal space above/below header; remove theme gap before hero. */
#masthead{margin-bottom:0!important}#content.site-content,.site-content .content-wrapper{padding-top:0!important;margin-top:0!important}.home .site-main,.home article,.home .entry-content{margin-top:0!important;padding-top:0!important}@media(min-width:901px){#masthead{padding-top:24px!important;padding-bottom:24px!important;min-height:200px!important;grid-template-rows:76px 76px!important}}

/* Requested tagline reveal and mobile navigation sizing. */
#masthead .site-title a{display:inline-block;animation:biics-tagline-words 1.35s steps(1,end) both!important}
@keyframes biics-tagline-words{0%{clip-path:inset(0 100% 0 0)}15%{clip-path:inset(0 58% 0 0)}48%{clip-path:inset(0 34% 0 0)}80%,100%{clip-path:inset(0)}}
@media(max-width:900px){#site-navigation .menu-toggle{width:auto!important;min-width:110px!important;padding:12px 20px!important;height:auto!important;line-height:1.3!important;white-space:nowrap!important}#masthead .site-title a{animation:none!important;clip-path:none!important}}
@media(prefers-reduced-motion:reduce){#masthead .site-title a{animation:none!important;clip-path:none!important}}
/* Remove redundant page-name banners on all subpages. */
body.page:not(.home) #primary .entry-header,body.page:not(.home) .site-main .entry-header,body.page:not(.home) article.page>header.entry-header{display:none!important;margin:0!important;padding:0!important}
/* Remove WordPress likes and inline editing from public page design. */
.entry-content .sharedaddy.sd-like,.entry-content .jetpack-likes-widget-wrapper,.entry-footer .edit-link{display:none!important}
/* Preserve moved Accelerator layout. */
.biics-moved-section .accelerator-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;list-style:none;margin:30px 0;padding:0}.biics-moved-section .accelerator-flow li{border-left:3px solid #29466b;padding-left:18px}.biics-moved-section .accelerator-flow .stage{font-weight:700;color:#29466b}.biics-moved-section .accelerator-flow p{margin-top:10px}@media(max-width:700px){.biics-moved-section .accelerator-flow{grid-template-columns:1fr}}
/* Mobile menu remains readable in both toggle states. */
@media(max-width:900px){#site-navigation .menu-toggle,#site-navigation.toggled .menu-toggle{background:#16619c!important;color:#fff!important;opacity:1!important;border:0!important;border-radius:4px!important}}