
function ic(inner){ return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">'+inner+'</svg>'; }
const ICON = {
  remedial: ic('<path d="M12 3v6"/><path d="M3.5 20a8.5 8.5 0 0 1 17 0"/><path d="m8 6 4-3 4 3"/><path d="M6 13a6 6 0 0 1 12 0"/>'),
  building: ic('<path d="M3 21h18"/><path d="M5 21V5a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v16"/><path d="M13 9h5a1 1 0 0 1 1 1v11"/><path d="M8 8h1M8 12h1M8 16h1M16 13h0M16 17h0"/>'),
  home: ic('<path d="M3 11.5 12 4l9 7.5"/><path d="M5 10v10h14V10"/><path d="M9 20v-6h6v6"/>'),
  droplet: ic('<path d="M12 3s6 6.5 6 10.5a6 6 0 0 1-12 0C6 9.5 12 3 12 3z"/>'),
  layers: ic('<path d="m12 3 9 5-9 5-9-5 9-5z"/><path d="m3 12 9 5 9-5"/><path d="m3 16 9 5 9-5"/>'),
  roof: ic('<path d="M2 20h20M4 20V9l6 4V9l6 4V6l4 2v12"/>'),
  crack: ic('<path d="M4 4v16M4 8h10l-2 3 2 3H4"/>'),
  sealdrop: ic('<path d="M12 3s6 6.5 6 10.5a6 6 0 0 1-12 0C6 9.5 12 3 12 3z"/><path d="m4 4 16 16"/>'),
  joint: ic('<path d="M3 12h6M15 12h6"/><path d="M9 6v12M15 6v12"/>'),
  shield: ic('<path d="M12 3 4 6v6c0 5 3.5 7.5 8 9 4.5-1.5 8-4 8-9V6l-8-3z"/><path d="M9 12l2 2 4-4"/>'),
  crystal: ic('<path d="m12 2 4 6-4 14-4-14 4-6z"/><path d="M8 8h8"/>'),
  car: ic('<path d="M5 13 6.5 8A2 2 0 0 1 8.4 6.6h7.2A2 2 0 0 1 17.5 8L19 13"/><path d="M4 13h16v5H4z"/><path d="M7 18v2M17 18v2M6.5 15.5h0M17.5 15.5h0"/>'),
  damp: ic('<path d="M3 21h18M6 21V4h12v17"/><path d="M9 8h0M13 8h0M9 12h0M13 12h0"/><path d="M12 15c0 1.5-2 2-2 3.5a2 2 0 0 0 4 0C14 17 12 16.5 12 15z"/>'),
  search: ic('<circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/><path d="M8 11h6M11 8v6"/>'),
  basement: ic('<path d="M3 4h18M5 4v10a4 4 0 0 0 4 4h6a4 4 0 0 0 4-4V4"/><path d="M9 8v6M15 8v6"/>'),
  clock: ic('<circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/>'),
  tools: ic('<path d="M14 7a3 3 0 0 0 4 4l3 3-3 3-3-3a3 3 0 0 0-4-4z"/><path d="m9 15-6 6"/><path d="m7 10 4-4-3-3-4 4 3 3z"/>'),
  beaker: ic('<path d="M9 3h6M10 3v6l-5 9a2 2 0 0 0 1.8 3h10.4A2 2 0 0 0 19 18l-5-9V3"/><path d="M7.5 14h9"/>'),
  wall: ic('<path d="M3 6h18M3 12h18M3 18h18"/><path d="M8 6v6M16 6v6M12 12v6"/>'),
  tank: ic('<rect x="4" y="6" width="16" height="14" rx="2"/><path d="M4 10h16"/><path d="M8 6V4h8v2"/>'),
  wave: ic('<path d="M2 12c2 0 2-2 4-2s2 2 4 2 2-2 4-2 2 2 4 2 2-2 4-2"/><path d="M2 17c2 0 2-2 4-2s2 2 4 2 2-2 4-2 2 2 4 2 2-2 4-2"/>'),
  refresh: ic('<path d="M21 12a9 9 0 1 1-3-6.7L21 8"/><path d="M21 3v5h-5"/>'),
  clip: ic('<rect x="6" y="4" width="12" height="17" rx="2"/><path d="M9 4V3h6v1"/><path d="M9 10h6M9 14h6"/>'),
};
const ARROW = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>';
const CHEV = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>';
const TITLES = {
  'remedial-waterproofing':'Remedial Waterproofing','commercial-waterproofing':'Commercial Waterproofing',
  'residential-waterproofing':'Residential Waterproofing','concrete-protective-coatings':'Concrete Protective Coatings',
  'crack-injection':'Crack Injection','concrete-leak-sealing':'Concrete Leak Sealing','joint-repair':'Joint Repair',
  'balcony-terrace-waterproofing':'Balcony & Terrace Waterproofing','bathroom-waterproofing':'Bathroom Waterproofing',
  'roof-membrane-systems':'Roof Membrane Systems','basement-waterproofing':'Basement Waterproofing',
  'car-park-waterproofing':'Car Park Waterproofing','rising-damp-treatment':'Rising Damp Treatment',
  'waterproofing-inspections':'Waterproofing Inspections',
};
const RELICON = {
  'remedial-waterproofing':'remedial','commercial-waterproofing':'building','residential-waterproofing':'home',
  'concrete-protective-coatings':'shield','crack-injection':'crack','concrete-leak-sealing':'sealdrop',
  'joint-repair':'joint','balcony-terrace-waterproofing':'layers','bathroom-waterproofing':'droplet',
  'roof-membrane-systems':'roof','basement-waterproofing':'basement','car-park-waterproofing':'car',
  'rising-damp-treatment':'damp','waterproofing-inspections':'search',
};
function page(s){
  const head='<!DOCTYPE html>\n<html lang="en">\n<head>\n  <meta charset="UTF-8">\n  <meta name="viewport" content="width=device-width, initial-scale=1.0">\n  <title>'+s.metaTitle+'</title>\n  <meta name="description" content="'+s.metaDescription+'">\n  <link rel="preconnect" href="https://fonts.googleapis.com">\n  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>\n  <link href="https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700;800&family=Hanken+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">\n  <link rel="stylesheet" href="assets/css/style.css">\n</head>\n<body data-page="services">\n  <div data-include="header"></div>\n  <main>';
  const hero='\n    <section class="page-hero with-media">\n      <div class="container">\n        <div>\n          <div class="crumb">\n            <a href="index.html">Home</a> '+CHEV+'\n            <a href="remedial-waterproofing.html">Services</a> '+CHEV+'\n            <span class="current">'+TITLES[s.slug]+'</span>\n          </div>\n          <h1>'+s.h1+'</h1>\n          <p class="lead">'+s.lead+'</p>\n          <div class="btn-row" style="margin-top:30px;">\n            <a href="contact.html" class="btn btn-primary">Book an assessment '+ARROW+'</a>\n            <a href="tel:0488773232" class="btn btn-outline-light">Call 0488 773 232</a>\n          </div>\n        </div>\n        <div class="hero-media">\n          <div class="ph ph-hero dark">\n            <span class="ph-icon">'+ICON[s.heroIcon]+'</span>\n            <span class="ph-label">'+s.heroLabel+'</span>\n            <span class="ph-tag">Photo placeholder</span>\n          </div>\n        </div>\n      </div>\n    </section>';
  const intro='\n    <section>\n      <div class="container-narrow prose">\n        <div class="eyebrow">'+s.eyebrow+'</div>\n        <h2>'+s.intro.heading+'</h2>\n        '+s.intro.paras.map(function(p){return '<p>'+p+'</p>';}).join('\n        ')+'\n      </div>\n    </section>';
  const capsGrid=(s.caps.cards.length%3===0)?'':((s.caps.cards.length%2===0)?' two':'');
  const caps='\n    <section class="section-soft">\n      <div class="container">\n        <div class="section-head'+(s.caps.center?' center':'')+'" data-reveal>\n          <div class="eyebrow'+(s.caps.center?' center':'')+'">'+s.caps.eyebrow+'</div>\n          <h2>'+s.caps.heading+'</h2>\n          '+(s.caps.sub?'<p>'+s.caps.sub+'</p>':'')+'\n        </div>\n        <div class="svc-grid'+capsGrid+'">\n          '+s.caps.cards.map(function(c,i){return '<div class="svc-card" data-reveal'+(i%3?' data-delay="'+(i%3)+'"':'')+'>\n            <div class="svc-icon">'+ICON[c.icon]+'</div>\n            <h3>'+c.title+'</h3>\n            <p>'+c.body+'</p>\n          </div>';}).join('\n          ')+'\n        </div>\n      </div>\n    </section>';
  const process=s.process?('\n    <section>\n      <div class="container">\n        <div class="section-head" data-reveal>\n          <div class="eyebrow">'+s.process.eyebrow+'</div>\n          <h2>'+s.process.heading+'</h2>\n        </div>\n        <div class="steps" data-reveal>\n          '+s.process.steps.map(function(st){return '<div class="step"><h4>'+st.t+'</h4><p>'+st.b+'</p></div>';}).join('\n          ')+'\n        </div>\n      </div>\n    </section>'):'';
  const standards=s.standards?('\n    <section class="section-dark">\n      <div class="container">\n        <div class="section-head" data-reveal>\n          <div class="eyebrow light">'+(s.standards.eyebrow||'Standards & compliance')+'</div>\n          <h2>'+s.standards.heading+'</h2>\n          '+(s.standards.intro?'<p>'+s.standards.intro+'</p>':'')+'\n        </div>\n        <ul class="check-list'+(s.standards.items.length>3?' two':'')+'" data-reveal>\n          '+s.standards.items.map(function(it){return '<li>'+it+'</li>';}).join('\n          ')+'\n        </ul>\n      </div>\n    </section>'):'';
  const costs=s.costs?('\n    <section class="section-soft">\n      <div class="container-narrow">\n        <div class="section-head" data-reveal>\n          <div class="eyebrow">'+(s.costs.eyebrow||'Cost factors')+'</div>\n          <h2>'+s.costs.heading+'</h2>\n          '+(s.costs.intro?'<p>'+s.costs.intro+'</p>':'')+'\n        </div>\n        <div class="overflow-x" data-reveal>\n          <table class="data-table">\n            <thead><tr><th>'+s.costs.cols[0]+'</th><th>'+s.costs.cols[1]+'</th></tr></thead>\n            <tbody>\n              '+s.costs.rows.map(function(r){var n=(/^[0-9$]/.test(r[1])||r[1].indexOf('year')>-1||r[1].indexOf('mm')>-1);return '<tr><td>'+r[0]+'</td><td'+(n?' class="num"':'')+'>'+r[1]+'</td></tr>';}).join('\n              ')+'\n            </tbody>\n          </table>\n        </div>\n        '+(s.costs.note?'<div class="note-block" style="margin-top:24px;">\n          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/></svg>\n          <p>'+s.costs.note+'</p>\n        </div>':'')+'\n      </div>\n    </section>'):'';
  const faq='\n    <section>\n      <div class="container-narrow">\n        <div class="section-head" data-reveal>\n          <div class="eyebrow">Common questions</div>\n          <h2>'+(s.faqHeading||TITLES[s.slug]+' FAQs')+'</h2>\n        </div>\n        <div class="acc">\n          '+s.faqs.map(function(f){return '<div class="acc-item">\n            <button class="acc-q" aria-expanded="false">'+f.q+'<span class="acc-icon"></span></button>\n            <div class="acc-body"><div class="acc-body-inner"><p>'+f.a+'</p></div></div>\n          </div>';}).join('\n          ')+'\n        </div>\n      </div>\n    </section>';
  const related='\n    <section class="section-soft section-tight">\n      <div class="container">\n        <div class="eyebrow">Related services</div>\n        <h2 style="margin-bottom:24px;">Explore related work</h2>\n        <div class="chips">\n          '+s.related.map(function(r){return '<a href="'+r+'.html" class="chip">'+ICON[RELICON[r]]+' '+TITLES[r]+'</a>';}).join('\n          ')+'\n        </div>\n      </div>\n    </section>';
  const cta='\n    <section class="cta-band">\n      <div class="container">\n        <div class="eyebrow center light">Get started</div>\n        <h2>'+s.cta.heading+'</h2>\n        <p>'+s.cta.text+'</p>\n        <div class="btn-row center">\n          <a href="contact.html" class="btn btn-primary">Request an assessment '+ARROW+'</a>\n          <a href="tel:0488773232" class="btn btn-outline-light">Call 0488 773 232</a>\n        </div>\n      </div>\n    </section>';
  const foot='\n  </main>\n  <div data-include="footer"></div>\n  <script src="assets/js/main.js" defer></scr'+'ipt>\n</body>\n</html>';
  return head+hero+intro+caps+process+standards+costs+faq+related+cta+foot;
}
