/* /wordpress-email-popup-plugin/ — page parts (.pld-*) on top of forest.css (masthead), home.css (.ph-*)
   and blog-theme.css (.pbt-* browser frame, facts, Free vs Pro table, flow, read next). */

.pld .fo-hero .fo-h1 { max-width: 24ch; }

/* A feature row whose screenshot is not uploaded yet: copy only, at reading width. */
.pld .phf-row.pld-solo { grid-template-columns: minmax(0, 1fr); max-width: 46rem; }
.pld .phf-row.pld-solo .phf-copy { order: 0; }
.pld-phone-vis { border: 0; padding: 0; background: none; }

/* Lead magnets + data: two quiet panels side by side. */
.pld-pair { display: grid; gap: 20px; margin-top: 112px; }
@media (min-width: 860px) { .pld-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
.pld-panel { padding: 30px; border: 1px solid var(--line); border-radius: var(--r-lg); background: #fff; box-shadow: var(--sh-1); }
.pld-panel h3 { margin-top: 18px; font-size: 1.3rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.25; }
.pld-panel > p { margin-top: 8px; font-size: 1rem; line-height: 1.65; color: var(--mut); }
.pld-panel .ph-checks { margin-top: 20px; }

/* Free vs Pro: text cells read smaller than the row labels. */
.pld-vs td { font-size: .94rem; color: var(--ink-2); }
.pld-flow-wrap { max-width: 46rem; margin: 64px auto 0; }
.pld-flow-wrap h3 { margin-top: 12px; font-size: clamp(1.4rem, 2.2vw, 1.75rem); font-weight: 750; line-height: 1.2; letter-spacing: -.03em; }

/* Side cards: what the sealed form protects, and the Pinterest setup. */
.pld-proof { padding: 28px; }
.pld-proof h4 { margin-bottom: 18px; font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }
.pld-recipe { display: grid; margin: 0; border-top: 1px solid var(--line); }
.pld-recipe > div { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.pld-recipe dt { font-size: 13px; font-weight: 600; color: var(--mut-2); }
.pld-recipe dd { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--ink); }
@media (max-width: 420px) { .pld-recipe > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

.pld .phf-copy > p + p { margin-top: 14px; }
.pld .phf-copy a { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-color: var(--line); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.pld .phf-copy a:hover { text-decoration-color: var(--rose); }
.pld .phf-copy code { padding: 1px 6px; border-radius: 6px; background: var(--line-2); font-size: .9em; overflow-wrap: anywhere; }
.pld-center { text-align: center; margin-top: 28px; }

/* A full-width camera tour under a section head (the 12 designs). */
.pld-wide { max-width: 64rem; margin: 0 auto 112px; }
@media (max-width: 999px) { .pld-wide { margin-bottom: 72px; } }

/* The phone tour: the frame from blog-theme.css around a .phz figure. */
.pld .pbt-phone-shot .phz { border-radius: 27px; box-shadow: none; }

/* Use cases: two columns of rules (home .ph-extras), never three icon cards. */
@media (min-width: 1100px) { .pld .pld-uses { grid-template-columns: repeat(2, 1fr); } }
