/* ==========================================================================
   Concrete CMS integration layer for the RnR template.
   css/style.css stays identical to the approved static template;
   everything CMS-specific lives here.
   ========================================================================== */

/* With Atomik's features on, Concrete wraps Content blocks in .ccm-block-content.
   Where the RnR layout positions the text's own elements (grid / last-child
   spacing), let that wrapper pass its children straight through. */
.rnr-coverage-body > .ccm-block-content,
.rnr-section-head > .ccm-block-content,
.rnr-hero-text > .ccm-block-content { display: contents; }

/* Keep the sticky header below the editing toolbar when logged in */
html.ccm-toolbar-visible .rnr-header { top: 48px; }

/* Icons that sit in front of editable text. The rich text editor removes empty
   <i> icon tags, so these come from CSS instead (Font Awesome 5 glyphs). */
.rnr-topbar-left p { display: inline-block; margin: 0; }
.rnr-topbar-left p + p { margin-left: 1.5rem; }
.rnr-topbar-left p::before {
  content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900;
  color: var(--rnr-blue-light); margin-right: .4rem; font-size: .8em;
}
.rnr-topbar-item i { color: var(--rnr-blue-light); margin-right: .35rem; }
.rnr-topbar-item + .rnr-topbar-item { margin-left: 1.5rem; }

.rnr-hero-checks li::before {
  content: "\f058"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: var(--rnr-yellow);
}

/* Highlighted words in headings (editor style "Highlight (light teal)") */
.rnr-highlight { color: var(--rnr-blue-light); }
.rnr-section:not(.rnr-section--navy) .rnr-highlight { color: var(--rnr-blue); }

/* ---------- Hero ---------- */
.rnr-hero-text > p:last-child, .rnr-hero-text ul:last-child { margin-bottom: 0; }
.rnr-hero-text .rnr-lead, .rnr-hero-text p.rnr-hero-text { color: rgba(255,255,255,.85); font-size: 1.2rem; max-width: 560px; }
.rnr-hero-buttons { display: flex; flex-wrap: wrap; gap: 1rem; }
.rnr-hero .btn { padding: .95rem 1.8rem; font-size: 1.1rem; }
.rnr-hero-checks { padding-left: 0; }

/* ---------- Quote forms (Express Form block) ---------- */
.ccm-block-express-form .form-group, .ccm-block-express-form .mb-3 { margin-bottom: .9rem !important; }
.ccm-block-express-form .form-label, .ccm-block-express-form .control-label { font-weight: 600; font-size: .9rem; color: var(--rnr-navy); margin-bottom: .3rem; }
.ccm-block-express-form .text-muted { font-size: .8rem; }
.ccm-block-express-form .form-control, .ccm-block-express-form .form-select {
  border-radius: 10px; padding: .7rem .9rem; border-color: var(--rnr-line);
}
.ccm-block-express-form .form-control:focus, .ccm-block-express-form .form-select:focus {
  border-color: var(--rnr-blue); box-shadow: 0 0 0 .2rem rgba(11,115,146,.15);
}
.ccm-block-express-form .form-actions { margin-top: 1rem; }
.ccm-block-express-form .btn-primary, .ccm-block-express-form button[type=submit] {
  background: var(--rnr-blue); border: 2px solid var(--rnr-blue); color: #fff; border-radius: 999px;
  font-weight: 600; padding: .8rem 1.6rem;
}
.ccm-block-express-form .btn-primary:hover, .ccm-block-express-form button[type=submit]:hover {
  background: var(--rnr-navy); border-color: var(--rnr-navy);
}
.rnr-quote-card .ccm-block-express-form .btn-primary { width: 100%; }
.rnr-quote-card h3 { font-size: 1.9rem; text-transform: uppercase; margin-bottom: .25rem; }
.captcha img { border-radius: 6px; margin-bottom: .5rem; }

/* Compact Quick Quote card (js/main.js adds .rnr-compact): labels become
   placeholders and the captcha sits on one line, matching the template */
.rnr-compact .form-label, .rnr-compact .text-muted.small {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.rnr-compact .mb-3, .rnr-compact .form-group { margin-bottom: 1rem !important; }
.rnr-compact .captcha { display: flex; align-items: center; gap: .75rem; }
.rnr-compact .captcha > div:last-child { flex: 1; }
.rnr-compact .captcha br { display: none; }
.rnr-compact .captcha img { display: block; height: 46px; width: auto; margin: 0; cursor: pointer; }
.rnr-compact .form-actions { margin-top: 0; }

/* ---------- Section heads written in the editor ---------- */
.rnr-section-head > p:last-child { margin-bottom: 0; }
.rnr-section-head .rnr-lead { margin-left: auto; margin-right: auto; }
.rnr-section-head.text-center .rnr-eyebrow { justify-content: center; }
p.rnr-eyebrow { display: flex; }
.text-center p.rnr-eyebrow, .rnr-cta p.rnr-eyebrow { justify-content: center; }

/* ---------- Photos (Image block, "RnR Rounded photo" template) ---------- */
.rnr-photo { display: block; width: 100%; border-radius: var(--rnr-radius); box-shadow: var(--rnr-shadow); object-fit: cover; }
.rnr-about-img .rnr-photo { aspect-ratio: 4 / 5; }
.rnr-about-pair .rnr-photo { aspect-ratio: 3 / 4; }
@media (min-width: 576px) {
  .rnr-about-pair > div:nth-child(2) { padding-top: 3rem; }
}

/* ---------- Highlights / values (Feature block, "RnR Icon box") ---------- */
.rnr-usp p { margin: 0; color: var(--rnr-muted); font-size: .95rem; }
.rnr-values .rnr-usp { flex-direction: column; }

/* ---------- Process steps (Feature block, "RnR Step"): automatic numbering ---------- */
.rnr-steps { counter-reset: rnr-step; }
.rnr-step-num::before { counter-increment: rnr-step; content: counter(rnr-step); }
.rnr-step p { margin-bottom: 0; }

/* ---------- Stats ---------- */
.rnr-stat strong { font-size: 3rem; }

/* ---------- Coverage band: heading + text on the left, button on the right ---------- */
.rnr-coverage .col > p:last-child { margin-bottom: 0; }
@media (min-width: 992px) {
  .rnr-coverage-body { display: grid; grid-template-columns: 1fr auto; column-gap: 2rem; align-items: center; }
  .rnr-coverage-body :is(h2, p):not(.rnr-coverage-action) { grid-column: 1; }
  .rnr-coverage-body .rnr-coverage-action { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
}

/* ---------- Call-to-action band ---------- */
.rnr-cta-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }
.rnr-cta h2 + p { margin-bottom: 2rem; }

/* ---------- Banners ---------- */
.rnr-banner-text { color: rgba(255,255,255,.8); margin-top: .5rem; }

/* ---------- Services ---------- */
.rnr-svc-row a img { transition: transform .3s ease; }
.rnr-svc-row a:hover img { transform: scale(1.02); }
.btn-outline-secondary.rounded-pill { padding: .8rem 1.6rem; }

/* ---------- Contact ---------- */
.rnr-contact-card--navy { background: var(--rnr-navy); }
.rnr-contact-card--navy p { color: rgba(255,255,255,.8); }
.rnr-contact-card h2 { font-size: 2rem; text-transform: uppercase; margin-bottom: .25rem; }

/* ---------- Testimonials with a photo ---------- */
.rnr-review-avatar--img { overflow: hidden; background: none; }
.rnr-review-avatar--img img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Footer ---------- */
/* .rnr-footer a would otherwise turn the yellow button's text pale */
.rnr-footer a.btn-rnr, .rnr-footer a.btn-rnr:hover { color: var(--rnr-navy); }

/* ---------- Footer: Social Links block ---------- */
.rnr-footer .ccm-block-social-links ul { list-style: none; padding: 0; margin: 1.25rem 0 0; display: flex; gap: .5rem; }
.rnr-footer .ccm-block-social-links li { margin: 0; }
.rnr-footer .ccm-block-social-links a {
  width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(255,255,255,.08); color: #fff;
}
.rnr-footer .ccm-block-social-links a:hover { background: var(--rnr-blue); color: #fff; }

/* ---------- Plain content pages (privacy policy etc.) ---------- */
.rnr-prose { max-width: 900px; }
.rnr-prose h2 { font-size: 2rem; margin-top: 2rem; }
.rnr-prose h3 { margin-top: 1.5rem; }

/* ---------- Standard pages (Atomik-style free areas) ---------- */
.rnr-page-main { padding: 5rem 0 4rem; }
.rnr-page-main > .container > *:last-child { margin-bottom: 0; }

/* ---------- Header search ---------- */
.rnr-header .rnr-search-link::after { display: none; }
.rnr-header .rnr-search-link { font-size: 1rem; }

/* ---------- Blog cards (Page List, "RnR Blog Grid") ---------- */
.rnr-blog-card { color: inherit; }
.rnr-blog-card .rnr-service-body { padding-top: 1.4rem; }
.rnr-blog-topic {
  position: absolute; left: 1rem; top: 1rem; background: var(--rnr-navy); color: #fff;
  font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
  padding: .3rem .7rem; border-radius: 999px;
}
.rnr-blog-date { display: block; color: var(--rnr-blue); font-weight: 600; font-size: .85rem; margin-bottom: .4rem; }
@media (min-width: 992px) {
  .rnr-latest .rnr-blog-cell { width: 33.333%; }
}
.rnr-pagination { margin-top: 2.5rem; }
.rnr-pagination .pagination { justify-content: center; gap: .35rem; }
.rnr-pagination .page-link { border-radius: 999px !important; border-color: var(--rnr-line); color: var(--rnr-navy); min-width: 42px; text-align: center; }
.rnr-pagination .active > .page-link, .rnr-pagination .page-link.active { background: var(--rnr-blue); border-color: var(--rnr-blue); color: #fff; }

/* ---------- Single post ---------- */
.rnr-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-bottom: 1.5rem; color: var(--rnr-muted); font-weight: 500; }
.rnr-post-meta i { color: var(--rnr-blue); margin-right: .4rem; }
.rnr-tag {
  background: var(--rnr-mist); border: 1px solid var(--rnr-line); color: var(--rnr-navy);
  border-radius: 999px; padding: .25rem .8rem; font-size: .85rem;
}
.rnr-tag:hover { background: var(--rnr-blue); border-color: var(--rnr-blue); color: #fff; }
.rnr-post-photo { aspect-ratio: 16 / 9; margin-bottom: 2rem; }
.rnr-post-body { font-size: 1.05rem; }
.rnr-post-body h2 { font-size: 2rem; margin: 2rem 0 .8rem; }
.rnr-post-body .rnr-lead { font-size: 1.2rem; max-width: none; }
.rnr-share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--rnr-line); }
.rnr-share strong { font-family: var(--rnr-font-head); text-transform: uppercase; letter-spacing: 1px; color: var(--rnr-navy); margin-right: .5rem; }
.rnr-share a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--rnr-mist); color: var(--rnr-navy); }
.rnr-share a:hover { background: var(--rnr-blue); color: #fff; }
.rnr-post-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; }
.rnr-post-nav a { flex: 1 1 0; max-width: 48%; background: #fff; border: 1px solid var(--rnr-line); border-radius: var(--rnr-radius); padding: 1rem 1.25rem; color: var(--rnr-navy); font-weight: 600; }
.rnr-post-nav a span { display: block; font-size: .8rem; text-transform: uppercase; letter-spacing: 1px; color: var(--rnr-blue); margin-bottom: .25rem; }
.rnr-post-nav-next { text-align: right; }
.rnr-post-nav a:hover { border-color: var(--rnr-blue); box-shadow: var(--rnr-shadow); }

/* ---------- Blog sidebar (Search, Topic List, Archive, quote box) ---------- */
.rnr-sidebar > * + * { margin-top: 2rem; }
.rnr-sidebar h4, .rnr-sidebar .ccm-block-topic-list-header h4, .rnr-sidebar .ccm-block-date-navigation h4 {
  font-size: 1.35rem; text-transform: uppercase; margin-bottom: 1rem; padding-bottom: .6rem; border-bottom: 3px solid var(--rnr-yellow); display: inline-block;
}
.rnr-sidebar ul { list-style: none; padding: 0; margin: 0; }
.rnr-sidebar ul li a { display: block; padding: .45rem 0; color: var(--rnr-ink); border-bottom: 1px solid var(--rnr-line); }
.rnr-sidebar ul li a:hover, .rnr-sidebar .ccm-block-topic-list-topic-selected { color: var(--rnr-blue); }
.rnr-sidebar .ccm-search-block-form { display: flex; gap: .5rem; flex-wrap: wrap; }
.rnr-sidebar .ccm-search-block-form h3 { width: 100%; font-size: 1.35rem; text-transform: uppercase; }
.rnr-sidebar .ccm-search-block-text, .rnr-page-main .ccm-search-block-text {
  flex: 1; border: 1px solid var(--rnr-line); border-radius: 999px; padding: .6rem 1rem; min-width: 0;
}
.rnr-sidebar .ccm-search-block-submit, .rnr-page-main .ccm-search-block-submit {
  background: var(--rnr-blue); color: #fff; border: 0; border-radius: 999px; padding: .6rem 1.2rem; font-weight: 600;
}
.rnr-sidebar-cta { background: var(--rnr-navy); color: rgba(255,255,255,.8); border-radius: var(--rnr-radius); padding: 1.75rem; }
.rnr-sidebar-cta h4 { color: #fff; border-bottom-color: var(--rnr-yellow); }
.rnr-sidebar-cta .btn-rnr { color: var(--rnr-navy); }
.rnr-sidebar-cta p:last-child { margin-bottom: 0; }

/* ---------- Search results page ---------- */
.rnr-page-main .ccm-search-block-form { display: flex; gap: .5rem; max-width: 640px; margin-bottom: 2rem; }
.rnr-page-main .ccm-search-result { padding: 1.25rem 0; border-bottom: 1px solid var(--rnr-line); }
.rnr-page-main .ccm-search-result h3 { font-size: 1.5rem; margin-bottom: .3rem; }

/* ---------- Edit mode ----------
   Concrete wraps each block and adds drop zones, so multi-column areas stack
   their blocks full width while editing, and the floating call button hides. */
.ccm-edit-mode .rnr-row > .ccm-area { flex: 0 0 100%; max-width: 100%; }
.ccm-edit-mode .rnr-row [class*="col-"] { width: 100%; }
.ccm-edit-mode .rnr-step::after { display: none; }
.ccm-edit-mode .rnr-float-call { display: none; }
.ccm-edit-mode .rnr-usps { margin-top: 0; padding-top: 2rem; }
.ccm-edit-mode .rnr-about-badge { position: static; display: inline-block; margin-top: 1rem; }