/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 22 2026 | 22:57:19 */
/* ============================================================
   SVWSC BRAND REFRESH — STARTER CSS v1
   ------------------------------------------------------------
   Author notes for Marcos:
   - This file is designed to drop into Simple Custom CSS
     (External File mode) on your STAGING site first.
   - Load this file AFTER any existing Blocksy/theme CSS so the
     overrides take effect.
   - Sections are numbered — you can comment out any section with
     a block comment to disable that phase.
   - Google Fonts @import is included for convenience, but for
     better performance, add the <link> tag to your Blocksy
     theme header (Blocksy > Performance > Custom Code > Header)
     and remove the @import below.
   ============================================================ */


/* ============================================================
   1. FONT LOADING
   ------------------------------------------------------------
   Fonts are self-hosted via Blocksy Pro → Extensions →
   Custom Fonts (Bricolage Grotesque + Plus Jakarta Sans
   uploaded April 19, 2026). @import intentionally omitted —
   loading from fonts.googleapis.com would defeat self-hosting
   and block CSS parsing until the network request resolves.
   ============================================================ */


/* ============================================================
   2. DESIGN TOKENS (CSS CUSTOM PROPERTIES)
   ------------------------------------------------------------
   All colors, shadows, and spacing live here. Change a value
   once and it cascades everywhere. These are namespaced with
   --svwsc- to avoid collision with Blocksy's own variables.
   ============================================================ */

:root {
  /* Brand greens — derived from WorkSource CA #6EB43F */
  --svwsc-green:         #6EB43F;   /* Primary brand */
  --svwsc-green-dark:    #5A9432;   /* Hover states */
  --svwsc-green-deeper:  #3F6C22;   /* Text on light bg */
  --svwsc-green-wash:    #EEF6E4;   /* Subtle section bg */
  --svwsc-green-mist:    #F6FAF0;   /* Even more subtle bg */

  /* Neutrals — warm-leaning to avoid sterile corporate feel */
  --svwsc-ink:           #151A14;   /* Primary text, dark sections */
  --svwsc-ink-soft:      #3A4238;   /* Body text */
  --svwsc-muted:         #6C736A;   /* Secondary text */
  --svwsc-line:          #E4E6E0;   /* Borders, dividers */
  --svwsc-cream:         #FAF9F4;   /* Page background (warm white) */
  --svwsc-white:         #FFFFFF;

  /* Shadows — subtle, layered, avoid the "floating card" look */
  --svwsc-shadow-sm: 0 1px 2px rgba(21,26,20,.04), 0 2px 8px rgba(21,26,20,.04);
  --svwsc-shadow-md: 0 4px 12px rgba(21,26,20,.06), 0 12px 32px rgba(21,26,20,.08);
  --svwsc-shadow-lg: 0 8px 24px rgba(21,26,20,.08), 0 24px 64px rgba(21,26,20,.12);
  --svwsc-shadow-green: 0 4px 14px rgba(110,180,63,.35);

  /* Radius */
  --svwsc-radius-sm: 8px;
  --svwsc-radius-md: 14px;
  --svwsc-radius-lg: 20px;
  --svwsc-radius-full: 999px;

  /* Motion */
  --svwsc-ease: cubic-bezier(.2, .8, .2, 1);
}


/* ============================================================
   3. GLOBAL TYPOGRAPHY
   ------------------------------------------------------------
   NOTE: This WILL visibly change every page on your site — all
   body text switches to Plus Jakarta Sans, all headings to
   Bricolage Grotesque. This is the biggest visible change in
   the starter CSS.

   If you want to preview safely first, comment out section 3
   entirely and only uncomment it after you've confirmed the
   fonts load correctly on your staging site.
   ============================================================ */

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--svwsc-ink);
  background: var(--svwsc-cream);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Bricolage Grotesque', Georgia, serif;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--svwsc-ink);
}

h1, .h1 { font-size: clamp(36px, 5vw, 64px); line-height: 1.0; }
h2, .h2 { font-size: clamp(28px, 3.8vw, 48px); line-height: 1.05; }
h3, .h3 { font-size: clamp(22px, 2.6vw, 32px); line-height: 1.15; }
h4, .h4 { font-size: clamp(18px, 1.8vw, 22px); line-height: 1.25; }

/* Body text refinement */
p {
  color: var(--svwsc-ink-soft);
}

p.lead, .lead {
  font-size: 18px;
  line-height: 1.55;
  color: var(--svwsc-ink-soft);
}


/* ============================================================
   4. LINK STYLES
   ------------------------------------------------------------
   Default link color uses the deeper green for accessibility
   (higher contrast ratio on cream/white backgrounds).
   ============================================================ */

a {
  color: var(--svwsc-green-deeper);
  text-decoration: none;
  transition: color 0.2s var(--svwsc-ease);
}

a:hover {
  color: var(--svwsc-green);
}


/* ============================================================
   5. BUTTON UTILITY CLASSES
   ------------------------------------------------------------
   Use these by adding the class to any Blocksy button, link,
   or HTML block. Blocksy's own button styles will still work —
   these are opt-in.

   Usage examples:
     <a href="#" class="svwsc-btn svwsc-btn-primary">Get Started</a>
     <a href="#" class="svwsc-btn svwsc-btn-ghost">Learn More</a>
     <a href="#" class="svwsc-btn svwsc-btn-primary svwsc-btn-lg">Big CTA</a>
   ============================================================ */

.svwsc-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
  border-radius: var(--svwsc-radius-full);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.22s var(--svwsc-ease);
}

.svwsc-btn-primary {
  background: var(--svwsc-green);
  color: var(--svwsc-white);
  box-shadow: var(--svwsc-shadow-green);
}

.svwsc-btn-primary:hover {
  background: var(--svwsc-green-dark);
  color: var(--svwsc-white);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(110,180,63,.45);
}

.svwsc-btn-ghost {
  background: transparent;
  color: var(--svwsc-ink);
  border: 1.5px solid var(--svwsc-line);
}

.svwsc-btn-ghost:hover {
  border-color: var(--svwsc-ink);
  background: var(--svwsc-white);
  color: var(--svwsc-ink);
}

.svwsc-btn-dark {
  background: var(--svwsc-ink);
  color: var(--svwsc-white);
}

.svwsc-btn-dark:hover {
  background: #000;
  color: var(--svwsc-white);
}

.svwsc-btn-lg {
  padding: 16px 30px;
  font-size: 15px;
}


/* ============================================================
   6. ACCENT & UTILITY CLASSES
   ------------------------------------------------------------
   Drop-in classes for highlighting key words, creating section
   labels, and adding brand accents to existing content.
   ============================================================ */

/* Italic green accent — for the "right here" treatment in the mockup */
.svwsc-accent {
  color: var(--svwsc-green);
  font-style: italic;
  font-weight: 500;
  position: relative;
  display: inline-block;
}

.svwsc-accent::after {
  content: "";
  position: absolute;
  bottom: 6px;
  left: 0;
  right: 0;
  height: 14px;
  background: var(--svwsc-green-wash);
  z-index: -1;
  transform: skewX(-8deg);
}

/* Section label ("HOW IT WORKS" / "OUR IMPACT" style eyebrow) */
.svwsc-section-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--svwsc-green-deeper);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.svwsc-section-label::before {
  content: "";
  width: 24px;
  height: 2px;
  background: var(--svwsc-green);
}

/* "Now enrolling" style pill with pulsing dot */
.svwsc-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-radius: var(--svwsc-radius-full);
  background: var(--svwsc-green-wash);
  color: var(--svwsc-green-deeper);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.svwsc-pill::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--svwsc-green);
  animation: svwsc-pulse 2s infinite;
}

@keyframes svwsc-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.4; }
}

/* Stat number treatment — large display figures */
.svwsc-stat-num {
  font-family: 'Bricolage Grotesque', serif;
  font-size: clamp(48px, 6vw, 80px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 0.95;
  color: var(--svwsc-ink);
  display: inline-block;
}

.svwsc-stat-num .plus {
  color: var(--svwsc-green);
  margin-left: 4px;
}


/* ============================================================
   7. ANNOUNCEMENT BAR
   ------------------------------------------------------------
   If you want the dark top bar with "Services are 100% free"
   style messaging, you can drop this class onto a Blocksy
   header row or a simple HTML block at the top of the page.
   ============================================================ */

.svwsc-announce {
  background: var(--svwsc-ink);
  color: var(--svwsc-cream);
  font-size: 13px;
  padding: 10px 16px;
  text-align: center;
  letter-spacing: 0.01em;
}

.svwsc-announce b {
  color: var(--svwsc-green);
}

.svwsc-announce .sep {
  opacity: 0.4;
  margin: 0 12px;
}


/* ============================================================
   8. CARD / SERVICE COMPONENT
   ------------------------------------------------------------
   For the three "What We Do" service cards or similar
   three-column content blocks.
   ============================================================ */

.svwsc-card {
  position: relative;
  background: var(--svwsc-cream);
  border-radius: var(--svwsc-radius-lg);
  padding: 36px 32px;
  border: 1px solid var(--svwsc-line);
  transition: all 0.35s var(--svwsc-ease);
  overflow: hidden;
}

.svwsc-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--svwsc-green);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s var(--svwsc-ease);
}

.svwsc-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--svwsc-shadow-md);
  border-color: transparent;
}

.svwsc-card:hover::before {
  transform: scaleX(1);
}

.svwsc-card-icon {
  width: 56px;
  height: 56px;
  border-radius: var(--svwsc-radius-md);
  background: var(--svwsc-green-wash);
  display: grid;
  place-items: center;
  margin-bottom: 24px;
  transition: background 0.3s var(--svwsc-ease);
}

.svwsc-card:hover .svwsc-card-icon {
  background: var(--svwsc-green);
}


/* ============================================================
   9. BLOCKSY-SPECIFIC OVERRIDES (OPTIONAL)
   ------------------------------------------------------------
   These target Blocksy's default element classes so your
   existing pages inherit the new green without you having to
   rebuild them. Comment out any rule that causes conflicts.
   ============================================================ */

/* Blocksy primary buttons inherit green */
.ct-button,
.wp-block-button__link,
.gform_button,
input[type="submit"] {
  background-color: var(--svwsc-green) !important;
  color: var(--svwsc-white) !important;
  border-radius: var(--svwsc-radius-full) !important;
  font-weight: 600 !important;
  transition: all 0.22s var(--svwsc-ease) !important;
}

.ct-button:hover,
.wp-block-button__link:hover,
.gform_button:hover,
input[type="submit"]:hover {
  background-color: var(--svwsc-green-dark) !important;
  transform: translateY(-1px);
}

/* Focus ring uses brand green for accessibility */
*:focus-visible {
  outline: 2px solid var(--svwsc-green) !important;
  outline-offset: 2px !important;
}


/* ============================================================
   10. GRAVITY FORMS REFINEMENT
   ------------------------------------------------------------
   Light polish for your WIOA intake form — focused styling
   for form inputs that matches the brand. Does NOT change
   form logic or field structure.
   ============================================================ */

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper textarea,
.gform_wrapper select {
  border: 1.5px solid var(--svwsc-line) !important;
  border-radius: var(--svwsc-radius-sm) !important;
  padding: 12px 14px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  transition: border-color 0.2s var(--svwsc-ease), box-shadow 0.2s var(--svwsc-ease) !important;
}

.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper input[type="number"]:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
  border-color: var(--svwsc-green) !important;
  box-shadow: 0 0 0 3px rgba(110, 180, 63, 0.15) !important;
  outline: none !important;
}

.gform_wrapper .gfield_label {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-weight: 600 !important;
  color: var(--svwsc-ink) !important;
}


/* ============================================================
   11. STACKABLE BLOCK OVERRIDES
   ------------------------------------------------------------
   The existing homepage uses Stackable blocks (classes prefixed
   with .stk-*), which are invisible to section 9's Blocksy-
   targeted rules. This section brings Stackable buttons into
   the brand system.

   Strategy: belt-and-suspenders — redefine Stackable's own CSS
   custom properties AND override the resolved properties with
   !important. This wins regardless of whether Stackable is
   driving styles via variables or direct declarations in a
   given version.

   Scope note: This targets the current pre-refresh homepage so
   it doesn't look mixed during the staging review. Day 2's
   Home v2 rebuild uses Blocksy blocks + .svwsc-* utility
   classes, not Stackable, so these rules become inert after
   Home v2 ships. Leave them in place — harmless, and protects
   any interior pages still using Stackable.
   ============================================================ */

/* Stackable button — base state */
.stk-button,
a.stk-link.stk-button,
.stk-block-button .stk-button,
.wp-block-stackable-button .stk-button {
  /* Redefine Stackable's own CSS variables */
  --stk-button-background-color: var(--svwsc-green) !important;
  --stk-button-text-color: var(--svwsc-white) !important;

  /* Override resolved properties directly */
  background-color: var(--svwsc-green) !important;
  background: var(--svwsc-green) !important;
  color: var(--svwsc-white) !important;
  border-radius: var(--svwsc-radius-full) !important;
  padding: 12px 22px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  transition: all 0.22s var(--svwsc-ease) !important;
  box-shadow: var(--svwsc-shadow-green) !important;
}

/* Stackable button — hover state (beats Stackable's built-in darken effect) */
.stk-button:hover,
a.stk-link.stk-button:hover,
a.stk-link.stk-button.stk--hover-effect-darken:hover,
.stk-block-button .stk-button:hover,
.wp-block-stackable-button .stk-button:hover {
  --stk-button-background-color: var(--svwsc-green-dark) !important;

  background-color: var(--svwsc-green-dark) !important;
  background: var(--svwsc-green-dark) !important;
  color: var(--svwsc-white) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(110,180,63,.45) !important;
}

/* Inner text span — ensure it inherits white */
.stk-button__inner-text {
  color: var(--svwsc-white) !important;
}


/* ============================================================
   12. PRE-REFRESH HOMEPAGE + CHROME POLISH
   ------------------------------------------------------------
   Surgical fixes for the current homepage's legacy classes and
   Blocksy's header/footer chrome, so the staging site looks
   coherent before Home v2 replaces the current homepage Day 2.

   Like section 11, most of these rules become inert for the
   homepage after Home v2 ships — but the header/footer rules
   persist site-wide and remain useful on every page.
   ============================================================ */

/* Impact stat numbers — override Stackable's palette-variable
   color on the legacy .stats-grid heading wrapper.
   Use deeper green for readability against white impact card. */
.stats-grid h1,
.stats-grid h2,
.stats-grid h3 {
  color: var(--svwsc-green-deeper) !important;
  font-family: 'Bricolage Grotesque', Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* Stackable .stk-highlight spans inside .stats-grid carry an
   inline style="color: #0a66c2" (set via block editor color
   picker). Inline styles beat class selectors by specificity,
   but !important in a stylesheet beats inline. Scoped to
   .stats-grid so .stk-highlight elsewhere on the site (post
   bodies, announcements) retains whatever color the editor
   intended. */
.stats-grid .stk-highlight,
.stats-grid h1 .stk-highlight,
.stats-grid h2 .stk-highlight,
.stats-grid h3 .stk-highlight {
  color: var(--svwsc-green-deeper) !important;
}

/* Blocksy header — cream background, matching body */
.ct-header,
.ct-header [data-row],
header[data-id="header"],
header[data-id="header"] [data-row] {
  background-color: var(--svwsc-cream) !important;
}

/* Subtle 1px separator under header for visual anchoring
   (so nav doesn't visually bleed into hero when both are cream) */
.ct-header {
  border-bottom: 1px solid var(--svwsc-line) !important;
}

/* Blocksy footer — cream background, matching body */
.ct-footer,
.ct-footer [data-row],
footer[data-id="footer"],
footer[data-id="footer"] [data-row] {
  background-color: var(--svwsc-cream) !important;
}

/* Subtle 1px separator above footer */
.ct-footer {
  border-top: 1px solid var(--svwsc-line) !important;
}


/* ============================================================
   13. BLOCKSY NAVIGATION OVERRIDES
   ------------------------------------------------------------
   Blocksy's header nav uses .ct-menu-link inside specific
   nav[class*=menu] scope (specificity 0,0,3,2) which beats
   section 4's generic `a:hover` rule (0,0,1,1). Without this
   section, hovering any nav item falls back to Blocksy's
   default --theme-link-hover-color (blue). Same pattern
   affects the current-page menu item and the header search
   magnifier.

   Deliberately NOT overriding --theme-link-* variables at
   :root — those variables are used site-wide (post bodies,
   footer widgets, etc.) and uncontrolled reach is riskier
   than scoped direct selectors.
   ============================================================ */

/* Nav menu link — hover state */
nav[class*=menu] .ct-menu-link:hover,
nav[class*=menu] li:hover > .ct-menu-link,
nav[class*=menu] li:hover > .ct-sub-menu-parent,
.ct-menu-link:hover {
  color: var(--svwsc-green) !important;
}

/* Nav menu link — current page (you're on it) */
nav[class*=menu] li[class*=current-menu-] > .ct-menu-link,
nav[class*=menu] li[class*=current-menu-] > .ct-sub-menu-parent {
  color: var(--svwsc-green) !important;
}

/* Header search magnifier — initial + hover */
.ct-header-search {
  color: var(--svwsc-ink) !important;
}

.ct-header-search:hover {
  color: var(--svwsc-green) !important;
}


/* ============================================================
   SECTION 14 — HOME V2 FULL-BLEED SECTION ESCAPE-HATCH
   ------------------------------------------------------------
   Problem:
   Home v2 (page 286) uses Custom HTML blocks to render the
   mockup sections. WordPress's block theme wraps post content
   in <div class="entry-content is-layout-constrained">, which
   constrains all descendant blocks to the theme's content
   max-width. Sections that rely on a full-bleed background
   (dark band, green band, pale-green wash band) render as
   centered cards floating on cream instead of edge-to-edge
   bands — breaks the intended visual rhythm.

   Fix:
   Pull each targeted section out of the constrained flow by
   setting width to 100vw and counter-balancing with negative
   margins of calc(50% - 50vw) on each side to re-center the
   full-viewport block. max-width: 100vw prevents future
   parent rules from clipping it back down.

   Inner content stays properly constrained because each
   section contains a .container child (max-width 1240px,
   margin: 0 auto) that re-applies content centering.

   Scope:
   Targets .entry-content descendants only so this fires on
   Gutenberg-rendered pages (Home v2 being the primary
   target). Same class names in other contexts (standalone
   previews, test pages) are not affected.

   Sections included: .announce, nav.site, .impact,
                      .testimonial, .employer, .events-section,
                      .philosophy, .cta
   Sections intentionally excluded: .services-section and the
   generic .section wrapper — these use cream backgrounds
   matching the page, so full-bleed vs. constrained is
   cosmetically identical and not worth an extra rule.

   Note: .events-section was added in v7 as a scope correction
   to v6. v6's planning table incorrectly listed it as cream-
   background; actual mockup CSS applies a white background
   (var(--white), #FFFFFF) with a 1px top border, designed as
   a full-width visual break. Without the full-bleed override,
   it rendered as a constrained white card on cream and broke
   the edge-to-edge rhythm of the surrounding sections.

   Note: .philosophy was added in v8 for Team v2 (page 307)
   deployment. The Meet the Team mockup uses a full-bleed
   green-mist band (var(--green-mist)) as a quote-container
   visual pattern analogous to Home v2's .testimonial. Without
   the escape-hatch the green mist rendered as a constrained
   card floating on cream — same constraint pattern that drove
   v6/v7's existing Section 14 selectors. Single-selector
   addition; behavior on Home v2 unaffected (.philosophy does
   not exist on page 286).

   Note: .announce and nav.site were added in v9 during Team
   v2 Block 1 paste verification. The dark announce bar and
   sticky cream nav row were rendering with cream gutters on
   each side — the is-layout-constrained wrapper caging them
   the same way it caged the band sections in v6. The issue
   existed on Home v2 as well but cream-on-cream gutters read
   as intentional visual margin and the bug went unflagged
   across Day 2. Both pages fix with one patch because both
   use identical class names for announce and nav. No interior
   content change: each element contains a .container child
   (max-width 1240px, margin auto) that re-centers content
   within the now-full-width outer shell.

   Known edge case:
   100vw includes the vertical scrollbar width on systems
   where that scrollbar is opaque (mostly older Windows
   setups). If a small horizontal scrollbar appears after
   this patch, the standard mitigation is overflow-x: hidden
   on body/html — typically already present via the mockup's
   Block 1 embedded CSS (body { overflow-x: hidden }).
   ============================================================ */

.entry-content .announce,
.entry-content nav.site,
.entry-content .impact,
.entry-content .testimonial,
.entry-content .employer,
.entry-content .events-section,
.entry-content .philosophy,
.entry-content .cta {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}


/* ============================================================
   SECTION 15 — BLOCKSY HEADER SEARCH SVG FILL
   ------------------------------------------------------------
   Carry-over from v5 session close (April 20, 2026).
   Section 13 set `color` on .ct-header-search but the
   embedded SVG magnifier uses the `fill` property, not
   `color`. These are distinct CSS properties on SVG
   elements — `currentColor` linkage would chain them but
   Blocksy's header icons don't use currentColor here.
   Result: magnifier icon continued rendering Blocksy-default
   blue on hover despite section 13 catching the text color.

   Single-rule patch scoped to the hover state of the header
   search container. Covers both raw <svg> children and any
   Blocksy-wrapped .ct-icon variants for forward-compat.
   ============================================================ */

.ct-header-search:hover svg,
.ct-header-search:hover .ct-icon {
  fill: var(--svwsc-green) !important;
}


/* ============================================================
   SECTION 16 — BRAND CHROME FLUSH-MOUNT (TOP)
   ------------------------------------------------------------
   Problem:
   Blocksy's theme stylesheet applies
     [data-vertical-spacing*="top"] { padding-top:
       var(--theme-content-vertical-spacing); }
   to the .ct-container-full wrapper that holds post content.
   On brand-chrome pages (Home v2, Team v2), the announce bar
   is designed to sit flush against the top of the content area
   — the chrome has no breathing room above it. With Blocksy's
   default padding in place, the cream body background shows
   through that padded zone before .announce renders, producing
   a visible vertical gap between the WP/NFD admin overlay and
   the dark announce bar.

   Section 14's escape-hatch addresses horizontal caging only.
   This is a separate vertical concern requiring its own rule.

   Why this wasn't flagged on Home v2 sooner:
   Home v2's hero (the block immediately after announce + nav)
   uses cream as its base background, so the unwanted padding
   blends visually into the hero's intended top breathing room.
   The bug exists on Home v2 just as much as on Team v2 — it's
   camouflaged, not absent. This rule covers both pages so the
   camouflaged version on Home v2 is corrected preemptively
   without waiting for someone to notice.

   Fix:
   Zero the top padding only for the specific page IDs running
   brand chrome. Other pages (post bodies, application page on
   legacy form CSS, etc.) retain Blocksy's default
   --theme-content-vertical-spacing for their first-content
   breathing room as the theme intends.

   Page IDs covered:
   - 318: Home v2
   - 348: Team v2

   When future pages join Wave 2 (e.g., Contact, Job Leads,
   Events, Staff Login) and adopt the brand chrome, append
   their page IDs to this rule's selector list.

   Companion bottom-padding override intentionally omitted —
   the brand chrome's last block (CTA) is a green-band design
   intended to be followed by the cream footer with breathing
   room between them. A small theme-spacing gap there reads as
   intentional rather than buggy. Revisit if a flush footer
   becomes the design intent.
   ============================================================ */

body.page-id-318 .ct-container-full[data-vertical-spacing*="top"],
body.page-id-348 .ct-container-full[data-vertical-spacing*="top"] {
  padding-top: 0 !important;
}


/* ============================================================
   END OF STARTER CSS v10
   ------------------------------------------------------------
   What's NOT in this file (intentional):
   - Layout/grid CSS for new sections (hero, stats, etc.)
     Those need HTML structure first — built per section when
     you add them via Blocksy blocks.
   - Page-specific styles (Meet the Staff, Job Leads, etc.)
     Those live in the individual page files.
   - JavaScript behaviors (scroll animations, form logic)
     Keep in your SilkyPress JS file (current: v9-10).

   Version log:
   v1 (April 2026) — Initial refresh: fonts, tokens, buttons,
                     cards, announcement bar, GF form polish.
   v2 (April 20, 2026, 15:10 PDT) — Added section 11 Stackable
                     block overrides for homepage buttons.
                     Also corrected SilkyPress JS reference
                     from v9-9 to v9-10.
   v3 (April 20, 2026, 15:25 PDT) — Added section 12 pre-
                     refresh homepage + chrome polish:
                     impact stat numbers forced to deeper
                     green (was persisting blue from
                     Stackable palette var); Blocksy header
                     and footer backgrounds unified to cream
                     with subtle 1px separators for visual
                     anchoring.
   v4 (April 20, 2026, 15:40 PDT) — Patch inside section 12:
                     Stackable .stk-highlight spans inside
                     .stats-grid carry inline color from block
                     editor color picker, which beat the H2
                     rule's specificity. Added scoped override
                     targeting .stats-grid .stk-highlight with
                     !important to beat the inline style.
   v5 (April 20, 2026, 15:55 PDT) — Added section 13 Blocksy
                     navigation overrides: header nav link
                     hover state, current-page menu item, and
                     header search magnifier. All unified to
                     brand green via scoped direct selectors
                     with !important (deliberately avoiding
                     :root variable override to prevent
                     uncontrolled reach into post bodies and
                     footer widgets).
   v6 (April 21, 2026, 14:35 PDT) — Two additions:
                     Section 14 — Home v2 full-bleed escape-
                     hatch for .impact, .testimonial, .employer,
                     and .cta sections. WordPress's
                     is-layout-constrained wrapper was caging
                     the mockup's intended band-break sections
                     to content width, rendering them as cards
                     floating on cream instead of edge-to-edge
                     bands. Scoped to .entry-content descendants
                     so it only fires on Gutenberg-rendered
                     pages (Home v2).
                     Section 15 — Header search magnifier SVG
                     fill fix (carry-over from v5 session). The
                     section 13 color override caught the text
                     but not the SVG fill property. One-line
                     hover-scoped patch. Addresses the one
                     remaining blue-hover bleed in the header.
   v7 (April 21, 2026, 14:50 PDT) — Scope correction to v6
                     section 14. Added .events-section to the
                     full-bleed selector list. The v6 planning
                     table misread .events-section as using a
                     cream background matching the page; actual
                     mockup CSS specifies var(--white) plus a
                     1px top border, designed as a full-width
                     break. Without this, Block 8 (EVENTS)
                     would have rendered as a constrained
                     white card on cream — the one outlier
                     among otherwise-edge-to-edge band sections.
                     Single-selector addition; no other changes.
   v8 (April 21, 2026, 19:00 PDT) — Team v2 (page 307)
                     preparation. Added .entry-content
                     .philosophy to section 14 full-bleed
                     selector list. The Meet the Team mockup's
                     philosophy quote band uses
                     var(--green-mist) as a full-bleed
                     background, analogous to Home v2's
                     .testimonial green-wash band. Without the
                     escape-hatch it would render as a
                     constrained card on cream — identical
                     problem to what drove section 14's
                     existing selectors. Single-selector
                     addition; .philosophy does not exist on
                     Home v2 (page 286), so no behavioral
                     change to existing live sections. No
                     other changes.
   v9 (April 21, 2026, 19:25 PDT) — Team v2 Block 1 paste
                     verification surfaced a pre-existing bug
                     in Home v2 as well: the dark .announce
                     bar and sticky nav.site were rendering
                     with cream gutters on each side, cage by
                     is-layout-constrained — same pattern as
                     the band sections pre-v6. Added two
                     selectors to section 14 (.entry-content
                     .announce and .entry-content nav.site).
                     Fix applies to both pages in one patch.
                     The reason it went unflagged across Day
                     2: on Home v2 the gutters are cream-on-
                     cream and read as intentional visual
                     margin, not a bug. Confirmed by fresh
                     side-by-side inspection of Home v2 full-
                     width rendering after Team v2 surfaced
                     the identical artifact. No other changes.
   v10 (May 16, 2026, 18:30 PDT) — Added Section 16, brand
                     chrome flush-mount (top). Team v2 cream
                     gap above announce bar (logged April 21
                     as possibly-resolved-by-v9, deferred
                     post-Thursday) confirmed still present on
                     re-inspection. Diagnosed to Blocksy's
                     theme rule [data-vertical-spacing*="top"]
                     applying --theme-content-vertical-spacing
                     padding-top to .ct-container-full, with
                     body background showing through that
                     padding before .announce renders. Section
                     14's escape-hatch handles horizontal
                     caging only; vertical needed its own
                     rule. Scoped to body.page-id-286 and
                     body.page-id-307 to preserve Blocksy's
                     default spacing on non-brand-chrome
                     pages. Same bug exists on Home v2 but
                     was camouflaged by hero's cream
                     background reading as intentional
                     breathing room — rule preemptively
                     covers both pages. Bottom-padding
                     companion not included; CTA→footer gap
                     reads as intentional. No other changes.
   ============================================================ */

   
