/* GENERATED FILE - do not edit by hand.
 * Structure "deal" landing + chrome rules.
 * Source: landing.css
 * Rebuild: php tools/build-landing-css.php
 */

.lnch-deal-top { background: #fff; }
.lnch-deal-utility { max-width: 1080px; margin: 0 auto; padding: .45rem 22px; display: flex; justify-content: flex-end; gap: 1.1rem; border-bottom: 1px solid var(--bsp-line); }
.lnch-deal-utility a { color: var(--bsp-muted); font-size: .8rem; text-decoration: none; }
/* The brand's tagline is a sibling of its anchor now — only the site name is a
   link — so the gap that used to sit inside the anchor lives on the bar. The
   write link is held right by margin-left: auto, which the gap does not move. */
.lnch-deal-bar { max-width: 1080px; margin: 0 auto; padding: .8rem 22px; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.lnch-deal-brand { font-size: 1.3rem; font-weight: 800; color: var(--bsp-accent); text-decoration: none; display: flex; align-items: baseline; gap: .6rem; }
.lnch-deal-brand-sub { font-size: .74rem; color: var(--bsp-muted); font-weight: 400; }
.lnch-deal-write { background: var(--bsp-accent-strong, var(--bsp-accent)); color: var(--bsp-on-strong, var(--bsp-on-accent, #fff)); text-decoration: none; font-weight: 700; font-size: .9rem; padding: .55rem 1.1rem; border-radius: 4px; margin-left: auto; }
/* Page h1 (masthead): the community title the landing composes from
   bsp_head_copy()['kicker']. Sized like .ln-digit-head's — the CN family's own
   page-title treatment — so the four landings that gained it read alike. */
.ln-deal-head h1 { font-size: 1.9rem; margin: 1.4rem 0 .4rem; }
.ln-deal-board { margin-top: 1.6rem; }
.ln-deal-board-head { display: flex; align-items: baseline; gap: .9rem; margin-bottom: 1rem; }
.ln-deal-board-head h2 { font-size: 1.15rem; margin: 0; }
.ln-deal-board-head span { color: var(--bsp-muted); font-size: .8rem; }
.ln-deal-top4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }
.ln-deal-hero { position: relative; display: flex; flex-direction: column; text-decoration: none; background: #fff; border-radius: 8px; overflow: hidden; border: 1px solid var(--bsp-line); }
.ln-deal-hero img, .ln-deal-hero-none { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.ln-deal-hero-none { background: linear-gradient(135deg, var(--bsp-accent-soft), var(--bsp-line)); }
.ln-deal-top { position: absolute; top: .5rem; left: .5rem; background: var(--bsp-accent); color: var(--bsp-on-accent); font-size: .72rem; font-weight: 800; padding: .2rem .55rem; border-radius: 4px; }
.ln-deal-top.top1 { background: #E8A23D; color: #212121; }
.ln-deal-hero-title { padding: .6rem .8rem 0; font-weight: 700; font-size: .92rem; line-height: 1.45; color: var(--bsp-ink); }
.ln-deal-hero-meta { padding: .3rem .8rem .8rem; font-size: .76rem; color: var(--bsp-muted); }
/* Chips are links now (see .lnf-tag); this only keeps the row's own spacing. */
.ln-deal-chips { margin: 1.4rem 0 .2rem; }
.ln-deal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.ln-deal-card { display: flex; flex-direction: column; text-decoration: none; background: #fff; border-radius: 8px; overflow: hidden; border: 1px solid var(--bsp-line); position: relative; }
.ln-deal-card-img, .ln-deal-card-img-none { width: 100%; aspect-ratio: 4/3; display: block; overflow: hidden; }
.ln-deal-card-img img { width: 100%; height: 100%; object-fit: cover; }
.ln-deal-card-img-none { background: linear-gradient(135deg, var(--bsp-accent-soft), var(--bsp-line)); }
.ln-deal-card-title { padding: .6rem .8rem 0; font-weight: 700; font-size: .9rem; line-height: 1.45; color: var(--bsp-ink); }
.ln-deal-card:hover .ln-deal-card-title { color: var(--bsp-accent-text); }
.ln-deal-card-meta { padding: .35rem .8rem .8rem; font-size: .74rem; color: var(--bsp-muted); }
.ln-deal-notice { background: #fff; border: 1px solid var(--bsp-line); border-radius: 8px; padding: 1.1rem 1.2rem; margin-bottom: 1.2rem; }
/* Rail/aside headings are h2 — sections of the page under its single h1 — so
   the old h3 type is declared on both levels and nothing shifts. */
.ln-deal-notice h2, .ln-deal-notice h3 { margin: 0 0 .6rem; font-size: .95rem; }
.ln-deal-notice p { font-size: .86rem; color: var(--bsp-muted); line-height: 1.7; }
.ln-deal-notice strong { color: var(--bsp-accent-text); }
.ln-deal-hot { background: #fff; border: 1px solid var(--bsp-line); border-radius: 8px; padding: 1.1rem 1.2rem; }
.ln-deal-hot h2, .ln-deal-hot h3 { margin: 0 0 .6rem; font-size: .95rem; }
.lnch-deal-foot { background: var(--bsp-ink); color: #fff; margin-top: 2.6rem; padding: 1.8rem 22px 1.6rem; }
.lnch-deal-cols { max-width: 1080px; margin: 0 auto; display: flex; gap: 3rem; flex-wrap: wrap; }
.lnch-deal-cols p { opacity: .75; font-size: .86rem; max-width: 34rem; }
.lnch-deal-cols a { color: rgba(255,255,255,.85); }
.lnch-deal-legal { max-width: 1080px; margin: 1.3rem auto 0; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.18); font-size: .8rem; opacity: .7; }