/* Feature / plugin pages built from map v10 (/dwg-editor, /vitruvius): hero sheet, tool cards, the demo dialog. Tokens only. */
.hero-sheet { display: grid; grid-template-columns: 1fr minmax(120px, 240px); gap: var(--vit-space-6); align-items: center; }
.hero-sheet h1 { margin-top: 0; }
.hero-sheet .lead { font-size: clamp(17px, 2vw, 20px); color: var(--vit-ink-2); }
.zone-ctas { display: flex; flex-wrap: wrap; gap: var(--vit-space-3); align-items: center; margin: var(--vit-space-4) 0; }
.cta-note { font-size: 14px; color: var(--vit-ink-2); }
@media (max-width: 640px) { .hero-sheet { grid-template-columns: 1fr; } .hero-sheet .draft { max-width: 160px; } }

.tools-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: var(--vit-space-4); }
.tool-card { max-width: none; display: grid; align-content: start; gap: var(--vit-space-2); padding: var(--vit-space-4); border: 1px solid var(--vit-ink); border-radius: var(--vit-r-sm); background: var(--vit-paper); }
.tool-card h3 { margin: 0; font-size: 18px; }
.tool-card p { margin: 0; font-size: 14.5px; color: var(--vit-ink-2); }
.tool-card .ficon { width: 32px; height: 32px; }
.tool-links { display: flex; flex-wrap: wrap; gap: var(--vit-space-3); align-items: center; font-size: 14px; }
.demo-open { font: inherit; font-weight: 500; padding: var(--vit-space-1) var(--vit-space-3); border: 1px solid var(--vit-ink); border-radius: var(--vit-r-sm); background: var(--vit-paper-2); color: var(--vit-ink); cursor: pointer; }
html.js .demo-open[hidden] { display: inline-block; }
.demo-dialog { max-width: min(960px, 94vw); width: 100%; padding: var(--vit-space-5); border: 2px solid var(--vit-ink); border-radius: var(--vit-r-sm); background: var(--vit-paper); color: var(--vit-ink); box-shadow: 6px 6px 0 var(--vit-ink); }
.demo-dialog::backdrop { background: color-mix(in srgb, var(--vit-ink) 55%, transparent); }
.demo-dialog h3 { margin-top: 0; }
.demo-figs { display: grid; grid-template-columns: 1fr 1fr; gap: var(--vit-space-3); }
.demo-figs figure { margin: 0; }
.demo-figs img { display: block; width: 100%; height: auto; border: 1px solid var(--vit-line-strong); }
.demo-figs figcaption { font-size: 13px; color: var(--vit-ink-2); }
@media (max-width: 640px) { .demo-figs { grid-template-columns: 1fr; } }

/* home */
.problem-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--vit-space-2); }
.problem-list li { max-width: none; padding: var(--vit-space-2) var(--vit-space-3); border-bottom: 1px solid var(--vit-line-default); }
.trust-line { font-size: 18px; font-weight: 500; }
.layers-table { width: 100%; }
.layers-table th, .layers-table td { border-bottom: 1px solid var(--vit-line-default); }
.layers-table thead th { font-family: var(--vit-f-heb); font-size: 14px; border-bottom: 2px solid var(--vit-ink); }

/* a Latin run inside a Hebrew heading may wrap at its spaces on a narrow screen (no sideways scroll at 375) */
main[data-page] h1 bdi, main[data-page] h2 bdi { display: inline; white-space: normal; overflow-wrap: break-word; }

/* one consistent vertical rhythm for the pages built from map v10: every top-level section/sheet is separated by the same gap; the old design-10 zone padding and rule are off */
main[data-page] { display: flex; flex-direction: column; gap: var(--vit-space-6); padding-block: var(--vit-space-5) var(--vit-space-7); }
main[data-page] > section, main[data-page] > .sheet-row, main[data-page] > .sheetframe, main[data-page] > .glass-section { margin-block: 0; }
main[data-page] > [data-zone]:not(.hero):not(.band) { padding-block: 0; border-top: 0; }   /* same specificity as the design-10 rule it switches off */
main[data-page] > [data-zone]:not(.hero):not(.band) h2 { font-size: 18px; margin-top: 0; }
main[data-page] > .sheetframe { margin: 0; }
main[data-page] > .featuregrid, main[data-page] > .checkribbon { margin: 0; }
.sheetsec .checkribbon { margin: 0 0 var(--vit-space-5); }

/* feature pages that are not out yet */
.soon-badge { display: inline-block; padding: 0 var(--vit-space-3); border: 1px solid var(--vit-ink); border-radius: var(--vit-r-pill); background: var(--vit-paper-2); font-size: 13px; font-weight: 700; vertical-align: middle; }
.tools-grid.is-plain .tool-card { align-content: start; }
.name-line { font-size: clamp(20px, 2.4vw, 26px); font-weight: 700; margin: 0; }