:root{--ink:#090b0a;--panel:#111412;--muted:#99a19c;--white:#f3f6f4;--green:#59cd6c;--line:rgba(255,255,255,.13)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}.site-header{height:88px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:10;width:100%;border-bottom:1px solid rgba(255,255,255,.18);background:linear-gradient(180deg,rgba(0,0,0,.48),transparent)}.brand img{display:block;width:245px;height:76px;object-fit:contain}.site-header nav{display:flex;gap:30px;font-size:14px}.site-header nav a:hover{color:var(--green)}.header-call{display:flex;flex-direction:column;line-height:1.25;text-align:right}.header-call small{font-size:11px;color:#b9c1bc}.header-call strong{font:600 15px Manrope}.menu{display:none;background:transparent;border:0}.hero{min-height:720px;height:92vh;position:relative;display:flex;align-items:center;overflow:hidden}.hero-bg{position:absolute;inset:0;background:url('assets/roofing-hero-black-hoodie.webp') 62% center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,8,7,.98),rgba(6,8,7,.87) 34%,rgba(6,8,7,.25) 72%),linear-gradient(0deg,rgba(6,8,7,.82),transparent 42%)}.hero-content{position:relative;z-index:1;width:min(760px,82vw);margin-left:8vw;margin-top:62px}.eyebrow{color:var(--green);font:700 12px Manrope;letter-spacing:.2em;margin:0 0 20px}.hero h1,.section h2,.standard h2{font:700 clamp(3.4rem,6.4vw,6.8rem)/.96 Manrope;letter-spacing:-.055em;margin:0}.hero h1 em{font-style:normal;color:#bbc2be;font-weight:500}.hero .intro{font-size:18px;max-width:590px;color:#c2c9c5;margin:28px 0 36px}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:0 25px;font:600 14px Manrope;border:1px solid var(--line);cursor:pointer}.btn.primary{background:var(--green);color:#071008;border-color:var(--green)}.btn.ghost{background:rgba(8,10,9,.35)}.hero-proof{position:absolute;z-index:2;left:8vw;bottom:32px;display:flex;align-items:center;gap:17px;font:600 10px Manrope;letter-spacing:.14em;color:#c8ceca}.hero-proof i{width:3px;height:3px;background:var(--green);border-radius:50%}.trustbar{display:grid;grid-template-columns:repeat(4,1fr);background:#101310;border-block:1px solid var(--line);padding:0 5vw}.trustbar span{padding:20px;text-align:center;border-right:1px solid var(--line);font:600 12px Manrope;letter-spacing:.06em}.trustbar span:last-child{border:0}.section{padding:110px 8vw}.statement{display:grid;grid-template-columns:1fr 3fr;gap:5vw;background:#edf0ee;color:#151816}.section-label{font:700 11px Manrope;letter-spacing:.15em;color:#5e6862;padding-top:13px}.statement h2{font-size:clamp(2.8rem,5vw,5.4rem)}.statement h2 span,.services h2 span,.agents h2 span,.areas h2 span{color:#7d8881;font-weight:500}.statement p{max-width:680px;color:#525b56;font-size:18px;margin:30px 0 0}.services{display:grid;grid-template-columns:.78fr 1.35fr;gap:7vw}.service-heading{position:sticky;top:50px;align-self:start}.services h2{font-size:clamp(2.4rem,4vw,4.4rem)}.service-heading>p:last-child{color:var(--muted);margin-top:24px}.service-list{border-top:1px solid var(--line)}.service-card{display:grid;grid-template-columns:42px 1fr 28px;gap:18px;padding:27px 4px;border-bottom:1px solid var(--line);transition:.2s}.service-card:hover{padding-left:14px;background:rgba(255,255,255,.02)}.service-card b{color:var(--green);font:600 12px Manrope}.service-card h3{font:600 23px Manrope;margin:0 0 6px}.service-card p{margin:0;color:var(--muted)}.service-card>span{font-size:22px;color:var(--green)}.service-card.featured{background:linear-gradient(90deg,rgba(89,205,108,.1),transparent)}.standard{background:linear-gradient(115deg,#151917,#0b0d0c);display:grid;grid-template-columns:1.7fr .8fr}.standard-copy{padding-right:7vw}.standard h2{font-size:clamp(2.8rem,5vw,5.3rem)}.standard-copy>p:not(.eyebrow){max-width:700px;color:#afb7b2;font-size:18px;margin:28px 0}.ticks{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;padding-top:18px}.ticks span{border-top:1px solid var(--line);padding:14px 0}.ticks span:before{content:'✓';color:var(--green);margin-right:10px}.stats{border-left:1px solid var(--line);display:grid}.stats div{display:flex;flex-direction:column;justify-content:center;padding:12%;border-bottom:1px solid var(--line)}.stats strong{font:600 clamp(4rem,7vw,7.5rem) Manrope;color:var(--green);letter-spacing:-.06em;line-height:1}.stats small{margin-top:14px;color:#a7afa9;letter-spacing:.12em}.agents{background:#dde2df;color:#151816}.agents-card{border-left:5px solid var(--green);padding:14px 0 14px 6vw}.agents h2,.areas h2{font:650 clamp(2.8rem,5.1vw,5.4rem)/1 Manrope;letter-spacing:-.05em;margin:0}.agents-card>p:not(.eyebrow){color:#545d58;max-width:720px;font-size:18px;margin:28px 0}.process{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid #aeb6b1;margin:35px 0}.process span{padding:17px 10px;border-right:1px solid #aeb6b1;font-weight:600}.process span:last-child{border:0}.process b{display:block;color:#339c46;font-size:11px;margin-bottom:7px}.text-link{font-weight:700;border-bottom:2px solid #1d241f;padding-bottom:6px}.text-link span{color:#369f48;margin-left:12px}.areas{text-align:center;background:#0e110f}.area-row{margin-top:45px;display:flex;flex-wrap:wrap;justify-content:center}.area-row span{padding:14px 24px;border:1px solid var(--line);margin:-1px 0 0 -1px;color:#bec6c1}.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:8vw;background:#f0f2f1;color:#121513}.contact h2{font-size:clamp(2.8rem,4.8vw,5.1rem)}.contact-copy>p:not(.eyebrow){color:#59615d}.direct{margin-top:40px;display:grid;gap:14px}.direct a{font:650 18px Manrope}.direct small{display:block;color:#748078;font-size:10px;letter-spacing:.15em}.contact form{display:grid;grid-template-columns:1fr 1fr;gap:20px 18px}.contact label{font:600 12px Manrope}.contact input,.contact textarea{display:block;width:100%;border:0;border-bottom:1px solid #aab2ad;background:transparent;padding:12px 0;border-radius:0;font:16px DM Sans;outline:none}.full{grid-column:1/-1}.form-note{font-size:12px;color:#6d7670;margin:0}footer{padding:45px 5vw 22px;background:#080a09;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:25px}footer>img{width:230px}footer>p{color:#828b85;font-size:13px}.footer-links{display:grid;text-align:right}.legal{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;color:#68706b;font-size:12px}.reveal{animation:rise .7s ease both}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:900px){.site-header{height:76px;padding:0 18px}.brand img{width:205px;height:66px}.site-header nav,.header-call{display:none}.menu{display:grid;gap:6px;padding:12px}.menu span{display:block;width:25px;height:2px;background:white}.site-header.open{background:#090b0a}.site-header.open nav{display:flex;position:absolute;left:0;right:0;top:76px;background:#090b0a;padding:24px;flex-direction:column;border-bottom:1px solid var(--line);gap:22px}.hero{min-height:690px;height:91svh}.hero-bg{background-position:69% center}.hero-shade{background:linear-gradient(90deg,rgba(6,8,7,.98),rgba(6,8,7,.65) 72%,rgba(6,8,7,.15)),linear-gradient(0deg,rgba(6,8,7,.9),transparent 55%)}.hero-content{margin:75px 22px 0;width:auto}.hero h1{font-size:clamp(3rem,13vw,5rem)}.hero .intro{font-size:16px}.hero-proof{left:22px;right:22px;bottom:24px}.trustbar{grid-template-columns:1fr 1fr;padding:0}.trustbar span:nth-child(2){border-right:0}.trustbar span:nth-child(-n+2){border-bottom:1px solid var(--line)}.section{padding:76px 22px}.statement,.services,.standard,.contact{grid-template-columns:1fr}.statement{gap:25px}.section-label{padding:0}.service-heading{position:static}.services{gap:38px}.standard-copy{padding-right:22px}.stats{grid-template-columns:1fr 1fr;border-left:0;border-top:1px solid var(--line)}.stats div{padding:30px 22px}.agents-card{padding-left:20px}.process{grid-template-columns:1fr 1fr}.process span:nth-child(2){border-right:0}.process span:nth-child(-n+2){border-bottom:1px solid #aeb6b1}.contact{gap:50px}.contact form{grid-template-columns:1fr}.contact form>*{grid-column:1}footer{grid-template-columns:1fr}.footer-links{text-align:left}.legal{display:grid;gap:6px}.actions .btn{width:100%}}
@media(max-width:480px){.hero-content{margin-top:60px}.hero .intro{margin:20px 0 25px}.hero-proof{display:none}.statement h2,.services h2,.agents h2,.areas h2,.contact h2,.standard h2{font-size:2.45rem}.service-card{grid-template-columns:30px 1fr 22px;gap:12px;padding:24px 0}.service-card h3{font-size:21px}.service-card p{font-size:15px}.ticks{grid-template-columns:1fr}.stats strong{font-size:3.8rem}.process{grid-template-columns:1fr}.process span{border-right:0!important;border-bottom:1px solid #aeb6b1}.area-row span{flex:1 0 50%}}
.photo-credit{grid-column:1/-1;color:#606862;font-size:10px}.photo-help{display:flex;gap:10px;align-items:baseline;padding:14px 16px;background:#e2e7e4;border-left:3px solid var(--green);font-size:13px;color:#58615c}.photo-help strong{color:#151916}.form-note a{text-decoration:underline;text-underline-offset:2px}.footer-links{gap:2px}.footer-links a:last-child{color:#8f9892;font-size:12px;margin-top:7px;text-decoration:underline;text-underline-offset:3px}
.whatsapp-icon{width:21px;height:21px;flex:0 0 auto;fill:currentColor}.btn.whatsapp{gap:11px;background:rgba(8,10,9,.72);border-color:rgba(89,205,108,.72);color:#f3f6f4}.btn.whatsapp:hover{background:#142218;border-color:var(--green)}.btn.whatsapp .whatsapp-icon,.contact-whatsapp .whatsapp-icon{color:#25d366}.direct .contact-whatsapp{width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:11px;margin-top:10px;padding:13px 17px;background:#101310;color:#f3f6f4;border:1px solid #101310;font:650 14px Manrope}.direct .contact-whatsapp:hover{background:#18231b;border-color:#339c46}

/* Accessible keyboard focus without changing the resting design. */
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:4px}.contact input:focus-visible,.contact textarea:focus-visible{outline:2px solid #171a18;outline-offset:3px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{animation:none}.service-card{transition:none}}

/* Enquiry form controls inherit the existing contact design. */
.contact select{display:block;width:100%;border:0;border-bottom:1px solid #aab2ad;background:transparent;padding:12px 0;border-radius:0;font:16px DM Sans;color:inherit}.contact select:focus-visible{outline:2px solid #171a18;outline-offset:3px}.contact .form-honeypot{display:none!important}.contact button:disabled{opacity:.65;cursor:wait}#form-status[data-state="success"]{color:#236b31}#form-status[data-state="error"]{color:#9a2222}
