/* The homepage story begins below the two preserved opening sections. */
.home-story{--story-lime:#c6ff1a;--story-paper:#eef1e9;--story-ink:#10150e;--story-muted:#a4ad9e;--story-line:rgba(235,245,224,.15)}
.home-story section{scroll-margin-top:0}
.home-story .shell{max-width:1320px}
.home-story h2,.home-story h3,.home-story p,.home-story figure{margin:0}
.home-story h2{font-size:clamp(2.6rem,4.6vw,4.8rem);font-weight:600;letter-spacing:-.055em;line-height:1.04}
.home-story h3{font-weight:500;letter-spacing:-.045em;line-height:1.1}
.home-story .story-kicker{font-size:.64rem;font-weight:700;line-height:1.6;letter-spacing:.15em;margin:0 0 24px}
.home-story .story-lime{color:var(--story-lime)}
.home-story .story-intro{display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(36px,7vw,100px);align-items:end;margin-bottom:64px}
.home-story .story-lead{font-size:clamp(1rem,1.15vw,1.15rem);line-height:1.8;color:var(--story-muted);max-width:46ch}
.home-story .story-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:.83rem;font-weight:600;text-decoration:none}
.home-story .story-link svg{width:19px;height:19px;flex:none;transition:transform .2s}
.home-story .story-link:hover svg{transform:translateX(4px)}
.home-story a:focus-visible,.home-story label:has(input:focus-visible){outline:3px solid var(--story-lime);outline-offset:5px}
.home-story .story-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* A clear change of pace: the client journey on a light editorial canvas. */
.home-story .story-journey{padding:110px 0 40px;background:var(--story-paper);color:var(--story-ink)}
.home-story .story-journey .story-kicker{color:#4b5c3e}
.home-story .story-soft{color:#6a7761}
.home-story .story-journey .story-lead{color:#53604d}
.home-story .story-explorer{display:block;min-width:0;padding:0;margin:0;border:0;font-size:inherit}
.home-story .story-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.home-story .story-step{position:relative;display:flex;flex-direction:column;min-width:0;padding:23px 25px 26px;cursor:pointer;border:1px solid #c5cdbe;border-radius:16px;background:transparent;transition:background .2s,border-color .2s}
.home-story .story-step:has(input:checked){background:var(--story-ink);border-color:var(--story-ink);color:#f6f8f2}
.home-story .story-step:has(input:checked)::after{content:"";position:absolute;bottom:-13px;left:32px;width:25px;height:25px;background:var(--story-ink);transform:rotate(45deg);border-radius:2px}
.home-story .story-step:hover{border-color:var(--story-ink)}
.home-story .story-step-top{display:flex;align-items:center;justify-content:space-between;font-size:.72rem;letter-spacing:.07em;color:#66745b;margin-bottom:25px}
.home-story .story-step-top svg{width:23px;height:23px}
.home-story .story-step:has(input:checked) .story-step-top{color:var(--story-lime)}
.home-story .story-step strong{font-weight:500;font-size:clamp(1.25rem,1.7vw,1.7rem);letter-spacing:-.04em}
.home-story .story-step-caption{display:block;margin-top:9px;font-size:.72rem;line-height:1.5;color:#65715e}
.home-story .story-step:has(input:checked) .story-step-caption{color:#b7c0b1}
.home-story .story-step:has(input:focus-visible){outline-color:#526d31}
.home-story .story-panels{padding:62px 0 50px}
.home-story .story-panel{display:none;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:clamp(32px,4vw,64px);align-items:center;min-height:456px;animation:story-panel-in .3s ease both}
.home-story .story-explorer:has(input[value="welcome"]:checked) #journey-welcome,.home-story .story-explorer:has(input[value="activate"]:checked) #journey-activate,.home-story .story-explorer:has(input[value="organise"]:checked) #journey-organise,.home-story .story-explorer:has(input[value="support"]:checked) #journey-support{display:grid}
.home-story .story-panel h3{font-size:clamp(1.8rem,2.6vw,2.7rem);max-width:16ch;margin-bottom:20px}
.home-story .story-panel-copy>p:not(.story-kicker){font-size:.91rem;line-height:1.75;color:#586350;max-width:39ch}
.home-story .story-panel-copy .story-kicker{font-size:.61rem;margin-bottom:18px}
.home-story .story-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 13px;margin:24px 0 17px;padding:0}
.home-story .story-facts li{font-size:.68rem;line-height:1.6;border-bottom:1px solid #bec8b6;padding:0 0 5px}
.home-story .story-journey a:focus-visible{outline-color:#526d31}
.home-story .story-product{min-width:0;background:#181c16;border:1px solid #333d2b;padding:0 7px 0;border-radius:16px;overflow:hidden;box-shadow:0 22px 50px -30px #3e4b34}
.home-story .story-product-bar{display:flex;align-items:center;gap:9px;min-height:39px;padding:5px 10px;color:#a3ad9a;font-size:.58rem;letter-spacing:.025em}
.home-story .story-product-bar img{width:16px;height:16px}
.home-story .story-product>img{display:block;width:100%;height:auto;aspect-ratio:1.78;object-fit:cover;object-position:top;border:1px solid #343a30;border-radius:8px}
.home-story .story-product figcaption{min-height:44px;display:flex;align-items:center;padding:9px 11px;color:#aeb6a7;font-size:.63rem;line-height:1.5}
.home-story .story-training-preview{height:440px;border:1px solid #ccd3c4;border-radius:16px;padding:30px 8%;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;background:#e0e6d9;overflow:hidden}
.home-story .story-training-note>svg{width:38px;height:38px;margin-bottom:27px;color:#4c642f}
.home-story .story-training-note p,.home-story .story-training-note strong{font-size:clamp(1.25rem,2vw,2rem);line-height:1.2;letter-spacing:-.04em;font-weight:500}
.home-story .story-training-note strong{display:block;color:#627351;margin-top:5px}
.home-story .story-training-note>span{display:block;font-size:.74rem;line-height:1.7;color:#58674b;margin-top:22px;max-width:24ch}
.home-story .story-training-preview>img{width:188px;height:auto;max-width:100%;justify-self:center;border:5px solid #22281d;outline:1px solid #839374;border-radius:24px}
.home-story .story-journey-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:26px;border-top:1px solid #cbd3c4}
.home-story .story-journey-footer>span{font-size:.6rem;letter-spacing:.11em;line-height:1.7;color:#6c7763}

/* Roles are explained as editorial rows, not another wall of feature cards. */
.home-story .story-team{padding:115px 0 90px;background:#090c08;color:#f6f8f2}
.home-story .story-team .story-kicker{color:var(--story-muted)}
.home-story .story-role-list{border-top:1px solid var(--story-line)}
.home-story .story-role{display:grid;grid-template-columns:.52fr 1.08fr 1fr;gap:44px;padding:43px 0;border-bottom:1px solid var(--story-line);align-items:start}
.home-story .story-role-label{display:flex;gap:20px;font-size:.65rem;line-height:1.7;letter-spacing:.07em;padding-top:7px;color:#b0b9a9}
.home-story .story-role-label>span:first-child{color:var(--story-lime)}
.home-story .story-role h3{font-size:clamp(1.65rem,2.6vw,2.6rem);max-width:18ch}
.home-story .story-role>div>p{font-size:.9rem;line-height:1.8;color:var(--story-muted)}
.home-story .story-role .story-link{color:var(--story-lime);margin-top:13px}

/* Two real app views: quiet framing, generous space, no fabricated UI. */
.home-story .story-member{padding:85px 0 35px;background:#151b12;color:#f6f8f2;border-top:1px solid var(--story-line);overflow:hidden}
.home-story .story-member-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:75px}
.home-story .story-member .story-kicker{color:var(--story-lime)}
.home-story .story-member h2{max-width:12ch;font-size:clamp(2.6rem,4.3vw,4.5rem)}
.home-story .story-member .story-lead{margin-top:27px;font-size:1rem;max-width:43ch}
.home-story .story-app-links{margin:30px 0 32px;border-top:1px solid var(--story-line);max-width:460px}
.home-story .story-app-links>a{display:flex;align-items:center;gap:18px;min-height:87px;padding:17px 0;border-bottom:1px solid var(--story-line)}
.home-story .story-app-links>a>svg:first-child{color:var(--story-lime);width:23px;height:23px;flex:none}
.home-story .story-app-links>a>svg:last-child{margin-left:auto;width:17px;height:17px;color:#849179;transition:transform .2s}
.home-story .story-app-links>a:hover>svg:last-child{transform:translateX(4px);color:var(--story-lime)}
.home-story .story-app-links strong{display:block;font-size:.94rem;font-weight:500}
.home-story .story-app-links small{display:block;margin-top:6px;font-size:.75rem;color:var(--story-muted)}
.home-story .story-member .btn{font-size:.83rem;min-height:52px;border-color:#67755a;background:transparent;padding-inline:22px}
.home-story .story-member .btn:hover{background:#f6f8f2}
.home-story .story-phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start;padding:38px 5px 80px}
.home-story .story-device{min-width:0;position:relative;border:1px solid #637057;background:#080a07;padding:7px;border-radius:34px;box-shadow:0 24px 42px -20px rgba(0,0,0,.6)}
.home-story .story-device>img{width:100%;height:auto;aspect-ratio:370/800;object-fit:cover;object-position:top;border-radius:26px}
.home-story .story-device-nutrition{margin-top:100px}
.home-story .story-device figcaption{position:absolute;top:100%;left:0;right:0;padding:19px 0;text-align:center;font-size:.68rem;color:#a1ae97;line-height:1.5}
.home-story .story-member-bottom{margin-top:64px;padding-top:24px;border-top:1px solid var(--story-line);display:flex;justify-content:space-between;align-items:center;gap:24px}
.home-story .story-member-bottom>span{font-size:.6rem;letter-spacing:.12em;color:#8c9a81;line-height:1.7}
.home-story .story-member-bottom .story-link{color:#c9d3c0}

.home-story .story-discover{padding:105px 0;background:#090c08;color:#f6f8f2}
.home-story .story-discover-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:100px;align-items:start}
.home-story .story-discover h2{font-size:clamp(2.3rem,3.4vw,3.5rem);max-width:17ch}
.home-story .story-discover .story-kicker{color:var(--story-muted)}
.home-story .story-discover p:not(.story-kicker){font-size:.95rem;line-height:1.75;color:var(--story-muted);margin-top:25px;max-width:37ch}
.home-story .story-directory{border-top:1px solid var(--story-line)}
.home-story .story-directory>a{display:grid;grid-template-columns:30px 1fr 25px;gap:20px;align-items:center;min-height:105px;border-bottom:1px solid var(--story-line);transition:background .2s;padding:20px 12px}
.home-story .story-directory>a:hover{background:#171d12}
.home-story .story-directory-number{font-size:.65rem;color:#8c9a7f}
.home-story .story-directory strong{display:block;font-size:clamp(1.05rem,1.45vw,1.35rem);font-weight:500;letter-spacing:-.025em}
.home-story .story-directory small{display:block;font-size:.74rem;color:var(--story-muted);margin-top:8px}
.home-story .story-directory svg{color:var(--story-lime)}

.home-story .story-demo{background:var(--story-lime);color:var(--story-ink);padding:70px 0 90px}
.home-story .story-demo .story-kicker{color:#465b25;margin-bottom:38px}
.home-story .story-demo-content{display:grid;grid-template-columns:1.3fr .8fr;align-items:end;gap:80px}
.home-story .story-demo h2{font-size:clamp(2.9rem,4.9vw,5.2rem);line-height:1.04;max-width:17ch}
.home-story .story-demo h2 span:last-child{color:#4b6523}
.home-story .story-demo-content p{font-size:1rem;line-height:1.75;max-width:40ch}
.home-story .story-demo .btn{margin-top:28px;min-height:58px;font-size:.88rem;color:#fff;background:#10150e;border:1px solid #10150e;padding-inline:25px}
.home-story .story-demo .btn:hover{background:#2b3d1b}
.home-story .story-demo-secondary{display:block;font-size:.73rem;text-decoration:underline;text-underline-offset:5px;margin-top:20px;line-height:1.7}
.home-story .story-demo a:focus-visible{outline-color:#10150e}
@keyframes story-panel-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

@media(min-width:1500px){.home-story .story-panel{min-height:492px}}
@media(max-width:1100px){
  .home-story .story-intro{grid-template-columns:1.25fr 1fr;gap:40px}
  .home-story .story-panel{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:35px;min-height:460px}
  .home-story .story-step{padding:20px 18px 24px}
  .home-story .story-role{grid-template-columns:.5fr 1fr 1fr;gap:28px}
  .home-story .story-member-grid{gap:35px}
  .home-story .story-phones{gap:15px}
  .home-story .story-discover-grid{gap:50px}
  .home-story .story-demo-content{gap:40px}
}
@media(max-width:800px){
  .home-story .story-intro{grid-template-columns:1fr;gap:24px;margin-bottom:40px}
  .home-story .story-intro .story-lead{max-width:55ch}
  .home-story .story-journey{padding-top:70px}
  .home-story .story-steps{gap:8px}
  .home-story .story-step{padding:17px 14px 20px}
  .home-story .story-step strong{font-size:1.1rem}
  .home-story .story-step-caption{font-size:.64rem}
  .home-story .story-panel{grid-template-columns:1fr;gap:28px;min-height:0}
  .home-story .story-panel h3{max-width:26ch;font-size:2.1rem}
  .home-story .story-panel-copy>p:not(.story-kicker){max-width:60ch}
  .home-story .story-panels{padding:48px 0 35px}
  .home-story .story-training-preview{height:420px;padding:25px 14%}
  .home-story .story-role{grid-template-columns:1fr 1.15fr;gap:14px 32px;padding:30px 0}
  .home-story .story-role-label{grid-column:1/-1;padding:0}
  .home-story .story-team{padding:75px 0}
  .home-story .story-member-grid{grid-template-columns:1fr;gap:24px}
  .home-story .story-member h2{max-width:17ch}
  .home-story .story-member .story-lead{max-width:52ch}
  .home-story .story-app-links{max-width:none}
  .home-story .story-phones{width:min(90%,530px);justify-self:center;gap:25px}
  .home-story .story-device-nutrition{margin-top:70px}
  .home-story .story-member-bottom{margin-top:15px}
  .home-story .story-discover-grid{grid-template-columns:1fr;gap:35px}
  .home-story .story-discover h2{max-width:22ch}
  .home-story .story-discover{padding:75px 0}
  .home-story .story-demo-content{grid-template-columns:1fr;gap:30px}
  .home-story .story-demo h2{max-width:22ch}
  .home-story .story-demo-content p{max-width:52ch}
}
@media(max-width:520px){
  .home-story h2{font-size:clamp(2.2rem,9vw,2.9rem)}
  .home-story .story-journey{padding-top:58px}
  .home-story .story-kicker{font-size:.57rem;margin-bottom:19px;letter-spacing:.11em}
  .home-story .story-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .home-story .story-step{padding:16px 16px 18px;border-radius:12px}
  .home-story .story-step-top{margin-bottom:16px}
  .home-story .story-step-top svg{width:20px;height:20px}
  .home-story .story-step-caption{font-size:.64rem;max-width:22ch}
  .home-story .story-step:has(input:checked)::after{display:none}
  .home-story .story-panels{padding-top:35px}
  .home-story .story-panel h3{font-size:2rem}
  .home-story .story-facts{margin:20px 0 12px}
  .home-story .story-product{padding-inline:4px;border-radius:11px}
  .home-story .story-product-bar{min-height:33px;font-size:.53rem}
  .home-story .story-product figcaption{font-size:.58rem;min-height:42px;padding:9px 7px}
  .home-story .story-product>img{border-radius:5px}
  .home-story .story-training-preview{height:360px;padding:25px 15px;gap:14px;grid-template-columns:.9fr 1.1fr}
  .home-story .story-training-preview>img{width:145px}
  .home-story .story-training-note>svg{width:30px;height:30px;margin-bottom:22px}
  .home-story .story-training-note p,.home-story .story-training-note strong{font-size:1.25rem}
  .home-story .story-training-note>span{font-size:.65rem}
  .home-story .story-journey-footer,.home-story .story-member-bottom{align-items:flex-start;flex-direction:column;gap:7px}
  .home-story .story-role{grid-template-columns:1fr;gap:19px;padding:32px 0}
  .home-story .story-role h3{font-size:1.8rem;max-width:21ch}
  .home-story .story-role>div>p{font-size:.9rem}
  .home-story .story-role-label{font-size:.61rem}
  .home-story .story-member{padding-top:60px}
  .home-story .story-member h2{font-size:clamp(2.4rem,10vw,3.2rem)}
  .home-story .story-phones{width:100%;padding:25px 2px 55px;gap:14px}
  .home-story .story-device{border-radius:23px;padding:4px}
  .home-story .story-device>img{border-radius:19px}
  .home-story .story-device-nutrition{margin-top:60px}
  .home-story .story-device figcaption{font-size:.59rem;padding-top:14px}
  .home-story .story-app-links>a{gap:13px}
  .home-story .story-app-links strong{font-size:.9rem}
  .home-story .story-app-links small{font-size:.7rem}
  .home-story .story-member .btn{font-size:.78rem;min-height:54px;width:100%;padding-inline:10px}
  .home-story .story-directory>a{gap:12px;grid-template-columns:22px 1fr 19px;padding:20px 0}
  .home-story .story-directory strong{font-size:1.02rem;line-height:1.35}
  .home-story .story-directory small{font-size:.66rem;line-height:1.6}
  .home-story .story-demo{padding:55px 0 70px}
  .home-story .story-demo h2{font-size:clamp(2.5rem,10vw,3.4rem)}
  .home-story .story-demo .btn{width:100%;font-size:.8rem;padding-inline:14px}
}
@media(prefers-reduced-motion:reduce){
  .home-story .story-panel{animation:none}
  .home-story .story-step,.home-story .story-link svg,.home-story .story-app-links>a>svg:last-child,.home-story .story-directory>a{transition:none}
}
/* Journey points are clickable: each one shows its own dashboard or app screen. */
.home-story .story-facts.is-interactive{gap:8px}
.home-story .story-facts.is-interactive li{border:0;padding:0}
.home-story .story-fact-button{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 10px;border:1px solid #bec8b6;border-radius:999px;background:transparent;color:inherit;font:inherit;font-size:.68rem;line-height:1.4;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .3s ease,border-color .3s ease,color .3s ease,transform .3s ease}
.home-story .story-fact-button i{width:7px;height:7px;border-radius:50%;background:#aab59f;transition:background-color .3s ease,box-shadow .3s ease}
.home-story .story-fact-button:focus-visible{outline:2px solid #526d31;outline-offset:2px}
@media(hover:hover){.home-story .story-fact-button:hover{border-color:var(--story-ink);transform:translateY(-1px)}}
.home-story .story-facts .is-active>.story-fact-button{background:var(--story-ink);border-color:var(--story-ink);color:#f6f8f2}
.home-story .story-facts .is-active>.story-fact-button i{background:var(--story-lime);box-shadow:0 0 0 3px rgba(198,255,29,.18)}
.home-story .story-shot-stage{position:relative;overflow:hidden;aspect-ratio:1.78;border:1px solid #343a30;border-radius:8px;background:#121510}
.home-story .story-phone-stage{position:relative;overflow:visible;width:182px;max-width:100%;aspect-ratio:760/1511;justify-self:center;border:0;outline:0;border-radius:0;background:transparent}
.home-story .story-phone-stage img{object-fit:contain!important}
.home-story .story-phone-stage::after{display:none}
.home-story [data-shot-stage] img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:top center;--shot-scale:1;--shot-enter:1;--shot-y:0px;transform:translateY(var(--shot-y)) scale(calc(var(--shot-scale) * var(--shot-enter)));transition:opacity .55s ease,transform .8s cubic-bezier(.2,.8,.2,1),filter .55s ease}
.home-story [data-shot-stage] img.is-entering{opacity:0;--shot-enter:1.035;--shot-y:10px;filter:blur(6px)}
.home-story [data-shot-stage] img.is-leaving{opacity:0;--shot-enter:.985;filter:blur(3px)}
.home-story [data-shot-stage]::after{position:absolute;right:0;bottom:0;left:0;height:2px;background:linear-gradient(90deg,transparent,var(--story-lime),transparent);content:'';opacity:0;transform:scaleX(0);transition:opacity .3s ease,transform .6s ease}
.home-story [data-shot-stage].is-switching::after{opacity:1;transform:scaleX(1)}
@media(max-width:560px){.home-story .story-shot-stage{border-radius:5px}.home-story .story-phone-stage{width:148px}.home-story .story-fact-button{font-size:.66rem;padding:6px 11px 6px 9px}}
@media(prefers-reduced-motion:reduce){.home-story [data-shot-stage] img{transition:none}}
