:root{--green:#53b75a;--green-dark:#2f7d38;--green-soft:#edf8ee;--ink:#172018;--muted:#647067;--paper:#fff;--soft:#f6f8f6;--line:#e1e7e2;--charcoal:#202622;--shadow:0 18px 50px rgba(20,37,23,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input,select,textarea{font:inherit}.container{width:min(1180px,calc(100% - 44px));margin:auto}.section{padding:92px 0}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--green-dark);margin-bottom:12px}.eyebrow.light{color:#d8f6da}.eyebrow.light-green{color:#85dc8c}.section-head{max-width:820px;margin-bottom:34px}.section-head h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.045em;line-height:1.04;margin:0 0 16px}.section-head p{font-size:17px;color:var(--muted);margin:0;max-width:760px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;border:1px solid var(--green-dark);border-radius:11px;background:var(--green-dark);color:white;font-weight:850;box-shadow:0 9px 22px rgba(47,125,56,.2);transition:.2s}.btn:hover{transform:translateY(-1px);background:#276b30}.btn-outline{background:white;color:var(--green-dark);box-shadow:none}.btn-small{padding:10px 16px;font-size:14px}.btn-light{background:white;color:var(--green-dark);border-color:white;box-shadow:none}.btn-light:hover{background:#f1f8f1;color:var(--green-dark)}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(225,231,226,.9)}.nav-wrap{min-height:76px;display:flex;align-items:center;gap:26px}.brand{width:300px;max-width:34vw}.brand img{height:52px;width:100%;object-fit:contain;object-position:left center}.nav{margin-left:auto;display:flex;align-items:center;gap:23px}.nav a{font-size:14px;font-weight:780;color:#39443c}.nav a:hover{color:var(--green-dark)}.menu-toggle{display:none;border:0;background:transparent;font-size:26px}
.hero{padding:72px 0 62px;background:radial-gradient(circle at 85% 15%,#f1fbf2 0,#fff 42%)}.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:56px;align-items:center}.hero h1{font-size:clamp(52px,6vw,82px);line-height:.94;letter-spacing:-.06em;margin:0 0 24px}.hero h1 span{color:var(--green-dark)}.hero-lead{font-size:19px;color:#4d5a50;max-width:650px;margin:0 0 27px}.hero-actions{display:flex;gap:11px;flex-wrap:wrap}.trust-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:23px}.trust-row span{font-size:12px;font-weight:800;padding:7px 10px;background:#f1f6f1;border:1px solid #dfe8e0;border-radius:999px}.hero-media{position:relative;border-radius:26px;overflow:hidden;box-shadow:var(--shadow);min-height:500px;background:#e9eeea}.hero-media>img{width:100%;height:100%;position:absolute;object-fit:cover}.hero-card{position:absolute;left:20px;right:20px;bottom:20px;background:rgba(19,31,21,.88);backdrop-filter:blur(10px);color:white;padding:16px 18px;border-radius:15px;display:flex;flex-direction:column;gap:2px}.hero-card strong{font-size:16px}.hero-card span{font-size:13px;color:#dce6de}
.quick-band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fbfcfb}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr)}.quick-grid>div{padding:22px 20px;border-right:1px solid var(--line)}.quick-grid>div:first-child{padding-left:0}.quick-grid>div:last-child{border-right:0}.quick-grid strong,.quick-grid span{display:block}.quick-grid strong{font-size:14px}.quick-grid span{font-size:12px;color:var(--muted);margin-top:2px}
.capabilities{background:#fff}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.service-card{border:1px solid var(--line);border-radius:18px;padding:23px;background:#fff;min-height:230px;transition:.2s}.service-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cfddcf}.service-icon{width:42px;height:42px;border-radius:12px;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center;font-size:20px;font-weight:900;margin-bottom:32px}.service-card h3{font-size:19px;line-height:1.18;margin:0 0 10px}.service-card p{font-size:14px;color:var(--muted);margin:0}.specialist-card{background:#f8fcf8;border-color:#dcebdc}
.specialist{background:var(--charcoal);color:white}.specialist-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:58px;align-items:center}.specialist-copy h2{font-size:clamp(34px,4vw,50px);line-height:1.03;letter-spacing:-.045em;margin:0 0 18px}.specialist-copy p{color:#bcc6be;font-size:16px}.diagnostic-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.diagnostic-points span{font-size:12px;font-weight:800;border:1px solid rgba(255,255,255,.16);padding:8px 10px;border-radius:999px;color:#e8eeea}.tech-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tech-grid figure{margin:0;position:relative;overflow:hidden;border-radius:16px;background:#fff;height:220px}.tech-grid figure:nth-child(4),.tech-grid figure:nth-child(5){grid-column:span 1}.tech-grid img{width:100%;height:100%;object-fit:cover}.tech-grid figcaption{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);color:#1b251d;font-size:11px;font-weight:900;padding:7px 9px;border-radius:999px}
.projects{background:var(--soft)}.case-study{margin-top:26px;padding:28px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 11px 35px rgba(20,35,22,.04)}.case-study.featured{border-color:#cfe5d1;background:linear-gradient(180deg,#fff,#fbfefb)}.case-head{margin-bottom:20px}.case-tag{display:inline-block;font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--green-dark);background:var(--green-soft);padding:7px 9px;border-radius:999px;margin-bottom:10px}.case-head h3{font-size:28px;letter-spacing:-.025em;line-height:1.1;margin:0 0 8px}.case-head p{color:var(--muted);margin:0;max-width:880px}.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ba-grid figure,.mini-gallery figure,.progress-grid figure,.gallery-5 figure{margin:0;position:relative;border-radius:17px;overflow:hidden;background:#edf0ed}.ba-grid figure{height:390px}.ba-grid.tall figure{height:570px}.ba-grid.roof figure{height:400px}.ba-grid img,.mini-gallery img,.progress-grid img,.gallery-5 img{width:100%;height:100%;object-fit:cover}.photo-label{position:absolute;z-index:2;left:13px;top:13px;background:rgba(20,25,21,.78);color:white;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:900;letter-spacing:.14em}.mini-gallery{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.mini-gallery figure{height:330px}.mini-gallery.portrait img{object-position:center 44%}.progress-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}.progress-grid figure{height:270px}.progress-grid figcaption{position:absolute;left:11px;bottom:11px;background:rgba(255,255,255,.94);padding:7px 10px;border-radius:999px;font-size:11px;font-weight:850}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.video-card{background:#131713;border-radius:18px;overflow:hidden;border:1px solid #dbe3dc}.video-label{padding:12px 15px;background:white;font-size:13px;font-weight:850}.video-card video{display:block;width:100%;aspect-ratio:16/9;background:#111;object-fit:cover}.gallery-5{display:grid;grid-template-columns:1.15fr .85fr .85fr;grid-template-rows:330px 330px;gap:12px}.gallery-5 figure:first-child{grid-row:1/3}.gallery-5 figure:nth-child(4),.gallery-5 figure:nth-child(5){height:330px}
.approach{background:white}.approach-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.steps{display:grid;gap:11px}.step{display:grid;grid-template-columns:54px 1fr;gap:14px;padding:20px;border:1px solid var(--line);border-radius:17px;background:#fff}.step>span{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark);font-weight:900}.step h3{margin:0 0 4px;font-size:17px}.step p{margin:0;color:var(--muted);font-size:14px}
.enquiry{background:linear-gradient(135deg,#2c7135,#55b75b);color:white}.enquiry-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:58px;align-items:center}.contact-copy h2{font-size:clamp(36px,4vw,54px);line-height:1.02;letter-spacing:-.045em;margin:0 0 15px}.contact-copy p{color:#e4f0e5;font-size:17px}.contact-links{display:flex;flex-direction:column;gap:5px;margin-top:23px;font-weight:800}.enquiry-form{background:white;color:var(--ink);padding:24px;border-radius:21px;display:grid;grid-template-columns:1fr 1fr;gap:13px}.enquiry-form label{font-size:12px;font-weight:850;color:#445048;display:flex;flex-direction:column;gap:6px}.enquiry-form label:nth-child(4){grid-column:1/-1}.enquiry-form input,.enquiry-form select,.enquiry-form textarea{width:100%;border:1px solid #dbe3dc;border-radius:10px;padding:11px 12px;background:#fbfcfb;color:#172018;outline:none}.enquiry-form input:focus,.enquiry-form select:focus,.enquiry-form textarea:focus{border-color:#73bd79;box-shadow:0 0 0 3px rgba(83,183,90,.12)}.enquiry-form button,.enquiry-form small{grid-column:1/-1}.enquiry-form small{font-size:10px;color:#7b857e;text-align:center}
.footer{background:#111512;color:#d4ddd6;padding:34px 0 92px}.footer-grid{display:grid;grid-template-columns:1.2fr .9fr .7fr;gap:28px;align-items:center}.footer-brand{display:flex;flex-direction:column}.footer-brand strong{color:white;font-size:14px}.footer-brand span{font-size:11px;color:#87948b}.footer-contact{display:flex;flex-direction:column;font-size:12px}.copyright{text-align:right;font-size:11px;color:#7f8a82}.mobile-bar{display:none}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}.reveal.visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.service-card:hover,.btn:hover{transform:none}}
@media(max-width:1050px){.desktop-cta{display:none}.nav{gap:15px}.brand{width:250px}.hero-grid,.specialist-grid{grid-template-columns:1fr}.hero-media{min-height:540px}.service-grid{grid-template-columns:repeat(2,1fr)}.approach-grid,.enquiry-grid{grid-template-columns:1fr}.gallery-5{grid-template-columns:1fr 1fr;grid-template-rows:auto}.gallery-5 figure,.gallery-5 figure:first-child,.gallery-5 figure:nth-child(4),.gallery-5 figure:nth-child(5){grid-row:auto;height:320px}.gallery-5 figure:first-child{grid-column:1/-1}.footer-grid{grid-template-columns:1fr 1fr}.copyright{grid-column:1/-1;text-align:left}}
@media(max-width:760px){.container{width:min(100% - 28px,1180px)}.nav-wrap{min-height:68px}.brand{width:220px;max-width:72vw}.brand img{height:42px}.menu-toggle{display:block;margin-left:auto}.nav{position:absolute;display:none;left:14px;right:14px;top:67px;background:white;border:1px solid var(--line);border-radius:16px;padding:10px;box-shadow:0 18px 40px rgba(0,0,0,.13);flex-direction:column;align-items:stretch;gap:0}.nav.open{display:flex}.nav a{padding:11px}.hero{padding:44px 0 38px}.hero-grid{gap:30px}.hero h1{font-size:50px}.hero-lead{font-size:17px}.hero-actions{display:grid}.hero-actions .btn{width:100%}.hero-media{min-height:390px}.quick-grid{grid-template-columns:1fr 1fr}.quick-grid>div{border-bottom:1px solid var(--line)}.quick-grid>div:nth-child(2){border-right:0}.quick-grid>div:nth-last-child(-n+2){border-bottom:0}.quick-grid>div:first-child{padding-left:20px}.section{padding:66px 0}.service-grid{grid-template-columns:1fr}.specialist-grid{gap:32px}.tech-grid{grid-template-columns:1fr 1fr}.tech-grid figure{height:210px}.tech-grid figure:last-child{grid-column:1/-1}.case-study{padding:17px}.case-head h3{font-size:23px}.ba-grid,.mini-gallery,.video-grid,.progress-grid{grid-template-columns:1fr}.ba-grid figure,.ba-grid.tall figure,.ba-grid.roof figure{height:310px}.mini-gallery figure,.progress-grid figure{height:290px}.gallery-5{grid-template-columns:1fr}.gallery-5 figure,.gallery-5 figure:first-child,.gallery-5 figure:nth-child(4),.gallery-5 figure:nth-child(5){grid-column:auto;height:310px}.enquiry-form{grid-template-columns:1fr}.enquiry-form label:nth-child(4),.enquiry-form button,.enquiry-form small{grid-column:auto}.footer-grid{grid-template-columns:1fr}.copyright{text-align:left}.mobile-bar{position:fixed;display:grid;grid-template-columns:repeat(3,1fr);left:9px;right:9px;bottom:9px;z-index:150;background:white;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 15px 40px rgba(0,0,0,.18)}.mobile-bar a{padding:13px 6px;text-align:center;font-size:12px;font-weight:900;color:#243028}.mobile-bar a+a{border-left:1px solid var(--line)}}
@media(max-width:450px){.hero h1{font-size:44px}.tech-grid{grid-template-columns:1fr}.tech-grid figure,.tech-grid figure:last-child{grid-column:auto;height:260px}.quick-grid{grid-template-columns:1fr}.quick-grid>div{border-right:0!important;border-bottom:1px solid var(--line)!important;padding-left:20px}.quick-grid>div:last-child{border-bottom:0!important}}
@media print{.site-header,.mobile-bar,.menu-toggle,.hero-actions,.enquiry-form,.video-card video{display:none!important}.reveal{opacity:1!important;transform:none!important}.container{width:92%}.section{padding:46px 0}.hero{padding:34px 0}.hero-media{min-height:360px}.quick-band{display:none}.service-grid{grid-template-columns:repeat(2,1fr)}.service-card{min-height:0}.specialist-grid{grid-template-columns:1fr}.tech-grid{grid-template-columns:repeat(5,1fr)}.tech-grid figure{height:130px}.case-study{break-before:page;box-shadow:none}.case-study.featured{break-before:auto}.ba-grid figure,.ba-grid.tall figure,.ba-grid.roof figure{height:300px}.mini-gallery figure{height:250px}.gallery-5{grid-template-columns:repeat(3,1fr);grid-template-rows:240px 240px}.gallery-5 figure,.gallery-5 figure:first-child,.gallery-5 figure:nth-child(4),.gallery-5 figure:nth-child(5){height:auto}.video-card{background:#f3f3f3}.video-card::after{content:"Video included in the live website package";display:block;padding:45px 20px;text-align:center;color:#5d675f;background:#f7f8f7}.enquiry{break-before:page}.footer{padding-bottom:30px}.approach{break-before:page}}

/* Commercial facade comparison: preserve the full portrait before image instead of center-cropping it. */
.ba-grid.facade figure{height:500px}
.ba-grid.facade figure:first-child img{object-fit:contain;object-position:center top;background:#edf0ed}
.ba-grid.facade figure:last-child img{object-position:center center}
@media(max-width:760px){.ba-grid.facade figure{height:440px}}