/* GENERATED by src/build.py from src/css/hp.css — edit the source, not this file. */
/* CEEZ AI — the homepage (objective → governed AI execution → outcome). Loaded after inner.css / leaders.css.
   Each section has its own visual treatment: the hero is a flow, the problem is two chains, the objective is a console,
   the five stages are a stepper with a different figure each, the objectives are a path, the leaders a strip.
   Type follows the site scale: 12px mono, 15px body, 17px labels, 28px serif. */

/* ── problem: one work item races down two lanes. Without Ceez it waits at every human step; with Ceez it flows through (hp.js) ── */
.hp-fit{--fit-gap:clamp(14px,2.6vh,28px)}
@media(min-width:901px){
  .hp-fit{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:calc(68px + clamp(6px,1.4vh,18px)) clamp(26px,4.6vh,48px)}
  .hp-fit > .inner{width:100%}
  .hp-fit .section-head{margin-bottom:clamp(18px,3.4vh,40px)}
  .hp-fit .section-head .h2{font-size:clamp(30px,min(3.5vw,5.6vh),50px)}
  .hp-fit .section-head .lede{font-size:clamp(15px,min(1.15vw,2vh),18px);line-height:1.5}
  .hp-fit .section-head .tag{margin-bottom:clamp(8px,1.4vh,16px)}
}
.hp-race{display:grid;gap:var(--fit-gap)}
.hp-lane{padding:clamp(14px,2.4vh,26px) clamp(16px,1.8vw,26px) clamp(14px,2.4vh,26px);border:1px solid var(--border);border-radius:var(--r-lg)}
.hp-lane.is-without{background:rgba(255,255,255,.02);border-style:dashed;border-color:var(--border-strong)}
.hp-lane.is-with{background:linear-gradient(180deg,rgb(var(--acc-rgb) / .13),rgb(var(--acc-rgb) / .04));border-color:var(--acc-border)}
.hp-lane-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.hp-lane-k{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.is-with .hp-lane-k{color:var(--acc2)}
.hp-lane-status{font-size:15px;color:var(--muted);text-align:right;transition:color .3s}
.is-with .hp-lane-status.is-final{color:var(--sage)}
.hp-nodes{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;margin-top:clamp(12px,2vh,20px)}
.hp-node{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:clamp(52px,7.2vh,68px);padding:8px 14px;border:1px solid var(--border-strong);border-radius:10px;background:rgba(255,255,255,.03);opacity:.62;transition:opacity .4s,border-color .4s,background .4s,box-shadow .4s,transform .4s}
.hp-node:not(:last-child)::after{content:"";position:absolute;left:100%;top:50%;width:12px;border-top:1px solid var(--border-strong)}
.hp-node b{font-size:15px;font-weight:400;line-height:1.25;color:var(--ink-strong)}
.hp-node em{font-style:normal;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.is-without .hp-node.is-human{border-style:dashed;background:rgba(255,255,255,.015)}
.is-without .hp-node.is-human b{color:var(--muted)}
.is-without .hp-node.is-done{border-color:rgb(var(--acc2-rgb) / .5);background:rgb(var(--acc-rgb) / .1)}
.hp-node.is-done{opacity:1}
.hp-node.is-active{opacity:1;transform:translateY(-3px);border-color:var(--acc2);background:rgb(var(--acc-rgb) / .22);box-shadow:0 0 0 4px rgb(var(--acc-rgb) / .12),0 12px 30px rgba(0,0,0,.35)}
.is-without .hp-node.is-human.is-active{animation:hpWait 1.4s ease-in-out infinite}
@keyframes hpWait{50%{box-shadow:0 0 0 8px rgb(var(--acc-rgb) / .06),0 12px 30px rgba(0,0,0,.35)}}
.is-with .hp-node{border-color:var(--acc-border);background:rgb(var(--acc-rgb) / .08)}
.is-with .hp-node.is-done{border-color:var(--acc-border-strong);background:rgb(var(--acc-rgb) / .16)}
.is-with .hp-node.is-out.is-done{border-color:color-mix(in srgb,var(--sage) 60%,transparent);background:color-mix(in srgb,var(--sage) 14%,transparent)}
.hp-rail2{position:relative;height:2px;margin:clamp(12px,2vh,18px) calc(100% / 14) 0;background:var(--line2);border-radius:2px}
.hp-rail2 i{position:absolute;left:0;top:0;height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,var(--acc),var(--acc2))}
.hp-token{position:absolute;left:0;top:-4px;width:10px;height:10px;margin-left:-5px;border-radius:5px;background:var(--acc2);box-shadow:0 0 14px var(--acc);opacity:0;transition:opacity .3s}
.hp-lane.is-running .hp-token{opacity:1}
.hp-glue{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,4vw,72px);align-items:center;margin-top:clamp(18px,3.4vh,44px)}
.hp-claim{font-family:var(--serif);font-size:clamp(24px,min(2.6vw,4.6vh),38px);line-height:1.08;letter-spacing:-.02em;color:var(--text);text-wrap:balance}
.hp-body{margin-top:14px;max-width:62ch;font-size:15px;line-height:1.6;font-weight:300;color:var(--muted)}
.hp-line{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc2);text-align:center}
.hp-line::before{content:"";position:absolute;left:10%;right:10%;top:7px;border-top:1px dashed var(--acc-border-strong)}
.hp-line li{position:relative;padding-top:30px;opacity:.55;transition:opacity .4s}
.hp-line li.is-on{opacity:1}
.hp-line li::before{content:"";position:absolute;left:50%;top:0;width:15px;height:15px;margin-left:-7px;border-radius:50%;background:var(--bg);border:2px solid var(--acc2)}
.hp-line li.is-on::before{background:var(--acc2)}

/* the objectives note under the carousel */
.hp-note{margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}

/* ── the five stages: a tab row, then one stage at a time: words on the left, its own figure on the right. Fits one screen on desktop. ── */
.hp-system{display:grid;gap:clamp(12px,2vh,22px)}
.hp-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.hp-rail button{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;align-items:baseline;padding:clamp(10px,1.6vh,16px) 16px;text-align:left;font:inherit;color:inherit;cursor:pointer;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.02);transition:border-color .2s,background .2s}
.hp-rail button:hover{border-color:var(--acc-border)}
.hp-rail button[aria-selected="true"]{border-color:var(--acc-border-strong);background:var(--acc-tint)}
.hp-rail .n{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--soft)}
.hp-rail button[aria-selected="true"] .n{color:var(--acc2)}
.hp-rail .t b{display:block;font-size:17px;font-weight:500;color:var(--text)}
.hp-rail .t span{display:block;margin-top:2px;font-size:15px;font-weight:300;color:var(--muted)}
.hp-stage-wrap{padding:clamp(18px,3vh,32px) clamp(20px,2.4vw,36px);min-width:0}
.hp-stage[hidden]{display:none}
.hp-stage{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(20px,3vw,48px);align-items:center;min-height:clamp(320px,44vh,420px)}
.hp-stage > div:first-child{min-width:0}
.js-motion .hp-stage:not([hidden]){animation:hpIn .4s var(--ease)}
@keyframes hpIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hp-h3{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(26px,min(2.8vw,4.8vh),38px);line-height:1.1;letter-spacing:-.015em;color:var(--text);text-wrap:balance}
.hp-body{margin-top:12px;max-width:52ch;font-size:15px;line-height:1.55;font-weight:300;color:var(--muted)}
.hp-strong{margin-top:12px;font-size:16px;font-weight:500;line-height:1.4;color:var(--acc2);max-width:52ch}
.hp-fig{min-width:0;display:flex;justify-content:center}
.hp-fig .wg{margin:0;width:100%}
.hp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.hp-chips li{padding:6px 11px;border:1px solid var(--border-strong);border-radius:var(--r-pill);font-size:14px;color:var(--ink-strong);background:rgba(255,255,255,.02)}
.hp-stage .link{margin-top:16px}
/* FDE: a bracketed list */
.hp-bracket{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);width:100%;align-items:stretch}
.hp-plist{counter-reset:p;display:grid;gap:8px}
.hp-plist li{counter-increment:p;display:flex;align-items:center;gap:12px;padding:9px 14px;border:1px solid var(--border-strong);border-radius:10px;font-size:16px;color:var(--ink-strong);background:rgba(255,255,255,.03)}
.hp-plist li::before{content:"0" counter(p);font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--acc2)}
.hp-brace{display:flex;flex-direction:column;justify-content:center;gap:8px;margin-left:16px;padding:6px 0 6px 20px;border:1px solid var(--acc-border);border-left:0;border-radius:0 14px 14px 0}
.hp-brace-name{font-family:var(--serif);font-size:26px;line-height:1.1;color:var(--text);padding-right:12px}
.hp-brace-def{font-size:14px;line-height:1.5;font-weight:300;color:var(--muted);padding-right:12px}
/* Govern: permission bars */
.hp-perm{display:grid;gap:12px;width:100%}
.hp-perm li{position:relative;display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;align-items:center}
.hp-perm span{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.hp-perm i{display:block;height:28px;width:var(--w,100%);border-radius:8px;background:linear-gradient(90deg,rgb(var(--acc-rgb) / .16),rgb(var(--acc-rgb) / .5));border:1px solid var(--acc-border)}
.hp-perm .is-gate i{width:100%;background:transparent;border:1px dashed var(--acc-border-strong)}
.hp-perm .is-gate em{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-style:normal;font-size:14px;color:var(--acc2)}
.hp-perm .is-gate span{color:var(--acc2)}
/* Prove: an evidence record */
.hp-ledger{width:100%;border:1px solid var(--border-strong);border-radius:12px;background:rgba(0,0,0,.22);overflow:hidden}
.hp-ledger-k{padding:10px 16px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);background:rgba(255,255,255,.02)}
.hp-ledger li{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:4px 16px;padding:10px 16px;border-top:1px solid var(--line)}
.hp-ledger li:first-child{border-top:0}
.hp-ledger li span{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--acc2);padding-top:2px}
.hp-ledger li b{font-size:14px;font-weight:300;line-height:1.45;color:var(--ink-strong)}
html:not(.js) .hp-stage[hidden]{display:grid}

/* ── objectives: one path, five examples ── */
.hp-uc-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(18px,3vw,30px)}
.hp-uc-tabs button{font:inherit;font-size:15px;color:var(--soft);background:rgba(255,255,255,.02);border:1px solid var(--border-strong);border-radius:var(--r-pill);padding:10px 18px;cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.hp-uc-tabs button:hover{color:var(--text)}
.hp-uc-tabs button[aria-selected="true"]{color:var(--text);background:var(--acc-tint);border-color:var(--acc-border)}
.hp-uc-panel[hidden]{display:none}
.js-motion .hp-uc-panel:not([hidden]){animation:hpIn .4s var(--ease)}
.hp-cells{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border:1px solid var(--border-strong);border-radius:var(--r-lg);overflow:hidden}
.hp-cell{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 16px 20px;border-left:1px solid var(--line)}
.hp-cell:first-child{border-left:0}
.hp-cell:not(:last-child)::after{content:"→";position:absolute;right:-9px;top:16px;z-index:2;width:18px;height:18px;display:grid;place-items:center;font-size:13px;color:var(--acc2);background:var(--bg);border:1px solid var(--border-strong);border-radius:50%}
.hp-cell .k{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.hp-cell span:not(.k),.hp-cell b{font-size:15px;line-height:1.5;font-weight:300;color:var(--ink-strong)}
.hp-cell.is-obj{background:rgb(var(--acc-rgb) / .14)}
.hp-cell.is-obj .k{color:var(--acc2)}
.hp-cell.is-obj b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.15;color:var(--text)}
.hp-cell.is-out{background:rgb(var(--acc-rgb) / .08)}
.hp-uc-link{margin-top:20px}
html:not(.js) .hp-uc-panel[hidden]{display:block}

/* ── leaders: one strip ── */
.hp-roles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-block:1px solid var(--border-strong)}
.hp-roles li+li{border-left:1px solid var(--line)}
.hp-roles a{display:flex;flex-direction:column;gap:12px;height:100%;padding:24px 20px;transition:background .2s}
.hp-roles a:hover{background:var(--acc-tint)}
.hp-roles .k{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc2)}
.hp-roles b{font-size:17px;font-weight:400;line-height:1.4;color:var(--ink-strong)}

@media(max-width:1100px){
  .hp-rail{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
  .hp-stage{grid-template-columns:minmax(0,1fr);min-height:0}
  .hp-cells{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hp-cell:nth-child(3n+1){border-left:0}
  .hp-cell:nth-child(n+4){border-top:1px solid var(--line)}
  .hp-cell:nth-child(3n)::after{display:none}
  .hp-roles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hp-roles li:nth-child(odd){border-left:0}
  .hp-roles li:nth-child(n+3){border-top:1px solid var(--line)}
}
@media(max-width:800px){
  .hp-compare,.hp-glue{grid-template-columns:minmax(0,1fr)}
  .hp-bracket{grid-template-columns:minmax(0,1fr)}
  .hp-brace{margin:16px 0 0;padding:14px 0 0 18px;border:0;border-left:1px solid var(--acc-border);border-radius:0}
  .hp-steps li{grid-template-columns:34px minmax(0,1fr)}
  .hp-steps .st{grid-column:2}
  .hp-perm li{grid-template-columns:minmax(0,1fr)}
  .hp-ledger li{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:560px){
  .hp-cells{grid-template-columns:minmax(0,1fr)}
  .hp-cell{border-left:0;border-top:1px solid var(--line)}
  .hp-cell:first-child{border-top:0}
  .hp-cell::after{display:none}
  .hp-roles{grid-template-columns:minmax(0,1fr)}
  .hp-roles li{border-left:0;border-top:1px solid var(--line)}
  .hp-roles li:first-child{border-top:0}
}
@media(prefers-reduced-motion:reduce){.hp-track i,.hp-steps li{transition:none}}

/* ── the home hero: text only, centered ── */
.lh.is-home{min-height:100svh;display:flex;align-items:center;padding-block:calc(68px + clamp(14px,3vh,34px)) clamp(18px,3vh,36px)}
.lh.is-home .inner{width:100%}
.lh.is-text .lh-grid{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
.lh.is-text .lh-copy{display:flex;flex-direction:column;align-items:center;max-width:1040px}
.lh.is-home .tag{letter-spacing:.24em}
.lh.is-home .display{font-size:clamp(44px,6vw,92px);line-height:.98;letter-spacing:-.028em;margin-top:28px;max-width:16ch}
.lh.is-home .lede{margin-top:30px;font-size:clamp(17px,1.35vw,20px);line-height:1.6;max-width:56ch;text-wrap:pretty}
.lh.is-home .cta-row{margin-top:40px;justify-content:center}
@media(max-width:1100px){.lh.is-home{min-height:0}}

/* ── "Start with an objective": a swipeable carousel; each slide is objective → Ceez's four stages → outcome ── */
.ho-carousel{position:relative}
.ho-track{position:relative;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;cursor:grab;touch-action:pan-x pan-y}
.ho-track::-webkit-scrollbar{display:none}
.ho-track.is-drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.ho-track:focus-visible{outline:2px solid var(--acc2);outline-offset:6px;border-radius:14px}
.ho-slide{flex:0 0 100%;scroll-snap-align:center;padding:6px clamp(0px,.8vw,10px) 10px}
.ho-row{display:grid;grid-template-columns:minmax(0,1fr) 44px minmax(0,1.9fr) 44px minmax(0,1fr);align-items:center}
.ho-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft)}
.ho-k{display:inline-flex;align-items:center;gap:8px}
.ho-k img{object-fit:contain}
.ho-k.is-lg{letter-spacing:.24em}
.ho-ask{width:100%;border-radius:20px;border:1px solid rgb(var(--acc2-rgb) / .7);background:color-mix(in srgb,var(--bg) 88%,var(--acc) 6%);box-shadow:0 0 0 4px rgb(var(--acc-rgb) / .14),0 24px 70px rgba(4,6,24,.55);transition:border-color .3s,box-shadow .3s}
.ho-ask .ho-bar{padding:14px 16px 0}
.ho-ask.is-sent{border-color:rgb(var(--acc2-rgb) / .3);box-shadow:0 24px 70px rgba(4,6,24,.55)}
.ho-sent{color:var(--sage);opacity:0;transition:opacity .3s}
.ho-ask.is-sent .ho-sent{opacity:1}
.ho-text{min-height:104px;padding:12px 16px 6px;font-size:18px;line-height:1.45;color:var(--text)}
.ho-caret{display:inline-block;width:2px;height:20px;margin-left:3px;vertical-align:-3px;background:var(--acc2)}
.ho-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px 12px 16px;border-top:1px solid var(--line)}
.ho-pill{display:inline-flex;align-items:center;padding:7px 11px;border-radius:var(--r-pill);border:1px solid var(--border-strong);background:rgba(255,255,255,.04);font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
.ho-pill.is-acc{color:var(--acc2);border-color:var(--acc-border);background:var(--acc-tint)}
.ho-send{margin-left:auto;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgb(var(--acc-rgb) / .28);color:var(--acc2);font-size:17px;transition:background .25s,color .25s,transform .15s}
.ho-send.is-ready{background:var(--acc2);color:var(--bg)}
.ho-send.is-press{transform:scale(.86)}
.ho-send.is-done{background:color-mix(in srgb,var(--sage) 20%,transparent);color:var(--sage)}
/* the wires between the three parts; a pulse (--p, 0→1) travels along them */
.ho-wire{position:relative;width:44px;height:2px;background:linear-gradient(90deg,rgb(var(--acc2-rgb) / .5),rgb(var(--acc2-rgb) / .2))}
.ho-wire.is-out{background:linear-gradient(90deg,rgb(var(--acc2-rgb) / .2),color-mix(in srgb,var(--sage) 40%,transparent))}
.ho-wire i{position:absolute;left:0;top:-4px;width:10px;height:10px;border-radius:5px;background:var(--acc2);box-shadow:0 0 14px var(--acc);opacity:0;transform:translateX(calc(var(--p,0) * 34px))}
.ho-wire.is-out i{background:var(--sage);box-shadow:0 0 14px var(--sage)}
.ho-ceez{width:100%;padding:18px 18px 16px;border-radius:22px;border:1px solid var(--acc-border);background:linear-gradient(170deg,rgb(var(--acc-rgb) / .2),rgb(var(--acc-rgb) / .06));background-color:color-mix(in srgb,var(--bg) 90%,transparent);box-shadow:0 40px 110px rgba(4,6,24,.6),inset 0 1px 0 rgba(255,255,255,.06)}
.ho-phase{color:var(--acc2);transition:color .3s}
.ho-phase.is-done{color:var(--sage)}
.ho-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.ho-step{padding:13px 12px 15px;border-radius:14px;border:1px solid rgb(var(--acc2-rgb) / .22);background:rgba(255,255,255,.025);transition:border-color .35s,background .35s,transform .35s}
.ho-step-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--soft)}
.ho-step-top i{width:7px;height:7px;border-radius:4px;background:var(--faint);opacity:.6;transition:background .3s,box-shadow .3s,opacity .3s}
.ho-step b{display:block;margin-top:12px;font-size:17px;font-weight:500;color:var(--text)}
.ho-step em{display:block;margin-top:3px;font-style:normal;font-size:13px;color:var(--soft)}
.ho-step.is-on{border-color:rgb(var(--acc2-rgb) / .75);background:rgb(var(--acc-rgb) / .22);transform:translateY(-4px)}
.ho-step.is-on .ho-step-top i{background:var(--acc2);box-shadow:0 0 10px var(--acc);opacity:1}
.ho-step.is-done{border-color:color-mix(in srgb,var(--sage) 35%,transparent);background:color-mix(in srgb,var(--sage) 5%,transparent)}
.ho-step.is-done .ho-step-top i{background:var(--sage);opacity:1}
.ho-rail{position:relative;height:2px;margin-top:18px;border-radius:2px;background:rgb(var(--acc2-rgb) / .16)}
.ho-rail i:first-child{position:absolute;left:0;top:0;height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,var(--acc),var(--acc2))}
.ho-rail-dot{position:absolute;left:0;top:-4px;width:10px;height:10px;margin-left:-5px;border-radius:5px;background:var(--acc2);box-shadow:0 0 14px var(--acc);opacity:0}
.ho-detail{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:68px;margin-top:16px;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid var(--line);transition:opacity .3s,transform .3s}
.ho-dk{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc2);white-space:nowrap}
.ho-dk.is-done{color:var(--sage)}
.ho-dv{font-size:14px;line-height:1.4;color:var(--ink-strong)}
.ho-out{width:100%;padding:14px 18px 16px;border-radius:16px;border:1px solid color-mix(in srgb,var(--sage) 22%,transparent);background:color-mix(in srgb,var(--bg) 86%,var(--sage) 6%);transition:border-color .4s,background .4s}
.ho-out.is-shown{border-color:color-mix(in srgb,var(--sage) 50%,transparent);background:color-mix(in srgb,var(--bg) 80%,var(--sage) 12%)}
.ho-out .ho-bar span:last-child{color:var(--sage);opacity:0;transition:opacity .3s}
.ho-out.is-ok .ho-bar span:last-child{opacity:1}
.ho-num{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ho-num>span:first-child{font-family:var(--serif);font-size:48px;line-height:1;letter-spacing:-.02em;color:var(--text)}
.ho-lbl{font-size:14px;line-height:1.35;color:var(--muted)}
.ho-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;min-height:28px}
.ho-chips span{padding:6px 11px;border-radius:var(--r-pill);border:1px solid var(--border-strong);font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s}
.ho-chips span.is-on{opacity:1;transform:none}
/* navigation: arrows, one dot per objective (a tick once its run has finished), and a count */
.ho-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px}
.ho-arrow{width:42px;height:42px;border-radius:50%;border:1px solid var(--border-strong);background:rgba(255,255,255,.03);color:var(--text);font:inherit;font-size:17px;cursor:pointer;transition:border-color .2s,background .2s}
.ho-arrow:hover{border-color:var(--acc-border);background:var(--acc-tint)}
.ho-dots{display:flex;gap:10px}
.ho-dot{width:34px;height:8px;padding:0;border:0;border-radius:4px;background:var(--line2);cursor:pointer;position:relative;overflow:hidden;transition:background .25s,width .25s}
.ho-dot.is-active{width:56px;background:rgb(var(--acc2-rgb) / .35)}
.ho-dot.is-done{background:color-mix(in srgb,var(--sage) 55%,transparent)}
.ho-dot.is-active.is-done{background:var(--sage)}
.ho-dot.is-active:not(.is-done){background:var(--acc2)}
.ho-count{margin-top:12px;text-align:center;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}

@media(max-width:1000px){
  .ho-row{grid-template-columns:minmax(0,1fr);justify-items:center}
  .ho-ask,.ho-ceez,.ho-out{max-width:560px}
  .ho-wire{width:2px;height:32px;background:linear-gradient(rgb(var(--acc2-rgb) / .5),rgb(var(--acc2-rgb) / .2))}
  .ho-wire.is-out{background:linear-gradient(rgb(var(--acc2-rgb) / .2),color-mix(in srgb,var(--sage) 40%,transparent))}
  .ho-wire i{left:-4px;top:0;transform:translateY(calc(var(--p,0) * 22px))}
  .ho-text{min-height:70px}
  .ho-num{flex-direction:row;align-items:baseline;gap:14px}
}
@media(max-width:560px){.ho-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.ho-text{font-size:17px}}
@media(prefers-reduced-motion:reduce){.ho-step,.ho-detail,.ho-send,.ho-dot{transition:none}}

/* ── the scroll effect: sections stack, each sliding over the last (hp.js sets .hp-stack, --stack-z and --stack-top) ── */
@media(min-width:901px) and (min-height:600px){
  .js-motion main > section.hp-stack{position:sticky;top:var(--stack-top,0px);z-index:var(--stack-z,1)}
  .js-motion main > section.hp-stack:not(:first-child){border-radius:28px 28px 0 0;border-top:1px solid var(--line2);box-shadow:0 -28px 70px rgba(0,0,0,.6)}
  .js-motion main > section.hp-flow{position:relative;z-index:20}
  .js-motion main > section.hp-flow-first{border-radius:28px 28px 0 0;border-top:1px solid var(--line2);box-shadow:0 -28px 70px rgba(0,0,0,.6)}
  .stack-dim{position:absolute;inset:0;z-index:30;background:rgba(4,5,9,.85);opacity:0;pointer-events:none;will-change:opacity;border-radius:inherit}
}
@media not all and (min-width:901px) and (min-height:600px){.stack-dim{display:none}}

@media(max-width:1000px){
  .hp-nodes{grid-template-columns:minmax(0,1fr);gap:8px}
  .hp-node{min-height:0}
  .hp-node:not(:last-child)::after{left:22px;top:100%;width:0;height:8px;border-top:0;border-left:1px solid var(--border-strong)}
  .hp-rail2{display:none}
}