/* studio.css — /studio (CadCraft Studio). Loaded after product.css; rem sizes, tokens only. */

/* A wider sheet for the product page (owner, 2026-10-14): site.css sizes .container from --container. */
.page-studio { --container: 90rem; }

/* Feature headings: a hollow ink square (layer colours belong to the apps; Studio is all of them, so none). */
.page-studio .highlights .highlight h3::before { border: var(--pen-2) solid var(--ink); background: transparent; }

.studio-preview-note { background: var(--sheet-2); border-bottom: var(--pen-1) dashed var(--line); }
.studio-preview-note p { margin: 0; padding: .6rem 0; font-size: var(--fs-sm); }

.studio-hero-note { margin-top: .75rem; font-size: var(--fs-sm); }

/* The home screen: one image per theme, shown by the page's space (paper is the default). */
.studio-shot { margin: 0; }
.studio-shot img { display: block; width: 100%; height: auto; border: var(--pen-2) solid var(--ink); border-radius: var(--radius); }
.studio-shot-model { display: none !important; }
html[data-space="model"] .studio-shot-paper { display: none !important; }
html[data-space="model"] .studio-shot-model { display: block !important; }
.studio-shot figcaption { margin-top: .6rem; color: var(--ink-2); font-size: var(--fs-sm); }

/* Studio Live */
.studio-live-h { font-size: var(--fs-xl); margin-bottom: .75rem; }
.studio-live-points { list-style: none; margin: 0; padding: 0; border-top: var(--pen-1) solid var(--line); }
.studio-live-points li { padding: .6rem 0 .6rem 1.4rem; border-bottom: var(--pen-1) solid var(--grid); position: relative; }
.studio-live-points li::before { content: ""; position: absolute; left: .2rem; top: 1.05rem; width: .55rem; height: .55rem; border: var(--pen-2) solid var(--action); }
.studio-ways { display: grid; gap: 1.5rem; margin-top: 2rem; }
@media (min-width: 768px) { .studio-ways { grid-template-columns: 1fr 1fr; } }
.studio-way h3 { font-size: var(--fs-lg); margin-bottom: .75rem; }
.studio-way-facts { margin: 0 0 .75rem; border-top: var(--pen-1) solid var(--line); }
.studio-way-facts > div { display: grid; grid-template-columns: 8rem minmax(0, 1fr); border-bottom: var(--pen-1) solid var(--grid); }
.studio-way-facts dt { padding: .4rem 0; color: var(--ink-2); font-weight: 600; font-size: var(--fs-sm); }
.studio-way-facts dd { margin: 0; padding: .4rem 0; font-weight: 600; }
.studio-way p:last-child { margin-bottom: 0; }

/* Questions */
.studio-faq { margin: 0; border-top: var(--pen-2) solid var(--ink); }
.studio-faq > div { padding: 1rem 0; border-bottom: var(--pen-1) solid var(--grid); }
@media (min-width: 768px) { .studio-faq > div { display: grid; grid-template-columns: 4fr 8fr; gap: 2rem; } }
.studio-faq dt { font-weight: 700; font-stretch: 112%; }
.studio-faq dd { margin: .35rem 0 0; }
@media (min-width: 768px) { .studio-faq dd { margin: 0; } }