/* Cascadia Gate extras on top of the shared styles.css.
   Keep visual language identical; only add what this site uniquely needs. */

:root { --review-bar-h: 0px; }

.call-pop__numtext {
  margin: 8px 0 16px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(1.6rem, 5vw, 2.15rem);
  letter-spacing: 0.02em;
  color: var(--brown-800);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.footer-dba {
  margin-top: 10px;
  font-size: .88rem;
  color: rgba(255,255,255,.62);
  max-width: 36rem;
}
.footer-dba a { color: #FAD85A; }
.footer-dba a:hover { color: #fff; }

.reviews-soon {
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  padding: 28px 24px;
  text-align: center;
  color: var(--muted);
  max-width: 40rem;
  margin: 0 auto;
}
.reviews-soon strong { display: block; color: var(--brown-800); font-family: var(--font-display); font-size: 1.15rem; margin-bottom: 8px; }

.brand-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-top: 18px;
  padding: 0;
}
.brand-list li {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 16px;
  font-weight: 600;
  font-size: .92rem;
  color: var(--brown-800);
}

.operator-grid { display: grid; gap: 16px; list-style: none; padding: 0; margin: 22px 0 0; }
@media (min-width: 700px) { .operator-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .operator-grid { grid-template-columns: repeat(5, 1fr); } }
.operator-card {
  background: #fff;
  border: 1px solid rgba(61,41,20,.15);
  border-radius: 14px;
  padding: 20px 18px;
}
.operator-card h3 { margin: 0 0 8px; font-size: 1.05rem; }
.operator-card p { margin: 0; font-size: .9rem; color: var(--muted); }

.faq-list { display: grid; gap: 14px; margin-top: 8px; }
.faq-item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0;
}
.faq-item h3, .faq-item summary {
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 700;
  color: var(--brown-800);
  padding: 18px 20px 0;
}
.faq-item p { padding: 10px 20px 18px; margin: 0; color: var(--ink); }
.faq-item details summary {
  cursor: pointer;
  list-style: none;
  padding: 18px 20px;
}
.faq-item details summary::-webkit-details-marker { display: none; }
.faq-item details[open] summary { padding-bottom: 0; }
.faq-item details p { padding: 10px 20px 18px; }

.work-gallery { display: grid; gap: 18px; margin-top: 22px; grid-template-columns: 1fr; }
@media (min-width: 700px) {
  .work-gallery { grid-template-columns: 1fr 1fr; }
  .work-item--hero { grid-column: 1 / -1; }
}
.work-gallery figure { margin: 0; }
.work-gallery img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--cream-2);
}
.work-item--hero img { aspect-ratio: 4 / 3; object-fit: cover; }
.work-item--portrait img { aspect-ratio: 3 / 4; object-fit: cover; width: 100%; }
.work-gallery__smalls {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: flex-start;
  justify-content: flex-start;
}
.work-item--small { flex: 0 1 auto; max-width: 100%; }
.work-item--small img {
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.work-item--small img.job-04 { max-width: 600px; }
.work-item--small img.job-05 { max-width: 474px; }
.work-gallery figcaption { font-size: .85rem; color: var(--muted); margin-top: 8px; white-space: normal; overflow-wrap: break-word; max-width: 100%; }
.work-gallery figure, .work-item, .work-gallery__smalls { max-width: 100%; min-width: 0; }
.review-grid { display: grid; gap: 18px; margin-top: 8px; }
@media (min-width: 760px) { .review-grid { grid-template-columns: 1fr 1fr; } }
.review-grid .customer-review { min-width: 0; }
.review-grid .customer-review blockquote { max-height: none; overflow: visible; }

.showcase-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px 28px;
}
.showcase-head .section-head { margin: 0; flex: 1 1 28rem; max-width: 46rem; }
.showcase-head .btn { flex: none; }
.showcase-grid { margin-top: 22px; }
.showcase-grid--portraits { grid-template-columns: 1fr; }
@media (min-width: 700px) {
  .showcase-grid--portraits { grid-template-columns: repeat(2, 1fr); }
}
.sector-card-heading {
  font-family: var(--font-display);
  font-size: 1.25rem;
  margin: 0 0 8px;
}

.page-404 { padding: 72px 0 96px; text-align: center; }
.page-404 h1 { margin-bottom: 14px; }
.page-404 p { color: var(--muted); max-width: 32rem; margin: 0 auto 28px; }

.warranty-note {
  margin-top: 20px;
  padding: 18px 20px;
  background: var(--accent-soft);
  border-left: 4px solid var(--accent);
  border-radius: 0 12px 12px 0;
}
.warranty-note strong { color: var(--brown-800); }

/* Header logo already sits on a brown chip via shared CSS. */

@media (max-width: 759px) {
  html.has-call body { padding-bottom: 80px; }
}

/* Commercial-first homepage: lead card is full width, then repair + residential. */
.sector-grid--lead { display: grid; gap: 18px; list-style: none; padding: 0; margin: 0; }
@media (min-width: 860px) {
  .sector-grid--lead { grid-template-columns: 1fr 1fr; }
  .sector-grid--lead > li:first-child { grid-column: 1 / -1; }
}
.sector-card--lead { padding: 32px 28px; border-width: 2px; border-color: var(--brown-800); }
.sector-card--lead h3 { font-size: 1.55rem; }
.sector-card--lead p { font-size: 1.02rem; max-width: 52rem; }

@media (min-width: 700px) {
  .operator-grid--four { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1000px) {
  .operator-grid--four { grid-template-columns: repeat(4, 1fr); }
}

/* Long license line should wrap on small screens; keep the number together. */
.license-lines li { white-space: normal; }
.license-num { white-space: nowrap; }

.call-block {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg, 16px);
  padding: 24px;
  box-shadow: var(--shadow, 0 2px 10px rgba(0,0,0,.06));
}
.call-block h2 { margin: 0; }
.call-block__number {
  margin: 12px 0 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(1.6rem, 5vw, 2.15rem);
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
}
.call-block__number a {
  color: var(--brown-800);
  text-decoration: none;
}
.call-block__number a:hover, .call-block__number a:focus-visible {
  color: var(--accent-600, #8a5a1c);
  text-decoration: underline;
}
.call-block .stack-ctas { margin-top: 20px; }

/* Compact license list in the footer and the About trust card. */
.site-footer .license-lines { margin-top: 14px; }
.site-footer .license-lines ul {
  display: grid;
  gap: 1px;
  font-size: .78rem;
  line-height: 1.4;
  color: rgba(255,255,255,.8);
}
.site-footer .license-lines li { white-space: normal; }
.site-footer .license-lines li:first-child {
  color: #fff;
  font-weight: 600;
  font-size: .88rem;
  margin-bottom: 5px;
}
.trust-licenses {
  gap: 2px;
  font-size: .86rem;
  line-height: 1.4;
}

/* Compact all-photos grid on the homepage, and fuller project galleries on service pages. */
.job-photos-grid {
  display: grid;
  gap: 12px;
  margin-top: 22px;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 700px) { .job-photos-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media (min-width: 1000px) { .job-photos-grid { grid-template-columns: repeat(4, 1fr); } }
.job-photos-grid figure { margin: 0; min-width: 0; }
.job-photos-grid img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--cream-2);
}
.job-photos-grid .work-item--small img.job-04 { max-width: 600px; }
.job-photos-grid .work-item--small img.job-05 { max-width: 474px; }

.project-gallery {
  display: grid;
  gap: 18px;
  margin-top: 22px;
  grid-template-columns: 1fr;
}
@media (min-width: 700px) { .project-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .project-gallery { grid-template-columns: repeat(3, 1fr); } }
.project-gallery figure { margin: 0; min-width: 0; }
.project-gallery img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--cream-2);
}
.project-gallery .work-item--small { align-self: start; }
.project-gallery .work-item--small img {
  aspect-ratio: auto;
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.project-gallery .work-item--small img.job-04 { max-width: 600px; }
.project-gallery .work-item--small img.job-05 { max-width: 474px; }
.project-gallery figcaption { font-size: .85rem; color: var(--muted); margin-top: 8px; white-space: normal; overflow-wrap: break-word; }

/* Screen-reader-only captions: available to assistive tech and crawlers, not shown on screen. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.not-working-list {
  display: grid;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 8px 0 28px;
  max-width: 46rem;
}
@media (min-width: 700px) {
  .not-working-list { grid-template-columns: 1fr 1fr; }
}
.not-working-list li {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  font-weight: 600;
  color: var(--brown-800);
}

/* Homepage: three large stacked service buttons. */
.home-paths {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 42rem;
  margin: 0 auto;
}
.home-path {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 28px;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2.6vw, 1.65rem);
  font-weight: 800;
  line-height: 1.2;
  color: #fff;
  background: var(--brown-800);
  border-radius: 16px;
  text-decoration: none;
  box-shadow: var(--shadow, 0 2px 10px rgba(0,0,0,.06));
}
.home-path:hover, .home-path:focus-visible {
  background: var(--accent-600, #8a5a1c);
  color: #fff;
  text-decoration: none;
}