:root{color-scheme:dark;--bg:#141414;--text:#f7f4ef;--sub:#c8c4bc;--line:#62605b;--accent:#f0e3cf}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.6 system-ui,sans-serif}
.shell{max-width:1040px;margin:auto;padding:0 24px}header,footer{border-bottom:1px solid var(--line)}
footer{border-top:1px solid var(--line);border-bottom:0}.bar{display:flex;gap:18px 28px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:20px 0}
a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #c9a97b;outline-offset:4px}
.brand{font-weight:700;text-decoration:none;letter-spacing:.08em}main{padding:64px 0}
h1{font-size:clamp(2.5rem,6vw,4.8rem);letter-spacing:-.055em;line-height:1.04;max-width:16ch;margin:0 0 .45em}h2{font-size:1.55rem;margin:0 0 .35em}
p{max-width:68ch;color:var(--sub)}.intro{font-size:1.2rem}.action,button{display:inline-block;background:var(--accent);color:#171613;padding:10px 16px;border:0;border-radius:3px;font:inherit;font-weight:650;text-decoration:none;cursor:pointer}
section{margin-top:42px}img,video,iframe{display:block;max-width:100%;width:100%;border:0}iframe{aspect-ratio:16/9}.example{max-width:800px;margin:35px 0}
form{max-width:760px;display:grid;gap:16px}.fields{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
label{display:block;font-weight:600}input,select,textarea{margin-top:4px;display:block;width:100%;padding:10px 11px;background:#222;color:inherit;border:1px solid var(--line);border-radius:4px;font:inherit}button{justify-self:start}
@media(max-width:620px){main{padding:40px 0}.fields{grid-template-columns:1fr}}