/* =========================================================================
 * DFLV optional article layout
 * Scoped under .dflv-article-page so it overrides the theme on single posts
 * without affecting anything else. Fonts: Poppins (headings) + Inter (body).
 * ====================================================================== */
.dflv-article-page{
  --da-teal:#0E9384;--da-teal-soft:#E6F5F3;--da-teal-ink:#0B6E63;
  --da-coral:#E8564A;--da-coral-soft:#FDEEEC;--da-coral-ink:#C43D32;
  --da-gold:#D9932A;--da-gold-soft:#FBF0DC;--da-gold-ink:#A66C15;
  --da-ink:#141414;--da-ink-2:#585856;--da-ink-3:#8A8A87;--da-line:#EAEAE7;--da-bg-soft:#FAFAF8;--da-radius:16px;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--da-ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
.dflv-article-page *{box-sizing:border-box}
.dflv-article-page a{text-decoration:none;color:inherit}

.dflv-art-wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.dflv-art{max-width:720px;margin:0 auto}

/* headings */
.dflv-article-page h1,.dflv-article-page h2,.dflv-article-page h3,.dflv-article-page h4{
  font-family:'Poppins',sans-serif;font-weight:700;letter-spacing:-.015em;line-height:1.15;color:var(--da-ink);
}

/* header */
.dflv-art-head{padding:14px 0 20px}
.dflv-art-crumb{font-size:.76rem;color:var(--da-ink-3);margin-bottom:16px}
.dflv-art-crumb a{color:var(--da-ink-2)}
.dflv-art-chip{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--da-coral);padding:5px 11px;border-radius:6px}
.dflv-art-title{font-size:2.5rem;line-height:1.08;margin:0 0 14px}
.dflv-art-dek{font-size:1.15rem;color:var(--da-ink-2);line-height:1.5;font-weight:400;margin:0}

/* ---- headline subtitle (from the theme's own subtitle field) — 4
   selectable styles. The H1's own bottom margin is zeroed out whenever a
   subtitle follows it, so the subtitle's own margin-top fully controls the
   gap instead of the two collapsing together unpredictably. */
.dflv-art-subtitle{display:none}
.dflv-art-title:has(+ .dflv-art-subtitle--filled){margin-bottom:0}
.dflv-art-subtitle--filled.dflv-art-subtitle--stacked{display:block;font-family:'Poppins',sans-serif;font-weight:500;font-size:1.3rem;line-height:1.35;color:var(--da-ink-2);margin:8px 0 14px}
.dflv-art-subtitle--filled.dflv-art-subtitle--muted{display:block;font-family:'Poppins',sans-serif;font-weight:600;font-size:1.15rem;line-height:1.35;color:var(--da-ink-3);margin:4px 0 14px}
.dflv-art-subtitle--filled.dflv-art-subtitle--divider{display:block;font-family:'Inter',sans-serif;font-weight:500;font-size:1.05rem;line-height:1.5;color:var(--da-ink-2);margin:14px 0 14px}
.dflv-art-subtitle--filled.dflv-art-subtitle--divider::before{content:"";display:block;width:36px;height:3px;background:var(--da-coral);border-radius:2px;margin-bottom:14px}
.dflv-art-subtitle--filled.dflv-art-subtitle--masthead{display:block;font-family:'Poppins',sans-serif;font-weight:500;font-style:italic;font-size:1.15rem;line-height:1.3;color:var(--da-ink-2);margin:2px 0 14px}

/* byline */
.dflv-art-byline{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid var(--da-line)}
.dflv-art-avatar{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,var(--da-coral-soft),#F6D9D5);color:var(--da-coral-ink);font-family:'Poppins',sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.02em}
.dflv-art-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.dflv-art-by-meta{font-size:.86rem;color:var(--da-ink-2);line-height:1.45}
.dflv-art-by-meta a{color:inherit}
.dflv-art-by-meta b{color:var(--da-ink);font-weight:600}
.dflv-art-by-meta .dflv-art-sub{color:var(--da-ink-3);font-size:.8rem}
.dflv-art-by-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.dflv-art-factcheck{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:600;color:var(--da-teal-ink);background:var(--da-teal-soft);border-radius:999px;padding:6px 12px;white-space:nowrap}

/* hero image (heroes 'a' and 'fw15' only — renders inside .dflv-art-railmain,
   see $dflv_hero_image_html in templates/single.php, so width:100% is
   correct on its own: the parent column is already the right width whether
   or not the margin rail is on, the same reasoning as .dflv-art-news) */
.dflv-art-hero{width:100%;margin:26px 0 8px}
.dflv-art-hero-img,.dflv-art-hero img{width:100%;height:auto;border-radius:var(--da-radius);border:1px solid var(--da-line);display:block}
.dflv-art-cap,.dflv-art-body .wp-caption-text,.dflv-art-body figcaption{font-size:.78rem;color:var(--da-ink-3);margin-top:9px;line-height:1.5}

/* body typography */
.dflv-art-body{max-width:720px;margin:0 auto;padding:12px 0 6px}

/* ---- Presented By credits (from the PBL Manager plugin's own data) ----
 * Prepended to the very top of the body, so the first rule here gives that
 * position sensible spacing regardless of which style is chosen. */
.dflv-art-pbl{margin-bottom:20px}
.dflv-art-pbl--multi > *{margin-bottom:10px}
.dflv-art-pbl--multi > *:last-child{margin-bottom:0}
.dflv-art-pbl-logo{flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden}
.dflv-art-pbl-logo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.dflv-art-pbl a{color:inherit;text-decoration:none}
.dflv-art-pbl a:hover{text-decoration:underline}

/* 1 . slim inline row */
.dflv-art-pbl-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid var(--da-line);border-bottom:1px solid var(--da-line)}
.dflv-art-pbl-row .dflv-art-pbl-logo{width:32px;height:32px;background:var(--da-teal-soft);border-radius:6px}
.dflv-art-pbl-row .dflv-art-pbl-txt{font-size:.85rem;color:var(--da-ink-3)}
.dflv-art-pbl-row .dflv-art-pbl-txt b{color:var(--da-ink);font-weight:600}
.dflv-art-pbl-row .dflv-art-pbl-txt a{color:var(--da-teal-ink)}

/* 2 . small card, framed logo */
.dflv-art-pbl-card{display:flex;align-items:center;gap:12px;background:var(--da-bg-soft);border-radius:12px;padding:12px 16px}
.dflv-art-pbl-card .dflv-art-pbl-logo{width:40px;height:40px;background:#fff;border:1px solid var(--da-line);border-radius:8px;padding:4px}
.dflv-art-pbl-card-text{display:flex;flex-direction:column;min-width:0}
.dflv-art-pbl-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--da-ink-3)}
.dflv-art-pbl-brand{font-size:.95rem;font-weight:600;color:var(--da-ink);margin-top:2px}

/* 3 . kicker-style, minimal (no logo shown) */
.dflv-art-pbl-kicker{display:flex;align-items:center;gap:8px}
.dflv-art-pbl-kicker .dflv-art-pbl-txt{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--da-ink-3)}
.dflv-art-pbl-kicker .dflv-art-pbl-brand{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--da-teal-ink)}
.dflv-art-pbl-kicker .dflv-art-pbl-sep{color:var(--da-line)}

/* ---- Presented By, header-zone styles (render above the byline's own
   divider instead of at the top of the body) ---- */
.dflv-art-pbl-header{margin-top:18px}
.dflv-art-pbl-header--multi > *{margin-bottom:10px}
.dflv-art-pbl-header--multi > *:last-child{margin-bottom:0}

/* header-badge: small pill, sits right before the H1 */
.dflv-art-pbl-badge{display:inline-flex;align-items:center;gap:7px;background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:999px;padding:5px 12px 5px 6px;margin-bottom:14px}
.dflv-art-pbl-badge .dflv-art-pbl-logo{width:20px;height:20px;border-radius:50%}
.dflv-art-pbl-badge .dflv-art-pbl-txt{font-size:.76rem;color:var(--da-ink-2)}
.dflv-art-pbl-badge .dflv-art-pbl-txt b{color:var(--da-ink);font-weight:600}
.dflv-art-pbl-badge .dflv-art-pbl-txt a{color:inherit;text-decoration:none}
.dflv-art-pbl-badge a:hover{text-decoration:underline}

/* header-badge-lg: same pill shape, larger logo */
.dflv-art-pbl-badge-lg{display:inline-flex;align-items:center;gap:10px;background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:999px;padding:6px 16px 6px 6px;margin-bottom:16px}
.dflv-art-pbl-badge-lg .dflv-art-pbl-logo{width:32px;height:32px;border-radius:50%}
.dflv-art-pbl-badge-lg .dflv-art-pbl-txt{font-size:.82rem;color:var(--da-ink-2)}
.dflv-art-pbl-badge-lg .dflv-art-pbl-txt b{color:var(--da-ink);font-weight:600}
.dflv-art-pbl-badge-lg .dflv-art-pbl-txt a{color:inherit;text-decoration:none}
.dflv-art-pbl-badge-lg a:hover{text-decoration:underline}

/* header-badge-led: logo-led, no pill background, logo in its own frame */
.dflv-art-pbl-badge-led{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.dflv-art-pbl-badge-led .dflv-art-pbl-logo{width:44px;height:44px;background:#fff;border:1px solid var(--da-line);border-radius:10px}
.dflv-art-pbl-badge-led .dflv-art-pbl-card-text{display:flex;flex-direction:column}
.dflv-art-pbl-badge-led a:hover{text-decoration:underline}

/* header-badge-block: rectangular card, logo fills full height on the left */
.dflv-art-pbl-badge-block{display:inline-flex;align-items:stretch;border:1px solid var(--da-line);border-radius:12px;overflow:hidden;margin-bottom:18px}
.dflv-art-pbl-badge-block .dflv-art-pbl-logo{width:56px;background:#fff;border-right:1px solid var(--da-line)}
.dflv-art-pbl-block-text{padding:10px 14px;display:flex;flex-direction:column;justify-content:center}
.dflv-art-pbl-badge-block a:hover{text-decoration:underline}

/* header-badge-stacked: largest logo, caption sits below instead of beside */
.dflv-art-pbl-badge-stacked{display:inline-flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:18px}
.dflv-art-pbl-badge-stacked .dflv-art-pbl-logo{width:52px;height:52px;background:#fff;border:1px solid var(--da-line);border-radius:10px}
.dflv-art-pbl-badge-stacked .dflv-art-pbl-txt{font-size:.78rem;color:var(--da-ink-3)}
.dflv-art-pbl-badge-stacked .dflv-art-pbl-txt b{color:var(--da-ink);font-weight:600}
.dflv-art-pbl-badge-stacked .dflv-art-pbl-txt a{color:inherit;text-decoration:none}
.dflv-art-pbl-badge-stacked a:hover{text-decoration:underline}

/* byline-merged: joins the byline row itself, right after the date */
.dflv-art-by-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.dflv-art-pbl-inline{display:inline-flex;align-items:center;gap:7px}
.dflv-art-pbl-inline .dflv-art-pbl-logo{width:22px;height:22px}
.dflv-art-pbl-inline b{color:var(--da-ink);font-weight:600}
.dflv-art-pbl-inline a{color:var(--da-teal-ink);font-weight:600;text-decoration:none}
.dflv-art-pbl-inline a:hover{text-decoration:underline}

/* ---- Content Series box (from the Content Series plugin's own data) ----
 * "module", "compact", and "sponsor" all conditionally show the related-
 * post list depending on that plugin's own per-series item-count setting —
 * no separate "no list" styling needed, these rules just adapt. "strip" is
 * a genuinely different, always list-less design. */
.dflv-art-series{margin:30px 0}
.dflv-art-series a{color:inherit;text-decoration:none}
.dflv-art-series-title{font-size:1.15rem;color:var(--da-ink);margin:0}
.dflv-art-series-cta{display:inline-block;font-weight:600;font-size:.85rem;color:var(--da-teal-ink)}
.dflv-art-series-cta::after{content:" \2192"}
.dflv-art-series-cta:hover{text-decoration:underline}
.dflv-art-series-list{list-style:none;margin:14px 0 16px}
.dflv-art-series-list li{padding:9px 0;border-top:1px solid var(--da-line);font-size:.9rem}
.dflv-art-series-list li:first-child{border-top:0}
.dflv-art-series-list li a{color:var(--da-ink);font-weight:500;text-decoration:none}
.dflv-art-series-list li a:hover{color:var(--da-teal-ink)}
.dflv-art-series-n{display:inline-block;width:20px;color:var(--da-coral-ink);font-family:'Poppins',sans-serif;font-weight:700;font-size:.8rem}

/* module: matches the shared .dflv-art-module family used elsewhere */
.dflv-art-series--module{max-width:720px;margin-left:auto;margin-right:auto;border:1px solid var(--da-line);border-radius:16px;padding:20px 22px}

/* compact: whole box is a link */
.dflv-art-series--compact{display:block;max-width:720px;margin-left:auto;margin-right:auto;border:1px solid var(--da-line);border-radius:16px;padding:20px 22px;transition:border-color .15s}
.dflv-art-series--compact:hover{border-color:var(--da-teal)}
.dflv-art-series-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.dflv-art-series-arrow{flex:none;font-size:.82rem;font-weight:600;color:var(--da-teal-ink);white-space:nowrap}
.dflv-art-series--compact .dflv-art-series-list{margin-top:12px;margin-bottom:0}
.dflv-art-series--compact .dflv-art-series-list li a{color:var(--da-ink-2);pointer-events:none}

/* strip: lightest footprint, no card, no list */
.dflv-art-series--strip{display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:720px;margin-left:auto;margin-right:auto;padding:14px 0;border-top:1px solid var(--da-line);border-bottom:1px solid var(--da-line);flex-wrap:wrap}
.dflv-art-series-txt{font-size:.9rem;color:var(--da-ink-2)}
.dflv-art-series-txt b{color:var(--da-ink);font-weight:600}

/* sponsor: adds a footer strip only when the series actually has one set */
.dflv-art-series--sponsor{max-width:720px;margin-left:auto;margin-right:auto;border:1px solid var(--da-line);border-radius:16px;overflow:hidden}
.dflv-art-series-top{padding:20px 22px 16px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.dflv-art-series--sponsor .dflv-art-series-list{padding:0 22px;margin-bottom:16px}
.dflv-art-series-foot{background:var(--da-bg-soft);border-top:1px solid var(--da-line);padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dflv-art-series-foot--cta-only{justify-content:flex-end}
.dflv-art-series-sponsor{display:flex;align-items:center;gap:10px;font-size:.78rem;color:var(--da-ink-3)}
.dflv-art-series-sponsor b{color:var(--da-ink);font-weight:600}
.dflv-art-series-sponsor-logo{width:24px;height:24px;background:#fff;border:1px solid var(--da-line);border-radius:6px;display:flex;align-items:center;justify-content:center;flex:none;overflow:hidden}
.dflv-art-series-sponsor-logo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.dflv-art-body p{font-size:1.09rem;line-height:1.75;color:#26262a;margin:0 0 22px}
.dflv-art-body a{color:var(--da-teal-ink);font-weight:600;text-decoration:underline;text-decoration-color:rgba(14,147,132,.3);text-underline-offset:2px}
.dflv-art-body h2{font-size:1.55rem;margin:34px 0 14px}
.dflv-art-body h3{font-size:1.22rem;margin:28px 0 10px}
.dflv-art-body h4{font-size:1.05rem;margin:24px 0 8px}
.dflv-art-body ul,.dflv-art-body ol{margin:0 0 22px;padding-left:0}
.dflv-art-body ul{list-style:none}
.dflv-art-body ul li{font-size:1.06rem;line-height:1.7;color:#26262a;padding-left:26px;position:relative;margin-bottom:10px}
.dflv-art-body ul li::before{content:"";position:absolute;left:4px;top:11px;width:7px;height:7px;border-radius:50%;background:var(--da-coral)}
.dflv-art-body ol{list-style:decimal;padding-left:24px}
.dflv-art-body ol li{font-size:1.06rem;line-height:1.7;color:#26262a;margin-bottom:10px;padding-left:4px}
.dflv-art-body img{max-width:100%;height:auto;border-radius:12px}
.dflv-art-body figure{margin:26px 0}
/* Fallback only, for a bare <blockquote> with neither WordPress block class
   (e.g. pasted-in HTML) — real Quote/Pullquote blocks are handled by the
   higher-specificity, style-selectable rules further down, which win over
   this whenever their classes are present. */
.dflv-art-body blockquote{margin:30px 0;padding:6px 0 6px 24px;border-left:4px solid var(--da-coral);font-family:'Poppins',sans-serif;font-weight:700;font-size:1.4rem;line-height:1.3;color:var(--da-ink);letter-spacing:-.01em}
.dflv-art-body blockquote p{font-size:inherit;line-height:inherit;color:inherit;margin:0 0 10px}
.dflv-art-body blockquote cite,.dflv-art-body blockquote footer{display:block;font-family:'Inter',sans-serif;font-weight:600;font-size:.86rem;color:var(--da-ink-3);font-style:normal;margin-top:6px}
.dflv-art-body h2:first-child,.dflv-art-body p:first-child{margin-top:0}
.dflv-art-body table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:.95rem}
.dflv-art-body th,.dflv-art-body td{border:1px solid var(--da-line);padding:10px 12px;text-align:left}
.dflv-art-body th{background:var(--da-bg-soft);font-weight:700}
.dflv-art-body pre{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:12px;padding:16px;overflow:auto;margin:0 0 22px}

/* ---- pull quotes — 5 selectable styles, covering both WordPress quote
 * blocks ----
 * Scoped by a body class (see dflv_hp_pullquote_style) since this is a
 * single site-wide choice, not per-post. Deliberately handles two different
 * DOM shapes, not just two class names:
 *   - Pullquote block: <figure class="wp-block-pullquote"><blockquote>
 *     <p>...</p><cite>...</cite></blockquote></figure> — the visible box
 *     lives on the INNER blockquote, one level down from the class itself.
 *   - Quote block: <blockquote class="wp-block-quote">...<p>...</p>
 *     <cite>...</cite></blockquote> — no wrapper, the class IS the
 *     blockquote, so the visible box lives on that same element.
 * Getting this distinction right matters: an earlier version of this only
 * handled Pullquote, so it silently did nothing for the far more commonly
 * used plain Quote block. */
body.dflv-pq-quotemark .dflv-art-body .wp-block-pullquote,
body.dflv-pq-rule .dflv-art-body .wp-block-pullquote,
body.dflv-pq-card .dflv-art-body .wp-block-pullquote,
body.dflv-pq-band .dflv-art-body .wp-block-pullquote,
body.dflv-pq-minimal .dflv-art-body .wp-block-pullquote{
  border:0 !important;background:none !important;padding:0 !important;
}
body.dflv-pq-quotemark .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote),
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote),
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote),
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote),
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote){
  border:0 !important;background:none !important;padding:0 !important;
}
body.dflv-pq-quotemark .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before,
body.dflv-pq-quotemark .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::after,
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before,
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::after,
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before,
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::after,
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before,
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::after,
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before,
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::after{
  content:none !important;
}

/* 1 · large quote mark accent */
body.dflv-pq-quotemark .dflv-art-body .wp-block-pullquote{position:relative;margin:32px 0;padding:6px 0 6px 56px !important}
body.dflv-pq-quotemark .dflv-art-body .wp-block-quote{position:relative;margin:32px 0;padding:6px 0 6px 56px !important}
body.dflv-pq-quotemark .dflv-art-body .wp-block-pullquote::before,
body.dflv-pq-quotemark .dflv-art-body .wp-block-quote::before{
  content:"\201C";position:absolute;left:-6px;top:-30px;font-family:'Poppins',sans-serif;font-weight:800;
  font-size:5rem;color:var(--da-coral);opacity:.22;line-height:1;
}
body.dflv-pq-quotemark .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote) p{font-family:'Poppins',sans-serif;font-weight:600;font-size:1.35rem;line-height:1.4;color:var(--da-ink);margin:0}
body.dflv-pq-quotemark .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite{display:block;margin-top:12px;font-style:normal;font-size:.82rem;color:var(--da-ink-3);font-weight:600}

/* 2 · left rule, serif-weight */
body.dflv-pq-rule .dflv-art-body .wp-block-pullquote{margin:32px 0}
body.dflv-pq-rule .dflv-art-body .wp-block-quote{margin:32px 0}
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote){border-left:3px solid var(--da-coral) !important;padding-left:24px !important}
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote) p{font-family:'Poppins',sans-serif;font-weight:600;font-size:1.25rem;line-height:1.45;color:var(--da-ink);margin:0}
body.dflv-pq-rule .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite{display:block;margin-top:10px;font-style:normal;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--da-teal-ink);font-weight:700}

/* 3 · boxed card, top rule */
body.dflv-pq-card .dflv-art-body .wp-block-pullquote{margin:32px 0}
body.dflv-pq-card .dflv-art-body .wp-block-quote{margin:32px 0}
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote){background:var(--da-bg-soft) !important;border-radius:14px !important;padding:28px 30px !important;text-align:center;display:block}
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote)::before{content:"" !important;display:block;width:40px;height:3px;background:var(--da-gold);margin:0 auto 16px;border-radius:2px}
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote) p{font-family:'Poppins',sans-serif;font-weight:600;font-size:1.2rem;line-height:1.45;color:var(--da-ink);max-width:46ch;margin:0 auto}
body.dflv-pq-card .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite{display:block;margin-top:14px;text-align:center;font-style:normal;font-size:.78rem;color:var(--da-ink-3);font-weight:600}

/* 4 · full-bleed color band. JS adds .dflv-art-fw to the block when this
   style is active (see the article critical JS), reusing the same
   ancestor-overflow-fixing + JS-measured breakout already proven for other
   full-width elements, rather than a CSS-only vw breakout that this theme
   is known to clip unreliably. */
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote){background:var(--da-ink) !important;padding:44px 28px !important;text-align:center;margin:34px 0}
body.dflv-pq-band .dflv-art-body .wp-block-pullquote blockquote{max-width:600px;margin:0 auto}
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote) p{font-family:'Poppins',sans-serif;font-weight:600;font-size:1.5rem;line-height:1.4;color:#fff;margin:0 auto;max-width:600px}
body.dflv-pq-band .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite{display:block;margin-top:16px;font-style:normal;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:700}

/* 5 · minimal typographic, no box */
body.dflv-pq-minimal .dflv-art-body .wp-block-pullquote{margin:36px 0;text-align:left}
body.dflv-pq-minimal .dflv-art-body .wp-block-quote{margin:36px 0;text-align:left}
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote blockquote, .wp-block-quote) p{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.6rem;line-height:1.35;color:var(--da-ink);letter-spacing:-.01em;max-width:34ch;margin:0}
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite{display:block;margin-top:14px;font-style:normal;font-size:.8rem;color:var(--da-ink-3);font-weight:600}
body.dflv-pq-minimal .dflv-art-body :is(.wp-block-pullquote, .wp-block-quote) cite::before{content:"\2014 ";color:var(--da-coral-ink)}

/* pages / tags */
.dflv-art-pages{max-width:720px;margin:0 auto 20px;font-size:.9rem;font-weight:600}

/* ---- category disclosures (smaller than body copy, sits above "Filed
   under" and its divider — i.e. right under the article itself) ---- */
.dflv-art-disclosures{max-width:720px;margin:18px auto 0}
.dflv-art-disclosure{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.dflv-art-disclosure:last-child{margin-bottom:0}
.dflv-art-disclosure-ic{
  flex:none;width:18px;height:18px;border-radius:50%;margin-top:1px;
  border:1.5px solid var(--da-ink-3);color:var(--da-ink-3);
  font-family:'Poppins',sans-serif;font-style:normal;font-weight:700;font-size:.68rem;
  display:flex;align-items:center;justify-content:center;
}
.dflv-art-disclosure p{flex:1 1 auto;min-width:0;font-size:.82rem;line-height:1.55;color:var(--da-ink-3);margin:0}
.dflv-art-foot{max-width:720px;margin:30px auto 0;padding-top:22px;border-top:1px solid var(--da-line)}
.dflv-art-foot-cat{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.dflv-art-foot-label{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--da-ink-3)}
/* Plain underlined link, not the solid .dflv-art-chip badge — reads as a
   clickable category name next to "Filed under" instead of a colored box.
   Uppercase + letter-spacing to match .dflv-art-foot-label right beside it.
   Scoped under .dflv-art-foot-cat (not just the bare class) so this beats
   .dflv-article-page a{text-decoration:none;color:inherit} — that reset is
   only one class + one type selector, but it still out-specifies a lone
   class selector, which silently ate the color and underline here (the
   properties it doesn't touch, like text-transform, were applying fine —
   the giveaway that this was a specificity fight, not a caching one). */
.dflv-art-foot-cat .dflv-art-foot-cat-link{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--da-coral-ink);text-decoration:underline;text-underline-offset:3px}
.dflv-art-foot-cat .dflv-art-foot-cat-link:hover{color:var(--da-ink)}
.dflv-art-foot .dflv-art-tags{margin:0}
.dflv-art-tags{max-width:720px;margin:26px auto;display:flex;gap:8px;flex-wrap:wrap}
.dflv-art-tags a{font-size:.78rem;font-weight:600;background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:999px;padding:6px 13px;color:var(--da-ink-2)}

/* author box */
.dflv-art-author{max-width:720px;margin:34px auto;display:flex;gap:18px;border:1px solid var(--da-line);border-radius:var(--da-radius);padding:22px 24px;background:var(--da-bg-soft)}
.dflv-art-avatar--lg{width:64px;height:64px;font-size:1.2rem}
.dflv-art-author-name{font-size:1.05rem;margin:0 0 6px}
.dflv-art-author-bio{font-size:.88rem;color:var(--da-ink-2);line-height:1.55;margin:0 0 8px}
.dflv-art-author-link{color:var(--da-teal-ink);font-weight:600;font-size:.84rem}

/* related */
.dflv-art-related{background:transparent;border-top:1px solid var(--da-line);padding:40px 0;margin-top:24px}
.dflv-art-related-label{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--da-ink-3)}
.dflv-art-related-h{font-size:1.4rem;margin:6px 0 20px}
.dflv-art-rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dflv-art-rcard{background:#fff;border:1px solid var(--da-line);border-radius:var(--da-radius);overflow:hidden;display:flex;flex-direction:column}
.dflv-art-rimg{aspect-ratio:16/10;background:linear-gradient(135deg,#F2F1EE,#E7E6E2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.dflv-art-rimg img{width:100%;height:100%;object-fit:cover}
.dflv-art-rbody{padding:15px 17px;display:block}
.dflv-art-rcat{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--da-coral-ink)}
.dflv-art-rtitle{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:1rem;line-height:1.3;margin-top:5px;color:var(--da-ink)}

@media (max-width:720px){
  .dflv-art-title{font-size:1.9rem}
  .dflv-art-body p,.dflv-art-body ul li,.dflv-art-body ol li{font-size:1.04rem}
  .dflv-art-rgrid{grid-template-columns:1fr}
  .dflv-art-by-right{margin-left:0;width:100%;justify-content:flex-start}
}

/* ---- Related Reading swipe deck (manually curated) ----
   Namespaced dflv-rd- to keep it distinct from the automatic "Keep
   Reading" grid above (dflv-art-related / dflv-art-rgrid), which this
   runs independently of. Text elements are scoped two classes deep
   (e.g. .dflv-rd-wide .dflv-rd-wide-title) rather than bare, on purpose —
   .dflv-art-body p{font-size:1.09rem} and .dflv-article-page a{...} both
   have real specificity of their own and have silently overridden
   single-class rules elsewhere in this file before. */

.dflv-rd-teaser,.dflv-rd-wide{display:block;position:relative;text-decoration:none;-webkit-tap-highlight-color:transparent}

/* rail teaser */
.dflv-rd-teaser{height:172px}
.dflv-rd-teaser-card{position:absolute;inset:0;border-radius:14px;border:1px solid var(--da-line);background:var(--da-bg-soft);box-shadow:0 1px 2px rgba(20,20,20,.05);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s}
.dflv-rd-teaser-card.b2{transform:translateY(10px) scale(.94) rotate(-3deg)}
.dflv-rd-teaser-card.b1{transform:translateY(5px) scale(.97) rotate(2deg)}
.dflv-rd-teaser-card.front{display:flex;flex-direction:column;padding:12px 14px 12px;background:#fff;overflow:hidden}
.dflv-rd-teaser:hover .front{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(20,20,20,.28)}
.dflv-rd-teaser:hover .b1{transform:translateY(2px) scale(.97) rotate(2.5deg)}
.dflv-rd-teaser:hover .b2{transform:translateY(6px) scale(.94) rotate(-3.5deg)}
.dflv-rd-teaser-thumb{width:100%;height:64px;border-radius:9px;overflow:hidden;flex:none;margin-bottom:10px}
.dflv-rd-teaser-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.dflv-rd-teaser .dflv-rd-teaser-cat{font-size:.64rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin:0 0 4px}
.dflv-rd-teaser .dflv-rd-teaser-title{font-family:'Poppins',sans-serif;font-weight:700;font-size:.9rem;line-height:1.28;color:var(--da-ink);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dflv-rd-teaser-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px}
.dflv-rd-count{font-size:.72rem;font-weight:700;color:#fff;background:var(--da-gold);border-radius:999px;padding:3px 9px;white-space:nowrap}
.dflv-rd-hint{font-size:.68rem;color:var(--da-ink-3)}

/* end-of-article wide teaser */
.dflv-rd-wide-wrap{margin:28px 0}
.dflv-rd-wide-label{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--da-ink-3);margin:0 0 12px}
.dflv-rd-wide{height:128px;max-width:640px}
.dflv-rd-wide-card{position:absolute;inset:0;border-radius:16px;border:1px solid var(--da-line);background:var(--da-bg-soft);box-shadow:0 1px 2px rgba(20,20,20,.05);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s}
.dflv-rd-wide-card.b2{transform:translateX(16px) translateY(6px) scale(.97) rotate(1.4deg)}
.dflv-rd-wide-card.b1{transform:translateX(8px) translateY(3px) scale(.985) rotate(-1deg)}
.dflv-rd-wide-card.front{display:flex;align-items:stretch;background:#fff;overflow:hidden}
.dflv-rd-wide:hover .front{transform:translateY(-3px);box-shadow:0 16px 32px -18px rgba(20,20,20,.26)}
.dflv-rd-wide:hover .b1{transform:translateX(10px) translateY(1px) scale(.985) rotate(-1.6deg)}
.dflv-rd-wide:hover .b2{transform:translateX(20px) translateY(3px) scale(.97) rotate(1.9deg)}
.dflv-rd-wide-thumb{width:112px;flex:none;position:relative;overflow:hidden}
.dflv-rd-wide-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.dflv-rd-wide-content{flex:1;min-width:0;padding:14px 18px;display:flex;flex-direction:column;justify-content:center}
.dflv-rd-wide .dflv-rd-wide-cat{font-size:.64rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin:0 0 4px}
.dflv-rd-wide .dflv-rd-wide-title{font-family:'Poppins',sans-serif;font-weight:700;font-size:1rem;line-height:1.3;color:var(--da-ink);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dflv-rd-wide .dflv-rd-wide-excerpt{font-size:.78rem;color:var(--da-ink-2);margin:3px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dflv-rd-wide-meta{flex:none;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:9px;padding:14px 20px;border-left:1px solid var(--da-line)}
@media (max-width:560px){
  .dflv-rd-wide .dflv-rd-wide-title,.dflv-rd-wide .dflv-rd-wide-excerpt{white-space:normal}
  .dflv-rd-wide-meta{display:none}
}

/* shared: category watermark, shown only when a card has no featured image */
.dflv-rd-watermark{position:absolute;font-family:'Poppins',sans-serif;font-weight:800;line-height:1;white-space:nowrap;opacity:.16;pointer-events:none}
.dflv-rd-teaser-thumb .dflv-rd-watermark{display:none} /* too small at 64px to read well — plain color fill is enough there */
.dflv-rd-wide-thumb .dflv-rd-watermark{right:-4px;bottom:-10px;font-size:1.7rem}
.dflv-rd-thumb .dflv-rd-watermark{right:-4px;bottom:-16px;font-size:3.2rem;letter-spacing:-.02em}

/* overlay + swipe deck */
.dflv-rd-overlay{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;background:rgba(20,18,15,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .22s ease;padding:20px}
.dflv-rd-overlay.open{opacity:1;pointer-events:auto}
.dflv-rd-panel{width:100%;max-width:400px;transform:scale(.92) translateY(10px);opacity:0;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .22s ease}
.dflv-rd-overlay.open .dflv-rd-panel{transform:scale(1) translateY(0);opacity:1}
.dflv-rd-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;color:#fff}
.dflv-rd-head .dflv-rd-head-title{font-family:'Poppins',sans-serif;font-weight:700;font-size:1rem}
.dflv-rd-progress{font-size:.76rem;color:rgba(255,255,255,.7);font-variant-numeric:tabular-nums}
.dflv-rd-close{background:rgba(255,255,255,.14);border:0;color:#fff;width:30px;height:30px;border-radius:50%;font-size:1rem;cursor:pointer;line-height:1;flex:none}
.dflv-rd-close:hover{background:rgba(255,255,255,.24)}

.dflv-rd-deck{position:relative;height:340px}
.dflv-rd-card{display:none;position:absolute;inset:0;border-radius:20px;background:#fff;border:1px solid var(--da-line);box-shadow:0 24px 48px -20px rgba(0,0,0,.35);flex-direction:column;overflow:hidden;touch-action:none;user-select:none;text-decoration:none;color:inherit}
.dflv-rd-card[data-pos]{display:flex}
.dflv-rd-card.is-skipped{display:none !important}
.dflv-rd-card[data-pos="1"]{transform:translateY(10px) scale(.96) rotate(-3deg);z-index:2}
.dflv-rd-card[data-pos="2"]{transform:translateY(18px) scale(.92) rotate(2.5deg);z-index:1;opacity:.85}
.dflv-rd-card[data-pos="0"]{z-index:3;cursor:grab}
.dflv-rd-card[data-pos="0"]:active{cursor:grabbing}
.dflv-rd-card.snap{transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.dflv-rd-card.fly-right{transition:transform .38s ease-in,opacity .38s ease-in;transform:translate(640px,-40px) rotate(24deg) !important;opacity:0}
.dflv-rd-card.fly-left{transition:transform .38s ease-in,opacity .38s ease-in;transform:translate(-640px,-40px) rotate(-24deg) !important;opacity:0}

.dflv-rd-thumb{height:52%;flex:none;position:relative;overflow:hidden}
.dflv-rd-thumb .dflv-rd-thumb-img{width:100%;height:100%;object-fit:cover;display:block}
.dflv-rd-body{padding:16px 20px 18px;flex:1;display:flex;flex-direction:column}
.dflv-rd-body .dflv-rd-cat{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 6px}
.dflv-rd-body .dflv-rd-title{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.08rem;line-height:1.3;color:var(--da-ink);margin:0 0 8px}
.dflv-rd-body .dflv-rd-excerpt{font-size:.82rem;color:var(--da-ink-2);line-height:1.55;margin:0}

.dflv-rd-stamp{position:absolute;top:18px;font-family:'Poppins',sans-serif;font-weight:800;font-size:1.4rem;letter-spacing:.06em;padding:6px 14px;border-radius:8px;border:3px solid;opacity:0}
.dflv-rd-stamp-read{right:18px;color:var(--da-teal);border-color:var(--da-teal);transform:rotate(-10deg)}
.dflv-rd-stamp-skip{left:18px;color:var(--da-ink-3);border-color:var(--da-ink-3);transform:rotate(10deg)}

.dflv-rd-actions{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:22px}
.dflv-rd-act{border:0;border-radius:50%;width:54px;height:54px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px -10px rgba(0,0,0,.4);transition:transform .12s}
.dflv-rd-act:hover{transform:translateY(-2px)}
.dflv-rd-act svg{width:20px;height:20px}
.dflv-rd-skip{background:#fff;color:var(--da-ink-2)}
.dflv-rd-read{background:var(--da-teal);color:#fff;width:64px;height:64px}
.dflv-rd-read svg{width:23px;height:23px}

.dflv-rd-empty{display:none;position:absolute;inset:0;border-radius:20px;background:#fff;border:1px solid var(--da-line);flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px}
.dflv-rd-overlay.is-empty .dflv-rd-card{display:none}
.dflv-rd-overlay.is-empty .dflv-rd-empty{display:flex}
.dflv-rd-overlay.is-empty .dflv-rd-actions{display:none}
.dflv-rd-empty-ic{width:38px;height:38px;border-radius:50%;background:var(--da-teal-soft);color:var(--da-teal-ink);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.dflv-rd-empty-ic svg{width:20px;height:20px}
.dflv-rd-empty h3{font-size:1.05rem;margin:0 0 6px}
.dflv-rd-empty p{font-size:.84rem;color:var(--da-ink-2);margin:0 0 16px}
.dflv-rd-restart{background:var(--da-ink);color:#fff;border:0;border-radius:10px;padding:10px 20px;font-size:.85rem;font-weight:600;cursor:pointer;font-family:inherit}

/* ---- reading progress bar ---- */
.dflv-art-progress{position:fixed;top:0;left:0;right:0;height:3px;background:transparent;z-index:9999}
.dflv-art-progress span{display:block;height:100%;width:0;background:var(--da-coral);transition:width .08s linear}

/* Section ticks (see article.js) — one per H2, positioned along the bar as
   a percentage of scroll distance. Informational only for now: filled in
   as the reader passes each one, native title attribute for a hover
   label. Not yet clickable/navigable — that's a deliberate follow-up. */
.dflv-art-progress-tick{
	position:absolute;top:50%;width:7px;height:7px;border-radius:50%;
	background:#fff;border:1.5px solid rgba(0,0,0,.16);
	transform:translate(-50%,-50%);
}
.dflv-art-progress-tick.is-done{border-color:var(--da-coral);background:var(--da-coral)}
.dflv-art-progress-tick.is-active{border-color:var(--da-coral);background:#fff;box-shadow:0 0 0 2px rgba(232,86,74,.35)}

/* ---- baked-in heat bar ---- */
.dflv-art-heatbar .dflv-heatbar{border-top:1px solid rgba(0,0,0,.05)}

/* ---- share buttons ---- */
.dflv-art-share{display:inline-flex;gap:7px}
.dflv-art-share-btn{width:34px;height:34px;border:1px solid var(--da-line);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--da-ink-2);background:#fff;cursor:pointer;font-family:'Inter',sans-serif;line-height:1;padding:0;transition:.15s}
.dflv-art-share-btn:hover{border-color:var(--da-ink-3);color:var(--da-ink)}
.dflv-art-share-btn.is-copied{border-color:var(--da-teal);color:var(--da-teal-ink)}

/* ---- in-article modules ---- */
.dflv-art-module{max-width:720px;margin:30px auto;border:1px solid var(--da-line);border-radius:var(--da-radius);background:#fff;padding:20px 22px;clear:both}
.dflv-art-module-label{font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:12px}
/* pavement module */
.dflv-art-module--pave{background:linear-gradient(180deg,#FBF6F0,#fff)}
.dflv-mod--safe{background:linear-gradient(180deg,#EFF7F1,#fff)}
.dflv-mod--caution{background:linear-gradient(180deg,#FBF6E7,#fff)}
.dflv-mod--high{background:linear-gradient(180deg,#FBEEDF,#fff)}
.dflv-mod--danger{background:linear-gradient(180deg,#FBE7E4,#fff)}
.dflv-art-pave{display:flex;align-items:center;gap:22px}
.dflv-art-pave-gauge{flex:none;text-align:center;line-height:1}
.dflv-art-pave-gauge svg{display:block}
.dflv-art-pave-read{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.35rem;margin-top:-4px;color:var(--da-ink)}
.dflv-art-pave-unit{font-size:.64rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--da-ink-3)}
.dflv-art-pave-copy{flex:1;min-width:0}
.dflv-art-pave-pill{display:inline-block;font-family:'Poppins',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--da-coral);border-radius:6px;padding:4px 10px;margin-bottom:7px}
.dflv-mod--safe .dflv-art-pave-pill{background:#2E9E6B}
.dflv-mod--caution .dflv-art-pave-pill{background:#C89A17}
.dflv-mod--high .dflv-art-pave-pill{background:#D9762B}
.dflv-mod--danger .dflv-art-pave-pill{background:#D9483B}
.dflv-art-module--pave p{font-size:.9rem !important;line-height:1.55 !important;color:var(--da-ink-2) !important;margin:0 0 7px !important}
.dflv-art-pave-copy a{font-weight:600;font-size:.85rem;color:var(--da-teal-ink);text-decoration:none}
/* events module */
.dflv-art-events{list-style:none;margin:0;padding:0}
.dflv-art-events li{display:flex;align-items:center;gap:14px;padding:10px 0;border-top:1px solid var(--da-line)}
.dflv-art-events li:first-child{border-top:0}
.dflv-art-ev-date{flex:none;width:46px;height:46px;border-radius:10px;background:var(--da-gold-soft);color:var(--da-gold-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.dflv-art-ev-date .m{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.dflv-art-ev-date .d{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.05rem}
.dflv-art-ev-body{display:flex;flex-direction:column;min-width:0}
.dflv-art-ev-body a{font-weight:600;font-size:.95rem;color:var(--da-ink);text-decoration:none}
.dflv-art-ev-body a:hover{color:var(--da-gold-ink)}
.dflv-art-ev-city{font-size:.78rem;color:var(--da-ink-3)}
.dflv-art-events-more{display:inline-block;margin-top:12px;font-weight:600;font-size:.85rem;color:var(--da-teal-ink);text-decoration:none}

@media (max-width:720px){
  .dflv-art-pave{flex-direction:column;text-align:center;gap:12px}
  .dflv-art-module{margin:24px auto}
}

/* ---- margin rail (optional, replaces in-content pavement/events when on) ----
 * The article container widens to 1000px when the rail is active (see
 * .dflv-art--rail below, reusing the same max-width bump already used for
 * hero styles B/D/G/Full6/Full7), so the main reading column stays close to
 * its normal width instead of being squeezed to make room for the rail.
 * This is a plain max-width increase on an already-centered element, not a
 * negative-margin breakout — deliberately, since this theme has a known
 * ancestor that clips anything trying to render wider than its parent via
 * that technique. Sticky position relies on the article critical CSS
 * forcing #tie-container's overflow to visible in both axes for
 * .dflv-article-active pages — sticky breaks if either axis is clipped on
 * an ancestor, not just the one that mattered for breakouts elsewhere. */
.dflv-art-railgrid{display:grid;grid-template-columns:1fr 220px;gap:32px;align-items:start}
/* align-items:start matters here, not just cosmetically — a CSS Grid item
   stretches to fill its row by default, and a *stretched* sticky element has
   no room to visually stick (its box already spans the full scrollable
   range from the start). Keeping the rail at its own natural height inside
   the (taller) row is what gives position:sticky somewhere to actually move. */
/* The billboard ad (and anything else using the .dflv-art-fw viewport-relative
   breakout) has no idea it's sitting inside a narrower grid column — it just
   tries to span the full browser width regardless, blowing through the rail
   entirely. Neutralize the breakout specifically in this context so it stays
   inside its actual column instead. */
.dflv-art-railmain .dflv-ad--fw,
.dflv-art-railmain .dflv-art-fw{
  margin-left:0 !important;margin-right:0 !important;width:auto !important;
}
.dflv-art-rail{position:sticky;top:20px;display:flex;flex-direction:column;gap:14px}
.dflv-art-rail-card{border:1px solid var(--da-line);border-radius:14px;padding:16px}
.dflv-art-rail-k{font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:8px}
.dflv-art-rail-num{font-family:'Poppins',sans-serif;font-weight:800;font-size:1.6rem;color:var(--da-ink);line-height:1}
.dflv-art-rail-sub{font-size:.78rem;color:var(--da-ink-2);margin-top:4px}
.dflv-art-rail-card.dflv-mod--hot .dflv-art-rail-num{color:var(--da-coral-ink)}
.dflv-art-rail-card.dflv-mod--warm .dflv-art-rail-num{color:var(--da-gold-ink)}
.dflv-art-rail-card.dflv-mod--ok .dflv-art-rail-num{color:var(--da-teal-ink)}
.dflv-art-rail-link{display:inline-block;margin-top:10px;font-weight:600;font-size:.8rem;color:var(--da-teal-ink);text-decoration:none}
.dflv-art-rail-link:hover{text-decoration:underline}
.dflv-art-rail-ev{display:block;padding:7px 0;border-top:1px solid var(--da-line);text-decoration:none}
.dflv-art-rail-ev:first-of-type{border-top:0}
.dflv-art-rail-ev b{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:.68rem;color:var(--da-coral-ink);text-transform:uppercase;letter-spacing:.03em}
.dflv-art-rail-ev span{display:block;font-size:.85rem;color:var(--da-ink);line-height:1.3}
.dflv-art-rail-ev:hover span{color:var(--da-teal-ink)}

/* Below this width there isn't reliable room for a 220px companion rail
 * beside a readable main column, so it's dropped rather than cramped. */
@media (max-width:900px){
  .dflv-art-railgrid{display:block}
  .dflv-art-rail{display:none}
}

/* ---- hide the theme's own single-post title/header when our layout is on ---- */
/* The theme prints a .container-wrapper.fullwidth-entry-title block above our
   layout; hiding the whole wrapper removes both the duplicate title and the
   empty space it held. JS handles any variants and infinite-scroll copies. */
body.dflv-article-active .fullwidth-entry-title,
body.dflv-article-active .entry-header-outer,
body.dflv-article-active .single-title,
body.dflv-article-active .single-post-title,
body.dflv-article-active .post-cats,
body.dflv-article-active .post-cat,
body.dflv-article-active .post-category,
body.dflv-article-active .tie-breadcrumb,
body.dflv-article-active .breadcrumbs,
body.dflv-article-active .breadcrumb{display:none !important}

/* keep injected modules from inheriting article body list/link styling */
.dflv-art-module ul{list-style:none;margin:0;padding:0}
.dflv-art-module li{padding-left:0}
.dflv-art-module li::before{display:none !important;content:none !important}
.dflv-art-module a{text-decoration:none}
.dflv-art-module a:hover{text-decoration:none}

/* =========================================================================
 * Article hero layout options (b/d/g). Layout a (classic) uses the base rules.
 * The article column widens for b/d/g; body, foot, and newsletter stay 720.
 * ====================================================================== */
.dflv-art--hero-b,.dflv-art--hero-d,.dflv-art--hero-g,.dflv-art--hero-fw6,.dflv-art--hero-fw7,.dflv-art--rail{max-width:1000px}

/* shared: keep reading-width elements centered within the wider article */
.dflv-art--hero-b .dflv-art-body,.dflv-art--hero-d .dflv-art-body,.dflv-art--hero-g .dflv-art-body,
.dflv-art--hero-b .dflv-art-foot,.dflv-art--hero-d .dflv-art-foot,.dflv-art--hero-g .dflv-art-foot,
.dflv-art--hero-b .dflv-art-pages,.dflv-art--hero-d .dflv-art-pages,.dflv-art--hero-g .dflv-art-pages{max-width:720px;margin-left:auto;margin-right:auto}

/* ---- B: split, text left / image right ---- */
.dflv-art-hero-split{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;margin:14px 0 10px}
.dflv-art-hero-split-text .dflv-art-title{font-size:2.7rem}
.dflv-art-hero-split-img{margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--da-line)}
.dflv-art-hero-split-img img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:0}
.dflv-art-hero-split-img .dflv-art-cap{padding:8px 14px 0}

/* ---- D: magazine banner with overlapping card (Refined Overlap) ---- */
.dflv-art-hero-mag{margin:14px 0 0}
.dflv-art-hero-mag-img{margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--da-line)}
.dflv-art-hero-mag-img img{width:100%;aspect-ratio:21/9;object-fit:cover;display:block;border-radius:0}
.dflv-art-hero-mag-card{background:#fff;border:1px solid var(--da-line);border-radius:18px;box-shadow:0 16px 32px -18px rgba(20,20,20,.22);padding:30px 34px 32px;max-width:760px;margin:-48px auto 0;position:relative}
.dflv-art-hero-mag-card .dflv-art-title{font-size:2rem;margin-top:10px}
.dflv-art-hero-mag-kicker{position:absolute;top:-14px;left:32px}
.dflv-art-hero-mag-date{font-size:.85rem;color:var(--da-ink-3);margin-top:14px}
.dflv-art-wrap-cap{max-width:760px;margin:10px auto 0}
.dflv-art-hero-mag-utility{max-width:760px;margin:0 auto}
.dflv-art-hero-mag-utility .dflv-art-byline{margin-top:18px}
.dflv-art-hero-mag-utility--nodate .dflv-art-by-meta{display:none}

/* ---- G: dark split band ---- */
.dflv-art-hero-band{display:grid;grid-template-columns:1.05fr 1fr;background:#141414;border-radius:22px;overflow:hidden;margin:14px 0 10px}
.dflv-art-hero-band-text{padding:44px 42px;display:flex;flex-direction:column;justify-content:center}
.dflv-art-hero-band-text .dflv-art-title{font-size:2.7rem;color:#fff}
.dflv-art-hero-band-text .dflv-art-dek{color:rgba(255,255,255,.72)}
.dflv-art-hero-band-text .dflv-art-byline{border-top-color:rgba(255,255,255,.15)}
.dflv-art-hero-band-text .dflv-art-sub{color:rgba(255,255,255,.6)}
.dflv-art-hero-band-text .dflv-art-share-btn{background:transparent;border-color:rgba(255,255,255,.28);color:rgba(255,255,255,.82)}
.dflv-art-hero-band-text .dflv-art-share-btn:hover{border-color:#fff;color:#fff}
.dflv-art-hero-band-text .dflv-art-factcheck{background:rgba(255,255,255,.14);color:#fff}
.dflv-art-hero-band-img{margin:0}
.dflv-art-hero-band-img img{width:100%;height:100%;object-fit:cover;display:block;min-height:400px}

/* ---- H: masthead, rule lines, headline on photo, no card ---- */
.dflv-art-hero-mast{position:relative;min-height:420px;border-radius:18px;overflow:hidden;display:flex;align-items:flex-end}
.dflv-art-hero-mast-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.dflv-art-hero-mast-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,12,10,.88),rgba(8,12,10,.3) 55%,transparent 85%)}
.dflv-art-hero-mast-content{position:relative;padding:36px 40px 32px;width:100%;text-align:center}
.dflv-art-hero-mast-rule{height:2px;background:rgba(255,255,255,.5);margin:10px auto;max-width:600px}
.dflv-art-hero-mast-kicker{font-family:'Inter',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.dflv-art-hero-mast .dflv-art-title{color:#fff;font-size:2.2rem;margin:4px auto;max-width:20ch}
.dflv-art-hero-mast .dflv-art-dek{color:rgba(255,255,255,.78);max-width:52ch;margin:0 auto}
.dflv-art-hero-mast-content .dflv-art-hero-mag-date{color:rgba(255,255,255,.65);text-align:center;margin-top:10px}

/* ---- I: side spine label ---- */
.dflv-art-hero-spine{display:grid;grid-template-columns:52px 1fr;border-radius:16px;overflow:hidden;border:1px solid var(--da-line)}
.dflv-art-hero-spine-tab{background:#FBBF00;display:flex;align-items:center;justify-content:center}
.dflv-art-hero-spine-tab span{writing-mode:vertical-rl;transform:rotate(180deg);color:#fff;font-weight:700;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;font-family:'Poppins',sans-serif}
.dflv-art-hero-spine-main{display:grid;grid-template-rows:auto 1fr}
.dflv-art-hero-spine-photo{height:200px;background-size:cover;background-position:center;position:relative}
.dflv-art-hero-credit{position:absolute;right:12px;bottom:8px;font-size:.68rem;color:rgba(255,255,255,.7);font-style:italic;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.dflv-art-hero-stamp{display:inline-block;font-family:'Poppins',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--da-ink-3);border:1px solid var(--da-line);border-radius:999px;padding:5px 12px;margin-bottom:14px}
.dflv-art-hero-spine-text{padding:26px 30px 28px}
.dflv-art-hero-spine-text .dflv-art-title{font-size:1.7rem}

/* ---- J: diagonal cut split ---- */
.dflv-art-hero-diag{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:340px;border-radius:16px;overflow:hidden}
.dflv-art-hero-diag-photo{position:relative;background-size:cover;background-position:center;clip-path:polygon(0 0,100% 0,84% 100%,0 100%)}
.dflv-art-hero-diag-text{background:var(--da-bg-soft);display:flex;flex-direction:column;justify-content:center;padding:34px 6% 34px 40px;position:relative;left:-3%}
.dflv-art-hero-diag-k{font-family:'Inter',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--da-coral-ink);margin-bottom:8px}
.dflv-art-hero-diag-text .dflv-art-title{font-size:1.9rem}

/* ---- K: underline accent, type only ---- */
.dflv-art-hero-under{padding:10px 0}
.dflv-art-hero-under-k{font-family:'Inter',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:14px}
.dflv-art-hero-under .dflv-art-title{font-size:2.6rem;max-width:18ch}
.dflv-art-hero-under .dflv-art-dek{margin-top:18px;max-width:56ch}
.dflv-art-hero-under-rule{width:64px;height:4px;background:var(--da-coral);border-radius:2px;margin-top:22px}

/* ---- L: paw watermark, type only ---- */
.dflv-art-hero-paw{position:relative;background:var(--da-teal-soft);border-radius:18px;overflow:hidden;padding:44px 40px}
.dflv-art-hero-paw-icon{position:absolute;right:-24px;bottom:-32px;font-size:11rem;opacity:.14;line-height:1;pointer-events:none;user-select:none}
.dflv-art-hero-paw-k{font-family:'Inter',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--da-teal-ink);margin-bottom:10px;position:relative}
.dflv-art-hero-paw .dflv-art-title{font-size:2.3rem;max-width:14ch;position:relative}
.dflv-art-hero-paw .dflv-art-dek{max-width:48ch;position:relative;margin-top:12px}

/* ---- Full-width editorial variants (H, I, J, K, L → Full 10-14) ---- */
.dflv-art-hero-mast--full{border-radius:0;min-height:520px}

.dflv-art-hero-spine--full{border-radius:0;border:0}
.dflv-art-hero-spine--full .dflv-art-hero-spine-photo{height:340px}
.dflv-art-hero-spine--full .dflv-art-hero-spine-text{padding:44px 6vw}
.dflv-art-hero-spine-textinner{max-width:1100px}
.dflv-art-hero-spine-textinner .dflv-art-title{font-size:2.8rem;max-width:none}
.dflv-art-hero-spine-textinner .dflv-art-dek{max-width:68ch}

/* Full 15 only: same "no card, no border" look as --full, but deliberately
   NOT wrapped in .dflv-art-fw, so it never breaks out to the viewport (vw).
   Instead it's just a plain block inside .dflv-art itself — which is
   720px normally, or 1000px when the margin rail is on (the same box the
   two-column rail grid measures itself against below). So the band —
   the tab and whatever sits in its second column (the headline alone by
   default, or headline + image together with --tabfull, see below) —
   runs edge to edge across exactly the content column, or content +
   sidebar combined when the rail is active, and never past it.

   The gap between the tab and the headline is a real grid column-gap now,
   not the headline's own left padding — so the headline's actual text
   starts exactly at the column edge, flush with the image and the body
   copy below it, instead of sitting inset from it. That pushes the tab
   itself further left again to make room: the negative margin is now
   -(tab width + gap) instead of just -(tab width), so the tab sits
   further out in the margin than before. The tradeoff, deliberate: the
   tab is out of alignment with where the body copy starts, instead of
   "eating into" a shared column. Desktop only — see the mobile override
   below for why. */
.dflv-art-hero-spine--wide{border-radius:0;border:0;margin-bottom:6px;margin-left:-76px;column-gap:32px}
.dflv-art-hero-spine--wide .dflv-art-hero-spine-text{padding:44px 6% 44px 0}

/* --tabfull (Settings > DFLV Homepage > Full-height spine, off by
   default): the headline and the image/events row are stacked inside
   the grid's second column together instead of the image rendering as
   a separate element after the band closes, so align-items:stretch (the
   grid's default, unchanged) stretches the tab to match their COMBINED
   height — down through the image, to the same divider line the byline
   row sits above — rather than just the headline's height. No extra
   spacing rules needed here: .dflv-art-hero-spine-text keeps its own
   44px bottom padding as the gap before the image, same value it
   already uses for its top padding. */
.dflv-art-hero-spine-stack{display:flex;flex-direction:column;min-width:0}
/* No featured image + events card case: .dflv-art-hero-spine-text's own
   44px bottom padding is already the gap before it; a standalone image
   with no events card to sit beside (the .dflv-art-hero-imgrail wrapper
   isn't used then) still carries its usual 26px top margin by default,
   which would double up with that padding. Zero it here for the same
   reason .dflv-art-hero-imgrail already zeroes it in the other case. */
.dflv-art-hero-spine-stack > .dflv-art-hero{margin:0}

/* --cover (Settings > DFLV Homepage > Cover mode, off by default):
   inverts the band from gold-tab-on-white to a full gold background with
   a white tab and white headline — a magazine-cover treatment. Combine
   with --tabfull above and the gold carries down behind the image too,
   since it's coloring whatever box the tab itself is coloring against;
   without --tabfull only the headline band goes gold, same as the tab's
   own height stays headline-only without it. Every text color that was
   sized for a white background gets a pass here too, not just the H1 —
   an unreadable dek or date badge would defeat the point.

   The color itself runs the true full width of the browser — same idea
   as .dflv-art-fw elsewhere — but .dflv-art-hero-spine--wide's own box
   (and everything positioned relative to it: the tab's poke-out, the
   headline lining up with body copy) is deliberately left alone, so the
   color can't just be that box's own background. Instead it's a second,
   absolutely positioned layer (.dflv-art-hero-spine-bg) behind the real
   content, breaking out to 100vw independently via the standard
   left:50%/translateX(-50%) full-bleed technique — .dflv-art-hero-spine-
   bgwrap only exists in the markup at all when this option is on. */
.dflv-art-hero-spine-bgwrap{position:relative}
.dflv-art-hero-spine-bgwrap > .dflv-art-hero-spine{position:relative;z-index:1}
.dflv-art-hero-spine-bg{position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:#FBBF00;z-index:0;pointer-events:none}
.dflv-art-hero-spine--cover .dflv-art-hero-spine-tab{background:#fff}
.dflv-art-hero-spine--cover .dflv-art-hero-spine-tab span{color:var(--da-ink)}
.dflv-art-hero-spine--cover .dflv-art-hero-spine-text .dflv-art-title{color:#fff}
.dflv-art-hero-spine--cover .dflv-art-hero-spine-text .dflv-art-dek{color:rgba(255,255,255,.78)}
.dflv-art-hero-spine--cover .dflv-art-hero-mag-date{color:rgba(255,255,255,.65)}
.dflv-art-hero-spine--cover .dflv-art-hero-stamp{color:#fff;border-color:rgba(255,255,255,.5)}
/* If --tabfull is also on and the rail's events card ends up sitting on
   this gold background too, give it back an opaque surface — the card's
   own text/link colors (dark ink, teal) were never designed to sit
   directly on gold. */
.dflv-art-hero-spine--cover .dflv-art-rail-card{background:#fff}

/* The image sits below the tab/headline row as its own element — the tab
   does not extend down alongside it. With the margin rail on, the "Dog
   Events This Week" card (dflv_hp_rail_events_html()) renders beside it
   instead of down in the body-adjacent rail, using the exact same
   grid-template-columns/gap .dflv-art-railgrid uses further down the
   page — so the card lands precisely where the sidebar will actually be,
   at the image's own height (align-items:stretch, CSS Grid's default),
   rather than reserving that space and leaving it empty. Without an
   events card to show there, the image just uses the band's full width
   instead (no wrapper — see the plain .dflv-art-hero rule). Desktop
   only; collapses to one column on mobile below, same breakpoint the
   real rail grid collapses at, since there's no sidebar there either. */
.dflv-art-hero-imgrail{display:grid;grid-template-columns:1fr 220px;gap:32px;align-items:stretch}
/* .dflv-art-hero carries its own 26px top margin everywhere else it's
   used (see the plain "hero image" rule), which here pushed the actual
   photo down 26px inside its grid cell while the card — no top margin —
   started flush at the very top of the row: the card's top ends up
   poking out above the image's actual top edge, not matching it. Zero
   both margins in this context; the imgrail's own row/column gaps
   already provide the surrounding spacing. */
.dflv-art-hero-imgrail .dflv-art-hero{margin:0}
/* Grid items default to min-height:auto, which refuses to shrink below
   their own content's natural height — so without min-height:0 here, a
   card whose 3-event list is naturally taller than the photo makes the
   whole ROW grow to match the CARD instead, stretching the image's own
   box (blank space under the photo) rather than the other way around.
   min-height:0 lets the row's height come from the image alone; overflow
   then scrolls the rare case where the card's content still doesn't fit
   in that height, instead of silently cutting it off. */
.dflv-art-hero-imgrail .dflv-art-rail-card{height:100%;min-height:0;overflow-y:auto;display:flex;flex-direction:column}
.dflv-art-hero-imgrail .dflv-art-rail-link{margin-top:auto;padding-top:10px}

.dflv-art-hero-diag--full{border-radius:0;min-height:480px}
.dflv-art-hero-diag--full .dflv-art-hero-diag-text{padding:44px 6vw}
.dflv-art-hero-diag-textinner{max-width:560px}
.dflv-art-hero-diag-textinner .dflv-art-title{font-size:2.3rem}

.dflv-art-hero-under-band{background:var(--da-bg-soft);border-top:1px solid var(--da-line);border-bottom:1px solid var(--da-line);padding:48px 0}
.dflv-art-hero-under-band-inner{max-width:720px;margin:0 auto;padding:0 28px}
.dflv-art-hero-under-band-inner .dflv-art-title{font-size:2.8rem;max-width:18ch}
.dflv-art-hero-under-band-inner .dflv-art-dek{margin-top:18px;max-width:56ch}

.dflv-art-hero-paw--full{border-radius:0;padding:0}
.dflv-art-hero-paw--full .dflv-art-hero-paw-icon{font-size:16rem;right:4vw;bottom:-52px}
.dflv-art-hero-paw-inner{max-width:720px;margin:0 auto;padding:56px 28px;position:relative}
.dflv-art-hero-paw-inner .dflv-art-title{font-size:2.5rem;max-width:16ch}
.dflv-art-hero-paw-inner .dflv-art-dek{max-width:52ch;margin-top:12px}

@media (max-width:820px){
  .dflv-art--hero-b,.dflv-art--hero-d,.dflv-art--hero-g,.dflv-art--hero-fw6,.dflv-art--hero-fw7,.dflv-art--rail{max-width:720px}
  .dflv-art-hero-split,.dflv-art-hero-band{grid-template-columns:1fr;gap:20px}
  .dflv-art-hero-split-text .dflv-art-title,.dflv-art-hero-band-text .dflv-art-title{font-size:1.9rem}
  .dflv-art-hero-split-img img{aspect-ratio:16/9}
  .dflv-art-hero-band-text{padding:28px 24px}
  .dflv-art-hero-band-img img{min-height:220px;aspect-ratio:16/9}
  .dflv-art-hero-mag-img{border-radius:14px}
  .dflv-art-hero-mag-card{margin-top:-32px;padding:22px 22px 24px;border-radius:14px;box-shadow:0 10px 20px -12px rgba(20,20,20,.22)}
  .dflv-art-hero-mag-card .dflv-art-title{font-size:1.4rem;margin-top:6px}
  .dflv-art-hero-mag-kicker{top:-11px;left:20px;font-size:.62rem;padding:4px 10px}
  .dflv-art-hero-mag-date{font-size:.8rem;margin-top:10px}
  .dflv-art-hero-mag-utility .dflv-art-byline{margin-top:14px}
  .dflv-art-hero-mast{min-height:300px;border-radius:14px}
  .dflv-art-hero-mast-content{padding:22px 22px 24px}
  .dflv-art-hero-mast .dflv-art-title{font-size:1.5rem}
  .dflv-art-hero-mast-rule{margin:8px auto}
  .dflv-art-hero-spine{grid-template-columns:36px 1fr;border-radius:14px}
  .dflv-art-hero-spine--full{border-radius:0;border:0}
  .dflv-art-hero-spine-tab span{font-size:.68rem}
  .dflv-art-hero-spine-photo{height:150px}
  .dflv-art-hero-spine-text{padding:20px 20px 22px}
  .dflv-art-hero-spine-text .dflv-art-title{font-size:1.35rem}
  .dflv-art-hero-diag{grid-template-columns:1fr;min-height:auto;border-radius:14px}
  .dflv-art-hero-diag-photo{clip-path:none;min-height:180px}
  .dflv-art-hero-diag-text{padding:24px;left:0}
  .dflv-art-hero-diag-text .dflv-art-title{font-size:1.5rem}
  .dflv-art-hero-under .dflv-art-title{font-size:1.7rem}
  .dflv-art-hero-paw{padding:26px 24px;border-radius:14px}
  .dflv-art-hero-paw-icon{font-size:7rem;right:-14px;bottom:-18px}
  .dflv-art-hero-paw .dflv-art-title{font-size:1.6rem}
  .dflv-art-hero-mast--full{min-height:320px;border-radius:0}
  .dflv-art-hero-spine--full .dflv-art-hero-spine-photo{height:180px}
  .dflv-art-hero-spine--full .dflv-art-hero-spine-text{padding:24px}
  /* Cancel the desktop poke-out here: .dflv-art-wrap's own side padding is
     only 28px, less than the 36px mobile tab, so left unchecked the tab
     would render partly past the actual viewport edge and get clipped by
     body.dflv-article-active's overflow-x:hidden. Falls back to the tab
     consuming its own column instead — the headline ends up ~36px
     narrower than body copy on mobile, a small, safe tradeoff for never
     clipping. Doesn't affect the image below at all, since (per the
     "Spine should only appear alongside the title" change) it's no
     longer sharing a box with the tab on any screen size. column-gap
     also resets to 0 here — without it, the desktop gap would stack on
     top of the tab's own 36px column, pushing the headline in from the
     left by 68px combined before its own padding even starts. Back to
     the headline's own left padding providing the gap instead, the same
     as before the alignment change on desktop. */
  .dflv-art-hero-spine--wide{margin-left:0;column-gap:0}
  .dflv-art-hero-spine--wide .dflv-art-hero-spine-text{padding:24px}
  /* .dflv-art-railgrid also collapses to one column below this same
     820px breakpoint (there's no real sidebar to sit next to here either),
     so the events card just stacks under the image instead of beside it.
     Stacked, not side by side, so the top/bottom margins the desktop
     rule zeroes out for height-matching aren't a problem here — restore
     both explicitly (top for space under the headline, bottom for space
     above the stacked card) rather than leaving margin-top at the
     desktop rule's 0. */
  .dflv-art-hero-imgrail{grid-template-columns:1fr}
  .dflv-art-hero-imgrail .dflv-art-hero{margin:20px 0}
  .dflv-art-hero-spine-textinner .dflv-art-title{font-size:1.5rem}
  .dflv-art-hero-diag--full{grid-template-columns:1fr;min-height:auto;border-radius:0}
  .dflv-art-hero-diag--full .dflv-art-hero-diag-photo{clip-path:none;min-height:200px}
  .dflv-art-hero-diag--full .dflv-art-hero-diag-text{padding:26px 24px;left:0}
  .dflv-art-hero-diag-textinner .dflv-art-title{font-size:1.6rem}
  .dflv-art-hero-under-band{padding:30px 0}
  .dflv-art-hero-under-band-inner .dflv-art-title{font-size:1.8rem}
  .dflv-art-hero-paw--full .dflv-art-hero-paw-icon{font-size:8rem;bottom:-20px}
  .dflv-art-hero-paw-inner{padding:32px 24px}
  .dflv-art-hero-paw-inner .dflv-art-title{font-size:1.7rem}
}

/* ---- end-of-article newsletter capture ----
   Renders inside .dflv-art-railmain now (see dflv_hp_newsletter_html() and
   templates/single.php), so width:100% is correct on its own — no need for
   the old fixed max-width, the parent column already is the right width
   whether or not the margin rail is on. */
.dflv-art-news{width:100%;margin:38px 0 0;border-radius:var(--da-radius);padding:32px 28px;background:var(--da-ink);border:1px solid var(--da-ink);color:#fff;text-align:center}
.dflv-art-news-h{color:#fff;font-size:1.4rem;margin:0 0 6px;font-family:'Poppins',sans-serif;font-weight:700}
.dflv-art-news-p{color:#fff;font-size:.95rem;line-height:1.5;margin:0 0 18px;max-width:52ch;margin-left:auto;margin-right:auto}
.dflv-art-news-form{display:flex;gap:8px;max-width:440px;margin:0 auto}
.dflv-art-news-input{flex:1;min-width:0;border:1px solid var(--da-line);border-radius:10px;padding:13px 15px;font-size:.95rem;font-family:inherit;color:var(--da-ink);background:#fff}
.dflv-art-news-input:focus{outline:none;border-color:var(--da-coral)}
.dflv-art-news-btn{background:var(--da-coral);color:#fff;border:0;border-radius:10px;padding:13px 22px;font-weight:600;font-size:.95rem;cursor:pointer;font-family:inherit;white-space:nowrap}
.dflv-art-news-btn:hover{background:#d8473b}
.dflv-art-news-btn:disabled{opacity:.7;cursor:default}
.dflv-art-news-msg{min-height:1.1em;margin:12px 0 0;font-size:.9rem;color:#fff}
.dflv-art-news-msg.is-ok{color:#8fe3c8}
.dflv-art-news-msg.is-err{color:#ffb4ac}
@media (max-width:520px){
  .dflv-art-news-form{flex-direction:column}
}

/* 1 . Quiet Card — light fill, left-aligned text with the form inline */
.dflv-art-news--card{background:var(--da-bg-soft);border:1px solid var(--da-line);color:var(--da-ink);text-align:left;display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:26px 28px}
.dflv-art-news--card .dflv-art-news-text{flex:1;min-width:200px}
.dflv-art-news--card .dflv-art-news-h{color:var(--da-ink);font-size:1.2rem;margin:0 0 4px}
.dflv-art-news--card .dflv-art-news-p{color:var(--da-ink-2);font-size:.9rem;margin:0;max-width:44ch;margin-left:0;margin-right:0}
.dflv-art-news--card .dflv-art-news-form{margin:0;max-width:320px}
@media (max-width:640px){
  .dflv-art-news--card{flex-direction:column;align-items:stretch}
  .dflv-art-news--card .dflv-art-news-form{max-width:none;margin-top:6px}
}

/* 2 . Two-Tone Brand Card — teal fill, gold rule, paw watermark (echoes
   the same motif already used on the "L" hero) */
.dflv-art-news--brand{position:relative;overflow:hidden;background:var(--da-teal-soft);border:1px solid #CFE9E4;color:var(--da-ink)}
.dflv-art-news-paw{position:absolute;right:-14px;bottom:-22px;font-size:6.4rem;line-height:1;opacity:.16;color:var(--da-teal-ink);pointer-events:none;user-select:none}
.dflv-art-news-rule{width:40px;height:3px;background:var(--da-gold);border-radius:2px;margin:0 auto 14px;position:relative}
.dflv-art-news--brand .dflv-art-news-h{color:var(--da-teal-ink);position:relative}
.dflv-art-news--brand .dflv-art-news-p{color:var(--da-ink-2);position:relative}
.dflv-art-news--brand .dflv-art-news-form{position:relative}
.dflv-art-news--brand .dflv-art-news-btn{background:var(--da-teal)}
.dflv-art-news--brand .dflv-art-news-btn:hover{background:var(--da-teal-ink)}

/* 3 . Compact Inline Bar — single slim row, icon + one line + form.
   Description is intentionally never rendered for this style. */
.dflv-art-news--bar{display:flex;align-items:center;gap:16px;background:var(--da-bg-soft);border:1px solid var(--da-line);color:var(--da-ink);text-align:left;padding:16px 20px;border-radius:12px}
.dflv-art-news-icon{flex:none;width:36px;height:36px;border-radius:50%;background:var(--da-coral-soft);color:var(--da-coral-ink);display:flex;align-items:center;justify-content:center;font-size:1rem}
.dflv-art-news-line{flex:none;font-size:.9rem;color:var(--da-ink);font-weight:600;white-space:nowrap}
.dflv-art-news--bar .dflv-art-news-form{flex:1;margin:0;max-width:none}
@media (max-width:640px){
  .dflv-art-news--bar{flex-direction:column;align-items:stretch}
  .dflv-art-news-line{white-space:normal}
}

/* Feedback message: white only makes sense on the dark baseline card —
   readable ink/teal/coral for the three light styles instead. Flex-basis
   makes it drop to its own line under the row layouts (Card, Bar) rather
   than fighting the form for space. */
.dflv-art-news--card .dflv-art-news-msg,
.dflv-art-news--brand .dflv-art-news-msg,
.dflv-art-news--bar .dflv-art-news-msg{color:var(--da-ink-2)}
.dflv-art-news--card .dflv-art-news-msg,
.dflv-art-news--bar .dflv-art-news-msg{flex-basis:100%;margin-top:8px}
.dflv-art-news--card .dflv-art-news-msg.is-ok,
.dflv-art-news--brand .dflv-art-news-msg.is-ok,
.dflv-art-news--bar .dflv-art-news-msg.is-ok{color:var(--da-teal-ink)}
.dflv-art-news--card .dflv-art-news-msg.is-err,
.dflv-art-news--brand .dflv-art-news-msg.is-err,
.dflv-art-news--bar .dflv-art-news-msg.is-err{color:var(--da-coral-ink)}

/* ---- "Was this helpful?" prompt (end of article body) — Quiet Card
   treatment, the same card language as the newsletter's Quiet Card and the
   ad's Contained Card, so it reads as one more module in the family. ---- */
.dflv-art-helpful{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:var(--da-radius);padding:22px 24px;margin:32px 0;font-family:'Inter',sans-serif;color:var(--da-ink)}
/* .dflv-art-helpful-ask sets its own display:flex below, which — same as
   any author rule — overrides the browser's default [hidden]{display:none}
   regardless of specificity, since normal-priority author CSS always beats
   normal-priority user-agent CSS. Without this, ask/more never actually
   hide when JS sets their `hidden` attribute; they just silently keep
   rendering. This one rule guarantees `hidden` always wins inside the
   widget, whatever display value a state block declares for itself. */
.dflv-art-helpful[hidden],.dflv-art-helpful [hidden]{display:none!important}
.dflv-art-helpful-ask{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.dflv-art-helpful-q{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.05rem;color:var(--da-ink)}
.dflv-art-helpful-sub{font-size:.86rem;color:var(--da-ink-3);margin-top:3px}
.dflv-art-helpful-btns{display:flex;gap:8px;flex:none}
.dflv-art-helpful-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--da-line);border-radius:10px;padding:9px 16px;font-size:.86rem;font-weight:600;color:var(--da-ink);cursor:pointer;font-family:inherit;transition:.12s}
.dflv-art-helpful-btn:hover{border-color:var(--da-ink-3)}
.dflv-art-helpful-btn[data-dflv-helpful-yes]:hover{border-color:var(--da-teal);background:var(--da-teal-soft);color:var(--da-teal-ink)}
.dflv-art-helpful-btn[data-dflv-helpful-no]:hover{border-color:var(--da-coral);background:var(--da-coral-soft);color:var(--da-coral-ink)}
.dflv-art-helpful-btn:disabled{opacity:.6;cursor:default}
.dflv-art-helpful-more{margin-top:16px;padding-top:16px;border-top:1px solid var(--da-line)}
.dflv-art-helpful-moreq{font-size:.88rem;font-weight:600;color:var(--da-ink);margin:0 0 2px}
.dflv-art-helpful-chips{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.dflv-art-helpful-chip{font-size:.82rem;font-weight:600;color:var(--da-ink-2);background:#fff;border:1px solid var(--da-line);border-radius:999px;padding:7px 14px;cursor:pointer;font-family:inherit}
.dflv-art-helpful-chip:hover{border-color:var(--da-ink-3)}
.dflv-art-helpful-chip.is-active{background:var(--da-coral);border-color:var(--da-coral);color:#fff}
.dflv-art-helpful-note{width:100%;border:1px solid var(--da-line);border-radius:10px;padding:10px 12px;font-size:.86rem;font-family:inherit;color:var(--da-ink);resize:vertical;min-height:56px;margin-bottom:12px}
.dflv-art-helpful-note:focus{outline:none;border-color:var(--da-coral)}
.dflv-art-helpful-submit{background:var(--da-coral);color:#fff;border:0;border-radius:10px;padding:9px 18px;font-weight:600;font-size:.85rem;cursor:pointer;font-family:inherit}
.dflv-art-helpful-submit:hover{background:#d8473b}
.dflv-art-helpful-submit:disabled{opacity:.7;cursor:default}
@media(max-width:480px){
	.dflv-art-helpful-ask{flex-direction:column;align-items:stretch}
	.dflv-art-helpful-btns{justify-content:stretch}
	.dflv-art-helpful-btn{flex:1;justify-content:center}
}

/* Combined flow (dflv_hp_helpful_combined_news): once a vote is cast,
   -ask/-more hide (via the [hidden] rule above) and this panel takes their
   place in the same card — one ask at a time instead of a separate
   newsletter box appearing right after. Reuses the standalone newsletter's
   own form markup/classes (.dflv-art-news-form etc., see
   dflv_hp_news_form_html()) so the subscribe behavior is identical; only
   layout is overridden here for this narrower, centered context. */
.dflv-art-helpful-subscribe{text-align:center;padding-top:2px}
.dflv-art-helpful-subq{font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--da-teal-ink);margin:0 0 8px}
.dflv-art-helpful-subh{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.1rem;color:var(--da-ink);margin-bottom:4px}
.dflv-art-helpful-subp{font-size:.88rem;color:var(--da-ink-2);margin:0 0 16px}
.dflv-art-helpful-subscribe .dflv-art-news-form{max-width:400px}
.dflv-art-helpful-subscribe .dflv-art-news-msg{color:var(--da-ink-2)}
.dflv-art-helpful-subscribe .dflv-art-news-msg.is-ok{color:var(--da-teal-ink)}
.dflv-art-helpful-subscribe .dflv-art-news-msg.is-err{color:var(--da-coral-ink)}
.dflv-art-helpful-skip{display:block;margin:12px auto 0;background:none;border:0;font-size:.8rem;font-weight:600;color:var(--da-ink-3);text-decoration:underline;text-underline-offset:2px;cursor:pointer;font-family:inherit}
.dflv-art-helpful-skip:hover{color:var(--da-ink)}
@media(max-width:480px){
	.dflv-art-helpful-subscribe .dflv-art-news-form{max-width:none}
}

/* Rail (sidebar) newsletter card — same subscribe copy/action as the
   end-of-article box, just narrow and stacked to fit the margin rail
   column (see dflv_hp_rail_newsletter_html()). */
.dflv-art-rail-news-p{font-size:.82rem;color:var(--da-ink-2);line-height:1.4;margin:0 0 12px}
.dflv-art-rail-card--news .dflv-art-news-form{flex-direction:column;max-width:none;gap:8px}
.dflv-art-rail-card--news .dflv-art-news-input{padding:10px 12px;font-size:.86rem}
.dflv-art-rail-card--news .dflv-art-news-btn{padding:10px 16px;font-size:.86rem}
.dflv-art-rail-card--news .dflv-art-news-msg{color:var(--da-ink-2);font-size:.8rem}
.dflv-art-rail-card--news .dflv-art-news-msg.is-ok{color:var(--da-teal-ink)}
.dflv-art-rail-card--news .dflv-art-news-msg.is-err{color:var(--da-coral-ink)}

/* =========================================================================
 * Google "Add as Preferred Source" — five independent placements (see
 * dflv_hp_google_pref_*_html() in dflv-homepage.php), each gated by its
 * own setting. We don't style the button itself (google-add-preferred-
 * source-btn) — Google's publisher.js script renders into it and controls
 * its own look; everything here is the surrounding card/copy/layout.
 * ====================================================================== */

/* A: byline badge — sits in .dflv-art-by-right beside the fact-check badge. */
.dflv-art-google-badge{display:inline-flex;align-items:center}

/* B: dedicated callout card, same Quiet Card language as the helpful widget. */
.dflv-art-google-callout{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:var(--da-radius);padding:22px 24px;margin:32px 0;display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-family:'Inter',sans-serif;color:var(--da-ink)}
.dflv-art-google-icon{flex:none;width:46px;height:46px;border-radius:12px;background:#fff;border:1px solid var(--da-line);display:flex;align-items:center;justify-content:center}
.dflv-art-google-body{flex:1;min-width:200px}
.dflv-art-google-h{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.05rem;color:var(--da-ink);margin:0 0 5px}
.dflv-art-google-p{font-size:.86rem;color:var(--da-ink-2);line-height:1.55;margin:0}
.dflv-art-google-btnwrap{flex:none}
@media(max-width:480px){
	.dflv-art-google-callout{flex-direction:column;align-items:flex-start;text-align:left}
}

/* F: quieter, inline version dropped mid-article — a compact bordered
   card, no icon, sized down from B so it reads as a small interruption in
   the body copy rather than another full promotional module. The "title"
   is intentionally NOT heading type (see the PHP doc comment on
   dflv_hp_google_pref_midarticle_html() for why) — Inter, not Poppins,
   reinforces that visually too.
   Title/description are both <p> tags, which puts them up against
   .dflv-art-body p's own font-size/line-height/margin (that rule applies
   to every <p> in the article body, this module included, since it gets
   injected directly into that same content). A single class each isn't
   specific enough to win against a class+element selector regardless of
   source order, so both are scoped as two-class descendant selectors here
   — the same fix already needed once before for the "Filed under" link. */
.dflv-art-google-inline{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--da-line);border-radius:12px;padding:14px 18px;margin:24px 0;font-family:'Inter',sans-serif;color:var(--da-ink)}
.dflv-art-google-inline-body{flex:1;min-width:180px}
.dflv-art-google-inline .dflv-art-google-inline-h{font-size:.9rem;font-weight:700;color:var(--da-ink);margin:0 0 2px}
.dflv-art-google-inline .dflv-art-google-inline-p{font-size:.78rem;color:var(--da-ink-2);line-height:1.45;margin:0}
@media(max-width:480px){
	.dflv-art-google-inline{flex-direction:column;align-items:flex-start;text-align:left}
}

/* C: compact rail card, sibling to the pavement/events/newsletter rail cards. */
.dflv-art-rail-card--google .dflv-art-rail-google-p{font-size:.82rem;color:var(--da-ink-2);line-height:1.45;margin:0 0 12px}

/* D: dismissible floating bar. Same [hidden]-vs-author-CSS specificity fix
   already needed for the helpful widget's own state panels (see that rule
   below in this file) — without it, setting `display:flex` here for layout
   would silently defeat the `hidden` attribute JS uses to show/hide this,
   regardless of specificity, since author-origin CSS always beats the
   browser's own [hidden]{display:none} default. */
.dflv-art-google-floatbar[hidden]{display:none!important}
.dflv-art-google-floatbar{
	position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:420px;margin:0 auto;
	background:#fff;border:1px solid var(--da-line);border-radius:14px;
	box-shadow:0 14px 34px -14px rgba(0,0,0,.28);padding:14px 16px;
	display:flex;align-items:center;gap:14px;flex-wrap:wrap;
	font-family:'Inter',sans-serif;color:var(--da-ink);
}
.dflv-art-google-floatbar-text{flex:1;min-width:160px}
.dflv-art-google-floatbar-text b{display:block;font-size:.88rem;color:var(--da-ink)}
.dflv-art-google-floatbar-text span{font-size:.76rem;color:var(--da-ink-2)}
.dflv-art-google-floatbar-x{flex:none;background:none;border:0;color:var(--da-ink-3);font-size:.9rem;cursor:pointer;padding:2px}
.dflv-art-google-floatbar-x:hover{color:var(--da-ink)}

/* E: inline in the "Filed under" row, pushed to the far right of that flex line. */
.dflv-art-foot-google{margin-left:auto}

/* "Follow on Nextdoor" — same row/position as the Google footer button
   above. A real <a>, not Google's script-rendered <div>, so it needs its
   own margin-left:auto to still land at the far right if the Google
   button is off (two auto margins in one flex row only "double up" the
   first one hit — this is safe either way). Color is set with a two-class
   descendant selector, not a single class, because .dflv-article-page's
   own global `a{color:inherit}` reset (see near the top of this file)
   outranks a single class by specificity regardless of source order —
   the same fix already needed once for the "Filed under" category link. */
.dflv-art-foot-cat .dflv-art-foot-nextdoor{
	margin-left:auto;display:inline-flex;align-items:center;gap:8px;
	background:#33B540;border:1px solid #33B540;border-radius:999px;
	padding:9px 16px 9px 12px;font-family:'Poppins',sans-serif;font-weight:700;font-size:.82rem;
	color:#fff;text-decoration:none;
}
.dflv-art-foot-cat .dflv-art-foot-nextdoor:hover{background:#2A9835;border-color:#2A9835}

/* Quick polls ([dflv_poll id="..."] shortcode, dropped anywhere in a post's
   content) — same Quiet Card language as the newsletter/helpful modules.
   Two styles: "bar" (Either/Or Tap Bar, exactly 2 options) and "chips"
   (up to 6 options, results shown as a list of bars below). */
.dflv-art-poll{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:var(--da-radius);padding:20px 22px;margin:28px 0;font-family:'Inter',sans-serif}
.dflv-art-poll-q{font-family:'Poppins',sans-serif;font-weight:700;font-size:1rem;color:var(--da-ink);margin:0 0 14px}

.dflv-art-poll-bar{display:flex;gap:10px}
.dflv-art-poll-bar-btn{flex:1;position:relative;overflow:hidden;background:#fff;border:1.5px solid var(--da-line);border-radius:12px;padding:14px 12px;font-weight:600;font-size:.88rem;color:var(--da-ink);cursor:pointer;font-family:inherit;text-align:center}
.dflv-art-poll-bar-btn:hover{border-color:var(--da-ink-3)}
.dflv-art-poll-bar-btn:disabled{cursor:default}
.dflv-art-poll-bar-fill{position:absolute;inset:0;width:0;background:var(--da-teal-soft);z-index:0;transition:width .5s ease}
.dflv-art-poll-bar-txt{position:relative;z-index:1}
.dflv-art-poll-bar-pct{font-variant-numeric:tabular-nums}
.dflv-art-poll--bar.is-voted .dflv-art-poll-bar-btn.is-picked{border-color:var(--da-teal)}
@media(max-width:480px){
	.dflv-art-poll-bar{flex-direction:column}
}

.dflv-art-poll-chips{display:flex;flex-wrap:wrap;gap:8px}
.dflv-art-poll-chip{font-size:.82rem;font-weight:600;color:var(--da-ink-2);background:#fff;border:1px solid var(--da-line);border-radius:999px;padding:7px 14px;cursor:pointer;font-family:inherit}
.dflv-art-poll-chip:hover{border-color:var(--da-ink-3)}
.dflv-art-poll-chip:disabled{cursor:default}
.dflv-art-poll-chip.is-active{background:var(--da-coral);border-color:var(--da-coral);color:#fff}
/* Same [hidden] specificity fix already needed for the helpful widget's
   own state panels (see .dflv-art-helpful[hidden] above): without this,
   the .dflv-art-poll-results block below would keep rendering even while
   `hidden` is set, since nothing here should otherwise set its display. */
.dflv-art-poll [hidden]{display:none!important}
.dflv-art-poll-results{margin-top:14px}
.dflv-art-poll-result-row{display:flex;align-items:center;gap:10px;margin-top:8px}
.dflv-art-poll-result-row:first-child{margin-top:0}
.dflv-art-poll-result-label{font-size:.82rem;color:var(--da-ink-2);flex:0 0 130px}
.dflv-art-poll-result-track{flex:1;height:8px;border-radius:99px;background:var(--da-line);overflow:hidden}
.dflv-art-poll-result-fill{height:100%;border-radius:99px;background:var(--da-teal)}
.dflv-art-poll-result-pct{font-size:.78rem;font-weight:700;color:var(--da-ink-2);width:34px;text-align:right;font-variant-numeric:tabular-nums}

/* =========================================================================
 * Full-width hero layouts (fw1-fw4). These break out of the reading column
 * to span the full viewport width, then the body returns to 720.
 * ====================================================================== */
/* keep the tiny scrollbar-width overflow from the breakout from causing scroll */
body.dflv-article-active{overflow-x:hidden}

.dflv-art-fw{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);margin-bottom:6px}
.dflv-art-fw-inner{max-width:1180px;margin:0 auto;padding:0 40px}

/* light text treatment shared by fw1/fw2/fw3 */
.dflv-art-fw-light .dflv-art-title{color:#fff}
.dflv-art-fw-light .dflv-art-dek{color:rgba(255,255,255,.82)}
.dflv-art-fw-light .dflv-art-byline{border-top-color:rgba(255,255,255,.16)}
.dflv-art-fw-light .dflv-art-sub{color:rgba(255,255,255,.65)}
.dflv-art-fw-light .dflv-art-share-btn{background:transparent;border-color:rgba(255,255,255,.28);color:rgba(255,255,255,.82)}
.dflv-art-fw-light .dflv-art-share-btn:hover{border-color:#fff;color:#fff}
.dflv-art-fw-light .dflv-art-factcheck{background:rgba(255,255,255,.14);color:#fff}

/* fw1 · full-bleed image + overlay title */
.dflv-art-fw1{position:relative;min-height:520px;display:flex;align-items:flex-end;overflow:hidden}
.dflv-art-fw1-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.dflv-art-fw1-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,12,10,.92),rgba(8,12,10,.42) 46%,rgba(8,12,10,.04) 82%)}
.dflv-art-fw1 .dflv-art-fw-inner{position:relative;width:100%;padding-top:64px;padding-bottom:46px}
.dflv-art-fw1 .dflv-art-title{font-size:3.4rem;max-width:20ch}
.dflv-art-fw1 .dflv-art-dek{max-width:60ch}

/* fw2 · full-width dark band */
.dflv-art-fw2{background:var(--da-ink);padding:64px 0}
.dflv-art-fw2 .dflv-art-title{font-size:3.2rem;max-width:22ch}
.dflv-art-fw2 .dflv-art-dek{max-width:62ch}

/* fw3 · full-width teal brand band */
.dflv-art-fw3{background:linear-gradient(120deg,#0E9384,#0B6E63);padding:60px 0}
.dflv-art-fw3 .dflv-art-title{font-size:3.2rem;max-width:20ch}
.dflv-art-fw3 .dflv-art-dek{max-width:60ch}

/* fw4 · full-width split, text left / image right */
.dflv-art-fw4{display:grid;grid-template-columns:1fr 1fr;min-height:480px;margin-bottom:6px}
.dflv-art-fw4-text{background:var(--da-bg-soft);display:flex;align-items:center;padding:56px 6vw}
.dflv-art-fw4-textinner{max-width:560px;margin-left:auto}
.dflv-art-fw4-text .dflv-art-title{font-size:2.9rem}
.dflv-art-fw4-img{background-size:cover;background-position:center;min-height:320px}

/* fw5 · full-bleed photo, overlap card left-aligned (Refined Overlap family) */
.dflv-art-fw5-photo{min-height:460px;background-size:cover;background-position:center}
.dflv-art-fw5-cardwrap{max-width:720px;margin:-64px auto 0;padding:0 28px;position:relative;z-index:2}
.dflv-art-fw5-card{background:#fff;border-radius:18px;box-shadow:0 20px 44px -20px rgba(20,20,20,.28);padding:30px 34px 32px;max-width:560px;position:relative}
.dflv-art-fw5-card .dflv-art-title{font-size:2rem;margin-top:10px}

/* fw6 · full-bleed photo, large centered overlap card */
.dflv-art-fw6-photo{min-height:520px;background-size:cover;background-position:center}
.dflv-art-fw6-cardwrap{max-width:900px;margin:-90px auto 0;padding:0 28px;position:relative;z-index:2;text-align:center}
.dflv-art-fw6-card{background:#fff;border-radius:20px;box-shadow:0 24px 52px -22px rgba(20,20,20,.3);padding:40px 48px 38px;position:relative}
.dflv-art-fw6-card .dflv-art-hero-mag-kicker{left:50%;transform:translateX(-50%)}
.dflv-art-fw6-card .dflv-art-title{font-size:2.2rem;margin-top:12px}
.dflv-art-fw6-card .dflv-art-dek{max-width:52ch;margin-left:auto;margin-right:auto}

/* fw7 · full-bleed photo with duotone wash, centered overlap card */
.dflv-art-fw7-photo{min-height:460px;background-size:cover;background-position:center;position:relative}
.dflv-art-fw7-wash{position:absolute;inset:0;background:linear-gradient(160deg, rgba(14,147,132,.35), rgba(232,86,74,.28));mix-blend-mode:multiply}
.dflv-art-fw7-cardwrap{max-width:720px;margin:-58px auto 0;padding:0 28px;position:relative;z-index:2}
.dflv-art-fw7-card{background:#fff;border-radius:18px;padding:30px 34px 32px;position:relative;box-shadow:0 18px 40px -20px rgba(20,20,20,.22);max-width:560px}
.dflv-art-fw7-card .dflv-art-title{font-size:2rem;margin-top:10px}

/* fw8 · full-bleed photo, flat band below (no overlap, no shadow) */
.dflv-art-fw8-photo{min-height:420px;background-size:cover;background-position:center}
.dflv-art-fw8-band{background:var(--da-bg-soft);border-top:1px solid var(--da-line);border-bottom:1px solid var(--da-line);padding:36px 0;margin-bottom:6px}
.dflv-art-fw8-inner{max-width:720px;margin:0 auto;padding:0 28px;position:relative}
.dflv-art-fw8-inner .dflv-art-title{font-size:2rem;margin-top:8px}

/* fw9 · full-width split with a floating overlap card */
.dflv-art-fw9{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;min-height:460px;margin-bottom:6px}
.dflv-art-fw9-img{height:100%;min-height:460px;background-size:cover;background-position:center}
.dflv-art-fw9-side{padding:40px 6vw 40px 4vw;position:relative}
.dflv-art-fw9-card{background:#fff;border:1px solid var(--da-line);border-radius:18px;box-shadow:0 18px 40px -22px rgba(20,20,20,.22);padding:34px 36px;position:relative;max-width:480px;margin-left:-64px}
.dflv-art-fw9-card .dflv-art-title{font-size:1.9rem;margin-top:10px}

/* Dark overlap-card modifier, shared across D, Full 5, Full 6, Full 7, Full 8, Full 9 */
.dflv-art-hero-card--dark{background:var(--da-ink);border-color:var(--da-ink)}
.dflv-art-hero-card--dark .dflv-art-title{color:#fff}
.dflv-art-hero-card--dark .dflv-art-dek{color:rgba(255,255,255,.78)}
.dflv-art-hero-card--dark .dflv-art-hero-mag-date{color:rgba(255,255,255,.6)}
.dflv-art-hero-card--dark .dflv-art-hero-mag-kicker{background:var(--da-gold);color:var(--da-ink)}

@media (max-width:820px){
  .dflv-art-fw-inner{padding:0 24px}
  .dflv-art-fw1{min-height:380px}
  .dflv-art-fw1 .dflv-art-title,.dflv-art-fw2 .dflv-art-title,.dflv-art-fw3 .dflv-art-title,.dflv-art-fw4-text .dflv-art-title{font-size:2rem}
  .dflv-art-fw2,.dflv-art-fw3{padding:42px 0}
  .dflv-art-fw4{grid-template-columns:1fr}
  .dflv-art-fw4-text{padding:32px 24px;order:2}
  .dflv-art-fw4-textinner{margin-left:0;max-width:none}
  .dflv-art-fw4-img{order:1;min-height:220px}
  .dflv-art-fw5-photo,.dflv-art-fw7-photo{min-height:280px}
  .dflv-art-fw5-cardwrap,.dflv-art-fw7-cardwrap{margin-top:-40px}
  .dflv-art-fw5-card,.dflv-art-fw7-card{padding:22px 22px 24px;max-width:none}
  .dflv-art-fw5-card .dflv-art-title,.dflv-art-fw7-card .dflv-art-title{font-size:1.5rem;margin-top:6px}
  .dflv-art-fw6-photo{min-height:300px}
  .dflv-art-fw6-cardwrap{margin-top:-50px}
  .dflv-art-fw6-card{padding:26px 24px 26px}
  .dflv-art-fw6-card .dflv-art-title{font-size:1.6rem;margin-top:8px}
  .dflv-art-fw8-photo{min-height:260px}
  .dflv-art-fw8-band{padding:26px 0}
  .dflv-art-fw8-inner .dflv-art-title{font-size:1.6rem;margin-top:6px}
  .dflv-art-fw9{grid-template-columns:1fr}
  .dflv-art-fw9-img{min-height:220px}
  .dflv-art-fw9-side{padding:0 24px}
  .dflv-art-fw9-card{margin:-40px 0 0;max-width:none;padding:22px 22px 24px}
  .dflv-art-fw9-card .dflv-art-title{font-size:1.5rem;margin-top:6px}
}

/* ---- product carousel (lives inside .dflv-art-module, see above) ---- */
.dflv-art-module--carousel{padding:20px 22px 22px}
.dflv-art-module--carousel .dflv-art-module-label{margin-bottom:18px}
.dflv-car-sub{font-size:.85rem;color:var(--da-ink-2);max-width:56ch;line-height:1.45;margin:-10px 0 20px}

.dflv-car-track{display:flex;gap:16px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x mandatory;align-items:stretch;-webkit-overflow-scrolling:touch}
.dflv-car-track::-webkit-scrollbar{height:6px}
.dflv-car-track::-webkit-scrollbar-thumb{background:var(--da-line);border-radius:3px}

/* exactly 3 cards visible on desktop, 2 on mobile; extras reachable by scroll.
   No fixed height here on purpose — align-items:stretch on the track makes
   every card match the tallest one in its row, so nothing gets clipped
   regardless of how long a product name runs. */
.dflv-car-card{
  flex:0 0 calc((100% - 32px) / 3);
  scroll-snap-align:start;
  border:1px solid var(--da-line);border-radius:14px;overflow:hidden;background:#fff;
  display:flex;flex-direction:column;
}
@media(max-width:680px){
  .dflv-car-card{flex:0 0 calc((100% - 16px) / 2)}
}

.dflv-car-img{height:140px;flex:none;background:var(--da-bg-soft);display:flex;align-items:center;justify-content:center;overflow:hidden}
.dflv-car-img img{width:100%;height:100%;object-fit:cover;display:block}

.dflv-car-body{padding:14px;display:flex;flex-direction:column;flex:1;min-height:0}
.dflv-car-name{
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.9rem;line-height:1.3;color:var(--da-ink);margin-bottom:6px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.dflv-car-price{font-family:'Poppins',sans-serif;font-weight:700;font-size:.92rem;color:var(--da-ink);margin-bottom:14px}
.dflv-car-buy{display:block;text-align:center;background:#FBBF00;color:#fff !important;font-weight:600;font-size:.8rem;border-radius:8px;padding:9px 0;margin-top:auto;text-decoration:none}
.dflv-car-buy:hover{background:#e0a900;color:#fff !important}

.dflv-car-nav{display:flex;gap:8px;padding-top:6px;justify-content:space-between}
.dflv-car-prev,.dflv-car-next{width:32px;height:32px;border-radius:50%;border:1px solid var(--da-line);background:#fff;font-size:.9rem;color:var(--da-ink-2);cursor:pointer}
.dflv-car-prev:hover,.dflv-car-next:hover{border-color:var(--da-ink);color:var(--da-ink)}
.dflv-car-prev:disabled,.dflv-car-next:disabled{opacity:.35;cursor:default}

/* ---- house ads ---- */
.dflv-ad{margin:26px 0;text-align:center}
.dflv-ad-label{display:block;font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:8px}
.dflv-ad-slot{display:block}
/* width:auto keeps the creative at its own resolution (never upscaled to fill
   the band); max-width only ever shrinks it down to fit smaller screens. */
.dflv-ad-slot img{display:block;margin:0 auto;width:auto;max-width:100%;height:auto;border-radius:6px}
/* all placements share the same full-width band as the billboard */
.dflv-ad--fw{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);background:var(--da-bg-soft);border-top:1px solid var(--da-line);border-bottom:1px solid var(--da-line);padding:22px 0}
/* image caps: leaderboards 728, billboard 970, both far smaller on mobile */
.dflv-ad--fw .dflv-ad-slot img{max-width:728px}
.dflv-ad--bill .dflv-ad-slot img{max-width:970px}
@media(max-width:680px){
	.dflv-ad--fw .dflv-ad-slot img{max-width:320px}
	.dflv-ad--bill .dflv-ad-slot img{max-width:336px}
}
.dflv-is-ad{margin:8px 0}
.dflv-is-post{margin-top:56px}

/* ---- house ads: alternate treatments for the leaderboard above the
   headline (Settings > DFLV Homepage > House Ads > Leaderboard style).
   Card/Tag/Rule are intentionally NOT full-bleed — they carry no
   dflv-ad--fw class, so they stay inside the article's own 720px column
   (.dflv-art) automatically, and the article critical script's full-width
   breakout (which targets .dflv-ad--fw) never touches them. ---- */

/* 1 . contained card, same border/radius language as the article's other cards.
   Tighter bottom margin than the 26px base .dflv-ad gives every style, so it
   stacks closer to whatever follows instead of floating with dead air under it. */
.dflv-ad--style-card{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:var(--da-radius);padding:18px 20px;margin-bottom:16px}

/* 2 . sponsored frame — real gold fill (was a near-white #FCFBF8) so it reads
   as its own colored zone instead of a pale card that blends into the page.
   Label pill overlaps the border, same shape as the Presented-By badge. */
.dflv-ad--style-tag{position:relative;background:var(--da-gold-soft);border:1px solid #F0DFB4;border-radius:var(--da-radius);padding:24px 20px 20px;margin-bottom:16px}
.dflv-ad-tag{position:absolute;top:-13px;left:18px;display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #F0DFB4;border-radius:999px;padding:5px 12px 5px 6px;font-size:.68rem;font-weight:600;color:var(--da-ink-2)}
.dflv-ad-tag i{width:16px;height:16px;border-radius:50%;background:var(--da-gold-ink);display:inline-block}

/* 3 . minimal rule — same accent rule already used for the divider-style
   subtitle. Tighter bottom margin, same reasoning as Card above. */
.dflv-ad--style-rule{padding-top:2px;margin-bottom:16px}
.dflv-ad--style-rule::before{content:"";display:block;width:32px;height:3px;background:var(--da-coral);border-radius:2px;margin:0 auto 14px}
.dflv-ad-label--rule{text-align:right;letter-spacing:.1em}

/* 4 . branded full-bleed — keeps the fw band but with its own identity
   instead of the plain neutral fill shared with the rest of the page.
   Flush: no bottom margin, no border-bottom, so this band's own background
   runs straight into whatever sits directly below it (a hero photo, a
   header) with no white seam. Baseline (default, no style class) is left
   exactly as production today, gap and border included, since it's meant
   to stay the fixed "as-is" reference. */
.dflv-ad--style-band{background:rgba(20,20,20,.035);border-top:3px solid var(--da-coral);border-bottom:0;margin-bottom:0}
.dflv-ad-label--band{display:inline-flex;background:#fff;border:1px solid var(--da-line);border-radius:999px;padding:4px 10px;font-size:.62rem;letter-spacing:.08em;color:var(--da-ink-2);margin-bottom:10px}

/* contained styles have no dflv-ad--fw cap, so give their creative the same
   728/320 ceilings directly (the surrounding column already keeps them
   narrower than that in practice, this just keeps behavior predictable) */
.dflv-ad--style-card .dflv-ad-slot img,
.dflv-ad--style-tag .dflv-ad-slot img,
.dflv-ad--style-rule .dflv-ad-slot img{max-width:728px}
@media(max-width:680px){
	.dflv-ad--style-card .dflv-ad-slot img,
	.dflv-ad--style-tag .dflv-ad-slot img,
	.dflv-ad--style-rule .dflv-ad-slot img{max-width:320px}
}

/* =========================================================================
 * Ultrawide fallback: full-bleed hero photos use background-size:cover, so
 * on very wide/short viewports (ultrawide monitors) the browser has to
 * upscale the image well past its native resolution to cover the width,
 * which looks visibly soft/blurry. Past a 2:1 aspect ratio, swap to a
 * solid color instead of fighting that. Contained layouts (H, I, J at
 * normal width) never reach this width, so they're untouched; only their
 * Full 10/11/12 full-bleed siblings are affected.
 * ====================================================================== */
@media (min-aspect-ratio: 2/1) {
	.dflv-art-fw1-bg,
	.dflv-art-fw4-img,
	.dflv-art-fw5-photo,
	.dflv-art-fw6-photo,
	.dflv-art-fw7-photo,
	.dflv-art-fw8-photo,
	.dflv-art-fw9-img,
	.dflv-art-hero-mast--full .dflv-art-hero-mast-bg,
	.dflv-art-hero-spine--full .dflv-art-hero-spine-photo,
	.dflv-art-hero-diag--full .dflv-art-hero-diag-photo {
		background-image: none !important;
		background-color: var(--da-ink);
	}
	.dflv-art-fw7-wash{display:none}
}

/* =========================================================================
 * Google AdSense units (includes/adsense.php + assets/adsense.js)
 * Rail 300x600 (>=900px), in-content 300x250 band (<900px), sticky footer.
 * ====================================================================== */
.dflv-as-box{position:relative;display:inline-block;max-width:100%;vertical-align:top}
.dflv-as-box ins{display:block;margin:0 auto;overflow:hidden;text-decoration:none}
.dflv-as-rail-slot{display:none}
@media (min-width:900px){
  /* widen the rail from 220 to 300px, hero events card included so it still lines up */
  body.dflv-as-rail-on .dflv-art-railgrid,
  body.dflv-as-rail-on .dflv-art-hero-imgrail{grid-template-columns:1fr 300px}
  /* stretch the rail to the row so the ad has room to stick; the cards scroll away */
  body.dflv-as-rail-on .dflv-art-railgrid{align-items:stretch}
  body.dflv-as-rail-on .dflv-art-rail{position:static;align-self:stretch}
  .dflv-as-rail-slot{display:block;position:sticky;top:20px;margin-top:6px;text-align:center}
  .dflv-as-rail-slot .dflv-ad-label{text-align:center}
}
.dflv-ad--as .dflv-as-box{min-width:300px}
/* in-content strip: a rounded card inside the article column at every width, same
   radius as the hero card and rail cards (never full-bleed) */
.dflv-ad--as-col{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:var(--da-radius);padding:18px 0 22px}
@media (max-width:560px){.dflv-ad--as-col{border-radius:14px}}
/* very narrow phones: the 300px unit needs the room, so let the strip use it */
@media (max-width:359px){.dflv-ad--as-col{margin-left:-20px;margin-right:-20px;border-radius:0;border-left:0;border-right:0}}

/* sticky footer: bar on top counts down, then the unit rotates. No label, not closable. */
.dflv-as-foot{position:fixed;left:0;right:0;bottom:0;z-index:8000;background:#fff;box-shadow:0 -6px 24px rgba(20,20,20,.12);padding-bottom:env(safe-area-inset-bottom,0px)}
.dflv-as-foot[hidden],.dflv-as-foot.is-empty{display:none!important}
.dflv-as-foot-bar{height:4px;background:var(--da-line,#EAEAE7)}
.dflv-as-foot-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--da-teal,#0E9384),var(--da-coral,#E8564A));transform-origin:left center;transform:scaleX(1)}
.dflv-as-foot-in{display:flex;align-items:center;justify-content:center;padding:8px 12px;min-height:28px}
.dflv-as-foot-slot{transition:opacity .25s;line-height:0}
.dflv-as-foot-slot.is-out{opacity:0}
@media (max-width:767px){
  .dflv-as-foot-in{padding:6px 8px}
  .dflv-as-foot-bar{height:3px}
}
@media (prefers-reduced-motion:reduce){.dflv-as-foot-slot{transition:none}}
/* keep the end of the page and other fixed bits clear of the footer */
body.dflv-as-foot-on{padding-bottom:calc(var(--dflv-as-foot-h,110px) + env(safe-area-inset-bottom,0px))}
body.dflv-as-foot-on.dflv-as-foot-empty{padding-bottom:0}
body.dflv-as-foot-on:not(.dflv-as-foot-empty) .dflv-art-google-floatbar{bottom:calc(var(--dflv-as-foot-h,110px) + 16px + env(safe-area-inset-bottom,0px))}

/* =========================================================================
 * Hero "Top strip" (Settings > Article Layout > Hero). One card held in the
 * article column: gold category strip, photo (if any), headline, dek, byline.
 * Never breaks out to full width; the margin rail starts beside it.
 * ====================================================================== */
.dflv-art-hstrip{max-width:720px;margin:0 auto 28px;border:1px solid var(--da-line);border-radius:var(--da-radius);overflow:hidden;background:#fff}
.dflv-art-hstrip-bar{display:flex;align-items:center;height:40px;padding:0 22px;background:#FBBF00;color:#fff;font-family:'Poppins',sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dflv-art-hstrip-photo{position:relative;height:300px;background-size:cover;background-position:center;background-color:var(--da-bg-soft)}
.dflv-art-hstrip-link{color:inherit;text-decoration:none;overflow:hidden;text-overflow:ellipsis}
.dflv-art-hstrip-link:hover{text-decoration:underline;text-underline-offset:3px}
.dflv-art-hstrip-link:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:2px}
.dflv-art-hstrip-text{padding:26px 30px 24px}
.dflv-art-hstrip-text .dflv-art-title{font-size:2.2rem;margin-bottom:12px}
.dflv-art-hstrip-text .dflv-art-title:has(+ .dflv-art-subtitle--filled){margin-bottom:0}
.dflv-art-hstrip-text .dflv-art-byline{margin-top:20px}
@media (max-width:560px){
  .dflv-art-hstrip{border-radius:14px}
  .dflv-art-hstrip-bar{height:34px;padding:0 18px;font-size:.7rem}
  .dflv-art-hstrip-photo{height:170px}
  .dflv-art-hstrip-text{padding:20px 18px}
  .dflv-art-hstrip-text .dflv-art-title{font-size:1.55rem}
}
/* AdSense's 300px rail is 80px wider than the 220px one; widen the article by the
   same amount so the body column keeps its width. */
@media (min-width:900px){
  body.dflv-as-rail-on .dflv-art--rail{max-width:1080px}
}

/* Top strip hero: breathing room under the theme header (Full 11 and the classic
   header get theirs from their own band/padding; this card sits flush otherwise). */
.dflv-art--hero-strip,.dflv-art--hero-boxed{padding-top:28px}
@media (max-width:560px){.dflv-art--hero-strip,.dflv-art--hero-boxed{padding-top:18px}}

/* =========================================================================
 * Hero "Boxed article": the Top strip card extended around the whole article.
 * Rounded corners come from the first child (hero card, top) and the footer
 * (bottom) rather than overflow:hidden, so nothing inside is ever clipped.
 * ====================================================================== */
.dflv-art-box{max-width:720px;margin:0 auto;border:1px solid var(--da-line);border-radius:var(--da-radius);background:#fff}
.dflv-art-box .dflv-art-hstrip{max-width:none;margin:0;border:0;border-radius:var(--da-radius) var(--da-radius) 0 0;border-bottom:1px solid var(--da-line)}
.dflv-art-box > :not(.dflv-art-hstrip){margin-left:auto;margin-right:auto;max-width:calc(100% - 60px)}
.dflv-art-box .dflv-art-body{margin-top:28px}
/* full-width helpers stay inside the box */
.dflv-art-box .dflv-ad--fw,.dflv-art-box .dflv-art-fw{margin-left:0 !important;margin-right:0 !important;width:auto !important}
.dflv-art-box .dflv-ad--fw{border:1px solid var(--da-line);border-radius:12px;padding:18px 0 22px}
.dflv-art-box > .dflv-art-foot{max-width:none;margin:28px 0 0;padding:14px 30px 18px;border:0;border-top:1px solid var(--da-line);background:var(--da-bg-soft);border-radius:0 0 var(--da-radius) var(--da-radius)}
.dflv-art-box > :last-child:not(.dflv-art-foot){margin-bottom:24px}
/* in-content ad strips nested in the box: slightly tighter corners than the box itself */
.dflv-art-box .dflv-ad--as-col{border-radius:12px}
@media (max-width:560px){
  /* phones: the box runs full width (square corners) and keeps its 1px outline */
  .dflv-art-box{margin-left:-20px;margin-right:-20px}
  /* hero runs edge to edge on phones; the boxed card keeps its rounded top and bottom corners */
  .dflv-art-hstrip{margin-left:-20px;margin-right:-20px;border-left:0;border-right:0;border-radius:0}
  /* the 300px unit needs the room: strips run edge to edge inside the box on phones */
  .dflv-art-box .dflv-ad--as-col{margin-left:-18px;margin-right:-18px;border-radius:0;border-left:0;border-right:0}
  .dflv-art-box > :not(.dflv-art-hstrip){max-width:calc(100% - 36px)}
  .dflv-art-box > .dflv-art-foot.dflv-art-foot{max-width:none;padding:12px 18px 16px}
  .dflv-art-box .dflv-art-body{margin-top:22px}
}
/* The plugin's inline CSS lets billboard creatives run up to 970px (!important);
   inside the box they must fit the box instead. */
body.dflv-article-active .dflv-art-box .dflv-ad .dflv-ad-slot img{max-width:100% !important;height:auto !important}

/* =========================================================================
 * Two rails (Settings > Rail > Two rails; needs the Boxed article hero)
 * left rail | boxed article | right rail, both rails 300px, from 1240px up.
 * The article column flexes: ~560px at 1240px, 720px by 1400px.
 * ====================================================================== */
.dflv-art-rail--left{display:none}
.dflv-art-rail-q{display:block;padding:7px 0;border-top:1px solid var(--da-line);text-decoration:none;font-size:.82rem;line-height:1.3;color:var(--da-ink)}
.dflv-art-rail-q:first-of-type{border-top:0}
.dflv-art-rail-q:hover{color:var(--da-teal-ink)}
/* between-articles newsletter: the signup sits outside either article box */
.dflv-is-news{max-width:1180px;margin:44px auto 8px;padding:0 20px}
.dflv-is-news .dflv-art-news{margin:0}
@media (min-width:1240px){
  /* Widen the article element to the three columns without a transform (fixed
     children such as the floatbar and the deck must keep the viewport as their
     containing block). left:50% plus a negative half-width margin centres it. */
  body.dflv-art-2rail .dflv-art--rail{
    --dflv-2r-w:min(1360px,calc(100vw - 40px));
    max-width:none;width:var(--dflv-2r-w);position:relative;left:50%;margin-left:calc(var(--dflv-2r-w) / -2);margin-right:0}
  body.dflv-art-2rail .dflv-art-railgrid--2{grid-template-columns:300px minmax(0,720px) 300px;justify-content:center;gap:20px;align-items:stretch}
  /* both rails stick; article.js lowers --dflv-rail-top for a rail taller than the window */
  body.dflv-art-2rail .dflv-art-railgrid--2 .dflv-art-rail{position:sticky;top:var(--dflv-rail-top,20px);align-self:start}
  body.dflv-art-2rail .dflv-art-rail--left{display:flex}
  /* the right rail is 300px with or without AdSense, so both rails match */
  body.dflv-art-2rail .dflv-art-rail--left .dflv-as-rail-slot{display:block}
  body.dflv-art-2rail .dflv-art-railgrid--2 .dflv-art-railmain{min-width:0}
}
/* below 1240px the right rail alone is used; hide the left unit's slot with its rail */
@media (max-width:1239px){
  body.dflv-art-2rail .dflv-art-rail--left{display:none}
}
/* narrow window (1240 to 1399px): a compact card so the column does not feel cramped */
@media (min-width:1240px) and (max-width:1399px){
  body.dflv-art-2rail .dflv-art-hstrip-photo{height:250px}
  body.dflv-art-2rail .dflv-art-hstrip-text{padding:22px 26px 20px}
  body.dflv-art-2rail .dflv-art-hstrip-text .dflv-art-title{font-size:1.85rem}
  body.dflv-art-2rail .dflv-art-box > :not(.dflv-art-hstrip){max-width:calc(100% - 52px)}
  body.dflv-art-2rail .dflv-art-box > .dflv-art-foot{padding:12px 26px 16px}
}

/* ---- two-rail widget cards: one fixed height so both rails always line up ---- */
.dflv-art-rail-card--fx{--dflv-rail-h:172px;height:var(--dflv-rail-h);display:flex;flex-direction:column;overflow:hidden;min-width:0}
.dflv-art-rail-card--fx .dflv-art-rail-k{display:flex;justify-content:space-between;gap:8px}
.dflv-art-rail-card--fx .dflv-art-rail-k i{font-style:normal;color:var(--da-teal-ink);white-space:nowrap}
.dflv-art-rail-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;min-width:0}
.dflv-art-rail-card--fx .dflv-art-rail-link{margin-top:auto;padding-top:8px;white-space:nowrap;align-self:flex-start}
.dflv-art-rail-card--fx .dflv-art-rail-ev{display:flex;gap:8px;align-items:baseline;padding:6px 0;white-space:nowrap;overflow:hidden}
.dflv-art-rail-card--fx .dflv-art-rail-ev b{display:inline;flex:none}
.dflv-art-rail-card--fx .dflv-art-rail-ev span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.dflv-art-win{display:flex;gap:8px}
.dflv-art-win div{flex:1;min-width:0;background:var(--da-bg-soft);border-radius:9px;padding:8px 10px}
.dflv-art-win b{display:block;font-family:'Poppins',sans-serif;font-size:.95rem;line-height:1.15;color:var(--da-ink)}
.dflv-art-win span{display:block;font-size:.7rem;color:var(--da-ink-3);margin-top:2px}
.dflv-art-adopt{display:flex;gap:12px;align-items:center;min-width:0}
.dflv-art-adopt-img{flex:none;width:64px;height:64px;border-radius:10px;object-fit:cover;background:var(--da-bg-soft)}
.dflv-art-adopt-img--ph{display:flex;align-items:center;justify-content:center;font-family:'Poppins',sans-serif;font-weight:700;font-size:1.6rem;color:var(--da-coral-ink)}
.dflv-art-adopt-txt{min-width:0;display:flex;flex-direction:column}
.dflv-art-adopt-txt strong{font-family:'Poppins',sans-serif;font-size:.98rem;line-height:1.2;color:var(--da-ink)}
.dflv-art-adopt-txt span{font-size:.78rem;line-height:1.35;color:var(--da-ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* poll inside a rail card: the question plus two stacked tap buttons */
.dflv-art-rail-card--poll .dflv-art-poll{background:none;border:0;padding:0;margin:0}
.dflv-art-rail-card--poll .dflv-art-poll-q{font-size:.86rem;line-height:1.3;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dflv-art-rail-card--poll .dflv-art-poll-bar{flex-direction:column;gap:6px}
.dflv-art-rail-card--poll .dflv-art-poll-bar-btn{padding:7px 10px;border-width:1px;border-radius:8px;font-size:.8rem;text-align:left}
@media (min-width:1240px){
  /* with the ad in the middle of each rail, it scrolls with the page instead of sticking */
  body.dflv-art-2rail .dflv-as-rail-slot{position:static;margin-top:0}
}

/* adoptable dog photo: a button with a magnifier badge, opens the lightbox */
.dflv-art-adopt-zoom{position:relative;flex:none;width:64px;height:64px;padding:0;border:0;border-radius:10px;background:none;cursor:zoom-in;overflow:hidden}
.dflv-art-adopt-zoom .dflv-art-adopt-img{display:block;width:100%;height:100%}
.dflv-art-adopt-mag{position:absolute;right:4px;bottom:4px;width:22px;height:22px;border-radius:50%;background:rgba(20,20,20,.72);color:#fff;display:flex;align-items:center;justify-content:center;transition:background .15s}
.dflv-art-adopt-zoom:hover .dflv-art-adopt-mag{background:rgba(20,20,20,.9)}
.dflv-art-adopt-zoom:focus-visible{outline:2px solid var(--da-teal);outline-offset:2px}
/* lightbox */
html.dflv-lb-open{overflow:hidden}
.dflv-lb{position:fixed;inset:0;z-index:100000;background:rgba(10,12,12,.88);display:flex;align-items:center;justify-content:center;padding:24px;cursor:zoom-out}
.dflv-lb-img{max-width:min(92vw,900px);max-height:88vh;width:auto;height:auto;border-radius:10px;box-shadow:0 12px 48px rgba(0,0,0,.5);background:#fff;cursor:default}
.dflv-lb-close{position:absolute;top:14px;right:16px;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:1.7rem;line-height:1;cursor:pointer}
.dflv-lb-close:hover{background:rgba(255,255,255,.26)}
.dflv-lb-close:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* =========================================================================
 * Boxed event page (templates/single-event-boxed.php): the article box with
 * event pieces inside. Date, location, buttons, map, More Events.
 * ====================================================================== */
.dflv-art-hstrip-bar{justify-content:space-between;gap:16px}
.dflv-evb-cat{min-width:0;overflow:hidden;text-overflow:ellipsis}
.dflv-evb-cal{flex:none;font-weight:600;letter-spacing:.06em;opacity:.95;color:inherit}
.dflv-evb-cal:hover{text-decoration:underline;text-underline-offset:3px}
.dflv-evb-cal:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:2px}
.dflv-evb-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:3rem;opacity:.5}
.dflv-evb-credit{position:absolute;left:12px;bottom:10px;max-width:calc(100% - 24px);font-size:.68rem;font-weight:500;color:#fff;background:rgba(20,20,20,.55);padding:4px 9px;border-radius:999px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dflv-evb-badge{position:absolute;right:14px;top:14px;background:#fff;border-radius:12px;padding:8px 12px 7px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.18);line-height:1}
.dflv-evb-badge span{display:block;font:700 .62rem 'Poppins',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--da-coral-ink)}
.dflv-evb-badge b{display:block;font:800 1.6rem 'Poppins',sans-serif;margin-top:3px;color:var(--da-ink)}
.dflv-evb-stamp{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:8px}

.dflv-evb-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.dflv-evb-fact{background:var(--da-bg-soft);border:1px solid var(--da-line);border-radius:12px;padding:14px 16px;min-width:0}
.dflv-evb-fact .l{font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--da-ink-3);margin-bottom:5px}
.dflv-evb-fact .v{font-family:'Poppins',sans-serif;font-weight:600;font-size:.98rem;line-height:1.3;overflow-wrap:anywhere}
.dflv-evb-fact small{display:block;font:400 .8rem 'Inter',sans-serif;color:var(--da-ink-2);margin-top:2px}
.dflv-evb-fact .dflv-ev1-date-primary{font-weight:600}
.dflv-evb-fact .dflv-ev1-date-sub{font:400 .8rem 'Inter',sans-serif;color:var(--da-ink-2);margin-top:2px}
.dflv-evb-fact .dflv-ev1-date-list{margin:6px 0 0 18px;font:400 .82rem 'Inter',sans-serif;color:var(--da-ink-2)}
.dflv-evb-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.dflv-evb-btn{display:inline-flex;align-items:center;font:600 .86rem 'Inter',sans-serif;padding:11px 18px;border-radius:10px;border:1px solid var(--da-line);background:#fff;color:var(--da-ink)}
.dflv-evb-btn:hover{border-color:var(--da-ink-3)}
.dflv-evb-btn--cta{background:var(--da-coral);border-color:var(--da-coral);color:#fff}
.dflv-evb-btn--cta:hover{background:#d8473b;border-color:#d8473b}
.dflv-evb-btn:focus-visible{outline:2px solid var(--da-teal);outline-offset:2px}
.dflv-evb-caltext{font-size:.8rem;color:var(--da-ink-3);margin-top:12px;margin-bottom:0}
.dflv-evb-caltext a{color:var(--da-teal-ink);font-weight:600}
.dflv-evb-caltext a:hover{text-decoration:underline}
.dflv-evb-map{margin-top:8px;border:1px solid var(--da-line);border-radius:12px;overflow:hidden}
.dflv-evb-map iframe{display:block;width:100%;height:220px;border:0}

/* weather card verdict */
.dflv-art-win-verdict{margin-top:6px;font-size:.78rem;font-weight:700;text-align:center;color:var(--da-ink-2)}
.dflv-art-win-verdict.is-safe,.dflv-art-win-verdict.is-ok{color:var(--da-teal-ink)}
.dflv-art-win-verdict.is-warm,.dflv-art-win-verdict.is-caution{color:var(--da-gold-ink)}
.dflv-art-win-verdict.is-high,.dflv-art-win-verdict.is-hot,.dflv-art-win-verdict.is-danger,.dflv-art-win-verdict.is-unsafe{color:var(--da-coral-ink)}

/* More Events row, below the box and rails' main column */
.dflv-evb-related{margin-top:34px}
.dflv-evb-more-h{font-size:1.25rem;margin:0 0 14px}
.dflv-evb-morerow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.dflv-evb-morecard{display:block;border:1px solid var(--da-line);border-radius:14px;overflow:hidden;background:#fff;min-width:0}
.dflv-evb-morecard:hover{border-color:var(--da-ink-3)}
.dflv-evb-morecard .img{height:100px;background-size:cover;background-position:center;background-color:var(--da-teal-soft)}
.dflv-evb-morecard .body{padding:12px 14px}
.dflv-evb-morecard .date{font-size:.7rem;font-weight:700;color:var(--da-coral-ink);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.dflv-evb-morecard h3{font-size:.92rem;line-height:1.25;margin:0 0 4px}
.dflv-evb-morecard .loc{font-size:.78rem;color:var(--da-ink-3)}

/* right rail only (900 to 1239px, or left rail switched off): box + one sticky rail */
@media (min-width:900px){
  body.dflv-ev-boxed .dflv-art-railgrid{grid-template-columns:minmax(0,720px) 300px;justify-content:center;gap:32px;align-items:stretch}
  body.dflv-ev-boxed:not(.dflv-art-2rail) .dflv-art--rail{max-width:1080px}
  body.dflv-ev-boxed .dflv-art-railgrid .dflv-art-rail{position:sticky;top:var(--dflv-rail-top,20px);align-self:start}
  body.dflv-ev-boxed .dflv-as-rail-slot{position:static;margin-top:0}
}
@media (min-width:1240px){
  body.dflv-ev-boxed.dflv-art-2rail .dflv-art-railgrid--2{grid-template-columns:300px minmax(0,720px) 300px;gap:20px;align-items:start}
}
@media (max-width:899px){
  body.dflv-ev-boxed .dflv-art-railgrid{display:block}
  body.dflv-ev-boxed .dflv-art-rail{display:none}
}
@media (min-width:1240px) and (max-width:1399px){
  body.dflv-art-2rail .dflv-evb-facts{grid-template-columns:1fr}
}
@media (max-width:760px){
  .dflv-evb-morerow{grid-template-columns:1fr}
}
@media (max-width:560px){
  .dflv-evb-facts{grid-template-columns:1fr}
  .dflv-evb-btn{flex:1 1 auto;justify-content:center}
  .dflv-evb-map iframe{height:200px}
}