/* Pricing page, Rivertree-style layout (Sept 26, 2026).
   Joseph asked for the structure of rivertreewealth.com/pricing in Valerio branding: a split
   hero with the photo bleeding to the right edge, one sand band holding the fee schedule as a
   centred card, and a two-column FAQ of plus boxes that turn navy when open. Layout and design
   only; all copy is Valerio's own. The hero, pills, bands and button now live in
   styles/page-kit.css (shared with the process page) and the question boxes in
   styles/faq-boxes.css (shared site-wide). This file is what only the pricing page has: the fee
   card and its table, and the FAQ section's closing space. Scoped to .pricing-rt. */

.pricing-rt{--pp-navy:#0c1a2d;--pp-gold:#d7b486;--pp-gold-text:#7d5f33;--pp-ground:#fcfcf9;
  --pp-sand:#efe7d9;--pp-card:#f8f3ea;--pp-quiet:#f5f1e9;--pp-edge:#ebe4d7;--pp-rule:#e0d7c6;
  --pp-rule-2:#d8ceba;--pp-muted:#4a5568}

/* ---------------------------------------------------------------- fee band */
.pricing-rt .pp-fees .wrap{text-align:center}
.pricing-rt .pp-card{max-width:860px;margin:44px auto 0;background:var(--pp-card);border:1px solid var(--pp-edge);
  border-radius:18px;padding:14px 44px}
.pricing-rt .pp-table{width:100%;border-collapse:separate;border-spacing:0;font-variant-numeric:tabular-nums}
.pricing-rt .pp-table th{padding:20px 12px 18px;font:600 13px/1.2 "General Sans",system-ui,sans-serif;
  letter-spacing:.14em;text-transform:uppercase;color:var(--pp-gold-text);text-align:center;
  border-bottom:1px solid var(--pp-rule-2)}
.pricing-rt .pp-table td{padding:22px 12px;text-align:center;border-bottom:1px solid var(--pp-rule);
  font:500 19px/1.3 "General Sans",system-ui,sans-serif;color:var(--pp-navy)}
.pricing-rt .pp-table tbody tr:last-child td{border-bottom:0}
.pricing-rt .pp-table th+th,.pricing-rt .pp-table td+td{border-left:1px solid var(--pp-rule)}
.pricing-rt .pp-table td+td{font:400 30px/1.1 "Editor's Note",Georgia,serif;font-weight:300;
  letter-spacing:-.01em;color:var(--pp-gold-text)}
/* the table comes alive (Sept 26, 2026, Joseph: "highlights stuff or it flows in").
   The rate bars that sat under each rate were removed the same day at Joseph's request
   ("get rid of the bars below the annual advisory fee percents"); do not put them back. Hover (or a tap, via scripts/pricing-page.js) lifts one row onto a light
   card with a gold edge and quiets the others by colour, not opacity, so the entrance animation
   below can never fight it. */
.pricing-rt .pp-rate{display:block}
.pricing-rt .pp-table tbody td{transition:background-color .25s ease,color .25s ease,box-shadow .25s ease,text-shadow .25s ease;cursor:default}
.pricing-rt .pp-table tbody tr:hover>td,.pricing-rt .pp-table tbody tr.is-active>td{background:#fffdf8}
.pricing-rt .pp-table tbody tr:hover>td:first-child,.pricing-rt .pp-table tbody tr.is-active>td:first-child{
  border-radius:12px 0 0 12px;box-shadow:inset 3px 0 0 var(--pp-gold)}
.pricing-rt .pp-table tbody tr:hover>td:last-child,.pricing-rt .pp-table tbody tr.is-active>td:last-child{
  border-radius:0 12px 12px 0;text-shadow:0 0 22px rgba(215,180,134,.7)}
/* quieted rows stay readable on the card (Astra 2, #4): amounts #636a77 is 4.9:1 on #f8f3ea, rates
   #8f7553 is 3.9:1 at 30px (large text). The earlier #6b7280 and #a38a66 were 4.37 and 2.98. */
@media(hover:hover){
  .pricing-rt .pp-table tbody:hover tr:not(:hover)>td:first-child{color:#636a77}
  .pricing-rt .pp-table tbody:hover tr:not(:hover)>td:last-child{color:#8f7553}
}
.pricing-rt .pp-table tbody.has-active tr:not(.is-active)>td:first-child{color:#636a77}
.pricing-rt .pp-table tbody.has-active tr:not(.is-active)>td:last-child{color:#8f7553}
/* entrance: armed only when the table starts below the fold (scripts/pricing-page.js) */
.pricing-rt .pp-card.is-armed tbody td{opacity:0}
.pricing-rt .pp-card.is-armed.is-in tbody td{animation:pp-row-in .6s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:calc(var(--i,0) * .13s + .1s)}
@keyframes pp-row-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media print{.pricing-rt .pp-card.is-armed tbody td{opacity:1;animation:none}}
.one-ground.pricing-rt main .pp-fees p.pp-note{max-width:40em;margin:24px auto 0;font-size:16px;
  line-height:1.6;color:var(--pp-muted);text-align:center}

/* ---------------------------------------------------------------- FAQ
   The question boxes are the shared component in styles/faq-boxes.css (Sept 26, 2026).
   The banner follows the FAQ on the same cream ground. */
body.pricing-rt.one-ground main>section.pp-faq{padding-bottom:120px}

/* ---------------------------------------------------------------- narrower screens */
@media(max-width:760px){
  body.pricing-rt.one-ground main>section.pp-faq{padding-bottom:88px}
  .pricing-rt .pp-card{margin-top:34px;padding:6px 18px;border-radius:16px}
  .pricing-rt .pp-table th{padding:16px 6px 14px;font-size:11.5px;letter-spacing:.1em}
  .pricing-rt .pp-table td{padding:18px 6px;font-size:16px}
  .pricing-rt .pp-table td+td{font-size:25px}
}
@media(prefers-reduced-motion:reduce){
  .pricing-rt .pp-table tbody td{transition:none}
  .pricing-rt .pp-card.is-armed tbody td{opacity:1;animation:none}
}