/* Rock's architectural presentation. Component markup and interactions stay native. */
:root {
  --rock-content: 1240px;
  --rock-gutter: clamp(24px, 5vw, 80px);
  --rock-section-space: clamp(72px, 8vw, 128px);
  --cheers-service-area-map-background: var(--paper);
  --cheers-reviews-card-background: #4d194c;
  --cheers-reviews-card-hover: #572156;
  --cheers-reviews-border: #70396e;
  --cheers-reviews-card-radius: 2px;
  --cheers-reviews-section-padding: var(--rock-section-space);
  --cheers-reviews-inline-padding: var(--rock-gutter);
  --cheers-reviews-max-width: calc(var(--rock-content) + 2 * var(--rock-gutter));
}

/* One alignment system from the hero through the footer. */
.wrap,
.cheers-service-area-map__inner,
.cheers-social-proof-2__list {
  width: min(var(--rock-content), calc(100% - 2 * var(--rock-gutter)));
}
.eyebrow, .card-eyebrow { font-weight: 600; letter-spacing: .12em; }
.eyebrow { font-size: 11px; margin-bottom: 24px; }
.section { padding-block: var(--rock-section-space); }
.section-head { gap: 40px; margin-bottom: 52px; }
.section-head h2 { max-width: 800px; }
.text-link { font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
body :is(.button, .help-panel .button, .cheers-service-area-map__search button, .cheers-service-area-map__action) { font-weight: 600; }

/* Preserve the split hero, with a quieter headline and a generous image field. */
.hero { max-width: none; min-height: 680px; grid-template-columns: 1.05fr 1fr; }
.hero-copy {
  padding: clamp(72px, 7vw, 120px) clamp(32px, 4vw, 64px) clamp(64px, 7vw, 112px) max(var(--rock-gutter), calc((100vw - var(--rock-content)) / 2));
  display: flex; flex-direction: column; justify-content: center;
}
.hero h1 { margin-bottom: 32px; }
.hero-heading-lead { gap: 18px; }
.hero-heading-lead .hero-mascot { width: 15%; max-width: 64px; }
.hero-description { font-size: 16px; line-height: 1.75; max-width: 480px; margin-bottom: 34px; }
.hero-actions { gap: 14px; }
.hero-photo { min-height: 680px; }
.photo-label { left: 32px; bottom: 32px; font-size: 10px; letter-spacing: .12em; font-weight: 500; }
.photo-stamp { width: auto; height: auto; top: 32px; right: 32px; padding: 12px 15px; border-radius: 0; transform: none; font-size: 10px; letter-spacing: .04em; }
.photo-stamp strong { font-size: 19px; letter-spacing: -.03em; font-weight: 500; }

/* Service content stays complete; spacing takes the place of a boxed grid. */
.service-grid { gap: 44px 48px; border: 0; }
.service-card, .prose .service-card { padding: 0 0 12px; border: 0; background: transparent; }
.service-card:hover { background: transparent; }
.service-card:hover h3 { color: var(--purple); text-decoration: none; }
.card-eyebrow { font-size: 10px; line-height: 1.6; margin-bottom: 16px; }
.service-card h3, .prose .service-card h3 { max-width: 360px; margin: 0 0 14px; }
.service-card p, .prose .service-card p { font-size: 15px; line-height: 1.75; max-width: 360px; }
.hub-intro { max-width: 760px; margin-bottom: 64px; }

.story { padding-block: var(--rock-section-space); background: #f1eeef; }
.story-grid { gap: clamp(40px, 6vw, 96px); }
.story-grid > img { height: auto; aspect-ratio: 6 / 5; object-fit: cover; }
.story-grid h2 { margin-bottom: 28px; }
.story-grid p:not(.eyebrow) { font-size: 16px; line-height: 1.8; }
.story-grid .text-link { margin-top: 12px; }

/* Theme the library components locally, retaining their layouts and controls. */
.cheers-social-proof-2 { border-bottom: 0; box-shadow: none; }
.cheers-social-proof-2__list { padding-block: 28px; }
.cheers-social-proof-2__body { border-radius: 2px; }
.cheers-how-it-works { padding: var(--rock-section-space) var(--rock-gutter) !important; }
.cheers-how-it-works__eyebrow,
.cheers-service-area-map__eyebrow,
.cheers-reviews .eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .12em; }
.cheers-reviews .cheers-reviews-header { padding-bottom: 40px; }
.cheers-reviews .cheers-review-card { box-shadow: none; }
.cheers-service-area-map { padding-block: var(--rock-section-space); }
.cheers-service-area-map__map-shell { border-radius: 2px; }
.cheers-service-area-map__search label { font-weight: 500; }
.home-location-choice { padding-top: 0; padding-bottom: 36px; margin-top: -32px; }

/* Long-form pages get readable measures and a clear, spacious hierarchy. */
.inner-hero--photo { min-height: 520px; padding-block: 96px; align-items: flex-end; }
.inner-hero--photo:after { background: linear-gradient(90deg, rgba(25,17,27,.8), rgba(25,17,27,.5) 55%, rgba(25,17,27,.18)); }
.inner-hero--photo h1 { max-width: 950px; }
.inner-hero.inner-hero--photo .eyebrow { font-size: 11px; font-weight: 600; margin-bottom: 26px; }
.inner-hero.inner-hero--photo .inner-hero__intro { font-size: 17px; line-height: 1.75; max-width: 650px; }
.inner-hero--team { min-height: 600px; }
.inner-hero--team h1 { max-width: 700px; }
.article-layout { padding-block: var(--rock-section-space); gap: clamp(48px, 7vw, 112px); }
.prose { min-width: 0; }
.prose h2 { margin-top: 56px; margin-bottom: 24px; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 36px; }
.prose p, .prose li, .hub-intro p, .hub-intro li { font-size: 16px; line-height: 1.85; }
.prose p { margin-bottom: 24px; max-width: 70ch; }
.help-panel { top: 128px; background: #f1eeef; padding: 32px; }
.help-panel p:not(.eyebrow) { font-size: 14px; line-height: 1.75; }
.contact-grid { gap: clamp(48px, 8vw, 120px); }
.contact-grid p { font-size: 16px; }
.big-phone { font-weight: 400; }
.city-links a, .region-directory summary { font-weight: 500; }

.callout { background: var(--purple-dark); padding-block: var(--rock-section-space); }
.callout .wrap { gap: 80px; }
.callout p { font-size: 16px; line-height: 1.75; }
footer { padding-top: 88px; padding-bottom: 32px; }
.footer-grid { gap: 72px; }
footer p { font-size: 13px; line-height: 1.75; }
.footer-phone { font-weight: 400; }
.footer-bottom { margin-top: 64px; padding-top: 28px; }

@media (max-width: 1150px) {
  .service-grid { gap: 36px 32px; }
  .hero-copy { padding-right: 32px; }
  .hero, .hero-photo { min-height: 610px; }
}
@media (max-width: 850px) {
  .hero { grid-template-columns: 1fr; }
  .hero-copy { max-width: none; padding: 64px var(--rock-gutter); }
  .hero h1 { max-width: 640px; }
  .hero-description { max-width: 560px; }
  .hero-photo { min-height: 420px; }
  .hero-photo > img { object-position: center 55%; }
  .story-grid { gap: 36px; }
  .story-grid > img { aspect-ratio: 3 / 2; }
  .article-layout { gap: 48px; }
  .help-panel { position: static; }
  .callout .wrap { gap: 40px; }
  .footer-grid { gap: 40px; }
}
@media (max-width: 540px) {
  :root { --rock-gutter: 24px; --rock-section-space: 64px; }
  .hero-copy { padding-block: 48px; }
  .hero h1 { margin-bottom: 26px; }
  .hero-heading-lead { gap: 12px; }
  .hero-heading-lead .hero-mascot { width: 16%; max-width: 52px; }
  .hero-description { font-size: 15px; line-height: 1.75; margin-bottom: 28px; }
  .hero-photo { min-height: 310px; }
  .photo-label { left: 24px; bottom: 24px; font-size: 9px; }
  .photo-stamp { top: 24px; right: 24px; }
  .section-head { gap: 24px; margin-bottom: 36px; }
  .service-grid { gap: 34px; }
  .service-card p, .prose .service-card p { font-size: 15px; }
  .hub-intro { margin-bottom: 40px; }
  .story-grid p:not(.eyebrow) { font-size: 15px; }
  .cheers-social-proof-2__list { padding-block: 20px; }
  .cheers-reviews .cheers-reviews-header { padding-bottom: 28px; }
  .cheers-reviews > .wrap { padding-inline: var(--rock-gutter); }
  .inner-hero--photo { min-height: 390px; padding-block: 56px; }
  .inner-hero--photo:after { background: linear-gradient(90deg, rgba(25,17,27,.82), rgba(25,17,27,.56)); }
  .inner-hero--team { min-height: 440px; }
  .inner-hero.inner-hero--photo .inner-hero__intro { font-size: 15px; line-height: 1.7; }
  .prose h2 { margin-top: 40px; }
  .prose p, .prose li, .hub-intro p, .hub-intro li { font-size: 15px; line-height: 1.8; }
  .help-panel { padding: 28px; }
  .callout .wrap { gap: 30px; }
  footer { padding-top: 56px; }
  .footer-grid { column-gap: 24px; row-gap: 36px; }
  .footer-bottom { margin-top: 40px; }
}

/* Secondary actions center beneath their primary CTA; preserve original headings. */
.help-panel > .text-link {
  display: flex; width: 100%; min-height: 44px;
  align-items: center; justify-content: center; text-align: center;
  margin-top: 12px;
}
@media (max-width: 850px) {
  .text-link, .cheers-service-area-map__more {
    display: flex; width: 100%; min-height: 44px;
    align-items: center; justify-content: center; text-align: center;
  }
}

/* Keep the subject in view at each hero aspect ratio. */
.inner-hero__image--service { object-position: var(--service-hero-position); }
@media (max-width: 540px) { .inner-hero__image--service { object-position: var(--service-hero-mobile-position); } }

/* Full-bleed homepage photography, shared across the four Rock trades. */
.home-hero {
 position:relative; isolation:isolate; overflow:hidden;
 display:flex; align-items:center; min-height:0;
 background:#1e1420; color:#fff;
}
.home-hero__media { position:absolute; inset:0; z-index:-2; }
.home-hero__media img {
 width:100%; height:100%; max-width:none; object-fit:cover;
 object-position:var(--home-hero-position);
}
.home-hero::after {
 content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
 background:linear-gradient(90deg,rgba(23,13,26,.94) 0%,rgba(28,14,31,.87) 28%,rgba(28,14,31,.65) 48%,rgba(25,13,29,.16) 76%,rgba(25,13,29,.08) 100%),linear-gradient(0deg,rgba(23,13,26,.25),transparent 40%);
}
.home-hero__content { position:relative; padding-block:clamp(40px,6svh,64px); }
.home-hero__copy { max-width:780px; }
.home-hero .home-hero__eyebrow {
 color:var(--mint); font-size:12px; letter-spacing:.14em;
 font-weight:700; margin:0 0 18px; line-height:1.6;
}
.home-hero__heading {
 font-size:clamp(48px,4.8vw,72px); font-weight:800; line-height:1.02;
 letter-spacing:-.055em; margin:0 0 24px; max-width:780px;
 text-wrap:balance;
}
.home-hero__heading>span,.home-hero__heading>em { display:block; }
.home-hero__heading>em { color:var(--mint); font-style:normal; }
.home-hero__description {
 max-width:640px; font-size:17px; line-height:1.55; color:#f0eaf1;
 margin:0 0 26px; text-wrap:pretty;
}
.home-hero__actions { display:flex; flex-direction:column; align-items:stretch; gap:8px; width:min(100%,320px); }
.home-hero__actions .button { min-height:56px; font-size:18px; }
.home-hero__actions .text-link {
 color:#fff; width:100%; min-height:44px; display:flex; align-items:center;
 justify-content:center; text-align:center; font-size:16px; font-weight:600;
 text-decoration:none; transition:color .15s ease;
}
.home-hero__actions .text-link:hover { color:var(--mint); text-decoration:none; }
.home-hero__actions .text-link:focus-visible { outline-color:var(--mint); }
.home-hero__mascot {
 position:absolute; width:60px; height:auto; right:var(--rock-gutter); bottom:32px;
 pointer-events:none;
}
/* Let the desktop lead use the available width instead of balancing into two lines. */
.home-hero__lead > span { text-wrap:wrap; }
@media(min-width:951px) {
 .home-hero__content { padding-block:clamp(68px,9svh,92px); }
 .home-hero .home-hero__eyebrow { margin-bottom:24px; }
 .home-hero__heading { line-height:1.06; margin-bottom:32px; }
 .home-hero__description { margin-bottom:34px; }
 .home-hero__actions { gap:12px; }
 .home-hero__heading > .home-hero__lead { position:relative; width:max-content; }
 .home-hero__mascot { width:clamp(104px,7.2vw,120px); top:0; bottom:auto; right:auto; left:calc(100% + .4em); }
 .plumbing .home-hero__lead > span { white-space:nowrap; }
 /* HVAC's second line is wider than its lead, so Rocky clears the whole heading instead of covering "Cooling". */
 .hvac .home-hero__heading { position:relative; width:max-content; }
 .hvac .home-hero__heading > .home-hero__lead { position:static; width:auto; }
}
@media(max-width:950px) {
 .home-hero__media img { object-position:var(--home-hero-mobile-position); }
 .home-hero::after {
  background:linear-gradient(180deg,rgba(23,13,26,.6) 0%,rgba(23,13,26,.78) 25%,rgba(23,13,26,.92) 65%,rgba(23,13,26,.97) 100%);
 }
 .home-hero__content { padding-block:clamp(36px,5svh,48px); }
 .home-hero__copy { max-width:680px; }
 .home-hero__heading { font-size:clamp(48px,8vw,68px); max-width:none; margin-bottom:20px; }
 .home-hero__heading > .home-hero__lead { display:flex; align-items:flex-start; justify-content:flex-start; gap:.2em; }
 .home-hero__lead > span { min-width:0; flex:0 1 auto; }
 .home-hero__description { max-width:620px; font-size:16px; line-height:1.5; margin-bottom:22px; }
 .home-hero .home-hero__eyebrow { font-size:11px; margin-bottom:14px; }
 .home-hero__mascot { position:static; flex:none; width:84px; height:auto; align-self:flex-start; }
}
@media(max-width:540px) {
 .home-hero__content { padding-block:clamp(28px,4.5svh,36px); }
 .home-hero__heading { font-size:clamp(40px,11.4vw,60px); line-height:1.04; letter-spacing:-.05em; margin-bottom:18px; }
 .home-hero__heading > .home-hero__lead { gap:.2em; }
 /* Hug the existing two-line lead rather than reserving its ragged right edge. */
 :is(.plumbing,.electrical,.appliance) .home-hero__lead > span { width:min-content; }
 .home-hero__mascot { width:clamp(64px,18vw,84px); }
 .home-hero__description { font-size:15px; line-height:1.5; margin-bottom:20px; }
 .home-hero__actions { width:100%; gap:8px; }
 .home-hero__actions .button { min-height:52px; }
}
/* Short viewports get less air, never clipped text or a hidden call action. */
@media(max-height:720px) and (min-width:951px) {
 .home-hero__content { padding-block:56px; }
 .home-hero__mascot { width:104px; }
 .home-hero__heading { font-size:48px; margin-bottom:26px; }
 .home-hero__description { font-size:16px; line-height:1.5; margin-bottom:26px; }
 .home-hero .home-hero__eyebrow { margin-bottom:18px; }
}
@media(max-height:650px) and (max-width:950px) {
 .home-hero__content { padding-block:22px; }
 .home-hero__heading { margin-bottom:16px; }
 .home-hero__description { line-height:1.5; margin-bottom:16px; }
 .home-hero .home-hero__eyebrow { margin-bottom:12px; }
}

/* The hidden attribute must win over the fixed mobile bar display rule. */
.mobile-call-bar[hidden] { display:none; }

/* Keep the proof strip in one swipeable row on mobile. */
@media (max-width:950px) {
 .cheers-social-proof-2 .cheers-social-proof-2__list {
  display:flex; align-items:stretch; width:100%; max-width:100%;
  margin:0; padding:14px var(--rock-gutter); overflow-x:auto;
  overscroll-behavior-x:contain; scroll-snap-type:x proximity;
  scroll-padding-inline:var(--rock-gutter); scrollbar-width:none;
  touch-action:pan-x pan-y pinch-zoom;
 }
 .cheers-social-proof-2__list::-webkit-scrollbar { display:none; }
 .cheers-social-proof-2 .cheers-social-proof-2__item:nth-child(n) {
  flex:0 0 min(82vw,340px); grid-column:auto; border:0;
  scroll-snap-align:start;
 }
 .cheers-social-proof-2 .cheers-social-proof-2__item + .cheers-social-proof-2__item::before {
  display:block; height:40px;
 }
 .cheers-social-proof-2 .cheers-social-proof-2__item:nth-child(n) .cheers-social-proof-2__body {
  min-height:84px; justify-content:flex-start; gap:12px;
  padding:12px; border-radius:0;
 }
 .cheers-social-proof-2 .cheers-social-proof-2__visual {
  display:grid; place-items:center; width:70px; height:56px; flex:0 0 70px;
 }
 .cheers-social-proof-2 .cheers-social-proof-2__copy strong { font-size:14px; line-height:1.3; }
 .cheers-social-proof-2 .cheers-social-proof-2__copy small { font-size:12px; line-height:1.4; }
 .cheers-social-proof-2 .cheers-social-proof-2__body:hover { transform:none; }
 .cheers-social-proof-2__list:focus-visible { outline:2px solid var(--purple); outline-offset:-2px; }
}

/* One short receiver wiggle per desktop hover; the number stays still. */
.header .nav-call,
.header .nav-call:hover { text-decoration:none; }
.nav-call__icon { width:20px; height:20px; flex:none; transform-origin:center; }
@media (min-width:951px) {
 .header .nav-call { display:inline-flex; align-items:center; gap:10px; }
}
@media (min-width:951px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .header .nav-call:hover .nav-call__icon { animation:rock-phone-wiggle .42s ease-in-out 1; }
}
@keyframes rock-phone-wiggle {
 0%,100% { transform:rotate(0deg); }
 30% { transform:rotate(-15deg); }
 65% { transform:rotate(13deg); }
}

/* Continuous motion uses native scrollLeft so manual scrolling takes over in place. */
@media (max-width:950px) {
 .cheers-social-proof-2__list[data-carousel-loop] {
  scroll-snap-type:none; scroll-behavior:auto; overflow-anchor:none; cursor:grab;
 }
 .cheers-social-proof-2__list.is-dragging,
 .cheers-social-proof-2__list.is-dragging .cheers-social-proof-2__body {
  cursor:grabbing; user-select:none;
 }
}