/* VoIP to Horns page: full GITS treatment (page-scoped) */
.vth .panel { position: relative; }
.vth .cpanel::before, .vth .cpanel::after { content: ""; position: absolute; width: 12px; height: 12px; border: 2px solid var(--accent-blue); pointer-events: none; }
.vth .cpanel::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.vth .cpanel::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
.vth .sec-tag { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); display: flex; justify-content: space-between; border-bottom: 1px dashed var(--border-dashed); padding-bottom: 6px; margin-bottom: 14px; }
.vth .sec-tag b { color: var(--accent-blue); font-weight: 700; }
.vth .hero h1 { font-size: clamp(26px, 4vw, 40px); letter-spacing: .02em; text-transform: uppercase; }
.vth .hero .lead { max-width: 62ch; margin-top: 10px; }
.vth .telemetry { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 18px; border: 1px solid var(--border-light); }
.vth .telemetry div { padding: 10px 12px; border-right: 1px dotted var(--border-main); }
.vth .telemetry div:last-child { border-right: 0; }
.vth .telemetry span { display: block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.vth .telemetry strong { font-size: 13px; color: var(--text-dark); }
.vth .problems { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.vth .prob { border: 1px solid var(--border-main); background: var(--panel-bg); padding: 16px; position: relative; }
.vth .prob .idx { font-size: 10px; color: var(--accent-red); letter-spacing: .14em; }
.vth .prob h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; margin: 8px 0; }
.vth .prob p { font-size: 13px; color: var(--text-muted); line-height: 1.55; }
.vth .prob .fix { margin-top: 10px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-green); }
.vth .flow > svg { width: 100%; height: auto; display: block; }
.vth .flow .wire { stroke: var(--accent-blue); stroke-width: 1.5; stroke-dasharray: 6 6; fill: none; animation: vth-wire 1.2s linear infinite; }
.vth .flow .node { fill: var(--panel-bg-solid); stroke: var(--border-main); }
.vth .flow text { font-family: var(--font-mono); font-size: 11px; fill: var(--text-dark); letter-spacing: .08em; }
.vth .flow .sub { fill: var(--text-muted); font-size: 9px; }
.vth .flow .pulse { fill: var(--accent-green); animation: vth-blink 1.6s ease-in-out infinite; }
@keyframes vth-wire { to { stroke-dashoffset: -12; } }
@keyframes vth-blink { 50% { opacity: .25; } }
.vth .feat { list-style: none; }
.vth .feat li { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px dotted var(--border-main); font-size: 13px; }
.vth .feat li:last-child { border-bottom: 0; }
.vth .feat .k { color: var(--accent-blue); min-width: 34px; font-size: 11px; }
.vth .feat .ok { margin-left: auto; color: var(--accent-green); font-size: 10px; letter-spacing: .12em; }
@media (max-width: 820px) { .vth .problems, .vth .telemetry { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .vth .problems, .vth .telemetry { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .vth .flow .wire, .vth .flow .pulse { animation: none; } }
/* fix: base .panel::before fills a square; make ours a true bracket */
.vth .cpanel::before { background: transparent; width: 12px; height: 12px; }
.vth .desc-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.vth .desc-grid .lead { max-width: none; }
.vth .readout { border-left: 1px dashed var(--border-dashed); padding-left: 20px; }
.vth .readout div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dotted var(--border-main); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.vth .readout div:last-child { border-bottom: 0; }
.vth .readout span { color: var(--text-muted); }
.vth .readout b { color: var(--accent-blue); font-weight: 700; text-align: right; }
@media (max-width: 820px) { .vth .desc-grid { grid-template-columns: 1fr; } .vth .readout { border-left: 0; padding-left: 0; border-top: 1px dashed var(--border-dashed); padding-top: 10px; } }
/* interactive signal path */
.vth .flow .zone { cursor: pointer; outline: none; }
.vth .flow .zone:hover .node, .vth .flow .zone:focus-visible .node { stroke: var(--accent-blue); }
.vth .flow .zone:focus-visible .node { stroke-width: 2; }
.vth .flow .wire, .vth .flow .dev, .vth .flow .zone { transition: opacity .25s; }
.vth .flow .has-sel .wire:not(.on), .vth .flow .has-sel .dev:not(.on), .vth .flow .has-sel .zone:not(.on) { opacity: .18; }
.vth .flow .has-sel .wire.on { stroke-width: 2.2; }
.vth .flow .has-sel .wire:not(.on) { animation: none; }
.vth .flow .zone.on .node, .vth .flow .dev.on .node { stroke: var(--accent-blue); stroke-width: 2; fill: var(--accent-blue-trans); }
.vth .flow .has-sel .dev:not(.on) .pulse { animation: none; fill: var(--border-main); }
.vth .flow-hint { margin-top: 10px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-blue); }
/* align signal path with style guide ch.13 Tactical Schematics (.sch) */
.vth .flow > svg * { vector-effect: non-scaling-stroke; }
.vth .flow .wire { stroke-width: 1; stroke-dasharray: 4 4; animation: vth-wire 0.8s linear infinite; }
@keyframes vth-wire { to { stroke-dashoffset: -8; } }
.vth .flow .node { fill: var(--panel-bg-solid); stroke: var(--border-main); stroke-width: 1; }
.vth .flow text { font-size: 10px; letter-spacing: .6px; text-transform: uppercase; fill: var(--text-dark); }
.vth .flow .sub { font-size: 8px; fill: var(--text-muted); }
.vth .flow .zone:hover .node { stroke-width: 2.25; }
.vth .flow .has-sel .wire.on { stroke-width: 2; stroke-dasharray: none; animation: none; }
.vth .flow .zone.on .node, .vth .flow .dev.on .node { fill: var(--accent-blue-trans); stroke: var(--accent-blue); stroke-width: 1.5; }
.vth .sch-legend { display: flex; flex-wrap: wrap; gap: 10px 14px; font-size: 10px; color: var(--text-muted); letter-spacing: .08em; text-transform: uppercase; margin-top: 10px; }
.vth .sch-legend span { display: inline-flex; align-items: center; gap: 5px; }
.vth .sch-legend svg { width: 14px; height: 10px; overflow: visible; }
/* Demo button */
.vth .demo-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--border-dashed); }
.vth .demo-tag { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-blue); font-weight: 700; }
.vth .demo-note { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
/* wide screens: boxes keep laptop size, lines stretch (layout in page script) */
.vth .flow > svg { width: 100%; height: auto; margin-top: 4px; }
.vth .flow .flow-hint, .vth .flow .sch-legend { margin-left: 0; margin-right: 0; }

/* Demo button = kit .btn.btn-primary (guide-aligned 2026-10-16); only focus outline + phone width kept */
.vth .btn-demo{font-weight:400}
.vth .btn-demo:focus-visible{outline:1px dashed var(--accent-blue);outline-offset:3px}
@media (max-width:560px){.vth .btn-demo{width:100%;justify-content:center}.vth .demo-cta{flex-direction:column;align-items:stretch;text-align:center}}

/* FAQ styles (restored 2026-10-16; previously lived in vth-restyle.css, unlinked when A/B were removed) */
.vth .faq .faq-list details { border-bottom: 1px dotted var(--border-main); }
.vth .faq .faq-list details:last-child { border-bottom: 0; }
.vth .faq summary { list-style: none; cursor: pointer; display: flex; gap: 10px; align-items: baseline; padding: 10px 0; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-dark); line-height: 1.5; }
.vth .faq summary::-webkit-details-marker { display: none; }
.vth .faq summary::before { content: "[+]"; color: var(--accent-blue); flex: none; font-weight: 700; }
.vth .faq details[open] summary { color: var(--accent-blue); }
.vth .faq details[open] summary::before { content: "[\2212]"; }
.vth .faq summary:hover, .vth .faq summary:focus-visible { color: var(--accent-blue); outline: none; }
.vth .faq summary:focus-visible::before { outline: 1px dashed var(--accent-blue); outline-offset: 2px; }
.vth .faq details p { margin: 0 0 12px 34px; font-size: 13px; line-height: 1.55; color: var(--text-muted); }
@media (max-width: 520px) { .vth .faq details p { margin-left: 0; } }
.vth .faq .faq-list details > p { font-size: 12px; line-height: 1.6; max-width: 62ch; }

/* Phone-only signal path: Stacked diagram (Vladimir 2026-10-16). Desktop unchanged. */
.vth .flow .vth-stack{display:none}
@media (max-width:560px){
.vth .flow .vth-stack{display:block}
.vth .flow .skin-c[data-opt="C"]{display:none}
.vth .vth-stack .s-host svg{width:100%;height:auto;display:block}
.vth .vth-stack .s-host svg *{vector-effect:non-scaling-stroke}
.vth .vth-stack .s-hint{color:var(--accent-blue)}
.vth .vth-stack .s-head{font-size:9px;letter-spacing:1.4px;font-weight:700;fill:var(--text-muted)}
.vth .vth-stack .s-head-z{fill:var(--accent-blue)}
.vth .vth-stack .s-div{stroke:var(--border-main);stroke-dasharray:4 4}
.vth .vth-stack .zone{-webkit-tap-highlight-color:transparent}
.vth .vth-stack .zone:not(.on) .node{stroke:var(--border-main);stroke-dasharray:none}
.vth .vth-stack .s-go{font-size:9px;fill:var(--accent-blue)}
.vth .vth-stack .dev{pointer-events:none;cursor:default;-webkit-tap-highlight-color:transparent}
.vth .vth-stack .dev:not(.on) .node{fill:transparent;stroke:var(--border-light);stroke-dasharray:1 3}
.vth .flow .skin-c.vth-stack .dev.on .node{fill:transparent;stroke:var(--accent-green);stroke-width:1;stroke-dasharray:3 3}
.vth .flow .skin-c.vth-stack .has-sel .zone:not(.on){opacity:.75}
}

/* Signal path device icons (Vladimir 2026-10-16): icon replaces status dot + rings; green when live. */
.vth .flow .dev .pulse,.vth .flow .dev .c-ring{display:none}
.vth .flow .dev-ico{color:var(--text-muted);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square;stroke-linejoin:miter;transition:color .25s}
.vth .flow .dev-ico .dev-ico-fill{fill:currentColor;stroke:none}
.vth .flow .dev.on .dev-ico{color:var(--accent-green)}

/* 5-cell telemetry strip: last cell spans the row in the 2-column layout (Vera 2026-10-19). */
.vth .telemetry.tel-vth { grid-template-columns: 2fr 1fr 1fr 2fr 1fr; }
@media (max-width: 820px) { .vth .telemetry.tel-vth { grid-template-columns: 1fr 1fr; } .vth .telemetry.tel-vth div:last-child { grid-column: 1 / -1; } }
@media (max-width: 520px) { .vth .telemetry.tel-vth { grid-template-columns: 1fr; } .vth .telemetry.tel-vth div:last-child { grid-column: auto; } }