.ub-strip{--ub-g:#008752;--ub-o:#DB7100;--ub-ink:#12211b;--ub-ink2:#5a6a62;--ub-line:#e3e8e4;--ub-panel:#fff}
.ub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.ub-card{display:block;text-decoration:none;color:inherit;background:var(--ub-panel);border:1px solid var(--ub-line);
 border-radius:14px;overflow:hidden;transition:transform .16s ease,box-shadow .16s ease}
.ub-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(18,33,27,.13)}
.ub-card img{display:block;width:100%;height:210px;object-fit:cover;background:#eef2ef}
.ub-card__body{display:block;padding:13px 15px 16px}
.ub-card__tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:7px}
.ub-card__tags b,.ub-card__tags i{font-family:'Roboto Condensed',Arial,sans-serif;font-style:normal;font-size:11px;
 font-weight:700;text-transform:uppercase;letter-spacing:.4px;padding:4px 9px;border-radius:999px}
.ub-card__tags b{background:var(--ub-g);color:#fff}
.ub-card__tags i{background:#eef2ef;color:var(--ub-ink2)}
.ub-card__title{display:block;font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;font-size:18px;
 line-height:1.25;color:var(--ub-ink)}
.ub-card__meta{display:block;font-size:12.5px;color:#7d8d85;margin-top:5px}
.ub-more{display:inline-block;margin-top:22px;background:var(--ub-g);color:#fff;text-decoration:none;
 font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
 padding:13px 28px;border-radius:11px;font-size:15px}
.ub-more:hover{background:#006e43}
/* map */
.ub-map{--ub-g:#008752;--ub-o:#DB7100}
.ub-map svg{display:block;width:100%;height:auto;background:#eef2ee;border-radius:14px;border:1px solid #e3e8e4}
.ub-map .g line{stroke:#dfe6e0;stroke-width:1}
.ub-map .ring{fill:none;stroke:#dfe6e0;stroke-width:1.4;stroke-dasharray:5 6}
.ub-pin .d{fill:var(--ub-g);opacity:.88}
.ub-pin .h{fill:var(--ub-g);opacity:.13}
.ub-pin:hover .d{fill:var(--ub-o);opacity:1}
.ub-pin:hover .h{fill:var(--ub-o);opacity:.24}
.ub-lbl{fill:#5a6a62;font-size:12px;text-anchor:middle;font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;pointer-events:none}
.ub-hq{fill:var(--ub-o)}
.ub-hqlbl{fill:var(--ub-o);font-size:12.5px;font-weight:700;text-anchor:middle;font-family:'Roboto Condensed',Arial,sans-serif}
.ub-towns{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px}
.ub-towns a{display:block;background:#fff;border:1px solid #e3e8e4;border-radius:9px;
 padding:8px 12px;text-decoration:none;color:#12211b;font-size:14px}
.ub-towns a:hover{border-color:#008752}
.ub-towns span{color:#7d8d85;font-size:12.5px}

/* ============ project & town pages ============ */
.ub-crumb{font-size:13.5px;color:#78877f;margin:0 0 10px}
.ub-crumb a{color:#008752;text-decoration:none}
.ub-crumb a:hover{text-decoration:underline}
.ub-crumb span{margin:0 5px;color:#b6c1ba}
.ub-draftflag{background:#fff5e6;border:1px solid #f0d3a4;color:#8a5200;border-radius:9px;
 padding:9px 13px;font-size:13.5px;display:inline-block;margin:0 0 12px}
.page-head h1{font-size:clamp(24px,4.2vw,40px);line-height:1.18;margin:6px 0 0;
 word-break:normal;overflow-wrap:break-word;hyphens:none}
.ub-project{padding:6px 0 48px}
.ub-h2{font-family:'Roboto Condensed',Arial,sans-serif;font-size:clamp(19px,2.6vw,26px);
 margin:34px 0 14px;text-transform:uppercase;letter-spacing:.3px}
.ub-facts{list-style:none;margin:18px 0 22px;padding:0;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.ub-facts li{background:#f4f6f4;border:1px solid #e3e8e4;border-radius:10px;padding:10px 13px}
.ub-facts span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#78877f;margin-bottom:2px}
.ub-facts b{font-size:15px;font-weight:700;color:#12211b}
.ub-facts em{display:block;font-style:normal;font-size:11.5px;color:#78877f;margin-top:1px}
.ub-copywrap{max-width:70ch}
.ub-copywrap p{font-size:16px;line-height:1.65;margin:0 0 13px;color:#2c3a33}
.ub-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.ub-shot{display:block;border-radius:11px;overflow:hidden;background:#eef2ef;line-height:0;border:1px solid #e3e8e4}
.ub-shot img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .25s ease}
.ub-shot:hover img{transform:scale(1.045)}
@media(max-width:640px){
  .ub-gallery{grid-template-columns:repeat(2,1fr);gap:9px}
  .ub-shot img{height:128px}
  .ub-facts{grid-template-columns:repeat(2,1fr)}
  .ub-card img{height:170px}
}
.ub-cta{display:flex;flex-wrap:wrap;gap:12px;margin:34px 0 0}
.ub-btn{display:inline-block;background:#008752;color:#fff;text-decoration:none;
 font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;text-transform:uppercase;
 letter-spacing:.5px;padding:14px 26px;border-radius:11px;font-size:15px}
.ub-btn:hover{background:#006e43}
.ub-btn--ghost{background:transparent;color:#008752;border:2px solid #008752;padding:12px 24px}

/* ============ horizontal carousel (3 up, swipe sideways) ============ */
.ub-carousel{position:relative}
.ub-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 40px)/3);
 gap:20px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
 scroll-padding-left:0;padding:4px 2px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.ub-rail::-webkit-scrollbar{display:none}
.ub-rail>.ub-card{scroll-snap-align:start}
.ub-nav{position:absolute;top:calc(50% - 46px);transform:translateY(-50%);z-index:3;
 width:44px;height:44px;border-radius:50%;border:1px solid #e3e8e4;background:#fff;
 color:#12211b;font-size:20px;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(18,33,27,.16);
 display:flex;align-items:center;justify-content:center;transition:opacity .15s,background .15s}
.ub-nav:hover{background:#f4f6f4}
.ub-nav:disabled{opacity:.28;cursor:default}
.ub-nav--prev{left:-14px}
.ub-nav--next{right:-14px}
.ub-dots{display:flex;justify-content:center;gap:7px;margin-top:4px}
.ub-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#cdd8d1;cursor:pointer}
.ub-dots button.on{background:#008752;width:22px;border-radius:4px}
@media(max-width:1024px){.ub-rail{grid-auto-columns:calc((100% - 20px)/2)}}
@media(max-width:640px){
  .ub-rail{grid-auto-columns:82%;gap:12px}
  .ub-nav{display:none}
}

/* ============ zoomable map ============ */
.ub-map{position:relative}
/* let the page scroll normally when the map is at rest; only capture gestures once
   the visitor has actually zoomed in, so a finger on the map never traps the scroll */
.ub-map svg{touch-action:pan-y;cursor:default}
.ub-map.is-zoomed svg{touch-action:none}
.ub-map.is-zoomed svg{cursor:grab}
.ub-map.is-dragging svg{cursor:grabbing}
.ub-mapctl{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:6px;z-index:3}
.ub-mapctl button{width:38px;height:38px;border-radius:10px;border:1px solid #e3e8e4;background:#fff;
 color:#12211b;font-size:19px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(18,33,27,.14);
 display:flex;align-items:center;justify-content:center;font-family:'Roboto Condensed',Arial,sans-serif}
.ub-mapctl button:hover{background:#f4f6f4;border-color:#008752}
.ub-mapctl button[data-act=reset]{font-size:13px;font-weight:700}
.ub-maphint{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.9);
 border:1px solid #e3e8e4;border-radius:8px;padding:5px 10px;font-size:12px;color:#5a6a62;pointer-events:none}
@media(max-width:640px){.ub-maphint{font-size:11px;padding:4px 8px}.ub-mapctl button{width:34px;height:34px}}

/* ============ album index filters ============ */
.ub-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:22px 0 18px}
.ub-filter{display:flex;flex-direction:column;gap:4px;font-size:12px;text-transform:uppercase;
 letter-spacing:.5px;color:#78877f;font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700}
.ub-filter select{font:inherit;font-size:14px;text-transform:none;letter-spacing:0;color:#12211b;
 background:#fff;border:1px solid #e3e8e4;border-radius:9px;padding:9px 12px;min-width:170px}
.ub-count{margin-left:auto;color:#78877f;font-size:13.5px}
@media(max-width:640px){.ub-count{margin-left:0;width:100%}.ub-filter select{min-width:0;width:100%}.ub-filter{flex:1}}

/* ============ collapsible town list ============ */
.ub-townbox{margin-top:18px;border:1px solid #e3e8e4;border-radius:12px;background:#fff;overflow:hidden}
.ub-townbox>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
 padding:14px 16px;font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;font-size:16px;
 color:#12211b;text-transform:uppercase;letter-spacing:.4px}
.ub-townbox>summary::-webkit-details-marker{display:none}
.ub-townbox>summary em{font-style:normal;font-weight:400;font-size:12.5px;letter-spacing:0;
 text-transform:none;color:#78877f}
.ub-townbox>summary::after{content:"";margin-left:auto;width:9px;height:9px;flex:0 0 auto;
 border-right:2px solid #008752;border-bottom:2px solid #008752;transform:rotate(45deg) translateY(-2px);
 transition:transform .18s ease}
.ub-townbox[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.ub-townbox>summary:hover{background:#f4f6f4}
.ub-townbox .ub-towns{margin:0;padding:4px 14px 16px;max-height:340px;overflow-y:auto}
@media(max-width:640px){.ub-townbox .ub-towns{grid-template-columns:1fr;max-height:300px}}

/* town-list pagination */
.ub-townpg{display:flex;align-items:center;justify-content:center;gap:14px;padding:0 14px 14px}
.ub-townpg button{width:34px;height:34px;border-radius:9px;border:1px solid #e3e8e4;background:#fff;
 color:#12211b;font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ub-townpg button:hover:not(:disabled){background:#f4f6f4;border-color:#008752}
.ub-townpg button:disabled{opacity:.3;cursor:default}
.ub-townpg span{font-size:13px;color:#78877f;font-variant-numeric:tabular-nums;min-width:96px;text-align:center}
.ub-townbox .ub-towns{max-height:none;overflow:visible}

/* project-grid pagination */
.ub-pager{display:flex;align-items:center;justify-content:center;gap:16px;margin:26px 0 4px}
.ub-pager:empty{display:none}
.ub-pager button{width:42px;height:42px;border-radius:11px;border:1px solid #e3e8e4;background:#fff;
 color:#12211b;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ub-pager button:hover:not(:disabled){background:#f4f6f4;border-color:#008752}
.ub-pager button:disabled{opacity:.3;cursor:default}
.ub-pager span{font-family:'Roboto Condensed',Arial,sans-serif;font-weight:700;font-size:14px;
 color:#5a6a62;min-width:110px;text-align:center}

/* [hidden] must beat our own display rules - .ub-card sets display:block, which
   otherwise wins over the UA stylesheet and leaves "hidden" cards on the page */
.ub-card[hidden],.ub-towns li[hidden],[hidden]{display:none !important}

/* Once a link has been visited the site's global a:visited colour was winning and
   turning these buttons' white text dark. Pin every state explicitly, and kill the
   sticky mobile tap-highlight that lingers after a back-navigation. */
.ub-more,.ub-more:link,.ub-more:visited,.ub-more:hover,.ub-more:focus,.ub-more:active,
.ub-btn,.ub-btn:link,.ub-btn:visited,.ub-btn:hover,.ub-btn:focus,.ub-btn:active{
  color:#fff;-webkit-tap-highlight-color:transparent}
.ub-more:hover,.ub-more:focus,.ub-btn:hover,.ub-btn:focus{background:#006e43}
.ub-btn--ghost,.ub-btn--ghost:link,.ub-btn--ghost:visited,.ub-btn--ghost:hover,
.ub-btn--ghost:focus,.ub-btn--ghost:active{color:#008752;background:transparent}
.ub-btn--ghost:hover,.ub-btn--ghost:focus{background:rgba(0,135,82,.08)}
.ub-card,.ub-card:link,.ub-card:visited,.ub-card:hover,.ub-card:focus,.ub-card:active{
  color:inherit;-webkit-tap-highlight-color:transparent}
.ub-card__title,.ub-card:visited .ub-card__title{color:#12211b}
.ub-towns a,.ub-towns a:link,.ub-towns a:visited{color:#12211b;-webkit-tap-highlight-color:transparent}
.ub-crumb a,.ub-crumb a:link,.ub-crumb a:visited{color:#008752}

/* Full-width CTAs on tablet and phone - a thumb-sized target instead of a
   small pill floating in a wide column. Desktop keeps the inline pill. */
@media(max-width:1024px){
  .ub-more{display:block;width:100%;box-sizing:border-box;text-align:center;
           padding:17px 20px;font-size:16px;margin-top:18px}
  .ub-cta{flex-direction:column;gap:10px}
  .ub-btn,.ub-btn--ghost{display:block;width:100%;box-sizing:border-box;text-align:center;padding:17px 20px}
  .ub-btn--ghost{padding:15px 20px}
}

/* project highlights */
.ub-highlights{list-style:none;margin:0 0 8px;padding:0;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px}
.ub-highlights li{position:relative;padding:9px 12px 9px 30px;background:#f4f6f4;
 border:1px solid #e3e8e4;border-radius:9px;font-size:14.5px;color:#2c3a33}
.ub-highlights li::before{content:"";position:absolute;left:12px;top:16px;width:7px;height:7px;
 border-radius:50%;background:#008752}