.learn-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; background: var(--line); border: 2px solid var(--line); }
.learn-grid div { background: var(--paper-2); padding: 24px 26px; display: grid; gap: 8px; align-content: start; min-width: 0; }
.learn-grid h3 { font-size: 1.25rem; }
.learn-grid p { color: var(--ink-soft); }
.bonus .wrap { display: block; }
.bonus .sec-head { margin-bottom: 32px; }
.bonus .sec-head h2 { color: var(--on-spruce); }
.bonus-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; }
.bonus-item { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; min-width: 0; }
.bonus-item h3 { font-size: 1.4rem; margin: 8px 0; }
.bonus-item p { opacity: 0.88; }
.bonus-item .play { width: 76px; height: 76px; }
.bonus-item .play .mono { color: var(--blaze); font-size: 1.5rem; }
.author { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: start; }
.author-body { display: grid; gap: 16px; max-width: 62ch; }
.formats { list-style: none; margin: 8px 0 0; padding: 0; display: grid; border-top: 2px solid var(--ink); max-width: 22rem; }
.formats li { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); font-weight: 600; }
.fine-print { font-size: 0.85rem; }
@media (max-width: 820px) { .bonus-grid, .author { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .learn-grid { grid-template-columns: 1fr; } }

/* Photographic treatment */
.hero-photo { background: #0f1511 var(--hero-img) center 40% / cover no-repeat; color: #f1f3ee; }
.hero-photo::before { opacity: 1; background: linear-gradient(90deg, rgba(10,14,11,.88) 0%, rgba(10,14,11,.62) 50%, rgba(10,14,11,.15) 100%), linear-gradient(0deg, rgba(10,14,11,.55), transparent 35%); }
.hero-photo .wrap { padding-block: 72px 80px; }
.hero-photo h1, .hero-photo .lede { text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.cover { margin: 0; justify-self: center; width: min(320px, 100%); }
.cover img { display: block; width: 100%; height: auto; border-radius: 2px 6px 6px 2px; box-shadow: 0 2px 0 rgba(255,255,255,.08) inset, -10px 0 18px -8px rgba(0,0,0,.6) inset, 0 40px 60px -20px rgba(0,0,0,.85), 0 12px 24px rgba(0,0,0,.45); transform: perspective(1200px) rotateY(-12deg) rotateZ(-1deg); transition: transform .4s ease; }
.cover img:hover { transform: perspective(1200px) rotateY(-4deg); }
.trail { column-gap: 32px; }
ol.trail > li:nth-child(n) { gap: 10px; padding: 24px 0 28px; border-left: 0; }
.trail-img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 3px; margin-bottom: 8px; background: var(--paper-2); filter: saturate(.92) contrast(1.03); }
.bonus-photo { position: relative; background: #121a15 var(--bonus-img) center / cover no-repeat; }
.bonus-photo::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14,20,16,.94), rgba(14,20,16,.82) 55%, rgba(14,20,16,.6)); }
.bonus-photo .wrap { position: relative; }
.cta-photo { position: relative; border-top: 0; background: #120d09 var(--cta-img) center 60% / cover no-repeat; color: #f4efe8; padding-block: 96px; }
.cta-photo::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14,10,7,.9), rgba(14,10,7,.55)); }
.cta-photo .wrap { position: relative; }
.cta-photo p { color: rgba(244,239,232,.82); }
.credits { flex-basis: 100%; font-size: 0.75rem; opacity: 0.75; }
.credits a { color: inherit; }
@media (max-width: 820px) { .cover { width: min(230px, 64%); order: -1; } .cover img { transform: none; } .hero-photo::before { background: rgba(10,14,11,.8); } }
@media (prefers-reduced-motion: reduce) { .cover img { transition: none; } }