@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap");
html body #urfo-header {background:#ffffff}
html body #urfo-header .uh-brand img {width:230px!important;height:auto!important;max-width:100%}
html body #urfo-header .uh-brand-descriptor {line-height:1.7;letter-spacing:.055em;text-transform:uppercase}
html body footer.legacy-home-footer {background:#222222;color:#ffffff;padding:0}
.legacy-home-links,.legacy-home-contacts,.legacy-home-notice {width:min(1060px,calc(100% - 40px));margin-inline:auto}
.legacy-home-links {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;padding-block:56px}
.legacy-home-links h2 {font:700 18px/1.25 Roboto,Arial,sans-serif;margin:0 0 14px;color:#ffffff}
html body .legacy-home-footer a {color:#c6c6c6;text-decoration:none}
html body .legacy-home-footer a:hover {color:#ffffff;text-decoration:underline}
.legacy-home-links a {display:block;margin:0 0 7px;font-size:14px}
.legacy-home-bottom {background:#141414;padding-block:26px}
.legacy-home-contacts {display:flex;align-items:center;gap:18px 40px;flex-wrap:wrap;font-size:14px}
.legacy-home-contacts img {width:96px;height:auto;object-fit:contain}
.legacy-home-phone {display:block;font-size:20px}
.legacy-home-notice {color:#b5b5b5;font-size:13px;margin-block:20px 0}
@media (min-width:951px) and (max-width:1250px) {
 html body #urfo-header .uh-headrow {grid-template-columns:auto auto minmax(0,1fr) minmax(125px,160px);gap:10px}
 html body #urfo-header .uh-site-search input {width:100%}
 html body #urfo-header .uh-nav {gap:9px;flex-wrap:wrap}
}
@media (max-width:950px) {
 html body #urfo-header .uh-brand img {width:min(230px,42vw)!important}
}
@media (max-width:650px) {
 .legacy-home-links {grid-template-columns:repeat(2,minmax(0,1fr));padding-block:32px;gap:18px}
}

.legacy-footer-replaced {display:none!important}

/* Shared navigation and typography on the original home page. */
:root {
  --urfo-accent: #b7282b;
  --urfo-font: "Open Sans", Arial, sans-serif;
}
html body {
  --red: var(--urfo-accent);
  --red2: var(--urfo-accent);
}
html body :is(#urfo-header, #top:has(> .hero), .legacy-home-footer),
html body :is(#urfo-header, #top:has(> .hero), .legacy-home-footer)
  :is(a, b, strong, span, p, li, h2, h3, label, input, select, textarea, button, summary, small, em) {
  font-family: var(--urfo-font) !important;
}
html body #urfo-header :is(.uh-nav a, .uh-header-city b, .uh-site-search input,
  .uh-infas-group-links a, .uh-infas-services a) {
  font-size: 14px !important;
  font-weight: 400 !important;
}
html body #urfo-header :is(.uh-group-head a, .uh-infas-group-head a, .uh-header-action b,
  .uh-infas-help-copy b, .uh-infas-help-link) {
  font-size: 14px !important;
  font-weight: 600 !important;
}
html body #urfo-header :is(.uh-header-action small, .uh-infas-help-copy span) {
  font-size: 12px !important;
  font-weight: 400 !important;
}
html body #urfo-header :is(.uh-action-catalog, .uh-infas-help-link) {
  background: var(--urfo-accent) !important;
  color: #fff !important;
  border-color: var(--urfo-accent) !important;
}
html body #urfo-header :is(.uh-infas-category-icon, .uh-infas-service-icon, .uh-infas-services a span) {
  color: var(--urfo-accent) !important;
}
html body #urfo-header .uh-infas-help-link span {color: inherit !important}
html body #urfo-header .uh-infas-help-link:hover {text-decoration: underline}
html body #top:has(> .hero) :is(p, label, input, select, textarea, summary, .infas-group-links a) {
  font-size: 16px !important;
  line-height: 1.55;
}
html body #top:has(> .hero) :is(h2,h3) {
  font-weight: 700 !important;
  letter-spacing: normal !important;
}
html body #top:has(> .hero) h1 em {font-style: normal; color: transparent !important; -webkit-text-stroke: 1px #e8e8e8}
html body #top:has(> .hero) h2 {font-size: clamp(26px, 3vw, 38px) !important; line-height: 1.2}
html body #top:has(> .hero) h3 {font-size: 18px !important; line-height: 1.3}
html body #top:has(> .hero) :is(.btn, .text-link, .review-open) {
  font-size: 14px !important;
  font-weight: 600 !important;
}
html body #top:has(> .hero) .btn.primary {background: var(--urfo-accent) !important; border-color: var(--urfo-accent) !important}
html body #top:has(> .hero) :is(.kicker, .eyebrow, .text-link, .review-stars) {color: var(--urfo-accent)}
html body #top:has(> .hero) :is(.hero .eyebrow, .turnkey .kicker, .turnkey .text-link, .delivery .kicker) {color: inherit}

/* Neutral backgrounds and heading colors on the home page. */
html body #top:has(> .hero) {
  --urfo-home-paper: #f9f9f9;
  --urfo-home-ink: #222222;
  --urfo-home-text: #626262;
  --urfo-home-light: #e8e8e8;
  background: var(--urfo-home-paper);
  color: var(--urfo-home-ink);
}
html body #top:has(> .hero) .hero h1 {color: var(--urfo-home-light) !important}
html body #top:has(> .hero) .media-section {
  background: var(--urfo-home-paper) !important;
  color: var(--urfo-home-ink) !important;
}
html body #top:has(> .hero) .media-section::before,
html body #top:has(> .hero) .media-section::after {content: none}
html body #top:has(> .hero) .section-head h2 {color: var(--urfo-home-ink) !important}
html body #top:has(> .hero) .section-head p {
  color: var(--urfo-home-text) !important;
}


/* Restore the first screen's original headline proportions. */
html body #top .hero h1 em {font-family: inherit !important}
html body #top .hero .eyebrow {color: var(--urfo-accent)}
@media (min-width: 951px) {
  html body #top .hero h1 {
    font-size: clamp(76px, 6.8vw, 102px);
    line-height: .88;
    letter-spacing: -.065em;
    max-width: min(100%, 8.5em);
  }
}

/* Facade installation section. */
html body #top .turnkey {background: #222222; color: #f9f9f9}
html body #top .turnkey h2 {color: #f9f9f9; font-size: clamp(36px, 4.8vw, 68px) !important; line-height: 1.02; letter-spacing: -.045em !important}
html body #top .turnkey .lead,
html body #top .turnkey .steps p {color: #c6c6c6}
html body #top .turnkey .steps li {background: #2d2d2d; border-color: #454545}
html body #top .turnkey .steps li:hover {background: #363636; border-color: var(--urfo-accent)}
html body #top .turnkey .steps li > span {background: var(--urfo-accent); color: #fff}
html body #top .turnkey .text-link {color: #f9f9f9}
html body #top .turnkey .text-link:hover {color: #222222}

/* Footer layout from the original home page. */
html body .legacy-home-footer .legacy-home-links {
  width: min(930px, calc(100% - 40px)); display: flex; justify-content: space-between;
  gap: 20px; padding-block: 100px;
}
html body .legacy-home-footer .legacy-home-links h2 {font-size: 20px; margin: 0 0 20px}
html body .legacy-home-footer .legacy-home-links a {color: #a4a4a4; margin: 10px 0 0; font-size: 14px; line-height: 1.45}
html body .legacy-home-footer .legacy-home-links a:hover {color: #fff}
html body .legacy-home-footer .legacy-home-bottom {padding: 35px 0 60px}
html body .legacy-home-footer .legacy-home-contacts {
  width: min(940px, calc(100% - 40px)); display: grid; grid-template-columns: 280px 305px 1fr; gap: 0;
}
html body .legacy-home-footer .legacy-home-contacts > div {
  padding-left: 55px; min-height: 52px; background: url('/assets/classic-footer/ico_phone.png') no-repeat left center;
}
html body .legacy-home-footer .legacy-home-contacts > img {width: 96px}
html body .legacy-home-footer .legacy-home-phone {font-size: 24px}
html body .legacy-home-footer .legacy-home-notice {width: min(920px, calc(100% - 40px)); margin: 40px auto 0}
.classic-footer-banner {height: 296px; position: relative; background: #fff; color: #222}
.classic-footer-scenes {position: absolute; inset: 0; background: url('/assets/classic-footer/footer-open-img.png') center bottom / auto 296px no-repeat}
#classic-footer-inside {position: absolute; opacity: 0; width: 1px; height: 1px}
#classic-footer-inside:checked ~ .classic-footer-scenes {background-image: url('/assets/classic-footer/footer-close-img.png')}
.classic-footer-inner {width: min(940px, calc(100% - 32px)); height: 100%; margin: auto; position: relative}
.classic-footer-title {position: absolute; top: 43px; left: 35px; width: 370px; max-width: 58%; height: auto}
html body .legacy-home-footer .classic-footer-cta {position: absolute; top: 151px; left: 39px; background: var(--urfo-accent,#b7282b); color: #fff; padding: 10px 29px; border-radius: 2px; text-transform: uppercase; font-size: 14px}
.classic-footer-switch {position: absolute; top: 28px; right: -59px; display: flex; gap: 5px; align-items: center; cursor: pointer; font-size: 13px}
.classic-footer-switch span {width: 48px; height: 24px; border-radius: 19px; background: var(--urfo-accent,#b7282b); position: relative}
.classic-footer-switch span::after {content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%; background: #fff; left: 3px; top: 3px}
#classic-footer-inside:checked ~ .classic-footer-inner .classic-footer-switch span::after {left: 27px}
#classic-footer-inside:focus-visible ~ .classic-footer-inner .classic-footer-switch {outline: 2px solid #222}
.classic-footer-point {position: absolute; width: 18px}
.classic-footer-point-frame {right: 233px; bottom: 84px}
.classic-footer-point-panel {right: 133px; bottom: 189px}
.classic-footer-point summary {list-style: none; cursor: pointer; width: 18px; height: 18px; border: 2px solid #fff; border-radius: 50%; background: var(--urfo-accent,#b7282b)}
.classic-footer-point summary::-webkit-details-marker {display: none}
.classic-footer-point[open] {z-index: 1}
.classic-footer-point div {position: absolute; top: 24px; right: 0; width: 220px; padding: 12px; color: #222; background: #fff; box-shadow: 0 4px 18px #0003}
html body .legacy-home-footer .classic-footer-point a {color: var(--urfo-accent,#b7282b)}
@media (max-width: 1080px) {.classic-footer-switch {right: 0}}
@media (max-width: 850px) {
  html body .legacy-home-footer .legacy-home-links {display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding-block: 45px}
  html body .legacy-home-footer .legacy-home-contacts {grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 18px}
  .classic-footer-scenes {background-position: 60% bottom}
  .classic-footer-title {left: 0; top: 60px}
  html body .legacy-home-footer .classic-footer-cta {left: 0; top: 135px; padding-inline: 12px}
  .classic-footer-point-frame {right: 22%}
  .classic-footer-point-panel {right: 10%}
}

/* Align the footer with the main .shell, including the FAQ. */
html body footer.legacy-home-footer {
  --urfo-footer-width: min(1240px, calc(100% - 48px));
}
html body .legacy-home-footer :is(.legacy-home-links, .legacy-home-contacts, .legacy-home-notice) {
  width: var(--urfo-footer-width);
  max-width: none;
  margin-inline: auto;
}
html body .legacy-home-footer .legacy-home-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
html body .legacy-home-footer .legacy-home-contacts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
html body .legacy-home-footer .legacy-home-contacts > img {
  content: url('/assets/logo_urfomarket_black.png');
  display: block;
  width: min(210px, 100%);
  height: auto;
  filter: invert(1) grayscale(1) brightness(.85);
  opacity: 0.3;
}
@media (max-width: 850px) {
  html body .legacy-home-footer .legacy-home-links {grid-template-columns: repeat(2,minmax(0,1fr))}
  html body .legacy-home-footer .legacy-home-contacts {grid-template-columns: repeat(auto-fit,minmax(240px,1fr))}
}
@media (max-width: 700px) {
  html body footer.legacy-home-footer {--urfo-footer-width: min(1240px, calc(100% - 30px))}
}