.guides-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: end; padding-block: 56px 44px; }
.guides-intro h1 { font-size: clamp(52px, 7vw, 88px); }
.guides-intro .blog-intro__description { margin: 0; font-size: 17px; max-width: 43ch; }
.guide { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1fr); gap: clamp(40px,7vw,96px); padding-block: 64px 72px; border-top: 1px solid var(--blog-rule); scroll-margin-top: 30px; }
.guide-cover { display: block; align-self: center; min-width: 0; width: min(100%,310px); margin: auto; }
.guide-cover__image { display: block; width: 100%; height: auto; box-shadow: 7px 14px 26px #3224161c; }
.guide-cover__type { aspect-ratio: 595/842; padding: 10%; background: #e8e1d5; display: flex; flex-direction: column; justify-content: space-between; }
.guide-cover__type p { font: 400 clamp(30px,4vw,48px)/1.15 var(--font-serif); overflow-wrap: anywhere; }
.guide-cover__type span { font-size: 12px; }
.guide-content { min-width: 0; align-self: center; }
.guide-content h2 { font: 400 clamp(32px,3.6vw,48px)/1.15 var(--font-serif); letter-spacing: -.025em; text-wrap: pretty; }
.guide-content h2 a:hover { color: var(--blog-accent); }
.guide-description { margin-top: 22px; color: var(--blog-muted); font-size: 16px; line-height: 1.8; max-width: 50ch; }
.guide-meta { margin: 20px 0 28px; color: var(--blog-muted); font-size: 12px; }
.guide-button { display: inline-flex; justify-content: space-between; align-items: center; gap: 28px; min-height: 48px; border-radius: 999px; background: var(--blog-ink); color: var(--blog-paper); padding: 15px 26px; font-size: 12px; font-weight: 600; margin-top: 8px; cursor: pointer; }
.guide-button:hover { background: var(--blog-accent); }
.guides-main :focus-visible { outline: 2px solid var(--blog-accent); outline-offset: 5px; }
.guide-form input[aria-invalid] { border-color: #9a3227; }
.guide-note { color: var(--blog-muted); font-size: 12px; line-height: 1.7; margin-top: 10px; }
.guide-error { color: #9a3227; font-size: 13px; line-height: 1.7; margin-top: 12px; }
.guide-success { border-top: 1px solid var(--blog-rule); padding-top: 24px; }
.guide-success h3 { font: 400 28px/1.2 var(--font-serif); }
.guide-success p, .guide-unavailable, .guides-empty { color: var(--blog-muted); font-size: 14px; line-height: 1.8; margin-top: 16px; }
.guide-feedback { scroll-margin-top: 100px; }
.guide-detail .guide { border-top: 0; padding-block: 44px 80px; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
.guide-detail .guide-cover { width: min(100%,320px); }
.guide-detail h1 { font: 400 clamp(38px,4.1vw,56px)/1.1 var(--font-serif); letter-spacing: -.025em; text-wrap: pretty; }
.guide-back { margin-top: 28px; }
.guide-detail .guide-description { margin-top: 24px; }
@media (min-width: 768px) {
    .guide--reverse { grid-template-columns: minmax(0,1fr) minmax(0,.85fr); }
    .guide--reverse .guide-cover { grid-column: 2; grid-row: 1; }
    .guide--reverse .guide-content { grid-column: 1; grid-row: 1; }
}
@media (max-width: 767px) {
    .guides-intro, .guide, .guide-detail .guide { grid-template-columns: minmax(0,1fr); gap: 28px; }
    .guides-intro { padding-block: 36px 32px; gap: 20px; }
    .guide { padding-block: 40px 48px; }
    .guide-cover { width: min(100%,220px); }
    .guide-content h2 { font-size: 34px; }
    .guide-detail .guide { grid-template-columns: 96px minmax(0,1fr); column-gap: 22px; row-gap: 24px; padding-block: 28px 48px; }
    .guide-detail .guide-content { display: contents; }
    .guide-detail .guide-cover { grid-column: 1; grid-row: 1; width: 100%; }
    .guide-detail h1 { grid-column: 2; grid-row: 1; align-self: center; font-size: 30px; }
    .guide-detail .guide-description, .guide-detail .guide-meta, .guide-detail .guide-feedback { grid-column: 1 / -1; margin: 0; }
    .guide-button { width: 100%; }
}
@media (max-width: 359px) {
    .guide-detail .guide { grid-template-columns: 72px minmax(0,1fr); column-gap: 16px; }
    .guide-detail h1 { font-size: 26px; overflow-wrap: anywhere; }
}
/* Guide opening: title first, book aside, download on its own line. */
.guides-intro { display: block; padding-block: 44px 36px; }
.guides-intro h1 { font-size: clamp(48px,5vw,64px); margin-bottom: 20px; }
.guides-intro .blog-intro__description { max-width: 60ch; font-size: 16px; }
.guide-detail .guide { grid-template-columns: minmax(0,1fr) 240px; column-gap: 100px; row-gap: 36px; align-items: start; padding-block: 40px 64px; }
.guide-detail .guide-content { grid-column: 1; grid-row: 1; align-self: start; }
.guide-detail .guide-cover { grid-column: 2; grid-row: 1; width: 220px; margin: 12px 0 0; }
.guide-detail h1 { font-size: clamp(44px,5.6vw,72px); line-height: 1.04; max-width: 19ch; }
.guide-detail .guide-description { max-width: 53ch; font-size: 17px; margin-top: 28px; }
.guide-detail .guide-meta { margin: 22px 0 0; }
.capture-download { grid-column: 1 / -1; border-top: 1px solid var(--blog-rule); padding-top: 24px; }
.capture-download .guide-form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px 20px; max-width: 760px; }
.capture-download .guide-form label { grid-column: 1 / -1; margin-bottom: 0; }
.capture-download .guide-form input[type=email] { grid-column: 1; }
.capture-download .guide-form .guide-button { grid-column: 2; grid-row: 2; margin: 0; }
.capture-download .guide-form .guide-error { grid-column: 1 / -1; }
@media (max-width: 1023px) and (min-width: 768px) {
    .guide-detail .guide { grid-template-columns: minmax(0,1fr) 170px; column-gap: 48px; }
    .guide-detail .guide-cover { width: 170px; }
}
@media (max-width: 767px) {
    .guide-detail .guide { grid-template-columns: 76px minmax(0,1fr); gap: 24px; padding-block: 28px 48px; }
    .guide-detail .guide-content { display: contents; }
    .guide-detail h1 { grid-column: 1 / -1; grid-row: 1; font-size: 39px; line-height: 1.08; }
    .guide-detail .guide-cover { grid-column: 1; grid-row: 2; width: 76px; margin: 0; }
    .guide-detail .guide-description { grid-column: 2; grid-row: 2; margin: 0; font-size: 14px; }
    .guide-detail .guide-meta { grid-column: 1 / -1; grid-row: 3; margin: 0; }
    .capture-download { grid-row: 4; padding-top: 20px; }
    .capture-download .guide-form { display: block; }
    .capture-download .guide-form label { margin-bottom: 10px; }
    .capture-download .guide-form .guide-button { width: 100%; margin-top: 14px; }
}
@media (max-width: 359px) { .guide-detail h1 { font-size: 35px; } }

/* Full-width guide opening, with the download next to the original cover. */
.guides-main:not(.guide-detail) .guide:first-of-type { border-top: 0; }
.capture-hero { background: #f1f1f1; }
.capture-hero__layout { display: grid; grid-template-columns: minmax(0,1fr) 420px; gap: 72px; align-items: center; }
.capture-hero__copy { padding-block: 32px 48px; min-width: 0; }
.capture-hero .guide-back { margin: 0 0 24px; }
.guide-detail .capture-hero h1 { font-size: clamp(40px,4.7vw,64px); line-height: 1.08; max-width: 19ch; }
.guide-detail .capture-hero .guide-description { margin-top: 24px; max-width: 50ch; font-size: 16px; }
.guide-detail .capture-hero .guide-meta { margin: 20px 0 24px; }
.capture-hero__cover { align-self: stretch; display: flex; align-items: center; }
.capture-hero__cover .guide-cover__image { width: 100%; height: auto; box-shadow: none; }
.capture-hero .capture-download { border: 0; padding: 0; }
.capture-hero .guide-form { display: block; max-width: 470px; }
.capture-hero .guide-form label { font-size: 14px; margin-bottom: 10px; }
.capture-hero .guide-form .guide-button { margin-top: 14px; }
@media (max-width: 1023px) and (min-width: 768px) {
 .capture-hero__layout { grid-template-columns: minmax(0,1fr) 300px; gap: 36px; }
}
@media (max-width: 767px) {
 .capture-hero__layout { grid-template-columns: minmax(0,1fr); gap: 0; }
 .capture-hero__copy { padding-block: 24px 32px; }
 .capture-hero__cover { max-width: 280px; margin-inline: auto; }
 .guide-detail .capture-hero h1 { font-size: 40px; }
 .capture-hero .guide-form .guide-button { width: 100%; }
}

/* Compact inline download controls. */
.capture-hero .guide-form { display: grid; grid-template-columns: minmax(0,280px) auto; gap: 12px; max-width: 480px; }
.capture-hero .guide-form label { grid-column: 1 / -1; margin: 0; }
.capture-hero .guide-form input[type=email] { grid-column: 1; grid-row: 2; }
.capture-hero .guide-form .guide-button { grid-column: 2; grid-row: 2; margin: 0; gap: 16px; padding-inline: 20px; white-space: nowrap; }
.capture-hero .guide-form .guide-error { grid-column: 1 / -1; }
.guide-detail { padding-bottom: 0; }
@media (max-width: 1023px) {
 .capture-hero .guide-form { grid-template-columns: minmax(0,1fr); }
 .capture-hero .guide-form .guide-button { grid-column: 1; grid-row: 3; justify-self: start; width: auto; }
}
@media (max-width: 767px) {
 .capture-hero .guide-form { grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
 .capture-hero .guide-form .guide-button { grid-column: 2; grid-row: 2; width: auto; padding-inline: 15px; gap: 8px; font-size: 9px; }
 .capture-hero .guide-form input[type=email] { padding-inline: 16px; }
 .capture-hero .guide-form label { padding-left: 16px; }
}
@media (max-width: 359px) {
 .capture-hero .guide-form { grid-template-columns: minmax(0,1fr); }
 .capture-hero .guide-form .guide-button { grid-column: 1; grid-row: 3; }
}