:root{--cream:#eae6e1;--sand:#e5e0da;--olive:#7e7b46;--brown:#583b1f;--lav:#c2bfcb;--hf:'Manrope',sans-serif;--bf:'Nunito Sans',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sand);color:var(--olive);font:400 16px/1.5 var(--bf);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--hf);font-weight:500;letter-spacing:-.007em;margin:0 0 .6em;line-height:1.2}
h1{font-size:clamp(2.6rem,5vw,4.24rem)}
h2{font-size:clamp(2rem,3.4vw,2.94rem)}
h3{font-size:clamp(1.6rem,2.6vw,2.3rem)}
h4{font-size:clamp(1.3rem,1.9vw,1.65rem)}
p{margin:0 0 1em}
strong{font-weight:700}

/* header */
.site-header{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.6rem clamp(1.2rem,2.2vw,2.2rem);flex-wrap:wrap}
.site-title{font-family:var(--hf);font-weight:500;font-size:clamp(1.05rem,1.5vw,1.3rem);text-decoration:none;color:var(--olive)}
.site-header nav{display:flex;gap:clamp(1rem,2vw,1.8rem)}
.site-header nav a{text-decoration:none;font-size:.95rem;padding-bottom:2px;border-bottom:1px solid transparent}
.site-header nav a:hover,.site-header nav a.active{border-bottom-color:currentColor}
body:has(.post,.blog-list) .site-header{position:static;background:var(--cream)}

/* buttons */
.btn{display:inline-block;background:var(--olive);color:var(--cream);text-transform:uppercase;text-decoration:none;padding:1.15rem 2rem;border-radius:300px;border:0;font:400 1rem/1.2 var(--bf);cursor:pointer;text-align:center;transition:opacity .2s,transform .2s}
.btn:hover{opacity:.88}
.btn-cream{background:var(--cream);color:var(--brown)}
.btn-cream-brown{background:var(--cream);color:var(--brown)}
.btn-brown{background:var(--brown);color:var(--lav)}

/* hero */
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:min(100vh,1100px);background:var(--cream);padding-top:5.4rem}
.hero-text{align-self:center;text-align:center;padding:3rem clamp(1.5rem,5vw,4.5rem) 4rem;max-width:760px;margin:0 auto}
.hero-text h2{font-size:clamp(2.2rem,3.7vw,3.3rem);line-height:1.1}
.hero-text p{margin-bottom:1em}
.hero-text p strong:only-child{display:block}
.hero-text p:first-of-type{color:var(--brown)}
.hero-text .btn{margin-top:.6rem}
.hero-img{min-height:360px}
.hero-img img{width:100%;height:100%;object-fit:cover}

/* bands */
.band{padding:clamp(3.5rem,8vw,7rem) clamp(1.2rem,4vw,3rem)}
.cream{background:var(--cream)}.olive{background:var(--olive);color:var(--cream)}.lav{background:var(--lav);color:var(--brown)}.brown{background:var(--brown);color:var(--cream)}
.narrow{max-width:700px;margin:0 auto;text-align:center}
.highlights h3:nth-of-type(-n+2){color:var(--olive)}
.highlights h3:nth-of-type(n+3),.highlights h4{color:var(--brown)}
.highlights h3:nth-of-type(2){margin-bottom:2.2rem}
.highlights p,.highlights h3~h3{color:var(--brown)}
.highlights h3:first-child,.highlights h3:nth-child(2){color:var(--olive)}
.highlights h4{margin-top:1.6em}
.highlights p{color:var(--brown)}
.highlights .narrow>h3:nth-of-type(n+3){margin-top:1.4em}

/* about */
.pair{position:relative;max-width:1000px;margin:0 auto 3.5rem;height:clamp(380px,48vw,620px)}
.pair img{position:absolute;object-fit:cover;border-radius:2px}
.p1{left:6%;top:0;width:38%;height:78%}
.p2{right:10%;bottom:0;width:36%;height:82%}
.cta-line p{color:var(--cream);font-size:1.15rem}
.cta-line{margin-bottom:5rem}
.about-text h2{color:var(--cream);margin-bottom:1.2rem}
.about-text h3{color:var(--cream);margin-top:1.8em}
.about-text p{text-align:center}
.about-text ul{text-align:left;max-width:620px;margin:1.2rem auto;padding-left:1.4rem}
.about-text li p{margin:0 0 .4em;text-align:left}

/* services */
.services h1{color:var(--olive);margin-bottom:1.4rem}
.services h4{color:var(--brown);margin:2.2rem 0 .4rem}
.services h4+p{margin-bottom:.5rem}
.services .btn{margin-top:2rem}

/* FAQ */
.faq h3{color:var(--brown);margin-bottom:2rem}
.faq .narrow{text-align:left}
.faq h3{text-align:center}
.qa{border-top:1px solid rgba(88,59,31,.55);padding:1.1rem 0}
.qa:last-child{border-bottom:1px solid rgba(88,59,31,.55)}
.qa summary{list-style:none;cursor:pointer;font:500 clamp(1.15rem,1.7vw,1.5rem)/1.3 var(--hf);color:var(--brown);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-size:1.8rem;line-height:1;transition:transform .2s}
.qa[open] summary::after{transform:rotate(45deg)}
.qa p{font-size:.9rem;margin:1rem 0 0;color:var(--brown)}
.qa .btn{margin-top:1.2rem;font-size:.9rem;padding:.9rem 1.6rem}

/* contact */
.contact-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:3rem 4rem;align-items:start}
.contact-info h2{color:var(--cream)}
.contact-info p{margin:.3rem 0 .9rem}
.contact-info a{color:var(--lav)}
.contact-img{grid-row:span 1}
.contact-img img{width:100%;max-width:420px;margin:0 auto;object-fit:cover;border-radius:2px}
.contact-form-wrap{grid-column:1/-1;max-width:640px;margin:1rem auto 0;width:100%}
.contact-form fieldset{border:0;padding:0;margin:0 0 1.2rem}
.contact-form legend,.contact-form label.f{display:block;padding:0;margin-bottom:.4rem}
.contact-form label.f{margin-bottom:1.2rem}
.contact-form small{font-size:.85rem;opacity:.85;display:block;margin-top:.15rem}
.contact-form label.f small{display:inline;margin:0}
.contact-form .two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-form input,.contact-form textarea{width:100%;margin-top:.4rem;padding:.8rem .9rem;background:transparent;border:1px solid var(--cream);color:var(--cream);font:inherit;border-radius:0}
.contact-form .two input{margin-top:0}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--lav);outline-offset:1px}
.contact-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-status{margin:1rem 0 0;min-height:1.5em}

/* footer */
.site-footer{background:var(--sand);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:2.4rem clamp(1.2rem,4vw,4rem)}
.foot-logo1 img{width:226px;max-width:100%;margin-left:auto;margin-right:2rem}
.foot-text h2{font-size:clamp(1.6rem,3vw,2.94rem);margin:0 0 .3rem}
.foot-text p{font-size:.9rem;margin:0}
.foot-logo2 img{width:154px;margin-left:auto}

/* blog list */
.blog-list{min-height:70vh}
.cards{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2.5rem}
.card img{width:100%;aspect-ratio:3/2;object-fit:cover}
.card-body{padding-top:1rem}
.meta{font-size:.85rem;opacity:.85;margin:0 0 .5rem}
.card h2{font-size:1.6rem;margin:.2rem 0 .8rem}
.card h2 a,.more{text-decoration:none}
.more{text-transform:uppercase;font-size:.85rem;border-bottom:1px solid currentColor}

/* post */
.post-wrap{max-width:720px;margin:0 auto}
.post-head{text-align:center;margin-bottom:2rem}
.post-img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:2.5rem}
.post-body h2{font-size:clamp(1.6rem,2.6vw,2.2rem);margin:1.8em 0 .5em}
.post-body li p{margin:0 0 .5em}
.post-body ul,.post-body ol{padding-left:1.5rem}
.post-body a{text-decoration:underline}
.pn{max-width:720px;margin:4rem auto 0;display:flex;justify-content:space-between;gap:2rem;border-top:1px solid rgba(126,123,70,.4);padding-top:2rem}
.pn a{text-decoration:none;max-width:45%}
.pn a:last-child{text-align:right;margin-left:auto}
.pn small{display:block;text-transform:uppercase;font-size:.75rem;opacity:.8}
.pn span{font:500 1.15rem/1.3 var(--hf)}

@media (max-width:860px){
 .hero{grid-template-columns:1fr;padding-top:7rem}
 .hero-img{order:2;min-height:420px}
 .hero-text{padding-bottom:3rem}
 .pair{height:clamp(320px,90vw,520px)}
 .p1{left:0;width:50%}.p2{right:0;width:48%}
 .contact-grid{grid-template-columns:1fr}
 .contact-form .two{grid-template-columns:1fr}
 .site-footer{grid-template-columns:1fr;text-align:center}
 .foot-logo1 img,.foot-logo2 img{margin:0 auto}
 .pn{flex-direction:column}.pn a{max-width:100%}.pn a:last-child{text-align:left;margin-left:0}
}

/* hero logo */
.hero-logo{width:clamp(230px,23vw,320px);height:auto;margin:0 auto 1rem;position:relative;top:-5.5rem}
