/* home-calm.css (homepage only, loaded last)
   Gold is kept for primary actions: header "Find my firm", "Show my matches",
   the newsletter button, headline accents. Everything below the hero that used
   gold as decoration is neutral here. The hero (.ht .hv7, .hv8 card stack) is
   deliberately not touched. */

/* 1. Table: every row gets the same outlined button, affiliate or not */
#firmTable .ft .ft-cta .btn.sm,
:root[data-theme=light] #firmTable .ft .ft-cta .btn.sm{
  background:transparent!important;background-image:none!important;
  color:var(--text)!important;border:1px solid var(--line2)!important;
  box-shadow:none!important;filter:none!important}
#firmTable .ft .ft-cta a.btn.sm:hover,
:root[data-theme=light] #firmTable .ft .ft-cta a.btn.sm:hover{
  background:rgba(127,127,127,.12)!important;border-color:var(--muted)!important}

/* 2. Discount pills: quiet outline instead of gold */
#firmTable .ft .ft-deal-label,
:root[data-theme=light] #firmTable .ft .ft-deal-label,
.hboxes .ft-deal,
:root[data-theme=light] .hboxes .ft-deal{
  background:transparent!important;color:var(--muted)!important;
  border:1px solid var(--line2)!important;box-shadow:none!important}

/* 3. Sale price reads as plain text, list price stays crossed out */
#firmTable .ft .ft-sale,
#firmTable .ft td[data-l="Cost to fund"] .ft-sale,
:root[data-theme=light] #firmTable .ft td[data-l="Cost to fund"] .ft-sale{color:var(--text)!important}

/* 4. Section labels and text links stop using gold */
:root .band .eyebrow,
:root .site-foot .eyebrow{color:var(--muted)!important}
.hbox-h a,.hg-all,.ftsalenote{color:var(--muted)!important}
.hbox-h a:hover,.hg-all:hover{color:var(--text)!important}

/* 5. "Ends soon" bar: neutral panel, outlined button, no sheen */
#endsBar.ends,
:root[data-theme=light] #endsBar.ends{
  background:var(--panel2)!important;border:1px solid var(--line2)!important;
  border-left:1px solid var(--line2)!important}
#endsBar.ends::after,
:root[data-theme=light] #endsBar.ends::after{display:none!important}
#endsBar .ends-tag,
:root[data-theme=light] #endsBar .ends-tag{color:var(--text)}
#endsBar .ends-t b,
:root[data-theme=light] #endsBar .ends-t b{color:var(--text)}
/* button: same tinted gold chip as the hero buttons, white text */
#endsBar .ends-go,
.ends:hover #endsBar .ends-go,
#endsBar:hover .ends-go{
  background:#f0be551a!important;color:#fff!important;
  border:1px solid var(--gold,#e0b44e)!important;box-shadow:none!important;font-weight:600}
#endsBar:hover .ends-go{background:#f0be5533!important}
:root[data-theme=light] #endsBar .ends-go,
:root[data-theme=light] #endsBar:hover .ends-go{
  background:rgba(184,130,14,.12)!important;color:#1A1405!important;border-color:#B08E1E!important}

/* 7. Cascading hero card buttons ("More About ..."): same look as the selected
      chips (gold outline, soft gold tint) with white text. Light mode keeps dark
      text so it stays readable on the white card. */
.hv8-card .hv8-go,
.hv8-card .hv8-go:visited,
.hv8-card .hv8-go:hover,
.hv8-card .hv8-go:focus{
  background:#f0be551a!important;background-image:none!important;
  border:1px solid var(--gold,#e0b44e)!important;color:#fff!important;box-shadow:none!important;
  padding:10px!important}
.hv8-card .hv8-go:hover{background:#f0be5533!important}
:root[data-theme=light] .hv8-card .hv8-go,
:root[data-theme=light] .hv8-card .hv8-go:visited,
:root[data-theme=light] .hv8-card .hv8-go:hover,
:root[data-theme=light] .hv8-card .hv8-go:focus{
  background:rgba(184,130,14,.12)!important;border-color:#B08E1E!important;color:#1A1405!important}

/* 7b. Cascading cards, 601px and up: the button flows below the content instead
       of being pinned to the card bottom, so a longer price line (BluSky) can no
       longer run into it. All three cards share one height. Phones already lay the
       button out in flow. */
@media (min-width:601px){
  .hv8{height:470px}
  .hv8-card{display:flex;flex-direction:column;min-height:430px;margin-top:-215px}
  .hv8-card ul{margin-bottom:16px}
  .hv8-card .hv8-go{position:static;margin-top:auto}
}

/* 6. Prop Guard strip: no spinning gold border, neutral tag */
.hpair .pgstrip::before{display:none!important}
.hpair .pgstrip:hover{border-color:var(--muted)}
.hpair .pg-tag,
:root[data-theme=light] .hpair .pg-tag{
  background:transparent!important;color:var(--muted)!important;
  border:1px solid var(--line2);font-weight:600}
.pgstrip .pg-go{color:var(--text)}