/* desk.css: desktop room and flow (Valentin 2026-10-20: "desktop view needs a little more room and flow").
   Desktop only (>=1024px). Phones and tablets below 1024px are untouched.
   Linked after each page's own CSS by lux_common/lcsite.py meta() (every build) and by hand in d8.html.
   Rules are scoped with html[data-lc="<page>"] so they win over page CSS without !important.
   --room = space between chapters. The nav (#nav) is styled in nav.css, not here. */

@media (min-width:1024px){
  html[data-lc]{--room:120px;--max:1360px}

  /* Footer: disclaimers span the full width in two even columns instead of a narrow block on the left */
  html[data-lc] footer .legal-b,
  html[data-lc] footer .legal-block{display:block;columns:2;column-gap:64px;max-width:none}
  html[data-lc] footer .legal-b > p,
  html[data-lc] footer .legal-block > p{break-inside:avoid;margin:0 0 8px;max-width:none}
  html[data-lc] footer .legal-b > .legal-links,
  html[data-lc] footer .legal-block > .legal-links{column-span:all;margin-top:12px}
  html[data-lc] footer .legal-b > .legal-links ~ p,
  html[data-lc] footer .legal-block > .legal-links ~ p{column-span:all}

  /* ---------- d8 (brokers) ---------- */
  html[data-lc="d8"] #grow{padding-top:var(--room);padding-bottom:40px}
  html[data-lc="d8"] #rated,
  html[data-lc="d8"] #deal,
  html[data-lc="d8"] #residential,
  html[data-lc="d8"] #campaigns,
  html[data-lc="d8"] #site,
  html[data-lc="d8"] #academy,
  html[data-lc="d8"] #money,
  html[data-lc="d8"] #plans,
  html[data-lc="d8"] #setup,
  html[data-lc="d8"] #faq{padding-top:var(--room);padding-bottom:0}
  html[data-lc="d8"] #plans{padding-bottom:16px}
  html[data-lc="d8"] #final{padding-top:var(--room);padding-bottom:var(--room)}
  html[data-lc="d8"] #campH > span{display:block}
  html[data-lc="d8"] #campH{font-size:min(84px,6.1vw)}
  html[data-lc="d8"] #final h2{font-size:min(88px,6.4vw)}

  /* ---------- owners / lenders (lux pages) ---------- */
  html[data-lc="owners"] main > section:not(.hero):not(.final),
  html[data-lc="lenders"] main > section:not(.lh):not(.final){padding-top:var(--room);padding-bottom:0}
  html[data-lc="owners"] main > section.final,
  html[data-lc="lenders"] main > section.final{padding-top:var(--room);padding-bottom:var(--room)}
  /* long split headings: heading takes the full row (two lines at most), the lead sits beneath */
  html[data-lc="owners"] #file .hd2,
  html[data-lc="owners"] #clear .hd2,
  html[data-lc="lenders"] #clear .hd2{display:block}
  html[data-lc="owners"] #file .hd2 > .sec-sub,
  html[data-lc="owners"] #clear .hd2 > .sec-sub,
  html[data-lc="lenders"] #clear .hd2 > .sec-sub{margin:24px 0 0;max-width:56ch}
  html[data-lc="owners"] #file .sec-h,
  html[data-lc="owners"] #clear .sec-h,
  html[data-lc="lenders"] #clear .sec-h{max-width:none}

  /* ---------- pricing / start ---------- */
  html[data-lc="pricing"] #setup,
  html[data-lc="pricing"] #faq{padding-top:var(--room)}
  html[data-lc="pricing"] .cmp-h{margin-top:96px}
  html[data-lc="pricing"] #final h2{font-size:min(84px,6.1vw)}
  html[data-lc="pricing"] #final{padding-top:var(--room);padding-bottom:var(--room)}
  html[data-lc="start"] .st-grid{column-gap:72px;padding-bottom:var(--room)}
  html[data-lc="start"] .st-h{margin-bottom:32px}

  /* ---------- generated pages (help, tools, academy, templates, legal) ---------- */
  html[data-lc] main > section.sec{padding-top:var(--room)}
  html[data-lc="tools"] #more{padding-top:var(--room)}
  html[data-lc] main > section.final{padding-top:var(--room);padding-bottom:var(--room)}
  /* legal pages: running text near 70 characters, room before the footer */
  html[data-lc="terms"] .lg,
  html[data-lc="privacy"] .lg,
  html[data-lc="cookies"] .lg{padding-bottom:var(--room)}
  html[data-lc="terms"] .lg .doc,
  html[data-lc="privacy"] .lg .doc,
  html[data-lc="cookies"] .lg .doc{max-width:700px}
}

@media (min-width:1024px) and (max-width:1279px){
  /* narrow desktop: split heads stack so big headings keep to two lines */
  html[data-lc="owners"] .hd2,
  html[data-lc="lenders"] .hd2{display:block}
  html[data-lc="start"] .st-h h1{font-size:48px}
  html[data-lc="owners"] .hd2 > .sec-sub,
  html[data-lc="lenders"] .hd2 > .sec-sub{margin:24px 0 0;max-width:56ch}
}
@media (min-width:1280px){
  html[data-lc]{--room:152px}
  html[data-lc="start"] .st-grid{column-gap:96px}
}
@media (min-width:1440px){
  html[data-lc]{--room:168px}
}