:root {
      --orange: #f05a00;
      --orange-2: #ff7a1a;
      --orange-dark: #c94b00;
      --charcoal: #111111;
      --ink: #1a1a1a;
      --steel: #4a4a4a;
      --muted: #666666;
      --line: #dce2e8;
      --surface: #f7f7f7;
      --surface-dark: #1a1a1a;
      --white: #ffffff;
      --blue: #1877f2;
      --shadow: 0 18px 45px rgba(26, 26, 26, .16);
      --radius: 8px;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      color: var(--ink);
      background: var(--white);
      letter-spacing: 0;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: 102px; }
    body { margin: 0; font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--white); }
    img, video, iframe { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    p { margin: 0 0 1rem; color: var(--steel); }
    h1, h2, h3 { margin: 0 0 1rem; line-height: 1.05; letter-spacing: 0; color: var(--charcoal); }
    h1 { font-size: 2.55rem; max-width: 920px; }
    h2 { font-size: 2rem; }
    h3 { font-size: 1.08rem; }
    ul { margin: 0; padding: 0; }
    li { list-style: none; }
    .container { width: min(1160px, calc(100% - 36px)); margin: 0 auto; }
    .section { padding: 84px 0; position: relative; }
    .section[id] { scroll-margin-top: 102px; }
    .section-surface { background: var(--surface); }
    .section-dark { background: var(--surface-dark); color: var(--white); }
    .section-dark h2, .section-dark h3, .section-dark p, .section-dark a { color: var(--white); }
    .section-primary { background: linear-gradient(135deg, #111111 0%, #1a1a1a 62%, #4a210b 100%); color: var(--white); }
    .section-primary h2, .section-primary p { color: var(--white); }
    .skip-link { position: absolute; top: -80px; left: 16px; background: var(--charcoal); color: var(--white); padding: 10px 14px; z-index: 1000; border-radius: var(--radius); }
    .skip-link:focus { top: 16px; }

    .site-header { position: fixed; inset: 0 0 auto; z-index: 50; background: rgba(20,20,20,.97); border-bottom: 2px solid var(--orange); box-shadow: 0 10px 30px rgba(0,0,0,.18); transition: box-shadow .2s ease; }
    .site-header.is-scrolled { box-shadow: 0 10px 30px rgba(0,0,0,.24); }
    .nav-wrap { width: min(1220px, calc(100% - 28px)); margin: 0 auto; height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
    .brand { display: flex; align-items: center; gap: 12px; color: var(--white); font-weight: 800; line-height: 1.05; max-width: 290px; }
    .brand img { width: 74px; height: auto; background: rgba(255,255,255,.94); border-radius: var(--radius); padding: 4px; }
    .brand span { text-shadow: 0 1px 18px rgba(0,0,0,.28); }
    .site-nav { display: flex; align-items: center; gap: 18px; color: #cccccc; font-weight: 700; font-size: .94rem; }
    .site-nav > a, .dropdown-button { color: #cccccc; opacity: .98; }
    .site-nav > a:hover, .dropdown-button:hover, .site-nav .active { color: var(--orange-2); opacity: 1; }
    .dropdown-button { appearance: none; border: 0; background: transparent; font: inherit; cursor: pointer; padding: 12px 0; }
    .nav-dropdown { position: relative; }
    .dropdown-menu { position: absolute; top: calc(100% + 8px); left: -18px; min-width: 285px; background: var(--white); color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow); padding: 10px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: .18s ease; }
    .nav-dropdown:hover .dropdown-menu, .nav-dropdown.is-open .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
    .dropdown-link { display: block; padding: 11px 12px; border-radius: 6px; color: var(--ink); }
    .dropdown-link:hover { background: var(--surface); color: var(--orange-dark); }
    .nav-phone, .nav-facebook { display: inline-flex; align-items: center; gap: 8px; }
    .nav-phone svg, .btn svg { width: 18px; height: 18px; flex: 0 0 18px; }
    .facebook-svg { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 7px; }
    .nav-toggle { display: none; border: 0; background: rgba(255,255,255,.14); width: 44px; height: 44px; border-radius: var(--radius); padding: 10px; }
    .nav-toggle span { display: block; height: 2px; background: var(--white); margin: 5px 0; }

    .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 13px 20px; border-radius: var(--radius); font-weight: 800; border: 1px solid transparent; line-height: 1.2; transition: transform .18s ease, background .18s ease, border-color .18s ease; text-align: center; }
    .btn:hover { transform: translateY(-1px); }
    .btn-primary, .btn-small { background: var(--orange); color: var(--white); box-shadow: 0 14px 28px rgba(240,90,0,.26); }
    .btn-primary:hover, .btn-small:hover { background: var(--orange-dark); }
    .btn-small { min-height: 42px; padding: 10px 14px; }
    .btn-glass { background: rgba(255,255,255,.14); color: var(--white); border-color: rgba(255,255,255,.36); backdrop-filter: blur(8px); }
    .btn-outline { border-color: var(--line); color: var(--charcoal); background: var(--white); }
    .btn-light { background: var(--white); color: var(--charcoal); }
    .btn-outline-light { border-color: rgba(255,255,255,.42); color: var(--white); background: transparent; }
    .text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--orange-dark); font-weight: 800; }
    .text-link svg, .related-link svg { width: 18px; height: 18px; }
    .text-orange { color: var(--orange-2); }

    .hero { min-height: 720px; position: relative; display: flex; align-items: center; overflow: hidden; background: var(--charcoal); }
    .hero-page { min-height: 500px; padding-top: 82px; }
    .hero-video, .hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.9), rgba(0,0,0,.7) 52%, rgba(0,0,0,.52)); }
    .hero-content { position: relative; z-index: 1; color: var(--white); padding-top: 72px; }
    .hero h1, .hero p { color: var(--white); }
    .hero h1, .hero-text { text-shadow: 0 3px 20px rgba(0,0,0,.68); }
    .hero-page h1 { max-width: 1020px; }
    .hero-text { font-size: 1.14rem; max-width: 760px; margin-bottom: 28px; }
    .eyebrow { margin: 0 0 14px; color: var(--orange); text-transform: uppercase; font-size: .78rem; font-weight: 900; letter-spacing: 0; }
    .hero .eyebrow { color: var(--orange-2); }
    .hero-actions, .split-actions, .cta-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
    .trust-strip { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 10px; }
    .trust-strip span { background: rgba(255,255,255,.14); color: var(--white); border: 1px solid rgba(255,255,255,.22); border-radius: var(--radius); padding: 10px 12px; font-weight: 800; }

    .intro-grid, .feature-split, .quote-grid, .contact-grid, .area-grid, .included-grid, .related-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
    .feature-split.reverse img { order: -1; }
    .image-stack { position: relative; }
    .image-stack > img, .feature-split > img, .service-card img, .gallery-item img { width: 100%; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow); }
    .image-stack > img, .feature-split > img { aspect-ratio: 4 / 3; height: auto; }
    .image-badge { position: absolute; left: 18px; bottom: 18px; right: 18px; background: rgba(20,20,20,.92); color: var(--white); border-radius: var(--radius); padding: 16px; display: grid; gap: 2px; }
    .image-badge span { color: rgba(255,255,255,.82); }
    .section-heading { max-width: 820px; margin-bottom: 34px; text-align: left; }
    .section-heading p { max-width: 720px; }

    .service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
    .service-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: 0 12px 32px rgba(26,26,26,.07); }
    .service-card img { border-radius: 0; box-shadow: none; height: 255px; aspect-ratio: auto; object-fit: cover; object-position: center; }
    .service-card-body { padding: 24px; }
    .service-card-body p { min-height: 104px; }
    .all-services { margin-top: 28px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; }
    .all-services ul { display: flex; flex-wrap: wrap; gap: 10px; }
    .all-services li { background: var(--surface); border: 1px solid var(--line); color: var(--ink); border-radius: 999px; padding: 8px 12px; font-weight: 800; font-size: .9rem; }

    .standards-grid, .values-grid, .process-grid, .expertise-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
    .standards-grid { grid-template-columns: 1fr; margin-top: 24px; }
    .standards-grid div, .values-grid div, .process-grid div, .expertise-grid article, .contact-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; }
    .section-surface .values-grid div, .section-surface .expertise-grid article { background: var(--white); }
    .process-grid div span { width: 42px; height: 42px; display: inline-grid; place-items: center; background: var(--orange); color: var(--white); border-radius: 50%; font-weight: 900; margin-bottom: 14px; }
    .check-list { display: grid; gap: 10px; margin-top: 18px; }
    .check-list span { padding-left: 28px; position: relative; color: var(--ink); font-weight: 800; }
    .check-list span::before { content: ""; position: absolute; left: 0; top: .55em; width: 12px; height: 12px; border-radius: 50%; background: var(--orange); }

    .review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
    .review-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; box-shadow: 0 12px 32px rgba(26,26,26,.07); }
    .stars { color: var(--orange); font-weight: 900; margin-bottom: 12px; letter-spacing: 0; }
    .gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
    .compact-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gallery-item { margin: 0; position: relative; overflow: hidden; border-radius: var(--radius); background: var(--charcoal); }
    .gallery-item img { height: 245px; box-shadow: none; transition: transform .25s ease; }
    .gallery-item:hover img { transform: scale(1.03); }
    .gallery-item figcaption { position: absolute; inset: auto 0 0; background: linear-gradient(transparent, rgba(0,0,0,.76)); color: var(--white); padding: 44px 12px 12px; font-size: .82rem; font-weight: 800; }
    .project-carousel { background: var(--charcoal); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
    .gallery-stage { position: relative; min-height: 560px; display: grid; place-items: center; background: #090909; }
    .gallery-main { margin: 0; width: 100%; height: 100%; min-height: 560px; display: grid; grid-template-rows: minmax(0, 1fr) auto; }
    .gallery-main img { width: 100%; height: 560px; object-fit: contain; background: #090909; }
    .gallery-main figcaption { display: flex; justify-content: space-between; gap: 16px; background: rgba(20,20,20,.96); color: var(--white); padding: 14px 18px; font-weight: 800; }
    .gallery-main figcaption span { color: var(--orange-2); flex: 0 0 auto; }
    .gallery-control { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 46px; height: 58px; border: 1px solid rgba(255,255,255,.26); border-radius: var(--radius); background: rgba(20,20,20,.78); color: var(--white); font-size: 2.2rem; line-height: 1; cursor: pointer; }
    .gallery-control:hover { background: var(--orange); }
    .gallery-prev { left: 16px; }
    .gallery-next { right: 16px; }
    .gallery-thumbs { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; padding: 12px; background: #111111; }
    .gallery-thumb { border: 2px solid transparent; border-radius: 6px; overflow: hidden; padding: 0; background: transparent; cursor: pointer; height: 76px; }
    .gallery-thumb.active { border-color: var(--orange); }
    .gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }

    .area-grid { align-items: start; }
    .area-map-card { background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.2); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
    .area-map-card.compact { background: var(--surface); border-color: var(--line); box-shadow: none; margin-top: 18px; padding: 14px; }
    .area-chips { display: flex; flex-wrap: wrap; gap: 10px; }
    .area-chips button { appearance: none; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; background: rgba(255,255,255,.14); color: var(--white); padding: 8px 12px; font: inherit; font-size: .9rem; font-weight: 900; line-height: 1.15; cursor: pointer; transition: .2s ease; }
    .area-chips button:hover, .area-chips button.active { background: var(--orange); color: var(--white); border-color: var(--orange); }
    .area-map-card.compact .area-chips button { background: var(--white); color: var(--ink); border-color: var(--line); }
    .area-map-card.compact .area-chips button:hover, .area-map-card.compact .area-chips button.active { background: var(--orange); color: var(--white); border-color: var(--orange); }
    .area-map-frame { margin-top: 16px; border: 1px solid rgba(255,255,255,.22); border-radius: var(--radius); overflow: hidden; background: var(--charcoal); aspect-ratio: 16 / 10; min-height: 320px; }
    .area-map-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
    .map-note { margin: 12px 0 0; color: rgba(255,255,255,.8); font-size: .92rem; font-weight: 800; }
    .area-map-card.compact .area-map-frame { border-color: var(--line); min-height: 250px; }
    .area-map-card.compact .map-note { color: var(--muted); }

    .faq-list { display: grid; gap: 12px; max-width: 940px; }
    .faq-item { border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); overflow: hidden; }
    .faq-question { width: 100%; border: 0; background: transparent; padding: 18px 20px; display: flex; justify-content: space-between; gap: 18px; align-items: center; text-align: left; font: inherit; font-weight: 900; color: var(--charcoal); cursor: pointer; }
    .faq-icon { flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%; background: var(--orange); color: var(--white); display: inline-grid; place-items: center; }
    .faq-answer { display: none; padding: 0 20px 18px; }
    .faq-item.is-open .faq-answer { display: block; }

    .quote-section { padding-bottom: 100px; }
    .quote-copy p { color: rgba(255,255,255,.82); }
    .quote-embed { min-height: 681px; background: var(--white); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
    .contact-stack, .contact-lines { display: grid; gap: 12px; margin-top: 22px; }
    .contact-stack a, .contact-lines a { display: inline-flex; align-items: center; gap: 10px; font-weight: 900; min-width: 0; overflow-wrap: anywhere; }
    .contact-stack svg, .contact-lines svg { width: 24px; height: 24px; flex: 0 0 24px; }
    .mail-dot { width: 24px; height: 24px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--orange); color: var(--white); font-weight: 900; flex: 0 0 24px; }
    .hours-panel { margin-top: 26px; display: grid; gap: 4px; border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius); padding: 18px; color: var(--white); background: rgba(255,255,255,.08); }

    .included-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .included-list li { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius); padding: 14px; font-weight: 800; }
    .related-links { display: grid; gap: 12px; }
    .related-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; font-weight: 900; color: var(--orange-dark); }

    .contact-grid { align-items: stretch; grid-template-columns: 1.2fr .8fr 1fr; }
    .contact-card.accent { background: var(--charcoal); color: var(--white); border-color: var(--charcoal); }
    .contact-card.accent h3, .contact-card.accent p { color: var(--white); }
    .hours-list { display: grid; gap: 10px; }
    .hours-list li { display: flex; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(255,255,255,.14); padding-bottom: 8px; }

    .footer-cta { width: min(1160px, calc(100% - 36px)); margin: 0 auto; transform: translateY(-54px); background: var(--orange); color: var(--white); border-radius: var(--radius); padding: 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; box-shadow: var(--shadow); }
    .footer-cta h2, .footer-cta p { color: var(--white); }
    .footer-cta .eyebrow { color: var(--white); }
    .site-footer { background: var(--charcoal); color: rgba(255,255,255,.78); padding: 54px 0 26px; }
    .footer-grid { width: min(1160px, calc(100% - 36px)); margin: 0 auto; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 34px; }
    .footer-grid h3 { color: var(--white); font-size: 1rem; }
    .footer-grid p, .footer-grid a, .footer-grid li { color: rgba(255,255,255,.74); }
    .footer-grid ul { display: grid; gap: 9px; }
    .footer-logo { background: rgba(255,255,255,.94); border-radius: var(--radius); padding: 6px; margin-bottom: 16px; width: 160px; height: auto; }
    .footer-facebook { display: inline-flex; align-items: center; gap: 8px; }
    .footer-bottom { width: min(1160px, calc(100% - 36px)); margin: 34px auto 0; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); display: flex; justify-content: space-between; gap: 20px; }
    .footer-bottom p { color: rgba(255,255,255,.64); margin: 0; }

    @media (min-width: 900px) {
      h1 { font-size: 4.1rem; }
      h2 { font-size: 2.65rem; }
      .hero-page h1 { font-size: 3.75rem; }
    }

    @media (max-width: 1100px) {
      .site-nav { position: fixed; inset: 82px 14px auto; display: none; flex-direction: column; align-items: stretch; gap: 0; background: rgba(20,20,20,.98); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius); padding: 12px; box-shadow: var(--shadow); }
      .site-nav.is-open { display: flex; }
      .site-nav > a, .dropdown-button { padding: 12px; }
      .nav-toggle { display: block; }
      .dropdown-menu { position: static; transform: none; opacity: 1; visibility: visible; display: none; min-width: 0; box-shadow: none; margin: 4px 0 8px; }
      .nav-dropdown.is-open .dropdown-menu { display: block; }
      .nav-phone, .nav-facebook, .site-nav .btn { margin-top: 6px; }
      .service-grid, .gallery-grid, .review-grid, .values-grid, .process-grid, .expertise-grid, .contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 760px) {
      h1 { font-size: 2.35rem; }
      h2 { font-size: 1.9rem; }
      .container { width: min(100% - 28px, 1160px); }
      .section { padding: 62px 0; }
      .hero { min-height: 660px; }
      .hero-page { min-height: 520px; }
      .hero-content { padding-top: 96px; }
      .brand span { display: none; }
      .brand img { width: 70px; }
      .nav-wrap { height: 78px; }
      .intro-grid, .feature-split, .quote-grid, .area-grid, .included-grid, .related-grid, .service-grid, .gallery-grid, .review-grid, .values-grid, .process-grid, .expertise-grid, .contact-grid, .footer-grid { grid-template-columns: 1fr; }
      .feature-split.reverse img { order: 0; }
      .compact-gallery { grid-template-columns: 1fr; }
      .service-card img, .gallery-item img { height: 230px; }
      .gallery-stage, .gallery-main { min-height: 430px; }
      .gallery-main img { height: 430px; }
      .gallery-main figcaption { display: grid; }
      .gallery-thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .gallery-thumb { height: 62px; }
      .gallery-control { width: 40px; height: 50px; }
      .service-card-body p { min-height: 0; }
      .included-list { grid-template-columns: 1fr; }
      .footer-cta { flex-direction: column; align-items: flex-start; transform: translateY(-34px); padding: 24px; }
      .footer-bottom { flex-direction: column; }
      .quote-embed { min-height: 681px; }
      .btn { width: 100%; }
      .nav-phone, .nav-facebook { width: 100%; }
    }
