:root{ --teal:#20555F; --off:#EDECEC; --text:#3d4749; --ink:#161d1f; --mint:#9fd6c3; }
  *{ box-sizing:border-box; }
  body{ margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--text); background:#fff; line-height:1.5; }
  a{ text-decoration:none; color:inherit; }
  .wrap{ max-width:1080px; margin:0 auto; padding:0 20px; }

  header{ border-bottom:1px solid #e4e4e1; position:sticky; top:0; background:#fff; z-index:10; }
  header .wrap{ display:flex; align-items:center; justify-content:space-between; height:72px; }
  header img{ height:38px; display:block; }
  header nav{ display:flex; gap:26px; font-size:14.5px; font-weight:600; }
  header nav a{ padding:6px 0; border-bottom:2px solid transparent; }
  header nav a:hover, header nav a.active{ color:var(--teal); border-color:var(--teal); }
  header nav a.nav-cta{ padding:9px 18px; margin-left:4px; border:1.5px solid var(--teal); font-size:14px; }
  header nav a.nav-cta:hover{ color:var(--off); opacity:.9; }
  .menu-btn{ display:none; background:none; border:1.5px solid var(--teal); color:var(--teal); border-radius:8px; padding:8px 12px; font:inherit; font-weight:600; cursor:pointer; }
  @media (max-width:860px){
    .menu-btn{ display:block; }
    header nav{ display:none; position:absolute; top:72px; left:0; right:0; background:#fff; flex-direction:column; gap:0; border-bottom:1px solid #e4e4e1; padding:8px 20px 14px; }
    header nav.open{ display:flex; }
    header nav a{ padding:12px 0; border-bottom:1px solid #eee; }
    header nav a.nav-cta{ margin:12px 0 0; justify-content:center; padding:13px 24px; }
  }

  .btn{ display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:8px; font-weight:600; font-size:15px; border:1.5px solid transparent; }
  .btn-primary{ background:var(--teal); color:var(--off); }
  .btn-onteal{ background:var(--off); color:var(--teal); }
  .btn-outline{ border-color:var(--teal); color:var(--teal); }

  /* Section 1: project owner */
  .owner{ background:var(--off); padding:56px 0 48px; }
  .kicker{ text-transform:uppercase; letter-spacing:.07em; font-size:12.5px; font-weight:700; color:var(--teal); }
  h1,h2{ color:var(--ink); margin:6px 0 8px; line-height:1.2; }
  h1{ font-size:34px; } h2{ font-size:28px; }
  .lede{ margin:0 0 28px; max-width:56ch; }
  .cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .card{ background:#fff; border:1px solid #d5d3cc; border-radius:16px; padding:28px; display:flex; flex-direction:column; gap:10px; transition:border-color .15s, transform .15s; }
  .card:hover{ border-color:var(--teal); transform:translateY(-2px); }
  .card .icon{ width:48px; height:48px; border-radius:10px; background:var(--teal); color:#fff; display:grid; place-items:center; font-weight:800; font-size:20px; }
  .card h3{ margin:4px 0 0; font-size:20px; color:var(--ink); }
  .card p{ margin:0; font-size:14.5px; flex:1; }
  .card .go{ font-size:14px; font-weight:700; color:var(--teal); margin-top:6px; }
  .card.feature{ background:var(--teal); border-color:var(--teal); }
  .card.feature h3{ color:#fff; } .card.feature p{ color:#c9d6d3; } .card.feature .go{ color:var(--mint); }
  .card.feature .icon{ background:var(--off); color:var(--teal); }
  .store-strip{ margin-top:22px; font-size:14.5px; }
  .store-strip a{ color:var(--teal); font-weight:700; border-bottom:1.5px solid var(--teal); }
  @media (max-width:820px){ .cards{ grid-template-columns:1fr; } h1{ font-size:28px; } }

  /* Section 2: carpenters */
  .carp{ background:var(--teal); padding:56px 0; }
  .carp .wrap{ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; }
  .carp .kicker{ color:var(--mint); } .carp h2{ color:#fff; } .carp p{ color:#c9d6d3; margin:0 0 20px; }
  .carp .btns{ display:flex; gap:12px; flex-wrap:wrap; }
  .carp .btn-outline{ border-color:var(--off); color:var(--off); }
  .facts{ display:flex; flex-direction:column; gap:10px; }
  .fact{ background:rgba(237,236,236,.08); border:1px solid rgba(237,236,236,.25); border-radius:12px; padding:14px 18px; color:var(--off); font-size:14px; }
  @media (max-width:820px){ .carp .wrap{ grid-template-columns:1fr; } }

  footer{ padding:28px 0; font-size:13.5px; }
  footer .wrap{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
  .note{ background:#fff8e1; border-bottom:1px solid #eadfae; font-size:12.5px; padding:6px 0; text-align:center; color:#6b5b1a; }

/* ---------- Product pages (Timber / UltraSpan) ---------- */
.crumbs{ font-size:13px; padding:14px 0 0; color:#6b7577; }
.crumbs a{ color:var(--teal); font-weight:600; }
.phero{ background:var(--off); }
.phero .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; padding-top:40px; padding-bottom:48px; }
.phero p{ margin:0 0 22px; font-size:17px; max-width:52ch; }
.phero .img{ border-radius:16px; min-height:320px; background-size:cover; background-position:center; }
.cta-row{ display:flex; gap:12px; flex-wrap:wrap; }
.tag{ display:inline-block; background:var(--teal); color:var(--off); border-radius:20px; padding:4px 12px; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; margin-bottom:12px; }
section.block{ padding:52px 0; }
section.block.alt{ background:var(--off); }
.lead{ max-width:64ch; margin:0 0 28px; font-size:16.5px; }
.grid4{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tile{ background:#fff; border:1px solid #d5d3cc; border-radius:14px; padding:22px; }
.alt .tile{ border-color:#dcdad2; }
.tile h3{ margin:0 0 6px; font-size:17px; color:var(--ink); }
.tile p{ margin:0; font-size:14.5px; }
.num{ display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--teal); color:#fff; font-weight:800; font-size:14px; margin-bottom:10px; }
.stat{ text-align:center; }
.stat b{ display:block; font-size:34px; color:var(--teal); line-height:1.1; }
.stat span{ font-size:13.5px; }
.viewer{ width:100%; height:380px; border:1px solid #e4e4e1; border-radius:14px; display:block; background:#fff; }
.viewer-note{ font-size:13px; color:#6b7577; margin:8px 0 0; }
.facts-list{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.facts-list li{ padding-left:26px; position:relative; }
.facts-list li:before{ content:""; position:absolute; left:0; top:.5em; width:12px; height:12px; border-radius:3px; background:var(--teal); }
.strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.strip div{ height:200px; border-radius:12px; background-size:cover; background-position:center; }
.row-between{ display:flex; justify-content:space-between; align-items:end; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.row-between h2{ margin:0; }
.band{ background:var(--teal); padding:52px 0; text-align:center; }
.band h2{ color:#fff; margin:0 0 8px; } .band p{ color:#c9d6d3; margin:0 0 22px; }
.band .cta-row{ justify-content:center; }
.band a.textlink{ color:var(--off); border-bottom:1.5px solid var(--off); font-weight:600; font-size:14.5px; align-self:center; }
.pills{ display:flex; flex-wrap:wrap; gap:10px; }
.pill{ font-size:13px; color:var(--teal); border:1px solid var(--teal); border-radius:20px; padding:7px 15px; background:#fff; }
.btn-onwhite{ background:#fff; color:var(--teal); }
.shop-note{ font-size:14.5px; margin-top:20px; }
.shop-note a{ color:var(--teal); font-weight:700; border-bottom:1.5px solid var(--teal); }
@media (max-width:860px){
  .phero .wrap{ grid-template-columns:1fr; }
  .phero .img{ min-height:220px; order:-1; }
  .grid4{ grid-template-columns:1fr 1fr; }
  .grid3, .strip{ grid-template-columns:1fr; }
  .viewer{ height:300px; }
}

/* Cart link in the header (added by site.js) */
.cart-link{ display:inline-flex; align-items:center; gap:6px; }
.cart-link .cart-count{ background:#00AEEF; color:#062b33; border-radius:11px; min-width:20px; height:20px; padding:0 6px; font-size:12px; font-weight:800; display:inline-grid; place-items:center; line-height:1; }
@media (max-width:860px){ .cart-link{ display:flex; } }