/* Idea to impact · interactive stepper */
.landing-idea-path { --idea-color:#ffd36e; --idea-progress:0; position:relative; overflow:hidden; transition:background .6s ease; background:radial-gradient(120% 140% at 85% 20%,color-mix(in srgb,var(--idea-color) 16%,transparent),transparent 60%),linear-gradient(120deg,rgba(185,165,255,.08),rgba(132,228,229,.05)); }
.landing-idea-path::after { content:""; position:absolute; right:-120px; top:-120px; width:340px; height:340px; border-radius:50%; background:var(--idea-color); opacity:.08; filter:blur(60px); transition:background .6s ease; pointer-events:none; }
.idea-stage { position:relative; z-index:1; display:grid; gap:16px; min-width:0; }
.landing-idea-flow { position:relative; display:grid; align-items:start; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; overflow:visible; padding:0; }
.landing-idea-flow .idea-track { display:block; position:absolute; left:10%; right:10%; top:27px; height:2px; border-radius:2px; background:var(--line,rgba(255,255,255,.1)); pointer-events:none; }
.landing-idea-flow .idea-track b { display:block; position:absolute; inset:0 auto 0 0; width:calc(var(--idea-progress) * 100%); border-radius:inherit; background:linear-gradient(90deg,#ffd36e,var(--idea-color)); box-shadow:0 0 12px var(--idea-color); transition:width .6s cubic-bezier(.2,.8,.2,1),background .6s ease; }
.idea-step { position:relative; display:grid; justify-items:center; gap:4px; min-width:0; padding:0 4px 12px; border:0; border-radius:14px; background:none; color:inherit; font:inherit; text-align:center; cursor:pointer; transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.idea-step:hover { transform:translateY(-3px); }
.idea-step:focus-visible { outline:2px solid var(--step); outline-offset:3px; }
.landing-idea-flow .idea-orb { position:relative; z-index:1; display:grid; place-items:center; width:54px; height:54px; margin-bottom:6px; border:1px solid var(--line,rgba(255,255,255,.12)); border-radius:50%; background:var(--surface-card,#12222c); font-size:22px; filter:grayscale(.7); opacity:.7; transition:all .4s cubic-bezier(.2,.8,.2,1); }
.idea-step small { color:var(--dim); font:600 9px var(--font-mono); letter-spacing:.08em; transition:color .3s ease; }
.idea-step strong { color:var(--muted); font:600 13px var(--font-display); transition:color .3s ease; }
.landing-idea-flow .idea-step:hover .idea-orb, .landing-idea-flow .idea-step.passed .idea-orb { filter:none; opacity:1; border-color:color-mix(in srgb,var(--step) 45%,transparent); }
.landing-idea-flow .idea-step.active .idea-orb { filter:none; opacity:1; transform:scale(1.14); border-color:var(--step); background:color-mix(in srgb,var(--step) 18%,var(--surface-card,#12222c)); box-shadow:0 0 0 6px color-mix(in srgb,var(--step) 12%,transparent),0 10px 30px color-mix(in srgb,var(--step) 30%,transparent); }
.idea-step.active small { color:var(--step); }
.idea-step.active strong { color:var(--ink-strong); }
.landing-idea-path.is-playing .idea-step.active .idea-orb::after { content:""; position:absolute; inset:-7px; border-radius:50%; border:2px solid transparent; border-top-color:var(--step); animation:idea-spin 3.6s linear forwards; }
@keyframes idea-spin { to { transform:rotate(360deg); } }
.idea-details { position:relative; min-height:118px; }
.idea-detail[hidden] { display:none; }
.idea-detail { display:flex; gap:16px; align-items:flex-start; padding:18px 20px; border:1px solid color-mix(in srgb,var(--step) 30%,transparent); border-radius:16px; background:linear-gradient(135deg,color-mix(in srgb,var(--step) 12%,transparent),transparent 70%); }
.idea-detail.active { animation:idea-in .45s cubic-bezier(.2,.8,.2,1); }
.idea-detail-glyph { flex:none; font-size:30px; line-height:1; }
.idea-detail small { color:var(--step); font:600 9px var(--font-mono); letter-spacing:.12em; text-transform:uppercase; }
.idea-detail h3 { margin:6px 0 4px; color:var(--ink-strong); font:600 18px var(--font-display); }
.idea-detail p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
@keyframes idea-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media (max-width: 900px) { .landing-idea-flow { grid-template-columns:repeat(5,minmax(0,1fr)); overflow:visible; padding:0; } }
@media (max-width: 760px) {
  .landing-idea-flow { gap:2px; }
  .landing-idea-flow .idea-orb { width:42px; height:42px; font-size:18px; }
  .landing-idea-flow .idea-track { top:21px; }
  .idea-step strong { font-size:11px; }
}
@media (prefers-reduced-motion: reduce) {
  .idea-detail.active { animation:none; }
  .idea-step, .idea-orb, .idea-track b { transition:none; }
}

/* Featured pathways · one colour scheme per module */
.pathways .pathway[data-pathway-scheme] { --pw-bg:rgba(18,34,44,.96); border-color:color-mix(in srgb,var(--pw) 26%,transparent); background:radial-gradient(130% 120% at 100% 0%,color-mix(in srgb,var(--pw) 17%,transparent),transparent 62%),linear-gradient(160deg,color-mix(in srgb,var(--pw) 7%,var(--pw-bg)),var(--pw-bg)); }
.pathways .pathway[data-pathway-scheme="1"] { --pw:#8fd5a4; }
.pathways .pathway[data-pathway-scheme="2"] { --pw:#b9a5ff; }
.pathways .pathway[data-pathway-scheme="3"] { --pw:#ffd36e; }
.pathways .pathway[data-pathway-scheme="4"] { --pw:#ff9879; }
.pathways .pathway[data-pathway-scheme="5"] { --pw:#6fd8f0; }
.pathways .pathway[data-pathway-scheme="6"] { --pw:#ff8fb8; }
.pathways .pathway[data-pathway-scheme] .pathway-number, .pathways .pathway[data-pathway-scheme] .card-link { color:var(--pw); }
.pathways .pathway[data-pathway-scheme] .tag { color:var(--pw); background:color-mix(in srgb,var(--pw) 12%,transparent); border-color:color-mix(in srgb,var(--pw) 30%,transparent); }
.pathways .pathway[data-pathway-scheme] h3 { transition:color .28s ease; }
.pathways .pathway[data-pathway-scheme]::before, .pathways .pathway[data-pathway-scheme]::after { color:var(--pw); }
.pathways .pathway[data-pathway-scheme]:hover, .pathways .pathway[data-pathway-scheme]:focus-visible { border-color:color-mix(in srgb,var(--pw) 70%,transparent); background:radial-gradient(130% 120% at 100% 0%,color-mix(in srgb,var(--pw) 32%,transparent),transparent 65%),linear-gradient(160deg,color-mix(in srgb,var(--pw) 16%,var(--pw-bg)),var(--pw-bg)); box-shadow:0 20px 45px color-mix(in srgb,var(--pw) 16%,transparent),0 0 0 1px color-mix(in srgb,var(--pw) 18%,transparent); }
.pathways .pathway[data-pathway-scheme]:hover h3, .pathways .pathway[data-pathway-scheme]:focus-visible h3 { color:var(--pw); }
[data-theme="light"] .pathways .pathway[data-pathway-scheme] { --pw-bg:#ffffff; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="1"] { --pw:#2f9a57; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="2"] { --pw:#6c4fe0; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="3"] { --pw:#b7860b; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="4"] { --pw:#d9573a; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="5"] { --pw:#1593b4; }
[data-theme="light"] .pathways .pathway[data-pathway-scheme="6"] { --pw:#d0457e; }

/* WhatsApp · icon only until hover, dismissable */
.wa-float-wrap { position:fixed; z-index:32; right:20px; bottom:22px; }
.wa-float-wrap .wa-float { position:relative; right:auto; bottom:auto; gap:0; min-height:48px; padding:10px; transition:gap .3s ease,padding .3s ease,background .2s ease,transform .2s ease; }
.wa-float-wrap .wa-float-label { max-width:0; overflow:hidden; white-space:nowrap; opacity:0; transition:max-width .35s cubic-bezier(.2,.8,.2,1),opacity .2s ease; }
.wa-float-wrap:hover .wa-float, .wa-float-wrap .wa-float:focus-visible { gap:8px; padding-right:15px; }
.wa-float-wrap:hover .wa-float-label, .wa-float-wrap .wa-float:focus-visible .wa-float-label { max-width:200px; opacity:1; }
.wa-float-dismiss { position:absolute; top:-7px; left:-7px; display:grid; place-items:center; width:20px; height:20px; padding:0; border:1px solid rgba(255,255,255,.2); border-radius:50%; background:#0b1a22; color:#cfe3e6; font:600 13px/1 system-ui,sans-serif; cursor:pointer; opacity:0; transform:scale(.7); transition:opacity .2s ease,transform .2s ease; }
.wa-float-wrap:hover .wa-float-dismiss, .wa-float-dismiss:focus-visible { opacity:1; transform:none; }
@media (hover: none) { .wa-float-dismiss { opacity:.85; transform:none; } }
@media (max-width: 600px) { .wa-float-wrap { right:12px; bottom:calc(78px + env(safe-area-inset-bottom)); } }
