/* Marketing pages other than the home page, in the product system.
   Loaded after site.css, app.css and landing.css. Restyles the older page components
   (hero, sections, figures, documents, pricing, auth) rather than rewriting every template. */

body.landing:not(.home) main { min-height:60vh; }
body.landing .wrap { max-width:1200px; }
body.landing .frame { position:relative; }

/* type */
body.landing .display, body.landing h1 { font:600 clamp(34px, 4.6vw, 54px)/1.05 var(--sans); letter-spacing:-.035em; color:var(--ink); text-wrap:balance; margin:0 0 18px; }
body.landing h2 { font:600 clamp(24px, 2.8vw, 34px)/1.12 var(--sans); letter-spacing:-.03em; color:var(--ink); text-wrap:balance; }
body.landing h3 { font:600 16px/1.3 var(--sans); letter-spacing:-.01em; color:var(--ink); }
body.landing .serif { font-family:inherit; font-style:normal; font-weight:inherit; letter-spacing:inherit; color:var(--muted); }
body.landing .lead { font-size:clamp(15.5px, 1.4vw, 17.5px); line-height:1.55; color:var(--muted); max-width:62ch; }
body.landing .muted { color:var(--muted); } body.landing .faint { color:var(--faint); }
body.landing .small { font-size:13px; }
body.landing .mono { font-family:var(--mono); font-size:.9em; font-variant-numeric:tabular-nums; }
body.landing .link { color:var(--ink-2); text-decoration:underline; text-decoration-color:var(--line-strong); text-underline-offset:3px; }
body.landing .link:hover { color:var(--ink); text-decoration-color:var(--ink); }
body.landing p { color:var(--ink-2); }

/* layout */
body.landing:not(.home) .hero > .wrap > .frame { padding:64px 0 40px; }
body.landing:not(.home) .hero .hero-copy { max-width:760px; }
body.landing .section { border-top:1px solid var(--line); }
body.landing .section > .wrap > .frame { padding:80px 0; }
body.landing .page > .wrap > .frame { padding:56px 0 88px; }
body.landing .split { gap:56px; }
@media (max-width:760px) {
  body.landing:not(.home) .hero > .wrap > .frame { padding:40px 0 24px; }
  body.landing .section > .wrap > .frame { padding:56px 0; }
  body.landing .split { gap:28px; }
}

/* eyebrow line accent from the old system becomes a chip */
body.landing .eyebrow { display:inline-flex; align-items:center; gap:7px; height:26px; padding:0 10px; border-radius:7px; background:var(--surface); box-shadow:var(--sh); font:500 12.5px/1 var(--sans); letter-spacing:0; text-transform:none; color:var(--ink-2); margin-bottom:20px; }
body.landing .eyebrow i { display:none; }
body.landing .eyebrow a { color:inherit; text-decoration:none; }

/* surfaces */
body.landing .card { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:20px; }
body.landing .card.soft { background:var(--surface-2); box-shadow:none; }
body.landing .notice { border-radius:10px; background:var(--surface); box-shadow:var(--sh); padding:12px 14px; font-size:13.5px; color:var(--ink-2); }
body.landing .tag { display:inline-flex; align-items:center; height:20px; padding:0 7px; border-radius:5px; font:500 11.5px/1 var(--sans); background:var(--surface-2); color:var(--ink-2); letter-spacing:0; text-transform:none; }
body.landing .tag.accent { background:var(--accent-soft); color:var(--accent); }
body.landing .chip { height:28px; }

/* figures from the old marketing system */
body.landing .viz { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:16px 18px 14px; margin:0; }
body.landing .viz-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
body.landing .viz-title { font:600 14px/1.3 var(--sans); color:var(--ink); letter-spacing:0; text-transform:none; }
body.landing .viz svg text { font-family:var(--sans); }
body.landing .viz .ax { font:400 11px var(--sans); fill:var(--faint); }
body.landing .viz .rl { font:500 13px var(--sans); fill:var(--ink); }
body.landing .viz-note { font-size:12.5px; color:var(--faint); margin:10px 0 0; }
body.landing .hero-viz { margin-top:32px; }

/* tables */
body.landing .dt { width:100%; border-collapse:collapse; font-size:13.5px; }
body.landing .dt th { font:500 12px/1.3 var(--sans); color:var(--muted); text-transform:none; letter-spacing:0; padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; background:transparent; }
body.landing .dt td { padding:10px 12px; border-bottom:1px solid var(--line); }
body.landing .dt td.t { color:var(--ink); font-weight:500; }
body.landing .table-wrap { overflow-x:auto; }
body.landing .table-wrap:not(.bare) { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:4px 8px; }

/* long-form documents (methodology, developers) */
body.landing .doc section { border-top:1px solid var(--line); }
body.landing .doc .h { font:600 13px/1.3 var(--sans); color:var(--ink); letter-spacing:0; text-transform:none; }
body.landing .doc .h .n { font:500 12px var(--sans); color:var(--faint); }
body.landing .doc .b p, body.landing .doc .b li { font-size:15px; line-height:1.65; color:var(--ink-2); }
body.landing .doc .b h3 { font-size:15px; margin:20px 0 8px; }
body.landing .codeblock { font:400 13px/1.6 var(--mono); background:var(--surface); box-shadow:var(--sh); border-radius:10px; padding:14px 16px; color:var(--ink-2); overflow-x:auto; }
body.landing code { font-family:var(--mono); font-size:.88em; background:var(--surface-2); padding:1px 5px; border-radius:4px; }
body.landing .codeblock code { background:none; padding:0; }

/* steps list (use-case pages) */
body.landing .steps-list li { border-top:1px solid var(--line); }
body.landing .steps-list .n { font:500 12px var(--sans); color:var(--faint); }
body.landing .steps-list b { font:600 16px/1.3 var(--sans); color:var(--ink); }

/* pricing */
body.landing .plan { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:20px; }
body.landing .plan.featured, body.landing .plan.accent { box-shadow:0 0 0 1px var(--ink), 0 14px 36px -14px rgba(23,24,26,.25); }
body.landing .price { font:600 34px/1 var(--sans); letter-spacing:-.03em; color:var(--ink); }
body.landing .price small { font-size:13px; font-weight:400; color:var(--muted); letter-spacing:0; }

/* leaderboards index */
body.landing .lbi { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:4px 16px; margin-top:24px; }
body.landing .lbr { text-decoration:none; }
body.landing .lbr .nm { font:600 15px/1.3 var(--sans); color:var(--ink); }
body.landing .meter { background:var(--surface-2); border-radius:3px; height:6px; overflow:hidden; }
body.landing .meter i { background:var(--ink-2); }

/* auth pages */
body.landing .auth { max-width:420px; margin:0 auto; }
body.landing .auth h1 { font-size:28px; }
body.landing input:not([type=checkbox]):not([type=radio]), body.landing select, body.landing textarea { border-radius:8px; background-color:var(--surface); box-shadow:var(--sh); border:0; font:400 14px var(--sans); color:var(--ink); }
body.landing input:focus, body.landing select:focus, body.landing textarea:focus { box-shadow:0 0 0 1px var(--ink); outline:none; }
body.landing button:not(.theme-toggle):not(.step):not([class*="icobtn"]) { border-radius:8px; font:500 13.5px/1 var(--sans); }
body.landing .btn.lg, body.landing button.lg { height:44px; }

/* report (the free grade) */
body.landing .kpis { gap:12px; border:0; }
body.landing .kpi, body.landing .kpi + .kpi { background:var(--surface); border:0; border-radius:var(--r-lg); box-shadow:var(--sh), var(--hl); padding:14px 16px; }
body.landing .kpi .k { font:500 12.5px/1 var(--sans); letter-spacing:0; text-transform:none; color:var(--muted); }
body.landing .kpi .v { font:600 28px/1.1 var(--sans); letter-spacing:-.02em; }
body.landing .track-band { border-radius:var(--r-lg); }

/* old reveal helpers stay visible without the old script */
body.landing .rise { animation:rise .7s cubic-bezier(.2,.7,.2,1) both; }
@media (prefers-reduced-motion:reduce) { body.landing .rise { animation:none; } }

/* phone layouts the older grids lacked */
@media (max-width:860px) {
  body.landing .split, body.landing .split.wide-r { grid-template-columns:minmax(0,1fr); }
  body.landing .split > * { min-width:0; }
  body.landing .doc > section { grid-template-columns:minmax(0,1fr); gap:12px; padding:28px 0; }
  body.landing .doc .b { min-width:0; }
  body.landing .grid.g4, body.landing .g4 { grid-template-columns:minmax(0,1fr); }
}
@media (min-width:861px) and (max-width:1100px) { body.landing .g4 { grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:760px) { body.landing .viz { overflow-x:auto; } }
@media (max-width:860px) { body.landing .doc .b .dt { display:block; overflow-x:auto; } }