/* Public site only. Shared brand tokens and portal/admin typography stay in brand.css. */
.public-site { background: white; font-size: 17px; line-height: 1.6; padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
.public-site .content { max-width: 1264px; padding-inline: var(--space-20); }
.public-site h1, .public-site h2 { font-weight: 500; letter-spacing: -.01em; }
.public-site h1 { font-size: 44px; line-height: 1.08; }
.public-site h2 { font-size: 32px; margin-bottom: var(--space-24); }
.public-site h3 { font-size: 18px; }
.public-site p { max-width: 62ch; }
.public-site a, .public-site summary { min-width: 44px; min-height: 44px; }
.public-site a:not(.button) { display: inline-flex; align-items: center; }
.public-site :is(a,button,input,select,textarea,summary):focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; }
.public-site :is(.hero,.navy,.site-footer) :is(a,button):focus-visible { outline-color: var(--blue-on-navy); }
.public-site .button { min-height: 48px; height: auto; padding-block: var(--space-12); transition: color 160ms var(--ease), background 160ms var(--ease), border-color 160ms var(--ease); }
.public-site .button:active { transform: none; }
.public-site img { display: block; }
.public-site .skip-link { position: fixed; z-index: 50; top: var(--space-8); left: var(--space-20); background: white; padding: var(--space-12); transform: translateY(-200%); }
.public-site .skip-link:focus { transform: none; }
.site-header { position: sticky; top: 0; z-index: 10; height: 64px; background: white; border-bottom: 1px solid transparent; }
.site-header .wordmark { height: 38px; width: auto; aspect-ratio: 236/56; }
.site-header.is-scrolled { border-bottom-color: var(--line); }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--space-20); }
.brand-link { text-decoration: none; flex-shrink: 0; }
.site-nav { display: flex; align-items: center; gap: var(--space-20); }
.site-links, .header-phone, .desktop-quote { display: none !important; }
.mobile-quote { display: inline; }
.hero { position: relative; display: flex; align-items: flex-end; min-height: 560px; color: white; }
.hero-photo, .hero-overlay { position: absolute; inset: 0; }
.hero-photo { width: 100%; height: 100%; }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.hero-overlay { background: linear-gradient(0deg, rgba(23,35,58,.96) 0%, rgba(23,35,58,.88) 42%, rgba(23,35,58,.45) 78%, rgba(23,35,58,.1)); }
.hero-content { position: relative; padding-block: var(--space-48); }
.hero-text { max-width: 580px; }
.hero .eyebrow { color: white; font-size: 11px; }
.hero-text > p:not(.eyebrow) { color: rgba(255,255,255,.94); max-width: 46ch; }
.hero-buttons { display: flex; gap: var(--space-12); flex-wrap: wrap; margin-top: var(--space-24); }
.hero .secondary { color: white; border-color: white; }
.hero .secondary:hover { background: rgba(255,255,255,.1); }
.hero-ticks { list-style: none; margin: var(--space-24) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-8) var(--space-16); font-size: 15px; color: rgba(255,255,255,.9); }
.hero-ticks li::before { content: "✓"; margin-right: var(--space-8); }
.trust-strip { padding-block: var(--space-32); border-bottom: 1px solid var(--line); }
.trust-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-32) var(--space-20); }
.trust-item { display: flex; flex-direction: column; gap: var(--space-12); }
.trust-item > svg { color: var(--blue); flex-shrink: 0; }
.trust-item .trust-title { font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--ink); margin-bottom: var(--space-8); }
.trust-item p { font-size: 15px; color: var(--ink-muted); margin: 0; }
.site-section { padding-block: var(--space-72); scroll-margin-top: 80px; }
.heather { background: var(--stone); }
.navy { background: var(--navy); color: white; }
.navy .eyebrow { color: var(--blue-on-navy); }
.section-intro { margin-bottom: var(--space-32); color: var(--ink-muted); }
.work-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-16); }
.work-tile { margin: 0; min-width: 0; }
.work-tile:first-child { grid-column: 1/-1; }
.work-tile picture { display: block; aspect-ratio: 4/3; border-radius: var(--radius); overflow: hidden; background: var(--line); }
.work-tile img { width: 100%; height: 100%; object-fit: cover; }
.work-tile figcaption { padding-top: var(--space-12); font-size: 15px; line-height: 1.5; }
.work-tile figcaption span { color: var(--ink-muted); }
.services-grid { display: grid; gap: var(--space-16); }
.service-card { background: white; border-radius: var(--radius); padding: var(--space-24); }
.service-card p { color: var(--ink-muted); margin: 0; }
.also-services { margin: var(--space-24) 0 0; color: var(--ink-muted); }
.process-layout { display: grid; gap: var(--space-32); align-items: center; }
.process-steps { list-style: none; margin: var(--space-32) 0 0; padding: 0; display: grid; gap: var(--space-32); }
.process-step { position: relative; }
.step-number { display: grid; place-items: center; width: 44px; height: 44px; background: white; color: var(--blue-text); border: 1px solid var(--line); border-radius: 999px; font: 500 24px/1 var(--serif); margin-bottom: var(--space-20); position: relative; z-index: 1; }
.process-step p { color: var(--ink-muted); margin: 0; }
.detail-photo { display: block; aspect-ratio: 16/9; background: var(--line); border-radius: var(--radius); overflow: hidden; }
.detail-photo img { width: 100%; height: 100%; object-fit: cover; }
.rating { display: flex; align-items: center; gap: var(--space-12); margin-bottom: var(--space-32); }
.stars { display: inline-flex; gap: var(--space-4); color: #c9a46a; flex-shrink: 0; }
.reviews-grid { display: grid; gap: var(--space-16); }
.review-card { background: white; color: var(--ink); border-radius: var(--radius); padding: var(--space-24); margin: 0; display: flex; flex-direction: column; align-items: flex-start; }
.review-card blockquote { margin: var(--space-20) 0 var(--space-24); }
.review-card blockquote p { margin: 0; }
.review-card figcaption { font-size: 14px; color: var(--ink-muted); margin-top: auto; }
.town-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-16) var(--space-20); }
.area-question { margin: var(--space-24) 0 0; }
.faq-content { max-width: 760px; }
.faq-content details { border-bottom: 1px solid var(--line); }
.faq-content summary { font-weight: 600; cursor: pointer; padding: var(--space-20) var(--space-4); }
.faq-content details p { color: var(--ink-muted); margin-bottom: var(--space-24); }
#quote { position: relative; }
.contact-anchor { position: absolute; top: 0; scroll-margin-top: 80px; }
.quote-layout { display: grid; gap: var(--space-32); align-items: start; }
.quote-copy > p { color: rgba(255,255,255,.9); }
.quote-copy a { color: white; text-decoration: none; }
.quote-copy a:hover { text-decoration: underline; }
.quote-phone { font: 500 32px/1.3 var(--serif); margin-top: var(--space-24); }
.quote-location { margin: var(--space-16) 0 0; }
.quote-card { background: white; border-radius: var(--radius); padding: var(--space-24); color: var(--ink); }
.quote-fields { display: grid; gap: var(--space-20); }
.quote-fields label { font-size: 15px; font-weight: 600; margin-bottom: var(--space-8); }
.quote-fields :is(input,select,textarea) { width: 100%; font: 400 16px/1.6 var(--sans); min-height: 48px; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: var(--space-12); background: white; color: var(--ink); }
.quote-fields [aria-invalid="true"] { border-color: var(--danger); }
.field-error { font-size: 14px; color: var(--danger); margin: var(--space-8) 0 0; }
.quote-submit { margin-top: var(--space-24); width: 100%; }
.privacy-note { font-size: 13px; color: var(--ink-muted); margin: var(--space-12) 0 0; text-align: center; }
.quote-success { padding-block: var(--space-48); }
.quote-success h3 { font: 500 32px/1.2 var(--serif); }
.quote-success p { margin: 0; }
.site-footer { background: var(--ink); color: rgba(255,255,255,.75); padding-block: var(--space-48) var(--space-24); font-size: 14px; }
.site-footer a { color: rgba(255,255,255,.85); text-decoration: none; }
.site-footer a:hover { color: white; text-decoration: underline; }
.footer-top { display: grid; gap: var(--space-24); }
.footer-top p { margin: var(--space-16) 0 0; max-width: 32ch; }
.footer-contact { display: flex; flex-direction: column; align-items: flex-start; }
.footer-top nav { display: flex; flex-wrap: wrap; gap: 0 var(--space-20); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); margin-top: var(--space-32); padding-top: var(--space-16); display: flex; justify-content: space-between; align-items: center; gap: var(--space-20); }
.footer-bottom a { font-size: 13px; color: rgba(255,255,255,.65); }
.phone-call-bar { position: fixed; z-index: 15; bottom: 0; left: 0; right: 0; background: white; border-top: 1px solid var(--line); padding: var(--space-12) var(--space-20) calc(var(--space-12) + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-12); }
.reveal.is-pending { opacity: 0; transform: translateY(12px); }
.reveal { transition: opacity 400ms var(--ease), transform 400ms var(--ease); }
.hero-eyebrow-phone { display: none; }
@media (width < 480px) {
  .trust-grid { grid-template-columns: minmax(0,1fr); gap: var(--space-20); }
  .trust-item { flex-direction: row; gap: var(--space-16); }
  .trust-item > svg { width: 24px; height: 24px; }
}
@media (width < 768px) {
  .hero { min-height: 640px; display: grid; grid-template-rows: 45fr 55fr; background: var(--ink); }
  /* Keep the hood and island above the copy, fading the photo into its navy base. */
  .hero-photo { height: 70%; mask-image: linear-gradient(#000 50%,transparent); }
  .hero-photo img { object-position: 60% top; }
  .hero-overlay { background: linear-gradient(180deg,rgba(23,35,58,.10) 0%,rgba(23,35,58,.55) 45%,rgba(23,35,58,.94) 100%); }
  .hero-content { grid-row: 2; width: 100%; padding-block: 0 var(--space-32); }
  .hero .eyebrow { margin-bottom: var(--space-12); }
  .hero-eyebrow-phone { display: inline; white-space: nowrap; }
  .hero-eyebrow-desktop { display: none; }
}
@media (width >= 768px) {
  .site-header { height: 72px; }
  .public-site { padding-bottom: 0; }
  .public-site .content { padding-inline: var(--space-32); }
  .trust-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-24); }
  .services-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .process-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-24); }
  .process-step:not(:last-child)::after { content: ""; position: absolute; top: 22px; left: 44px; right: calc(-1 * var(--space-24)); height: 1px; background: var(--line); }
  .town-list { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .quote-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-field { grid-column: 1/-1; }
  .phone-call-bar { display: none; }
  .footer-top { grid-template-columns: 1.5fr 1fr 1fr; gap: var(--space-48); }
}
@media (width >= 1024px) {
  .site-header .wordmark { height: 44px; }
  .public-site h1 { font-size: 64px; }
  .public-site h2 { font-size: 44px; }
  .site-section { padding-block: var(--space-112); }
  .site-links { display: flex !important; gap: var(--space-20); }
  .site-links a { color: var(--ink); font-size: 15px; font-weight: 500; text-decoration: none; }
  .site-links a:hover { color: var(--blue-text); }
  .header-phone { display: inline-flex !important; gap: var(--space-8); color: var(--ink); font-size: 15px; text-decoration: none; white-space: nowrap; }
  .header-phone svg { width: 20px; height: 20px; }
  .desktop-quote { display: inline !important; }
  .mobile-quote { display: none; }
  .hero { min-height: 680px; align-items: center; }
  .hero-photo img { object-position: center; }
  .hero-overlay { background: linear-gradient(90deg,rgba(23,35,58,.78) 0%,rgba(23,35,58,.78) 42%, transparent 70%); }
  .hero-text { max-width: 560px; }
  .hero-ticks { gap: var(--space-16); font-size: 15px; width: max-content; max-width: 100%; }
  .work-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .work-tile:first-child { grid-column: auto; }
  .process-layout { grid-template-columns: minmax(0,1fr) 320px; gap: var(--space-48); }
  .detail-photo { aspect-ratio: 4/5; }
  .reviews-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .quote-layout { grid-template-columns: 1fr 1fr; gap: var(--space-72); }
  .quote-card { padding: var(--space-32); }
}
@media (width >= 1200px) { .services-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (prefers-reduced-motion: reduce) {
  .public-site { scroll-behavior: auto; }
  .public-site *, .public-site *::before, .public-site *::after { transition: none !important; animation: none !important; }
  .reveal.is-pending { opacity: 1; transform: none; }
}
