#dashboard {
  font-size:16px;
}

#dashboard .dashboard-head p,
#dashboard .demo-notice,
#dashboard .lead-project,
#dashboard .stats span {
  color:#31475c;
}

#dashboard .dashboard-head p {
  font-size:14px;
  line-height:1.5;
}

#dashboard .demo-notice {
  font-size:13px;
  line-height:1.5;
}

#dashboard .stats span {
  font-size:13px;
  line-height:1.4;
}

#dashboard .filter {
  font-size:14px;
  font-weight:700;
}

#dashboard .lead-list {
  gap:18px;
}

#dashboard .lead-top {
  padding:20px 18px 16px;
}

#dashboard .lead-name {
  min-height:0;
  padding:0;
  font-size:20px;
  line-height:1.3;
  font-weight:750;
}

#dashboard .lead-project {
  margin-top:8px;
  font-size:14px;
  line-height:1.55;
}

#dashboard .status-wrap span {
  font-size:11px;
  line-height:1.25;
  font-weight:750;
}

#dashboard .status-select {
  font-size:14px;
  font-weight:700;
}

#dashboard .quick-actions {
  gap:10px;
  padding:0 18px 16px;
}

#dashboard .quick-actions a {
  flex:0 0 auto;
  min-width:86px;
  min-height:42px;
  padding:0 18px;
  font-size:14px;
  font-weight:700;
}

#dashboard .view-details {
  font-size:14px;
  font-weight:700;
}

/* Demo-wide polish: stronger contrast and a real painting-company brand lockup. */
:root {
  --text:#172638;
  --muted:#33495f;
  --line:#bcc9d6;
}

.business-brand {
  width:auto;
  max-width:100%;
  gap:14px;
  margin:0 0 22px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.brand-mark {
  position:relative;
  display:block;
  width:72px;
  height:58px;
  flex:0 0 72px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:transparent;
  font-size:0;
  line-height:0;
  text-shadow:none;
}

.brand-mark::before {
  content:"";
  position:absolute;
  inset:0;
  background:center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 58'%3E%3Cpath d='M8 24 36 5l28 19' fill='none' stroke='%23172f47' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='14' y='27' width='40' height='12' rx='6' fill='%234f739d'/%3E%3Crect x='19' y='30' width='25' height='3' rx='1.5' fill='%238eb0cf' opacity='.75'/%3E%3Ccircle cx='49' cy='33' r='3.5' fill='%23e1bf6b'/%3E%3Cpath d='M54 33h6v9c0 5-4 9-9 9h-8' fill='none' stroke='%23172f47' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  filter:drop-shadow(0 5px 8px rgba(31,65,96,.14));
}

.brand-mark::after {
  content:none;
}

.business-brand>div {
  padding-top:0;
}

.business-brand>div>strong {
  color:#10263a;
  font-size:21px;
  font-weight:850;
  letter-spacing:-.035em;
  line-height:1.08;
}

.business-brand>div>span {
  color:#344b60;
  margin-top:5px;
  font-size:13px;
  font-weight:750;
  letter-spacing:.02em;
  line-height:1.25;
}

.customer-hero p,
.form-help,
.demo-notice,
.upload p,
.hero p,
.intro,
.value-card p,
.feature span,
.package p,
.package li,
.steps span,
.faq-section details p,
.why-row span {
  color:#33495f;
}

.success p {
  color:#395847;
}

/* Keep the modal close control reachable while long lead details scroll. */
.lead-dialog {
  max-height:calc(100dvh - 24px);
  overflow:auto;
  overscroll-behavior:contain;
}

.lead-dialog .close {
  position:sticky;
  top:0;
  z-index:20;
  float:right;
  margin:0 0 10px 12px;
  background:#f7fafc;
  border:2px solid #355b7f;
  box-shadow:0 5px 14px rgba(23,38,56,.12);
  cursor:pointer;
}

/* Make demo photo uploads look like actual visual previews instead of filenames. */
.photo-detail {
  padding:14px;
}

.customer-photo-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}

.customer-photo {
  margin:0;
  overflow:hidden;
  border:1px solid #cbd7e1;
  border-radius:12px;
  background:#fff;
}

.customer-photo-art {
  aspect-ratio:16/10;
  overflow:hidden;
  background:#dfe7ee;
}

.customer-photo-art svg {
  display:block;
  width:100%;
  height:100%;
}

.customer-photo figcaption {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:8px 9px;
}

.customer-photo figcaption span {
  margin:0;
  color:#22384c;
  font-size:12px;
  font-weight:800;
  line-height:1.2;
}

.customer-photo figcaption small {
  flex:0 0 auto;
  color:#68798a;
  font-size:9px;
  font-weight:800;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.no-photos {
  margin-top:7px!important;
  color:#53677a;
}

/* Headings receive programmatic focus after view changes; suppress the non-interactive focus box. */
.view h1[tabindex="-1"]:focus {
  outline:none;
}

@media (max-width:640px) {
  /* Keep the demo label visually separate from the three actual navigation buttons. */
  .demo-nav .nav-inner {
    display:grid;
    grid-template-columns:1fr;
    gap:3px;
    min-height:0;
    padding:5px 0 6px;
  }

  .demo-nav .demo-label {
    display:block;
    width:max-content;
    margin:0 auto;
    padding:0;
    border:0;
    background:transparent;
    color:#806c43;
    font-size:7px;
    font-weight:900;
    line-height:1;
    letter-spacing:.18em;
    white-space:nowrap;
    pointer-events:none;
  }

  .demo-nav nav {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
  }

  .demo-nav .nav-btn {
    min-height:34px;
    padding:5px 3px;
    border-radius:9px;
    font-size:9px;
    line-height:1.05;
    white-space:nowrap;
  }

  #dashboard .lead-list {
    gap:16px;
  }

  #dashboard .lead-top {
    gap:14px;
    padding:18px 16px 14px;
  }

  #dashboard .lead-name {
    font-size:19px;
  }

  #dashboard .quick-actions {
    padding:0 16px 14px;
  }

  #dashboard .quick-actions a {
    min-width:78px;
    padding:0 16px;
  }

  .business-brand {
    gap:11px;
    margin-bottom:20px;
  }

  .brand-mark {
    width:62px;
    height:50px;
    flex-basis:62px;
  }

  .business-brand>div>strong {
    font-size:19px;
  }

  .business-brand>div>span {
    margin-top:4px;
    font-size:12px;
  }

  .lead-dialog {
    width:calc(100% - 20px);
    max-height:calc(100dvh - 18px);
    padding:18px;
  }

  .lead-dialog .close {
    width:42px;
    height:42px;
  }

  .customer-photo-grid {
    gap:8px;
  }

  .customer-photo figcaption {
    display:block;
  }

  .customer-photo figcaption small {
    display:block;
    margin-top:3px;
  }
}

@media (max-width:380px) {
  .demo-nav .nav-btn {
    font-size:8px;
    padding-inline:2px;
  }
}

/* Unified three-view demo navigation: matches the shared Owner Dashboard. */
.demo-nav {
  background:#eedb9a;
  border-bottom:1px solid #d4b967;
}

.demo-nav .nav-inner {
  width:min(1180px,calc(100% - 32px));
  min-height:50px;
}

.demo-nav .demo-label {
  margin:0;
  color:#5b4d2d;
  font-size:.72rem;
  font-weight:900;
  line-height:normal;
  letter-spacing:.09em;
}

.demo-nav nav {
  display:flex;
  gap:6px;
  overflow:auto;
  scrollbar-width:none;
}

.demo-nav .nav-btn {
  min-height:auto;
  padding:7px 11px;
  border:1px solid rgba(91,77,45,.24);
  border-radius:999px;
  background:#fff8e6;
  color:#5b4d2d;
  font-size:.78rem;
  font-weight:800;
  line-height:normal;
  white-space:nowrap;
}

.demo-nav .nav-btn.active {
  background:#2f4135;
  border-color:#2f4135;
  color:#fff;
}

@media (max-width:650px) {
  .demo-nav .nav-inner {
    width:min(100% - 20px,1180px);
    display:block;
    min-height:0;
    padding:8px 0;
  }

  .demo-nav .demo-label {
    width:auto;
    margin:0 0 6px;
    font-size:.72rem;
    line-height:normal;
    letter-spacing:.09em;
  }

  .demo-nav nav {
    display:flex;
    gap:6px;
    overflow:auto;
  }

  .demo-nav .nav-btn {
    min-height:auto;
    padding:7px 11px;
    border-radius:999px;
    font-size:.78rem;
    line-height:normal;
  }
}