body.badges-page{font-family:var(--sans)}
.badges-page main{overflow-wrap:break-word}
.badge-wrap{width:min(1260px,90%);margin-inline:auto}
.badges-page h1,.badges-page h2,.badges-page h3{font-family:var(--serif);font-weight:300;letter-spacing:0;line-height:1.12;text-wrap:balance;color:var(--ink)}
.badges-page p,.badges-page li{text-wrap:pretty}
.badge-kicker{font:700 11px/1.7 var(--sans);letter-spacing:.13em;margin:0 0 18px}
.badge-skip{position:absolute;left:20px;top:-100px;z-index:101;padding:12px 18px;background:var(--paper)}
.badge-skip:focus{top:12px}
.badge-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(35px,6vw,88px);align-items:center;padding-block:70px 80px}
.badge-hero h1{font-size:clamp(42px,4.15vw,62px);margin:0 0 25px}
.badge-hero h1 em{display:block;margin-top:8px}
.badge-hero-copy>p:not(.badge-kicker,.badge-meta){font-size:16px;line-height:1.8;margin:0 0 20px}
.badge-hero-copy>p.badge-lead{font-size:18px;line-height:1.7}
.badge-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:50px;padding:15px 21px;border:1px solid var(--accent);background:var(--accent);color:#fff;font:600 14px/1.5 var(--sans);text-align:center}
.badge-button:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff}
.badge-button>span[aria-hidden]{font-size:20px;line-height:1}
.badge-hero .badge-button{margin-top:8px}
.badge-meta{font-size:11px;line-height:1.7;letter-spacing:.025em;margin:16px 0 0;color:var(--muted)}
.badge-hero-art{position:relative;min-width:0;max-width:580px;margin:0;padding:0 0 42px 10%;align-self:center}
.badge-hero-main{display:block;width:80%;height:auto;box-shadow:0 14px 35px #44282712;transform:rotate(-4deg)}
.badge-hero-secondary{position:absolute;right:0;bottom:44px;width:52%;height:auto;transform:rotate(6deg);box-shadow:0 14px 35px #44282718}
.badge-hero-art figcaption{font-size:11px;line-height:1.5;letter-spacing:.03em;position:absolute;left:0;right:0;bottom:0;margin:0;text-align:center}
.badge-library{background:#ebe6df;padding:64px 0 52px;scroll-margin-top:145px}
.badge-section-intro{max-width:800px}
.badge-section-intro h2{font-size:clamp(34px,3.4vw,46px);margin:0 0 20px}
.badge-section-intro>p:not(.badge-kicker){font-size:16px;line-height:1.8;margin:0;max-width:760px}
.badge-palettes{display:flex;gap:12px;flex-wrap:wrap;margin:32px 0 28px}
.badge-palettes[hidden]{display:none}
.badge-palettes button{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 16px;min-height:48px;border:1px solid #b6ab9f;background:transparent;color:var(--ink);font-size:13px;line-height:1.5}
.badge-palettes button[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--paper)}
.badge-palettes button:hover{background:var(--paper)}
.badge-swatch{width:22px;height:22px;border-radius:50%;border:1px solid #a3998c;flex:0 0 22px}
.swatch-brown{background:linear-gradient(135deg,#442827 50%,#F4F0EB 50%)}
.swatch-reverse{background:linear-gradient(135deg,#F4F0EB 50%,#442827 50%)}
.swatch-cream{background:linear-gradient(135deg,#F4F0EB 50%,#DFD9CF 50%)}
.badge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin-top:28px}
.badge-card[hidden]{display:none}
.badge-card{min-width:0;background:var(--paper);padding:24px}
.badge-card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.badge-card-heading h3{font-size:32px;margin:0}
.badge-card-heading>span{font-size:11px;color:var(--muted);letter-spacing:.08em}
.badge-use{font-size:13px;line-height:1.7;margin:10px 0 22px;min-height:44px}
.badge-preview{height:300px;display:flex;align-items:center;justify-content:center}
.badge-preview img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.badge-size{text-align:center;font-size:11px;line-height:1.5;letter-spacing:.04em;margin:18px 0}
.badge-downloads{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center}
.badge-downloads .badge-button{padding:12px 15px;min-height:46px;font-size:13px;gap:14px}
.badge-svg{display:flex;align-items:center;gap:8px;min-height:46px;font-size:12px;text-decoration:underline;text-underline-offset:4px}
.badge-pack{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:36px;padding-top:30px;border-top:1px solid #c8bfb2}
.badge-pack h3{font-size:29px;margin:0 0 8px}
.badge-pack p{font-size:14px;line-height:1.7;margin:0}
.badge-button-outline{flex-wrap:wrap;background:transparent;color:var(--accent);flex-shrink:0;column-gap:22px;row-gap:1px}
.badge-file-size{display:block;flex-basis:100%;font-size:10px;font-weight:400;letter-spacing:.04em}
.badge-format-note{font-size:12px;line-height:1.8;max-width:790px;margin:24px 0 0}
.badge-format-note strong{font-weight:600}
.badge-how{padding-block:78px}
.badge-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;list-style:none;counter-reset:step;margin:38px 0 0;padding:0}
.badge-step-number{display:block;font-size:12px;letter-spacing:.12em;padding-top:20px;border-top:1px solid var(--line);margin:0 0 16px}
.badge-steps h3{font-size:30px;margin:0 0 14px}
.badge-steps p{font-size:14px;line-height:1.85;margin:0}
.badge-text-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;margin-top:14px;font-size:13px;text-decoration:underline;text-underline-offset:5px}
.badge-search-note{margin-top:48px;padding:26px 32px;background:var(--cream)}
.badge-search-note .badge-kicker{margin-bottom:10px}
.badge-search-note>p:last-child{font-size:14px;line-height:1.85;margin:0;max-width:1000px}
.badge-invite{padding:55px 0 60px;border-top:1px solid var(--line);text-align:center}
.badge-invite h2{font-size:clamp(32px,3.4vw,44px);margin:0 0 20px}
.badge-invite p:not(.badge-kicker){max-width:700px;font-size:15px;line-height:1.85;margin:0 auto 25px}
.badge-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1000px){
 .badge-hero{gap:30px;padding-block:50px 60px}
 .badge-hero h1{font-size:42px}
 .badge-grid{gap:16px}.badge-card{padding:18px}
 .badge-preview{height:240px}
 .badge-downloads{gap:10px}
 .badge-steps{gap:26px}
 .badge-pack{gap:20px}
}
@media(max-width:760px){
 .badge-hero{grid-template-columns:1fr;gap:40px}
 .badge-hero-copy{max-width:610px}.badge-hero h1{font-size:clamp(36px,6.5vw,48px)}
 .badge-hero-art{width:min(100%,460px);margin:auto;padding-bottom:25px}
 .badge-grid{grid-template-columns:1fr}
 .badge-card{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;padding:25px}
 .badge-card-heading{grid-column:2;grid-row:1}
 .badge-use{grid-column:2;grid-row:2;min-height:0;margin:10px 0 18px}
 .badge-preview{grid-column:1;grid-row:1/5;height:240px}
 .badge-size{grid-column:2;grid-row:3;text-align:left;margin:0 0 15px}
 .badge-downloads{grid-column:2;grid-row:4;align-self:end}
 .badge-pack{align-items:flex-start;flex-direction:column}
 .badge-steps{grid-template-columns:1fr;gap:26px}
 .badge-steps h3{font-size:29px}
 .badge-step-number{margin-bottom:12px}
}
@media(max-width:480px){
 .badge-wrap{width:auto;margin-inline:20px}
 .badge-hero{padding-block:36px 42px}
 .badge-kicker{font-size:10px;letter-spacing:.1em;max-width:38ch}
 .badge-hero-copy>p.badge-lead{font-size:17px}
 .badge-hero-copy>p:not(.badge-kicker,.badge-meta){line-height:1.75}
 .badge-hero-art{max-width:360px}
 .badge-hero-art figcaption{font-size:10px}
 .badge-library{padding-block:40px;scroll-margin-top:115px}
 .badge-section-intro h2{font-size:34px}
 .badge-section-intro>p:not(.badge-kicker){font-size:15px;line-height:1.75}
 .badge-palettes{gap:7px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-block:25px 20px}
 .badge-palettes button{flex-direction:column;gap:7px;padding:12px 4px;font-size:12px}
 .badge-grid{gap:20px}
 .badge-card{display:block;padding:22px}
 .badge-card-heading h3{font-size:32px}
 .badge-preview{height:auto;min-height:160px;max-height:none;margin-top:20px}
 .badge-preview img{width:100%;height:auto;max-height:none}
 .badge-card[data-shape="pion"] .badge-preview img{width:82%}
 .badge-size{text-align:center;margin:16px 0}
 .badge-downloads{gap:20px}
 .badge-use{font-size:13px}
 .badge-pack h3{font-size:29px}
 .badge-pack .badge-button{width:100%}
 .badge-how{padding-block:44px}
 .badge-search-note{padding:23px;margin-top:32px}
 .badge-invite{padding-block:40px}
 .badge-invite .badge-kicker{margin-inline:auto}
}
@media(prefers-reduced-motion:reduce){.badges-page{scroll-behavior:auto}}