:root {
      --primary: #894a55;
      --primary-dark: #63333c;
      --silver: #c0c0c0;
      --white: #ffffff;
      --ink: #241b1e;
      --muted: #695e62;
      --line: #dedede;
      --soft: #f6f6f6;
      --coast: #355d63;
      --shadow: 0 18px 50px rgba(36, 27, 30, .16);
      --radius: 8px;
      --max: 1180px;
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      color: var(--ink);
      background: var(--white);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.6;
    }

    img {
      display: block;
      width: 100%;
      height: auto;
    }

    a {
      color: inherit;
    }

    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible {
      outline: 3px solid rgba(137, 74, 85, .45);
      outline-offset: 3px;
    }

    .skip-link {
      position: absolute;
      top: .75rem;
      left: .75rem;
      z-index: 20;
      padding: .65rem .9rem;
      color: var(--white);
      background: var(--primary-dark);
      border-radius: var(--radius);
      transform: translateY(-140%);
      transition: transform .2s ease;
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 10;
      background: rgba(255, 255, 255, .96);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(14px);
    }

    .nav-wrap {
      width: min(100% - 2rem, var(--max));
      margin: 0 auto;
      padding: .85rem 0;
      display: flex;
      flex-direction: column;
      gap: .75rem;
      align-items: stretch;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: .7rem;
      text-decoration: none;
      font-weight: 800;
      letter-spacing: 0;
    }

    .brand-mark {
      width: 2.55rem;
      height: 2.55rem;
      display: grid;
      place-items: center;
      color: var(--white);
      background: var(--primary);
      border: 2px solid var(--primary-dark);
      border-radius: 50%;
      font-weight: 900;
      box-shadow: inset 0 -5px 0 rgba(0, 0, 0, .08);
    }

    .brand small {
      display: block;
      color: var(--muted);
      font-weight: 650;
      font-size: .75rem;
    }

    .nav-links {
      display: flex;
      flex-wrap: wrap;
      gap: .45rem;
      align-items: center;
    }

    .nav-links a {
      min-height: 2.6rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: .55rem .7rem;
      color: var(--muted);
      text-decoration: none;
      font-weight: 700;
      border-radius: var(--radius);
    }

    .nav-links a:hover {
      color: var(--primary);
      background: var(--soft);
    }

    .nav-links .call-link {
      color: var(--primary-dark);
      background: #f1e8ea;
    }

    .button {
      min-height: 3rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: .55rem;
      padding: .8rem 1rem;
      border: 0;
      border-radius: var(--radius);
      color: var(--white);
      background: var(--primary);
      font-weight: 800;
      text-decoration: none;
      cursor: pointer;
      box-shadow: 0 12px 24px rgba(137, 74, 85, .26);
      transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .button:hover {
      background: var(--primary-dark);
      transform: translateY(-1px);
      box-shadow: 0 16px 28px rgba(99, 51, 60, .26);
    }

    .button.secondary {
      color: var(--primary-dark);
      background: var(--white);
      border: 1px solid rgba(137, 74, 85, .25);
      box-shadow: none;
    }

    .hero {
      position: relative;
      min-height: 34rem;
      display: grid;
      align-items: end;
      overflow: hidden;
      color: var(--white);
      background: #2c2424;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(90deg, rgba(36, 27, 30, .91) 0%, rgba(36, 27, 30, .74) 44%, rgba(36, 27, 30, .22) 100%),
        linear-gradient(0deg, rgba(36, 27, 30, .62), rgba(36, 27, 30, .1)),
        url("images/hero.jpg");
      background-size: cover;
      background-position: 58% center;
    }

    .hero-inner {
      position: relative;
      width: min(100% - 2rem, var(--max));
      margin: 0 auto;
      padding: 3.25rem 0 2rem;
      display: grid;
      gap: 2rem;
    }

    .eyebrow {
      display: inline-flex;
      width: fit-content;
      align-items: center;
      gap: .55rem;
      padding: .42rem .68rem;
      color: var(--white);
      background: rgba(137, 74, 85, .86);
      border: 1px solid rgba(255, 255, 255, .24);
      border-radius: 999px;
      font-size: .82rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .06em;
    }

    .hero h1 {
      max-width: 12ch;
      margin: .85rem 0 1rem;
      font-size: 3.1rem;
      line-height: 1.04;
      letter-spacing: 0;
    }

    .hero p {
      max-width: 40rem;
      margin: 0;
      color: rgba(255, 255, 255, .91);
      font-size: 1.15rem;
    }

    .hero-actions {
      margin-top: 1.55rem;
      display: flex;
      flex-direction: column;
      gap: .8rem;
      align-items: stretch;
      max-width: 28rem;
    }

    .hero .phone-strip {
      display: flex;
      flex-wrap: wrap;
      gap: .7rem;
      align-items: center;
      color: rgba(255, 255, 255, .94);
      font-weight: 800;
    }

    .phone-strip a {
      color: var(--white);
      text-decoration-thickness: .12rem;
      text-underline-offset: .22rem;
    }

    .hero-proof {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: .65rem;
      margin-top: 1.6rem;
      max-width: 38rem;
    }

    .proof-item {
      padding: .8rem;
      background: rgba(255, 255, 255, .12);
      border: 1px solid rgba(255, 255, 255, .2);
      border-radius: var(--radius);
    }

    .proof-item strong {
      display: block;
      color: var(--white);
      line-height: 1.25;
    }

    .proof-item span {
      display: block;
      color: rgba(255, 255, 255, .78);
      font-size: .88rem;
    }

    main > section {
      padding: 4rem 0;
    }

    .container {
      width: min(100% - 2rem, var(--max));
      margin: 0 auto;
    }

    .section-head {
      display: grid;
      gap: .65rem;
      margin-bottom: 1.65rem;
    }

    .section-label {
      color: var(--primary);
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .07em;
      font-size: .79rem;
    }

    h2 {
      margin: 0;
      color: var(--ink);
      font-size: 2rem;
      line-height: 1.16;
      letter-spacing: 0;
    }

    h3 {
      margin: 0;
      color: var(--ink);
      font-size: 1.16rem;
      line-height: 1.25;
    }

    .lead {
      max-width: 45rem;
      margin: 0;
      color: var(--muted);
      font-size: 1.05rem;
    }

    .services-grid {
      display: grid;
      gap: 1rem;
    }

    .service-card {
      padding: 1.2rem;
      background: var(--white);
      border: 1px solid var(--line);
      border-top: 5px solid var(--primary);
      border-radius: var(--radius);
      box-shadow: 0 10px 28px rgba(36, 27, 30, .06);
    }

    .service-card p {
      margin: .55rem 0 0;
      color: var(--muted);
    }

    .service-icon {
      width: 2.65rem;
      height: 2.65rem;
      margin-bottom: .85rem;
      display: grid;
      place-items: center;
      color: var(--primary-dark);
      background: #f2e8ea;
      border-radius: 50%;
      font-weight: 900;
      font-size: 1.15rem;
    }

    .feature-band {
      background: var(--soft);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .split {
      display: grid;
      gap: 1.5rem;
      align-items: center;
    }

    .about-copy p {
      margin: 0 0 1rem;
      color: var(--muted);
    }

    .about-list {
      display: grid;
      gap: .65rem;
      padding: 0;
      margin: 1.2rem 0 0;
      list-style: none;
    }

    .about-list li {
      display: flex;
      gap: .65rem;
      align-items: flex-start;
      color: var(--ink);
      font-weight: 700;
    }

    .check {
      flex: 0 0 auto;
      width: 1.45rem;
      height: 1.45rem;
      display: grid;
      place-items: center;
      color: var(--white);
      background: var(--coast);
      border-radius: 50%;
      font-size: .85rem;
      line-height: 1;
    }

    .image-panel {
      overflow: hidden;
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      background: var(--silver);
    }

    .image-panel img {
      aspect-ratio: 4 / 3;
      height: 100%;
      object-fit: cover;
    }

    .trust-grid {
      display: grid;
      gap: 1rem;
    }

    .trust-card,
    .testimonial {
      padding: 1.2rem;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--white);
    }

    .trust-card strong {
      display: block;
      color: var(--primary-dark);
      font-size: 1.45rem;
      line-height: 1.1;
    }

    .trust-card span {
      display: block;
      margin-top: .35rem;
      color: var(--muted);
      font-weight: 700;
    }

    .testimonial {
      display: grid;
      gap: 1rem;
      background: #fbfbfb;
    }

    .testimonial p {
      margin: 0;
      color: var(--ink);
      font-size: 1.05rem;
    }

    .testimonial cite {
      color: var(--primary-dark);
      font-style: normal;
      font-weight: 800;
    }

    .stars {
      color: var(--primary);
      letter-spacing: .08em;
      font-size: 1.05rem;
    }

    .gallery-grid {
      display: grid;
      gap: .85rem;
    }

    .gallery-item {
      position: relative;
      overflow: hidden;
      min-height: 15rem;
      border-radius: var(--radius);
      background: var(--silver);
    }

    .gallery-item img {
      height: 100%;
      min-height: 15rem;
      object-fit: cover;
    }

    .gallery-item figcaption {
      position: absolute;
      left: .75rem;
      bottom: .75rem;
      max-width: calc(100% - 1.5rem);
      padding: .45rem .65rem;
      color: var(--white);
      background: rgba(36, 27, 30, .78);
      border-radius: var(--radius);
      font-weight: 800;
      font-size: .88rem;
    }

    .area {
      background: var(--primary);
      color: var(--white);
    }

    .area h2,
    .area .section-label {
      color: var(--white);
    }

    .area .lead {
      color: rgba(255, 255, 255, .88);
    }

    .area-grid {
      display: grid;
      gap: 1rem;
      margin-top: 1.5rem;
    }

    .area-pill {
      padding: 1rem;
      color: var(--white);
      border: 1px solid rgba(255, 255, 255, .26);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, .1);
      font-weight: 800;
    }

    .contact-wrap {
      display: grid;
      gap: 1.3rem;
      align-items: start;
    }

    .contact-card {
      padding: 1.2rem;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--white);
      box-shadow: 0 12px 30px rgba(36, 27, 30, .08);
    }

    .contact-list {
      display: grid;
      gap: .85rem;
      padding: 0;
      margin: 1rem 0 0;
      list-style: none;
    }

    .contact-list li {
      display: grid;
      gap: .1rem;
    }

    .contact-list span {
      color: var(--muted);
      font-size: .88rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .05em;
    }

    .contact-list a,
    .contact-list address,
    .contact-list strong {
      color: var(--ink);
      font-style: normal;
      font-weight: 750;
    }

    form {
      display: grid;
      gap: .85rem;
    }

    .form-grid {
      display: grid;
      gap: .85rem;
    }

    label {
      display: grid;
      gap: .35rem;
      color: var(--ink);
      font-weight: 800;
    }

    input,
    select,
    textarea {
      width: 100%;
      min-height: 3rem;
      padding: .78rem .85rem;
      color: var(--ink);
      background: var(--white);
      border: 1px solid #b8b8b8;
      border-radius: var(--radius);
      font: inherit;
    }

    textarea {
      min-height: 8rem;
      resize: vertical;
    }

    .form-note {
      margin: 0;
      color: var(--muted);
      font-size: .9rem;
    }

    .form-status {
      min-height: 1.5rem;
      margin: 0;
      color: var(--primary-dark);
      font-weight: 800;
    }

    .site-footer {
      color: rgba(255, 255, 255, .86);
      background: #241b1e;
      padding: 2rem 0;
    }

    .footer-grid {
      width: min(100% - 2rem, var(--max));
      margin: 0 auto;
      display: grid;
      gap: 1rem;
    }

    .footer-grid strong {
      display: block;
      color: var(--white);
      font-size: 1.1rem;
    }

    .footer-grid a {
      color: var(--white);
    }

    .fine-print {
      margin: 0;
      color: rgba(255, 255, 255, .66);
      font-size: .9rem;
    }

    @media (min-width: 640px) {
      .nav-wrap {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
      }

      .nav-links {
        justify-content: flex-end;
      }

      .hero-actions {
        flex-direction: row;
        align-items: center;
        max-width: none;
      }

      .hero-proof {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }

      .services-grid,
      .trust-grid,
      .area-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }

      .form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .footer-grid {
        grid-template-columns: 1.2fr 1fr 1fr;
        align-items: start;
      }
    }

    @media (min-width: 880px) {
      .hero {
        min-height: 36.5rem;
      }

      .hero h1 {
        font-size: 4rem;
      }

      h2 {
        font-size: 2.55rem;
      }

      .services-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }

      .split,
      .contact-wrap {
        grid-template-columns: 1fr .86fr;
      }

      .split.reverse {
        grid-template-columns: .82fr 1fr;
      }

      .split.reverse .image-panel {
        order: -1;
      }

      .trust-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }

      .testimonial {
        grid-column: span 2;
      }

      .contact-wrap {
        gap: 2rem;
      }
    }

    @media (max-width: 430px) {
      .nav-links a {
        flex: 1 1 calc(50% - .45rem);
      }

      .nav-links .call-link {
        flex-basis: 100%;
      }

      .hero {
        min-height: 34rem;
      }

      .hero h1 {
        font-size: 2.35rem;
      }

      .hero-proof {
        display: none;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        scroll-behavior: auto !important;
        transition: none !important;
      }
    }
