/* ============================================================================
   PHASE 2 — GreenSutra Interaction Recipes (LIVE LAYER — enqueued late by gss-interactions.php; card-raise ungated, owner-approved 2026-06-22)
   Injected onto live pages by verify-hover-phase2.py for the /review/hover/
   gallery (live site untouched). On owner approval this merges into
   gss-interactions.css (enqueued LATE so it wins by source order).

   Five recipes, applied by ELEMENT TYPE site-wide, all driven by the --gss-*
   tokens from gss-interactions.css:
     1. INVERSION  — bordered box affordances flip to parchment ground
     2. RAISE      — media cards keep dark ground, get accent border + standard motion
     3. LINK       — inline/list text links: accent colour + underline (no box)
     4. CTA        — buttons: one darker-green hover + focus ring, no lift
     5. FIELD      — inputs: one focus ring
   Plus: Ohio-balloon killswitch (scoped to our dark surfaces) + reduced-motion.
   !important is used because this is an override layer over entrenched per-surface
   rules (several of which already use !important).
   ============================================================================ */
:root{ --gss-link-hover:#5DC97B; }   /* leaf — legible link accent on the dark ground */

/* ============================================================================
   1. INVERSION  — bordered box affordances → parchment + ink + green-deep
   ============================================================================ */

/* --- services: process steps, table rows, FAQ rows, related-service boxes --- */
.gss-step:hover, .gss-step:focus-visible{ background:var(--gss-hover-bg)!important; border-color:var(--gss-hover-border)!important; }
.gss-step:hover .sn{ color:var(--gss-hover-accent)!important; }
.gss-step:hover h3{ color:var(--gss-hover-fg)!important; }
.gss-step:hover p{ color:var(--gss-hover-fg-soft)!important; }

.gss-table tbody tr:hover{ background:var(--gss-hover-bg)!important; }
.gss-table tbody tr:hover td, .gss-table tbody tr:hover td *{ color:var(--gss-hover-fg)!important; }
.gss-table tbody tr:hover .em{ color:var(--gss-hover-accent)!important; }

.gss-faq summary:hover{ background:var(--gss-hover-bg)!important; color:var(--gss-hover-fg)!important; border-radius:var(--gsd-radius,2px); }
.gss-faq summary:hover *{ color:var(--gss-hover-fg)!important; }
.gss-faq summary:hover .pm::before, .gss-faq summary:hover .pm::after{ background:var(--gss-hover-accent)!important; }

.gss-rel:hover, .gss-rel:focus-visible{ background:var(--gss-hover-bg)!important; border-color:var(--gss-hover-border)!important; }
.gss-rel:hover .rk{ color:var(--gss-hover-fg-soft)!important; }
.gss-rel:hover .rt{ color:var(--gss-hover-fg)!important; }
.gss-rel:hover .ra{ color:var(--gss-hover-accent)!important; }

/* --- listings: filter chips + load-more --- */
.gss-fchip:hover, .gss-fchip:focus-visible,
.gss-finder-more:hover, .gss-finder-more:focus-visible{
  background:var(--gss-hover-bg)!important; border-color:var(--gss-hover-border)!important; color:var(--gss-hover-fg)!important;
}

/* --- nav-mega: standard (non-mega) dropdown links → parchment (was green-wash).
       Mega service links already invert from Phase 1. --- */
.header:not(.-mobile) .menu > li > .sub-menu:not(.sub-menu-wide) > li > a.menu-link:hover,
.header:not(.-mobile) .menu > li > .sub-menu:not(.sub-menu-wide) > li > a.menu-link:focus-visible{
  background:var(--gss-hover-bg)!important; color:var(--gss-hover-fg)!important; padding-left:18px!important;
}

/* --- guide: see-also chips + source-card links (replaces the teal/panel patchwork) --- */
.gss-guide .gg-chip:hover, .gss-guide .gg-chip:focus-visible,
.gss-guide .gg-sources li a:hover, .gss-guide .gg-sources li a:focus-visible{
  background-image:none!important; background-color:var(--gss-hover-bg)!important; border-color:var(--gss-hover-border)!important;
}
.gss-guide .gg-chip:hover, .gss-guide .gg-chip:hover *,
.gss-guide .gg-chip:focus-visible, .gss-guide .gg-chip:focus-visible *,
.gss-guide .gg-sources li a:hover, .gss-guide .gg-sources li a:hover *,
.gss-guide .gg-sources li a:focus-visible, .gss-guide .gg-sources li a:focus-visible *{ color:var(--gss-hover-fg)!important; }

/* --- discovery forms: radio/checkbox option labels → parchment on hover
       (checked/selected state is left to the form's own indicator) --- */
.gss-cbam-discovery .frm_forms .frm_radio label:hover,
.gss-cbam-discovery .frm_forms .frm_checkbox label:hover{
  background:var(--gss-hover-bg)!important; border-color:var(--gss-hover-border)!important; color:var(--gss-hover-fg)!important;
}
.gss-cbam-discovery .frm_forms .frm_radio label:hover *,
.gss-cbam-discovery .frm_forms .frm_checkbox label:hover *{ color:var(--gss-hover-fg)!important; }

/* ============================================================================
   2. RAISE  — media cards: standardize the existing border + lift + zoom + nudge
   (services already raise; this just harmonizes the magnitudes/timing)
   ============================================================================ */
.gss-story-card:hover, .gss-card:hover, .gss-qa-card:hover,
.gss-fcard:hover, .gss-guide .gg-rcard:hover,
.gss-story-card:focus-visible, .gss-fcard:focus-visible, .gss-guide .gg-rcard:focus-visible{
  border-color:var(--gss-raise-border)!important; transform:translateY(var(--gss-raise-lift))!important;
}
/* guide related-card was filling solid green via the Ohio fix — switch it to the raise idiom */
.gss-guide .gg-rcard:hover{ background-image:none!important; background-color:var(--gg-panel,#11150F)!important; }
.gss-guide .gg-rcard:hover .gg-rcard__k{ color:var(--gg-faint,#8C9485)!important; }
.gss-guide .gg-rcard:hover .gg-rcard__t{ color:#fff!important; }
.gss-guide .gg-rcard:hover .gg-rcard__d{ color:var(--gg-mut,#B5B3A8)!important; }
.gss-guide .gg-rcard:hover .gg-rcard__ic, .gss-guide .gg-rcard:hover .gg-rcard__ic svg,
.gss-guide .gg-rcard:hover .gg-rcard__arr{ color:var(--gss-raise-border)!important; }
/* standardized image zoom + transition */
.gss-story-card .simg img, .gss-fcard .gss-fc-img img{ transition:transform var(--gss-dur) var(--gss-ease)!important; }
.gss-story-card:hover .simg img, .gss-fcard:hover .gss-fc-img img{ transform:scale(var(--gss-img-zoom))!important; }
/* standardized arrow nudge */
.gss-qa-card:hover .qarr, .gss-fcard:hover .gss-fc-arr .x, .gss-guide .gg-rcard:hover .gg-rcard__arr{
  transform:translateX(var(--gss-nudge))!important;
}

/* ============================================================================
   3. LINK  — inline/list text links: leaf accent + underline, no box, no shift
   ============================================================================ */
.gss-guide a:hover, .gss-guide a:focus-visible,
.gss-guide .gg-toc-list a:hover, .gss-guide .gg-toc-list a:focus-visible,
.gss-guide .gg-crumb a:hover, .gss-guide .gg-crumb a:focus-visible,
.gss-guide .gg-railcta__links a:hover, .gss-guide .gg-railcta__links a:focus-visible,
.gss-svc .gss-kicker--trail a:hover, .gss-svc .gss-kicker--trail a:focus-visible,
.gss-foot .ff-links a:hover, .gss-foot .ff-links a:focus-visible,
.gss-foot .ff-meta-links a:hover, .gss-foot .ff-meta-links a:focus-visible,
.gss-foot .ff-legal-links a:hover, .gss-foot .ff-legal-links a:focus-visible,
.header:not(.-mobile) .menu .gss-mega-services .gss-rail .gss-all > a.menu-link:hover,
.header:not(.-mobile) .menu .gss-mega-services .gss-rail .gss-all > a.menu-link:focus-visible{
  color:var(--gss-link-hover)!important; text-decoration:underline!important; text-underline-offset:3px!important;
  background-image:none!important; background-color:transparent!important; transform:none!important;
}
/* TOC links keep their left-rail; just recolour the rail to the accent on hover */
.gss-guide .gg-toc-list a:hover{ border-left-color:var(--gss-link-hover)!important; }

/* ============================================================================
   4. CTA  — one darker-green hover, focus ring, no lift
   ============================================================================ */
.gss-btn--primary:hover, .gss-finder-submit:hover,
.gss-guide .gg-btn--primary:hover,
.gss-cbam-discovery .frm_forms button.frm_button_submit:hover,
.gss-cbam-cta__btn:hover, .gss-foot .ff-cta:hover{ background:var(--gss-cta-hover)!important; }
/* drop redundant lifts on buttons (the colour change is the feedback) */
.gss-guide .gg-btn:hover{ transform:none!important; }
.gss-foot .ff-cta:hover{ transform:none!important; }
/* unified keyboard focus ring on buttons */
.gss-btn:focus-visible, .gss-finder-submit:focus-visible, .gss-finder-more:focus-visible,
.gss-guide .gg-btn:focus-visible, .gss-foot .ff-cta:focus-visible,
.gss-cbam-discovery .frm_forms button.frm_button_submit:focus-visible{
  outline:none!important; box-shadow:var(--gss-focus-ring)!important;
}

/* ============================================================================
   5. FIELD  — one focus ring for text inputs (inputs never invert)
   ============================================================================ */
.gss-finder-search:focus-within,
.gss-cbam-discovery .frm_forms input:focus, .gss-cbam-discovery .frm_forms textarea:focus,
.gss-cbam-discovery .frm_forms select:focus,
body.gss-svc-page .gss-formhost input:focus, body.gss-svc-page .gss-formhost textarea:focus,
body.gss-svc-page .gss-formhost select:focus{
  border-color:var(--gss-raise-border)!important; box-shadow:var(--gss-focus-ring)!important;
}

/* ============================================================================
   Ohio balloon killswitch — SCOPED to our dark surfaces only (where the
   currentColor gradient creates the green-on-green / light-on-light bug).
   Generic content pages keep Ohio's native link hover.
   ============================================================================ */
body.gss-guide-page a:hover, body.gss-guide-page a:focus-visible,
body.gss-svc-page a:hover, body.gss-svc-page a:focus-visible,
body.gss-listings a:hover, body.gss-listings a:focus-visible,
.gs-codex-page a:hover, .gss-foot a:hover{ background-image:none!important; }

/* ============================================================================
   Reduced motion — neutralize every recipe transform
   ============================================================================ */
@media (prefers-reduced-motion:reduce){
  .gss-story-card, .gss-card, .gss-qa-card, .gss-fcard, .gss-guide .gg-rcard,
  .gss-story-card .simg img, .gss-fcard .gss-fc-img img, .gss-qa-card .qarr,
  .gss-fcard .gss-fc-arr .x, .gss-guide .gg-rcard__arr, .gss-guide .gg-btn{ transition:none!important; }
  .gss-story-card:hover, .gss-card:hover, .gss-qa-card:hover, .gss-fcard:hover, .gss-guide .gg-rcard:hover{ transform:none!important; }
  .gss-story-card:hover .simg img, .gss-fcard:hover .gss-fc-img img{ transform:none!important; }
  .gss-qa-card:hover .qarr, .gss-fcard:hover .gss-fc-arr .x, .gss-guide .gg-rcard:hover .gg-rcard__arr{ transform:none!important; }
}

/* ============================================================================
   Homepage journal/story cards — RAISE (owner-approved 2026-06-22).
   Resets the earlier inversion override back to a dark raise so image-bearing
   cards stop flipping to parchment, matching every other media card.
   ============================================================================ */
.article-card:hover, .article-card:focus-visible,
.bull-lead:hover, .bull-lead:focus-visible,
.bull-fr:hover, .bull-fr:focus-visible{
  background:var(--gsd-surface)!important; border-color:var(--gss-raise-border)!important; color:var(--gsd-fg)!important;
}
.article-card:hover h3, .bull-lead:hover .bl-title,
.bull-fr:hover .bull-fr-title{ color:var(--gsd-fg)!important; }
.article-card:hover .article-meta, .article-card:hover .article-meta .dot,
.article-card:hover .article-author,
.bull-lead:hover .bl-deck, .bull-lead:hover .bl-meta,
.bull-lead:hover .bl-meta .dot,
.bull-fr:hover .bull-num, .bull-fr:hover .bull-fr-meta{ color:var(--gsd-fg-faint)!important; }
.article-card:hover .art-more,
.bull-lead:hover .bl-cue,
.bull-fr:hover .bull-fr-cat, .bull-fr:hover .bulletin-arrow{ color:var(--gss-link-hover)!important; }
.article-card:hover .article-author{ border-top-color:var(--gsd-line)!important; }
.bull-fr:hover::before{ background:var(--gss-raise-border)!important; }

/* ============================================================================
   CTA RESTING FILL — unify the homepage CTAs (were leaf #5DC97B + ink text) to
   the brand standard #047122 + white, matching the rest of the site (owner rule).
   ============================================================================ */
.cta, .site-nav-cta{
  background:var(--gss-cta-bg)!important; border-color:var(--gss-cta-bg)!important; color:var(--gss-cta-fg)!important;
}
.cta *, .site-nav-cta *{ color:var(--gss-cta-fg)!important; }
.cta:hover, .cta:focus-visible, .site-nav-cta:hover, .site-nav-cta:focus-visible{
  background:var(--gss-cta-hover)!important; border-color:var(--gss-cta-hover)!important;
}
