:root{--bg:#f6f5ec;--ink:#284634;--accent:#284634;--line:#28463435;--soft:#e6e9d9;--font:'Manrope',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.75 var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.045em;line-height:1.06}h3{font-size:23px;letter-spacing:-.03em;line-height:1.2}a:focus-visible{outline:3px solid #214af1;outline-offset:5px}.wrap{width:min(1260px,calc(100% - 100px));margin-inline:auto}.skip{position:fixed;left:10px;top:-100px;padding:10px;background:#214af1;color:white;z-index:30}.skip:focus{top:10px}.demo-banner{display:flex;align-items:center;justify-content:space-between;gap:15px;position:sticky;top:0;z-index:20;background:#fff;color:#17201f;border-bottom:1px solid #ddd;padding:11px 35px;font:12px/1.5 var(--font)}.demo-banner>a:first-child{font-weight:800;font-size:20px;letter-spacing:-1px}.demo-banner>a:first-child span{color:#214af1}.demo-banner p{font-size:11px;color:#656c6b}.demo-buy{font-size:11px;font-weight:750;text-decoration:underline;text-underline-offset:3px}.demo-header{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-block:35px}.demo-brand{font:bold 32px/1 Georgia,serif;letter-spacing:-1.4px}.demo-brand span{font-style:italic}.demo-header nav{display:flex;align-items:center;gap:35px;font-size:12px}.demo-header nav>a:hover{text-decoration:underline;text-underline-offset:4px}.contact-nav{border:1px solid var(--line);padding:10px 16px}.demo-hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:60px;padding-block:35px 90px;min-height:650px}.kicker{font-size:10px;font-weight:700;letter-spacing:.15em}.demo-hero h1{font-size:clamp(65px,7.2vw,105px);margin-block:26px 28px}.demo-hero-text>p:not(.kicker){max-width:400px;font-size:15px;line-height:1.9}.demo-button{display:inline-block;padding:15px 22px;background:var(--accent);color:var(--bg);font-size:13px;font-weight:650;line-height:1.5;margin-top:30px;transition:filter .2s}.demo-button:hover{filter:brightness(1.2)}.demo-hero-text .hero-footnote{font-size:10px!important;letter-spacing:.08em;margin-top:27px}.demo-hero-image{position:relative;background-size:cover;background-position:center;height:555px;border-radius:260px 260px 0 0;overflow:hidden}.image-caption{position:absolute;bottom:15px;left:20px;color:white;font-size:8px;letter-spacing:.1em;background:#14291aba;padding:5px 9px}.volt-poster{display:none}.demo-services{padding-block:70px 100px;border-top:1px solid var(--line)}.section-top{display:flex;justify-content:space-between;gap:50px;align-items:start}.section-top h2{font-size:55px;width:63%}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:60px}.service-grid article{border-top:1px solid var(--line);padding-top:24px}.service-grid article>span{display:block;font-size:12px;letter-spacing:.1em;margin-bottom:26px}.service-grid h3{margin-bottom:15px}.service-grid p{font-size:14px;line-height:1.9}.approach-section{background:var(--soft);padding-block:80px}.approach-layout{display:grid;grid-template-columns:1fr 1.7fr;gap:50px}.approach-layout h2{font-size:55px}.approach-layout>div>p{max-width:590px;font-size:16px;line-height:1.9;margin-top:25px}.simple-link{display:block;width:fit-content;text-decoration:underline;text-underline-offset:5px;font-size:13px;font-weight:650;margin-top:25px}.demo-contact{display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center;padding-block:100px}.demo-contact h2{font-size:60px;margin-top:25px}.demo-disclosure p{font-size:14px;line-height:1.9}.demo-disclosure strong{display:block;margin-bottom:8px}.demo-disclosure .demo-button{margin-top:22px}.demo-disclosure .simple-link{margin-top:16px;font-size:12px}.demo-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--line);padding-block:26px;font-size:12px}.demo-footer>span{font-family:Georgia,serif;font-size:22px;font-weight:bold;letter-spacing:-.5px}.demo-footer a{text-decoration:underline;text-underline-offset:3px}
body[data-example=electrical]{--bg:#191a1b;--ink:#f7f6ed;--accent:#ff6539;--line:#ffffff30;--soft:#222425}body[data-example=electrical] h1,body[data-example=electrical] h2{font-family:var(--font);font-weight:800;letter-spacing:-.06em}body[data-example=electrical] .demo-brand{font-family:var(--font);font-size:25px;letter-spacing:-1px}body[data-example=electrical] .demo-hero-image{background:#ff6539;border-radius:0;padding:35px;height:510px}body[data-example=electrical] .volt-poster{display:flex;justify-content:space-between;flex-direction:column;height:100%;color:#191a1b}body[data-example=electrical] .volt-poster>span{font-size:clamp(45px,4.7vw,70px);font-weight:800;letter-spacing:-.07em;line-height:1.02}body[data-example=electrical] .volt-poster>div{font-size:17px;font-weight:800;letter-spacing:-.04em}body[data-example=electrical] .image-caption{display:none}body[data-example=electrical] .demo-hero h1{font-size:clamp(64px,7.7vw,106px)}body[data-example=electrical] .demo-button{color:#191a1b}body[data-example=electrical] .section-top h2,body[data-example=electrical] .approach-layout h2{font-size:50px}body[data-example=building]{--bg:#f4f0e9;--ink:#3c332c;--accent:#934b35;--line:#3c332c35;--soft:#e9e1d7}body[data-example=building] .demo-brand{font-family:var(--font);font-size:29px;font-weight:800;letter-spacing:-1.5px}body[data-example=building] .demo-hero-image{border-radius:0;background-position:80% center}body[data-example=building] .demo-hero h1 em{color:var(--accent)}body[data-example=building] .demo-button{color:#fff}
@media(max-width:950px){.wrap{width:calc(100% - 56px)}.demo-hero{gap:30px}.demo-hero h1{font-size:70px}.demo-hero-image{height:470px}.demo-header nav{gap:20px}.section-top h2,.approach-layout h2{font-size:45px}.demo-contact h2{font-size:47px}.demo-contact{gap:45px}.service-grid{gap:30px}.demo-hero-text>p:not(.kicker){font-size:14px}.demo-brand{font-size:27px}body[data-example=electrical] .demo-hero-image{padding:24px;height:450px}body[data-example=electrical] .volt-poster>span{font-size:44px}body[data-example=electrical] .demo-hero h1{font-size:69px}body[data-example=electrical] .section-top h2,body[data-example=electrical] .approach-layout h2{font-size:41px}}
@media(max-width:650px){html{scroll-padding-top:110px}.wrap{width:calc(100% - 40px)}.demo-banner{padding:10px 20px;flex-wrap:wrap;gap:4px 15px}.demo-banner>a:first-child{font-size:18px}.demo-banner p{font-size:9px;margin-left:auto}.demo-buy{flex-basis:100%;font-size:10px}.demo-header{padding-block:26px;flex-wrap:wrap;gap:20px}.demo-brand{font-size:28px}.demo-header nav{gap:22px;width:100%;font-size:11px}.contact-nav{margin-left:auto;padding:7px 12px}.demo-hero{grid-template-columns:1fr;gap:35px;padding-block:20px 55px}.demo-hero h1{font-size:75px;margin-block:22px}.demo-hero-text>p:not(.kicker){font-size:15px;max-width:460px}.demo-hero-image{height:420px;max-width:500px;width:100%;margin-inline:auto;border-radius:240px 240px 0 0}.kicker{font-size:9px}.demo-hero-text .hero-footnote{margin-top:22px}.demo-button{margin-top:24px}.demo-services{padding-block:45px 60px}.section-top{display:block}.section-top h2{font-size:42px;margin-top:20px;width:auto}.service-grid{grid-template-columns:1fr;gap:28px;margin-top:35px}.service-grid article{padding-top:19px}.service-grid article>span{margin-bottom:15px}.service-grid h3{font-size:22px}.approach-section{padding-block:50px}.approach-layout{grid-template-columns:1fr;gap:22px}.approach-layout h2{font-size:42px}.approach-layout>div>p{font-size:14px;margin-top:21px}.demo-contact{grid-template-columns:1fr;gap:28px;padding-block:55px}.demo-contact h2{font-size:47px}.demo-footer{flex-wrap:wrap;gap:12px}.demo-footer p{font-size:11px}body[data-example=electrical] .demo-hero h1{font-size:76px}body[data-example=electrical] .demo-hero-image{height:400px;padding:30px}body[data-example=electrical] .volt-poster>span{font-size:59px}body[data-example=electrical] .section-top h2,body[data-example=electrical] .approach-layout h2{font-size:37px}}
@media(max-width:380px){.demo-hero h1{font-size:65px}.demo-hero-image{height:370px}body[data-example=electrical] .demo-hero h1{font-size:65px}body[data-example=electrical] .volt-poster>span{font-size:50px}.demo-contact h2{font-size:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
