/* home.css: homepage layout only. Colors, type and components come from
   ds/tokens/logmem.css and ds/components/bundle.css (lm-* classes). */

.home{overflow-x:hidden}
.home main{display:block}
.home section[id],.home #connect{scroll-margin-top:80px}

/* header */
.h-header{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:var(--z-sticky)}
.h-header-in{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;padding-top:12px;padding-bottom:12px}
.h-logo{display:flex}
.h-logo img{height:30px;width:auto}
.h-nav{display:flex;flex-wrap:wrap;gap:4px 20px;font-size:14px;font-weight:500}
.h-nav a{color:var(--text-muted);text-decoration:none;padding:4px 0}
.h-nav a:hover{color:var(--text)}
.h-header-cta{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.home .lm-btn{text-decoration:none}
.h-btn-lg{height:44px;padding:0 18px;font-size:15px}

/* shared section rhythm */
.h-section{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:48px}
.h-band{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.h-section-head{display:flex;flex-direction:column;gap:12px;max-width:68ch}
.h-h2{font-size:44px;color:var(--text)}
.h-sub{margin:0;font-size:18px;line-height:28px;color:var(--text-muted)}
.h-brand{color:var(--brand)}
.h-note{font-size:13px;line-height:19px;color:var(--text-subtle)}
.h-fine{margin:0;font-size:13px;color:var(--text-subtle)}

/* hero */
.h-hero{padding-top:72px;padding-bottom:72px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center}
.h-hero-copy{display:flex;flex-direction:column;gap:22px;min-width:0}
.h-h1{font-size:68px;color:var(--text)}
.h-lede{margin:0;font-size:19px;line-height:30px;color:var(--text-muted);max-width:54ch}
.h-cta-row{display:flex;flex-wrap:wrap;gap:10px}

/* connect block */
.h-connect{min-width:0;box-shadow:var(--shadow-2);display:flex;flex-direction:column}
.h-connect-head{padding:18px 20px 4px;display:flex;flex-direction:column;gap:4px}
.h-connect-sub{margin:0;font-size:13px;color:var(--text-muted)}
.h-tabs{padding:0 20px;gap:20px}
.h-tabs .lm-tab{padding:12px 0 10px;font-size:14px}
.h-tabpanel{padding:16px 20px 20px;display:flex;flex-direction:column;gap:10px;min-width:0}
.h-tabpanel[hidden]{display:none}
.h-snip-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;min-width:0}
.h-snip-meta .lm-eyebrow{overflow-wrap:anywhere}
.h-code{margin:0;padding:14px 16px;background:var(--surface-sunken);border:1px solid var(--border);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:12.5px;line-height:20px;color:var(--text);white-space:pre;overflow-x:auto;min-width:0;max-width:100%;tab-size:2}
.h-c-ph{color:var(--brand);font-weight:500}
.h-c-dim{color:var(--text-subtle)}
.h-snip-foot{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.h-snip-foot .h-note{flex:1 1 220px;padding-top:2px}
.h-copy[data-done]{border-color:var(--brand);color:var(--brand)}

/* proof strip */
.h-proof{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.h-proof-list{list-style:none;margin-top:0;margin-bottom:0;padding-top:24px;padding-bottom:24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.h-proof-list li{display:flex;gap:12px;align-items:flex-start;min-width:0}
.h-proof-list .lm-i{color:var(--brand);margin-top:2px}
.h-proof-list strong{display:block;font-size:15px;line-height:22px;font-weight:600;color:var(--text)}
.h-proof-sub{display:block;font-size:13px;line-height:19px;color:var(--text-muted)}

/* demo */
.h-demo{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:40px;align-items:start}
.h-beats-col{display:flex;flex-direction:column;gap:16px;min-width:0;position:sticky;top:88px}
.h-beats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.h-beat{width:100%;display:flex;gap:12px;align-items:flex-start;text-align:left;padding:10px 12px;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text);font:inherit;cursor:pointer}
.h-beat:hover{background:var(--surface-sunken)}
.h-beat strong{display:block;font-size:15px;font-weight:600}
.h-beat-sub{display:block;font-size:13px;line-height:18px;color:var(--text-muted)}
.h-beat-n{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-mono);font-size:12px;font-weight:500;border:1.5px solid var(--border-strong);color:var(--text-muted);margin-top:1px;transition:background var(--duration-base) var(--ease-standard),color var(--duration-base)}
.h-beat[data-state="done"] .h-beat-n{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.h-beat[aria-current="step"]{background:var(--brand-subtle)}
.h-beat[aria-current="step"] .h-beat-n{border:2px solid var(--brand);color:var(--brand);background:var(--surface)}
.h-demo-ctl{display:flex;gap:8px;flex-wrap:wrap;padding-left:12px}
.h-beat-caption{margin:0;padding-left:12px;font-size:13px;line-height:19px;color:var(--text-muted);min-height:38px}
.h-demo-frame{min-width:0}
.h-demo-panel{overflow:hidden}
.h-log{height:560px;overflow-y:auto;padding:4px 20px 20px;display:flex;flex-direction:column}
.h-log:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.h-noscript{padding:16px 0;margin:0}
.h-log>*{flex:none}
.h-in{animation:h-in var(--duration-slow) var(--ease-carry) both}
@keyframes h-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.h-log .lm-session{padding-top:14px}
.h-log .lm-event-line strong{font-size:14px}
.h-by{color:var(--text-muted);font-weight:400;font-size:13px}
.h-cmd{margin:10px 0 6px 88px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-sunken);font-family:var(--font-mono);font-size:13px;line-height:20px;color:var(--text)}
.h-cmd-who{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.h-cmd-txt::before{content:"> ";color:var(--brand)}
.h-caret{display:inline-block;width:7px;height:15px;background:var(--brand);vertical-align:-2px;margin-left:2px;animation:h-blink 1s steps(1) infinite}
@keyframes h-blink{50%{opacity:0}}
.h-ask{margin:6px 0 8px 88px}
.h-ask .lm-approval-head strong{font-size:14px;line-height:20px}
.h-ask .lm-approval-foot{align-items:center}
.h-ask .lm-approval-foot[hidden]{display:none}
.h-ask .h-wait{font-size:12px;color:var(--text-muted);margin-left:auto}
.h-ask-status{margin-left:auto}

/* how it works */
.h-phases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.h-phase{padding:24px;display:flex;flex-direction:column;gap:12px}
.h-phase p,.h-case p,.h-trust-item p,.h-switch p{margin:0;color:var(--text-muted)}
.h-call{margin-top:auto;font-family:var(--font-mono);font-size:13px;background:var(--surface-sunken);border-radius:var(--radius-sm);padding:8px 10px;color:var(--text);overflow-wrap:anywhere}
.h-switch{padding:24px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}
.h-switch-copy{display:flex;flex-direction:column;gap:8px}
.h-switch-vis{min-width:0}

/* avatars on viz colors: on-brand ink reads in both themes */
.home .lm-avatar{color:var(--on-brand)}
.home .lm-avatar[data-human]{color:var(--decision)}
.h-av-1{background:var(--viz-1)}.h-av-2{background:var(--viz-2)}.h-av-3{background:var(--viz-3)}.h-av-4{background:var(--viz-6)}

/* use cases */
.h-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.h-case{padding:24px;display:flex;flex-direction:column;gap:12px}
.h-case-vis{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:40px;padding-bottom:12px;border-bottom:1px dashed var(--border)}
.h-space{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:var(--radius-sm);border:1px solid var(--border-strong);font-size:12px;color:var(--text)}
.h-ticks{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--text)}
.h-ticks li{display:flex;gap:8px;align-items:baseline}
.h-ticks li::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--brand);transform:translateY(-1px)}

/* trust */
.h-trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.h-trust-item{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:2px solid var(--brand);min-width:0}
.h-prov-sample{margin:0;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px;line-height:18px;color:var(--text);background:var(--surface-sunken);border-radius:var(--radius-sm);padding:8px 10px}
.h-prov-sample span+span{color:var(--text-muted)}
.h-specs{font-size:15px;gap:12px 24px;padding:24px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface)}

/* acmi */
.h-acmi{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;align-items:center}
.h-acmi-copy{display:flex;flex-direction:column;gap:16px;min-width:0}
.h-acmi-fig{margin:0;display:flex;flex-direction:column;gap:8px;min-width:0}

/* updates */
.h-updates{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:end;padding-top:80px;padding-bottom:80px}
.h-updates-copy{display:flex;flex-direction:column;gap:10px}
.h-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;min-width:0}
.h-form-field{flex:1 1 240px;min-width:0}
.h-form-field .lm-input{width:100%}
.h-form-msg{flex:1 1 100%;margin:0;font-size:13px;color:var(--text-muted)}

/* footer */
.h-footer{border-top:1px solid var(--border);background:var(--surface);font-size:14px}
.h-footer-in{padding-top:48px;padding-bottom:32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:32px}
.h-footer-brand{display:flex;flex-direction:column;gap:12px;color:var(--text-muted)}
.h-footer-brand img{width:28px;height:28px}
.h-footer-brand p{margin:0;line-height:22px}
.h-footer-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.h-footer-cols h2{margin:0 0 12px}
.h-footer-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.h-footer-cols a{color:var(--text);text-decoration:none}
.h-footer-cols a:hover{color:var(--link);text-decoration:underline}
.h-soon{color:var(--text-subtle)}
.h-soon em{font-style:normal;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-left:4px}
.h-footer-base{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:24px;border-top:1px solid var(--border);font-size:13px;color:var(--text-muted)}
.h-footer-base img{height:18px;width:auto}

/* responsive */
@media (max-width:1023px){
  .h-hero{grid-template-columns:minmax(0,1fr);gap:40px;padding-top:56px}
  .h-demo{grid-template-columns:minmax(0,1fr);gap:20px}
  .h-beats-col{position:static}
  .h-beats{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:6px}
  .h-beat{padding:8px 10px;border:1px solid var(--border);align-items:center;gap:8px}
  .h-beat strong{font-size:14px}
  .h-beat-sub{display:none}
  .h-demo-ctl,.h-beat-caption{padding-left:0}
  .h-beat-caption{min-height:0}
  .h-phases,.h-cases{grid-template-columns:minmax(0,1fr)}
  .h-trust{grid-template-columns:repeat(2,minmax(0,1fr))}
  .h-acmi,.h-updates,.h-switch{grid-template-columns:minmax(0,1fr)}
  .h-footer-in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
  .wrap{padding-left:16px;padding-right:16px}
  .h-nav{order:3;flex:1 1 100%;gap:4px 16px}
  .h-header{position:static}
  .h-header-cta .lm-btn{height:34px;padding:0 10px;font-size:13px}
  .h-h1{font-size:44px!important}
  .h-h2{font-size:32px!important}
  .h-lede{font-size:17px;line-height:27px}
  .h-section{padding-top:64px;padding-bottom:64px;gap:32px}
  .h-proof-list{grid-template-columns:minmax(0,1fr);gap:16px}
  .h-trust{grid-template-columns:minmax(0,1fr)}
  .h-tabs{padding:0 16px;gap:16px}
  .h-tabpanel,.h-connect-head{padding-left:16px;padding-right:16px}
  .h-log{height:520px;padding:4px 12px 16px}
  .h-log .lm-event{grid-template-columns:44px 3px minmax(0,1fr);gap:0 10px}
  .h-cmd,.h-ask{margin-left:0}
  .h-footer-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .h-btn-lg{flex:1 1 auto}
}

@media (max-width:479px){.h-header-cta .lm-btn--primary{display:none}}

@media (prefers-reduced-motion:reduce){
  .h-in{animation:none}
  .h-caret{animation:none}
}