body { background: var(--paper); }
.hero { min-height: 0; padding: clamp(56px,6vw,88px) var(--page) 40px; background: var(--blue); color: var(--paper); border: 0; border-bottom: 16px solid var(--orange); text-align: left; display: flex; flex-direction: column; justify-content: space-between; }
.hero::before { content: "PERSONAL INDEX / READING"; color: var(--orange); font: 700 .7rem/1 var(--font-mono); letter-spacing: .1em; }
.hero h1 { margin: 24px 0 0; font-size: clamp(2.75rem,7vw,6rem); line-height: .95; letter-spacing: -.03em; }
.hero p { max-width: 40ch; margin: 40px 0 0 50%; color: var(--paper); font: 1rem/1.5 var(--font-sans); letter-spacing: 0; text-transform: none; }
.current-section { padding: clamp(72px,10vw,150px) var(--page); background: var(--orange); color: var(--ink); border-bottom: 2px solid var(--ink); }
.section-label { margin: 0 0 64px; color: var(--ink); opacity: 1; text-align: left; font-family: var(--font-mono); }
.current-book { max-width: var(--maxw); display: grid; grid-template-columns: repeat(12,1fr); gap: var(--gutter); align-items: end; }
.current-cover { grid-column: 1 / 5; width: 100%; height: auto; aspect-ratio: 2/3; border: 2px solid var(--ink); border-radius: 0; box-shadow: none; transform: rotate(-2deg); }
.current-info { grid-column: 6 / 13; text-align: left; }
.current-info h2 { font-size: clamp(2.6rem,6vw,6.5rem); line-height: .88; letter-spacing: -.065em; text-transform: uppercase; }
.current-info .author { margin-top: 24px; font-family: var(--font-mono); opacity: 1; }
.current-info .year { font-family: var(--font-mono); opacity: .7; }
.past-section { padding: clamp(72px,9vw,136px) var(--page); background: var(--paper); }
.past-header { margin-bottom: 64px; padding-bottom: 16px; border-bottom: 2px solid var(--ink); color: var(--focus); text-align: left; font-family: var(--font-mono); }
.books-grid { max-width: var(--maxw); grid-template-columns: repeat(12,1fr); gap: 64px var(--gutter); }
.book-card { grid-column: span 3; opacity: 1; transform: none; }
.book-cover { border: 2px solid var(--ink); border-radius: 0; box-shadow: none; cursor: default; }
.book-cover:hover { transform: translate(-5px,-5px); box-shadow: 5px 5px 0 var(--blue); }
.book-cover:hover img { transform: none; }
.book-meta { padding-top: 12px; border-top: 1px solid var(--ink); }
.book-meta h3 { font-size: 1rem; line-height: 1.15; }
.book-meta .author, .book-meta .year { font-family: var(--font-mono); font-size: .68rem; }
@media(max-width:900px){.book-card{grid-column:span 4}}
@media(max-width:767px){.hero{border-bottom-width:12px}.hero h1{font-size:clamp(2.5rem,10vw,3.5rem)}.hero p{margin-left:18%}.current-book{display:block}.current-cover{width:min(64vw,260px);margin-bottom:56px}.current-info h2{font-size:clamp(2.6rem,12vw,4.5rem)}.book-card{grid-column:span 6}}
