/* ================================================================
   Riverside Plumbing — bespoke theme
   Pixel rebuild of the live Ghost (Source) site.
   Accent green #8dc63f · black hero · system sans.
   All structural classes prefixed `rv-`.
   ================================================================ */

:root {
  /* Override framework fallback palette so any framework section uses our colors */
  --color-primary: #8dc63f;
  --color-accent: #8dc63f;
  --color-secondary: #1a1a1a;
  --color-dark: #1a1a1a;
  --color-dark-grey: #15171a;

  /* Theme tokens */
  --rv-green: #8dc63f;
  --rv-green-dark: #74ab2f;
  --rv-ink: #15171a;
  --rv-body: #3a3a3a;
  --rv-line: #e6e6e6;
  --rv-black: #000000;
  --rv-maxw: 1200px;
  --rv-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

/* ---- base ---- */
.rv-body { margin: 0; font-family: var(--rv-font); color: var(--rv-body); background: #fff; line-height: 1.6; }
.rv-body h1, .rv-body h2, .rv-body h3, .rv-body h4, .rv-body h5 { font-family: var(--rv-font); color: var(--rv-ink); line-height: 1.15; margin: 0 0 .5em; }
.rv-container { max-width: var(--rv-maxw); margin: 0 auto; padding: 0 24px; }
.rv-body a { color: var(--rv-green-dark); }
.skip-to-content { position: absolute; left: -9999px; top: 0; background: var(--rv-green); color: #fff; padding: 10px 16px; z-index: 2000; }
.skip-to-content:focus { left: 8px; top: 8px; }

/* ---- buttons (match Ghost kg-btn-accent / header-card-button) ---- */
.rv-btn { display: inline-block; background: var(--rv-green); color: #fff !important; font-weight: 600;
  padding: 14px 28px; border-radius: 4px; text-decoration: none; transition: background .18s ease, transform .18s ease;
  letter-spacing: .01em; border: 0; cursor: pointer; line-height: 1.2; }
.rv-btn:hover { background: var(--rv-green-dark); transform: translateY(-1px); }
.rv-btn-lg { padding: 16px 34px; font-size: 1.05rem; }

/* ================= HEADER (gh-head rebuild) ================= */
.rv-header { background: #fff; border-bottom: 1px solid var(--rv-line); position: sticky; top: 0; z-index: 1000; }
.rv-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 84px; }
.rv-logo { display: flex; align-items: center; flex: 0 0 auto; }
.rv-logo img { height: 56px; width: auto; display: block; }
.rv-nav { flex: 1 1 auto; }
.rv-nav-list { display: flex; gap: 28px; list-style: none; margin: 0; padding: 0; justify-content: center; }
.rv-nav-link { color: var(--rv-ink); text-decoration: none; font-weight: 600; font-size: .98rem; padding: 6px 0; position: relative; }
.rv-nav-link:hover, .rv-nav-item.is-current .rv-nav-link { color: var(--rv-green-dark); }
.rv-nav-link::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px; background: var(--rv-green); transition: width .2s ease; }
.rv-nav-link:hover::after, .rv-nav-item.is-current .rv-nav-link::after { width: 100%; }
.rv-header-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; }
.rv-header-phone { display: inline-flex; align-items: center; gap: 8px; color: var(--rv-ink); font-weight: 700; text-decoration: none; font-size: 1rem; }
.rv-header-phone svg { color: var(--rv-green); }
.rv-burger { display: none; background: none; border: 0; cursor: pointer; padding: 8px; color: var(--rv-ink); }

/* ================= HERO (kg-header-card rebuild) ================= */
.rv-hero { position: relative; background: var(--rv-black); color: #fff; overflow: hidden; }
.rv-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .55; }
.rv-hero-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.65)); }
.rv-hero-inner { position: relative; z-index: 2; text-align: center; padding: min(6vmax, 260px) 24px; }
.rv-hero-title { color: #fff; font-size: clamp(2.4rem, 6vw, 4.5rem); font-weight: 800; margin: 0 0 .25em; letter-spacing: -.01em; }
.rv-hero-sub { color: #fff; font-size: clamp(1.1rem, 2.2vw, 1.6rem); margin: 0 0 1.6em; opacity: .95; }
.rv-hero .rv-btn { font-size: 1.05rem; padding: 15px 32px; }

/* ================= BODY CONTENT (Ghost koenig rebuild) ================= */
.rv-content { padding: 56px 0; }
.rv-content .rv-container { max-width: 980px; }
.rv-content p { font-size: 1.12rem; margin: 0 0 1.1em; }
.rv-content hr { border: 0; border-top: 1px solid var(--rv-line); margin: 40px 0; }
.rv-content h5 { font-size: 1.15rem; text-transform: none; }
.rv-center { text-align: center; }
.rv-hours { margin: 8px 0 0; }

/* CTA button row */
.rv-button-container { display: flex; justify-content: center; align-items: center; gap: 16px; flex-wrap: wrap; margin: 8px 0 4px; }

/* service / brand icon grid (Ghost image-grid rebuild) */
.rv-image-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; list-style: none; padding: 0; margin: 8px 0 0; }
.rv-image-grid a, .rv-image-grid span { display: block; }
.rv-image-grid img { max-width: 150px; height: auto; display: block; }
@media (max-width: 1365px) { .rv-image-grid { justify-content: center; } .rv-image-grid img { max-width: 30vw; } }

/* ================= FOOTER (gh-foot rebuild) ================= */
.rv-footer { background: var(--rv-ink); color: #cdd2d6; padding: 48px 0 28px; margin-top: 0; }
.rv-footer-grid { display: flex; flex-wrap: wrap; gap: 32px; justify-content: space-between; align-items: flex-start; }
.rv-footer-brand img { height: 50px; width: auto; background: #fff; padding: 8px 12px; border-radius: 6px; }
.rv-footer h4 { color: #fff; font-size: 1rem; margin: 0 0 12px; letter-spacing: .04em; text-transform: uppercase; }
.rv-footer a { color: #cdd2d6; text-decoration: none; }
.rv-footer a:hover { color: var(--rv-green); }
.rv-footer-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rv-footer-contact { display: grid; gap: 8px; }
.rv-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 32px; padding-top: 18px; font-size: .85rem; color: #9aa1a6; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }

/* ================= MOBILE DRAWER ================= */
.rv-drawer-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); opacity: 0; visibility: hidden; transition: opacity .25s ease; z-index: 1500; }
.rv-drawer-backdrop.is-open { opacity: 1; visibility: visible; }
.rv-drawer { position: fixed; top: 0; right: 0; height: 100%; width: min(320px, 85vw); background: #fff; z-index: 1600;
  transform: translateX(100%); transition: transform .28s ease; display: flex; flex-direction: column; box-shadow: -8px 0 30px rgba(0,0,0,.18); }
.rv-drawer.is-open { transform: translateX(0); }
.rv-drawer-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--rv-line); }
.rv-drawer-header img { height: 40px; }
.rv-drawer-close { background: none; border: 0; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--rv-ink); }
.rv-drawer-nav { list-style: none; margin: 0; padding: 12px 0; flex: 1; overflow-y: auto; }
.rv-drawer-nav li a { display: block; padding: 14px 22px; color: var(--rv-ink); text-decoration: none; font-weight: 600; border-bottom: 1px solid #f1f1f1; }
.rv-drawer-nav li a:hover { background: #f7faf0; color: var(--rv-green-dark); }
.rv-drawer-footer { padding: 18px 20px; border-top: 1px solid var(--rv-line); }
.rv-drawer-footer .rv-btn { display: block; text-align: center; }

/* ================= RESPONSIVE ================= */
@media (max-width: 980px) {
  .rv-nav, .rv-header-actions { display: none; }
  .rv-burger { display: inline-flex; }
  .rv-logo img { height: 46px; }
  .rv-header-inner { min-height: 68px; }
}

/* ================= INNER PAGES (Pages Mendol show.blade) ================= */
.inner-page-wrapper { background: #fff; }

/* Branded page-title banner (no featured image) */
.inner-hero { position: relative; background: var(--rv-black); overflow: hidden; }
.inner-hero-banner { position: absolute; inset: 0; background: var(--rv-ink); }
.inner-hero-overlay { position: relative; z-index: 2; min-height: 220px; display: flex; align-items: center; justify-content: center;
  text-align: center; padding: 48px 24px; background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.72)); }
.inner-hero-overlay h1 { color: #fff; font-size: clamp(2rem, 5vw, 3.25rem); font-weight: 800; margin: 0; letter-spacing: -.01em; }
.inner-hero-overlay h1::after { content: ""; display: block; width: 72px; height: 4px; background: var(--rv-green); border-radius: 2px; margin: 16px auto 0; }

/* Content column */
.inner-content { max-width: 980px; margin: 0 auto; padding: 56px 24px; }
.inner-content .page-content { font-size: 1.08rem; line-height: 1.7; color: var(--rv-body); }
.inner-content .page-content h2 { color: var(--rv-ink); font-size: 1.7rem; }
.inner-content .page-content h3 { color: var(--rv-green-dark); font-size: 1.3rem; }
.inner-content .page-content h5 { color: var(--rv-ink); }
.inner-content .page-content hr { border: 0; border-top: 1px solid var(--rv-line); margin: 36px 0; }

/* Koenig button cards inside imported content -> brand green buttons */
.page-content .kg-button-card { text-align: center; margin: 28px 0; }
.page-content .kg-button-card.kg-align-center { display: flex; justify-content: center; }
.page-content a.kg-btn,
.page-content .kg-btn {
  display: inline-block; background: var(--rv-green); color: #fff !important; font-weight: 600;
  padding: 14px 30px; border-radius: 4px; text-decoration: none; line-height: 1.2; transition: background .18s ease, transform .18s ease;
}
.page-content a.kg-btn:hover, .page-content .kg-btn:hover { background: var(--rv-green-dark); transform: translateY(-1px); }
.page-content a.kg-btn-accent { background: var(--rv-green); }

/* Centered helper used by imported content */
.page-content .kg-align-center { text-align: center; }