/* =============================================
   Who Gets the Keys? — talk resources page
   Editorial variant (body.edi). Tokens and the
   edi-* primitives come from global.css; this
   file adds only what is specific to this page.
   ============================================= */

/* home.css owns these two helpers, and this page does not load home.css. */
.inline-underline {
    color: var(--color-ink);
    border-bottom: 1px solid var(--color-rule-strong);
    transition: color .2s ease, border-color .2s ease;
}
.inline-underline:hover { border-color: var(--color-accent); color: var(--color-accent); }

/* The editorial headings carry no margin of their own. */
.talk-hero-main .edi-h1 { margin-top: 2.4rem; }
.section-head .edi-h2,
.talk-contact-grid .edi-h2 { margin-top: 2.4rem; }

/* --- Hero --- */
.talk-hero { padding-top: 7.2rem; }
.talk-hero-grid {
    display: grid;
    grid-template-columns: 1.55fr 1fr;
    gap: 6.4rem;
    align-items: start;
}
.talk-lede {
    font-size: 1.8rem;
    line-height: 1.6;
    color: var(--color-ink-2);
    max-width: 58ch;
    margin-top: 3.2rem;
}
.talk-lede strong { color: var(--color-ink); }
.talk-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.6rem;
    margin-top: 3.2rem;
}

/* Definition list used for the event facts and the contact facts. */
.talk-meta {
    display: grid;
    gap: 2rem;
    margin-top: 3.2rem;
    border-top: 1px solid var(--color-rule-strong);
    padding-top: 2.4rem;
}
.talk-meta dt {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-ink-3);
    margin-bottom: 0.6rem;
}
.talk-meta dd {
    font-size: 1.5rem;
    line-height: 1.5;
    color: var(--color-ink);
    margin: 0;
}
.talk-hero-side .talk-meta { margin-top: 0; }

/* --- Deck card --- */
.deck-card {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 4.8rem;
    border-top: 1px solid var(--color-rule-strong);
    border-bottom: 1px solid var(--color-rule-strong);
    padding: 4rem 0;
}
.deck-copy h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: 2.8rem;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--color-ink);
    margin-bottom: 2.4rem;
}
.deck-list { list-style: none; display: grid; gap: 1.6rem; }
.deck-list li {
    font-size: 1.5rem;
    line-height: 1.6;
    color: var(--color-ink-2);
    padding-left: 2rem;
    position: relative;
    margin: 0;
}
.deck-list li::before {
    content: "—";
    position: absolute;
    left: 0;
    color: var(--color-accent);
}
.deck-list strong { color: var(--color-ink); }
.deck-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* Sized by its own content, not stretched to the height of the slide list. */
    align-self: start;
    gap: 1.6rem;
    background: var(--color-paper-2);
    padding: 3.2rem;
}
.deck-note {
    font-family: var(--font-mono);
    font-size: 1.2rem;
    color: var(--color-ink-3);
    margin: 0;
}

/* --- Background / next steps --- */
.next-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border-top: 1px solid var(--color-rule-strong);
}
.next-card {
    padding: 3.2rem 2.8rem;
    border-right: 1px solid var(--color-rule);
    border-bottom: 1px solid var(--color-rule);
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}
.next-card:last-child { border-right: 0; }
.next-card-accent { background: var(--color-callout); }
.next-card h3 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: 2.4rem;
    line-height: 1.15;
    color: var(--color-ink);
    margin: 0;
}
.next-card p {
    font-size: 1.5rem;
    line-height: 1.6;
    color: var(--color-ink-2);
    margin: 0;
}
.next-card .edi-btn { align-self: flex-start; margin-top: auto; }
.book-list { list-style: none; display: grid; gap: 1.2rem; }
.book-list li {
    font-size: 1.5rem;
    line-height: 1.55;
    color: var(--color-ink-2);
    margin: 0;
}
.next-note { margin: 0; }

/* --- Contact --- */
.talk-contact { border-bottom: 0; }
.talk-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6.4rem;
    align-items: start;
}
.talk-form-wrap {
    background: var(--color-white);
    border: 1px solid var(--color-rule-strong);
    padding: 3.2rem;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
    .talk-hero-grid,
    .talk-contact-grid { grid-template-columns: 1fr; gap: 4rem; }
    .deck-card { grid-template-columns: 1fr; gap: 3.2rem; }
}

@media (max-width: 820px) {
    .next-grid { grid-template-columns: 1fr; }
    .next-card { border-right: 0; }
}

@media (max-width: 768px) {
    .talk-hero { padding-top: 4.8rem; }
    .edi-section { padding: 6.4rem 0; }
    .talk-lede { font-size: 1.7rem; }
    .deck-actions { padding: 2.4rem; }
    .talk-form-wrap { padding: 2.4rem; }
}

/* --- Quick-start block in the companion-repo card --- */
/* Grid and flex children default to min-width:auto, so without this the <pre>
   below widens the page instead of scrolling inside its own box. */
.deck-card > *,
.deck-actions { min-width: 0; }
.code-block {
    max-width: 100%;
    min-width: 0;
    font-family: var(--font-mono);
    font-size: 1.2rem;
    line-height: 1.7;
    color: var(--color-paper);
    background: var(--color-ink);
    padding: 1.8rem 2rem;
    margin: 0;
    width: 100%;
    /* Long commands scroll inside the block rather than widening the page. */
    overflow-x: auto;
}
.code-block code { font-family: inherit; white-space: pre; }
