:root{--forest:#1f5c36;--navy:#1d2a55;--cream:#f6f1e6;--cedar:#c98a4b;--cedar-d:#a96d33;--ink:#20241f}
html{scroll-behavior:smooth;scroll-padding-top:120px}
body{font-family:'Karla',system-ui,sans-serif;color:var(--ink);background:var(--cream);font-size:1.06rem;line-height:1.65;overflow-x:hidden}
h1,h2,h3{font-family:'Zilla Slab',Georgia,serif;font-weight:700;line-height:1.1;color:var(--navy)}
h2{font-size:clamp(1.8rem,3.6vw,2.7rem);max-width:22ch}
a{color:var(--forest)}
.eyebrow{font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.8rem;color:var(--cedar-d);margin-bottom:.6rem}
.topbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:3px solid var(--forest)}
.brand{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;padding:.35rem 0 0}
.brand img{height:42px;width:auto}
.brand span{font-family:'Zilla Slab',serif;font-weight:700;font-size:1.45rem;color:var(--navy);letter-spacing:.01em}
.navbar{padding:0 0 .3rem}
.nav-link{font-weight:700;color:var(--ink);text-transform:uppercase;letter-spacing:.1em;font-size:.82rem;padding:.55rem 1rem!important}
.nav-link:hover{color:var(--forest)}
.nav-call{color:var(--forest)!important;border:2px solid var(--forest);border-radius:2px;padding:.35rem .9rem!important}
.navbar-toggler{border:0;font-weight:700;color:var(--navy)}
.hero{position:relative;background:linear-gradient(90deg,rgba(18,30,24,.88) 0%,rgba(18,30,24,.62) 55%,rgba(18,30,24,.25) 100%),url(img/kitchen.webp) center/cover;color:#fff;padding:clamp(3rem,8vw,6.5rem) 0 clamp(4rem,9vw,7rem)}
.hero-copy{max-width:640px}
.hero .eyebrow{color:#f0c58f}
.hero h1{color:#fff;font-size:clamp(2.4rem,6vw,4.4rem);margin-bottom:1rem}
.hero .lead{font-size:1.2rem;margin-bottom:1.6rem;color:#f3efe6}
.btn{font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;border-radius:2px;padding:.85rem 1.5rem}
.btn-cedar{background:var(--cedar);color:#1b1408;border:2px solid var(--cedar)}
.btn-cedar:hover{background:var(--cedar-d);border-color:var(--cedar-d);color:#fff}
.btn-line{border:2px solid rgba(255,255,255,.7);color:#fff}
.btn-line:hover{background:#fff;color:var(--navy)}
.btn-dark-solid{background:var(--navy);color:#fff;border:2px solid var(--navy)}
.btn-dark-solid:hover{background:#111b3d;color:#fff}
.btn-line-dark{border:2px solid var(--navy);color:var(--navy)}
.btn-line-dark:hover{background:var(--navy);color:#fff}
/* signature: courses of cedar shingles */
.shingles{position:absolute;left:0;right:0;bottom:-1px;height:34px;background:
 radial-gradient(circle at 50% 0,var(--cream) 0 15px,transparent 16px) 0 0/32px 34px repeat-x,
 radial-gradient(circle at 50% 0,var(--cedar) 0 17px,transparent 18px) 16px 6px/32px 34px repeat-x}
.sec{padding:clamp(3.5rem,8vw,6rem) 0}
.sec-dark{background:var(--navy);color:#e8e9f0}
.sec-dark h2{color:#fff}.sec-dark .eyebrow{color:#f0c58f}
.intro{max-width:62ch;font-size:1.1rem}
.frame{box-shadow:14px 14px 0 var(--cedar);border-radius:2px;overflow:hidden;margin:0 14px 14px 0}
.frame img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
blockquote{border-left:4px solid var(--cedar);padding:.2rem 0 .2rem 1.2rem;margin:1.6rem 0 0;font-family:'Zilla Slab',serif;font-size:1.3rem;color:var(--forest)}
blockquote cite{display:block;font-family:'Karla',sans-serif;font-style:normal;font-size:.9rem;color:var(--ink);margin-top:.4rem}
.shot{margin:0;border:6px solid #fff;border-radius:2px}
.shot img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.shot-cta{flex:1;border:2px dashed rgba(240,197,143,.7);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1rem;padding:2rem}
.shot-cta p{font-family:'Zilla Slab',serif;font-size:1.7rem;color:#fff;margin:0;line-height:1.15}
.cutlist{list-style:none;padding:0;margin:0;counter-reset:none}
.cutlist li{font-family:'Zilla Slab',serif;font-weight:700;font-size:clamp(1.5rem,3vw,2.1rem);color:var(--navy);padding:.55rem 0;border-bottom:2px solid rgba(29,42,85,.18);display:flex;align-items:baseline;gap:.6rem}
.cutlist li::before{content:"";flex:0 0 .9rem;height:.5rem;background:var(--cedar);transform:translateY(-.15em)}
.cutlist small{font-family:'Karla',sans-serif;font-weight:500;font-size:.9rem;color:var(--ink)}
.steps h3{font-size:1.5rem;color:var(--forest);margin-bottom:.3rem}
.steps div{margin-bottom:1.5rem;padding-left:1.1rem;border-left:4px solid var(--cedar)}
.steps p{margin:0}
.sec-cedar{background:#ecd9bd}
.sec-cedar a:not(.btn){color:var(--navy)}
.contact-list{list-style:none;padding:0;margin:1.2rem 0 0}
.contact-list li{padding:.6rem 0;border-bottom:1px solid rgba(29,42,85,.22);font-size:1.15rem}
.contact-list span{display:inline-block;min-width:6.5rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;color:var(--cedar-d)}
.map{width:100%;height:100%;min-height:340px;border:0;border-radius:2px}
.foot{background:var(--forest);color:#e9f1ec;padding:1.8rem 0;font-size:.95rem}
.foot img{background:#fff;padding:4px;border-radius:2px;height:44px;width:auto}
.foot a{color:#fff}
@media(max-width:991px){.brand span{font-size:1.15rem}.navbar-nav{padding:.5rem 0;text-align:center}.nav-call{display:inline-block}}
@media(max-width:575px){.hero{background-position:60% center}.btn{width:100%;text-align:center}.shot-cta{padding:1.4rem}}
