/* ==========================================================================
   Growth Engine planner — page-specific styles (loaded only on /growth-engine)
   Every class is ge- prefixed so nothing here can collide with site.css.
   ========================================================================== */
.ge{
  --ge-who:#6FB7D6; --ge-why:#E59A62; --ge-how:#6FC48A; --ge-where:#B58AD6;
  --ge-rec:#5BE37D; --ge-ai:#2FD5BD;
  max-width:760px;margin-inline:auto;padding-bottom:110px;
}
body.ge-story-on .ge{padding-bottom:40px}

/* progress */
.ge-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:6px 0 18px}
.ge-progress button{background:none;border:none;padding:0;text-align:left}
.ge-progress .bar{height:4px;border-radius:2px;background:var(--line-ink);margin-bottom:6px;transition:background .2s}
.ge-progress .lab{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-ink-dim)}
.ge-progress button.has .bar{background:var(--c)}
.ge-progress button.has .lab{color:var(--c)}

/* step cards */
.ge-stack{display:flex;flex-direction:column;gap:12px}
.ge-card{background:var(--ink-2);border:1px solid var(--line-ink);border-radius:var(--r);overflow:hidden;transition:border-color .2s}
.ge-card.open{border-color:var(--c)}
.ge-head{width:100%;display:flex;align-items:center;gap:14px;padding:16px 18px;text-align:left}
.ge-icon{width:42px;height:42px;border-radius:10px;flex:none;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c);
  font-family:var(--display);font-weight:600;font-size:16px}
.ge-title{flex:1;min-width:0}
.ge-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--c);margin-bottom:3px}
.ge-head h2{font-size:18px;line-height:1.2;letter-spacing:-.01em}
.ge-q{font-size:13px;color:var(--on-ink-dim);margin-top:3px}
.ge-count{display:none;flex:none;font-size:11.5px;font-weight:700;color:#0B0D13;background:var(--c);border-radius:11px;padding:2px 9px}
.ge-card.has .ge-count{display:inline-block}
.ge-chev{flex:none;font-size:16px;color:var(--on-ink-dim);transition:transform .2s}
.ge-card.open .ge-chev{transform:rotate(180deg);color:var(--c)}
.ge-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}
.ge-card.open .ge-body{grid-template-rows:1fr}
.ge-body>div{overflow:hidden;min-height:0}
.ge-inner{padding:0 18px 20px}
.ge-group{margin-bottom:16px}
.ge-group h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--on-ink-dim);margin-bottom:9px;font-weight:500}
.ge-chips{display:flex;flex-wrap:wrap;gap:8px}
.ge-chip{font-size:13.5px;color:var(--on-ink);background:var(--ink);border:1px solid var(--line-ink);
  border-radius:20px;padding:8px 14px;min-height:38px;line-height:1.2;transition:border-color .15s,background .15s,color .15s}
.ge-chip:hover{border-color:var(--on-ink-dim)}
.ge-chip.selected{background:var(--brass);border-color:var(--brass);color:#0B0D13;font-weight:600}
.ge-chip.recommended{border-color:var(--ge-rec);box-shadow:0 0 0 1px var(--ge-rec) inset}
.ge-chip.recommended::before{content:"●";color:var(--ge-rec);font-size:7px;margin-right:6px;vertical-align:middle}
.ge-chip.selected.recommended{box-shadow:0 0 0 2px var(--ge-rec)}
.ge-chip.selected.recommended::before{color:#0B0D13}
.ge-chip[data-badge]::after{content:attr(data-badge);display:inline-block;font-size:9px;font-weight:700;letter-spacing:.04em;
  background:var(--ge-ai);color:#06231E;padding:1px 6px;border-radius:7px;margin-left:6px;vertical-align:middle;text-transform:uppercase}

.ge-rec-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ge-rec-head{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:13px;font-weight:600;color:var(--on-ink)}
.ge-rec-dot{width:9px;height:9px;border-radius:50%;background:var(--ge-rec);box-shadow:0 0 6px rgba(91,227,125,.7)}
.ge-add-rec{font-size:12.5px;font-weight:600;color:var(--brass-lite);background:var(--brass-glow);border-radius:14px;padding:6px 12px}
.ge-add-rec[hidden]{display:none}
.ge-next{margin-top:6px;width:100%;background:var(--c);color:#0B0D13;border-radius:var(--r-sm);padding:12px;font-size:14.5px;font-weight:600}
.ge-optional{font-size:11px;color:var(--on-ink-dim);font-weight:400;letter-spacing:.04em;text-transform:none;margin-left:6px}

/* sticky action bar */
.ge-bar{position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(11,13,19,.94);backdrop-filter:blur(10px);
  border-top:1px solid var(--line-ink);padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
.ge-bar .wrap{display:flex;align-items:center;gap:14px;max-width:760px}
.ge-hint{flex:1;font-size:13px;color:var(--on-ink-dim);line-height:1.35}
.ge-hint strong{color:var(--on-ink)}
.ge-bar .btn:disabled{background:var(--ink-3);color:var(--on-ink-dim);box-shadow:none;cursor:not-allowed;transform:none}
body.ge-story-on .ge-bar,body.ge-story-on #ge-engine,body.ge-story-on .ge-intro{display:none}

/* story */
#ge-story{display:none}
body.ge-story-on #ge-story{display:block;animation:ge-fade .3s ease}
@keyframes ge-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ge-story-card{background:var(--ink-2);border:1px solid var(--line-ink);border-radius:var(--r);padding:24px;margin-bottom:14px}
.ge-narrative{font-size:16.5px;line-height:1.7;color:var(--on-ink)}
.ge-narrative strong{color:var(--brass-lite)}
.ge-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.ge-tag{font-size:12px;font-weight:600;padding:4px 11px;border-radius:13px;background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c)}
.ge-tier{background:linear-gradient(140deg,var(--ink-3),var(--ink-2));border:1px solid rgba(201,162,75,.4);border-radius:var(--r);padding:24px;margin-bottom:14px}
.ge-tier .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-bottom:10px}
.ge-tier h3{font-size:24px;margin-bottom:6px}
.ge-price{font-family:var(--display);font-size:20px;color:var(--brass-lite);margin-bottom:10px}
.ge-price small{font-family:var(--sans);font-size:12.5px;color:var(--on-ink-dim);margin-left:6px}
.ge-why{font-size:14.5px;color:var(--on-ink-dim);margin-bottom:16px}
.ge-reqs{list-style:none}
.ge-reqs li{font-size:14.5px;padding:9px 0 9px 24px;position:relative;border-top:1px solid var(--line-ink)}
.ge-reqs li:first-child{border-top:none}
.ge-reqs li::before{content:"✓";position:absolute;left:0;font-weight:700;color:var(--brass)}
.ge-ai{background:rgba(47,213,189,.08);border:1px solid rgba(47,213,189,.4);border-radius:var(--r-sm);padding:14px 16px;font-size:14px;margin-bottom:14px}
.ge-ai b{color:var(--ge-ai)}
.ge-fine{font-size:12.5px;color:var(--on-ink-dim);text-align:center;margin:14px auto 0}
.ge-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.ge-actions .btn{flex:1;justify-content:center;min-width:150px}
.ge-wa{background:#1FAF55;color:#fff;box-shadow:none}
.ge-wa:hover{box-shadow:0 10px 24px -12px rgba(31,175,85,.8)}

/* lead capture */
.ge-lead{background:var(--paper);color:var(--on-paper);border-radius:var(--r);padding:clamp(22px,3vw,32px);margin-bottom:14px}
.ge-lead h3{font-size:clamp(21px,2.6vw,26px);margin-bottom:8px}
.ge-lead>p{color:var(--on-paper-dim);font-size:15px;margin-bottom:18px}
.ge-lead .form-cols{margin-bottom:0}
.ge-lead .form-note{margin-top:12px}
.ge-lead-done{display:none;text-align:center;padding:10px 0}
.ge-lead.sent form,.ge-lead.sent>p,.ge-lead.sent>h3{display:none}
.ge-lead.sent .ge-lead-done{display:block}
.ge-lead-done h3{display:block!important}
.ge-secondary{margin-top:6px;font-size:13.5px;color:var(--on-ink-dim);text-align:center}
.ge-secondary a{color:var(--brass-lite);text-decoration:underline;text-underline-offset:3px}

/* info block */
.ge-info{padding-top:clamp(40px,6vw,64px)}
.ge-info h2{font-size:clamp(22px,2.6vw,28px);margin-bottom:12px}
.ge-info>p{color:var(--on-ink-dim);margin-bottom:14px}
.ge-four{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 30px}
.ge-four div{background:var(--ink-2);border:1px solid var(--line-ink);border-radius:var(--r-sm);padding:12px 14px;font-size:13.5px;color:var(--on-ink-dim)}
.ge-four b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}
@media(min-width:700px){.ge-four{grid-template-columns:repeat(4,1fr)}}
.ge-info .acc{border-color:var(--line-ink)}
.ge-info .acc details{border-color:var(--line-ink)}
.ge-info .acc .acc-body{color:var(--on-ink-dim)}