/* About Grout LC: hand-built static site (replaces WordPress + Elementor, Oct 2026) */
@font-face{font-family:"Cormorant Garamond";src:url(/assets/fonts/cormorant-garamond.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(/assets/fonts/eb-garamond.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Roboto";src:url(/assets/fonts/roboto.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --green:#40634F;
  --gray:#7A7A7A;
  --ink:#000;
  --ink-soft:#333;
  --bar:#404041;
  --rule:rgba(0,0,0,.5);
  --serif-head:"Cormorant Garamond",Georgia,serif;
  --serif-body:"EB Garamond",Georgia,serif;
  --sans-btn:"Roboto",Arial,sans-serif;
  --wrap:1140px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font:400 16px/1.7 Arial,Helvetica,sans-serif;color:#272626;background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:var(--green)}
a[href^="tel:"]{color:inherit;text-decoration:none;white-space:nowrap}
a[href^="tel:"]:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-family:var(--serif-head);font-weight:600;color:var(--green);line-height:1}
p{margin:0 0 30px}
:focus-visible{outline:2px solid #f4b942;outline-offset:2px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:#fff;color:#000;padding:10px 16px}
.skip:focus{left:10px;top:10px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Buttons */
.btn{display:inline-block;font:500 16px/1 var(--sans-btn);color:#fff;background:var(--green);padding:15px 30px;border-radius:50px;text-decoration:none;text-transform:uppercase;transition:filter .2s}
.btn:hover,.btn:focus-visible{filter:brightness(1.12)}
.btn--sm{font-size:15px;padding:12px 24px}
.btn--square{border-radius:4px;font-family:var(--serif-body);text-transform:none}

/* Header: transparent, over the hero */
.site-header{position:absolute;inset:0 0 auto;z-index:20}
.site-header .bar{display:flex;align-items:center;gap:20px;min-height:74px;padding:0 10px}
.logo img{width:165px}
.nav{flex:1;display:flex;justify-content:center}
.nav ul{list-style:none;margin:0;padding:0;display:flex}
.nav a{display:block;position:relative;padding:13px 20px;font:600 20px/1 var(--serif-head);color:#dedede;text-decoration:none}
.nav a::after{content:"";position:absolute;left:20px;right:20px;bottom:4px;height:3px;background:var(--green);opacity:0;transition:opacity .2s}
.nav a:hover::after,.nav a[aria-current="page"]::after{opacity:1}
.nav a:hover{color:#fff}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:0;border-radius:3px;background:rgba(255,255,255,.15);color:#fff;cursor:pointer;align-items:center;justify-content:center}
.burger svg{width:24px;height:24px}
.burger .i-close{display:none}
.burger[aria-expanded="true"] .i-open{display:none}
.burger[aria-expanded="true"] .i-close{display:block}
.drawer{display:none}
.drawer ul{list-style:none;margin:0;padding:0}
.drawer a{display:block;padding:20px 25px;font:600 20px/1 var(--serif-head);color:#33373d;text-align:center;text-decoration:none;background:#fff}
.drawer a[aria-current="page"],.drawer a:hover{background:#3f444b;color:#fff}

@media (max-width:1024px){
  .nav,.site-header .btn--sm{display:none}
  .burger{display:inline-flex}
  .logo img{width:340px}
  .site-header .bar{min-height:77px}
  .drawer.open{display:block}
}
@media (max-width:767px){.logo img{width:177px}}

/* Heroes */
.hero{position:relative;display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden;padding:40px 20px}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::before{content:"";position:absolute;inset:0;z-index:-1}
.hero h1{font-size:55px;color:#fff;max-width:1100px}
.hero--home{min-height:750px;background:#f8f8f8;isolation:isolate}
.hero--home::before{background:rgba(43,43,43,.43)}
.hero--home .btn{margin-top:20px}
.hero--page{min-height:550px;background:#0f0e0e;isolation:isolate}
.hero--page::before{background:rgba(15,14,14,.5)}

/* Home: intro */
.intro{text-align:center;padding:80px 20px 0}
.intro h2{font:500 35px/1 var(--serif-body);color:var(--ink);margin-bottom:20px}
.intro .call{font:700 28px/1.4 var(--serif-body);color:var(--gray);margin:0 0 50px}
.intro .call a{color:inherit;text-decoration:none}
.rule{border:0;border-top:1px solid var(--rule);margin:15px auto}
.rule--short{width:386px;max-width:80%;margin:15px auto 120px}
.rule--wide{width:890px;max-width:100%;margin:25px auto}
.services>.rule--wide:last-child{margin-bottom:15px}

/* Home: service rows */
.services{max-width:1120px;margin:0 auto;padding:0 20px}
.service{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:20px;min-height:301px;padding:10px 0}
.service img{width:300px;aspect-ratio:4/3;object-fit:cover;justify-self:center}
.service h2{font-size:35px;margin-bottom:20px}
.service p{font:400 20px/1.7 var(--serif-body);color:var(--ink-soft);margin-bottom:20px}
.service .more{font:400 20px/1.7 var(--serif-body);color:var(--green);text-decoration:none}
.service .more:hover{text-decoration:underline}

/* Home: reviews */
.reviews{text-align:center;padding:80px 20px 10px}
.reviews h2{font-size:32px;margin-bottom:20px}
.carousel{position:relative;max-width:1120px;margin:0 auto}
.slides{display:flex;align-items:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;width:calc(82% - 40px);margin:0 auto;scroll-behavior:smooth}
.slides::-webkit-scrollbar{display:none}
.review{flex:0 0 100%;scroll-snap-align:center;text-align:left;background:#fff;border:1px solid #e1e8ed;border-radius:5px;padding:15px}
.review h3{font:600 25px/1.5 var(--serif-head);color:#1c2022}
.stars{color:#f0ad4e;font-size:14px;letter-spacing:2px;line-height:1.5;margin-bottom:6px}
.review p{font:400 20px/1.05 var(--serif-body);color:#272626;margin:0;padding-top:6px}
.car-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;background:none;color:#ccc;cursor:pointer;font-size:30px;line-height:1}
.car-btn:hover{color:var(--green)}
.car-prev{left:0}.car-next{right:0}
.dots{display:flex;justify-content:center;gap:4px;margin:16px 0 24px}
.dots button{width:20px;height:20px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.dots button::before{content:"";width:6px;height:6px;border-radius:50%;background:#000;opacity:.2}
.dots button[aria-current="true"]::before{opacity:1}

/* Service pages */
.content{max-width:var(--wrap);margin:0 auto;padding:40px 10px 0}
.content h2{font-size:32px;line-height:1;margin-bottom:20px}
.content h3{font-size:28px;margin-bottom:20px}
.content p,.content li{font:400 20px/1.7 var(--serif-body);color:var(--ink)}
.content p{margin-bottom:30px}
.content strong{font-weight:700}
.content p+h3,.content img+h3{margin-top:20px}
.content .cols{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin:90px 60px 0}
.content .cols img{margin:0 0 30px}
.cta{text-align:center;padding:0 20px 10px;max-width:var(--wrap);margin:0 auto}
.cta p{font:400 20px/1.7 var(--serif-body);color:var(--ink);margin-bottom:30px}
.cta a{color:inherit}
.content .rule{width:81%;margin:35px auto}

/* Footer */
.site-footer{background:var(--green);color:#fff;padding:90px 20px}
.foot{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:433fr 707fr;gap:0}
.foot-brand{padding:0 20px;text-align:center}
.foot-brand img{width:237px;margin:0 auto 19px}
.foot-brand p{font:400 15px/1.7 var(--serif-body);margin:0 0 30px}
.foot-links{text-align:left}
.foot h2{font:500 25px/1 var(--serif-body);color:#fff;margin:0 0 20px}
.foot ul{list-style:none;margin:0 0 30px;padding:0 0 0 20px}
.foot li{font:400 13px/1.7 var(--serif-body);padding:2.5px 0}
.foot li a{color:#fff;text-decoration:none}
.foot li a:hover{text-decoration:underline}
.foot-contact{padding:0 20px}
.foot-contact h2 a{color:inherit;text-decoration:none}
.bottom{background:var(--bar);color:#fff;padding:10px 20px}
.bottom .row{max-width:var(--wrap);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:48px}
.bottom p{margin:0;font:300 15px/1.2 var(--serif-head)}
.bottom a{color:#fff;text-decoration:none}
.bottom a:hover{text-decoration:underline}
.copy{display:flex;align-items:center;gap:20px}
.social{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:10%;background:rgba(255,255,255,.21);color:#69727d}
.social svg{width:11px;height:11px;fill:currentColor}

/* 404 */
.notfound{text-align:center;padding:60px 20px}
.notfound p{font:400 20px/1.7 var(--serif-body)}
.notfound ul{list-style:none;padding:0;margin:0 0 20px;font:400 20px/2 var(--serif-body)}

/* Responsive */
@media (max-width:1024px){
  .content{padding:40px 20px 0}
  .foot{grid-template-columns:1fr 1fr}
  .foot-brand img{width:327px}
}
@media (max-width:767px){
  .hero{padding:90px 20px 40px}
  .intro .call{font-size:24px}
  .service{grid-template-columns:1fr;text-align:center;padding:30px 0}
  .content{padding:30px 20px 10px}
  .content .cols{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
  .foot-contact{padding:30px 0 0}
  .bottom .row{flex-direction:column;text-align:center;padding:10px 0}
  .copy{flex-direction:column;gap:10px}
  .slides{width:calc(100% - 60px)}
}

/* Contact form (shared swd-forms Worker) */
.swd-hp{position:absolute!important;left:-9999px!important}
[data-swd-form] [role=status]{min-height:1.2em;margin:0}
.swd-form{--swd-label:#fff;--swd-field-bg:#fff;--swd-field-fg:#000;--swd-border:#ceced2;--swd-btn-bg:#000;--swd-btn-fg:#fff;display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;font:16px/1.7 Arial,Helvetica,sans-serif;color:var(--swd-label)}
.swd-form>*{grid-column:1/-1}
.swd-form>.swd-half{grid-column:auto}
@media (max-width:479px){.swd-form>.swd-half{grid-column:1/-1}}
.swd-form label{display:grid;gap:6px;font-weight:700}
.swd-form input,.swd-form textarea{font:inherit;padding:10px 12px;border:1px solid var(--swd-border);border-radius:4px;background:var(--swd-field-bg);color:var(--swd-field-fg);width:100%}
.swd-form textarea{min-height:120px}
.swd-form label.swd-check{display:flex;gap:8px;align-items:flex-start;font-weight:400}
.swd-form label.swd-check input{width:auto;margin-top:.35em}
.swd-form button{font:inherit;font-weight:700;padding:10px 22px;border:0;border-radius:4px;cursor:pointer;background:var(--swd-btn-bg);color:var(--swd-btn-fg)}
.swd-form button:hover,.swd-form button:focus-visible{filter:brightness(1.3)}
.swd-form button:disabled{opacity:.6;cursor:wait}
.swd-form .cf-turnstile{min-height:65px}
