/* Venous leak treatment page styles.
   Reuses the quiz chrome from page-male-infertility.css, the estimator layout
   and .vr-overview photo from page-vasectomy-reversal.css, and the nowrap,
   six-card and alternating-background helpers from page-micro-tese.css. */

/* Square corners on every box in the page body (hero form, cards, tabs,
   images, tool, price table, FAQ). Header and footer keep their own styles. */
.vl-page,.vl-page *,.vl-page *::before,.vl-page *::after{border-radius:0 !important}

/* Diagrams carry labels near their edges: show them whole, never cropped. */
.vl-page .vl-diagram{background:#fff;border:1px solid var(--c-line)}
.vl-page .vl-diagram img{display:block;width:100%;height:auto}
.vl-overview .svc-two-col{align-items:center}

/* Diagnosis section: diagram beside the test list on desktop, stacked on mobile. */
.vl-diag-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.vl-diag-grid .def-list{margin:0}
@media (max-width:900px){.vl-diag-grid{grid-template-columns:1fr;gap:28px}}

/* Treatment Finder: three questions, one recommendation. */
.est-body .vl-opts-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:700px){.est-body .vl-opts-3{grid-template-columns:1fr}}
.vl-result-title{margin:0 0 6px;font-family:var(--font-display);font-size:26px;line-height:1.25;color:var(--qc-dark)}
.vl-result-kicker{display:block;margin-bottom:6px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-text-muted)}
.vl-result-price{margin:0 0 14px;font-size:15px;color:var(--c-text-soft)}
.vl-result-price strong{color:var(--qc-dark)}

/* Price table: highlight the Turkey column and keep it readable on phones. */
.vl-page .price-td-turkey{font-weight:700}
.vl-price-note{max-width:820px;margin:24px auto 0;font-size:15px;color:var(--c-text-soft);text-align:center}
.vl-saving{display:block;margin-top:4px;font-size:12px;font-weight:600;color:#2f7d4a}

/* Links inside card text and plain paragraphs read as links, like the overview copy. */
.vl-page .def-list dd a,.vl-page .svc-section > .container > p a{color:var(--c-primary-700);text-decoration:underline;text-underline-offset:2px}

/* Phones see only the Turkey column at first; hint that the table scrolls. */
.vl-swipe{display:none;margin:0 0 10px;font-size:13px;color:var(--c-text-muted);text-align:right}
@media (max-width:760px){.vl-swipe{display:block}}