/*
 * Deliberate changes to the v16 design. Kept out of davinci.css, which
 * stays byte for byte the v16 stylesheet, and loaded straight after it.
 *
 * Phone menu: v16 turns the nav links into a sideways-scrolling strip on
 * every screen under 1280px, so on a phone most of them sit off the edge
 * with no visible way to reach them. From 860px down the menu button comes
 * back and opens v16's own full-screen menu. Opening, closing on a link
 * tap or Escape, and locking the page scroll are already in v16's script.
 * Tablets and laptops keep v16's strip.
 */
/*
 * No white boxes on the dark page: the answer boxes beside the arrows on
 * The Problem ("What solving it takes") and The Solution ("What Synapse
 * offers"), and the "Imagine" box on The Vision, lose their fill and take
 * the page's own colours. Spacing, borders and the hover glow are unchanged.
 */
#problem-list .prow .fix,
#offers .orow:not(.ohead) > span,
.cmp2 .b2,
.b .cmp2 .b2{background:transparent!important;color:var(--w)!important}
/* The Problem list redefines --w as dark, so "What solving it takes" is set to white directly. */
#problem-list .prow .fix{color:#FFFFFF!important}

@media (max-width:860px){
  .nav .burger{display:block!important;flex:none;margin-right:-8px}
  .nav .reqbtn{margin-left:auto}
  .nav .links{display:none!important;position:fixed;top:var(--navh);left:0;right:0;bottom:0;height:auto;z-index:49;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:12px 20px 40px;background:var(--k);overflow-x:hidden;overflow-y:auto;-webkit-mask-image:none;mask-image:none}
  .nav.open .links{display:flex!important}
  .nav .links > li{border-bottom:1px solid rgba(255,255,255,.12)}
  .nav .links > li > a{display:block;width:100%;padding:18px 0;font-size:15px;letter-spacing:.08em}
  .nav .links > li > a.is-active{border-bottom:0;color:var(--r)}
  .nav .burger span{transition:transform .3s,opacity .3s}
  .nav.open .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav.open .burger span:nth-child(2){opacity:0}
  .nav.open .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
}
