/* Keep the lower half of the landing page focused on trying the app. */
.speckit-bridge{padding:64px 0 56px}
.speckit-bridge-inner{gap:32px 54px}
.speckit-independent{grid-column:1 / -1;margin:0;padding-top:17px;border-top:1px solid #d8e4eb;color:#647c88;font-size:13px;line-height:1.6}
.build-loop{scroll-margin-top:100px}
.loop-label{margin:0}
.founder-story{padding-top:45px}
.config-section{padding:76px 0 82px}
.config-grid{gap:clamp(34px,5vw,68px)}
.config-copy>p:not(.eyebrow){max-width:490px}
.config-links{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:25px}
.config-links a{color:#315f74;font-size:13px;font-weight:700;text-decoration:underline;text-decoration-color:#a9c3cf;text-underline-offset:4px}
.config-links a:hover{color:#183f56;text-decoration-color:currentColor}
.code-window pre{max-height:none;font-size:12px;padding:18px 22px 21px}
.faq{padding-top:83px;padding-bottom:88px}
.preview-note{display:flex;align-items:center;gap:20px;padding-top:23px;padding-bottom:27px;border-top:1px solid #d5e0e6;color:#5f7886}
.preview-note-label{flex:none;color:#597d8f;font-size:10px;font-weight:800;letter-spacing:.15em}
.preview-note p{flex:1;margin:0;font-size:13px;line-height:1.6}
.preview-note a{flex:none;color:#315f74;font-size:13px;font-weight:700;text-decoration:underline;text-decoration-color:#a9c3cf;text-underline-offset:4px}
.preview-note a:hover{text-decoration-color:currentColor}
.hero-star-line{margin:13px auto 0;font-size:12px;font-weight:650}
.hero-star-line a{color:#e8f4f6;text-decoration:underline;text-decoration-color:#9bc2cc;text-underline-offset:4px}
.hero-star-line a:hover{color:#fff;text-decoration-color:currentColor}
.closing-actions{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.closing-star{color:#d6e7ee;font-size:14px;font-weight:700;text-decoration:underline;text-decoration-color:#7e9dad;text-underline-offset:5px}
.closing-star:hover{color:#fff;text-decoration-color:currentColor}
html[data-theme="light"] .hero-star-line a{color:#315f74;text-decoration-color:#a9c3cf}
html[data-theme="light"] .hero-star-line a:hover{color:#183f56;text-decoration-color:currentColor}
html[data-theme="light"] .closing-star{color:#315f74;text-decoration-color:#a9c3cf}
html[data-theme="light"] .closing-star:hover{color:#183f56;text-decoration-color:currentColor}
html[data-theme="dark"] .speckit-independent{border-color:#415b6e;color:#adc3cf}
html[data-theme="dark"] .build-loop,html[data-theme="dark"] .build-loop li,html[data-theme="dark"] .preview-note{border-color:#31495a}
html[data-theme="dark"] .build-loop{color:#e9f2f5}
html[data-theme="dark"] .loop-label,html[data-theme="dark"] .build-loop li span,html[data-theme="dark"] .build-loop li small,html[data-theme="dark"] .preview-note-label,html[data-theme="dark"] .preview-note p{color:#a9bfcb}
html[data-theme="dark"] .config-links a,html[data-theme="dark"] .preview-note a{color:#add5e7;text-decoration-color:#597f90}
html[data-theme="dark"] .config-links a:hover,html[data-theme="dark"] .preview-note a:hover{color:#e5f4f8}
@media(max-width:760px){.speckit-bridge{padding:48px 0}.speckit-independent{grid-column:auto}.preview-note{align-items:flex-start;flex-direction:column;gap:9px}.config-section{padding:68px 0 72px}}

/* Editorial rhythm: section headings share one grid and one label spacing. */
.hero-experience .hero-copy{padding-bottom:44px}
.control-surface-section{padding-top:88px;padding-bottom:76px}
.control-surface-section .hero-project-layer{width:min(1180px,calc(100% - 64px))}
.hero-project-heading{max-width:none;margin:0 0 24px}
.hero-project-heading p.eyebrow{margin:0 0 14px;color:#557788;font-size:10px;font-weight:770;letter-spacing:.17em;line-height:1.4}
.hero-project-heading p:not(.eyebrow){max-width:690px;margin-top:12px;font-size:15px;line-height:1.6}
.tour-section,.get-started-section{padding-top:88px}
.product-section,.features-section{padding-top:88px}
.hero-project-heading .eyebrow,.tour-intro .eyebrow,.get-started-heading>.eyebrow,.features-heading .eyebrow,.speckit-bridge .eyebrow,.founder-story .eyebrow,.config-copy .eyebrow,.faq .eyebrow{margin-bottom:14px}
.feature-meta{min-height:21px}
.feature-meta .feature-status{margin-left:auto}
.feature-legend{margin-top:26px}
html[data-theme="dark"] .hero-project-heading p.eyebrow{color:#a8c4d0}
@media(max-width:700px){
  .hero-option-blueprint .hero-experience .hero-copy{padding-top:85px;padding-bottom:32px}
  .control-surface-section{padding-top:68px;padding-bottom:58px}
  .control-surface-section .hero-project-layer{width:calc(100% - 38px)}
  .tour-section,.get-started-section,.product-section,.features-section{padding-top:68px}
  .hero-project-heading p:not(.eyebrow){font-size:14px}
}

/* The navigation collapses at 900px, so its icon needs the same styling there. */
@media(max-width:900px){
  .menu-toggle{display:flex;flex:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:10px;margin-left:auto;border:1px solid #d7e2e8;border-radius:8px;background:#fff;cursor:pointer}
  .menu-toggle span{display:block;width:100%;height:2px;flex:none;border-radius:2px;background:#344f62}
  .site-nav{top:100%}
  html[data-theme="dark"] .menu-toggle span{background:#d6e5e9}
}