/* The "Free stuff" dropdown in the main nav (Blog, Dictionary, Email My Deck),
 * shared by every page that carries the main pitch.dog nav. It is a <details>
 * element, so it opens and closes without JavaScript. */
.pd-nav-more { position: relative; }
.pd-nav-more > summary { min-height: 44px; padding: 0 12px 0 14px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid transparent; color: inherit; cursor: pointer; list-style: none; user-select: none; -webkit-user-select: none; transition: background 160ms ease, border-color 160ms ease; }
.pd-nav-more > summary::-webkit-details-marker { display: none; }
.pd-nav-more > summary svg { display: block; width: 14px; height: 14px; fill: currentColor; transition: transform 240ms cubic-bezier(.23, 1, .32, 1); }
.pd-nav-more[open] > summary svg { transform: rotate(180deg); }
.pd-nav-more > summary:focus-visible { outline: 3px solid var(--blue, #0450d4); outline-offset: 3px; }
.pd-nav-more:has(a[aria-current]) > summary { border-color: var(--rule-strong, rgb(14 14 15 / .27)); }
.pd-nav-more[open] > summary, .pd-nav-more > summary:hover { background: color-mix(in srgb, var(--ink, #0e0e0f) 7%, transparent); }
.pd-nav-more .pd-nav-more-menu { position: absolute; z-index: 40; top: calc(100% + 10px); left: 0; width: max-content; min-width: 300px; padding: 8px; display: grid; gap: 2px; border: 1px solid var(--rule-strong, rgb(14 14 15 / .27)); background: var(--panel, var(--sheet, var(--paper, #fffdfb))); color: var(--ink, #0e0e0f); box-shadow: 8px 8px 0 color-mix(in srgb, var(--blue, #0450d4) 12%, transparent), 0 18px 48px rgb(0 0 0 / .14); animation: pd-nav-more-in 220ms cubic-bezier(.23, 1, .32, 1) both; }
.pd-nav-more .pd-nav-more-menu a { min-height: 0; padding: 12px 14px; display: grid; justify-content: stretch; align-items: start; gap: 3px; border: 1px solid transparent; background: transparent; color: inherit; font-size: 1rem; line-height: 1.25; text-decoration: none; text-align: left; transition: background 140ms ease, border-color 140ms ease; }
.pd-nav-more .pd-nav-more-menu a strong { font-weight: 600; }
.pd-nav-more .pd-nav-more-menu a span { color: var(--muted, #65666e); font-size: .84rem; }
.pd-nav-more .pd-nav-more-menu a:hover, .pd-nav-more .pd-nav-more-menu a:focus-visible { background: color-mix(in srgb, var(--ink, #0e0e0f) 6%, transparent); }
.pd-nav-more .pd-nav-more-menu a[aria-current] { border-color: var(--rule-strong, rgb(14 14 15 / .27)); }
@keyframes pd-nav-more-in { from { opacity: 0; transform: translateY(-6px); } }
@media (max-width: 809px) { .pd-nav-more[data-hide-below="810"] { display: none; } }
@media (max-width: 760px) { .pd-nav-more[data-hide-below="761"] { display: none; } }
@media (max-width: 600px) { .pd-nav-more[data-hide-below="601"] { display: none; } }

/* The same three links inside the mobile menus. */
.pd-mobile-more { margin-top: 28px; display: grid; }
.pd-mobile-more .eyebrow { margin-bottom: 10px; }
.pd-mobile-more a { min-height: 52px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--rule, rgb(14 14 15 / .14)); color: inherit; font-size: 1.15rem; font-weight: 550; text-decoration: none; }
.pd-mobile-more a:last-child { border-bottom: 1px solid var(--rule, rgb(14 14 15 / .14)); }
.pd-mobile-more a::after { content: "→"; color: var(--blue, #0450d4); }
.pd-mobile-more a[aria-current] { color: var(--muted, #65666e); }
@media (prefers-reduced-motion: reduce) { .pd-nav-more .pd-nav-more-menu { animation: none; } .pd-nav-more > summary svg { transition: none; } }