/* Editorial layouts composed from the existing semantic tokens and site controls. */
.guide-main { max-width: 1040px; margin-inline: auto; padding-bottom: var(--space-10); }
.guide-main .browse-intro { display: block; max-width: 820px; }
.guide-main .browse-intro h1 { margin-top: var(--space-4); font-size: var(--font-size-hero-small); }
.guide-main .browse-intro p { font-size: var(--font-size-card); line-height: var(--leading-read); }
.guide-main .section { margin-top: var(--space-10); }
.guide-main .section h2 { margin-bottom: var(--space-5); }
.guide-main p,.guide-main li { line-height: var(--leading-read); }
.guide-main .prose a:not(.btn) { text-decoration: underline; text-underline-offset: var(--space-1); }
.guide-main .guide-result { padding: var(--space-8); border-radius: var(--radius-panel); background: var(--yellow-soft); border: 1px solid var(--line); }
.guide-result h2 { margin-block: var(--space-3) var(--space-5); }
.guide-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-6); }
.guide-grid .about-card { background: var(--card); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.guide-grid .about-card h3 { margin: 0; font-size: var(--font-size-h3); }
.guide-grid .about-card p { margin: 0; }
.guide-grid .about-card .text-link { margin-top: auto; white-space: normal; }
.guide-meta { color: var(--sub); font-size: var(--font-size-small); }
.guide-main section[id],.guide-main article[id] { scroll-margin-top: calc(var(--control-primary) + var(--space-7)); }
.guide-main .guide-compare { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-5); }
.guide-compare dl { margin: 0; border: 1px solid var(--line); padding: var(--space-6); border-radius: var(--radius-card); }
.guide-compare dt { font-weight: var(--weight-strong); color: var(--ink); }
.guide-compare dd { margin: var(--space-2) 0 var(--space-5); }
.guide-compare dd:last-child { margin-bottom: 0; }
.guide-main details { border-bottom: 1px solid var(--line); padding-block: var(--space-5); }
.guide-main summary { min-height: var(--control-touch); cursor: pointer; font-weight: var(--weight-bold); color: var(--ink); }
.guide-tool { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-7); align-items: start; }
.guide-form { display: grid; gap: var(--space-5); padding: var(--space-7); border: 1px solid var(--line); border-radius: var(--radius-card); }
.guide-form label { display: grid; gap: var(--space-2); font-weight: var(--weight-bold); }
.guide-form input:disabled { background: var(--canvas); color: var(--sub); }
.guide-form .guide-checkbox { display: flex; align-items: center; gap: var(--space-3); min-height: var(--control-touch); }
.guide-amount { color: var(--ink); font-weight: var(--weight-heavy); font-size: var(--font-size-hero-small); margin-block: var(--space-3); }
.guide-error { color: var(--red-ink); }
.guide-main .about-actions { align-items: stretch; }
.guide-poster { width: 1280px; height: 640px; padding: var(--space-13); background: var(--yellow-soft); color: var(--ink); display: flex; flex-direction: column; justify-content: center; gap: var(--space-7); }
.guide-poster h1 { font-size: var(--font-size-hero); max-width: 1100px; }
.guide-poster p { font-size: var(--font-size-title); }
@media(max-width:700px) { .guide-grid,.guide-main .guide-compare,.guide-tool { grid-template-columns: 1fr; } .guide-main .browse-intro h1 { font-size: var(--font-size-section); } .guide-main .guide-result { padding: var(--space-6); } }