/* issue 193 場景 devaeye-lanes：「前／後」兩條服務線（移植示意站 .sides）。左線淺底、右線深底、各有頂端強調色條，巨型浮水印字與中分菱形。無 JS。 */
.page-blocks .dv-lanes { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; }
.page-blocks .dv-lane { position: relative; display: flex; flex-direction: column; gap: 1.125rem; min-width: 0; min-height: 26rem; padding: clamp(1.75rem, 4vw, 3.5rem); overflow: hidden; background: var(--paper); color: var(--ink); isolation: isolate; }
.page-blocks .dv-lane::before { content: ""; position: absolute; inset: 0 0 auto 0; height: .3125rem; background: var(--accent); z-index: 1; }
.page-blocks .dv-lane--r { background: var(--deeper); color: var(--paper); border-left: 1px solid var(--on-dark-line); }
.page-blocks .dv-big { position: absolute; right: .75rem; bottom: -.12em; z-index: -1; font-size: clamp(7.5rem, 16vw, 15rem); font-weight: 800; line-height: 1; letter-spacing: -.04em; color: var(--surface-sunken); pointer-events: none; user-select: none; }
.page-blocks .dv-lane--r .dv-big { color: color-mix(in srgb, var(--paper) 7%, var(--deeper)); }
.page-blocks .dv-ltag { margin: 0; color: var(--accent-ink); font-size: .8125rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.page-blocks .dv-lane--r .dv-ltag { color: var(--accent-dark); }
.page-blocks .dv-lhead { margin: 0; max-width: 14em; font-size: clamp(1.625rem, 2.8vw, 2.5rem); line-height: 1.3; text-wrap: balance; word-break: keep-all; overflow-wrap: anywhere; }
.page-blocks .dv-lane--r .dv-lhead { color: var(--paper); }
.page-blocks .dv-lbody { margin: 0; max-width: 30em; line-height: 1.75; }
.page-blocks .dv-lane--r .dv-lbody { color: var(--muted-on-dark); }
.page-blocks .dv-lgo { display: inline-flex; align-items: center; gap: .625rem; margin-top: auto; min-height: 2.75rem; padding-top: .75rem; color: var(--accent-ink); font-weight: 700; text-decoration: none; }
.page-blocks .dv-lane--r .dv-lgo { color: var(--accent-dark); }
.page-blocks .dv-lgo span { transition: transform .25s var(--ease); }
.page-blocks .dv-lane:hover .dv-lgo span, .page-blocks .dv-lgo:focus-visible span { transform: translateX(.375rem); }
.page-blocks .dv-lgo:focus-visible { outline: 3px solid var(--accent-ink); outline-offset: 4px; }
.page-blocks .dv-lane--r .dv-lgo:focus-visible { outline-color: var(--accent-dark); }
.page-blocks .dv-split { position: absolute; left: 50%; top: 50%; z-index: 2; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin: -1.75rem 0 0 -1.75rem; background: var(--accent); color: var(--accent-on); font-size: .8125rem; font-weight: 800; transform: rotate(45deg); }
.page-blocks .dv-split span { transform: rotate(-45deg); letter-spacing: .02em; }
@media (max-width: 48rem) {
  .page-blocks .dv-lanes { grid-template-columns: minmax(0, 1fr); }
  .page-blocks .dv-lane { min-height: 0; }
  .page-blocks .dv-lane--r { border-left: 0; border-top: 1px solid var(--on-dark-line); }
  .page-blocks .dv-split { display: none; }
  .page-blocks .dv-big { right: 1rem; bottom: .25rem; font-size: 6rem; }
}
@media (prefers-reduced-motion: reduce) { .page-blocks .dv-lgo span { transition: none; } }
html[data-motion="off"] .page-blocks .dv-lgo span { transition: none; }