
/* RR homepage vertical rhythm v1 — spacing only */
body.home .rr-main>.wp-block-group:not(.rr-trust){padding-block:76px!important}body.home .rr-main>.rr-trust{padding-block:28px!important}body.home .rr-main>.wp-block-group:nth-child(9){padding-block:60px!important}body.home .rr-main>.wp-block-group:nth-child(14){padding-block:76px!important}body.home .rr-main>.wp-block-group:not(.rr-trust)>:first-child{margin-block-start:0!important}body.home .rr-main>.wp-block-group:not(.rr-trust)>:last-child{margin-block-end:0!important}@media(max-width:900px){body.home .rr-main>.wp-block-group:not(.rr-trust){padding-block:60px!important}body.home .rr-main>.rr-trust{padding-block:24px!important}body.home .rr-main>.wp-block-group:nth-child(9){padding-block:48px!important}}@media(max-width:600px){body.home .rr-main>.wp-block-group:not(.rr-trust){padding-block:46px!important}body.home .rr-main>.rr-trust{padding-block:20px!important}body.home .rr-main>.wp-block-group:nth-child(9){padding-block:36px!important}}
/* RR internal section gap correction */
.rr-main>*{margin-block-start:0!important;margin-block-end:0!important}.rr-main>.wp-block-spacer{display:none!important}footer .wp-block-button__link{padding:.58rem .82rem!important;font-size:.58rem!important;line-height:1.2!important;letter-spacing:.07em!important}footer .wp-block-button,footer .wp-block-button.has-custom-width{width:auto!important;max-width:max-content!important}
/* =========================================================
   Ranger Renovations — front-end + editor detail styles.
   Palette, fonts, spacing, buttons come from theme.json.
   This file adds what native blocks can't: eyebrows, card
   treatments, gallery hover-zoom, process/step dividers,
   and the WPForms skin. Keyed off custom block classNames.
   ========================================================= */

:root {
  --rr-espresso: #23180D;
  --rr-espresso-deep: #1A1109;
  --rr-gold: #D79A24;
  --rr-gold-dark: #B87F17;
  --rr-gold-soft: #E8C77E;
  --rr-cream: #FBF2DC;
  --rr-cream-2: #F4E9CF;
  --rr-ink: #2B2116;
  --rr-muted: #6E6152;
  --rr-muted-light: #C9BCA6;
  --rr-line: rgba(35,24,13,.12);
  --rr-line-dark: rgba(255,255,255,.14);
  --rr-serif: 'Lora', Georgia, 'Times New Roman', serif;
  --rr-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }

/* ---------- Eyebrow label ---------- */
.rr-eyebrow {
  font-family: var(--rr-sans) !important;
  font-weight: 700 !important;
  font-size: .72rem !important;
  letter-spacing: .22em !important;
  text-transform: uppercase;
  color: var(--rr-gold-dark) !important;
  margin-bottom: .6rem !important;
}
.rr-on-dark .rr-eyebrow, .has-espresso-background-color .rr-eyebrow,
.has-espresso-deep-background-color .rr-eyebrow { color: var(--rr-gold) !important; }
.rr-lead { color: var(--rr-muted); font-size: clamp(1.05rem,1.4vw,1.2rem); }
.rr-on-dark .rr-lead, .has-espresso-background-color .rr-lead { color: var(--rr-muted-light); }

/* Dark sections: force heading/paragraph legibility */
.has-espresso-background-color :where(h1,h2,h3),
.has-espresso-deep-background-color :where(h1,h2,h3),
.rr-on-dark :where(h1,h2,h3) { color: #fff; }

/* ---------- Buttons: outline variant ---------- */
.rr-btn-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--rr-espresso) !important;
  border: 1.5px solid var(--rr-espresso) !important;
}
.rr-btn-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--rr-espresso) !important;
  color: var(--rr-cream) !important;
}
.rr-on-dark .rr-btn-outline .wp-block-button__link,
.rr-on-dark .wp-block-button.is-style-outline .wp-block-button__link {
  color: #fff !important;
  border-color: rgba(255,255,255,.55) !important;
}
.rr-on-dark .rr-btn-outline .wp-block-button__link:hover,
.rr-on-dark .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: #fff !important;
  color: var(--rr-espresso) !important;
}

/* ---------- Header / nav ---------- */
.rr-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(251,242,220,.94);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--rr-line);
}
.rr-header .wp-block-navigation a { font-size: .82rem; font-weight: 600; letter-spacing: .04em; color: var(--rr-ink); }
.rr-header .wp-block-navigation a:hover { color: var(--rr-espresso); }
.rr-custom-logo .custom-logo, .rr-header .wp-block-site-logo img { height: 54px !important; width: auto; }
.rr-header .rr-logo { margin: 0; }
.rr-header .rr-logo img { height: 56px !important; width: auto !important; display: block; }
.rr-topbar { background: var(--rr-espresso); color: var(--rr-cream); }
.rr-topbar p, .rr-topbar a { font-size: .74rem; letter-spacing: .06em; margin: 0; }
.rr-topbar a { color: var(--rr-gold-soft); font-weight: 700; }
.rr-topbar a:hover { color: #fff; }
.rr-phone { font-weight: 700; color: var(--rr-espresso); font-size: .9rem; }

/* ---------- Hero (Group + Image + CSS overlay; no Cover block) ---------- */
.rr-hero { position: relative; overflow: hidden; min-height: min(88vh, 780px) !important; display: flex; align-items: center; }
.rr-hero > .rr-hero-img { position: absolute !important; inset: 0; margin: 0 !important; z-index: 0; height: 100%; width: 100%; }
.rr-hero .rr-hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rr-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(100deg, rgba(20,12,4,.82) 0%, rgba(20,12,4,.55) 42%, rgba(20,12,4,.18) 100%); }
.rr-hero-wrap { position: relative; z-index: 2; width: 100%; max-width: 1240px; margin-inline: auto; }
.rr-hero-copy { max-width: 640px; }
.rr-hero h1 { color: #fff !important; margin-bottom: 1.2rem; }
.rr-hero .rr-eyebrow { color: var(--rr-gold-soft) !important; }
.rr-hero p { color: rgba(255,255,255,.9); max-width: 52ch; }

/* ---------- Benefit strip ---------- */
.rr-benefit { border-top: 1px solid var(--rr-line-dark); }
.rr-benefit .rr-b-title { font-family: var(--rr-serif); font-size: 1.15rem; color: var(--rr-gold-soft); font-weight: 600; margin: 0; }
.rr-benefit .rr-b-sub { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--rr-muted-light); margin: .2rem 0 0; }
.rr-benefit .wp-block-column { border-left: 1px solid var(--rr-line-dark); padding: 1.4rem 1rem; text-align: center; }
.rr-benefit .wp-block-column:first-child { border-left: 0; }

/* ---------- Trust checks ---------- */
.rr-trust .rr-tick {
  display: inline-grid; place-items: center;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--rr-cream); color: var(--rr-gold-dark);
  font-size: .8rem; font-weight: 800; flex: none;
}
.rr-trust .rr-t-title { font-weight: 700; color: var(--rr-espresso); font-size: .95rem; margin: 0; }
.rr-trust .rr-t-sub { font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--rr-muted); margin: .1rem 0 0; }

/* ---------- Split media rounding ---------- */
.rr-split-media img { border-radius: 3px; width: 100%; height: 100%; object-fit: cover; }

/* Door sample chip (Request a door sample) — small white card, not full-column */
.rr-door-sample {
  max-width: 250px; margin-inline: auto !important;
  background: #fff; border: 1px solid var(--rr-line); border-radius: 3px; padding: 1rem;
}
.rr-door-sample img { width: 100%; height: auto; max-height: 300px; object-fit: contain; display: block; }

/* Interior page banner */
.rr-page-hero { background: var(--rr-cream); border-bottom: 1px solid var(--rr-line); }
.rr-page-hero h1 { color: var(--rr-espresso); }

/* ---------- Door style cards ---------- */
.rr-door-card {
  background: #fff; border: 1px solid var(--rr-line); border-radius: 3px; overflow: hidden;
  transition: transform .35s ease, box-shadow .35s ease;
}
.rr-door-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(35,24,13,.14); }
.rr-door-card .wp-block-image { margin: 0; }
.rr-door-card .wp-block-image img { aspect-ratio: 3/4; object-fit: cover; width: 100%; display: block; background: var(--rr-cream-2); }
.rr-door-name { font-family: var(--rr-serif); font-size: 1.15rem; color: var(--rr-espresso); margin: 0; }
.rr-door-type { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--rr-muted); margin: .2rem 0 0; }
.rr-door-body { padding: 1.05rem 1.15rem 1.25rem; }

/* Chips */
.rr-chips .wp-block-button__link {
  background: #fff !important; color: var(--rr-muted) !important;
  border: 1px solid var(--rr-line) !important; border-radius: 40px !important;
  font-size: .68rem !important; letter-spacing: .12em; font-weight: 700;
  padding: .55rem 1.1rem !important; text-transform: uppercase;
}
.rr-chips .wp-block-button__link:hover { border-color: var(--rr-gold) !important; color: var(--rr-espresso) !important; background:#fff !important; }

/* ---------- Category + gallery cards (Group + Image + CSS overlay) ---------- */
.rr-cat, .rr-gcard { position: relative; overflow: hidden; border-radius: 3px; }
.rr-cat { aspect-ratio: 3 / 3.6; }
.rr-gcard-lg { min-height: 620px; }
.rr-gcard-sm { min-height: 300px; }
.rr-cat > .rr-cat-img, .rr-gcard > .rr-gcard-img {
  position: absolute !important; inset: 0; margin: 0 !important; z-index: 0; height: 100%; width: 100%;
}
.rr-cat .rr-cat-img img, .rr-gcard .rr-gcard-img img {
  width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease;
}
.rr-cat:hover .rr-cat-img img, .rr-gcard:hover .rr-gcard-img img { transform: scale(1.05); }
.rr-cat::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(0deg, rgba(20,12,4,.85) 8%, rgba(20,12,4,.15) 55%, transparent 80%);
}
.rr-gcard::after {
  content: ""; position: absolute; inset: 0; z-index: 1; transition: background .5s ease;
  background: linear-gradient(0deg, rgba(18,11,3,.85) 4%, rgba(18,11,3,.2) 48%, transparent 72%);
}
.rr-gcard:hover::after { background: linear-gradient(0deg, rgba(18,11,3,.9) 6%, rgba(18,11,3,.35) 55%, rgba(0,0,0,.05) 80%); }
.rr-cat-cap, .rr-gcard-cap {
  position: absolute !important; left: 0; right: 0; bottom: 0; z-index: 2;
}
.rr-cat-cap { padding: 1.3rem; }
.rr-gcard-cap { padding: 1.6rem; transition: transform .5s ease; }
.rr-gcard:hover .rr-gcard-cap { transform: translateY(-6px); }
.rr-cat-label { font-family: var(--rr-serif); font-size: 1.3rem; color: #fff; margin: 0; font-weight: 500; }
.rr-cat-sub { font-size: .8rem; color: rgba(255,255,255,.82); margin: .2rem 0 0; }
.rr-gcat { font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--rr-gold-soft); font-weight: 700; margin: 0; }
.rr-gname { font-family: var(--rr-serif); color: #fff; font-size: clamp(1.2rem,1.8vw,1.7rem); margin: .25rem 0 0; }

/* ---------- Numbered feature list ---------- */
.rr-num .rr-n { font-family: var(--rr-serif); font-size: 2.6rem; color: var(--rr-gold); line-height: 1; margin: 0; }
.rr-num .rr-num-item { border-top: 2px solid var(--rr-line); padding-top: 1.4rem; }
.rr-num h3 { font-size: 1.2rem; margin: .7rem 0 .5rem; }
.rr-num p { font-size: .92rem; color: var(--rr-muted); }

/* ---------- Trusted team (dark) ---------- */
.rr-team .wp-block-column { border-left: 1px solid var(--rr-line-dark); padding: 0 1.6rem; }
.rr-team .wp-block-column:first-child { border-left: 0; padding-left: 0; }
.rr-team .rr-n { font-family: var(--rr-serif); color: var(--rr-gold); font-size: 1.4rem; margin: 0; }
.rr-team h3 { color: #fff; font-size: 1.35rem; margin: .5rem 0 .6rem; }
.rr-team p { color: var(--rr-muted-light); font-size: .95rem; }

/* ---------- Process steps (dark) ---------- */
.rr-steps .wp-block-column { border-left: 1px solid var(--rr-line-dark); padding: 0 1.8rem; }
.rr-steps .wp-block-column:first-child { border-left: 0; padding-left: 0; }
.rr-steps .rr-sn { font-family: var(--rr-serif); color: var(--rr-gold); font-size: 1.1rem; letter-spacing: .05em; margin: 0; }
.rr-steps h3 { color: #fff; font-size: 1.4rem; margin: .8rem 0 .7rem; }
.rr-steps p { color: var(--rr-muted-light); font-size: .93rem; }

/* ---------- Consultation CTA + trust item ---------- */
.rr-cta-trust .rr-tc {
  display: inline-grid; place-items: center; flex: none;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--rr-espresso); color: var(--rr-gold); font-size: 1.1rem; font-weight: 800;
}
.rr-cta-trust .rr-tc-title { font-weight: 700; color: var(--rr-espresso); margin: 0; }
.rr-cta-trust .rr-tc-sub { color: var(--rr-muted); font-size: .92rem; margin: .1rem 0 0; }
.rr-form-card {
  background: #fff; border: 1px solid var(--rr-line); border-radius: 6px;
  padding: clamp(1.4rem, 3vw, 2.4rem);
  box-shadow: 0 24px 60px -30px rgba(35,24,13,.35);
}

/* ---------- WPForms skin (no default blue) ---------- */
.rr-form-card .wpforms-form { font-family: var(--rr-sans); }
.rr-form-card .wpforms-field { padding: 0 0 1.05rem; }
.rr-form-card .wpforms-field-label,
.rr-form-card .wpforms-field-label-inline {
  font-size: .68rem !important; font-weight: 700 !important; letter-spacing: .12em;
  text-transform: uppercase; color: var(--rr-espresso) !important; margin-bottom: .5rem !important;
}
.rr-form-card .wpforms-field-description { font-size: .78rem; color: var(--rr-muted); }
.rr-form-card input[type=text],
.rr-form-card input[type=email],
.rr-form-card input[type=tel],
.rr-form-card select,
.rr-form-card textarea {
  width: 100% !important; font-family: var(--rr-sans); font-size: .98rem !important; color: var(--rr-ink) !important;
  background: var(--rr-cream) !important; border: 1px solid var(--rr-line) !important;
  border-radius: 3px !important; padding: .85rem .95rem !important; box-shadow: none !important;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.rr-form-card input[type=text],
.rr-form-card input[type=email],
.rr-form-card input[type=tel],
.rr-form-card select { height: 50px !important; }
.rr-form-card textarea { min-height: 120px !important; resize: vertical; }
.rr-form-card input:focus,
.rr-form-card select:focus,
.rr-form-card textarea:focus {
  outline: none !important; border-color: var(--rr-gold) !important; background: #fff !important;
  box-shadow: 0 0 0 3px rgba(215,154,36,.22) !important;
}
/* two-column name row */
.rr-form-card .wpforms-field-row .wpforms-field-row-block { padding-right: .55rem; }
.rr-form-card .wpforms-field-row .wpforms-field-row-block:last-child { padding-right: 0; padding-left: .55rem; }
/* submit button */
.rr-form-card .wpforms-submit-container { text-align: stretch; }
.rr-form-card button[type=submit],
.rr-form-card .wpforms-submit {
  width: 100% !important; display: block !important;
  background: var(--rr-gold) !important; color: var(--rr-espresso) !important;
  font-family: var(--rr-sans) !important; font-weight: 800 !important; font-size: .78rem !important;
  letter-spacing: .13em !important; text-transform: uppercase !important;
  border: 0 !important; border-radius: 2px !important; padding: 1.15rem 2rem !important;
  cursor: pointer; transition: background .3s, color .3s, transform .3s;
}
.rr-form-card button[type=submit]:hover,
.rr-form-card .wpforms-submit:hover { background: var(--rr-gold-dark) !important; color: #fff !important; transform: translateY(-2px); }
/* placeholder shown before WPForms/form exists */
.rr-form-fallback { color: var(--rr-muted); font-size: .9rem; text-align: center; padding: 1.5rem; border: 1px dashed var(--rr-line); border-radius: 4px; }

/* ---------- Footer ---------- */
.rr-footer { background: var(--rr-espresso-deep); color: var(--rr-muted-light); }
.rr-footer .rr-fword { font-family: var(--rr-serif); font-size: 1.6rem; color: #fff; margin: 0; }
.rr-footer .rr-fmark { font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: var(--rr-gold); margin: .3rem 0 0; }
.rr-footer p { font-size: .95rem; color: var(--rr-muted-light); }
.rr-footer h4 { font-family: var(--rr-sans); color: #fff; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 1rem; }
.rr-footer a { color: var(--rr-muted-light); font-size: .95rem; }
.rr-footer a:hover { color: var(--rr-gold-soft); }
.rr-footer .wp-block-navigation { flex-direction: column; gap: .3rem; }
.rr-footer-bottom { border-top: 1px solid var(--rr-line-dark); }
.rr-footer-bottom p { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--rr-muted-light); margin: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 781px) {
  .rr-benefit .wp-block-column,
  .rr-team .wp-block-column,
  .rr-steps .wp-block-column { border-left: 0; padding-left: 0; padding-right: 0; }
  .rr-hero { min-height: 74vh !important; }
  .rr-topbar .rr-topbar-left { display: none; }
}
@media (max-width: 600px) {
  .rr-hero h1 { font-size: clamp(2.2rem, 9vw, 2.8rem) !important; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .rr-cat .rr-cat-img img,
  .rr-gcard .rr-gcard-img img,
  .rr-gcard-cap,
  .rr-door-card { transition: none !important; }
  .rr-cat:hover .rr-cat-img img,
  .rr-gcard:hover .rr-gcard-img img { transform: none !important; }
  .rr-gcard:hover .rr-gcard-cap { transform: none !important; }
}


/* Responsive refinements — compact header, forms and footer CTAs */
.rr-header .wp-block-button__link {
  padding: .78rem 1.35rem;
  font-size: .68rem;
  line-height: 1.25;
  white-space: nowrap;
}
.wpforms-submit-container .wpforms-submit,
button.wpforms-submit {
  min-height: 48px;
  padding: .82rem 1.25rem !important;
  font-size: .72rem !important;
  line-height: 1.3 !important;
}

@media (max-width: 781px) {
  .rr-topbar-left { display: none; }
  .rr-topbar { padding-top: .45rem !important; padding-bottom: .45rem !important; }
  .rr-topbar > .wp-block-group {
    justify-content: center !important;
    gap: .65rem !important;
    font-size: .72rem;
    white-space: nowrap;
  }
  .rr-header { padding-top: .65rem !important; padding-bottom: .65rem !important; }
  .rr-header > .wp-block-group {
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    gap: .7rem !important;
    align-items: center;
  }
  .rr-logo img { width: 68px !important; height: auto !important; }
  .rr-phone { display: none; }
  .rr-header .wp-block-buttons { margin-left: auto; }
  .rr-header .wp-block-button { width: auto !important; }
  .rr-header .wp-block-button__link {
    width: auto !important;
    padding: .68rem .82rem !important;
    font-size: .58rem !important;
    letter-spacing: .08em !important;
    line-height: 1.2 !important;
    white-space: normal;
    max-width: 132px;
  }
  .rr-nav { justify-self: end; }
  .wpforms-submit-container .wpforms-submit,
  button.wpforms-submit {
    width: 100% !important;
    min-height: 46px;
    padding: .72rem .8rem !important;
    font-size: .66rem !important;
    letter-spacing: .08em !important;
    line-height: 1.25 !important;
    white-space: normal !important;
  }
  footer .wp-block-columns {
    gap: 1.75rem !important;
  }
  footer .wp-block-column {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  footer .wp-block-button__link {
    width: auto !important;
    max-width: 100%;
    padding: .82rem 1.15rem !important;
    font-size: .66rem !important;
    line-height: 1.35 !important;
  }
  footer .wp-block-buttons {
    justify-content: flex-start !important;
  }
  footer .wp-block-row {
    gap: 1rem !important;
  }
}


/* Exact mobile WPForms submit sizing */
@media (max-width: 781px) {
  div.wpforms-container-full .wpforms-form button[type=submit].wpforms-submit,
  .wpforms-container .wpforms-form button.wpforms-submit,
  #wpforms-submit-101 {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    letter-spacing: .06em !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
  }
}

/* RR section-boundary and footer CTA refinement */
.wp-site-blocks>*{margin-block-start:0!important;margin-block-end:0!important}footer .wp-block-button,footer .wp-block-button.has-custom-width{width:auto!important}footer .wp-block-buttons{justify-content:flex-start!important}footer .wp-block-button__link{width:auto!important;min-width:0!important;padding:.72rem 1.05rem!important;font-size:.64rem!important;line-height:1.3!important;letter-spacing:.08em!important;white-space:nowrap!important}@media(max-width:781px){footer .wp-block-button__link{padding:.68rem 1rem!important;font-size:.64rem!important}}
