/* YYY&D Landscaping — site styles. Archivo variable (wght 100–900, wdth 62–125), one latin file. */
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:optional;src:url(https://fonts.gstatic.com/s/archivo/v25/k3kQo8UDI-1M0wlSfdnoLg.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

h1,h2,.display{font-stretch:125%;font-weight:800;letter-spacing:-.02em}
h3{font-weight:700}
.btn{font-weight:600;border-radius:var(--radius)}
.btn-outline{border-width:2px}

/* header */
.site-header{background:color-mix(in srgb,var(--bg) 92%,transparent)}
.brand img{height:52px;width:auto}
.brand span{font-stretch:112%;font-weight:800;font-size:1.05rem;line-height:1.05}
.brand small{display:block;font-weight:500;font-stretch:100%;font-size:.78rem;color:var(--ink-2)}
:root{--header-h:76px}
.nav a{color:var(--ink);font-weight:600}

/* hero */
.hero{padding-block:clamp(2rem,5vw,4.5rem) clamp(2.5rem,5vw,4rem)}
.hero-grid{display:grid;gap:var(--s-6);grid-template-columns:minmax(0,1fr);align-items:center}
@media(min-width:960px){.hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s-7)}}
.hero h1{font-size:clamp(2.2rem,1.4rem + 3.4vw,4rem);line-height:1.02;max-width:14ch;margin-bottom:var(--s-5)}
.hero .lede{color:var(--ink-2);max-width:48ch}
.hero .actions{margin-top:var(--s-5)}
.btn-wa{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-wa:hover{border-color:var(--brand)}
.btn-wa svg{color:#1d7a3c}

.ba{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:0;max-width:640px}
.ba figure{margin:0;position:relative}
.ba img{width:100%;height:auto;aspect-ratio:6/5;object-fit:cover;border-radius:var(--radius)}
.ba .tag{position:absolute;left:8px;top:8px;background:var(--ink);color:#fff;font-size:.8rem;font-weight:600;padding:.25em .6em;border-radius:3px}
.ba .tag.after{background:var(--brand)}
.ba .figcaption{margin:0;max-width:none;grid-column:1/-1;font-size:var(--fs-sm);color:var(--ink-2);margin-top:var(--s-2)}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:0;margin:var(--s-7) 0 0;border-top:2px solid var(--ink)}
.facts div{padding:var(--s-4) var(--s-4) var(--s-4) 0;border-bottom:1px solid var(--line)}
.facts dt{font-weight:800;font-stretch:115%;font-size:var(--fs-lg);line-height:1.1}
.facts dd{margin:.25em 0 0;color:var(--ink-2);font-size:var(--fs-sm)}

/* section heads */
.section h2{font-size:clamp(1.8rem,1.3rem + 2vw,2.8rem)}
.section-head p{color:var(--ink-2)}
.band{background:#fff}

/* what we build */
.build{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink);display:grid;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.build{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-7)}}
.build li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:var(--s-4);padding:var(--s-4) 0;border-bottom:1px solid var(--line);align-items:center}
.build img{width:112px;height:auto;aspect-ratio:6/5;object-fit:cover;border-radius:var(--radius)}
.build h3{font-size:var(--fs-lg);margin:0 0 .2em}
.build p{margin:0;color:var(--ink-2);font-size:var(--fs-sm)}

/* project wall: paver joints */
.wall{display:grid;gap:6px;grid-template-columns:repeat(2,minmax(0,1fr));max-width:1300px;margin-inline:auto}
@media(min-width:700px){.wall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1100px){.wall{grid-template-columns:repeat(4,minmax(0,1fr))}}
.wall img{width:100%;height:auto;aspect-ratio:6/5;object-fit:cover;border-radius:2px;background:#d9dcd5}
.wall-note{margin-top:var(--s-5);color:var(--ink-2);font-size:var(--fs-sm)}

/* one crew */
.crew{background:var(--ink);color:#e6e9e4}
.crew h2{color:#fff}
.crew p{color:#c9cec7}
.crew .quote{font-stretch:110%;font-weight:600;font-size:var(--fs-xl);line-height:1.3;color:#fff;max-width:30ch;margin:var(--s-5) 0 var(--s-2);padding-left:var(--s-4);border-left:4px solid var(--accent)}
.crew .src{font-size:var(--fs-sm);color:#aeb4ac}
.crew-grid{display:grid;gap:var(--s-6);grid-template-columns:minmax(0,1fr);align-items:center}
@media(min-width:960px){.crew-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.crew-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-width:640px}
.crew-photos img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.crew a{color:#fff}
.es{margin-top:var(--s-5);font-weight:600;color:#fff}
.es span{color:var(--accent)}

/* area + contact */
.contact-grid{display:grid;gap:var(--s-7);grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.reach{list-style:none;padding:0;margin:var(--s-5) 0;display:grid;gap:var(--s-3)}
.reach a{font-weight:700;font-size:var(--fs-lg);text-decoration:none}
.reach span{display:block;font-size:var(--fs-sm);color:var(--ink-2)}
.hours{margin-top:var(--s-4)}
.map{aspect-ratio:16/10;margin-top:var(--s-5);border-radius:var(--radius)}
.form-card{background:#fff;padding:clamp(1.25rem,3vw,2rem);border:1px solid var(--line);border-radius:var(--radius)}
.form-card h3{margin-bottom:var(--s-4)}
.form button{justify-self:start}
.form-success{background:#fff}

/* footer */
.site-footer{background:#151915}
.site-footer .brand img{height:64px}
.site-footer .brand span{color:#fff}

@media(max-width:860px){
  .nav .btn{color:#fff}
}
@media(max-width:480px){
  .hero .actions .btn{width:100%}
  .build li{grid-template-columns:88px minmax(0,1fr)}
  .build img{width:88px}
}