:root{
  --site-accent: #c2811a;
  --site-ink: #24292e;
  --site-ink-soft: #6a6f73;
  --site-border: #e6e2da;
}
*{ box-sizing:border-box; }
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--site-ink);
  background:#fff;
}
a{ color: var(--site-accent); }
img{ max-width:100%; }

.site-topbar{
  border-bottom:1px solid var(--site-border);
  position:sticky; top:0; background:#fff; z-index:50;
}
.site-topbar-inner{
  max-width:1100px; margin:0 auto; padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.site-brand{
  font-weight:700; font-size:20px; text-decoration:none; color:var(--site-ink);
  display:flex; align-items:center; gap:8px;
}
.site-brand img{ height:32px; }

.site-nav{ list-style:none; display:flex; gap:22px; margin:0; padding:0; }
.site-nav li{ position:relative; }
.site-nav > li > a{
  text-decoration:none; color:var(--site-ink); font-size:15px; font-weight:500;
  padding:6px 2px; display:inline-block;
}
.site-nav > li > a:hover{ color:var(--site-accent); }
.site-nav li.has-children:hover > ul{ display:block; }
.site-nav li ul{
  display:none; position:absolute; top:100%; left:0; background:#fff;
  border:1px solid var(--site-border); border-radius:6px; min-width:180px;
  box-shadow:0 8px 20px rgba(0,0,0,.08); padding:6px; list-style:none; margin:4px 0 0;
}
.site-nav li ul li a{ display:block; padding:8px 10px; border-radius:4px; font-size:14px; }
.site-nav li ul li a:hover{ background:#faf6ef; }

.site-main{ min-height:60vh; }

.site-footer{ border-top:1px solid var(--site-border); margin-top:40px; }
.site-footer-inner{
  max-width:1100px; margin:0 auto; padding:24px; color:var(--site-ink-soft); font-size:14px; text-align:center;
}

/* Blog + catalog listing helpers, used outside the GrapesJS-authored page content */
.site-wrap{ max-width:1100px; margin:0 auto; padding:40px 24px; }
.site-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:20px; }
.site-card{
  border:1px solid var(--site-border); border-radius:8px; padding:18px; background:#fff;
}
.site-card h3{ margin:0 0 6px; font-size:17px; }
.site-card .meta{ color:var(--site-ink-soft); font-size:13px; margin-bottom:8px; }
.site-card .price{ font-weight:700; color:var(--site-accent); }
.site-empty{ color:var(--site-ink-soft); padding:40px 0; text-align:center; }


/* V2.25.12 - loose elements placed directly on a page (headings, text, links ...) were flush against the left edge.
   Give them the same centred 1100px column as the rest of the site; full-width sections / divs are not affected. */
.site-main > :where(h1,h2,h3,h4,h5,h6,p,ul,ol,blockquote,form,table,pre,img,hr){
  margin-left:auto; margin-right:auto; max-width:1100px; padding-left:24px; padding-right:24px;
}
.site-main > a{ display:block; width:fit-content; margin-left:max(0px, calc((100% - 1100px) / 2)); padding-left:24px; padding-right:24px; }


/* V2.26.0 - Products & Services lists ({{products_list}} / {{services_list}}) and the details page */
.wi-wrap{ width:100%; }
.wi-filter{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.wi-filter a{ padding:6px 14px; border:1px solid var(--site-border); border-radius:18px; text-decoration:none; color:var(--site-ink); font-size:14px; }
.wi-filter a.on, .wi-filter a:hover{ background:var(--site-accent); border-color:var(--site-accent); color:#fff; }
.wi-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px; }
.wi-card{ display:flex; flex-direction:column; border:1px solid var(--site-border); border-radius:10px; overflow:hidden; background:#fff; text-decoration:none; color:var(--site-ink); transition:box-shadow .15s, transform .15s; }
.wi-card:hover{ box-shadow:0 8px 22px rgba(0,0,0,.1); transform:translateY(-2px); }
.wi-img{ aspect-ratio:4/3; background:#f3f1ec; display:flex; align-items:center; justify-content:center; color:#a39a85; font-weight:600; overflow:hidden; }
.wi-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.wi-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.wi-body h3{ margin:0; font-size:18px; }
.wi-body p{ margin:0; color:var(--site-ink-soft); font-size:14.5px; line-height:1.5; }
.wi-cat{ font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--site-ink-soft); }
.wi-price{ font-weight:700; color:var(--site-accent); }
.wi-more{ margin-top:auto; padding-top:8px; font-size:14px; color:var(--site-accent); font-weight:600; }
.wi-detail-grid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:36px; align-items:start; margin-bottom:28px; }
@media (max-width:780px){ .wi-detail-grid{ grid-template-columns:1fr; } }
.wi-big{ background:#f3f1ec; border-radius:10px; overflow:hidden; } .wi-big img{ width:100%; display:block; }
.wi-thumbs{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.wi-thumbs img{ width:78px; height:62px; object-fit:cover; border-radius:6px; cursor:pointer; border:2px solid transparent; }
.wi-thumbs img.on{ border-color:var(--site-accent); }
.wi-info h1{ margin:4px 0 10px; font-size:32px; } .wi-lead{ font-size:17px; color:var(--site-ink-soft); line-height:1.55; }
.wi-btn{ display:inline-block; padding:11px 22px; background:var(--site-accent); color:#fff; border-radius:6px; text-decoration:none; font-weight:600; }
.wi-desc{ line-height:1.65; font-size:16px; } .wi-desc img{ max-width:100%; height:auto; border-radius:6px; } .wi-desc table{ border-collapse:collapse; } .wi-desc td, .wi-desc th{ border:1px solid var(--site-border); padding:6px 10px; }
