:root{
  --graphite:#1E2021;   /* matte black hardware */
  --porcelain:#F3F4F2;  /* page */
  --white:#FFFFFF;
  --marble:#DCDFDB;     /* soft panels */
  --muted:#565C5B;      /* secondary text, 6.4:1 on porcelain */
  --edge:#A8CABF;       /* the green edge of thick glass */
  --edge-deep:#2C5A50;  /* links, 7.6:1 on porcelain */
  --brass:#D2B48C;      /* from the logo */
  --wrap:1180px;
  --font:'Archivo', system-ui, sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--porcelain);color:var(--graphite);font-family:var(--font);font-variation-settings:'wdth' 100;font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--edge-deep);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--edge-deep);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:100;background:var(--white);padding:8px 14px}

h1,h2,h3{text-wrap:balance;font-variation-settings:'wdth' 72;font-weight:640;line-height:1.02;letter-spacing:-.005em;margin:0}
h1{font-size:clamp(2.75rem,5.6vw,5rem);max-width:12ch}
h2{font-size:clamp(2.1rem,4vw,3.3rem)}
h3{font-size:1.6rem;line-height:1.1}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:var(--porcelain);border-bottom:1px solid var(--marble)}
.header-row{display:flex;align-items:center;gap:32px;height:72px}
.brand{display:flex;align-items:center;gap:12px;color:var(--graphite);text-decoration:none}
.brand-mark{width:48px;height:48px}
.brand-name{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:1.45rem;letter-spacing:.01em}
.nav{display:flex;gap:28px;margin-left:auto}
.nav a{color:var(--graphite);text-decoration:none;font-weight:500}
.nav a:hover{color:var(--edge-deep)}
.header-phone{font-weight:600;color:var(--graphite);text-decoration:none;padding:9px 16px;border:1.5px solid var(--graphite)}
.header-phone:hover{background:var(--graphite);color:var(--porcelain)}

/* hero */
.hero{padding:64px 0 88px}
.hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:center}
.lede{font-size:1.2rem;max-width:34em;margin:28px 0 32px;color:#2E3232}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;padding:15px 24px;font-weight:600;text-decoration:none;font-size:1rem;line-height:1}
.btn-solid{background:var(--graphite);color:var(--porcelain)}
.btn-solid:hover{background:#000}
.btn-line{border:1.5px solid var(--graphite);color:var(--graphite);padding:13.5px 22.5px}
.btn-line:hover{background:var(--white)}
.hours{margin:22px 0 0;color:var(--muted);font-size:.95rem}

/* the signature: three glass panes, each with a thick-glass edge */
.panes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:end}
.pane{margin:0;position:relative;aspect-ratio:3/5;overflow:hidden;background:var(--marble)}
.pane:nth-child(2){aspect-ratio:3/5.6}
.pane img{width:100%;height:100%;object-fit:cover}
.pane::after{content:"";position:absolute;inset:0;border-right:5px solid var(--edge);box-shadow:inset 1px 1px 0 rgba(255,255,255,.55);pointer-events:none;mix-blend-mode:multiply}

/* services */
.services{background:var(--white);padding:96px 0}
.services-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px}
.services-intro{position:sticky;top:110px;align-self:start}
.services-intro p{color:var(--muted);max-width:26em;margin:20px 0 0}
.service-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:44px 48px}
.service-list li{padding-left:18px;border-left:3px solid var(--edge)}
.service-list p{margin:10px 0 0;color:#363A3A}

/* work */
.work{padding:96px 0}
.work-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:32px}
.fb-link{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.fb-link svg{width:20px;height:20px}
.gallery{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:dense;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:10px}
.gallery li:nth-child(1),.gallery li:nth-child(8){grid-column:span 2;grid-row:span 2}
.gallery li:nth-child(5){grid-row:span 2}
.gallery button{all:unset;display:block;width:100%;height:100%;cursor:zoom-in;position:relative;background:var(--marble)}
.gallery button:focus-visible{outline:3px solid var(--edge-deep);outline-offset:2px}
.gallery img{width:100%;height:100%;object-fit:cover}

/* quote */
.quote{background:var(--graphite);color:#E9EBE8;padding:96px 0}
.quote-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
.quote-info p{max-width:30em;color:#C8CCC9;margin:20px 0 36px}
.quote a{color:#fff}
.contact-list{margin:0;display:grid;gap:18px}
.contact-list dt{font-size:.9rem;color:var(--brass)}
.contact-list dd{margin:2px 0 0;font-size:1.15rem}
.form-frame{background:var(--porcelain);padding:28px 32px 8px;color:var(--graphite)}
.form-frame iframe{border:0;display:block}

/* footer */
.site-footer{background:var(--graphite);color:#B9BEBB;padding:0 0 32px;border-top:1px solid #33373A}
.footer-mark{width:88px;height:88px;flex:none}
.site-footer a{color:#E9EBE8}
.footer-fb{margin-left:auto;width:40px;height:40px;display:grid;place-items:center;border:1.5px solid #5A6062}
.footer-fb svg{width:22px;height:22px}

/* phones: quick contact bar */
.action-bar{display:none}

/* lightbox */
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh}
.lightbox::backdrop{background:rgba(20,22,22,.92)}
.lightbox[open]{display:grid;place-items:center}
.lightbox img{max-width:min(92vw,1200px);max-height:86vh;object-fit:contain}
.lightbox button{position:fixed;background:none;border:0;color:#fff;font-size:2.6rem;line-height:1;cursor:pointer;padding:12px 18px}
.lb-close{top:10px;right:14px}
.lb-prev{left:6px;top:50%;transform:translateY(-50%)}
.lb-next{right:6px;top:50%;transform:translateY(-50%)}

@media (max-width:980px){
  .hero-grid,.services-grid,.quote-grid{grid-template-columns:1fr}
  .services-intro{position:static}
  .hero{padding:40px 0 64px}
  .panes{order:-1}
  h1{max-width:12ch}
}
@media (max-width:720px){
  .nav,.header-phone{display:none}
  .header-row{height:64px}
  .brand-mark{width:42px;height:42px}
  .service-list{grid-template-columns:1fr;gap:32px}
  .services,.work,.quote{padding:64px 0}
  .gallery{grid-template-columns:1fr 1fr;grid-auto-rows:180px}
  .gallery li:nth-child(5){grid-row:span 1}
  .form-frame{padding:20px 16px 4px;margin:0 -8px}
  .footer-row{flex-wrap:wrap}
  body{padding-bottom:68px}
  .action-bar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--graphite);border-top:1px solid #3A3F41;padding-bottom:env(safe-area-inset-bottom)}
  .action-bar a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 0 9px;color:#fff;text-decoration:none;font-size:.85rem;font-weight:600}
  .action-bar a+a{border-left:1px solid #3A3F41}
  .action-bar svg{width:22px;height:22px}
}

/* ---------- multi-page additions ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.draft-bar{background:var(--brass);color:var(--graphite);font-size:.875rem;text-align:center;padding:7px 16px;font-weight:500}
.nav a[aria-current="page"]{color:var(--edge-deep);text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.text-link{font-weight:600;display:inline-block;margin-top:20px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:32px}
.section-head .text-link{margin-top:0}
.note{color:var(--muted);font-size:.9rem;margin:0}

/* service links on home and services index */
.svc-link{display:block;color:inherit;text-decoration:none}
.svc-link h3{transition:color .15s}
.svc-link:hover h3{color:var(--edge-deep);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.services-plain{padding-top:24px}
.service-list-wide{grid-template-columns:repeat(3,1fr)}

/* steps: a real sequence, so numbered */
.steps{padding:96px 0;background:var(--white)}
.steps-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px}
.step-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:step}
.step-list li{counter-increment:step;border-top:3px solid var(--graphite);padding-top:16px}
.step-list li::before{content:counter(step);display:block;font-variation-settings:'wdth' 72;font-weight:640;font-size:2.4rem;line-height:1;margin-bottom:12px;color:var(--edge-deep)}
.step-list h3{font-size:1.3rem}
.step-list p{margin:8px 0 0;color:#363A3A;font-size:.98rem}

/* reviews */
.reviews{padding:96px 0}
.review-row{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.review{margin:0;border-left:3px solid var(--edge);padding:4px 0 4px 22px;position:relative}
.review blockquote{margin:12px 0 14px}
.review blockquote p{margin:0;font-size:1.15rem;line-height:1.5}
.review figcaption{color:var(--muted);font-size:.92rem}
.sample-tag{display:inline-block;font-size:.78rem;font-weight:600;background:var(--marble);padding:3px 9px;color:#3B4040}

/* service area */
.area{padding:0 0 96px}
.area-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:baseline;border-top:1px solid var(--marble);padding-top:48px}
.area p{margin:0;font-size:1.15rem;max-width:36em}

/* CTA band */
.cta-band{background:var(--graphite);color:#E9EBE8;padding:80px 0}
.cta-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) auto;gap:40px;align-items:center}
.cta-row p{margin:0;color:#C8CCC9}
.cta-band .actions{flex-wrap:nowrap}
.btn-light{background:var(--porcelain);color:var(--graphite)}
.btn-light:hover{background:#fff}
.btn-ghost{border:1.5px solid #8E9592;color:#fff;padding:13.5px 22.5px}
.btn-ghost:hover{border-color:#fff}

/* inner page header */
.page-head{padding:64px 0 48px}
.page-head .lede{margin:20px 0 0}
.page-head h1{max-width:16ch}
.crumbs{margin:0 0 16px;font-size:.95rem}
.svc-head{padding-bottom:72px}
.svc-head-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:center}
.svc-head .actions{margin-top:32px}
.lead-frame{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--marble)}
.lead-frame::after{content:"";position:absolute;inset:0;border-right:6px solid var(--edge);mix-blend-mode:multiply;pointer-events:none}
.lead-img{width:100%;height:100%;object-fit:cover}
.photo-placeholder{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;color:#7D8784;background:linear-gradient(160deg,#E7EAE6,#D3D8D4);text-align:center;padding:24px}
.photo-placeholder svg{width:46%;max-width:180px}
.photo-placeholder p{margin:0;font-size:.95rem}

/* offer list */
.offer{background:var(--white);padding:88px 0}
.offer-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px}
.offer-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:36px 48px}
.offer-list li{padding-left:18px;border-left:3px solid var(--edge)}
.offer-list p{margin:8px 0 0;color:#363A3A}
.work-tight{padding:64px 0}

/* faq */
.faq{padding:88px 0}
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px}
.faq-list details{border-top:1px solid #C9CECA;padding:18px 0}
.faq-list details:last-child{border-bottom:1px solid #C9CECA}
.faq-list summary{cursor:pointer;font-weight:600;font-size:1.1rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-size:1.5rem;line-height:1;color:var(--edge-deep)}
.faq-list details[open] summary::after{content:"–"}
.faq-list p{margin:12px 0 0;max-width:40em;color:#363A3A}

/* related */
.related{padding:0 0 88px}
.related h2{font-size:1.6rem;margin-bottom:16px}
.related-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.related-list a{display:inline-block;padding:9px 14px;border:1.5px solid #B9BFBB;color:var(--graphite);text-decoration:none;font-weight:500}
.related-list a:hover{border-color:var(--graphite);background:var(--white)}

/* about */
.about{padding:24px 0 96px}
.about-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px}
.prose h2{font-size:1.9rem;margin:40px 0 14px}
.prose h2:first-child{margin-top:0}
.prose p{max-width:38em}
.prose-narrow{max-width:760px}
.check-list{padding-left:1.2em;max-width:38em}
.check-list li{margin:0 0 10px}
.check-list li::marker{color:var(--edge-deep)}
.about-photos{display:grid;gap:12px;align-content:start}
.about-photos img{width:100%;aspect-ratio:4/3;object-fit:cover}
mark.tbd{background:#F2E6C9;color:#4A3B17;padding:2px 4px}

/* contact page */
.quote-page{padding:72px 0 96px}
.quote-page h1{font-size:clamp(2.4rem,4.4vw,3.6rem)}
.form-note{font-size:.85rem;color:var(--muted);margin:8px 0 18px}
.form-note a{color:var(--edge-deep)}

/* footer, multi-column */
.footer-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr);gap:48px;padding-top:56px}
.footer-brand{display:flex;gap:18px;align-items:flex-start}
.footer-brand p{margin:6px 0 0}
.footer-h{font-family:var(--font);font-size:1rem;font-variation-settings:'wdth' 100;font-weight:600;color:var(--brass);margin:0 0 12px}
.footer-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.footer-list a{text-decoration:none}
.footer-list a:hover{text-decoration:underline}
.site-footer .footer-fb{margin:0;width:auto;height:auto;display:inline-flex;align-items:center;gap:8px;border:0}
.site-footer .footer-fb svg{width:18px;height:18px}
.footer-base{display:flex;justify-content:space-between;gap:16px;margin-top:48px;padding-top:20px;border-top:1px solid #33373A;font-size:.85rem;color:#8E9592}
.site-footer{padding-bottom:28px}

@media (max-width:980px){
  .steps-grid,.area-grid,.offer-grid,.faq-grid,.svc-head-grid,.about-grid,.footer-grid{grid-template-columns:1fr;gap:32px}
  .step-list{grid-template-columns:1fr 1fr}
  .review-row{grid-template-columns:1fr;gap:32px}
  .cta-row{grid-template-columns:1fr;gap:20px}
  .service-list-wide{grid-template-columns:1fr 1fr}
  .lead-frame{aspect-ratio:4/3}
}
@media (max-width:720px){
  .offer-list,.service-list-wide{grid-template-columns:1fr}
  .steps,.reviews,.offer,.faq,.cta-band{padding:64px 0}
  .page-head{padding:40px 0 32px}
  .cta-band .actions{flex-wrap:wrap}
  .draft-bar{font-size:.8rem}
}

.gallery-simple{grid-template-columns:repeat(3,1fr);grid-auto-rows:300px}
.gallery-simple li:nth-child(n){grid-column:auto;grid-row:auto}
@media (max-width:720px){.gallery-simple{grid-template-columns:1fr 1fr;grid-auto-rows:200px}}
.gallery-home li:nth-child(8){grid-column:auto;grid-row:auto}