:root{--slate:#1f2f44;--slate2:#2c4260;--cream:#f5efe3;--cedar:#c9a577;--copper:#d4561f;--ink:#16202e}
img{max-width:100%;height:auto}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--cream);font-size:1.05rem}
h1,h2,h3,.display{font-family:'Bitter',serif;font-weight:800;letter-spacing:-.01em}
.eyebrow{font-family:'DM Sans',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--copper)}
.util{background:var(--ink);color:#fff;font-size:.85rem}
.util a{color:#fff;text-decoration:none;font-weight:600}
.util .em{color:var(--cedar)}
.navbar{background:var(--cream);border-bottom:3px solid var(--slate)}
.navbar-brand{font-family:'Bitter',serif;font-weight:800;color:var(--slate);font-size:1.35rem;line-height:1.05}
.navbar-brand small{display:block;font-family:'DM Sans',sans-serif;font-weight:700;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--copper)}
.nav-link{color:var(--slate);font-weight:600}
.nav-link:hover{color:var(--copper)}
.btn-copper{background:var(--copper);color:#fff;font-weight:700;border:0;border-radius:2px;padding:.8rem 1.5rem}
.btn-copper:hover{background:#b94716;color:#fff}
.btn-outline-slate{border:2px solid var(--slate);color:var(--slate);font-weight:700;border-radius:2px;padding:.75rem 1.5rem}
.btn-outline-slate:hover{background:var(--slate);color:#fff}
.hero{background:var(--slate);color:#fff;padding:3rem 0 4.5rem;position:relative}
.hero h1{font-size:clamp(2.3rem,5.2vw,4.1rem);line-height:1.05;color:#fff}
.hero h1 em{font-style:normal;color:var(--cedar)}
.hero p.lead{color:#e4e9f0;max-width:34rem}
.hero .eyebrow{color:var(--cedar)}
.hero-photo{border-radius:4px;border:6px solid var(--cream);width:100%;aspect-ratio:891/676;object-fit:cover;max-height:min(66vh,480px);object-position:center 60%}
.badges{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;font-size:.88rem;font-weight:600;color:#fff;margin:1.5rem 0 0;padding:0;list-style:none}
.badges li:before{content:"\25B2";color:var(--copper);margin-right:.45rem;font-size:.7rem}
/* signature: shingle courses */
.shingles{height:34px;background:
 radial-gradient(circle at 50% 0,var(--slate) 0 17px,transparent 18px) 0 0/34px 34px,
 radial-gradient(circle at 50% 0,var(--slate2) 0 17px,transparent 18px) 17px 17px/34px 34px;
 background-color:var(--cream)}
.shingles.flip{transform:scaleY(-1);background-color:var(--slate)}
.shingles.onslate{background:
 radial-gradient(circle at 50% 0,var(--cream) 0 17px,transparent 18px) 0 0/34px 34px,
 radial-gradient(circle at 50% 0,var(--cedar) 0 17px,transparent 18px) 17px 17px/34px 34px;background-color:var(--slate);transform:scaleY(-1)}
section{padding:4.5rem 0}
h2{font-size:clamp(1.9rem,3.8vw,2.8rem);color:var(--slate)}
.svc-list{list-style:none;padding:0;margin:0}
.svc-list li{padding:.55rem 0;border-bottom:1px solid rgba(31,47,68,.18);font-weight:500}
.svc-card{background:#fff;border-top:6px solid var(--copper);padding:1.8rem;height:100%}
.svc-card h3{font-size:1.4rem;color:var(--slate)}
.gal img{width:100%;aspect-ratio:2/1;object-fit:cover;border:5px solid #fff;border-radius:2px}
.band{background:var(--slate);color:#fff}
.band h2{color:#fff}
.quote{background:var(--slate2);border-left:5px solid var(--cedar);padding:1.4rem;height:100%;color:#fff}
.quote p{margin:0 0 .8rem}
.quote cite{font-style:normal;font-weight:700;color:var(--cedar);font-size:.9rem}
.stars{color:var(--cedar);letter-spacing:.15em}
.areas span{display:inline-block;border:2px solid var(--slate);padding:.3rem .8rem;margin:.25rem .15rem;font-weight:600;color:var(--slate);border-radius:2px;font-size:.95rem}
.contact-card{background:#fff;padding:2rem;border-top:6px solid var(--slate)}
.contact-card a{color:var(--copper);font-weight:700}
.map{border:0;width:100%;height:100%;min-height:340px}
footer{background:var(--ink);color:#cfd6e0;padding:2.5rem 0;font-size:.92rem}
footer a{color:#fff}
.radio{background:var(--cedar);padding:2.2rem 0}
.radio h2{font-size:1.5rem}
@media(max-width:575px){section{padding:3rem 0}.hero{padding:2rem 0 3.5rem}}
