:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--color-bg); color: var(--color-text); font-size: 1rem; line-height: 1.65; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 5px; }
::selection { background: var(--color-accent); color: var(--color-bg); }
.shell { width: min(100% - 7rem, 1240px); min-height: 100svh; margin: auto; display: flex; flex-direction: column; }
header { min-height: 126px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; border-bottom: 1px solid var(--color-divider); }
.wordmark { display: inline-flex; align-items: flex-start; font-size: 2rem; letter-spacing: -.09em; font-weight: 500; line-height: 1.5; }
.wordmark span { margin: .25rem 0 0 .55rem; font-size: 1rem; letter-spacing: 0; color: var(--color-accent-400); }
nav { display: flex; align-items: center; gap: 2.4rem; }
nav a, footer a { min-height: 44px; display: inline-flex; align-items: center; gap: .65rem; }
nav a { font-size: .9375rem; color: var(--color-neutral-400); position: relative; }
nav a:hover, nav a[aria-current], footer a:hover { color: var(--color-text); }
nav a[aria-current]::after { content: ""; position: absolute; bottom: 0; left: 0; width: 18px; height: 2px; background: var(--color-accent); }
main { flex: 1; padding-top: 2.4rem; }
.intro { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; }
.eyebrow, .edition, .art-caption, .art-bottom { font-family: "Geist Mono", ui-monospace, Consolas, monospace; font-weight: 400; font-size: .75rem; letter-spacing: .085em; text-transform: uppercase; }
.eyebrow { color: var(--color-neutral-300); }
.edition { color: var(--color-neutral-500); }
.hero-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 4rem; align-items: center; padding: 3.5rem 0 3rem; }
h1 { font-size: clamp(3.5rem, 6.5vw, 6.4rem); line-height: 1.02; letter-spacing: -.075em; font-weight: 500; margin: 0 0 1.8rem; }
.accent { color: var(--color-accent-400); }
.hero-copy p, .contact-content > p { color: var(--color-neutral-400); font-size: 1.0625rem; line-height: 1.8; }
.button { border: 1px solid var(--color-accent); border-radius: var(--radius-sm); display: inline-flex; align-items: center; gap: 2.2rem; color: var(--color-accent-300); padding: .8rem 1.2rem; min-height: 48px; margin-top: 1.1rem; font-size: .9375rem; transition: background .18s; }
.button:hover { background: color-mix(in srgb, var(--color-accent) 12%, transparent); }
.type-art { aspect-ratio: 1; max-height: 410px; position: relative; border: 1px solid var(--color-accent-700); border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(-9deg); color: var(--color-accent-400); }
.art-caption { text-align: center; line-height: 1.5; margin-top: 1rem; }
.big-b { font-size: clamp(9rem, 17vw, 17rem); letter-spacing: -.08em; line-height: .85; font-weight: 500; margin: .4rem 1rem 1.5rem 0; }
.big-b span { font-size: .44em; vertical-align: top; display: inline-block; margin: .35em 0 0 -.1em; }
.art-bottom { font-size: .75rem; letter-spacing: .025em; }
.shop-note { display: flex; align-items: center; gap: 3rem; padding: 1.75rem 0 2rem; border-top: 1px solid var(--color-divider); }
.shop-note p { font-size: .9375rem; color: var(--color-neutral-400); margin: 0; }
.note-mark { margin-left: auto; font-size: 2.5rem; color: var(--color-accent); }
footer { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-top: 1px solid var(--color-divider); color: var(--color-neutral-400); font-size: .8125rem; padding: 1.2rem 0; }
footer > div { display: flex; gap: 1.8rem; }
.footer-aside { margin-left: .65rem; color: var(--color-neutral-500); }
.about-heading { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 4rem; margin: 4rem 0; }
.about-copy { max-width: 31rem; color: var(--color-neutral-400); }
.about-copy p:first-child { color: var(--color-text); }
.about-copy p { margin: 0 0 1rem; }
.inventory { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; border-top: 1px solid var(--color-divider); padding-top: 2rem; }
.inventory article + article { border-left: 1px solid var(--color-divider); padding-left: 2.5rem; }
h2 { font-size: 1.4rem; font-weight: 500; letter-spacing: -.04em; margin: 1.2rem 0 .4rem; }
.inventory p { color: var(--color-neutral-400); margin: 0; max-width: 27ch; }
.bottom-line { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 2.6rem 0; }
.bottom-line p { color: var(--color-neutral-400); }
.text-link { min-height: 44px; display: inline-flex; align-items: center; gap: 1.5rem; color: var(--color-accent-300); }
.text-link:hover, .email-link:hover { color: var(--color-text); }
.contact-content { text-align: center; padding: 3.5rem 0 4.5rem; }
.contact-star { display: block; color: var(--color-accent-400); font-size: 3rem; line-height: 1; margin-bottom: 2rem; }
.contact h1 { font-size: clamp(3.2rem, 6vw, 5.75rem); }
.email-link { display: inline-flex; align-items: center; gap: 1.5rem; font-size: clamp(1.5rem, 3vw, 2.5rem); letter-spacing: -.055em; border-bottom: 1px solid var(--color-accent); padding: .7rem 0; color: var(--color-accent-300); margin: .5rem 0; }
.contact-content > .small-note { font-size: .8125rem; color: var(--color-neutral-500); }
.skip { position: fixed; top: -6rem; left: 1rem; padding: .7rem 1rem; z-index: 10; background: var(--color-surface); }
.skip:focus { top: 1rem; }
@media (min-width: 1600px) { .hero-grid { padding: 5rem 0; } }
@media (max-width: 900px) { .shell { width: calc(100% - 3rem); } .hero-grid { gap: 2rem; } .edition { display: none; } .type-art { max-height: 320px; } .art-bottom { display: none; } .about-heading { gap: 2rem; } .footer-aside { display: none; } }
@media (max-width: 640px) {
  .shell { width: calc(100% - 2.5rem); } header { min-height: 96px; gap: 1rem; flex-wrap: wrap; padding: 1rem 0; } .wordmark { font-size: 1.65rem; } nav { gap: 1.1rem; } nav a { font-size: .875rem; }
  main { padding-top: 1.8rem; } .eyebrow { font-size: .75rem; letter-spacing: .025em; } .hero-grid { grid-template-columns: 1fr; padding-top: 2.8rem; gap: 2.6rem; } h1 { font-size: clamp(2.75rem, 11.6vw, 4.5rem); } .hero-copy p { font-size: 1rem; } .type-art { width: 72%; max-width: 300px; justify-self: center; margin: .5rem 0 1rem; } .big-b { font-size: 9rem; } .art-caption { font-size: .75rem; } .shop-note { gap: 1rem; flex-wrap: wrap; } .shop-note .eyebrow { width: 100%; } .shop-note p { font-size: .875rem; }
  footer { align-items: flex-start; flex-direction: column; gap: .4rem; } footer > div { width: 100%; justify-content: space-between; gap: 1rem; flex-wrap: wrap; } .about-heading { grid-template-columns: 1fr; gap: .5rem; margin: 2.8rem 0; } .inventory { grid-template-columns: 1fr; gap: 2rem; } .inventory article + article { padding: 1.8rem 0 0; border-left: 0; border-top: 1px solid var(--color-divider); } .inventory p { max-width: 38ch; } .bottom-line { align-items: flex-start; flex-direction: column; gap: 0; } .contact-content { padding: 3rem 0; } .contact h1 { font-size: clamp(2.5rem, 10.5vw, 4rem); } .email-link { gap: .75rem; font-size: clamp(1.25rem, 6.7vw, 2.5rem); } .desktop-break { display: none; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }