/*
 * Prototype design system — ported verbatim from prototypes/rr_homepage_redesign.html.
 * Every rule is scoped under `.rr` so it cannot leak into Kadence chrome, the admin
 * bar, or plugin UI. Site chrome and every block pattern render inside a `.rr` wrapper.
 * Tokens live in style.css (:root); this file is the component layer.
 */

.rr * { margin: 0; padding: 0; box-sizing: border-box; }
.rr { font-family: var(--font-body); color: var(--ink); line-height: 1.55; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.rr img { max-width: 100%; display: block; }
.rr a { text-decoration: none; color: inherit; }
.rr .wrap { max-width: 1120px; margin: 0 auto; padding: 0 22px; }

/* top bar */
.rr .topbar { background: var(--navy); color: #cfe6dd; font-size: 14px; padding: 7px 0; }
.rr .topbar .wrap { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.rr .topbar b { color: #fff; }
.rr .topbar .tag { color: #9fd08a; font-weight: 600; }

/* header */
.rr header { background: var(--white); position: sticky; top: 0; z-index: 50; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.rr header .wrap { display: flex; align-items: center; justify-content: space-between; padding-top: 14px; padding-bottom: 14px; gap: 16px; }
.rr .logo { font-weight: 800; font-size: 20px; color: var(--navy); letter-spacing: .2px; display: flex; align-items: center; gap: 11px; }
.rr .logo span { color: var(--green); }
.rr .logo small { display: block; font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: .6px; text-transform: uppercase; }
.rr .logo img { height: 62px; width: auto; }
.rr .hero-badge { height: clamp(170px, 22vw, 230px); width: auto; margin: 0 auto 22px; filter: drop-shadow(0 10px 26px rgba(0,0,0,.5)); }
.rr nav { display: flex; gap: 22px; font-weight: 600; font-size: 15px; color: var(--teal); align-items: center; }
.rr .nav-item { position: relative; }
/* padding bridges the gap to the dropdown so hover doesn't drop */
.rr .nav-item > a { display: inline-block; padding: 8px 0; color: var(--teal); white-space: nowrap; }
.rr .nav-item > a:hover { color: var(--green-dark); }
.rr .has-sub > a::after { content: "\25BE"; font-size: 10px; margin-left: 5px; vertical-align: middle; opacity: .7; }
.rr .subnav { position: absolute; top: 100%; left: 0; min-width: 240px; background: var(--white); border-radius: 12px; box-shadow: 0 12px 30px rgba(11,60,73,.16); padding: 8px 0; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .14s ease, transform .14s ease; z-index: 60; }
.rr .nav-item.has-sub:hover .subnav, .rr .nav-item.has-sub:focus-within .subnav { opacity: 1; visibility: visible; transform: translateY(0); }
.rr .subnav a { display: block; padding: 9px 18px; color: var(--ink); font-weight: 600; font-size: 14.5px; white-space: nowrap; }
.rr .subnav a:hover { background: var(--bg); color: var(--green-dark); }
.rr .btn { display: inline-block; font-weight: 700; border-radius: 10px; padding: 12px 20px; font-size: 15.5px; transition: .15s; text-align: center; white-space: nowrap; }
.rr .btn-call { background: var(--amber); color: #3c2a00; }
.rr .btn-call:hover { filter: brightness(1.06); }
.rr .btn-book { background: var(--green); color: #fff; }
.rr .btn-book:hover { background: var(--green-dark); }
.rr .btn-ghost { border: 2px solid #ffffffaa; color: #fff; }
.rr .btn-ghost:hover { background: #ffffff22; }
.rr .header-cta { display: flex; gap: 10px; align-items: center; }

/* hero */
.rr .hero { position: relative; color: #fff; background: linear-gradient(rgba(8,42,52,.78), rgba(8,42,52,.86)), url('https://assets.zyrosite.com/cdn-cgi/image/format=auto,w=1600,h=900,fit=crop/n8MYutJM0qk58U8v/img_2789.heic-qdvU8EH1bECBX4Tm.jpg') center/cover; }
.rr .hero .wrap { padding: 84px 22px 70px; max-width: 900px; text-align: center; }
.rr .hero h1 { font-size: clamp(32px, 5.2vw, 52px); line-height: 1.12; font-weight: 800; letter-spacing: -.5px; }
.rr .hero h1 em { font-style: normal; color: #A6E06B; }
.rr .hero p.sub { margin: 18px auto 26px; font-size: clamp(16px, 2vw, 19px); color: #dceee6; max-width: 680px; }
.rr .hero .ctas { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.rr .hero .ctas .btn { font-size: 17px; padding: 15px 26px; }
.rr .trust { margin-top: 26px; font-size: 14px; color: #cfe6dd; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rr .trust b { color: #fff; }
.rr .trust .dot { opacity: .5; }

/* emergency strip */
.rr .strip { background: var(--amber); color: #3c2a00; font-weight: 700; text-align: center; padding: 11px 16px; font-size: 15.5px; }
.rr .strip a { text-decoration: underline; }

/* sections */
.rr section { padding: 64px 0; }
.rr .kicker { color: var(--green-dark); font-weight: 800; text-transform: uppercase; font-size: 13px; letter-spacing: 1.4px; }
.rr h2 { font-size: clamp(26px, 3.4vw, 36px); color: var(--navy); letter-spacing: -.4px; margin: 6px 0 14px; }
.rr .lede { color: var(--muted); font-size: 17px; max-width: 640px; }

/* benefits */
.rr .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 22px; margin-top: 34px; }
.rr .card { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); padding: 28px; }
.rr .card .ic { width: 46px; height: 46px; border-radius: 12px; background: var(--green); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 800; margin-bottom: 14px; }
.rr .card.t2 .ic { background: var(--teal); }
.rr .card.t3 .ic { background: var(--navy); }
.rr .card h3 { color: var(--navy); font-size: 19px; margin-bottom: 8px; }
.rr .card p { color: var(--muted); font-size: 15.5px; }

/* services */
.rr .svc { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; margin-top: 34px; }
.rr .svc a { background: var(--white); border-radius: 12px; box-shadow: var(--shadow); padding: 20px 22px; display: flex; flex-direction: column; gap: 6px; border-left: 5px solid var(--green); transition: .15s; }
.rr .svc a:hover { transform: translateY(-3px); }
.rr .svc b { color: var(--navy); font-size: 16.5px; }
.rr .svc span { color: var(--muted); font-size: 14px; }
.rr .svc .price { color: var(--green-dark); font-weight: 700; font-size: 13.5px; }
/* hub group sub-heading (grouped hubs like /resources/) */
.rr .rr-group { font-family: var(--font-display); color: var(--navy); font-size: 19px; font-weight: 600; margin: 40px 0 0; }
.rr .rr-group:first-of-type { margin-top: 30px; }
.rr .rr-group + .svc { margin-top: 16px; }

/* Florida coverage map (inc/coverage-map.php → [rr_coverage_map]) */
/* dark "map card" — zoomed central FL, pill labels. Shared by [rr_coverage_map]
   (service-areas + homepage) and the hero carousel. */
.rr .rr-coverage { margin-top: 30px; }
.rr .cov-mapwrap { max-width: 620px; margin: 0 auto; background: linear-gradient(155deg, #0E5A6E, #0B3C49 60%, #082A34); border-radius: var(--radius-lg); padding: 22px 26px; box-shadow: var(--shadow-md); }
.rr .famap { width: 100%; height: auto; display: block; overflow: hidden; }
.rr .famap .c { fill: rgba(255,255,255,.08); stroke: rgba(8,42,52,.45); stroke-width: 1; }
.rr .famap .served { fill: var(--green); stroke: #0B3C49; stroke-width: 1.2; transition: fill .16s ease; }
.rr .famap .served:hover { fill: var(--green-dark); }
.rr .famap .served.home { fill: var(--amber); }
.rr .famap .served.home:hover { fill: #e0950f; }
.rr .famap .outline { fill: none; stroke: rgba(255,255,255,.4); stroke-width: 2; stroke-linejoin: round; }
.rr .famap .lead { stroke: rgba(255,255,255,.4); stroke-width: 1; }
.rr .famap .leaddot { fill: #fff; }
.rr .famap .lblbg { fill: #fff; stroke: rgba(8,42,52,.32); stroke-width: 1.1; }
.rr .famap .lblbg-home { fill: #0B3C49; stroke: #A6E06B; stroke-width: 1.5; }
.rr .famap .lbl { fill: #0B3C49; font-family: var(--font-body); font-size: 13px; font-weight: 700; pointer-events: none; }
.rr .famap .pin-halo { fill: none; stroke: #fff; stroke-width: 2; }
.rr .famap .pin-star { fill: #fff; stroke: #0B3C49; stroke-width: 1; }
.rr .famap .pin-label { fill: #fff; font-family: var(--font-display); font-weight: 700; font-size: 13px; pointer-events: none; }
.rr .cov-legend { display: flex; gap: 12px 22px; flex-wrap: wrap; justify-content: center; margin-top: 16px; font-size: 13.5px; color: var(--muted); font-weight: 600; }
.rr .cov-legend i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; vertical-align: -2px; margin-right: 7px; }
.rr .cov-legend .lg-home { background: var(--amber); }
.rr .cov-legend .lg-served { background: var(--green); }
.rr .cov-legend .lg-rest { background: #d9e2df; border: 1px solid #c2d0cc; }

/* how it works */
.rr .how { background: var(--navy); color: #fff; }
.rr .how h2 { color: #fff; }
.rr .how .lede { color: #bcd8cd; }
.rr .steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin-top: 36px; }
.rr .step { background: #0F4A5B; border-radius: var(--radius); padding: 24px; }
.rr .step .n { font-size: 13px; font-weight: 800; color: #A6E06B; letter-spacing: 1px; }
.rr .step h3 { font-size: 17.5px; margin: 8px 0 6px; }
.rr .step p { font-size: 14.5px; color: #cfe3da; }

/* county */
.rr .county .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin-top: 30px; }
.rr .cty { background: var(--white); border-radius: 12px; box-shadow: var(--shadow); padding: 22px; border-top: 5px solid var(--teal); }
.rr .cty b { font-size: 24px; color: var(--green-dark); display: block; }
.rr .cty h3 { color: var(--navy); font-size: 16.5px; margin: 4px 0 6px; }
.rr .cty p { font-size: 14px; color: var(--muted); }
.rr .cty .note { font-size: 12.5px; color: #8a9a98; margin-top: 8px; font-style: italic; }
.rr .county .cta-row { margin-top: 26px; display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.rr .fineprint { font-size: 13px; color: #8a9a98; margin-top: 14px; font-style: italic; }

/* reviews */
.rr .reviews { background: linear-gradient(180deg, #EFF7EE, #F6FAF9); }
.rr .stars { color: #F5A623; font-size: 22px; letter-spacing: 2px; }
.rr .quoteRow { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 30px; }
.rr .q { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; font-size: 15px; color: var(--ink); }
.rr .q .who { margin-top: 12px; font-weight: 700; color: var(--navy); font-size: 14px; }
.rr .q .src { color: var(--muted); font-weight: 400; }
/* Trustindex Google-reviews widget (grid layout) sits on the brand reviews
   background. The plugin ships its own card styling; these scoped overrides pull
   the grid cards toward the prototype .q cards — brand soft-shadow + navy names. */
.rr .reviews-widget { margin-top: 30px; }
.rr .reviews .ti-widget.ti-goog .ti-review-item > .ti-inner {
  background-color: var(--white) !important;
  border-color: transparent !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  padding: 24px !important;
}
.rr .reviews .ti-widget.ti-goog .ti-review-item .ti-name { color: var(--navy) !important; }

/* areas */
.rr .areas .pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.rr .pill { background: var(--white); border: 1.5px solid #d7e5e2; border-radius: 999px; padding: 8px 16px; font-size: 14px; font-weight: 600; color: var(--teal); }
.rr .pill.home { background: var(--green); border-color: var(--green); color: #fff; }

/* faq */
.rr .faq details { background: var(--white); border-radius: 12px; box-shadow: var(--shadow); padding: 18px 22px; margin-top: 12px; }
.rr .faq summary { font-weight: 700; color: var(--navy); cursor: pointer; font-size: 16px; }
.rr .faq p { margin-top: 10px; color: var(--muted); font-size: 15px; }

/* final cta */
.rr .final { background: linear-gradient(rgba(8,42,52,.85), rgba(8,42,52,.9)), url('https://assets.zyrosite.com/cdn-cgi/image/format=auto,w=1600,h=700,fit=crop/n8MYutJM0qk58U8v/generated/generated-xEB7m6KhwyZd578E.png') center/cover; color: #fff; text-align: center; }
.rr .final h2 { color: #fff; }
.rr .final p { color: #d6e9e0; max-width: 560px; margin: 10px auto 26px; }

/* footer */
.rr footer { background: var(--navy); color: #bcd8cd; padding: 48px 0 26px; font-size: 14.5px; }
.rr footer .cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 30px; }
.rr footer h4 { color: #fff; font-size: 15px; margin-bottom: 12px; }
.rr footer a { display: block; padding: 3px 0; color: #bcd8cd; }
.rr footer a:hover { color: #A6E06B; }
.rr .nap b { color: #fff; }
.rr .tagline { margin-top: 34px; padding-top: 20px; border-top: 1px solid #1d5567; text-align: center; color: #9fc4b6; font-size: 14px; }
.rr .tagline b { color: #A6E06B; }

/* mobile sticky call */
.rr .sticky-call { display: none; }
/* The dropdown nav + dual CTAs can't all share the header bar on narrow widths.
   Drop the header CTAs first (the topbar phone + sticky bar still cover Call),
   then collapse the nav and surface the sticky call bar. */
@media (max-width: 1024px) {
  .rr .header-cta { display: none; }
}
@media (max-width: 860px) {
  .rr nav { display: none; }
  .rr .sticky-call { display: block; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60; background: var(--amber); color: #3c2a00; text-align: center; font-weight: 800; padding: 15px; font-size: 17px; box-shadow: 0 -4px 16px rgba(0,0,0,.18); }
  body { padding-bottom: 54px; }
}

/* hamburger + slide-down mobile menu (shown ≤860px) */
/* High specificity + appearance reset to defeat Kadence's default button chrome. */
.rr header .rr-burger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 9px; background: none; border: 0; border-radius: 0; box-shadow: none; -webkit-appearance: none; appearance: none; cursor: pointer; }
.rr-burger span { display: block; width: 100%; height: 3px; border-radius: 2px; background: var(--navy); transition: transform .22s ease, opacity .18s ease; }
.rr-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.rr-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.rr-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
.rr-mobnav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--white); border-top: 1px solid rgba(11,60,73,.08); box-shadow: var(--shadow-lg); max-height: calc(100vh - 96px); overflow-y: auto; padding: 8px 22px 22px; }
.rr-mobnav.is-open { display: block; }
.rr-mobsec { padding: 12px 0; border-bottom: 1px solid #eef4f2; }
.rr-mobtop { display: block; font-family: var(--font-display); font-weight: 600; font-size: 18px; color: var(--navy); margin-bottom: 7px; }
.rr-mobsub { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 16px; }
.rr-mobsub a { display: block; color: var(--muted); font-weight: 600; font-size: 14.5px; padding: 5px 0; }
.rr-mobtop:hover, .rr-mobsub a:hover { color: var(--green-dark); }
.rr-mobcta { display: flex; gap: 10px; margin-top: 18px; }
.rr-mobcta .btn { flex: 1; font-size: 16px; padding: 14px; }
@media (max-width: 860px) { .rr header .rr-burger { display: flex; } }

/* ===================================================================
 * Inner / cluster page components — ported from rr_service_emergency.html.
 * Used by the SERP-bundle importer (bin/import-bundle.php) to render
 * pipeline pages in the brand design system.
 * =================================================================== */

/* page hero (inner pages) */
.rr .page-hero { background: linear-gradient(135deg, var(--navy), var(--teal)); color: #fff; padding: 56px 0 46px; }
.rr .page-hero .crumb { font-size: 13px; color: #9fc4b6; margin-bottom: 14px; }
.rr .page-hero .crumb a { color: #A6E06B; }
.rr .page-hero h1 { font-size: clamp(28px, 4.2vw, 42px); line-height: 1.15; font-weight: 800; letter-spacing: -.4px; max-width: 820px; }
.rr .page-hero p.sub { margin: 14px 0 24px; font-size: 17.5px; color: #dceee6; max-width: 720px; }
.rr .page-hero .ctas { display: flex; gap: 12px; flex-wrap: wrap; }

/* long-form article body (rendered from pipeline body_html) */
.rr-prose { max-width: 820px; margin: 0 auto; }
.rr-prose h2 { font-size: clamp(22px, 3vw, 30px); color: var(--navy); letter-spacing: -.3px; margin: 34px 0 12px; }
.rr-prose h2:first-child { margin-top: 0; }
.rr-prose h3 { color: var(--navy); font-size: 18.5px; margin: 24px 0 8px; }
.rr-prose p { margin-bottom: 14px; color: var(--ink); font-size: 16.5px; }
.rr-prose ul, .rr-prose ol { margin: 0 0 16px 22px; }
.rr-prose li { margin-bottom: 8px; font-size: 16.5px; }
.rr-prose a { color: var(--green-dark); font-weight: 600; text-decoration: underline; }
.rr-prose a:hover { color: var(--teal); }
.rr-prose strong { color: var(--ink); }
.rr-prose hr { border: 0; border-top: 1px solid #dbe7e3; margin: 34px 0 18px; }
/* references block (kept for E-E-A-T) — the h3 + ol after the trailing <hr> */
.rr-prose h3 + ol { font-size: 13.5px; color: var(--muted); margin-left: 18px; }
.rr-prose h3 + ol li { margin-bottom: 5px; font-size: 13.5px; }

/* optional rich components for future bundles (alert, note, cards, table, steps) */
.rr .alert { background: #FFF4E0; border-left: 5px solid var(--amber); border-radius: 10px; padding: 18px 20px; margin: 8px 0 18px; font-size: 15.5px; }
.rr .alert b { color: #7a5200; }
.rr .note { background: #EAF4E4; border-left: 5px solid var(--green); border-radius: 10px; padding: 16px 20px; margin: 14px 0; font-size: 15px; }
.rr .cardgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; margin: 20px 0; }
.rr .cardgrid .c { background: var(--white); border-radius: 12px; box-shadow: var(--shadow); padding: 20px 22px; border-left: 5px solid var(--green); }
.rr .cardgrid .c b { color: var(--navy); display: block; margin-bottom: 5px; }
.rr .cardgrid .c span { color: var(--muted); font-size: 14.5px; }
.rr-prose table, .rr table { width: 100%; border-collapse: collapse; background: var(--white); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); margin: 18px 0; font-size: 15px; }
.rr-prose th, .rr th { background: var(--navy); color: #fff; text-align: left; padding: 12px 16px; font-size: 14px; }
.rr-prose td, .rr td { padding: 12px 16px; border-top: 1px solid #e6efed; color: var(--ink); }
.rr td.em { font-weight: 700; color: var(--green-dark); }

/* ===================================================================
 * REFINED ELEVATION (2026-06 design pass)
 * Warm & trustworthy: Fraunces display + Hanken Grotesk body, layered
 * depth, water-tinted atmosphere, tasteful motion. Layered last so these
 * rules win where selectors overlap the base above.
 * =================================================================== */

/* — Type ————————————————————————————————————————— */
.rr h1, .rr h2, .rr h3,
.rr .hero h1, .rr .page-hero h1,
.rr-prose h2, .rr-prose h3,
.rr .card h3, .rr .step h3, .rr .cty h3, .rr .cty b,
.rr footer h4, .rr .logo {
  font-family: var(--font-display);
  font-optical-sizing: auto;
  font-weight: 600;
  letter-spacing: -.012em;
}
.rr .hero h1, .rr .page-hero h1 { font-weight: 600; letter-spacing: -.02em; }
.rr .logo { font-weight: 700; letter-spacing: -.01em; }
/* Kicker becomes a small label with a leading rule */
.rr .kicker { display: inline-flex; align-items: center; gap: 9px; font-family: var(--font-body); font-size: 12.5px; letter-spacing: .16em; }
.rr .kicker::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: currentColor; opacity: .75; }
.rr .how .kicker, .rr .page-hero .crumb { /* keep existing colors */ }

/* — Buttons ——————————————————————————————————————— */
.rr .btn { border-radius: 12px; box-shadow: var(--shadow-sm); will-change: transform; }
.rr .btn-call { background: linear-gradient(180deg, #FFBA38, var(--amber)); box-shadow: 0 8px 20px -7px rgba(245,166,35,.65); }
.rr .btn-call:hover { transform: translateY(-2px); filter: none; box-shadow: 0 13px 26px -7px rgba(245,166,35,.75); }
.rr .btn-book { background: linear-gradient(180deg, #84C732, var(--green-dark)); box-shadow: 0 8px 20px -7px rgba(94,148,33,.55); }
.rr .btn-book:hover { transform: translateY(-2px); background: linear-gradient(180deg, #84C732, var(--green-dark)); box-shadow: 0 13px 26px -7px rgba(94,148,33,.65); }
.rr .btn-ghost { backdrop-filter: blur(3px); }
.rr .btn-ghost:hover { transform: translateY(-2px); }

/* — Atmosphere: gradient mesh + film grain on dark sections ————— */
.rr .hero, .rr .page-hero, .rr .how, .rr .final, .rr footer { position: relative; isolation: isolate; }
.rr .hero::after, .rr .page-hero::after, .rr .how::after, .rr .final::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(70% 90% at 12% -10%, rgba(118,184,42,.20), transparent 60%),
    radial-gradient(60% 80% at 108% 110%, rgba(13,84,104,.55), transparent 55%);
}
.rr .hero::before, .rr .page-hero::before, .rr .how::before, .rr .final::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  opacity: .10; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* — Hero ——————————————————————————————————————————— */
.rr .hero .wrap { padding: 96px 22px 84px; }
.rr .hero-badge { filter: drop-shadow(0 16px 36px rgba(0,0,0,.55)); }
/* Force white headings on the dark heroes — Kadence sets an explicit h1
   color that otherwise beats the inherited #fff and renders near-black. */
.rr .hero h1, .rr .page-hero h1 { color: #fff; }
.rr .hero h1 em { color: #B6EB7A; }
.rr .page-hero { background: linear-gradient(135deg, #093843 0%, var(--teal) 72%, #0c5266 100%); }

/* — Motion: hero load stagger + on-scroll reveal ————————————— */
@keyframes rr-rise { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .rr .hero-badge, .rr .hero h1, .rr .hero p.sub, .rr .hero .ctas, .rr .hero .trust {
    opacity: 0; transform: translateY(16px); animation: rr-rise .7s cubic-bezier(.2,.7,.2,1) forwards;
  }
  .rr .hero-badge { animation-delay: .05s; }
  .rr .hero h1 { animation-delay: .16s; }
  .rr .hero p.sub { animation-delay: .28s; }
  .rr .hero .ctas { animation-delay: .40s; }
  .rr .hero .trust { animation-delay: .52s; }
  .rr-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .65s cubic-bezier(.2,.7,.2,1); }
  .rr-reveal.is-in { opacity: 1; transform: none; }
}

/* — Cards & components: depth + hover ——————————————————— */
.rr .card { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); border: 1px solid rgba(11,60,73,.05); transition: transform .18s ease, box-shadow .18s ease; }
.rr .card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.rr .card .ic { border-radius: 14px; box-shadow: 0 9px 18px -7px rgba(118,184,42,.55); }
.rr .card.t2 .ic { box-shadow: 0 9px 18px -7px rgba(14,90,110,.55); }
.rr .card.t3 .ic { box-shadow: 0 9px 18px -7px rgba(11,60,73,.55); }
.rr .svc a { border-radius: var(--radius); box-shadow: var(--shadow-md); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.rr .svc a:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-left-color: var(--amber); }
.rr .cty { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); transition: transform .18s ease, box-shadow .18s ease; }
.rr .cty:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.rr .step { background: linear-gradient(165deg, #105062, #0B3F4E); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); }
.rr .pill { transition: transform .15s ease, border-color .15s ease, color .15s ease; }
.rr .pill:hover { transform: translateY(-2px); border-color: var(--green); color: var(--green-dark); }
.rr .q { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

/* — FAQ: refined accordion with +/− affordance ————————————— */
.rr .faq details { border-radius: var(--radius); transition: box-shadow .18s ease; border: 1px solid rgba(11,60,73,.05); }
.rr .faq details[open] { box-shadow: var(--shadow-md); }
.rr .faq summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.rr .faq summary::-webkit-details-marker { display: none; }
.rr .faq summary::after { content: "+"; font-family: var(--font-body); font-weight: 700; color: var(--green); font-size: 22px; line-height: 1; transition: transform .2s ease; }
.rr .faq details[open] summary::after { content: "\2212"; }

/* — Footer polish ——————————————————————————————————— */
.rr footer { background: linear-gradient(180deg, #0B3C49, #082b35); }

/* — Prose elevation (content/detail pages) ——————————————— */
.rr-prose { font-size: 17px; line-height: 1.7; }
.rr-prose > p:first-of-type { font-size: 19.5px; line-height: 1.6; color: #234049; }
.rr-prose h2 { font-size: clamp(23px, 3vw, 31px); margin-top: 40px; }
.rr-prose h3 { font-size: 19px; }
.rr-prose p { margin-bottom: 16px; }
/* bullets → brand square markers */
.rr-prose ul { list-style: none; margin-left: 0; }
.rr-prose ul > li { position: relative; padding-left: 26px; }
.rr-prose ul > li::before { content: ""; position: absolute; left: 3px; top: .62em; width: 8px; height: 8px; border-radius: 2px; background: var(--green); }
/* ordered lists → numbered badges */
.rr-prose ol { list-style: none; counter-reset: rrol; margin-left: 0; }
.rr-prose ol > li { counter-increment: rrol; position: relative; padding-left: 44px; margin-bottom: 13px; }
.rr-prose ol > li::before { content: counter(rrol); position: absolute; left: 0; top: -1px; width: 29px; height: 29px; border-radius: 9px; background: var(--navy); color: #fff; font-family: var(--font-body); font-weight: 700; font-size: 14px; display: flex; align-items: center; justify-content: center; }
/* references stay plain decimals + muted */
.rr-prose h3 + ol { list-style: decimal; counter-reset: none; margin-left: 20px; font-size: 13.5px; color: var(--muted); }
.rr-prose h3 + ol > li { counter-increment: none; padding-left: 0; margin-bottom: 6px; font-size: 13.5px; }
.rr-prose h3 + ol > li::before { content: none; }
/* external citation list (kept for E-E-A-T) — muted source list, real links */
.rr-prose .rr-refs { list-style: none; margin: 14px 0 0; padding-top: 14px; border-top: 1px solid #dbe7e3; font-size: 13.5px; color: var(--muted); }
.rr-prose .rr-refs > li { padding-left: 0; margin-bottom: 8px; font-size: 13.5px; }
.rr-prose .rr-refs > li::before { content: none; }
.rr-prose .rr-refs a { color: var(--teal); font-weight: 600; word-break: break-word; }
/* inline citation chips (importer wraps [n] → <sup class="cite">) */
.rr-prose .cite { font-size: .72em; font-weight: 700; vertical-align: super; line-height: 0; }
.rr-prose .cite a { color: var(--teal); padding: 0 1px; } /* teal ~7:1 on white (AA) vs green-dark 3.4 */
.rr-prose .cite a:hover { color: var(--green-dark); }

/* — Content callouts (importer wraps matching sections) ————————— */
.rr-prose .cl { border-radius: var(--radius-lg); padding: 22px 24px; margin: 24px 0; box-shadow: var(--shadow-sm); border: 1px solid rgba(11,60,73,.06); background: var(--white); }
.rr-prose .cl > :last-child { margin-bottom: 0; }
.rr-prose .cl-signs { background: #f0f7ec; border-color: rgba(118,184,42,.22); }
.rr-prose .cl-dont { background: #fdf3ef; border-color: rgba(214,93,58,.22); }
.rr-prose .cl-dont ul > li::before { content: "\2715"; width: auto; height: auto; top: 0; left: 2px; background: none; color: #d65d3a; font-weight: 800; font-size: 13px; }
.rr-prose .cl-signs ul > li::before { background: var(--amber); }
.rr-prose .cl-steps { background: linear-gradient(180deg, #ffffff, #f7fbf4); border-color: rgba(11,60,73,.08); }

/* ===================================================================
 * DIRECTION C — "SPLIT SYSTEM" (2026-06-15 homepage look-and-feel pass)
 * Bolder rethink of the homepage: split hero, bento credential band,
 * bento why/services, dark how-it-works with a duotone process photo,
 * county bento with the home county highlighted. All scoped under .rr.
 * Photo treatment: hero = natural + navy scrim; supporting = duotone.
 * Reuses existing primitives for strip / reviews / areas / faq.
 * =================================================================== */

/* — photo treatments ———————————————————————————————— */
.rr .duotone { position: relative; overflow: hidden; background: var(--navy); }
.rr .duotone img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05) brightness(.9); mix-blend-mode: luminosity; opacity: .85; }
.rr .duotone::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(11,60,73,.72), rgba(14,90,110,.45) 45%, rgba(118,184,42,.4)); mix-blend-mode: multiply; }
.rr .scrim { position: relative; overflow: hidden; background: var(--navy); }
.rr .scrim img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.05) contrast(1.03); }
.rr .scrim.soft::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,42,52,.5), transparent 50%); }

/* — split hero ————————————————————————————————————— */
.rr .heroC { padding: 0; position: relative; display: grid; grid-template-columns: 1.04fr .96fr; min-height: 560px; background: linear-gradient(155deg, #0E5A6E, #0B3C49 58%, #082A34); }
.rr .heroC::after { content: ""; position: absolute; inset: 0; background: radial-gradient(620px 480px at 18% 12%, rgba(118,184,42,.22), transparent 60%); pointer-events: none; }
.rr .heroC .left { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 70px clamp(28px,4vw,64px); color: #fff; z-index: 2; }
.rr .heroC .tagC { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; font-size: 12.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #0B3C49; background: #A6E06B; border-radius: 999px; padding: 7px 14px; }
.rr .heroC h1 { font-size: clamp(40px,4.8vw,64px); font-weight: 700; margin: 22px 0 0; line-height: 1.0; letter-spacing: -.025em; color: #fff; }
.rr .heroC h1 em { font-style: normal; color: #B6EB7A; }
.rr .heroC .sub { margin: 22px 0 30px; font-size: 18.5px; color: #d4eadf; max-width: 42ch; }
.rr .heroC .ctas { display: flex; gap: 13px; flex-wrap: wrap; align-items: center; }
.rr .heroC .ctas .btn { font-size: 16.5px; padding: 15px 26px; }
/* note: reset the inherited .rr .note callout box (pale-green bg) — this is a hero caption, not a content callout */
.rr .heroC .note { margin-top: 18px; padding: 0; background: transparent; border: 0; border-radius: 0; font-size: 14.5px; font-weight: 500; color: #cfe6dd; display: flex; align-items: center; gap: 9px; }
.rr .heroC .note svg { width: 16px; height: 16px; color: #A6E06B; flex: none; }
.rr .heroC .right { position: relative; }
.rr .heroC .right .scrim { position: absolute; inset: 0; clip-path: polygon(14% 0,100% 0,100% 100%,0 100%); }
.rr .heroC .right .scrim::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, rgba(11,60,73,.62), rgba(11,60,73,.06) 55%); }
.rr .heroC .floatcard { position: absolute; right: 26px; bottom: 26px; z-index: 3; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-radius: 16px; box-shadow: var(--shadow-lg); padding: 16px 18px; display: flex; align-items: center; gap: 13px; max-width: 290px; }
.rr .heroC .floatcard .dot { width: 11px; height: 11px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(118,184,42,.6); animation: rr-pulse 2.2s infinite; flex: none; }
.rr .heroC .floatcard b { display: block; color: var(--navy); font-size: 14.5px; font-family: var(--font-display); }
.rr .heroC .floatcard span { color: var(--muted); font-size: 12.5px; }
@keyframes rr-pulse { 0% { box-shadow: 0 0 0 0 rgba(118,184,42,.6); } 70% { box-shadow: 0 0 0 9px rgba(118,184,42,0); } 100% { box-shadow: 0 0 0 0 rgba(118,184,42,0); } }

/* — bento credential band ——————————————————————————— */
.rr .bentoband { background: var(--bg); padding: 26px 0; }
.rr .bentoband .grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 14px; }
.rr .bentoband .tile { background: #fff; border-radius: 14px; box-shadow: var(--shadow-sm); padding: 18px 20px; display: flex; align-items: center; gap: 13px; }
.rr .bentoband .tile.accent { background: var(--navy); color: #fff; }
.rr .bentoband .tile .ic { width: 40px; height: 40px; border-radius: 11px; background: #EAF6DE; color: var(--green-dark); display: grid; place-items: center; flex: none; font-size: 20px; }
.rr .bentoband .tile.accent .ic { background: rgba(166,224,107,.16); color: #A6E06B; }
.rr .bentoband .tile .ic svg { width: 21px; height: 21px; }
.rr .bentoband .tile b { display: block; font-family: var(--font-display); color: var(--navy); font-size: 15px; }
.rr .bentoband .tile.accent b { color: #fff; }
.rr .bentoband .tile span { font-size: 12.5px; color: var(--muted); }
.rr .bentoband .tile.accent span { color: #bcd8cd; }

/* — bento "why" ————————————————————————————————————— */
.rr .bentoC { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 18px; margin-top: 38px; }
.rr .bentoC .bC { border-radius: var(--radius-lg); padding: 30px; position: relative; overflow: hidden; }
.rr .bentoC .bC.feat { background: linear-gradient(145deg, #0B3C49, #0E5A6E); color: #fff; }
.rr .bentoC .bC.feat::after { content: ""; position: absolute; right: -40px; top: -40px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, rgba(166,224,107,.3), transparent 70%); }
.rr .bentoC .bC.plain { background: var(--bg); border: 1px solid rgba(11,60,73,.08); }
.rr .bentoC .bC .ic { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; margin-bottom: 16px; }
.rr .bentoC .bC.feat .ic { background: rgba(166,224,107,.16); color: #A6E06B; }
.rr .bentoC .bC.plain .ic { background: var(--green); color: #fff; }
.rr .bentoC .bC.plain:nth-child(3) .ic { background: var(--teal); }
.rr .bentoC .bC .ic svg { width: 25px; height: 25px; }
.rr .bentoC .bC h3 { font-size: 21px; margin-bottom: 9px; font-family: var(--font-display); position: relative; z-index: 1; }
.rr .bentoC .bC.feat h3 { color: #fff; }
.rr .bentoC .bC.plain h3 { color: var(--navy); }
.rr .bentoC .bC p { font-size: 15px; position: relative; z-index: 1; }
.rr .bentoC .bC.feat p { color: #cfe6dd; }
.rr .bentoC .bC.plain p { color: var(--muted); }

/* — bento services —————————————————————————————————— */
.rr .svcbentoC { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 38px; }
.rr .svcbentoC .sC { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 24px; display: flex; flex-direction: column; gap: 9px; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; border: 1px solid transparent; }
.rr .svcbentoC .sC:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: rgba(118,184,42,.4); }
.rr .svcbentoC .sC.big { grid-column: span 2; background: linear-gradient(135deg, #76B82A, #5E9421); color: #fff; }
.rr .svcbentoC .sC .ic { width: 46px; height: 46px; border-radius: 13px; background: #EAF6DE; color: var(--green-dark); display: grid; place-items: center; }
.rr .svcbentoC .sC.big .ic { background: rgba(255,255,255,.2); color: #fff; }
.rr .svcbentoC .sC .ic svg { width: 23px; height: 23px; }
.rr .svcbentoC .sC b { font-family: var(--font-display); color: var(--navy); font-size: 17px; }
.rr .svcbentoC .sC.big b { color: #fff; font-size: 20px; }
.rr .svcbentoC .sC p { color: var(--muted); font-size: 14px; flex: 1; }
.rr .svcbentoC .sC.big p { color: rgba(255,255,255,.92); font-size: 15px; }
.rr .svcbentoC .sC .price { font-weight: 700; font-size: 13px; color: var(--green-dark); }
.rr .svcbentoC .sC.big .price { color: #fff; }

/* — dark how-it-works with duotone photo ——————————————— */
.rr .howC { background: linear-gradient(160deg, #0B3C49, #082A34); color: #fff; position: relative; overflow: hidden; }
.rr .howC h2 { color: #fff; }
.rr .howC .lede { color: #bcd8cd; }
.rr .howC .kicker { color: #A6E06B; }
.rr .howgrid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 46px; align-items: center; margin-top: 36px; }
.rr .stepsC { display: grid; gap: 14px; }
.rr .stepC { display: flex; gap: 18px; align-items: flex-start; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 20px 22px; transition: background .16s ease, transform .16s ease; }
.rr .stepC:hover { background: rgba(255,255,255,.07); transform: translateX(4px); }
.rr .stepC .num { font-family: var(--font-display); font-weight: 800; font-size: 22px; color: #0B3C49; background: #A6E06B; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: none; }
.rr .stepC h3 { font-size: 18px; color: #fff; margin-bottom: 5px; font-family: var(--font-display); }
.rr .stepC p { font-size: 14.5px; color: #cfe6dd; }
.rr .howphoto { border-radius: var(--radius-lg); overflow: hidden; height: 430px; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 30px 70px -20px rgba(0,0,0,.6); }
.rr .howphoto .duotone { height: 100%; }

/* — county bento ———————————————————————————————————— */
.rr .ctygrid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 34px; }
.rr .ctyC { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 24px; border-top: 4px solid var(--teal); display: flex; flex-direction: column; transition: transform .16s ease, box-shadow .16s ease; }
.rr .ctyC:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.rr .ctyC.home { border-top-color: var(--green); background: linear-gradient(180deg, #F2FAEA, #fff); }
.rr .ctyC .amt { font-family: var(--font-display); font-size: 27px; font-weight: 800; color: var(--green-dark); line-height: 1; }
.rr .ctyC h3 { color: var(--navy); font-size: 16.5px; margin: 8px 0 7px; font-family: var(--font-display); }
.rr .ctyC p { color: var(--muted); font-size: 13.5px; flex: 1; }
.rr .ctyC .note { margin-top: 13px; font-size: 12px; font-style: italic; color: var(--green-dark); background: #EAF6DE; border-radius: 8px; padding: 7px 11px; display: inline-block; }
.rr .ctyC.home .note { color: var(--teal); background: #E0F0EE; }
.rr .countyC .cta-row { margin-top: 28px; display: flex; gap: 13px; flex-wrap: wrap; align-items: center; }
.rr .countyC .fineprint { margin-top: 16px; font-size: 12.5px; color: #8a9a98; font-style: italic; max-width: 70ch; }

/* — reviews placeholder note (Trustindex renders live) ———————— */
.rr .reviews .stars { color: var(--amber); font-size: 26px; letter-spacing: 3px; }

/* — final CTA over real photo band —————————————————————— */
.rr .final { background: linear-gradient(135deg, rgba(8,42,52,.9), rgba(11,60,73,.82) 45%, rgba(94,148,33,.55)), url('/wp-content/themes/rr-child/assets/photos/IMG_3432.jpg') center/cover; }
.rr .final .ctas .btn svg { width: 18px; height: 18px; }

/* — responsive ————————————————————————————————————— */
@media (max-width: 980px) {
  .rr .heroC { grid-template-columns: 1fr; }
  .rr .heroC .right { min-height: 320px; }
  .rr .heroC .right .scrim { clip-path: none; position: relative; height: 320px; }
  .rr .bentoband .grid { grid-template-columns: 1fr 1fr; }
  .rr .bentoC { grid-template-columns: 1fr; }
  .rr .svcbentoC { grid-template-columns: 1fr 1fr; }
  .rr .svcbentoC .sC.big { grid-column: span 2; }
  .rr .howgrid { grid-template-columns: 1fr; }
  .rr .howphoto { height: 280px; }
  .rr .ctygrid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .rr .bentoband .grid, .rr .svcbentoC { grid-template-columns: 1fr; }
  .rr .svcbentoC .sC.big { grid-column: span 1; }
  .rr .ctygrid { grid-template-columns: 1fr; }
}

/* — inline icon sizing inside buttons / strip (SVG sprite refs) ——— */
.rr .btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; }
.rr .btn svg { width: 18px; height: 18px; flex: none; }
.rr .strip { display: flex; align-items: center; justify-content: center; gap: 9px; }
.rr .strip svg { width: 18px; height: 18px; flex: none; }

/* — reviews fallback (shown until Trustindex plugin is set up) ——— */
.rr .reviews-fallback { max-width: 760px; margin: 30px auto 0; border: 2px dashed rgba(11,60,73,.18); border-radius: var(--radius-lg); padding: 40px 28px; color: var(--muted); background: rgba(255,255,255,.5); text-align: center; }
.rr .reviews-fallback b { display: block; color: var(--navy); font-family: var(--font-display); font-size: 17px; margin-bottom: 6px; }

/* ===================================================================
 * Detail-page template (services/* + resources/*) — Template A:
 * two-column article + sticky rail. Built by bin/import-bundle.php.
 * =================================================================== */
.rr .rr-byline { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; color: var(--muted); font-size: 14px; border-bottom: 1px solid #dbe7e3; padding-bottom: 18px; margin-bottom: 30px; }
.rr .rr-byline .who b { color: var(--navy); font-weight: 700; font-family: var(--font-display); }
.rr .rr-byline .sep { width: 1px; height: 26px; background: #dbe7e3; }
.rr .rr-byline .meta b { color: var(--ink); }
.rr .rr-detail { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 54px; align-items: start; }
.rr .rr-rail { position: sticky; top: 104px; display: flex; flex-direction: column; gap: 18px; }
.rr .rr-rbox { background: var(--white); border: 1px solid #dbe7e3; border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow-sm); }
.rr .rr-rbox.dark { background: linear-gradient(160deg, #0e4a5b, #0b3c49); border: none; color: #dceee6; }
.rr .rr-rbox .rt { font-family: var(--font-display); font-weight: 600; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; color: var(--green-dark); margin-bottom: 12px; }
.rr .rr-rbox.dark .rt { color: #A6E06B; }
.rr .rr-rbox .btn { display: flex; width: 100%; justify-content: center; margin-bottom: 9px; }
.rr .rr-rbox .minihours { font-size: 13px; color: #bcd8cd; margin-top: 6px; }
.rr .rr-rbox .minihours b { color: #fff; }
.rr .rr-railtrust { display: grid; gap: 9px; margin-bottom: 14px; }
.rr .rr-railtrust div { display: flex; gap: 9px; font-size: 13.5px; font-weight: 600; color: #dceee6; align-items: center; }
.rr .rr-railtrust .ck { color: #A6E06B; }
.rr .rr-qprice { margin: 2px 0 14px; color: #dceee6; font-size: 14px; }
.rr .rr-qprice b { font-family: var(--font-display); font-weight: 600; color: #fff; font-size: 26px; margin-right: 6px; }
.rr .rr-keyfacts { display: grid; gap: 0; font-size: 13.5px; }
.rr .rr-keyfacts div { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid #eef4f2; }
.rr .rr-keyfacts div:last-child { border: none; padding-bottom: 0; }
.rr .rr-keyfacts .l { color: var(--muted); font-weight: 600; }
.rr .rr-keyfacts .v { color: var(--navy); font-weight: 700; text-align: right; }
.rr .rr-toc { display: block; font-size: 14.5px; }
.rr .rr-toc a { display: block; padding: 7px 0 7px 14px; border-left: 2px solid #dbe7e3; color: var(--muted); font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.rr .rr-toc a:hover { color: var(--navy); border-color: var(--green); }
.rr .rr-takeaways { background: #f0f7ec; border: 1px solid rgba(118,184,42,.28); border-radius: var(--radius-lg); padding: 22px 26px; margin: 0 0 30px; }
.rr .rr-takeaways .tt { font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 16px; display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.rr .rr-takeaways ul { list-style: none; display: grid; gap: 9px; margin: 0; }
.rr .rr-takeaways li { display: flex; gap: 10px; font-size: 15.5px; color: #2c4248; padding: 0; }
.rr .rr-takeaways li::before { content: none; }
.rr .ck { flex: none; width: 19px; height: 19px; margin-top: 1px; color: var(--green-dark); }
.rr .rr-pq { margin: 28px 0; padding: 6px 0 6px 24px; border-left: 4px solid var(--green); font-family: var(--font-display); font-weight: 500; font-size: 22px; line-height: 1.4; color: var(--navy); }
.rr .rr-sources { margin: 38px 0 0; border-top: 2px solid #dbe7e3; padding-top: 22px; }
.rr .rr-sources .st { font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 18px; display: flex; align-items: center; gap: 9px; margin-bottom: 4px; }
.rr .rr-sources .note { font-size: 13.5px; color: var(--muted); margin-bottom: 16px; }
.rr .rr-sources ol { list-style: none; counter-reset: rsrc; display: grid; gap: 13px; margin: 0; }
.rr .rr-sources li { counter-increment: rsrc; display: flex; gap: 13px; align-items: flex-start; padding: 0; }
.rr .rr-sources li::before { content: counter(rsrc); position: static; flex: none; width: 24px; height: 24px; border-radius: 7px; background: var(--navy); color: #fff; font-size: 13px; font-weight: 700; display: grid; place-items: center; margin-top: 1px; }
.rr .rr-sources b { color: var(--navy); font-size: 15px; }
.rr .rr-sources .dom { display: inline-block; font-size: 11px; font-weight: 700; color: var(--green-dark); background: #eef6e7; border-radius: 5px; padding: 2px 7px; margin-left: 6px; vertical-align: 1px; }
.rr .rr-sources a { display: block; color: var(--teal); font-weight: 600; font-size: 13px; word-break: break-all; }
.rr .rr-badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0; }
.rr .rr-badge { display: inline-flex; align-items: center; gap: 7px; background: var(--white); border: 1px solid #dbe7e3; border-radius: 999px; padding: 8px 15px; font-size: 13.5px; font-weight: 700; color: var(--navy); }
.rr .rr-badge .ck { width: 16px; height: 16px; }
.rr .rr-related { margin-top: 46px; border-top: 2px solid #dbe7e3; padding-top: 28px; }
.rr .rr-related .rt2 { font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 22px; margin-bottom: 18px; }
.rr .rr-relgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 14px; }
.rr .rr-relcard { background: var(--white); border: 1px solid #dbe7e3; border-radius: var(--radius); padding: 18px 20px; border-left: 5px solid var(--green); transition: .15s; }
.rr .rr-relcard:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.rr .rr-relcard .k { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--green-dark); }
.rr .rr-relcard b { display: block; color: var(--navy); font-size: 16px; font-family: var(--font-display); font-weight: 600; margin: 5px 0 4px; }
.rr .rr-relcard span { color: var(--muted); font-size: 13.5px; }
.rr .faq .t { font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: clamp(22px,3vw,28px); margin-bottom: 8px; }
/* Internal links inside FAQ answers (the /faq hub leans on these) — make them obviously clickable. */
.rr .faq p a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.rr .faq p a:hover { color: var(--green-dark); }
/* Constrained reading column for the standalone /faq page. */
.rr .faq-page { max-width: 820px; margin: 0 auto; }
.rr .faq-page .faq-lede { color: var(--muted); font-size: 17px; margin-bottom: 8px; }
@media (max-width: 900px) {
  .rr .rr-detail { grid-template-columns: 1fr; gap: 34px; }
  .rr .rr-rail { position: static; flex-direction: row; flex-wrap: wrap; }
  .rr .rr-rail .rr-rbox { flex: 1; min-width: 250px; }
  .rr .rr-rail .rr-rbox:has(.rr-toc) { display: none; }
}

/* clickable credential-band tile (coverage map → /service-areas/) */
.rr .bentoband a.tile-link { transition: transform .16s ease, box-shadow .16s ease; }
.rr .bentoband a.tile-link:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.rr .bentoband a.tile-link b { color: var(--green-dark); }

/* ── Hero carousel (Direction C right panel) ──────────────────────────
   3 rotating slides (truck photo / coverage map / process photo) with the
   angled slant on a clipped .slides wrapper so the controls aren't cut.
   The map slide embeds [rr_coverage_map]; its dark card panel + legend are
   neutralized here so only the bare map shows on the already-dark slide. */
.rr .heroC .carousel { position: absolute; inset: 0; }
.rr .heroC .slides { position: absolute; inset: 0; overflow: hidden; clip-path: polygon(14% 0,100% 0,100% 100%,0 100%); }
.rr .heroC .slide { position: absolute; inset: 0; opacity: 0; transition: opacity .7s ease; display: flex; align-items: center; justify-content: center; }
.rr .heroC .slide.on { opacity: 1; }
.rr .heroC .slide img { width: 100%; height: 100%; object-fit: cover; }
.rr .heroC .slide .sov { position: absolute; inset: 0; background: linear-gradient(110deg, rgba(11,60,73,.55), rgba(11,60,73,.05) 60%); }
.rr .heroC .slide.map { background: linear-gradient(155deg,#0E5A6E,#0B3C49 60%,#082A34); padding: 24px 28px 46px 17%; text-decoration: none; }
.rr .heroC .slide.map .rr-coverage { margin: 0; width: 100%; }
.rr .heroC .slide.map .cov-mapwrap { background: none; box-shadow: none; padding: 0; max-width: 100%; }
.rr .heroC .slide.map .famap { max-height: 400px; }
.rr .heroC .slide.map .cov-legend { display: none; }
.rr .heroC .cap { position: absolute; left: 4%; bottom: 24px; z-index: 4; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-radius: 16px; box-shadow: var(--shadow-lg); padding: 15px 18px; display: flex; align-items: center; gap: 12px; max-width: 290px; }
.rr .heroC .cap .cdot { width: 11px; height: 11px; border-radius: 50%; background: var(--green); flex: none; box-shadow: 0 0 0 0 rgba(118,184,42,.6); animation: rr-pulse 2.2s infinite; }
.rr .heroC .cap b { display: block; font-family: var(--font-display); color: var(--navy); font-size: 14.5px; }
.rr .heroC .cap span { color: var(--muted); font-size: 12.5px; }
.rr .heroC .dots { position: absolute; right: 20px; bottom: 30px; z-index: 5; display: flex; gap: 8px; }
.rr .heroC .dots button { width: 9px; height: 9px; border-radius: 50%; border: 0; background: rgba(255,255,255,.5); cursor: pointer; padding: 0; transition: .2s; }
.rr .heroC .dots button.on { background: #fff; width: 24px; border-radius: 5px; }
.rr .heroC .arw { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(8,42,52,.55); color: #fff; font-size: 20px; line-height: 1; cursor: pointer; display: grid; place-items: center; backdrop-filter: blur(4px); }
.rr .heroC .arw.prev { left: 16%; }
.rr .heroC .arw.next { right: 14px; }
.rr .heroC .arw:hover { background: rgba(8,42,52,.85); }
@media (max-width: 980px) {
  .rr .heroC .right { min-height: 400px; }
  .rr .heroC .slides { clip-path: none; }
  .rr .heroC .slide.map { padding: 28px 20px 50px; }
  .rr .heroC .arw.prev { left: 14px; }
  .rr .heroC .cap { left: 14px; bottom: 20px; }
}
