:root{--bg:#f4f1ea;--ink:#171a1d;--signal:#9b4e2a;--line:#b9bcb8}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 'Helvetica Neue',Helvetica,Arial,sans-serif}body.business{--bg:#edf1ed;--ink:#0f2722;--signal:#216557;--line:#a4bab0}body.signature{--bg:#0b1416;--ink:#e8f0e9;--signal:#a2dfc9;--line:#36554e}a{color:inherit;text-underline-offset:5px}button,select{font:inherit}a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--signal);outline-offset:5px}.demo-skip{position:absolute;top:-80px}.demo-skip:focus{top:0;z-index:10;background:var(--bg);padding:14px}.demo-bar{display:flex;justify-content:space-between;gap:20px;padding:12px 4vw;font:11px/1.5 'Courier New',monospace;border-bottom:1px solid var(--line)}header{display:flex;align-items:center;justify-content:space-between;gap:32px;margin:0 4vw;padding:28px 0;border-bottom:1px solid var(--line)}.demo-brand{font-size:11px;line-height:1.5;letter-spacing:.07em;text-decoration:none}.demo-brand b{font-size:22px}header nav{display:flex;gap:24px;flex-wrap:wrap}header nav a{font-size:13px;text-decoration:none;padding:12px 0}nav a[aria-current]{text-decoration:underline}.demo-menu{display:none;min-height:48px;padding:12px;background:none;color:var(--ink);border:1px solid var(--line)}.demo-mobile{padding:20px 4vw;border-bottom:1px solid var(--line)}.demo-mobile a{display:block;padding:12px}.demo-hero{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:48px;padding:80px 4vw 96px}.label{font:10px/1.7 'Courier New',monospace;letter-spacing:.07em;display:block;margin:0 0 28px}.demo-hero h1{font-size:clamp(48px,6vw,90px);line-height:1.04;letter-spacing:-.06em;font-weight:500;margin:24px 0}.demo-hero p{max-width:48ch;font-size:18px}.demo-art{border:1px solid var(--line);color:var(--signal);transform:rotate(-4deg)}.circuit{display:block;width:100%}.signature .demo-art{transform:perspective(800px) rotateY(-20deg) rotateX(12deg);box-shadow:18px 18px 0 #162b29,36px 36px 0 #0f2020}.business .demo-art{transform:none;border-left:8px solid var(--signal)}.demo-actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:32px}.demo-btn{display:inline-block;background:var(--signal);color:var(--bg);border:1px solid var(--signal);padding:16px 24px;min-height:52px;text-decoration:none;font-size:15px;cursor:pointer}.demo-section{padding:80px 4vw;border-top:1px solid var(--line)}h2{font-size:clamp(32px,4vw,58px);font-weight:500;line-height:1.12;letter-spacing:-.045em;margin:0 0 28px}h3{font-size:25px;line-height:1.2;letter-spacing:-.025em;font-weight:500}.demo-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:48px}.demo-columns article{border-top:1px solid var(--line);padding-top:24px}.demo-columns article span{font:12px 'Courier New',monospace}.demo-columns p{font-size:16px;max-width:45ch}.demo-columns h2{font-size:30px}.demo-page{padding:64px 4vw 80px;max-width:1100px}.demo-page h1{font-size:clamp(48px,6vw,84px);line-height:1.04;font-weight:500;letter-spacing:-.055em;margin:0 0 32px}.demo-page p{max-width:65ch}.service-row{display:grid;grid-template-columns:60px 1fr 200px;gap:40px;align-items:start;border-top:1px solid var(--line);padding:48px 0}.service-row p{max-width:55ch}.service-row h2{font-size:40px}.service-row a{padding:14px 0;font-size:14px}.demo-method{max-width:850px;padding-left:24px}.demo-method li{padding:12px 0 36px 24px}.demo-method h2{font-size:36px}.demo-choices{display:grid;grid-template-columns:1fr 1fr;gap:24px}.demo-choices a{display:block;padding:32px;border:1px solid var(--line);font-size:24px;text-decoration:none}.demo-faq{max-width:900px;margin-bottom:48px}.demo-faq details{padding:24px 0;border-bottom:1px solid var(--line)}.demo-faq summary{font-size:22px;cursor:pointer}.demo-faq p{max-width:65ch}.demo-note{font-size:14px}form{max-width:720px;display:grid;gap:24px}.demo-field{display:grid;gap:10px}.demo-field label{font-size:15px}.demo-field select{padding:14px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:0;min-height:52px;width:100%}.demo-error{color:#b34729;font-size:14px}.signature .demo-error{color:#ffb29f}#demo-result:not(:empty){border:1px solid var(--line);padding:24px}footer{padding:48px 4vw;border-top:1px solid var(--line);font-size:13px}footer div{display:flex;flex-wrap:wrap;gap:32px;margin-top:24px}.demo-mobile[hidden]{display:none}@media(max-width:1000px){header nav{display:none}.demo-menu{display:block}.demo-hero{gap:32px}.demo-hero h1{font-size:56px}.service-row{grid-template-columns:30px 1fr}.service-row>a{grid-column:2}}@media(max-width:640px){.demo-bar{font-size:10px;flex-wrap:wrap;gap:8px}.demo-bar span{order:3;width:100%}.demo-hero{grid-template-columns:1fr;padding-top:48px;padding-bottom:48px}.demo-hero h1{font-size:46px}.demo-art{max-width:320px;margin:32px auto 0}.demo-section{padding:48px 5vw}.demo-columns,.demo-choices{grid-template-columns:1fr;gap:24px}.demo-columns{margin-top:32px}.demo-page{padding:48px 5vw}.demo-page h1{font-size:44px}.service-row{gap:18px}.service-row h2{font-size:30px}.demo-btn{max-width:100%}.demo-method li{padding-left:8px}.signature .demo-art{box-shadow:12px 12px 0 #162b29}.label{font-size:9px}.demo-faq summary{font-size:19px}}
/* Editorial photographs belong to these fictional demo sites. */
.demo-hero h1,.demo-page h1,.demo-section h2,.demo-section h3,.service-row h2,.demo-method h2{text-transform:uppercase}
.demo-art{position:relative;margin:0;overflow:hidden;aspect-ratio:4/5;background:#dcd9d0;transform:none}
.demo-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.demo-art figcaption{position:absolute;bottom:0;left:0;right:0;padding:13px 18px;background:linear-gradient(transparent,rgba(0,0,0,.73));color:#fff;font:700 10px/1.5 'Courier New',monospace;letter-spacing:.14em;text-align:left}
.business .demo-art{transform:none;border-left:8px solid var(--signal)}
.signature .demo-art{transform:none;box-shadow:18px 18px 0 #162b29,36px 36px 0 #0f2020}
@media(max-width:640px){.demo-art{width:min(100%,360px);aspect-ratio:5/4;margin:24px 0 0}.demo-hero h1{font-size:clamp(37px,9vw,46px)}.demo-page h1{font-size:clamp(37px,9vw,44px)}.signature .demo-art{box-shadow:12px 12px 0 #162b29}}
@media(max-width:640px){.demo-actions{align-items:flex-start;flex-direction:column;gap:12px}.demo-actions>a{max-width:100%}}
