/* Lot & Bay hosted · the public sales website (T11, lib/sales.js): /welcome, /features, /pricing, /start and the rest. On top of
   pages.css (the Steel tokens, light and dark, .btn, .card, .field, .choice, .msg): a dark bar, square corners, Arial, one orange,
   uppercase headings. R18 (T, 2026-11-07: "slightly less boxy"): the boxes take pages.css's small corners; the bar and the bands
   stay square. No script, except R16's Show button for the sign-up's password (public/sales.js, on /start only). */
body.sales{font-size:16px;line-height:1.5;display:flex;flex-direction:column;min-height:100vh}
.s-in{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
.s-narrow{max-width:680px}
.s-narrow > .card:first-child{margin-top:34px}
.s-main{flex:1}
.s-draft{background:var(--warn-soft);color:var(--warn);font-size:13px;font-weight:600;text-align:center;padding:5px 12px;border-bottom:1px solid var(--line)}

/* the bar */
.s-bar{background:var(--rail);color:var(--rail-ink);border-bottom:3px solid var(--marker)}
.s-bar .s-in{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap;min-height:60px;padding-top:8px;padding-bottom:8px}
.s-brand{display:flex;align-items:center;gap:10px;color:var(--rail-ink);text-decoration:none;font-weight:700;font-size:20px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.s-brand .brand-mark{width:32px;height:32px}
.s-nav{display:flex;align-items:center;gap:6px 18px;flex-wrap:wrap;margin-left:auto}
.s-nav a{color:var(--rail-ink);text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase;padding:6px 0;border-bottom:2px solid transparent}
.s-nav a:hover,.s-nav a[aria-current="page"]{border-bottom-color:var(--marker)}
.s-nav a.btn{padding:8px 14px;border:1px solid var(--accent);color:var(--accent-ink);letter-spacing:.06em}
.s-nav a.btn:hover{border-color:var(--accent)}
.s-nav .s-login{opacity:.92}

/* headings: uppercase, as in the app */
.sales h1,.sales h2,.sales h3{text-transform:uppercase;letter-spacing:.04em}
.sales h1{font-size:clamp(28px,4.4vw,44px);line-height:1.08}
.sales h2{font-size:20px}
.sales h3{font-size:16px;margin:0}
.s-h{margin:34px 0 14px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.s-sub{margin:-8px 0 14px}
.s-lead{font-size:18px;color:var(--muted);max-width:62ch;margin:12px 0 22px}

/* the home page */
.s-hero{background:var(--surface);border-bottom:1px solid var(--line)}
.s-hero-in{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:40px;align-items:center;padding-top:clamp(28px,6vh,64px);padding-bottom:clamp(28px,6vh,64px)}
.s-hero-text h1{max-width:18ch}
.s-once{background:var(--surface-2);border-left:4px solid var(--marker)}
.s-once p{color:var(--muted);font-size:15px}
.s-flow{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;counter-reset:f}
.s-flow li{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.s-flow li::before{counter-increment:f;content:counter(f);width:24px;height:24px;flex:none;display:inline-grid;place-items:center;background:var(--marker);color:var(--marker-ink);font-size:12px;border-radius:var(--r-sm)}
.s-sec{padding:8px 0 34px}
.s-sec > .s-in > h1{margin-top:34px}
.s-grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px}
.s-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}
.s-aud p,.s-tile p{color:var(--muted)}
.s-plan-line{color:var(--ink) !important;font-size:14px;margin-top:auto !important}
.s-tile{text-decoration:none;color:var(--ink);border-top:3px solid var(--ink)}
.s-tile:hover{border-top-color:var(--marker)}
.s-steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:14px;counter-reset:s}
.s-steps li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-1);padding:18px;display:flex;gap:12px;align-items:flex-start;font-weight:600}
.s-steps li::before{counter-increment:s;content:counter(s);font-size:26px;font-weight:700;color:var(--marker);line-height:1}
.s-band{background:var(--rail);color:var(--rail-ink);padding:28px 0}
.s-band .s-in{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;flex-wrap:wrap}
.s-band .s-band-link{color:var(--rail-ink)}

/* features */
.s-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.s-toc a{border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);text-decoration:none;font-size:13px;font-weight:600;padding:6px 10px;border-radius:var(--r-sm);text-transform:uppercase;letter-spacing:.04em}
.s-toc a:hover{border-color:var(--accent)}
.s-feat{margin-bottom:14px;scroll-margin-top:16px;border-left:4px solid var(--marker)}
.s-feat ul,.s-planc ul,.s-terms{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:5px}

/* pricing */
.s-planc{gap:10px}
.s-planc .btn{margin-top:auto;align-self:flex-start}
.s-kind{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.s-price{font-size:36px;font-weight:700;line-height:1}
.s-per{color:var(--muted);font-weight:600}
.s-terms{padding-left:20px}

/* forms and the small pages */
.sales form.card{gap:18px}
.sales fieldset.choices legend{text-transform:uppercase;letter-spacing:.06em}
.sales .field label{text-transform:uppercase;letter-spacing:.06em;font-size:12px}
.sales .field input{padding:11px 12px;font-size:16px}
.sales .choice strong{font-size:15px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* R16: the sign-up's password box with its Show button (public/sales.js shows the button; without script the box works as it is) */
.s-pw-row{display:flex;gap:8px;align-items:stretch}
.s-pw-row input{flex:1 1 auto;min-width:0}
.s-pw-row .btn{flex:none}
.s-after{margin-top:14px}
.sales .card h1{font-size:28px}
.sales dl.facts{font-size:16px}

/* the footer */
.s-foot{background:var(--surface);border-top:1px solid var(--line);padding:18px 0;font-size:14px;color:var(--muted)}
.s-foot .s-in{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}
.s-foot nav{display:flex;flex-wrap:wrap;gap:6px 16px}
.s-foot a{color:var(--muted)}
.s-foot-brand{font-weight:700;color:var(--ink);text-transform:uppercase;letter-spacing:.06em}

@media (max-width:760px){
  .s-hero-in{grid-template-columns:minmax(0,1fr);gap:24px}
  .s-nav{margin-left:0;width:100%;gap:6px 12px;flex-wrap:nowrap}
  .s-nav a{font-size:12.5px;letter-spacing:.04em;white-space:nowrap}
  .s-nav a.s-go{margin-left:auto;padding:7px 10px}
  .s-lead{font-size:16.5px}
  .s-price{font-size:30px}
  .s-band .btn{width:100%}
}