:root {
  --ink: #181a19;
  --paper: #f7f6f1;
  --lime: #a9d866;
  --pine: #3e5b41;
  --muted: #666a65;
  --line: #c9cbc3;
  --logo-black: #232428;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Manrope, Arial, sans-serif; }
a { color: inherit; }
#services, #how-it-works, #service-area { scroll-margin-top: 118px; }

.site-header {
  height: 118px; padding: 8px 5.5%; display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 10; background: var(--logo-black); color: #fff; border-bottom: 1px solid #353535;
}
.brand { display: flex; align-items: center; background: var(--logo-black); }
.brand img { width: 166px; height: 91px; display: block; object-fit: contain; }
.site-header nav, footer div { display: flex; gap: 28px; }
.site-header a, .service-card a, footer a, .footer-link-disabled { text-decoration: none; font-weight: 700; font-size: 13px; }
.site-header nav a { position: relative; display: inline-flex; padding-bottom: 7px; transition: color .18s ease, transform .18s ease; }
.site-header nav a::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: var(--lime); transform: scaleX(0); transform-origin: left; transition: transform .18s ease;
}
.site-header nav a:hover, .site-header nav a:focus-visible, .site-header nav a[aria-current="page"] { color: var(--lime); transform: translateY(-1px); }
.site-header nav a:hover::after, .site-header nav a:focus-visible::after, .site-header nav a[aria-current="page"]::after { transform: scaleX(1); }
.header-contact { display: flex; align-items: center; gap: 28px; }
.header-phone { color: #fff; white-space: nowrap; }
.header-phone, .header-email { padding-bottom: 4px; border-bottom: 2px solid var(--lime); line-height: 1.25; }
.header-email span { color: var(--lime); font-size: 17px; }
.menu-toggle, .mobile-menu-panel { display: none; }

.hero { min-height: 620px; display: grid; grid-template-columns: 1.05fr .95fr; overflow: hidden; }
.hero-copy { padding: 105px 7vw 92px 10vw; align-self: center; }
.eyebrow { margin: 0 0 19px; color: var(--pine); font: 500 11px/1.3 'DM Mono', monospace; letter-spacing: .12em; text-transform: uppercase; }
.hero h1, .section h2, .cta h2 { max-width: 790px; margin: 0; letter-spacing: -.06em; line-height: .98; font-size: clamp(42px, 5.5vw, 79px); }
.hero h1 em { color: var(--pine); font-style: normal; }
.hero-lede { max-width: 570px; margin: 28px 0; color: #50544f; font-size: 17px; line-height: 1.65; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.button { display: inline-flex; align-items: center; gap: 20px; padding: 16px 22px; font-size: 13px; font-weight: 800; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease; }
.button-primary { color: #fff; background: var(--ink); }
.button-primary span { color: var(--lime); font-size: 20px; }
.button-secondary { border: 1px solid #bfc1ba; }
.button:hover, .button:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(24,26,25,.16); }
.button-secondary:hover, .button-secondary:focus-visible { border-color: var(--pine); }
.microcopy { margin-top: 18px; color: var(--muted); font-size: 11px; }

.hero-art { position: relative; min-height: 620px; overflow: hidden; background: linear-gradient(145deg, #dce9cd, #91b978); isolation: isolate; }
.sun { position: absolute; top: 12%; right: 16%; width: 92px; height: 92px; border-radius: 50%; background: #f7efb3; }
.cloud { position: absolute; height: 20px; background: #eff4e7; border-radius: 30px; opacity: .75; }
.cloud::before, .cloud::after { content: ''; position: absolute; bottom: 0; border-radius: 50%; background: inherit; }
.cloud-one { top: 29%; left: 12%; width: 100px; }.cloud-one::before { left: 16px; width: 41px; height: 41px; }.cloud-one::after { left: 45px; width: 50px; height: 50px; }
.cloud-two { top: 18%; right: 23%; width: 65px; transform: scale(.6); }
.cloud-three { top: 11%; left: 38%; width: 86px; transform: scale(.72); opacity: .55; }
.cloud-three::before { left: 12px; width: 34px; height: 34px; }.cloud-three::after { left: 38px; width: 43px; height: 43px; }
.cloud-four { top: 37%; right: 9%; width: 78px; transform: scale(.66); opacity: .58; }
.cloud-four::before { left: 12px; width: 32px; height: 32px; }.cloud-four::after { left: 36px; width: 39px; height: 39px; }
.mountain { position: absolute; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.mountain-back { bottom: 28%; left: -20%; width: 120%; height: 270px; background: #6a9365; opacity: .75; }
.mountain-front { right: -22%; bottom: 23%; width: 90%; height: 220px; background: #537c55; }
.mountain::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 34%; background: rgba(249,250,244,.9); clip-path: polygon(50% 0, 66% 34%, 60% 29%, 55% 42%, 50% 31%, 44% 44%, 39% 29%, 34% 34%); filter: blur(.45px); }
.mountain-front::after { height: 37%; opacity: .92; clip-path: polygon(50% 0, 68% 37%, 61% 31%, 56% 45%, 50% 34%, 43% 47%, 38% 31%, 32% 37%); }
.lawn { position: absolute; bottom: -6%; left: -10%; width: 130%; height: 26%; border-radius: 50% 50% 0 0; background: #4d803f; }
.path { position: absolute; z-index: 1; bottom: -18%; left: 41.35%; width: 18%; height: 45%; clip-path: polygon(35% 0,65% 0,100% 100%,0 100%); background: #d7cab2; }
.house { position: absolute; z-index: 2; bottom: 17%; left: 26%; width: 48%; height: 45%; }
.roof { position: absolute; top: 0; width: 100%; height: 48%; clip-path: polygon(50% 0,100% 76%,92% 76%,92% 100%,8% 100%,8% 76%,0 76%); background: #273128; }
.home-body { position: absolute; bottom: 0; left: 12%; width: 76%; height: 62%; border: 8px solid #314034; background: #f4f1e7; }
.window { position: absolute; top: 17%; width: 23%; height: 29%; border: 6px solid #314034; background: #b7d1d0; }.window.one { left: 12%; }.window.two { right: 12%; }
.door { position: absolute; bottom: 0; left: 39%; width: 22%; height: 53%; background: #4c6349; }
.tree { position: absolute; z-index: 2; bottom: 16%; width: 18px; background: #664b33; }.tree::before { content: ''; position: absolute; bottom: 12px; left: -30px; width: 78px; height: 92px; border-radius: 50%; background: #4f8747; box-shadow: -22px 21px 0 #467840, 22px 25px 0 #5f914a; }.tree-one { left: 12%; height: 104px; }.tree-two { right: 10%; height: 78px; transform: scale(.8); }
.art-label { position: absolute; z-index: 2; right: 38px; bottom: 42px; margin: 0; color: white; text-align: right; font: 500 11px/1.5 'DM Mono', monospace; letter-spacing: .14em; }

.trust-bar { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 23px; padding: 20px 5vw; color: #fff; background: var(--ink); }
.trust-bar p { margin: 0; font: 600 11px 'DM Mono', monospace; letter-spacing: .07em; text-transform: uppercase; }.trust-bar span { width: 5px; height: 5px; border-radius: 50%; background: var(--lime); }
.section { padding: 112px 10vw; }.section-intro { max-width: 760px; }.section h2 { font-size: clamp(38px, 4.2vw, 60px); }.section-intro > p:not(.eyebrow) { max-width: 620px; margin: 24px 0 0; color: var(--muted); font-size: 16px; line-height: 1.65; }
.service-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 54px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.service-card { position: relative; display: flex; flex-direction: column; min-height: 365px; padding: 31px 33px 30px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: transform .18s ease, box-shadow .18s ease; }.service-card:hover { z-index: 1; transform: translateY(-4px); box-shadow: 0 16px 34px rgba(24,26,25,.12); }.service-card.featured { color: #fff; background: var(--pine); }
.service-number { font: 500 11px 'DM Mono', monospace; opacity: .7; }.service-tag { position: absolute; top: 22px; right: 26px; margin: 0; padding: 7px 9px; color: var(--ink); background: var(--lime); font: 600 10px 'DM Mono', monospace; text-transform: uppercase; }.service-card h3 { margin: 28px 0 12px; font-size: 23px; letter-spacing: -.04em; }.price { margin: 0 0 15px; font-size: 12px; }.price strong { font-size: 27px; letter-spacing: -.06em; }.price small { color: var(--muted); }.featured .price small { color: #d9e3d7; }.service-card > p:not(.price):not(.service-tag) { max-width: 390px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }.featured > p:not(.price):not(.service-tag) { color: #e2e7df; }.service-card ul { margin: 16px 0 22px; padding-left: 16px; font-size: 12px; line-height: 1.75; }.service-card a { display: inline-flex; align-self: flex-start; margin-top: auto; padding-bottom: 3px; color: var(--pine); border-bottom: 2px solid var(--lime); transition: color .18s ease, transform .18s ease, border-color .18s ease; }.service-card a:hover, .service-card a:focus-visible { color: var(--ink); transform: translateY(-2px); }.featured a { color: #fff; }.featured a:hover, .featured a:focus-visible { color: var(--lime); }.service-card a span { color: var(--pine); font-size: 17px; }.featured a span { color: var(--lime); }.service-card.prompt-link a { animation: request-flash .72s ease; border-color: #e73535; color: #e73535; }.service-card.prompt-link a span { color: #e73535; }.price-note { margin: 18px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.upcoming-services { background: #fffdf7; }
.coming-grid { display: grid; grid-template-columns: repeat(2, minmax(280px, 420px)); justify-content: center; gap: 0; margin-top: 48px; }
.coming-card { min-height: 245px; padding: 30px 32px; border: 1px solid var(--line); background: var(--paper); }
.coming-card span { display: inline-block; margin-bottom: 40px; color: var(--pine); font: 600 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; }
.coming-card h3 { margin: 0 0 14px; font-size: 25px; line-height: 1.05; letter-spacing: -.05em; }
.coming-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }

@keyframes request-flash {
  0%, 100% { color: inherit; border-color: var(--lime); }
  22%, 68% { color: #e73535; border-color: #e73535; }
}
.process { display: grid; grid-template-columns: .85fr 1.15fr; gap: 8vw; background: #deded5; }.process ol { margin: 0; padding: 0; list-style: none; }.process li { display: flex; gap: 26px; margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #b7b9b0; }.process li span { padding-top: 4px; color: var(--pine); font: 500 11px 'DM Mono', monospace; }.process h3 { margin: 0 0 7px; font-size: 18px; }.process li p { max-width: 340px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.gallery { color: #fff; background: var(--ink); }.gallery .section-intro > p:not(.eyebrow) { color: #d1d3ce; }.gallery-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 14px; margin-top: 47px; }.gallery-grid div { position: relative; height: 230px; padding: 18px; background: linear-gradient(145deg,#6f8b5b,#374a36); }.gallery-grid div:nth-child(2) { background: linear-gradient(145deg,#b89c71,#677f4e); }.gallery-grid div:nth-child(3) { background: linear-gradient(145deg,#748083,#293d35); }.gallery-grid span { font: 500 11px 'DM Mono', monospace; }.gallery-grid p { position: absolute; bottom: 0; font: 500 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; }
.service-area { padding: 108px 20vw; text-align: center; }.service-area h2 { margin: 0 auto 24px; }.service-area > p:not(.eyebrow) { max-width: 680px; margin: 10px auto; color: var(--muted); font-size: 15px; line-height: 1.65; }
.cta { padding: 105px 10vw; text-align: center; background: var(--lime); }.cta h2 { margin: 0 auto 35px; }.cta .button { background: var(--ink); }
.faq-section { background: #fffdf7; }
.faq-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 48px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.faq-grid article { min-height: 210px; padding: 30px 32px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper); }
.faq-grid h3 { margin: 0 0 15px; font-size: 23px; line-height: 1.08; letter-spacing: -.04em; }
.faq-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.seo-footer { display: grid; grid-template-columns: .95fr 1.05fr; gap: 6vw; padding: 52px 10vw; color: #d1d3ce; background: var(--ink); border-top: 1px solid #353535; }
.seo-footer .eyebrow { color: var(--lime); margin-bottom: 14px; }
.seo-footer h2 { max-width: 620px; margin: 0; color: #fff; font-size: clamp(24px, 2.6vw, 38px); line-height: 1.06; letter-spacing: -.05em; }
.seo-footer p:not(.eyebrow) { max-width: 680px; margin: 0; font-size: 13px; line-height: 1.7; }
footer { display: flex; align-items: center; justify-content: space-between; padding: 30px 5.5vw; color: #fff; background: var(--logo-black); }footer p { margin: 0; color: #adb3aa; font-size: 11px; }
.header-phone, .header-email, footer a { display: inline-flex; transition: color .18s ease, transform .18s ease; }
.header-phone:hover, .header-phone:focus-visible, .header-email:hover, .header-email:focus-visible, footer a:hover, footer a:focus-visible { color: var(--lime); transform: translateY(-1px); }
.footer-link-disabled { color: #adb3aa; cursor: default; }

@media (prefers-reduced-motion: reduce) {
  .site-header nav a, .site-header nav a::after, .button, .service-card, .service-card a, .header-phone, .header-email, footer a { transition: none; }
  .site-header nav a:hover, .site-header nav a:focus-visible, .site-header nav a[aria-current="page"], .button:hover, .button:focus-visible, .service-card:hover, .service-card a:hover, .service-card a:focus-visible, .header-phone:hover, .header-phone:focus-visible, .header-email:hover, .header-email:focus-visible, footer a:hover, footer a:focus-visible { transform: none; }
  .service-card.prompt-link a { animation: none; }
}

.about-hero { min-height: 650px; display: grid; grid-template-columns: 1fr .92fr; gap: 6vw; align-items: center; padding: 98px 8vw 92px 10vw; overflow: hidden; background: linear-gradient(145deg, #f7f6f1 0%, #e4ead9 54%, #a7c988 100%); }
.about-hero-copy h1 { max-width: 840px; margin: 0; font-size: clamp(44px, 5.2vw, 78px); line-height: .98; letter-spacing: -.06em; }
.about-hero-copy > p { max-width: 610px; margin: 26px 0 0; color: #50544f; font-size: 18px; line-height: 1.65; }
.about-hero-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 30px; }
.about-hero-visual { position: relative; min-height: 510px; }
.about-photo-frame { position: absolute; width: 56%; min-height: 315px; padding: 22px; border: 1px solid rgba(24,26,25,.22); background: #fffdf7; box-shadow: 0 22px 60px rgba(24,26,25,.16); }
.about-photo-frame.before { top: 26px; left: 0; transform: rotate(-3deg); background: #ece8db; }
.about-photo-frame.after { right: 0; bottom: 44px; transform: rotate(3deg); color: #fff; background: var(--pine); }
.about-photo-frame span { display: inline-block; color: var(--pine); font: 600 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; }
.about-photo-frame.after span { color: var(--lime); }
.about-photo-frame p { position: absolute; left: 22px; right: 22px; bottom: 18px; margin: 0; font: 500 10px/1.55 'DM Mono', monospace; letter-spacing: .12em; text-transform: uppercase; }
.mini-house { position: relative; height: 190px; margin-top: 18px; overflow: hidden; background: linear-gradient(#cfd6c3 0 58%, #6a784e 58% 100%); }
.mini-house::before { content: ''; position: absolute; left: 24%; bottom: 44%; width: 52%; height: 33%; border: 6px solid #263128; background: #f4f1e7; }
.mini-house::after { content: ''; position: absolute; left: 19%; bottom: 75%; width: 62%; height: 34%; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: #273128; }
.mini-house i { position: absolute; left: 0; right: 0; bottom: 0; height: 34%; background: repeating-linear-gradient(92deg, rgba(255,255,255,.12) 0 5px, transparent 5px 14px), #415f36; }
.mini-house b { position: absolute; left: 16%; bottom: 23%; width: 70%; height: 12px; background: #d7cab2; transform: skewX(-24deg); }
.mini-house.dull { filter: saturate(.62); }
.mini-house.dull i::before { content: ''; position: absolute; left: 10%; bottom: 18px; width: 82%; height: 46px; background: repeating-linear-gradient(74deg, transparent 0 11px, rgba(74,86,54,.9) 11px 15px); opacity: .75; }
.mini-house.clean { background: linear-gradient(#d9e9d2 0 58%, #6fa451 58% 100%); }
.mini-house.clean i { background: repeating-linear-gradient(92deg, rgba(255,255,255,.18) 0 4px, transparent 4px 16px), #4f8747; }
.about-value-note { position: absolute; z-index: 2; right: 8%; top: 43%; width: 245px; padding: 18px; color: var(--ink); background: var(--lime); box-shadow: 0 16px 40px rgba(24,26,25,.18); }
.about-value-note strong { display: block; margin-bottom: 8px; font-size: 14px; }
.about-value-note p { margin: 0; font-size: 12px; line-height: 1.45; }
.about-metrics { display: grid; grid-template-columns: repeat(4, 1fr); color: #fff; background: var(--ink); border-top: 1px solid #353535; }
.about-metrics div { min-height: 128px; padding: 26px 28px; border-right: 1px solid #353535; }
.about-metrics strong { display: block; margin-bottom: 12px; color: var(--lime); font-size: clamp(26px, 3vw, 42px); line-height: .95; letter-spacing: -.06em; }
.about-metrics span { display: block; max-width: 180px; color: #d1d3ce; font: 500 10px/1.5 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.about-story { display: grid; grid-template-columns: .85fr 1.15fr; gap: 8vw; background: #fffdf7; }
.about-copy { border-left: 1px solid var(--line); padding-left: 42px; }
.about-copy p { margin: 0 0 22px; color: var(--muted); font-size: 16px; line-height: 1.7; }
.about-copy p:first-child { color: var(--ink); font-size: 21px; line-height: 1.5; letter-spacing: -.02em; }
.about-details { background: #deded5; }
.detail-list { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 52px; border-top: 1px solid #b7b9b0; }
.detail-list article { display: grid; grid-template-columns: 48px 1fr; column-gap: 28px; padding: 28px 0; border-bottom: 1px solid #b7b9b0; }
.detail-list article:nth-child(odd) { padding-right: 38px; border-right: 1px solid #b7b9b0; }
.detail-list article:nth-child(even) { padding-left: 38px; }
.detail-list span, .about-proof span { color: var(--pine); font: 500 11px 'DM Mono', monospace; }
.detail-list h3 { margin: 0 0 8px; font-size: 22px; letter-spacing: -.04em; }
.detail-list p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.about-proof { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.about-proof article { min-height: 315px; padding: 38px 34px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fffdf7; }
.about-proof article:nth-child(2) { background: var(--pine); color: #fff; }
.about-proof article:nth-child(2) span { color: var(--lime); }
.about-proof article:nth-child(2) p { color: #e2e7df; }
.about-proof h2 { margin: 58px 0 16px; font-size: 31px; line-height: 1.02; letter-spacing: -.05em; }
.about-proof p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.about-mission { display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; color: #fff; background: var(--pine); }
.about-mission .eyebrow { color: var(--lime); }
.about-mission p:not(.eyebrow) { margin: 0 0 22px; color: #e2e7df; font-size: 18px; line-height: 1.7; }
.about-mission ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.24); }
.about-mission li { padding: 18px 0; color: #f5f7f2; font-size: 15px; line-height: 1.55; border-bottom: 1px solid rgba(255,255,255,.24); }

@media (max-width: 800px) {
  .site-header { height: 88px; padding: 7px 5vw; gap: 10px; }.brand { flex: 0 0 auto; }.brand img { width: 118px; height: 65px; }.site-header nav { display: none; }.menu-toggle { display: inline-flex; flex: 0 0 42px; flex-direction: column; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid #4b4d4c; color: #fff; text-decoration: none; }.menu-toggle span { display: block; width: 20px; height: 2px; margin: 3px 0; background: currentColor; }.mobile-menu-panel { display: none; color: #fff; background: var(--logo-black); border-bottom: 1px solid #353535; box-shadow: 0 18px 32px rgba(0,0,0,.24); }.mobile-menu-panel:target, body.mobile-menu-open .mobile-menu-panel { position: fixed; z-index: 9; top: 88px; left: 0; right: 0; display: grid; max-height: calc(100vh - 88px); overflow: auto; padding: 18px 5vw 22px; }.mobile-menu-panel a { display: flex; align-items: center; min-height: 48px; color: #fff; text-decoration: none; font-weight: 800; font-size: 14px; border-bottom: 1px solid #353535; }.mobile-menu-panel a[aria-current="page"] { color: var(--lime); }.mobile-menu-close { justify-content: flex-end; color: var(--lime) !important; }.header-contact { margin-left: auto; gap: 10px; }.header-phone, .header-email { font-size: 10px !important; }.header-phone { display: none; }.header-email { max-width: 92px; justify-content: center; text-align: center; }
  .hero { grid-template-columns: 1fr; }.hero-copy { padding: 66px 8vw 60px; }.hero-art { order: -1; min-height: 390px; }.hero h1 { font-size: 46px; }.trust-bar { gap: 12px; padding: 16px 6vw; }.trust-bar p { font-size: 9px; }.trust-bar span { display: inline-block; width: 5px; height: 5px; flex: 0 0 5px; }
  .section { padding: 75px 8vw; }.service-grid { grid-template-columns: 1fr; margin-top: 38px; }.service-card { min-height: auto; padding: 28px; }.coming-grid { grid-template-columns: 1fr; margin-top: 36px; }.coming-card { min-height: 220px; padding: 28px; }.coming-card span { margin-bottom: 30px; }.process { grid-template-columns: 1fr; gap: 40px; }.gallery-grid { grid-template-columns: 1fr; gap: 10px; }.gallery-grid div { height: 160px; }.service-area { padding: 75px 8vw; }.cta { padding: 75px 8vw; }.faq-grid { grid-template-columns: 1fr; margin-top: 36px; }.faq-grid article { min-height: 190px; padding: 28px; }.seo-footer { grid-template-columns: 1fr; gap: 24px; padding: 42px 8vw; }footer { flex-direction: column; align-items: flex-start; gap: 20px; padding: 27px 8vw; }footer div { flex-direction: column; gap: 10px; }
  .about-hero { min-height: auto; grid-template-columns: 1fr; gap: 38px; padding: 70px 8vw 62px; }.about-hero-copy h1 { font-size: 46px; }.about-hero-copy > p { font-size: 16px; }
  .about-hero-visual { min-height: 540px; }.about-photo-frame { width: 74%; min-height: 275px; padding: 18px; }.about-photo-frame.before { top: 0; }.about-photo-frame.after { bottom: 40px; }.mini-house { height: 160px; }.about-value-note { right: 0; top: 43%; width: 210px; padding: 15px; }
  .about-metrics { grid-template-columns: 1fr 1fr; }.about-metrics div { min-height: 118px; padding: 22px 20px; }.about-metrics strong { font-size: 30px; }
  .about-story, .about-mission { grid-template-columns: 1fr; gap: 32px; }.about-copy { padding-left: 0; border-left: 0; }.about-copy p:first-child { font-size: 18px; }
  .detail-list { grid-template-columns: 1fr; margin-top: 36px; }.detail-list article { grid-template-columns: 36px 1fr; column-gap: 18px; padding: 24px 0 !important; border-right: 0 !important; }
  .about-proof { grid-template-columns: 1fr; }.about-proof article { min-height: 245px; padding: 30px 28px; }.about-proof h2 { margin-top: 36px; font-size: 26px; }.about-mission p:not(.eyebrow) { font-size: 16px; }.about-mission li { font-size: 14px; }
}

@media (max-width: 420px) {
  .site-header { height: 82px; padding-left: 4.5vw; padding-right: 4.5vw; gap: 8px; }.brand img { width: 108px; height: 59px; }.menu-toggle { flex-basis: 40px; width: 40px; height: 40px; }.mobile-menu-panel:target, body.mobile-menu-open .mobile-menu-panel { top: 82px; max-height: calc(100vh - 82px); }.header-email { max-width: 82px; font-size: 9px !important; }
  .hero-copy { padding: 54px 7vw 54px; }.hero-art { min-height: 350px; }.hero h1 { font-size: 42px; }.hero-lede { margin: 22px 0; font-size: 15px; line-height: 1.55; }.button { width: 100%; justify-content: space-between; }
  .section h2, .cta h2 { font-size: 36px; }.service-card { min-height: auto; }.service-tag { top: 18px; right: 18px; }
}

/* Focused About page layout */
.about-hero.about-band { min-height: 590px; grid-template-columns: 1.08fr .92fr; gap: 7vw; padding: 96px 10vw; background: var(--paper); }
.about-hero-copy h1 { max-width: 820px; margin: 0; font-size: clamp(42px, 5vw, 74px); line-height: .98; letter-spacing: -.06em; }
.about-hero-copy > p { max-width: 570px; margin: 26px 0 0; color: #50544f; font-size: 17px; line-height: 1.65; }
.about-hero-copy .hero-actions { margin-top: 38px; }
.about-snapshot { align-self: center; display: grid; width: 100%; border: 1px solid var(--line); }
.about-snapshot div { padding: 30px 32px; border-bottom: 1px solid var(--line); background: #fffdf7; }
.about-snapshot div:last-child { border-bottom: 0; }
.about-snapshot div:nth-child(2) { color: #fff; background: var(--pine); }
.about-snapshot div:nth-child(2) span { color: var(--lime); }
.about-snapshot span, .about-audience-list span { display: block; margin-bottom: 12px; color: var(--pine); font: 600 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; }
.about-snapshot strong { display: block; max-width: 360px; font-size: 26px; line-height: 1.08; letter-spacing: -.05em; }
.about-trust { padding-left: 8vw; padding-right: 8vw; }
.about-story { display: block; background: #fffdf7; }
.about-value-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 54px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.about-value-grid article { min-height: 275px; padding: 31px 32px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper); }
.about-value-grid h3 { margin: 42px 0 14px; font-size: 25px; line-height: 1.05; letter-spacing: -.05em; }
.about-value-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.about-mission { display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; background: var(--pine); }
.about-mission .section-intro { max-width: none; }
.about-mission h2 { color: #fff; }
.about-audience-list { display: grid; gap: 0; border-top: 1px solid rgba(255,255,255,.25); }
.about-audience-list article { padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,.25); }
.about-audience-list span { color: var(--lime); }
.about-audience-list p { max-width: 560px; margin: 0; color: #e2e7df; font-size: 16px; line-height: 1.55; }

.pay-hero { display: grid; grid-template-columns: .95fr 1.05fr; gap: 7vw; align-items: center; min-height: 560px; padding: 96px 10vw; background: var(--paper); }
.pay-hero h1 { max-width: 760px; margin: 0; font-size: clamp(42px, 5vw, 72px); line-height: .98; letter-spacing: -.06em; }
.invoice-lookup { display: grid; gap: 18px; padding: 34px; border: 1px solid var(--line); background: #fffdf7; }
.invoice-lookup label { display: grid; gap: 9px; }
.invoice-lookup label span { color: var(--pine); font: 600 10px 'DM Mono', monospace; letter-spacing: .13em; text-transform: uppercase; }
.invoice-lookup input { width: 100%; min-height: 52px; padding: 13px 14px; border: 1px solid var(--line); background: #fff; color: var(--ink); font: 600 15px Manrope, Arial, sans-serif; }
.invoice-lookup input:focus { outline: 2px solid var(--lime); outline-offset: 2px; border-color: var(--pine); }
.payment-help { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.payment-help a { color: var(--pine); font-weight: 800; text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.invoice-section { background: #deded5; }
.invoice-panel { max-width: 920px; min-height: 310px; padding: 38px; border: 1px solid #b7b9b0; background: #fffdf7; }
.invoice-panel h2 { margin: 0 0 16px; font-size: clamp(31px, 4vw, 52px); line-height: 1; letter-spacing: -.06em; }
.invoice-panel > p:not(.eyebrow), .invoice-customer { max-width: 620px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }
.invoice-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; }
.invoice-status { display: inline-flex; padding: 8px 10px; color: var(--ink); background: #e8d18e; font: 700 10px 'DM Mono', monospace; letter-spacing: .12em; text-transform: uppercase; }
.invoice-status.paid { background: var(--lime); }
.invoice-items { margin: 28px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.invoice-items li, .invoice-total { display: flex; justify-content: space-between; gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.invoice-items span, .invoice-total span { color: var(--muted); }
.invoice-total { margin-bottom: 26px; font-size: 18px; }
.invoice-total strong { font-size: 30px; letter-spacing: -.05em; }
.admin-page { min-height: 100vh; background: var(--paper); }
.admin-form { align-self: start; }
.admin-items { display: grid; grid-template-columns: 1.4fr .6fr; gap: 16px; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.form-message { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }

@media (max-width: 800px) {
  .about-hero.about-band { min-height: auto; grid-template-columns: 1fr; gap: 36px; padding: 72px 8vw; }
  .about-hero-copy h1 { font-size: 45px; }
  .about-hero-copy > p { font-size: 16px; }
  .about-snapshot strong { font-size: 22px; }
  .about-value-grid { grid-template-columns: 1fr; margin-top: 38px; }
  .about-value-grid article { min-height: 220px; padding: 28px; }
  .about-value-grid h3 { margin-top: 34px; font-size: 24px; }
  .about-mission { grid-template-columns: 1fr; gap: 34px; }
  .pay-hero { grid-template-columns: 1fr; min-height: auto; padding: 72px 8vw; }
  .invoice-lookup, .invoice-panel { padding: 28px; }
  .invoice-heading, .invoice-items li, .invoice-total { align-items: flex-start; flex-direction: column; gap: 8px; }
  .admin-items { grid-template-columns: 1fr; }
}