:root{
  --navy:#0d1420; --card:#141c2c; --card-2:#182236;
  --teal:#3b895c; --teal-dark:#0f9488; --cream:#f3efe4;
  --amber:#e2984f; --amber-2:#f0b273; --amber-ink:#1f1408;
  --ink:#f5f7fa; --ink-soft:#a7b2c4; --line:#25304433;
  --line:#26314530; --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;}
html{scroll-padding-top:env(safe-area-inset-top,0px);}
body{margin:0;background:var(--navy);color:var(--ink);font-family:var(--sans);line-height:1.6;position:relative;}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::after{
  content:"";position:fixed;top:-10%;left:50%;width:900px;height:900px;max-width:140vw;transform:translateX(-50%);
  background:radial-gradient(circle, #1c2e4a55 0%, transparent 65%);pointer-events:none;z-index:0;
}
header,main,footer{position:relative;z-index:1;}
a{color:inherit;}
.wrap{max-width:1300px;margin:0 auto;padding:0 24px;}
header{position:sticky;top:0;top:env(safe-area-inset-top,0px);background:var(--navy);border-bottom:1px solid #26314480;z-index:10;}
.navbar{display:flex;align-items:center;justify-content:space-between;padding:16px 0;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;background:none;border:none;padding:0;}
.brand svg{width:80px;height:80px;flex:none;}
.brand span{font-family:var(--serif);font-weight:600;font-size:19px;color:var(--ink);}
.brand span em{font-style:normal;color:var(--teal);}
.logo {
    width: 75px;
    max-width: 75px;
    height: auto;
    flex: none;
}
nav{display:flex;gap:4px;position:relative;}
nav a{text-decoration:none;font-size:15px;padding:8px 14px;border-radius:20px;display:inline-block;}
nav a.active{background:var(--card);}
nav button,nav a{background:none;border:none;font:inherit;font-size:15px;color:var(--ink-soft);padding:8px 14px;border-radius:20px;cursor:pointer;transition:color .2s ease;position:relative;z-index:1;}
nav button.active,nav a.active{color:var(--ink);}
.nav-indicator{position:absolute;top:0;height:100%;background:var(--card);border-radius:20px;transition:left .32s cubic-bezier(.22,.61,.36,1), width .32s cubic-bezier(.22,.61,.36,1);z-index:0;}
main{padding:48px 0 80px;overflow:hidden;position:relative;}
.page{display:none;}
.page.active{display:block;}
h1{font-family:var(--serif);font-size:clamp(32px,5vw,48px);line-height:1.15;margin:0 0 18px;font-weight:600;max-width:14ch;color:var(--ink);}
h2{font-family:var(--serif);font-size:26px;font-weight:600;margin:0 0 14px;}
p{color:var(--ink-soft);margin:0 0 16px;max-width:62ch;}
.lede{font-size:18px;max-width:52ch;}
.btn{display:inline-block;background:var(--amber);color:var(--amber-ink);text-decoration:none;padding:13px 24px;border-radius:8px;font-size:15px;font-weight:500;border:none;cursor:pointer;font-family:inherit;transition:transform .2s ease, box-shadow .2s ease, background .2s ease;}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px #e2984f77;background:var(--amber-2);}
.btn.ghost{background:none;color:var(--ink);border:1px solid #3a4660;}
.btn.ghost:hover{background:var(--card);box-shadow:none;transform:none;}
.hero-top{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;padding-bottom:40px;border-bottom:1px solid #26314480;margin-bottom:48px;}
@media(max-width:760px){.hero-top{grid-template-columns:1fr;}}
.hero .actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap;}
.roofline{width:100%;height:auto;}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:32px 0 56px;}
@media(max-width:700px){.grid3{grid-template-columns:1fr;}}
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:8px 0 48px;padding:28px 0;border-top:1px solid #26314480;border-bottom:1px solid #26314480;}
@media(max-width:700px){.stats-strip{grid-template-columns:repeat(2,1fr);row-gap:28px;}}
.stat{text-align:center;}
.stat-num{display:block;font-family:var(--serif);font-size:34px;font-weight:600;color:var(--teal);}
.stat-label{display:block;font-size:12px;color:var(--ink-soft);margin-top:4px;}
.point{background:var(--card);border:1px solid #26314480;border-radius:12px;padding:22px;transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;}
.point:hover{transform:translateY(-4px);border-color:#3a4660;box-shadow:0 14px 28px -14px #00000066;}
.point .icon{width:38px;height:38px;border-radius:10px;background:#0d142033;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.point .icon svg{width:20px;height:20px;}
.point h3{font-size:16px;font-weight:500;margin:0 0 6px;font-family:var(--sans);color:var(--ink);}
.point p{font-size:14px;margin:0;max-width:none;}
.price-card{background:linear-gradient(160deg, var(--card) 0%, var(--card-2) 100%);border:1px solid #3b895c33;border-radius:12px;padding:32px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:20px;box-shadow:0 20px 40px -28px #3b895c22;}
.price-card .amount{font-family:var(--serif);font-size:40px;font-weight:600;color:var(--ink);}
.price-card .amount span{font-size:16px;font-weight:400;color:var(--ink-soft);font-family:var(--sans);}
.price-list{list-style:none;padding:0;margin:14px 0 0;font-size:14px;color:var(--ink-soft);}
.price-list li{padding:4px 0;}
section+section{margin-top:56px;}
.quote{font-family:var(--serif);font-size:22px;font-style:italic;line-height:1.4;border-left:2px solid var(--teal);padding-left:20px;max-width:48ch;margin:32px 0;color:var(--ink);}
.split{display:grid;grid-template-columns:1.1fr 0.9fr;gap:48px;align-items:start;}
@media(max-width:700px){.split{grid-template-columns:1fr;}}
.badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--teal);border:1px solid #3a4660;padding:6px 12px;border-radius:20px;margin-bottom:18px;}
.field{margin-bottom:18px;}
.field label{display:block;font-size:13px;color:var(--ink-soft);margin-bottom:6px;}
.field input,.field textarea{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #3a4660;background:var(--card);color:var(--ink);font:inherit;font-size:15px;}
.field textarea{min-height:120px;resize:vertical;}
.err{color:#ff9d9d;font-size:13px;display:none;margin-top:6px;}
.contact-details{background:var(--card);border:1px solid #26314480;border-radius:12px;padding:24px;}
.contact-details h3{font-size:15px;font-weight:500;margin:0 0 4px;color:var(--ink);}
.contact-details p{font-size:14px;margin:0 0 18px;}
.coverage-map{width:100%;height:auto;margin:4px 0 12px;background:#0d142055;border-radius:10px;}
.formmsg{display:none;background:var(--card);border:1px solid var(--teal);border-radius:8px;padding:16px;font-size:14px;margin-top:16px;}
.about-art{position:sticky;top:96px;}
footer{border-top:1px solid #26314480;padding:28px 0;}
footer p{font-size:13px;margin:0;color:var(--ink-soft);}
.footer-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.social-links{display:flex;gap:10px;flex:none;}
.social-links a{width:36px;height:36px;border-radius:50%;border:1px solid #3a4660;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);transition:color .2s ease, border-color .2s ease, transform .2s ease, background .2s ease;}
.social-links a svg{width:17px;height:17px;}
.social-links a:hover{color:var(--teal);border-color:var(--teal);background:#3b895c14;transform:translateY(-2px);}

/* Blog */
.post-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:32px;}
.post-card{display:flex;flex-direction:column;background:var(--card);border:1px solid #26314480;border-radius:12px;padding:24px;text-decoration:none;transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;}
.post-card:hover{transform:translateY(-4px);border-color:#3a4660;box-shadow:0 14px 28px -14px #00000066;}
.post-card h3{font-family:var(--serif);font-size:21px;font-weight:600;line-height:1.25;margin:6px 0 10px;color:var(--ink);}
.post-card p{font-size:14px;margin:0 0 16px;}
.post-date{font-size:12px;color:var(--teal);}
.post-card .more{margin-top:auto;font-size:14px;color:var(--amber);}
.post-list .empty{grid-column:1/-1;}
.post{max-width:720px;}
.post h1{max-width:22ch;font-size:clamp(30px,4.5vw,42px);}
.post h2{margin-top:36px;}
.post-meta{font-size:13px;color:var(--ink-soft);margin:0 0 28px;}
.post-meta a{color:var(--teal);text-decoration:none;}
.post-back{display:inline-block;font-size:14px;color:var(--teal);text-decoration:none;margin-bottom:24px;}
.post ul{color:var(--ink-soft);padding-left:20px;margin:0 0 16px;max-width:62ch;}
.post li{margin-bottom:6px;}
.post-cta{margin-top:48px;}
@media(max-width:600px){
  .navbar{flex-wrap:wrap;gap:8px 16px;}
  .brand svg{width:56px;height:56px;}
}

/* City & Guilds licence block (footer) */
.footer-cert{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:20px;padding-top:20px;border-top:1px solid #26314480;}
.footer-cert .cg-logo{display:inline-flex;background:var(--ink);padding:6px 10px;border-radius:8px;flex:none;}
.footer-cert img{height:40px;width:auto;display:block;}
.footer-cert p{font-size:12px;}
.footer-cert p a{color:var(--teal);}
