/* web-blocks-v31.css
   v31 = v30 + EV email review v0.1, the three items that also change web:
     EV-12  The event eyebrow gets a style: UI face, micro size, bold tracked
            caps, in the new --nl-highlight (platform default: ink). Before
            v31 it had no rule and printed as plain body text.
     EV-14  The platform date chip is ink, not the beige issue-bar colour.
            White on #E4E0D4 was 1.3:1 for any title with no EV colours.
     EV-6   The date stack is even. The day numeral takes
            --nl-ev-chip-day-font (default: the UI face). Display faces
            place numerals too differently to stack evenly. Month, day and
            weekday get explicit line heights per density, the same numbers
            as email-ev-cards-v4. No other change.
   v30 = v29 + split headlines (FA and TS, photo left or right) use the
     title role: 23px desktop, 18px phone. At the hero size a headline
     wrapped to three or four lines in the half-width column. Centered FA
     and TS keep the hero size. A title can override with
     --nl-split-headline-size. No other change.
   v29 = v28 + EV fix: at 2 or 3 events the "Details" link now shows as the
     same right-edge chevron as 4+ events. In v27/v28 its word was hidden and
     no chevron was drawn, so the link was invisible. Also removes a stray
     selector fragment left by an earlier fold (no visual effect). No other change.
   INBXIFY · MNA web render stylesheet
   v28 = v27 + Design Port numbers v0.2 (Design-Port-Numbers-v0_2.md).
     July's type scale is the platform default, desktop and phone. Today's
     scale moves to the opt-in class ix-scale-quiet. Platform colours are
     neutral and carry no brand, INBXIFY's included. Renamed: --nl-teal ->
     --nl-ink, --nl-teal-deep -> --nl-ink-deep, --nl-gold -> --nl-accent.
     EV reads the palette. GR title and sign-off take the title role. Sizes
     that bypassed the roles now point at one. Jost adds 400 and 600.
   v27 = v6 + Session 5 honing pass. FA/TS design locked. Spectral added.
   Border-radius 6px platform-wide. FA centered photo 580px. TS franchise full-width.
   1..N events from one block; density comes from .nlw-ev--nN set by x_evCount,
   so a new arrangement is a CSS rule, not a build.
   v5 = v4 + the B1 fan-out (GR/BA/FA-split/TS/RE/TXA/spacer) + THE BRAND LIFT:
   every publisher-brand value that v4 carried as a literal (WLN gold bar,
   Playfair/Jost, signoff trim) now reads a --nl-* variable with a NEUTRAL
   platform default. The title's web shell sets the brand — bnm-wln/web-shell-v5
   sets WLN's values; a Renna shell will set Renna's. The shared stylesheet
   contains no publisher. (Font @import still loads all families; per-title
   font loading is a later optimization, logged.)
   ─────────────────────────────────────────────────────────────
   SELF-CONTAINED ON PURPOSE. Loads on the PUBLIC Newsletter Collection
   page where ix-tokens is NOT loaded. Every custom prop is defined here,
   on .ix-nl — never assume :root.
   TYPOGRAPHY IS ARMORED: every font-family carries !important (RTE lesson).
   AD FRAMES COLLAPSE BY DEFAULT (8/16): stored HTML never changes; the
   hydration script un-collapses a frame only when a sponsor resolves.
   LEGACY SEAM (D5): every selector scoped under .ix-nl. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,600;1,9..144,600&family=DM+Sans:wght@400;500;700&family=DM+Mono:wght@400;500&family=Playfair+Display:ital,wght@0,700;1,700&family=Spectral:ital,wght@0,400;0,600;1,400;1,600&family=Jost:wght@400;600;700&display=swap');

.ix-nl{
  /* Body copy scale — teaser, blurb, greeting body. One size platform-wide.
     Per-block tokens fall back to these, so blocks match unless deliberately
     overridden. */
  --nl-body-size: var(--nl-t-body);
  --nl-body-lh: 1.62;
  /* Deck / subhead scale — above body, well below headline. One size. */
  --nl-subhead-size: var(--nl-t-deck);
  --nl-subhead-lh: 1.5;
  /* Space between blocks. One value platform-wide; a block that needs a
     different rhythm overrides its own token rather than drifting. */
  --nl-block-gap: 52px;

  /* ── Type scale by ROLE, not by block ────────────────────────────
     Every piece of text in the newsletter belongs to one of these.
     Change a role and every block follows. Mobile values live in the
     @media block at the foot of this file. */
  /* Platform scale = July (~2.7:1 display over body). A title that wants
     quieter type adds the class ix-scale-quiet to its .ix-nl wrapper
     (see the foot of this file). WLN uses the platform scale. */
  --nl-t-hero:    40px;   /* FA / TS headline, issue title, TXA theme   */
  --nl-t-title:   23px;   /* section heads, EV/RE titles, GR, sign-off  */
  --nl-t-deck:    17px;   /* subhead                                    */
  --nl-t-lead:    17px;   /* tracked-caps lead, e.g. TXA business       */
  --nl-t-body:    15px;   /* teaser, blurb, greeting body, page base    */
  --nl-t-price:   17px;   /* RE price                                   */
  --nl-t-byline:  10px;   /* byline, agent line, sponsor line           */
  --nl-t-button:  10.5px; /* CTA and pill labels                        */
  --nl-t-label:   10px;   /* mono caps: rubric, meta, specs             */
  --nl-t-micro:    8.5px; /* chips and flags                            */
  --nl-t-numeral: 38px;   /* EV date chip day number                    */
  --nl-hero-lh:   1.08;
  --nl-label-ls:  2.6px;
  /* platform palette — neutral. No publisher and no INBXIFY brand.
     --nl-ink     the dark brand colour: headlines, links, dark cards
     --nl-accent  the accent: link underlines, rules, badges, EV button
     A title's shell sets both. --nl-text is body copy. */
  --nl-ink:#22201C;
  --nl-ink-deep:#0E0D0B;
  --nl-accent:#A89E8C;
  --nl-accent-ink:var(--nl-ink);
  --nl-ink-body:var(--nl-text-mid);
  --nl-ink-soft:var(--nl-text-mid);
  --nl-rule:var(--nl-border);
  --nl-card-bg:var(--nl-surface);
  --nl-radius:6px;
  /* small emphasis text, e.g. the EV eyebrow. A title's shell sets it. */
  --nl-highlight:var(--nl-ink);
  /* TXA meta line; eyebrow and theme accent fall back to it */
  --nl-txa-meta-color:var(--nl-text-mid);
  --nl-cream:#FAF9F5;
  --nl-cream-warm:#FDFCF8;
  --nl-text:#1E2A3A;
  --nl-text-mid:#5A6478;
  --nl-text-light:#8A8E9A;
  --nl-border:#E4E0D4;
  --nl-border-soft:#EEE9DC;
  --nl-surface:#FFFFFF;

  /* type — NEUTRAL platform defaults; the title shell sets the brand.
     (v4 hardcoded Fraunces here; Fraunces is WLN's, so it moved to the shell.) */
  --nl-font-display:Georgia,'Times New Roman',serif;
  --nl-font-body:'DM Sans',system-ui,sans-serif;
  --nl-font-mono:'DM Mono',ui-monospace,monospace;
  --nl-font-ui:var(--nl-font-body);

  /* brand-carrying furniture — neutral defaults, shell-set per title */
  --nl-bar-bg:var(--nl-border);
  --nl-bar-ink:var(--nl-text);
  --nl-bar-font:var(--nl-font-display);
  --nl-bar-label-font:var(--nl-font-mono);
  --nl-signoff-border:var(--nl-accent);
  --nl-signoff-ink:#444444;
  --nl-signoff-font:var(--nl-font-display);

  /* inverted (dark) card — GR and any future dark block */
  --nl-inv-bg:var(--nl-ink);
  --nl-inv-ink:#F2E9D8;
  --nl-inv-ink-soft:#DCE5E2;
  --nl-inv-rule:color-mix(in srgb, var(--nl-accent) 55%, transparent);

  display:block;
  max-width:680px;
  margin:0 auto;
  padding:18px 20px 36px;
  background:#FAF9F5;
  border-radius:6px;
  font-family:var(--nl-font-body) !important;
  font-size:var(--nl-t-body);
  line-height:1.6;
  color:var(--nl-text);
  -webkit-text-size-adjust:100%;
}
.ix-nl *,.ix-nl *::before,.ix-nl *::after{box-sizing:border-box;}
.ix-nl img{max-width:100%;height:auto;display:block;}
.ix-nl a{color:var(--nl-ink);text-decoration:underline;text-decoration-color:var(--nl-accent);text-underline-offset:2px;}
.ix-nl a:hover{color:var(--nl-ink-deep);}

/* ── FA block ─────────────────────────────────────────────── */
/* Article surround. A fill groups the headline, photo and teaser without
   the hard edge a border gives — borders stay reserved for discrete units
   (events, businesses, listings, ads). Transparent by default. */
.ix-nl .nlw-fa{
  margin: 0 0 var(--nl-sp-fa, var(--nl-block-gap));
  background: var(--nl-article-bg, transparent);
  padding: var(--nl-article-pad, 0px);
  border-radius: var(--nl-article-radius, 6px);
}

.ix-nl .nlw-franchise{margin:16px 0 36px;}
.ix-nl .nlw-fa--split .nlw-franchise,.ix-nl .nlw-ts--split .nlw-franchise{margin:0 0 24px;}
.ix-nl .nlw-rubric{margin-bottom:10px;}
.ix-nl .nlw-ts .nlw-franchise{margin:0 0 14px;}
.ix-nl .nlw-ts .nlw-franchise img{width:auto;max-width:100%;max-height:none;margin:0;border-radius:0;display:block;}
.ix-nl .nlw-franchise img{display:block;margin-left:auto;margin-right:auto;max-height:55px;width:auto;}
/* Per-block franchise art sizing */
.ix-nl .nlw-fa .nlw-franchise img{max-height:var(--nl-franchise-h, 45px);}
.ix-nl .nlw-fa--split .nlw-franchise img{max-height:var(--nl-franchise-h, 40px);margin-left:0;margin-right:0;}
.ix-nl .nlw-ts .nlw-franchise img{max-height:var(--nl-ts-franchise-h, var(--nl-franchise-h, 80px));}

.ix-nl .nlw-rubric{
  font-family:var(--nl-font-mono) !important;
  font-size: var(--nl-t-label);letter-spacing:2.2px;text-transform:uppercase;
  color:var(--nl-ink);font-weight:500;text-align:center;margin:0 0 8px;
}

.ix-nl .nlw-headline{
  font-family:var(--nl-font-display) !important;
  font-size: var(--nl-t-hero);line-height:1.36;font-weight:600;
  color:var(--nl-ink);text-align:center;margin:48px 0 20px;
}
.ix-nl .nlw-subhead{
  font-family:var(--nl-font-body) !important;
  font-size:var(--nl-subhead-size);line-height:var(--nl-subhead-lh, 1.5);color:var(--nl-text-mid);
  text-align:center;margin:0 0 18px;
}

/* byline — fresh-sheet anatomy: name [, title] / business line 2 */
.ix-nl .nlw-byline{
  text-align:center;margin:0 0 18px;
  font-size:var(--nl-t-byline);color:var(--nl-text-mid);
}
.ix-nl .nlw-byline .nlw-by-name{font-weight:700;color:var(--nl-text);}
.ix-nl .nlw-byline .nlw-by-biz{
  display:block;margin-top:2px;
  font-family:var(--nl-font-mono) !important;
  font-size:var(--nl-t-label);letter-spacing:1.2px;text-transform:uppercase;
  color:var(--nl-text-light);
}

.ix-nl .nlw-photo{margin:0 0 6px;}
.ix-nl .nlw-photo img{width:100%;border-radius:6px;}
/* FA centered: photo 580px max, centered; credit and teaser align to it */
.ix-nl .nlw-fa:not(.nlw-fa--split) .nlw-photo img{max-width:580px;display:block;margin-left:auto;margin-right:auto;}
.ix-nl .nlw-fa:not(.nlw-fa--split) .nlw-photo-credit{max-width:580px;margin-left:auto;margin-right:auto;text-align:right;}
.ix-nl .nlw-fa:not(.nlw-fa--split) .nlw-teaser{max-width:580px;margin-left:auto;margin-right:auto;}

.ix-nl .nlw-photo-credit{
  font-size:var(--nl-t-label);color:var(--nl-text-light);text-align:right;margin:4px 0 18px;
}

.ix-nl .nlw-teaser{margin:0 0 18px;}
.ix-nl .nlw-teaser p{margin:0 0 14px;}

/* paid receipt badge — frozen with the issue */
.ix-nl .nlw-paid{
  display:inline-block;background:var(--nl-accent);color:#FFFFFF;
  font-family:var(--nl-font-mono) !important;
  font-size:var(--nl-t-micro);letter-spacing:1.6px;font-weight:500;
  padding:3px 10px;border-radius:6px;margin:0 0 10px;
}

.ix-nl .nlw-cta{text-align:center;margin:6px 0 0;}
.ix-nl .nlw-cta a{
  display:inline-block;background:var(--nl-ink);color:#FFFFFF;
  font-family:var(--nl-font-body) !important;
  font-weight:700;font-size:var(--nl-t-button);text-decoration:none;
  padding:12px 26px;border-radius:6px;
}
.ix-nl .nlw-cta a:hover{background:var(--nl-ink-deep);color:#FFFFFF;}

/* ── payor's baked ad — the receipt, frozen with the issue ── */
.ix-nl .nlw-paidad{
  margin:26px 0 0;padding:18px 0 0;
  border-top:1px solid var(--nl-border-soft);
}
.ix-nl .nlw-paidad-label{
  font-family:var(--nl-font-mono) !important;
  font-size:var(--nl-t-micro);letter-spacing:1.8px;text-transform:uppercase;
  color:var(--nl-text-light);text-align:center;margin:0 0 10px;
}
.ix-nl .nlw-paidad a{display:block;text-decoration:none;}
.ix-nl .nlw-paidad img{margin:0 auto;border-radius:6px;}

/* ── sponsor / ad frames — collapsed until hydrated ───────── */
.ix-nl [data-ix-ad-frame]{display:none;}
.ix-nl [data-ix-ad-frame].ix-hydrated{display:block;margin:22px 0 0;}
.ix-nl [data-ix-ad-frame].ix-hydrated .nlw-sponsor-line{
  font-size:var(--nl-t-byline);color:var(--nl-text-mid);text-align:center;margin:0 0 8px;
}
.ix-nl [data-ix-ad-frame].ix-hydrated .nlw-sponsor-line b{color:var(--nl-text);}
.ix-nl [data-ix-ad-frame].ix-hydrated img{margin:0 auto;border-radius:6px;}

/* ── divider ──────────────────────────────────────────────── */
.ix-nl .nlw-divider{
  border: 0;
  border-top: var(--nl-divider-w, 2px) var(--nl-divider-style, solid) var(--nl-divider-color, var(--nl-border));
  width: var(--nl-divider-width, 100%);
  margin: var(--nl-divider-mt, 0px) auto var(--nl-sp-div, 60px);
}

/* ── shell furniture: issue bar + sign-off — brand via variables ── */
.ix-nl .nlw-issuebar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--nl-bar-bg);border-radius:6px;padding:18px 18px;margin:0 0 26px;
}
.ix-nl .nlw-issuebar .nlw-ib-side{flex:0 0 auto;text-align:left;}
.ix-nl .nlw-issuebar .nlw-ib-side--right{text-align:right;}
.ix-nl .nlw-issuebar .nlw-ib-label{
  font-family:var(--nl-bar-label-font) !important;
  font-size:var(--nl-t-label);font-weight:700;letter-spacing:1.5px;color:var(--nl-bar-ink);opacity:.6;display:block;
}
.ix-nl .nlw-issuebar .nlw-ib-big{
  font-family:var(--nl-bar-font) !important;
  font-size:var(--nl-t-title);font-weight:700;color:var(--nl-bar-ink);line-height:1.1;display:block;
}
.ix-nl .nlw-issuebar .nlw-ib-title{
  flex:1 1 auto;text-align:center;margin:0;
  font-family:var(--nl-bar-font) !important;
  font-size: var(--nl-t-hero);font-weight:700;font-style:italic;
  color:var(--nl-bar-ink);line-height:1.2;
}
@media (max-width:480px){
  .ix-nl .nlw-issuebar{flex-wrap:wrap;justify-content:center;text-align:center;}
  .ix-nl .nlw-issuebar .nlw-ib-side,.ix-nl .nlw-issuebar .nlw-ib-side--right{text-align:center;}
}

.ix-nl .nlw-signoff{
  background:var(--nl-surface);border:2px solid var(--nl-signoff-border);border-radius:6px;
  padding:28px 20px;text-align:center;margin:6px 0 10px;
}
.ix-nl .nlw-signoff p{
  margin:0;font-family:var(--nl-signoff-font) !important;
  font-size: var(--nl-t-title);font-style:italic;line-height:1.45;color:var(--nl-signoff-ink);
}

/* ═══════════ v5 · B1 fan-out blocks (approved mockup v0_1) ═══════════ */

/* ── GR · publisher welcome — inverted card ── */
.ix-nl .nlw-gr{background:var(--nl-inv-bg);border-radius:var(--nl-gr-radius, 6px);padding:var(--nl-gr-pad, 26px 26px 24px);margin:0 0 var(--nl-gr-mb, var(--nl-block-gap));}
.ix-nl .nlw-gr-title{font-family:var(--nl-font-display) !important;font-style:italic;font-size: var(--nl-t-title);font-weight:600;color:var(--nl-inv-ink);margin:0 0 12px;}
.ix-nl .nlw-gr-rule{border:0;border-top:1px solid var(--nl-inv-rule);margin:0 0 14px;width:64px;}
.ix-nl .nlw-gr-body{color:var(--nl-inv-ink-soft);font-size:var(--nl-gr-body-size, var(--nl-body-size));}
.ix-nl .nlw-gr-body p{margin:0 0 12px;}
.ix-nl .nlw-gr-body p:last-child{margin-bottom:0;}

/* ── BA · banner — matted, labelled, whole card linked ──────────────────
   An unsold slot renders nothing: no mat, no label, no gap (D10).

   Consecutive BA blocks are wrapped by the Worker in .nlw-ba-group so a run
   of ads reads as one deliberate section rather than three singles that
   happen to be adjacent. Inside a group the individual mats stand down —
   the group carries the frame, the label appears once. */

.ix-nl .nlw-ba{
  margin: var(--nl-ba-mt, 0px) 0 var(--nl-ba-mb, var(--nl-block-gap));
}

.ix-nl .nlw-ba-label{
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-ba-label-size, var(--nl-t-label));
  letter-spacing: var(--nl-ba-label-ls, 1.8px);
  text-transform: uppercase;
  color: var(--nl-ba-label-color, var(--nl-text-light));
  text-align: var(--nl-ba-label-align, center);
  margin: 0 0 var(--nl-ba-label-mb, 8px);
}

.ix-nl .nlw-ba a{
  display: block;
  background: var(--nl-ba-mat, var(--nl-surface));
  border: var(--nl-ba-border-w, 1px) solid var(--nl-ba-border, var(--nl-border));
  border-radius: var(--nl-ba-radius, 6px);
  padding: var(--nl-ba-pad, 10px);
  text-decoration: none;
}
.ix-nl .nlw-ba a:hover{ border-color: var(--nl-ba-border-hover, var(--nl-accent)); }

.ix-nl .nlw-ba img{
  display: block;
  width: 100%;
  margin: 0 auto;
  border-radius: var(--nl-ba-img-radius, 6px);
}

/* ── BA group — two or more consecutive slots ── */
.ix-nl .nlw-ba-group{
  background: var(--nl-ba-group-bg, var(--nl-cream, #F5F1E8));
  border: var(--nl-ba-group-border-w, 1px) solid var(--nl-ba-group-border, var(--nl-border));
  border-radius: var(--nl-ba-group-radius, 6px);
  padding: var(--nl-ba-group-pad-v, 18px) var(--nl-ba-group-pad-h, 16px);
  margin: var(--nl-ba-group-mt, 0px) 0 var(--nl-ba-group-mb, var(--nl-block-gap));
}

/* One label for the whole run, not one per ad */
.ix-nl .nlw-ba-group .nlw-ba-label{ display: none; }
.ix-nl .nlw-ba-group-label{
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-ba-group-label-size, var(--nl-t-label));
  letter-spacing: var(--nl-ba-label-ls, 1.8px);
  text-transform: uppercase;
  color: var(--nl-ba-group-label-color, var(--nl-text-light));
  text-align: var(--nl-ba-label-align, center);
  margin: 0 0 var(--nl-ba-group-label-mb, 0px);
}

/* Inside a group the mats stand down — the group is the frame */
.ix-nl .nlw-ba-group .nlw-ba{ margin: 0 0 var(--nl-ba-group-gap, 12px); }
.ix-nl .nlw-ba-group .nlw-ba:last-child{ margin-bottom: 0; }
.ix-nl .nlw-ba-group .nlw-ba a{
  background: var(--nl-ba-group-mat, transparent);
  border-color: var(--nl-ba-group-inner-border, transparent);
  padding: var(--nl-ba-group-inner-pad, 13px);
}

/* ── FA split variants ── */
.ix-nl .nlw-fa--split .nlw-fa-cols{display:flex;gap:22px;align-items:stretch;flex-wrap:wrap;}
.ix-nl .nlw-fa--split .nlw-fa-media{flex:0 0 calc(50% - 11px);}
.ix-nl .nlw-fa--split .nlw-fa-copy{flex:0 0 calc(50% - 11px);display:flex;flex-direction:column;justify-content:center;}
.ix-nl .nlw-fa--split .nlw-fa-media img{width:100%;border-radius:6px;}
/* Split photo: 1:1 square, cover crop, no distortion */
.ix-nl .nlw-fa--split .nlw-photo--sq,
.ix-nl .nlw-ts--split .nlw-photo--sq{aspect-ratio:1/1;overflow:hidden;border-radius:6px;}
.ix-nl .nlw-fa--split .nlw-photo--sq img,
.ix-nl .nlw-ts--split .nlw-photo--sq img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:0;}

.ix-nl .nlw-fa--photoleft .nlw-fa-cols{flex-direction:row;}
.ix-nl .nlw-fa--photoright .nlw-fa-cols{flex-direction:row-reverse;}
.ix-nl .nlw-fa--split .nlw-headline,
.ix-nl .nlw-fa--split .nlw-subhead,
.ix-nl .nlw-fa--split .nlw-byline,
.ix-nl .nlw-fa--split .nlw-cta{text-align:left;}
.ix-nl .nlw-fa--split .nlw-headline{font-size: var(--nl-t-hero);line-height:1.32;margin-top:0;}
.ix-nl .nlw-fa--split .nlw-rubric{text-align:left;}
@media (max-width:560px){
  .ix-nl .nlw-fa--split .nlw-fa-cols{flex-direction:column;}
  .ix-nl .nlw-fa--split .nlw-fa-media{flex-basis:auto;width:100%;}
}


/* ── TS · teaser story — the FA anatomy at digest scale ── */

.ix-nl .nlw-ts{
  margin: 0 0 var(--nl-sp-ts, var(--nl-block-gap));
  background: var(--nl-article-bg, transparent);
  padding: var(--nl-article-pad, 0px);
  border-radius: var(--nl-article-radius, 6px);
}
.ix-nl .nlw-ts .nlw-headline{font-size: var(--nl-t-hero);line-height:1.32;}
.ix-nl .nlw-ts .nlw-subhead{font-size:var(--nl-ts-subhead-size, var(--nl-subhead-size));line-height:var(--nl-subhead-lh, 1.5);margin-bottom:18px;}
.ix-nl .nlw-ts .nlw-teaser{font-size:var(--nl-ts-teaser-size, var(--nl-body-size));}
.ix-nl .nlw-ts .nlw-cta a{font-size:var(--nl-t-button);padding:10px 20px;}
.ix-nl .nlw-ts--split .nlw-ts-cols{display:flex;gap:18px;align-items:stretch;flex-wrap:wrap;}
.ix-nl .nlw-ts--split .nlw-ts-media{flex:0 0 calc(50% - 9px);}
/* Split below — teaser and CTA run full width under the photo+headline columns */
.ix-nl .nlw-fa--split .nlw-split-below,
.ix-nl .nlw-ts--split .nlw-split-below{flex:0 0 100%;margin-top:16px;}
.ix-nl .nlw-fa--split .nlw-cta,
.ix-nl .nlw-ts--split .nlw-cta{text-align:left;}

.ix-nl .nlw-ts--split .nlw-ts-copy{flex:0 0 calc(50% - 9px);display:flex;flex-direction:column;justify-content:center;}
.ix-nl .nlw-ts--split .nlw-ts-media img{width:100%;border-radius:6px;}
.ix-nl .nlw-ts--photoleft .nlw-ts-cols{flex-direction:row;}
.ix-nl .nlw-ts--photoright .nlw-ts-cols{flex-direction:row-reverse;}
.ix-nl .nlw-ts--split .nlw-headline,
.ix-nl .nlw-ts--split .nlw-subhead,
.ix-nl .nlw-ts--split .nlw-byline,
.ix-nl .nlw-ts--split .nlw-rubric,
.ix-nl .nlw-ts--split .nlw-cta{text-align:left;}
@media (max-width:560px){
  .ix-nl .nlw-ts--split .nlw-ts-cols{flex-direction:column;}
  .ix-nl .nlw-ts--split .nlw-ts-media{flex-basis:auto;width:100%;}
}

/* ── RE · listing card ── */
/* ── RE · Local Real Estate — editorial list ──────────────────────────
   No panel and no masthead art by default: a heading and a rule do the same
   job in a fraction of the height. Holds four to eight listings without
   getting long, and never competes with the blocks above or below.

   The section is sponsorable. The sponsor slot lives in the heading and
   collapses to nothing when unsold (D10) — no reserved space, no empty
   frame. Label copy is FTC-conforming per D12; "Presented by" alone is not
   sufficient on a natively styled unit, so the slot carries a Sponsored
   eyebrow as well. */

.ix-nl .nlw-re-block{
  background: var(--nl-re-bg, transparent);
  padding: var(--nl-re-block-pad, 0px);
  border-radius: var(--nl-re-block-radius, 0px);
  margin: 0 0 var(--nl-re-block-mb, var(--nl-block-gap));
}

/* Optional masthead art. Off by default in this treatment — set
   --nl-re-art-display:block in the shell to bring it back. */
.ix-nl .nlw-re-block .nlw-franchise{
  display: var(--nl-re-art-display, none);
  margin: 0 0 var(--nl-re-art-mb, 16px);
}
.ix-nl .nlw-re-block .nlw-franchise img{
  display: block; width: 100%; max-width: none;
  max-height: var(--nl-re-art-h, 120px); object-fit: cover; border-radius: 0;
}

/* ── Heading ── */
.ix-nl .nlw-re-head{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  border-bottom: var(--nl-re-rule-w, 2px) solid var(--nl-re-rule-color, var(--nl-ink));
  padding-bottom: var(--nl-re-head-pad, 8px);
  margin: 0 0 var(--nl-re-head-mb, 4px);
}
.ix-nl .nlw-re-title{
  font-family: var(--nl-font-display) !important;
  font-size: var(--nl-re-title-size, var(--nl-t-title));
  font-weight: 600;
  line-height: 1;
  color: var(--nl-re-title-color, var(--nl-ink));
  margin: 0;
}
.ix-nl .nlw-re-count{
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-re-count-size, var(--nl-t-label));
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nl-re-count-color, var(--nl-text-light));
  white-space: nowrap;
}

/* ── Sponsor slot — collapses entirely when unsold ── */
.ix-nl .nlw-re-sponsor{
  display: flex;
  align-items: center;
  gap: var(--nl-re-sponsor-gap, 7px);
  text-decoration: none;
}
.ix-nl .nlw-re-sponsor-label{
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-re-sponsor-label-size, var(--nl-t-micro));
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--nl-re-sponsor-label-color, var(--nl-text-light));
  text-align: right;
  line-height: 1.35;
}
.ix-nl .nlw-re-sponsor-label b{
  display: block;
  font-weight: 700;
  font-size: var(--nl-re-sponsor-name-size, var(--nl-t-label));
  letter-spacing: 0.06em;
  color: var(--nl-re-sponsor-name-color, var(--nl-text));
}
.ix-nl .nlw-re-sponsor img{
  display: block;
  height: var(--nl-re-sponsor-logo-h, 36px);
  width: auto;
  border-radius: var(--nl-re-sponsor-logo-radius, 2px);
}

/* ── Listing row ── */
.ix-nl .nlw-re{
  display: flex;
  align-items: center;
  gap: var(--nl-re-row-gap, 16px);
  padding: var(--nl-re-row-pad, 20px) 0;
  border-bottom: 1px solid var(--nl-re-divider, var(--nl-border));
  background: none;
  border-radius: 0;
  margin: 0;
}
.ix-nl .nlw-re:last-child{ border-bottom: 0; }

.ix-nl .nlw-re-photo{ flex: 0 0 var(--nl-re-thumb-w, 90px); position: relative; }
.ix-nl .nlw-re-photo img{
  display: block;
  width: var(--nl-re-thumb-w, 90px);
  height: var(--nl-re-thumb-h, 58px);
  object-fit: cover;
  border-radius: var(--nl-re-thumb-radius, 3px);
}

.ix-nl .nlw-re-body{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
  display: block;
}

.ix-nl .nlw-re-topline{
  display: flex;
  align-items: center;
  gap: var(--nl-re-flag-gap, 9px);
  margin: 0 0 var(--nl-re-addr-mb, 3px);
}

.ix-nl .nlw-re-address{
  font-family: var(--nl-font-display) !important;
  font-size: var(--nl-re-addr-size, var(--nl-t-title));
  font-weight: 600;
  line-height: 1.2;
  color: var(--nl-re-addr-color, var(--nl-ink));
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Flag is an outline chip here — a filled block is too loud in a list */
.ix-nl .nlw-re-flag{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-re-flag-size, var(--nl-t-micro));
  font-weight: 700;
  letter-spacing: var(--nl-re-flag-ls, 1px);
  text-transform: uppercase;
  color: var(--nl-re-flag-ink, #5F8C4B);
  background: var(--nl-re-flag-bg, transparent);
  border: 1px solid var(--nl-re-flag-border, #B9CFA9);
  padding: var(--nl-re-flag-pad-v, 3px) var(--nl-re-flag-pad-h, 6px);
  border-radius: var(--nl-re-flag-radius, 2px);
  white-space: nowrap;
  position: static;
}

.ix-nl .nlw-re-specs{
  display: block;
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-re-specs-size, var(--nl-t-label));
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--nl-re-specs-color, var(--nl-text-light));
  border: 0;
  padding: 0;
  margin: 0;
}

.ix-nl .nlw-re-price{
  font-family: var(--nl-font-display) !important;
  font-size: var(--nl-re-price-size, var(--nl-t-price));
  font-weight: 600;
  line-height: 1;
  color: var(--nl-re-price-color, var(--nl-ink));
  white-space: nowrap;
  margin: 0;
  flex: 0 0 auto;
}

.ix-nl .nlw-re-agent{
  font-size: var(--nl-re-agent-size, var(--nl-t-byline));
  color: var(--nl-re-agent-color, var(--nl-text-light));
  margin: 3px 0 0;
}

/* ── Sponsor banner — the payer's creative, at the foot of the section.
   Frozen receipt (D12): the ad as bought, not a live lookup. Collapses
   entirely when the section is unsold. The heading credit and this banner
   are one purchase; a section never carries one without the other. */
.ix-nl .nlw-re-sponsorad{
  display: block;
  margin: var(--nl-re-sponsorad-mt, 18px) 0 0;
  padding: var(--nl-re-sponsorad-pad, 10px);
  background: var(--nl-re-sponsorad-mat, var(--nl-surface, #ffffff));
  border: 1px solid var(--nl-re-sponsorad-border, var(--nl-border));
  border-radius: var(--nl-re-sponsorad-radius, 6px);
  text-decoration: none;
}
.ix-nl .nlw-re-sponsorad img{
  display: block;
  width: 100%;
  border-radius: var(--nl-re-sponsorad-img-radius, 4px);
}
.ix-nl .nlw-re-sponsorad-label{
  display: block;
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-re-sponsorad-label-size, var(--nl-t-micro));
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nl-re-sponsorad-label-color, var(--nl-text-light));
  text-align: var(--nl-re-sponsorad-label-align, center);
  margin: 0 0 var(--nl-re-sponsorad-label-mb, 7px);
}

/* Exclusive showcase: every listing came from the payer, so the section
   needs a plainer disclosure than the heading credit alone. */
/* Exclusive showcase: every agent line would read the same, so suppress it. */
.ix-nl .nlw-re--exclusive .nlw-re-agent{ display: none; }

.ix-nl .nlw-re-exclusive{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-re-exclusive-size, var(--nl-t-body));
  line-height: 1.45;
  color: var(--nl-re-exclusive-color, var(--nl-text-light));
  background: var(--nl-re-exclusive-bg, transparent);
  padding: var(--nl-re-exclusive-pad, 0px);
  margin: var(--nl-re-exclusive-mt, 10px) 0 0;
}

@media (max-width:480px){
  .ix-nl .nlw-re{ flex-wrap: wrap; }
  .ix-nl .nlw-re-price{ flex-basis: 100%; margin-top: 4px; }
  .ix-nl .nlw-re-head{ flex-direction: column; align-items: flex-start; gap: 8px; }
}

.ix-nl .nlw-re-agent img{width:44px;height:44px;border-radius:6px;object-fit:contain;background:var(--nl-cream);}
.ix-nl .nlw-re-agent b{color:var(--nl-text);}
.ix-nl .nlw-re-agent .nlw-re-brokerage{display:block;font-family:var(--nl-font-mono) !important;font-size:var(--nl-t-label);letter-spacing:1.2px;text-transform:uppercase;color:var(--nl-text-light);}
.ix-nl .nlw-re .nlw-cta{text-align:left;}

/* ── TXA · The Find — framed theme, open cards ────────────────────────
   The frame does the grouping: one container holds the masthead, the theme
   plate and every customer, so "these belong together" is stated once
   instead of once per card.

   Cards inside carry no border and no logo box. What makes them read as
   contents of the frame rather than items on the sheet is the side padding
   they sit inside, and a hairline between each.

   The theme plate is white on the frame's warm fill with air on all four
   sides and a shadow, so it sits on a different plane from everything else
   in the block. It is the only white object here, which is what makes it
   read as the one important thing. It does not overlap the masthead. */

.ix-nl .nlw-txa{
  background: var(--nl-txa-frame-bg, var(--nl-cream, #F3EFE7));
  border: 1px solid var(--nl-txa-frame-border, var(--nl-border));
  border-radius: var(--nl-txa-frame-radius, 6px);
  padding: 0 var(--nl-txa-frame-pad, 34px) var(--nl-txa-frame-pad-b, 26px);
  margin: 0 0 var(--nl-txa-mb, var(--nl-block-gap));
  overflow: hidden;
}

/* Masthead runs edge to edge by pulling against the frame padding. */
.ix-nl .nlw-txa .nlw-franchise{
  margin: 0 calc(-1 * var(--nl-txa-frame-pad, 34px)) 0;
  text-align: center;
}
.ix-nl .nlw-txa .nlw-franchise img{
  display: block; width: 100%; max-width: none;
  max-height: var(--nl-txa-art-h, 180px);
  object-fit: cover; border-radius: 0; margin: 0;
}

/* ── Theme plate ── */
.ix-nl .nlw-txa-plate{
  background: var(--nl-txa-plate-bg, #ffffff);
  border: 1px solid var(--nl-txa-plate-border, #E4DACA);
  border-radius: var(--nl-txa-plate-radius, 4px);
  box-shadow: var(--nl-txa-plate-shadow, 0 8px 26px rgba(0,0,0,.12));
  margin: var(--nl-txa-plate-mt, 26px) 0 var(--nl-txa-plate-mb, 24px);
  padding: var(--nl-txa-plate-pad-v, 26px) var(--nl-txa-plate-pad-h, 28px) var(--nl-txa-plate-pad-b, 22px);
  text-align: center;
}
.ix-nl .nlw-txa-eyebrow{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-txa-eyebrow-size, var(--nl-t-micro));
  font-weight: 600;
  letter-spacing: var(--nl-txa-eyebrow-ls, 3px);
  text-transform: uppercase;
  color: var(--nl-txa-eyebrow-color, var(--nl-txa-meta-color));
  margin: 0;
}
.ix-nl .nlw-txa-kicker{
  font-family: var(--nl-font-display) !important;
  font-size: var(--nl-txa-kicker-size, var(--nl-t-hero));
  font-weight: 700;
  font-style: normal;
  line-height: 1.05;
  color: var(--nl-txa-kicker-color, var(--nl-ink));
  text-align: center;
  margin: var(--nl-txa-kicker-mt, 6px) 0 0;
}
/* the accent word inside the theme carries the one italic in the plate */
.ix-nl .nlw-txa-kicker em{
  font-style: italic;
  font-weight: 600;
  color: var(--nl-txa-kicker-accent, var(--nl-txa-meta-color));
}
.ix-nl .nlw-txa-count{
  display: flex; align-items: center; justify-content: center;
  gap: var(--nl-txa-count-gap, 10px);
  margin: var(--nl-txa-count-mt, 12px) 0 0;
}
.ix-nl .nlw-txa-count span{ flex: 1; height: 1px; background: var(--nl-txa-count-rule, var(--nl-border)); }
.ix-nl .nlw-txa-count i{
  font-family: var(--nl-font-ui) !important;
  font-style: normal; white-space: nowrap;
  font-size: var(--nl-txa-count-size, var(--nl-t-micro));
  font-weight: 600;
  letter-spacing: var(--nl-txa-count-ls, 2.6px);
  text-transform: uppercase;
  color: var(--nl-txa-count-color, var(--nl-text-light));
}

/* ── Cards: open, hairline separated ── */
.ix-nl .nlw-txa-card{
  background: none; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--nl-txa-divider, #DED7C7);
  padding: var(--nl-txa-card-pad, 20px) 0;
  margin: 0;
  position: static;
}
.ix-nl .nlw-txa-card:last-child{ border-bottom: 0; padding-bottom: 0; }

.ix-nl .nlw-txa-head{
  display: flex; gap: var(--nl-txa-card-gap, 16px);
  align-items: center; margin: 0 0 var(--nl-txa-head-mb, 12px);
}
.ix-nl .nlw-txa-logo{ flex: 0 0 auto; }
.ix-nl .nlw-txa-logo img{
  display: block;
  width: var(--nl-txa-logo-size, 52px);
  height: var(--nl-txa-logo-size, 52px);
  object-fit: contain;
  background: none; border: 0; padding: 0;
  border-radius: var(--nl-txa-logo-radius, 0px);
}
.ix-nl .nlw-txa-copy{ flex: 1 1 auto; min-width: 0; }

.ix-nl .nlw-txa-name{
  font-family: var(--nl-txa-name-font, var(--nl-font-display)) !important;
  font-size: var(--nl-txa-name-size, var(--nl-t-title));
  font-style: var(--nl-txa-name-style, italic);
  font-weight: var(--nl-txa-name-weight, 600);
  line-height: 1.15;
  color: var(--nl-txa-name-color, #2C3A4A);
  margin: 0 0 var(--nl-txa-name-mb, 3px);
}
.ix-nl .nlw-txa-meta{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-txa-meta-size, var(--nl-t-lead));
  letter-spacing: var(--nl-txa-meta-ls, 2.6px);
  text-transform: uppercase;
  color: var(--nl-txa-meta-color, var(--nl-text-mid));
  margin: 0;
}
.ix-nl .nlw-txa-blurb{
  font-family: var(--nl-font-body) !important;
  font-size: var(--nl-txa-blurb-size, var(--nl-t-body));
  line-height: var(--nl-txa-blurb-lh, var(--nl-body-lh));
  color: var(--nl-txa-blurb-color, #1E2A36);
  margin: 0 0 var(--nl-txa-blurb-mb, 11px);
}
.ix-nl .nlw-txa-detail{
  font-family: var(--nl-font-mono) !important;
  font-size: var(--nl-txa-detail-size, var(--nl-t-label));
  letter-spacing: 1px;
  color: var(--nl-txa-detail-color, var(--nl-text-light));
  margin: 0 0 var(--nl-txa-detail-mb, 10px);
}

/* No card means no corner to park a circle in — the CTA is a link. */
.ix-nl .nlw-txa-card .nlw-txa-visit{
  position: static;
  display: inline-block;
  width: auto; height: auto;
  background: none; border-radius: 0;
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-txa-visit-size, var(--nl-t-button));
  font-weight: 700;
  letter-spacing: var(--nl-txa-visit-ls, 2.4px);
  text-transform: uppercase;
  color: var(--nl-txa-visit-color, var(--nl-ink));
  text-decoration: none;
  border-bottom: 2px solid var(--nl-txa-visit-rule, var(--nl-accent));
  padding: 0 0 3px;
}
.ix-nl .nlw-txa-card .nlw-txa-visit::after{ content: "\00A0\2192"; font-size: inherit; }

@media (max-width:560px){
  .ix-nl .nlw-txa{ padding-left: 16px; padding-right: 16px; }
  .ix-nl .nlw-txa .nlw-franchise{ margin-left: -16px; margin-right: -16px; }
  .ix-nl .nlw-txa-plate{ padding-left: 18px; padding-right: 18px; }
  .ix-nl .nlw-txa-head{ gap: 12px; }
}


/* ── spacer ── */
/* Spacer — vertical air with no rule. The per-issue escape hatch when two
   blocks need more room than the platform gap gives them. If the same
   spacer keeps appearing in the same place, the block gap is wrong. */
.ix-nl .nlw-spacer{
  height: var(--nl-spacer-h, 68px);
  margin: 0;
}

/* ═══════════ v6 · EV · Events Display Engine ═══════════ */
/* One block renders 1..N events. .nlw-ev--nN comes from x_evCount.        */
/* 1-3 = cards. 4+ = compact rows: photo and teaser drop, chip narrows.    */
/* Adding an arrangement means adding a rule here, not a template.         */

/* Brand-at-shell per D17: every value here is a --nl-* variable with a */
/* neutral platform default. No publisher appears in this file. */

.ix-nl .nlw-ev{
  padding: var(--nl-block-pad, 28px) var(--nl-gutter, 24px);
  background: var(--nl-ev-bg, var(--nl-surface, #ffffff));
  margin: 0 0 var(--nl-ev-mb, var(--nl-block-gap));
}

/* EV masthead art — height is title-level, set in the shell.
   Art URL itself comes from TITLES-ADMIN via the render context. */
.ix-nl .nlw-ev .nlw-franchise{text-align:center;margin:0 0 16px;}
.ix-nl .nlw-ev .nlw-franchise img{
  display:block;margin:0 auto;width:auto;max-width:100%;
  max-height:var(--nl-ev-franchise-h, 120px);
}

.ix-nl .nlw-ev-art{
  margin: 0 0 18px;
}
.ix-nl .nlw-ev-art img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--nl-radius) var(--nl-radius) 0 0;
}

.ix-nl .nlw-ev-heading{
  font-family: var(--nl-font-display, Georgia, serif) !important;
  font-size: var(--nl-h2-size, var(--nl-t-title));
  font-weight: 600;
  color: var(--nl-ink);
  margin: 0 0 18px;
  letter-spacing: -0.01em;
}

/* ── Grid. Density comes from the count class, nothing else. ───────── */

.ix-nl .nlw-ev-grid{
  display: grid;
  gap: var(--nl-ev-gap, 16px);
  grid-template-columns: 1fr;
}

/* Offered counts are 1, 2, 4, 5. n3 is not offered in the picker because a
   third card leaves a hole in a two-column grid; if it ever arrives from data
   it falls back to the 2-up grid rather than breaking. */
/* Two-up card grid retired: a lone event is a card, everything else stacks
   as full-width rows. Kept as a no-op guard so any stale --n2/--n3 class
   still lands in the row treatment below rather than in a dead grid. */
.ix-nl .nlw-ev--dead-grid{
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

/* 4 and up drop to compact rows: chip left, text right, no photo. */
.ix-nl .nlw-ev--n2 .nlw-ev-card,
.ix-nl .nlw-ev--n3 .nlw-ev-card,
.ix-nl .nlw-ev--n4 .nlw-ev-card,
.ix-nl .nlw-ev--n5 .nlw-ev-card,
.ix-nl .nlw-ev--n6 .nlw-ev-card,
.ix-nl .nlw-ev--n7 .nlw-ev-card,
.ix-nl .nlw-ev--n8 .nlw-ev-card{
  flex-direction: row;
  align-items: flex-start;
  gap: 14px;
}
/* Compact rows hide the photo and teaser by default, but both are tokens
   rather than hard rules. A title that wants teasers in its compact rows
   sets --nl-ev-teaser-show-n4:block in its shell; the platform default
   stays hidden. Note this is a DESIGN switch: whether the teaser has any
   content at all is a separate question the template already answers with
   x_hasTeaser. Turning it on here shows nothing if the event has no
   teaser text. */
.ix-nl .nlw-ev--n2 .nlw-ev-photo,
.ix-nl .nlw-ev--n3 .nlw-ev-photo,
.ix-nl .nlw-ev--n4 .nlw-ev-photo,
.ix-nl .nlw-ev--n5 .nlw-ev-photo,
.ix-nl .nlw-ev--n6 .nlw-ev-photo,
.ix-nl .nlw-ev--n7 .nlw-ev-photo,
.ix-nl .nlw-ev--n8 .nlw-ev-photo{
  display: var(--nl-ev-photo-show-n4, none);
}
.ix-nl .nlw-ev--n2 .nlw-ev-teaser,
.ix-nl .nlw-ev--n3 .nlw-ev-teaser,
.ix-nl .nlw-ev--n4 .nlw-ev-teaser,
.ix-nl .nlw-ev--n5 .nlw-ev-teaser,
.ix-nl .nlw-ev--n6 .nlw-ev-teaser,
.ix-nl .nlw-ev--n7 .nlw-ev-teaser,
.ix-nl .nlw-ev--n8 .nlw-ev-teaser{
  display: var(--nl-ev-teaser-show-n4, none);
  font-size: var(--nl-ev-teaser-size-n4, var(--nl-body-size));
  line-height: var(--nl-ev-teaser-lh-n4, var(--nl-body-lh));
}

/* ── Card ──────────────────────────────────────────────────────────── */

.ix-nl .nlw-ev-card{
  display: flex;
  flex-direction: column;
  background: var(--nl-card-bg);
  border: 1px solid var(--nl-rule);
  border-radius: var(--nl-radius);
  overflow: hidden;
}

/* ── Date chip ─────────────────────────────────────────────────────── */

/* Chip geometry and type are per-density. n1, n2 and n4+ are three
   different objects: a full-width header on a single card, a header on a
   half-width card, and a narrow left tile in a compact row. The base rule
   below holds the shared skin; the density blocks further down set the
   size tokens each one uses. */
.ix-nl .nlw-ev-chip{
  display: block;
  text-align: center;
  padding: var(--nl-ev-chip-pad, 8px 10px 9px);
  background: var(--nl-ev-chip-bg, var(--nl-ink));
  color: var(--nl-ev-chip-ink, #ffffff);
  text-decoration: none;
  flex: 0 0 auto;
}
.ix-nl .nlw-ev-chip-mo{
  display: block;
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-ev-chip-mo-size, var(--nl-t-micro));
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: var(--nl-ev-chip-mo-lh, 1.167);
  color: var(--nl-ev-chip-mo-color, var(--nl-accent));
}
.ix-nl .nlw-ev-chip-day{
  display: block;
  font-family: var(--nl-ev-chip-day-font, var(--nl-font-ui)) !important;
  font-size: var(--nl-ev-chip-day-size, 32px);
  font-weight: 700;
  line-height: var(--nl-ev-chip-day-lh, 0.9);
}
.ix-nl .nlw-ev-chip-dow{
  display: block;
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-ev-chip-dow-size, var(--nl-t-micro));
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: var(--nl-ev-chip-dow-lh, 0.889);
  opacity: 0.65;
}

/* ── Chip per density ──────────────────────────────────────────────
   Each density sets its own size tokens. Change one and the others are
   untouched. */

/* n1 — single full-width card, chip is a wide header */
.ix-nl .nlw-ev--n1 .nlw-ev-chip{
  --nl-ev-chip-day-size: var(--nl-ev-chip-day-size-n1, var(--nl-t-numeral));
  --nl-ev-chip-mo-size:  var(--nl-ev-chip-mo-size-n1, 13px);
  --nl-ev-chip-dow-size: var(--nl-ev-chip-dow-size-n1, 11px);
  --nl-ev-chip-pad:      var(--nl-ev-chip-pad-n1, 9px 10px 8px);
  --nl-ev-chip-mo-lh:    0.923;
  --nl-ev-chip-day-lh:   0.974;
  --nl-ev-chip-dow-lh:   0.818;
}

/* n2 — two cards side by side, chip is a half-width header */
.ix-nl .nlw-ev--n3 .nlw-ev-chip{
  --nl-ev-chip-day-size: var(--nl-ev-chip-day-size-n2, 38px);
  --nl-ev-chip-mo-size:  var(--nl-ev-chip-mo-size-n2, 12px);
  --nl-ev-chip-dow-size: var(--nl-ev-chip-dow-size-n2, 11px);
  --nl-ev-chip-pad:      var(--nl-ev-chip-pad-n2, 8px 10px 9px);
}

/* n4+ — compact rows, chip is a narrow left tile of fixed width so rows align */
.ix-nl .nlw-ev--n2 .nlw-ev-chip,
.ix-nl .nlw-ev--n3 .nlw-ev-chip,
.ix-nl .nlw-ev--n4 .nlw-ev-chip,
.ix-nl .nlw-ev--n5 .nlw-ev-chip,
.ix-nl .nlw-ev--n6 .nlw-ev-chip,
.ix-nl .nlw-ev--n7 .nlw-ev-chip,
.ix-nl .nlw-ev--n8 .nlw-ev-chip{
  width: var(--nl-ev-chip-w-n4, 78px);
  border-radius: var(--nl-radius-sm, 6px);
  margin: 12px 0 12px 12px;
  --nl-ev-chip-day-size: var(--nl-ev-chip-day-size-n4, calc(var(--nl-t-numeral) * 0.8));
  --nl-ev-chip-mo-size:  var(--nl-ev-chip-mo-size-n4, 12px);
  --nl-ev-chip-dow-size: var(--nl-ev-chip-dow-size-n4, 9px);
  --nl-ev-chip-pad:      var(--nl-ev-chip-pad-n4, 6px 6px 7px);
}

/* ── Body ──────────────────────────────────────────────────────────── */

.ix-nl .nlw-ev-body{
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}

.ix-nl .nlw-ev-photo{
  display: block;
  margin: 0 0 8px;
}
.ix-nl .nlw-ev-photo img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
}

.ix-nl .nlw-ev-eyebrow{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-ev-eyebrow-size, var(--nl-t-micro));
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--nl-ev-eyebrow-color, var(--nl-highlight));
  margin: 0;
}

.ix-nl .nlw-ev-title{
  font-family: var(--nl-font-display, Georgia, serif) !important;
  font-size: var(--nl-ev-title-size, var(--nl-t-title));
  font-weight: 600;
  line-height: var(--nl-ev-title-lh, 1.25);
  margin: 0;
  padding: var(--nl-ev-title-pad, 0);
}
.ix-nl .nlw-ev-title a{
  color: var(--nl-ink);
  text-decoration: none;
}
.ix-nl .nlw-ev-title a:hover { text-decoration: underline; }

.ix-nl .nlw-ev-meta{
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-ev-meta-size, var(--nl-t-label));
  color: var(--nl-ev-meta-color, var(--nl-ink-soft));
  margin: 0;
  padding: var(--nl-ev-meta-pad, 0);
}
.ix-nl .nlw-ev-sep { margin: 0 6px; opacity: 0.5; }

.ix-nl .nlw-ev-teaser{
  font-family: var(--nl-font-body, Arial, sans-serif) !important;
  font-size: var(--nl-ev-teaser-size, var(--nl-body-size));
  line-height: var(--nl-ev-teaser-lh, var(--nl-body-lh));
  color: var(--nl-ink-body);
  margin: 0;
  padding: var(--nl-ev-teaser-pad, 0);
}
/* Collapse rather than leave a gap when the field is empty. */
.ix-nl .nlw-ev-teaser:empty { display: none; }

/* Card CTA keeps its wording; the arrow is appended in the ::after below
   so the template text stays plain. */
.ix-nl .nlw-ev-cta{
  align-self: flex-start;
  font-family: var(--nl-font-ui) !important;
  font-size:var(--nl-t-button);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nl-accent-ink);
  background: var(--nl-accent);
  padding: 8px 16px;
  border-radius: var(--nl-radius-pill, 999px);
  text-decoration: none;
  margin-top: 2px;
}
.ix-nl .nlw-ev--n1 .nlw-ev-cta::after{
  content: "\00A0\2192";             /* nbsp + right arrow */
}
/* Compact rows: the whole row already links, so the pill is redundant and
   visually heavy. It becomes a chevron parked on the right edge, centred
   against the row, reading as an affordance rather than a button. */
.ix-nl .nlw-ev--n2 .nlw-ev-card,
.ix-nl .nlw-ev--n3 .nlw-ev-card,
.ix-nl .nlw-ev--n4 .nlw-ev-card,
.ix-nl .nlw-ev--n5 .nlw-ev-card,
.ix-nl .nlw-ev--n6 .nlw-ev-card,
.ix-nl .nlw-ev--n7 .nlw-ev-card,
.ix-nl .nlw-ev--n8 .nlw-ev-card{
  position: relative;
}
.ix-nl .nlw-ev--n2 .nlw-ev-body,
.ix-nl .nlw-ev--n3 .nlw-ev-body,
.ix-nl .nlw-ev--n4 .nlw-ev-body,
.ix-nl .nlw-ev--n5 .nlw-ev-body,
.ix-nl .nlw-ev--n6 .nlw-ev-body,
.ix-nl .nlw-ev--n7 .nlw-ev-body,
.ix-nl .nlw-ev--n8 .nlw-ev-body{
  padding-right: var(--nl-ev-cta-gutter-n4, 40px);
}
.ix-nl .nlw-ev--n2 .nlw-ev-cta,
.ix-nl .nlw-ev--n3 .nlw-ev-cta,
.ix-nl .nlw-ev--n4 .nlw-ev-cta,
.ix-nl .nlw-ev--n5 .nlw-ev-cta,
.ix-nl .nlw-ev--n6 .nlw-ev-cta,
.ix-nl .nlw-ev--n7 .nlw-ev-cta,
.ix-nl .nlw-ev--n8 .nlw-ev-cta{
  position: absolute;
  right: var(--nl-ev-cta-right-n4, 14px);
  top: 50%;
  transform: translateY(-50%);
  align-self: auto;
  margin: 0;
  padding: 0;
  background: none;
  border-radius: 0;
  letter-spacing: 0;
  text-transform: none;
  font-size: 0;                      /* hide the word, keep the link */
  line-height: 1;
  color: var(--nl-ev-cta-chevron-color-n4, var(--nl-accent));
}
.ix-nl .nlw-ev--n2 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n3 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n4 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n5 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n6 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n7 .nlw-ev-cta::after,
.ix-nl .nlw-ev--n8 .nlw-ev-cta::after{
  content: "\203A";                  /* single right angle quote */
  font-size: var(--nl-ev-cta-chevron-size-n4, 28px);
  font-weight: 400;
  line-height: 1;
  display: block;
}

/* ── Sponsor ───────────────────────────────────────────────────────── */

.ix-nl .nlw-ev-sponsor{
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--nl-rule);
  text-align: center;
}
.ix-nl .nlw-ev-sponsor-label{
  font-family: var(--nl-font-ui) !important;
  font-size:var(--nl-t-micro);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--nl-ink-soft);
  margin: 0 0 10px;
}
.ix-nl .nlw-ev-sponsor-ad{
  display: block;
  width: 100%;
  max-width: 500px;
  height: auto;
  margin: 0 auto;
  border-radius: var(--nl-radius-sm, 6px);
}
.ix-nl .nlw-fa:not(.nlw-fa--split) .nlw-subhead{margin-left:32px;margin-right:32px;}
.ix-nl .nlw-fa:not(.nlw-fa--split) .nlw-headline{margin-left:24px;margin-right:24px;}
.ix-nl .nlw-fa--split .nlw-subhead{font-size:var(--nl-subhead-size);margin-left:0;margin-right:0;}
.ix-nl .nlw-fa .nlw-teaser{font-size:var(--nl-fa-teaser-size, var(--nl-body-size));}
.ix-nl .nlw-teaser{line-height:var(--nl-body-lh);margin-bottom:22px;}

/* ── Mobile layer — below 560px ───────────────────────────────────────
   The roles are restated here at phone sizes. One column of values, so
   what changes between breakpoints is readable at a glance rather than
   scattered through the file. */
@media (max-width:560px){
  .ix-nl{
    --nl-t-hero:    30px;
    --nl-t-title:   18px;
    --nl-t-deck:    16px;
    --nl-t-lead:    16px;
    --nl-t-body:    15px;
    --nl-t-price:   16px;
    --nl-t-byline:  10px;
    --nl-t-button:  10.5px;
    --nl-t-label:   10px;
    --nl-t-micro:    8.5px;
    --nl-t-numeral: 28px;
    --nl-hero-lh:   1.12;

    --nl-block-gap: 34px;
    --nl-body-lh:   1.55;
  }
  .ix-nl .nlw-ev, .ix-nl .nlw-txa, .ix-nl .nlw-re-block{
    padding-left: 14px; padding-right: 14px;
  }
  .ix-nl .nlw-gr{ padding: 18px; }
  .ix-nl .nlw-fa, .ix-nl .nlw-ts{ padding: var(--nl-m-article-pad, 0px); }
  .ix-nl .nlw-txa-card{ padding: 16px; }
  .ix-nl .nlw-ba-group{ padding-left: 10px; padding-right: 10px; }

  /* Fixed tiles — objects, not type. */
  .ix-nl .nlw-ev--n2 .nlw-ev-chip, .ix-nl .nlw-ev--n3 .nlw-ev-chip,
  .ix-nl .nlw-ev--n4 .nlw-ev-chip, .ix-nl .nlw-ev--n5 .nlw-ev-chip,
  .ix-nl .nlw-ev--n6 .nlw-ev-chip, .ix-nl .nlw-ev--n7 .nlw-ev-chip,
  .ix-nl .nlw-ev--n8 .nlw-ev-chip{ width: 56px; }
  .ix-nl .nlw-re-photo{ flex-basis: 68px; }
  .ix-nl .nlw-re-photo img{ width: 68px; height: 48px; }
  .ix-nl .nlw-txa-logo img{ width: 56px; height: 56px; }
}

/* ── Quiet scale (opt-in) ───────────────────────────────────────────
   The Session 5 scale, ~1.9:1 display over body. A title opts in by
   adding the class ix-scale-quiet to its .ix-nl wrapper in its shell.
   No title uses it today. Its phone values sit in the media query below,
   at the same specificity, so they win on phones. */
.ix-nl.ix-scale-quiet{
  --nl-t-hero:    35px;
  --nl-t-title:   24px;
  --nl-t-deck:    20px;
  --nl-t-lead:    19px;
  --nl-t-body:    18px;
  --nl-t-price:   17px;
  --nl-t-byline:  14px;
  --nl-t-button:  13px;
  --nl-t-label:   11px;
  --nl-t-micro:    9px;
  --nl-t-numeral: 41px;
  --nl-hero-lh:   1.18;
  --nl-body-lh:   1.6;
  --nl-label-ls:  2.2px;
}
@media (max-width:560px){
  .ix-nl.ix-scale-quiet{
    --nl-t-hero:    26px;
    --nl-t-title:   19px;
    --nl-t-deck:    17px;
    --nl-t-lead:    15px;
    --nl-t-body:    16px;
    --nl-t-price:   15px;
    --nl-t-byline:  13px;
    --nl-t-button:  12px;
    --nl-t-label:   10px;
    --nl-t-micro:    9px;
    --nl-t-numeral: 30px;
    --nl-body-lh:   1.55;
  }
}

/* ── Unboxed treatment ────────────────────────────────────────────────
   July's central claim: whitespace separates, boxes do not. Applied to
   the panelled blocks so the two can be compared rather than argued. */
.ix-nl.ix-unboxed .nlw-ev,
.ix-nl.ix-unboxed .nlw-txa,
.ix-nl.ix-unboxed .nlw-re-block{ background:transparent; padding-left:0; padding-right:0; }
.ix-nl.ix-unboxed .nlw-ev-card,
.ix-nl.ix-unboxed .nlw-txa-card{
  background:transparent; border:0; border-radius:0;
  padding-left:0; padding-right:0;
  border-bottom:1px solid var(--nl-border);
}
.ix-nl.ix-unboxed .nlw-fa,
.ix-nl.ix-unboxed .nlw-ts{ background:transparent; padding:0; }

/* ── FA hero: full-bleed art, text link instead of a button ───────────*/
.ix-nl .nlw-fa--bleed .nlw-photo{ margin-left:calc(-1 * var(--nl-bleed, 30px)); margin-right:calc(-1 * var(--nl-bleed, 30px)); }
.ix-nl .nlw-fa--bleed .nlw-photo img{ border-radius:0; }

.ix-nl .nlw-cta--link a{
  background:none !important;
  color: var(--nl-readon-ink, var(--nl-text)) !important;
  padding:0 0 3px !important;
  border-radius:0 !important;
  border-bottom: var(--nl-readon-rule, 2px) solid var(--nl-readon-color, var(--nl-accent));
  letter-spacing: var(--nl-readon-ls, 2.4px);
  text-transform: uppercase;
}

/* ── Banderole: ribbon kicker breaking the left edge of split art ─────*/
.ix-nl .nlw-fa--split .nlw-fa-media{ position:relative; }
.ix-nl .nlw-banderole{
  position:absolute;
  left: var(--nl-band-left, -6px);
  top:  var(--nl-band-top, 18px);
  background: var(--nl-band-bg, var(--nl-accent));
  color: var(--nl-band-ink, #ffffff);
  font-family: var(--nl-font-ui) !important;
  font-size: var(--nl-band-size, var(--nl-t-micro));
  font-weight:600;
  letter-spacing: var(--nl-band-ls, 2.4px);
  text-transform:uppercase;
  padding: var(--nl-band-pad-v, 6px) var(--nl-band-pad-h, 12px);
  border-radius: var(--nl-band-radius, 0px);
}

/* ── Byline in the editorial register: italic "By", tracked name ──────*/
.ix-nl .nlw-byline--editorial{
  font-family: var(--nl-font-ui) !important;
  letter-spacing: var(--nl-byline-ls, 1.8px);
  text-transform: uppercase;
}
.ix-nl .nlw-byline--editorial .nlw-by-lead{
  font-family: var(--nl-font-body) !important;
  font-style: italic; text-transform:none; letter-spacing:0;
  font-size: var(--nl-byline-lead-size, var(--nl-t-byline));
}

/* headline line-height becomes a token so the scale can tighten it */
.ix-nl .nlw-headline{ line-height: var(--nl-hero-lh, 1.18); }
.ix-nl .nlw-rubric{ letter-spacing: var(--nl-label-ls, 2.2px); }

/* Selectors the FA bench reads for its starting values. Declared so the
   controls open at the real number instead of their minimum. */
.ix-nl .nlw-fa .nlw-headline{ font-size: var(--nl-fa-headline-size, var(--nl-t-hero)); }
.ix-nl .nlw-fa .nlw-subhead{  font-size: var(--nl-fa-subhead-size, var(--nl-t-deck)); }
.ix-nl .nlw-by-lead{          font-size: var(--nl-byline-lead-size, var(--nl-t-byline)); }
.ix-nl{ --nl-bleed: 30px; }

/* Franchise art alignment is title-level: WLN centred, another title left.
   Declared last so it wins over the earlier per-block rules. */
.ix-nl .nlw-franchise{ text-align: var(--nl-franchise-align, center); }
.ix-nl .nlw-franchise img{
  display:block;
  margin-left: var(--nl-franchise-ml, auto);
  margin-right: var(--nl-franchise-mr, auto);
}
.ix-nl[data-art-align="left"] .nlw-franchise img{ margin-left:0; margin-right:auto; }

/* ── v30 · Split headlines take the title role ─────────────────────────
   Placed last so it outranks .nlw-fa .nlw-headline and .nlw-ts .nlw-headline,
   which have the same specificity. */
.ix-nl .nlw-fa--split .nlw-headline,
.ix-nl .nlw-ts--split .nlw-headline{
  font-size: var(--nl-split-headline-size, var(--nl-t-title));
}
