/* Edge design system 1.1: the landing (edge/landing-final-v3, a8 69f02c742d) as the source of truth for content pages.
   Linked by tools/stamp_chrome.py in the DS1 head, after the art layers (Federico approved 10-22:
   ~/context/internal/projects/edge/design-system-1.0/DS-1.1-FROM-LANDING.md).
   Loads after edge-ds1.css. Values are read off the landing's CSS, not imported from it (the landing's files stay its own):
   edge-kit-home-v13.css (a8 headline type, section heads, section gap, ground), edge-kit-home-refined.css (.button-dark),
   edge-kit-home-v2.css (.v2-card, .v2-card-cta, footer). */

html:root:not(#kit) {
  /* colour */
  --edge-paper: #f5f3eb; --paper: #f5f3eb;          /* ground, background A */
  --ds11-ink: #16251e; --ds11-muted: #59685f; --ds11-line: #d6dce5; --ds11-surface: #ffffff;
  --ds11-blue: #154cff; --ds11-blue-hover: #103ed7; --ds11-blue-soft: #e9efff; --ds11-meadow: #334626; --ds11-meadow-ink: #e6ecdf;
  /* type */
  --ds11-h1: clamp(44px, 4.45vw, 66px); --ds11-h1-doc: clamp(32px, 3vw, 44px); --ds11-h2: 48px; --ds11-h2-lh: 52px;
  --ds11-lede: 18px;
  /* shape and space */
  --ds11-card-radius: 18px; --ds11-btn-radius: 10px; --ds11-control-radius: 9px; --ds11-gap: 96px;
  --ds11-btn-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.14), 0 2px 0 rgba(12,25,48,.18), 0 10px 20px rgba(21,76,255,.06);
  --ds11-btn-shadow-hover: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(0,0,0,.16), 0 3px 0 rgba(12,25,48,.22), 0 12px 22px rgba(21,76,255,.10);
  --ds11-btn-shadow-press: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(0,0,0,.18), 0 1px 0 rgba(12,25,48,.14);
}
@media (max-width: 700px) {
  html:root:not(#kit) { --ds11-h1: clamp(30px, 8.6vw, 36px); --ds11-h1-doc: clamp(28px, 7.4vw, 32px); --ds11-h2: 32px; --ds11-h2-lh: 36px; --ds11-lede: 17px; --ds11-gap: 64px; }
}

/* ---- headline type: one medium weight for both lines, -.035em, leading 1; the second line in Edge blue
   (only where the page already has an accent line: .ov-pixel / .pixel / the landers' typed tail; Federico 10-22) */
html:root:not(#kit) :is(main, .sv3, .ov, #app) h1 {
  font-size: var(--ds11-h1) !important; line-height: 1 !important; font-weight: 500 !important; letter-spacing: -.035em !important; color: var(--ds11-ink) !important;
}
html:root:not(#kit) :is(main, .sv3, .ov, #app) h1 :is(.ov-pixel, .pixel, .pixel-head, .hero-tail, .bx-line2, .bx-line2 *) {
  font-weight: 500 !important; letter-spacing: -.035em !important; color: var(--ds11-blue) !important; font-style: normal;
}
/* (:not(#ds11) outranks the hero rule, whose :is() carries #app's id weight)
   documents (docs, task questions under a breadcrumb, legal, evaluation reports, pass cards) keep a smaller title in the same face */
html:root:not(#kit) :is(.docs-main, .privacy-page, .legal-document, .eval-hero-copy, .ry-card, .pl-card) h1:not(#ds11), html:root:not(#kit) .crumb ~ h1:not(#ds11) { font-size: var(--ds11-h1-doc) !important; }

/* ---- section heads: the landing's 48/52 at 500, same tracking (phone 32/36) */
html:root:not(#kit) :is(.section-head, .ov-sec, .method-chapter, .method-intro, .chapter-copy, .v7-end-in, .v3-main, .universe, .page-head) > h2,
html:root:not(#kit) h2.ov-h2, html:root:not(#kit) .ov-wrap > section > h2 {
  font-size: var(--ds11-h2) !important; line-height: var(--ds11-h2-lh) !important; font-weight: 500 !important; letter-spacing: -.035em !important;
}
html:root:not(#kit) :is(.docs-main, .privacy-page, .legal-document) :is(.section-head, .sec-h) > h2:not(#ds11) { font-size: inherit !important; line-height: 1.2 !important; }
html:root:not(#kit) :is(main, .sv3, .ov, #app) :is(h2, h3) { font-weight: 500 !important; letter-spacing: -.035em; }

/* ---- body: 18px lede in the muted green-grey, -.01em, 1.55 */
html:root:not(#kit) :is(.ov-sub, .lede, .v3-copy .lede, .hero > p:not([class])) {
  font-size: var(--ds11-lede) !important; line-height: 1.55 !important; letter-spacing: -.01em !important; color: var(--ds11-muted) !important;
}

/* ---- primary button: the landing's key (.button-dark): its colour (blue, or ink where the page uses ink), 10px corner,
   a 1px edge a shade darker, a 2px soft base; lifts 1px on hover, presses 1px */
html:root:not(#kit) :is(.btn.primary, .ov-btn-blue, .ov-btn-dark, .ry-btn, .pl-btn, .pl-find-go, .el-go, .el-primary, .cx-b.cx-p, .ih-copy,
  .tr-try, .tr-promo-cta, button.go, .search-send, .ds1-get, .edge-key:not(.edge-key-quiet)) {
  border-radius: var(--ds11-btn-radius) !important; box-shadow: var(--ds11-btn-shadow) !important;
  border: 1px solid color-mix(in srgb, var(--k, var(--ds11-blue)) 88%, #0a1830 12%) !important;
  transition: transform .24s ease, background .32s ease, box-shadow .32s ease !important;
}
html:root:not(#kit) :is(.btn.primary, .ov-btn-blue, .ov-btn-dark, .ry-btn, .pl-btn, .pl-find-go, .el-go, .el-primary, .cx-b.cx-p, .ih-copy,
  .tr-try, .tr-promo-cta, button.go, .search-send, .ds1-get, .edge-key:not(.edge-key-quiet)):hover { box-shadow: var(--ds11-btn-shadow-hover) !important; transform: translateY(-1px) !important; }
html:root:not(#kit) :is(.btn.primary, .ov-btn-blue, .ov-btn-dark, .ry-btn, .pl-btn, .pl-find-go, .el-go, .el-primary, .cx-b.cx-p, .ih-copy,
  .tr-try, .tr-promo-cta, button.go, .search-send, .ds1-get, .edge-key:not(.edge-key-quiet)):active { box-shadow: var(--ds11-btn-shadow-press) !important; transform: translateY(1px) !important; }

/* ---- secondary button: white, one hairline, a lit top edge (.v2-card-cta) */
html:root:not(#kit) :is(.btn.share, .btn.secondary, a.btn:not(.primary), .btn.quiet, .btn.big:not(.primary), .ov-btn-quiet, .cx-b:not(.cx-p),
  .copy-prompt.quiet-copy, .tr-share-btn, .edge-key-quiet) {
  background: var(--ds11-surface) !important; color: var(--ds11-ink) !important; border: 1px solid var(--ds11-line) !important;
  border-radius: var(--ds11-control-radius) !important; box-shadow: inset 0 1px 0 #fff, 0 2px 0 var(--ds11-line) !important; /* keycap: lit top edge + base (Federico 10-24) */
  transition: transform .24s ease, background .32s ease !important;
}
html:root:not(#kit) :is(.btn.share, .btn.secondary, a.btn:not(.primary), .btn.quiet, .btn.big:not(.primary), .ov-btn-quiet, .cx-b:not(.cx-p),
  .copy-prompt.quiet-copy, .tr-share-btn, .edge-key-quiet):hover { transform: translateY(-1px) !important; }
@media (prefers-reduced-motion: reduce) { html:root:not(#kit) :is(.btn, .ov-btn, .ry-btn, .pl-btn, .ds1-get, .edge-key, .cx-b) { transform: none !important; transition: none !important; } }

/* ---- cards: the landing's 18px corner; white on one hairline stays for content panels */
html:root:not(#kit) :is(.edge-glass, .sky-glass, .card, .tile, .panel, .plan, .pr-plan, .stat, .metric-card, .study-chart, .benchmark-board,
  .callout, .detail-card, .task-card, .output-card, .scenario-card, .v3-use, .v3-how .hi, .st-side > section, .c5 .res, .ry-card, .pl-card,
  .tr-rail-card, .el-card) {
  border-radius: var(--ds11-card-radius) !important;
}

/* ==== DS 1.1 re-sync with the live home (getedge.cc release 20261022-home-13a8, master c8910562d0), 10-23 ==== */

/* ---- hero band: the landing's hero sits on the paper with the blue halftone dome top right (assets/kit/sky.webp, the
   home's .sky-frame art), not on a sky-blue gradient with a photo cloud. Desktop only: on phones the dome would sit behind
   the headline (the home moves it below its copy; content pages have no empty band there), so phones keep the plain paper.
   Only on heroes that leave the top right to the art or put an opaque card there (skill pages, pricing, benchmarks, evals,
   explore, creator profiles): on wide text pages (docs, comparisons, catalog, 404) it ran behind words (capture check 10-23). */
html:root:not(#kit) body::before { background: none !important; }
html:root:not(#kit) body::after { content: none !important; display: none !important; }
/* desktop only, as a media block: a max-width override lost on specificity to :has(form.goal#search) and put the dome
   behind phone heroes (short skill page, German Taxes, evals, pricing; capture check 10-23) */
@media (min-width: 1001px) {
html:root:not(#kit) body:is(:has(.v3-copy), :has(#pr-title), :has(#bx-title), :has(#hb-title), :has(.creator-hero), :has(form.goal#search))::after {
  content: "" !important; display: block !important;
  --ds11-dome: clamp(300px, 31vw, 480px);
  top: 48px !important; right: 0 !important; left: auto !important;
  width: var(--ds11-dome) !important; height: calc(var(--ds11-dome) * 1.563) !important;
  background: url("/assets/kit/sky.webp") right top / 100% auto no-repeat !important; opacity: .94 !important; filter: saturate(.9);
}
}

/* ---- closing band: the landing's "The edge" card (its blue halftone sky, white type, white secondary key on the art),
   instead of the photo cloud bank on a gradient. The words sit on the card's solid blue; its halftone clouds rise only
   behind the keys at the bottom (the separate pixel-cloud layer is left out: on a band this size it ran behind the words). */
html:root:not(#kit) :is(.v7-end, .ov-promo) {
  background: linear-gradient(180deg, #2e78b1 0%, #2e78b1 58%, rgba(46,120,177,.55) 78%, rgba(46,120,177,0) 100%),
              url("/assets/kit/v3/v3-card-sky.webp") center bottom / cover no-repeat, #2e78b1 !important;
  border-radius: var(--ds11-card-radius) !important; color: #fff !important;
}
html:root:not(#kit) body :is(.v7-end, .ov-promo) :is(h2, h3, p, small, li, .lede):not(#ds11) { color: #fff !important; }
html:root:not(#kit) :is(.v7-end, .ov-promo) :is(p, small, .lede) { opacity: .92; }
html:root:not(#kit) :is(.v7-end, .ov-promo) :is(.btn, .ov-btn, .edge-key, a.btn, button.btn) {
  background: #fff !important; color: var(--ds11-ink) !important; border: 1px solid var(--ds11-line) !important;
  border-radius: var(--ds11-control-radius) !important; box-shadow: inset 0 1px 0 #fff, 0 2px 0 rgba(12,25,48,.18) !important; --k: #fff;
}
html:root:not(#kit) :is(.v7-end, .ov-promo) :is(.btn, .ov-btn, .edge-key) :is(span, svg) { color: var(--ds11-ink) !important; }
@media (max-width: 700px) {
  html:root:not(#kit) :is(.v7-end, .ov-promo) { background-size: auto, cover, auto !important; background-position: 0 0, center bottom, 0 0 !important; }
}

/* ---- Pricing "Get started in seconds": the Get Edge dialog's code box and keycap (edge-use.css) ---- */
html:root:not(#kit) .pr-start .pr-prompt{display:flex;align-items:stretch;gap:10px;max-width:760px;margin-inline:auto;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
html:root:not(#kit) .pr-start .pr-prompt code{flex:1;min-width:0;display:flex;align-items:center;margin:0;padding:14px 16px;border:1px solid #d6dce5;border-radius:10px;background:#f3f5f8;color:#16251e;font:13.5px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left}
html:root:not(#kit) .pr-start .pr-prompt .ov-btn{--k:#154cff;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;
  color:#fff!important;background:#154cff!important;font:500 15px/1.2 Inter,"Inter Fallback",ui-sans-serif,system-ui,-apple-system,sans-serif;white-space:nowrap;cursor:pointer}
html:root:not(#kit) .pr-start .pr-prompt .ov-btn:hover{background:#2a5cff!important}
html:root:not(#kit) .pr-start .pr-prompt .ov-btn:focus-visible{outline:2px solid #154cff;outline-offset:3px}
@media (max-width: 620px){html:root:not(#kit) .pr-start .pr-prompt{flex-direction:column}html:root:not(#kit) .pr-start .pr-prompt .ov-btn{width:100%}}