:root,:root[data-theme]{--color-base-100:#f3f1ec;--color-base-200:#e9e6df;--color-base-300:#cfcbc2;--color-base-content:#111;--color-primary:#111;--color-primary-content:#f3f1ec;--color-accent:#111;--color-accent-content:#f3f1ec;--color-neutral:#0e0e0e;--color-neutral-content:#f3f1ec;--radius-box:2px;--radius-field:2px;--radius-selector:2px;--font-display:"Instrument Serif",Georgia,serif;--font-sans:"Hanken Grotesk",system-ui,sans-serif;--soft:#55534e;--step--1:.9rem;--step-0:1.0625rem;--step-1:1.3rem;--step-2:1.7rem;--step-3:clamp(1.9rem,1.4rem + 2vw,2.8rem);--step-5:clamp(2.4rem,1.5rem + 4.4vw,5rem);--sp-2:.5rem;--sp-3:.75rem;--sp-4:1rem;--sp-5:1.5rem;--sp-6:2rem;--sp-7:3rem;--section:clamp(3.5rem,2rem + 5vw,6rem);--container:74rem}
body{font-family:var(--font-sans);font-size:var(--step-0);line-height:1.55;background:var(--color-base-100);color:#111;overflow-wrap:break-word}
h1,h2,h3{font-family:var(--font-display);font-weight:400;line-height:1.05;letter-spacing:-.01em}
.by-w{max-width:var(--container);margin:0 auto;padding:0 var(--sp-5)}
.by-s{padding:var(--section) 0}
.by-soft{color:var(--soft)}
.by-k{font-size:var(--step--1);text-transform:uppercase;letter-spacing:.08em;color:var(--soft);margin-bottom:var(--sp-4)}
.by-h{position:sticky;top:0;z-index:30;background:var(--color-base-100);border-bottom:1px solid var(--color-base-300)}
.by-h .by-w{display:flex;align-items:center;gap:var(--sp-4);min-height:60px}
.by-logo{font-family:var(--font-display);font-size:var(--step-1);white-space:nowrap;margin-right:auto}
.by-nav{display:none;gap:var(--sp-5)}.by-nav a{font-size:var(--step--1)}
.by-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--sp-5);background:#111;color:#f3f1ec;font-weight:500;white-space:nowrap;border:1px solid #111}
.by-btn.alt{background:transparent;color:#111}
.by-menu summary{list-style:none;min-height:44px;min-width:44px;display:grid;place-items:center;cursor:pointer}.by-menu summary::-webkit-details-marker{display:none}
.by-menu{position:relative}.by-menu nav{position:absolute;right:0;top:100%;background:var(--color-base-100);border:1px solid var(--color-base-300);display:grid;min-width:12rem}.by-menu nav a{padding:var(--sp-3) var(--sp-4)}
.by-hero{padding:var(--sp-7) 0 var(--sp-6)}
.by-hero h1{font-size:var(--step-5);max-width:16ch}
.by-hero p{max-width:var(--measure,65ch);margin:var(--sp-5) 0}
.by-act{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.by-fact{margin-top:var(--sp-5);font-size:var(--step--1);color:var(--soft)}
.by-three{display:grid;gap:var(--sp-3);margin-top:var(--sp-6)}
.by-three img,.by-pic,.by-arch img{width:100%;object-fit:cover;display:block}
.by-three img{aspect-ratio:4/5}
.by-pic{aspect-ratio:4/3}
.by-case{border-top:1px solid var(--color-base-300);padding:var(--sp-6) 0;display:grid;gap:var(--sp-5)}
.by-case h3{font-size:var(--step-3)}
.by-meta{color:var(--soft);font-size:var(--step--1);margin:var(--sp-3) 0}
.by-case p{max-width:65ch;margin-bottom:var(--sp-3)}
.by-pair{display:grid;gap:var(--sp-3)}
.by-split{display:grid;gap:var(--sp-6)}
.by-split h2,.by-sec h2{font-size:var(--step-3);margin-bottom:var(--sp-5);max-width:20ch}
.by-split p{max-width:65ch;margin-bottom:var(--sp-4)}
.by-list{list-style:none;border-top:1px solid var(--color-base-300)}.by-list li{padding:var(--sp-3) 0;border-bottom:1px solid var(--color-base-300)}
.by-cols{display:grid;gap:var(--sp-6)}.by-cols h3{font-size:var(--step-2);margin-bottom:var(--sp-3)}
.by-steps{list-style:none;display:grid;gap:var(--sp-5);counter-reset:s}.by-steps li{counter-increment:s;border-top:1px solid var(--color-base-300);padding-top:var(--sp-4)}
.by-steps li::before{content:counter(s,decimal-leading-zero);display:block;font-size:var(--step--1);color:var(--soft)}
.by-steps h3{font-size:var(--step-2)}
.by-arch{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-2)}.by-arch img{aspect-ratio:1}
.by-dark{background:#0e0e0e;color:#f3f1ec}.by-dark .by-soft{color:#b9b5ac}
.by-dark h2{font-size:var(--step-3);margin-bottom:var(--sp-4)}
.by-form{display:grid;gap:var(--sp-4);margin-top:var(--sp-6);max-width:44rem}
.by-form label,.by-form fieldset{display:grid;gap:var(--sp-2);font-size:var(--step--1);border:0}
.by-form .input,.by-form .select,.by-form .textarea{background:#1b1b1b;color:#f3f1ec;border-color:#444;width:100%}
.by-form .by-btn{background:#f3f1ec;color:#111;border-color:#f3f1ec;justify-self:start;cursor:pointer}
.by-form .rad{display:flex;gap:var(--sp-5)}.by-form .rad label{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--step-0)}
.by-ok{background:#f3f1ec;color:#111;padding:var(--sp-4);margin-top:var(--sp-5)}
.by-f{padding:var(--sp-6) 0;font-size:var(--step--1)}.by-f .by-w{display:flex;flex-wrap:wrap;gap:var(--sp-4) var(--sp-6);justify-content:space-between}.by-f nav{display:flex;flex-wrap:wrap;gap:var(--sp-5)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #111;outline-offset:2px}.by-dark a:focus-visible,.by-dark button:focus-visible{outline-color:#f3f1ec}
.legal{max-width:65ch;margin:0 auto;padding:var(--section) var(--sp-5)}
@media(min-width:768px){.by-nav{display:flex}.by-menu{display:none}.by-three{grid-template-columns:repeat(3,1fr)}.by-case{grid-template-columns:1fr 1.2fr;align-items:start}.by-pair{grid-template-columns:1fr 1fr}.by-split{grid-template-columns:1.1fr 1fr;align-items:start}.by-cols{grid-template-columns:repeat(3,1fr)}.by-steps{grid-template-columns:repeat(3,1fr)}.by-arch{grid-template-columns:repeat(4,1fr)}}
@media(prefers-reduced-motion:no-preference){.by-btn{transition:opacity .2s}.by-btn:hover{opacity:.8}}