/* Repair Home Connect — main stylesheet */
@font-face { font-family: "Space Grotesk"; font-weight: 500; font-display: swap; src: url("../fonts/space-grotesk-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 700; font-display: swap; src: url("../fonts/space-grotesk-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-weight: 400; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-weight: 500; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-weight: 600; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-weight: 700; font-display: swap; src: url("../fonts/plus-jakarta-sans-latin-700-normal.woff2") format("woff2"); }

:root {
  --rhc-navy: #0e2338;
  --rhc-navy-2: #1b3a5c;
  --rhc-navy-3: #2c5582;
  --rhc-coral: #f2542d;
  --rhc-coral-dark: #d63f1a;
  --rhc-coral-soft: #ffe3d9;
  --rhc-yellow: #ffc94a;
  --rhc-paper: #f6f8fb;
  --rhc-mist: #e8eff6;
  --rhc-line: #d5dde6;
  --rhc-ink: #13202e;
  --rhc-muted: #5a6b7d;
  --rhc-cut: 22px;
  --rhc-shadow: 0 24px 48px -24px rgba(14, 35, 56, .38);
}

html { scroll-behavior: smooth; }
body {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--rhc-ink);
  background: var(--rhc-paper);
  overflow-x: hidden;
  padding-top: 76px;
}
h1, h2, h3, h4, h5, .font-display {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--rhc-navy);
}
a { color: var(--rhc-coral-dark); }
a:hover { color: var(--rhc-navy); }
::selection { background: var(--rhc-coral); color: #fff; }
.text-muted-rhc { color: var(--rhc-muted); }
img { max-width: 100%; height: auto; }

/* ---------- Buttons ---------- */
.btn-rhc, .btn-rhc-outline, .btn-rhc-light {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 700;
  border-radius: 0;
  padding: .8rem 1.5rem;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  transition: background .2s, color .2s, transform .2s;
}
.btn-rhc { background: var(--rhc-coral); color: #fff; border: 0; }
.btn-rhc:hover, .btn-rhc:focus-visible { background: var(--rhc-navy); color: #fff; transform: translateY(-2px); }
.btn-rhc-outline { background: transparent; color: var(--rhc-navy); box-shadow: inset 0 0 0 2px var(--rhc-navy); }
.btn-rhc-outline:hover { background: var(--rhc-navy); color: #fff; }
.btn-rhc-light { background: #fff; color: var(--rhc-navy); border: 0; }
.btn-rhc-light:hover { background: var(--rhc-yellow); color: var(--rhc-navy); }

/* ---------- Navbar ---------- */
.rhc-nav {
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--rhc-line);
  min-height: 76px;
  transition: box-shadow .25s;
}
.rhc-nav.scrolled { box-shadow: 0 10px 30px -18px rgba(14, 35, 56, .45); }
.rhc-logo { display: inline-flex; align-items: center; flex-shrink: 1; min-width: 0; }
.rhc-logo img { height: 40px; width: auto; max-width: 100%; display: block; }
.rhc-nav .nav-link {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 500;
  color: var(--rhc-navy);
  padding: .5rem .85rem !important;
  position: relative;
}
.rhc-nav .nav-link::after {
  content: ""; position: absolute; left: .85rem; right: .85rem; bottom: .2rem;
  height: 3px; background: var(--rhc-coral); transform: scaleX(0); transform-origin: left; transition: transform .25s;
}
.rhc-nav .nav-link:hover::after, .rhc-nav .nav-link.active::after { transform: scaleX(1); }
.rhc-nav .navbar-toggler { border: 0; color: var(--rhc-navy); box-shadow: none; }
@media (max-width: 991.98px) {
  .rhc-nav .navbar-collapse { padding-bottom: 1rem; }
  .rhc-nav .nav-link::after { display: none; }
}
@media (max-width: 400px) { .rhc-logo img { height: 32px; } }

/* ---------- Shared bits ---------- */
.rhc-section { padding: 6rem 0; }
.rhc-kicker {
  display: inline-flex; align-items: center; gap: .55rem;
  font-family: "Space Grotesk", sans-serif; font-weight: 700;
  text-transform: uppercase; letter-spacing: .14em; font-size: .78rem;
  color: var(--rhc-coral-dark);
}
.rhc-kicker::before { content: ""; width: 26px; height: 3px; background: currentColor; }
.rhc-title { font-size: clamp(1.9rem, 3.6vw, 2.8rem); line-height: 1.12; }
.bg-mist { background: var(--rhc-mist); }
.bg-navy { background: var(--rhc-navy); color: #c9d6e4; }
.bg-navy h1, .bg-navy h2, .bg-navy h3 { color: #fff; }
.blueprint {
  background-color: var(--rhc-navy);
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
}
.cut { clip-path: polygon(0 0, calc(100% - var(--rhc-cut)) 0, 100% var(--rhc-cut), 100% 100%, var(--rhc-cut) 100%, 0 calc(100% - var(--rhc-cut))); }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

/* ---------- Hero ---------- */
.rhc-hero { color: #c9d6e4; padding: 5.5rem 0 6.5rem; position: relative; overflow: hidden; }
.rhc-hero h1 { color: #fff; font-size: clamp(2.3rem, 5vw, 3.9rem); line-height: 1.05; }
.rhc-hero h1 .hl { color: var(--rhc-coral); }
.rhc-hero .lead { color: #c9d6e4; max-width: 34rem; }
.rhc-hero .btn-rhc-outline { color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.6); }
.rhc-hero .btn-rhc-outline:hover { background: #fff; color: var(--rhc-navy); }
.rhc-checks { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; list-style: none; padding: 0; margin: 0; }
.rhc-checks li { display: flex; align-items: center; gap: .45rem; color: #fff; font-weight: 600; }
.rhc-checks i { color: var(--rhc-yellow); }
.rhc-frame { position: relative; margin: 0 1.25rem 1.25rem 0; }
.rhc-frame::before {
  content: ""; position: absolute; inset: 1.25rem -1.25rem -1.25rem 1.25rem;
  background: var(--rhc-coral);
  clip-path: polygon(0 0, calc(100% - var(--rhc-cut)) 0, 100% var(--rhc-cut), 100% 100%, var(--rhc-cut) 100%, 0 calc(100% - var(--rhc-cut)));
}
.rhc-frame img { position: relative; display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.rhc-ticket {
  position: absolute; left: -1rem; bottom: 1.6rem; z-index: 2;
  background: #fff; color: var(--rhc-navy); padding: .9rem 1.1rem; display: flex; gap: .75rem; align-items: center;
  box-shadow: var(--rhc-shadow); max-width: 260px;
}
.rhc-ticket .ico { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; background: var(--rhc-yellow); color: var(--rhc-navy); font-size: 1.2rem; }
.rhc-ticket small { color: var(--rhc-muted); }
@media (max-width: 575.98px) { .rhc-ticket { left: .5rem; bottom: .5rem; } }

.rhc-stripe {
  height: 14px;
  background: repeating-linear-gradient(-45deg, var(--rhc-yellow) 0 18px, var(--rhc-navy) 18px 36px);
}

/* ---------- Feature tiles ---------- */
.rhc-feature { background: #fff; padding: 2rem 1.6rem; height: 100%; border-top: 4px solid var(--rhc-navy); transition: border-color .25s, transform .25s; }
.rhc-feature:hover { border-color: var(--rhc-coral); transform: translateY(-4px); }
.rhc-feature .ico { width: 54px; height: 54px; display: grid; place-items: center; background: var(--rhc-coral-soft); color: var(--rhc-coral-dark); font-size: 1.5rem; margin-bottom: 1.1rem; }
.rhc-feature h3 { font-size: 1.2rem; }
.rhc-feature p { color: var(--rhc-muted); margin: 0; }

/* ---------- Service tiles (home) ---------- */
.rhc-tile { position: relative; display: block; overflow: hidden; text-decoration: none; height: 100%; background: var(--rhc-navy); }
.rhc-tile img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; transition: transform .5s, opacity .3s; }
.rhc-tile span {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 2.4rem 1rem .9rem;
  background: linear-gradient(transparent, rgba(14,35,56,.92));
  color: #fff; font-family: "Space Grotesk", sans-serif; font-weight: 700; line-height: 1.2;
  display: flex; justify-content: space-between; align-items: end; gap: .5rem;
}
.rhc-tile span i { color: var(--rhc-yellow); transition: transform .25s; }
.rhc-tile:hover img { transform: scale(1.06); opacity: .85; }
.rhc-tile:hover span i { transform: translateX(4px); }

/* ---------- Service cards ---------- */
.rhc-card { border: 0; border-radius: 0; background: #fff; height: 100%; box-shadow: 0 2px 0 var(--rhc-line); transition: transform .3s, box-shadow .3s; }
.rhc-card:hover { transform: translateY(-6px); box-shadow: var(--rhc-shadow); }
.rhc-card .media { position: relative; overflow: hidden; }
.rhc-card .media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; transition: transform .5s; }
.rhc-card:hover .media img { transform: scale(1.05); }
.rhc-card .badge-ico {
  position: absolute; left: 1.25rem; bottom: -22px; width: 48px; height: 48px; display: grid; place-items: center;
  background: var(--rhc-coral); color: #fff; font-size: 1.25rem; z-index: 2;
}
.rhc-card .card-body { padding: 2.2rem 1.5rem 1.6rem; display: flex; flex-direction: column; }
.rhc-card h3 { font-size: 1.3rem; margin-bottom: .6rem; }
.rhc-card p { color: var(--rhc-muted); flex-grow: 1; }
.rhc-card .btn { align-self: flex-start; }

/* ---------- Process ---------- */
.rhc-step { position: relative; padding: 1.8rem 1.5rem; border: 1px solid rgba(255,255,255,.14); height: 100%; background: rgba(255,255,255,.03); }
.rhc-step .ico { font-size: 1.8rem; color: var(--rhc-yellow); margin-bottom: .8rem; display: block; }
.rhc-step h3 { font-size: 1.2rem; color: #fff; }
.rhc-step p { margin: 0; color: #b6c5d5; }
.rhc-step::after {
  content: "\F138"; font-family: "bootstrap-icons"; position: absolute; right: -1.15rem; top: 50%; transform: translateY(-50%);
  color: var(--rhc-coral); font-size: 1.4rem; background: var(--rhc-navy); z-index: 2; line-height: 1;
}
.rhc-steps > div:last-child .rhc-step::after { display: none; }
@media (max-width: 991.98px) { .rhc-step::after { display: none; } }

/* ---------- CTA band ---------- */
.rhc-cta { background: var(--rhc-coral); color: #fff; padding: 3.5rem 0; position: relative; overflow: hidden; }
.rhc-cta::after {
  content: "\F2C2"; font-family: "bootstrap-icons"; position: absolute; right: -2rem; top: 50%; transform: translateY(-50%) rotate(-15deg);
  font-size: 16rem; color: rgba(255,255,255,.1); line-height: 1;
}
.rhc-cta h2 { color: #fff; }
.rhc-cta p { color: #ffe9e1; }
.rhc-cta .container { position: relative; z-index: 1; }

/* ---------- Blog ---------- */
.rhc-post { background: #fff; height: 100%; display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: transform .3s, box-shadow .3s; }
.rhc-post:hover { transform: translateY(-6px); box-shadow: var(--rhc-shadow); color: inherit; }
.rhc-post img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.rhc-post .body { padding: 1.5rem; display: flex; flex-direction: column; flex-grow: 1; }
.rhc-post .cat { font-family: "Space Grotesk", sans-serif; font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; color: var(--rhc-coral-dark); }
.rhc-post h3 { font-size: 1.25rem; margin: .5rem 0 .7rem; }
.rhc-post p { color: var(--rhc-muted); flex-grow: 1; }
.rhc-post .more { font-family: "Space Grotesk", sans-serif; font-weight: 700; color: var(--rhc-navy); }
.rhc-post:hover .more { color: var(--rhc-coral-dark); }

.rhc-article { background: #fff; padding: clamp(1.5rem, 4vw, 3rem); }
.rhc-article h2 { font-size: 1.55rem; margin: 2.2rem 0 .8rem; }
.rhc-article p, .rhc-article li { color: #33424f; line-height: 1.8; font-size: 1.05rem; }
.rhc-article ul { padding-left: 0; list-style: none; }
.rhc-article ul li { position: relative; padding-left: 1.8rem; margin-bottom: .55rem; }
.rhc-article ul li::before { content: "\F26B"; font-family: "bootstrap-icons"; position: absolute; left: 0; color: var(--rhc-coral); }
.rhc-article .lead-in { font-size: 1.2rem; color: var(--rhc-navy); font-weight: 500; }
.rhc-article .tip { background: var(--rhc-mist); border-left: 5px solid var(--rhc-coral); padding: 1.2rem 1.4rem; margin: 2rem 0; }
.rhc-article .tip p { margin: 0; }
.rhc-article-hero img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; display: block; }
.rhc-side { background: #fff; padding: 1.6rem; margin-bottom: 1.5rem; }
.rhc-side h3 { font-size: 1.15rem; margin-bottom: 1rem; }
.rhc-side .mini { display: flex; gap: .9rem; align-items: center; text-decoration: none; color: var(--rhc-navy); font-weight: 600; margin-bottom: 1rem; line-height: 1.3; }
.rhc-side .mini img { width: 84px; height: 62px; object-fit: cover; flex: 0 0 84px; }
.rhc-side .mini:hover { color: var(--rhc-coral-dark); }
.rhc-side.dark { background: var(--rhc-navy); color: #c9d6e4; }
.rhc-side.dark h3 { color: #fff; }

/* ---------- Page header ---------- */
.rhc-page-head { padding: 4.5rem 0 4rem; color: #c9d6e4; position: relative; }
.rhc-page-head h1 { color: #fff; font-size: clamp(2.1rem, 4.5vw, 3.2rem); }
.rhc-crumb { display: flex; gap: .5rem; flex-wrap: wrap; list-style: none; padding: 0; margin: 0 0 1rem; font-size: .9rem; }
.rhc-crumb a { color: var(--rhc-yellow); text-decoration: none; }
.rhc-crumb li + li::before { content: "/"; margin-right: .5rem; color: #6f88a3; }

/* ---------- About ---------- */
.rhc-value { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.rhc-value .ico { width: 48px; height: 48px; flex: 0 0 48px; display: grid; place-items: center; background: var(--rhc-navy); color: var(--rhc-yellow); font-size: 1.25rem; }
.rhc-value h3 { font-size: 1.15rem; margin-bottom: .3rem; }
.rhc-value p { margin: 0; color: var(--rhc-muted); }
.rhc-quote { background: #fff; padding: 2rem; height: 100%; position: relative; }
.rhc-quote::before { content: "\F6B0"; font-family: "bootstrap-icons"; font-size: 2.2rem; color: var(--rhc-coral); display: block; line-height: 1; margin-bottom: 1rem; }
.rhc-quote p { color: #33424f; font-size: 1.05rem; }
.rhc-quote strong { font-family: "Space Grotesk", sans-serif; color: var(--rhc-navy); }

/* ---------- Forms ---------- */
.rhc-form-card { background: #fff; padding: clamp(1.5rem, 4vw, 2.75rem); box-shadow: var(--rhc-shadow); }
.form-label { font-weight: 600; color: var(--rhc-navy); }
.form-control, .form-select { border-radius: 0; border: 1.5px solid var(--rhc-line); padding: .8rem 1rem; background-color: var(--rhc-paper); }
.form-control:focus, .form-select:focus { border-color: var(--rhc-coral); box-shadow: 0 0 0 .2rem rgba(242, 84, 45, .18); background-color: #fff; }
.form-check-input:checked { background-color: var(--rhc-coral); border-color: var(--rhc-coral); }
.form-check-input:focus { box-shadow: 0 0 0 .2rem rgba(242, 84, 45, .18); border-color: var(--rhc-coral); }
.rhc-success { display: none; background: #e6f6ec; border-left: 5px solid #2f9e5c; color: #1d5e37; padding: 1rem 1.2rem; margin-bottom: 1.25rem; }
.rhc-success.show { display: block; }
.rhc-info { display: flex; gap: 1rem; padding: 1.4rem 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.rhc-info:last-of-type { border-bottom: 0; }
.rhc-info .ico { width: 50px; height: 50px; flex: 0 0 50px; display: grid; place-items: center; background: var(--rhc-coral); color: #fff; font-size: 1.25rem; }
.rhc-info h3 { font-size: 1.05rem; margin-bottom: .25rem; color: #fff; }
.rhc-info p, .rhc-info a { margin: 0; color: #c9d6e4; text-decoration: none; overflow-wrap: anywhere; }
.rhc-info a:hover { color: var(--rhc-yellow); }
.rhc-map { border: 0; width: 100%; min-height: 380px; display: block; background: var(--rhc-mist); }
.rhc-perks { list-style: none; padding: 0; }
.rhc-perks li { display: flex; gap: .8rem; margin-bottom: 1rem; }
.rhc-perks i { color: var(--rhc-coral); font-size: 1.2rem; }

/* ---------- Legal ---------- */
.rhc-legal { background: #fff; padding: clamp(1.5rem, 4vw, 3rem); }
.rhc-legal h2 { font-size: 1.35rem; margin-top: 2rem; }
.rhc-legal p, .rhc-legal li { color: #33424f; line-height: 1.8; }

/* ---------- Newsletter strip ---------- */
.rhc-news { background: var(--rhc-mist); padding: 3.5rem 0; border-top: 1px solid var(--rhc-line); }
.rhc-news .icon-box { width: 70px; height: 70px; display: grid; place-items: center; background: var(--rhc-navy); color: var(--rhc-yellow); font-size: 1.8rem; }

/* ---------- Footer ---------- */
.rhc-footer { background: var(--rhc-navy); color: #a9bacb; padding-top: 4.5rem; }
.rhc-footer .brand img { height: 36px; width: auto; max-width: 100%; }
.rhc-footer h4 { color: #fff; font-size: 1rem; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 1.2rem; }
.rhc-footer ul { list-style: none; padding: 0; margin: 0; }
.rhc-footer li { margin-bottom: .6rem; }
.rhc-footer a { color: #a9bacb; text-decoration: none; }
.rhc-footer a:hover { color: var(--rhc-yellow); }
.rhc-footer .social a { width: 40px; height: 40px; display: inline-grid; place-items: center; border: 1px solid rgba(255,255,255,.2); margin-right: .4rem; color: #fff; }
.rhc-footer .social a:hover { background: var(--rhc-coral); border-color: var(--rhc-coral); color: #fff; }
.rhc-footer .bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 1.4rem 0; margin-top: 3.5rem; font-size: .92rem; }

.rhc-top {
  position: fixed; right: 1.2rem; bottom: 1.2rem; width: 48px; height: 48px; border: 0; z-index: 1030;
  background: var(--rhc-coral); color: #fff; font-size: 1.3rem; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s;
}
.rhc-top.show { opacity: 1; visibility: visible; }
.rhc-top:hover { background: var(--rhc-navy); }