/* Dena Sports Physio — home page only (src/home.css): the pinned 3D anatomy section and the recovery journey.
   Built from the 2026-10 design package (dd.css v7/v25). Shared rules (hero clips, thumbnails, galleries) live in styles.css. */
:root{--accent:#b9e27f;--dd-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--dd-deep:#06222c;--dd-top:#0c3443;--dd-vh:min(calc(100vh - var(--header-h)), 860px)}
/* wave transitions borrowed from the site's own hero/reviews waves */
.dd-wave{display:block;width:100%;height:clamp(34px, 5vw, 70px);margin:0}
.dd-wave-in{background:var(--dd-top)}
.dd-wave-out{background:var(--dd-deep);margin-bottom:-1px}
.dd-wave-in-jr{background:var(--dd-deep);margin-top:-1px}
/* the journey now sits right above Reviews: our wave replaces the reviews' own white top wave */
#reviews .section-wave{display:none}
/* 3D anatomy */
.dd-anat{position:relative;color:#ffffff;height:calc(var(--dd-vh) + 6840px);background:linear-gradient(180deg,var(--dd-top) 0%,#0a2c39 40%,var(--dd-deep) 100%);view-timeline-name:--ddanat}
.dd-anat-sticky{position:sticky;top:var(--header-h);height:var(--dd-vh);overflow:hidden;display:flex;flex-direction:column}
.dd-anat-grid{flex:1;min-height:0;width:min(100% - 2.5rem, 1280px);margin:0 auto;padding:24px 0;display:flex;gap:28px;align-items:stretch}
.dd-rail{flex:0 0 210px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.dd-rail-wrap{position:relative;display:flex;flex-direction:column;gap:2px}
.dd-rail-track{position:absolute;left:4px;top:10px;bottom:10px;width:2px;background:rgba(255,255,255,.14);border-radius:2px;overflow:hidden}
.dd-rail-fill{position:absolute;inset:0;background:var(--accent);transform-origin:top;transform:scaleY(0)}
.dd-rail-btn{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px 0 22px;border:0;background:transparent;color:#a9c4c6;font:inherit;font-size:15px;font-weight:600;text-align:left;cursor:pointer;border-radius:12px;transition:color .3s,background .3s}
.dd-rail-btn .num{font-family:var(--dd-mono);font-size:12px;min-width:34px;letter-spacing:.06em;font-weight:500}
.dd-rail-btn:hover{color:#ffffff}
.dd-rail-btn.is-on{color:#ffffff;background:rgba(185,226,127,.1)}
.dd-rail-btn.is-on .num{color:var(--accent)}
.dd-stage{flex:1.3 1 0;min-width:0;position:relative;border-radius:28px;overflow:hidden;background:radial-gradient(ellipse at 50% 62%, #136068 0%, #0a3540 52%, #072632 100%);box-shadow:0 30px 80px rgba(0,0,0,.25)}
.dd-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y;cursor:grab}
.dd-stage canvas:active{cursor:grabbing}
.dd-contour{position:absolute;left:-20%;top:-20%;width:140%;height:140%;opacity:.16;pointer-events:none}
.dd-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:none;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;background:rgba(6,34,44,.85);border:1px solid rgba(185,226,127,.35);font-family:var(--dd-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#e6efee}
.dd-anat.is-loading .dd-loading{display:flex}
.dd-fallback{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:40px}
.dd-anat.no-webgl .dd-fallback{display:flex}
.dd-credit{position:absolute;right:18px;bottom:14px;margin:0;font-size:11px;color:#8fa9a7;text-align:right;max-width:60%}
.dd-cue{position:absolute;left:24px;bottom:22px;display:flex;align-items:center;gap:10px;font-family:var(--dd-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#c9dad8;pointer-events:none}
.dd-cue i{display:block;width:1px;height:28px;background:linear-gradient(var(--accent),transparent)}
.dd-panel{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;position:relative}
.dd-big-num{position:absolute;right:-8px;top:50%;transform:translateY(-60%);font-weight:200;font-size:280px;line-height:1;color:rgba(185,226,127,.07);letter-spacing:-.04em;pointer-events:none;user-select:none}
.dd-frame{position:relative;display:flex;flex-direction:column;gap:16px}
.dd-frame[hidden]{display:none}
.dd-frame .kicker{margin:0}
.dd-frame h2,.dd-frame h3{margin:0;color:#fff;font-weight:800;font-size:clamp(1.9rem, 2.6vw + .6rem, 3rem);line-height:1.08;letter-spacing:-.015em;text-wrap:balance}
.dd-desc{margin:0;font-size:1.06rem;line-height:1.6;color:rgba(255,255,255,.85);max-width:46ch}
.dd-chip-title{margin:0;font-size:13px;color:#a9c4c6}
.dd-chips{display:flex;flex-wrap:wrap;gap:8px}
.dd-mchip{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid rgba(185,226,127,.38);color:#e6efee;font-size:14px}
.dd-mchip::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}
.dd-links{display:flex;flex-wrap:wrap;gap:8px}
.dd-link{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.08);color:#ffffff;text-decoration:none;font-size:15px;font-weight:600}
.dd-link:hover{background:rgba(255,255,255,.15);color:#fff}
.dd-link.is-cond{background:transparent;border:1px solid rgba(255,255,255,.35)}
.dd-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:4px}
.dd-anat .btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.dd-anat .btn-outline-light:hover{background:rgba(255,255,255,.1);color:#fff}
@media (max-width: 900px){
  .dd-anat-grid{flex-direction:column;width:auto;margin:0;padding:10px 16px 14px;gap:10px}
  .dd-rail{flex:0 0 auto;overflow-x:auto;scrollbar-width:none}
  .dd-rail-wrap{flex-direction:row}
  .dd-rail-track{display:none}
  .dd-rail-btn{padding:0 14px;white-space:nowrap;flex:none}
  .dd-stage{flex:1 1 50%;border-radius:22px}
  .dd-panel{flex:0 0 auto;justify-content:flex-start}
  .dd-big-num{display:none}
  .dd-frame{gap:10px}
  .dd-frame h2,.dd-frame h3{font-size:1.6rem}
  .dd-desc{font-size:.98rem;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  @media (min-height:740px){.dd-desc{-webkit-line-clamp:6}}
  .dd-extra{display:none !important}
  .dd-links .dd-link:not(.is-cond){display:none}
  .dd-actions,.dd-cue{display:none !important}
  .dd-credit{font-size:9.5px;bottom:8px;right:12px}
}
@media (max-width: 760px){
  .dd-anat{height:calc(var(--dd-vh) + 4800px)}
  .dd-anat-grid{padding-bottom:78px}
  .jr-hud{padding-bottom:84px !important}
}
@media (prefers-reduced-motion:no-preference){
  .dd-frame.is-in{animation:ddPanelIn .55s cubic-bezier(.2,.7,.2,1) both}
  .dd-cue i{animation:ddCue 1.8s ease-in-out infinite}
}
@keyframes ddPanelIn{from{opacity:.15;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ddCue{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .dd-contour{animation:ddContour linear both;animation-timeline:--ddanat;animation-range:contain 0% contain 100%}
  }
}
@keyframes ddContour{from{transform:rotate(0deg) scale(1)}to{transform:rotate(80deg) scale(1.3)}}
.jr-cta{margin:6px 0 0}
.jr-copy .jr-stepbox{min-height:300px}
@media (max-width: 900px){.jr-copy .jr-stepbox{min-height:205px}.jr-cta{margin:0}.jr-cta .btn{min-height:40px;padding:.45rem 1rem;font-size:.92rem}}
.jr-cta .btn{pointer-events:auto}
/* Recovery journey — light studio */
.jr{position:relative;background:var(--dd-deep);color:#ffffff;height:calc(var(--dd-vh) + 2900px)}
.jr-sticky{position:sticky;top:var(--header-h);height:var(--dd-vh);overflow:hidden;background:var(--dd-deep)}
.jr-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.jr-kicker{margin:0}
.jr-intro{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:24px;max-width:1240px;margin:0 auto;padding:0 24px;box-sizing:border-box;pointer-events:none}
.jr-statement{margin:0;max-width:17ch;font-weight:500;font-size:clamp(42px, 5.6vw, 84px);line-height:1.02;letter-spacing:-.045em}
.jr-sw{opacity:.16}
.jr-hud{position:absolute;inset:0;z-index:3;max-width:1240px;margin:0 auto;padding:9vh 24px 34px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}
.jr-h2{margin:0;font-weight:800;font-size:clamp(1.9rem, 2.6vw + .8rem, 3rem);line-height:1.1;letter-spacing:-.01em;color:#ffffff}
.jr-stepnum{margin:0 0 12px;display:inline-flex;align-items:center;gap:10px;font-family:var(--dd-mono);font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.jr-stepnum::before{content:"";width:28px;height:1px;background:var(--accent)}
.jr-copy{display:flex;flex-direction:column;gap:14px;max-width:600px}
.jr-copy .jr-stepbox{margin-top:34px;padding-top:30px;border-top:1px solid rgba(255,255,255,.14)}
.jr-stepbox{position:relative;min-height:250px}
.jr-step{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(16px);transition:opacity .5s, transform .7s cubic-bezier(.2,.7,.2,1)}
.jr-step.is-on{opacity:1;transform:none}
.jr-bigword{margin:0;font-weight:800;font-size:clamp(44px, 5.2vw, 78px);line-height:1;letter-spacing:-.035em;color:#ffffff}
.jr-w{display:inline-block}
.jr-line{margin:18px 0 0;font-size:clamp(18px, 1.5vw, 22px);line-height:1.5;max-width:34ch;color:#c4d8d6}
.jr-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.jr-path{position:relative;flex:1;max-width:520px;display:flex;justify-content:space-between;padding-top:6px}
.jr-path-track{position:absolute;left:5px;right:5px;top:11px;height:1px;background:rgba(255,255,255,.18)}
.jr-path-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#ff7a59,var(--accent))}
.jr-node{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;min-width:10px}
.jr-node:first-of-type{align-items:flex-start}.jr-node:last-of-type{align-items:flex-end}
.jr-node i{width:10px;height:10px;border-radius:50%;background:#031114;border:1px solid rgba(255,255,255,.4);box-sizing:border-box;transition:all .4s}
.jr-node.is-done i{background:rgba(255,255,255,.7);border-color:transparent}
.jr-node.is-on i{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 5px rgba(185,226,127,.18),0 0 18px var(--accent)}
.jr-node span{font-family:var(--dd-mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#7f9c9a;white-space:nowrap;transition:color .4s}
.jr-node.is-on span{color:#ffffff}
.jr-meter{width:260px;display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.jr-mlab{font-family:var(--dd-mono);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:#7f9c9a}
.jr-meter b{font-weight:200;font-size:72px;line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin-top:4px}
.jr-meter b i{font-style:normal}
.jr-meter small{font-size:28px;color:#7f9c9a;margin-left:2px;letter-spacing:0}
.jr-mbar{width:100%;height:2px;background:rgba(255,255,255,.12);margin:12px 0 10px;overflow:hidden}
.jr-mbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff7a59,var(--accent))}
.jr-note{margin:0;font-size:13px;line-height:1.45;color:#86a3a1}
@media (prefers-reduced-motion:no-preference){
  .jr-step.is-on .jr-w{animation:jrWord .55s .2s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes jrWord{from{opacity:0;transform:translateY(.35em);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@media (max-width: 900px){
  .jr-hud{padding:28px 16px 20px}
  .jr-statement{font-size:36px}
  .jr-bigword{font-size:44px !important}
  .jr-line{font-size:16px !important;margin-top:10px}
  .jr-stepbox{min-height:200px}
  .jr-copy .jr-stepbox{margin-top:10px}
  .jr-h2{font-size:26px !important}
  .jr-stepnum{font-size:12px;margin-bottom:8px}
  .jr-copy .jr-stepbox{margin-top:12px;padding-top:14px}
  .jr-foot{flex-direction:column-reverse;align-items:stretch;gap:14px}
  .jr-meter{width:auto;flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:space-between;text-align:left}
  .jr-meter b{font-size:40px}
  .jr-meter small{font-size:18px}
  .jr-mbar{order:3;margin:6px 0 8px}
  .jr-note{order:4;font-size:12px}
  .jr-node span{font-size:10.5px;letter-spacing:.06em}
}
@media (max-width: 600px){
  .jr{height:calc(var(--dd-vh) + 2400px)}
  .jr-hud{padding-bottom:84px}
}

/* ---------- scan intro (photo -> 3D model) ---------- */
.dd-intro{--wipe:0;--wy:0px;position:absolute;inset:0;pointer-events:none;z-index:1}
.dd-intro-clip{position:absolute;inset:0;clip-path:inset(var(--wy) 0 0 0)}
.dd-intro-clip::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 62%, #136068 0%, #0a3540 52%, #072632 100%)}
.dd-intro-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 58%;
  -webkit-mask-image:radial-gradient(ellipse 48% 50% at 50% 50%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 48% 50% at 50% 50%,#000 58%,transparent 100%)}
.dd-scanline{position:absolute;left:8%;right:8%;height:2px;top:var(--wy);margin-top:-1px;border-radius:2px;
  background:linear-gradient(90deg,transparent,#b9e27f 20%,#e9ffd0 50%,#b9e27f 80%,transparent);
  box-shadow:0 0 18px 4px rgba(185,226,127,.55),0 0 60px 10px rgba(185,226,127,.18);
  opacity:min(calc(var(--wipe) * 25), calc((1 - var(--wipe)) * 25), 1)}
.no-webgl .dd-intro{--wipe:0 !important;--wy:0px !important}
@media (prefers-reduced-motion:reduce){.dd-scanline{display:none}}
/* ---------- anatomy panel: tidy structure (head / muscles / care / footer) ---------- */
.dd-frame{gap:0}
.dd-head{display:flex;flex-direction:column;gap:14px}
.dd-label{margin:0 0 10px;font-family:var(--dd-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8fb3b0}
.dd-muscles{margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.dd-mlist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:9px 22px;max-width:520px}
.dd-mlist li{position:relative;padding-left:16px;font-size:14.5px;line-height:1.35;color:#e6efee}
.dd-mlist li::before{content:"";position:absolute;left:0;top:.48em;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px rgba(185,226,127,.55)}
.dd-care{margin-top:20px}
.dd-svcs{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:540px}
.dd-svcs.n1 .dd-svc,.dd-svcs.n3 .dd-svc:last-child{grid-column:1 / -1}
.dd-svc{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:56px;padding:9px 36px 9px 14px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none;transition:background .25s,border-color .25s,transform .25s}
.dd-svc:hover{background:rgba(255,255,255,.11);border-color:rgba(185,226,127,.55);color:#fff;transform:translateY(-1px)}
.dd-svc:focus-visible{outline:3px solid #f0b429;outline-offset:2px}
.dd-svc-name{font-weight:700;font-size:14.5px;line-height:1.25}
.dd-svc-tag{font-size:12.5px;line-height:1.3;color:#a9c4c6}
.dd-svc[href*="cnesst"] .dd-svc-tag,.dd-svc[href*="saaq"] .dd-svc-tag{color:var(--accent)}
.dd-svc svg{position:absolute;right:13px;top:50%;transform:translateY(-50%);opacity:.65}
.dd-foot{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.dd-frame[data-frame="0"] .dd-foot{border-top:0;padding-top:4px}
.dd-more{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;font-size:15px;text-decoration:none;padding-bottom:2px;border-bottom:1px solid rgba(255,255,255,.3)}
.dd-more:hover{color:#fff;border-bottom-color:var(--accent)}
.dd-big-num{color:rgba(185,226,127,.05)}
@media (max-height: 760px) and (min-width: 901px){
  .dd-frame h2,.dd-frame h3{font-size:clamp(1.6rem, 2vw + .6rem, 2.4rem)}
  .dd-desc{font-size:.98rem}
  .dd-muscles{margin-top:14px;padding-top:12px}.dd-care{margin-top:12px}.dd-foot{margin-top:14px;padding-top:12px}
  .dd-svc{min-height:48px}
}
@media (max-width: 900px){
  .dd-muscles{display:none !important}
  .dd-care{margin-top:10px}
  .dd-care .dd-label{display:none}
  .dd-svcs{display:flex;overflow-x:auto;gap:8px;max-width:none;scrollbar-width:none;margin:0 -16px;padding:0 16px}
  .dd-svcs::-webkit-scrollbar{display:none}
  .dd-svc{flex:none;min-height:44px;padding:6px 32px 6px 12px;border-radius:12px}
  .dd-svc-name{font-size:13.5px}.dd-svc-tag{font-size:12px}
  .dd-foot{margin-top:10px;padding-top:0;border-top:0}
  .dd-book{display:none}
  .dd-more{font-size:14px}
}
.dd-rail-btn{transition:color .2s}
.dd-big-num{display:none}
/* ---------- journey v2: night -> day, big step numbers ---------- */
.jr{--jr-day:0}
.dd-wave-out-jr{background:#d8ebe7}
.jr-stepnum{display:flex;align-items:flex-end;gap:14px;margin:0 0 6px;letter-spacing:.18em}
.jr-stepnum::before{display:none}
.jr-num{font-weight:800;font-size:clamp(72px, 9vw, 132px);line-height:.82;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:2px var(--accent);text-stroke:2px var(--accent);text-shadow:0 0 24px rgba(185,226,127,.25);transition:color .5s,-webkit-text-stroke .5s}
.jr-stepnum span{padding-bottom:10px;font-family:var(--dd-mono);font-size:13px;color:var(--accent);text-transform:uppercase}
.jr-bigword{font-size:clamp(34px, 3.8vw, 56px)}
.jr.is-day .jr-h2,.jr.is-day .jr-bigword,.jr.is-day .jr-meter b{color:#0b2a30}
.jr.is-day .jr-line{color:#2d4a50}
.jr.is-day .jr-num{-webkit-text-stroke:2px #0e7c86;text-stroke:2px #0e7c86;text-shadow:none}
.jr.is-day .jr-stepnum span,.jr.is-day .jr-kicker{color:#0e7c86}
.jr.is-day .jr-mlab,.jr.is-day .jr-note,.jr.is-day .jr-node span,.jr.is-day .jr-meter small{color:#4d6b70}
.jr.is-day .jr-node.is-on span{color:#0b2a30}
.jr.is-day .jr-path-track{background:rgba(11,42,48,.18)}
.jr.is-day .jr-node i{background:#fff;border-color:rgba(11,42,48,.4)}
.jr.is-day .jr-node.is-done i{background:#0e7c86;border-color:transparent}
.jr.is-day .jr-node.is-on i{background:#0e7c86;border-color:#0e7c86;box-shadow:0 0 0 5px rgba(14,124,134,.18)}
.jr.is-day .jr-mbar{background:rgba(11,42,48,.12)}
.jr.is-day .jr-copy .jr-stepbox{border-top-color:rgba(11,42,48,.14)}
.jr.is-day .jr-cta .btn-light{background:#0e4f57;color:#fff}
.jr-h2,.jr-bigword,.jr-line,.jr-mlab,.jr-note,.jr-node span,.jr-kicker,.jr-stepnum span,.jr-meter b,.jr-meter small{transition:color .6s ease}
.jr-node{pointer-events:auto}
@media (max-width:900px){.jr-num{font-size:60px}.jr-stepnum{gap:10px}.jr-stepnum span{font-size:11px;padding-bottom:6px}.jr-bigword{font-size:36px !important}}
.jr-copy .jr-stepbox{min-height:380px}
.jr-copy .jr-stepbox{margin-top:22px;padding-top:18px}
@media (max-height:780px) and (min-width:901px){.jr-num{font-size:84px}.jr-bigword{font-size:40px}.jr-copy .jr-stepbox{min-height:330px}}
@media (max-width:900px){.jr-copy .jr-stepbox{min-height:250px}.jr-hud{padding-top:18px}}
/* ---------- journey v3: 3D step numerals, depth and parallax ---------- */
.jr{--jr-tx:0;--jr-ty:0}
.jr-copy{transform:perspective(1400px) rotateY(calc(var(--jr-tx) * 5deg)) rotateX(calc(var(--jr-ty) * -3.5deg));transform-style:preserve-3d;will-change:transform}
.jr-stepbox{perspective:900px;transform-style:preserve-3d}
.jr-step{transform-style:preserve-3d;backface-visibility:hidden}
.jr-stepnum{transform:translateZ(46px);transform-style:preserve-3d}
.jr-bigword{transform:translateZ(26px)}
.jr-line{transform:translateZ(10px)}
.jr-num{display:inline-block;color:var(--accent);-webkit-text-stroke:0;text-stroke:0;transform-origin:50% 100%;backface-visibility:hidden;
  text-shadow:0 1px 0 #a6cf6b,0 2px 0 #93bb5b,0 3px 0 #80a74c,0 4px 0 #6e933e,0 5px 0 #5c7f31,0 6px 0 #4b6b26,0 7px 0 #3c581d,0 14px 26px rgba(0,0,0,.5);
  transition:color .6s,text-shadow .6s}
.jr.is-day .jr-num{color:#0e7c86;-webkit-text-stroke:0;text-stroke:0;
  text-shadow:0 1px 0 #0c6f78,0 2px 0 #0b626a,0 3px 0 #09555c,0 4px 0 #08494f,0 5px 0 #063d42,0 6px 0 #053237,0 7px 0 #04282c,0 12px 22px rgba(11,42,48,.28)}
.jr-step.is-leaving{opacity:1;transform:none;transition:none;pointer-events:none;z-index:1}
.jr-step.is-on{z-index:2}
@media (prefers-reduced-motion:no-preference){
  .jr-step.is-on .jr-num{animation:jrNumIn .62s .14s cubic-bezier(.2,.85,.25,1) both}
  .jr-step.is-leaving .jr-num{animation:jrNumOut .22s cubic-bezier(.55,0,.8,.45) both}
  .jr.jr-back .jr-step.is-on .jr-num{animation-name:jrNumInBack}
  .jr.jr-back .jr-step.is-leaving .jr-num{animation-name:jrNumOutBack}
  .jr-step.is-on .jr-bigword{animation:jrWordTilt .7s .2s cubic-bezier(.2,.8,.2,1) both}
  .jr-step.is-leaving .jr-bigword,.jr-step.is-leaving .jr-line,.jr-step.is-leaving .jr-stepnum span{animation:jrOut .13s ease both}
  .jr-step.is-on .jr-line{animation:jrLineIn .7s .3s cubic-bezier(.2,.8,.2,1) both}
}
@keyframes jrNumIn{from{transform:translateZ(46px) rotateX(-108deg) translateY(.18em);opacity:0}45%{opacity:1}to{transform:translateZ(46px);opacity:1}}
@keyframes jrNumOut{from{transform:translateZ(46px);opacity:1}to{transform:translateZ(46px) rotateX(104deg) translateY(-.18em);opacity:0}}
@keyframes jrNumInBack{from{transform:translateZ(46px) rotateX(108deg) translateY(-.18em);opacity:0}45%{opacity:1}to{transform:translateZ(46px);opacity:1}}
@keyframes jrNumOutBack{from{transform:translateZ(46px);opacity:1}to{transform:translateZ(46px) rotateX(-104deg) translateY(.18em);opacity:0}}
@keyframes jrWordTilt{from{transform:translateZ(26px) rotateY(-22deg) translateX(-14px);opacity:0}to{transform:translateZ(26px);opacity:1}}
@keyframes jrLineIn{from{transform:translateZ(10px) translateY(14px);opacity:0}to{transform:translateZ(10px);opacity:1}}
@keyframes jrOut{from{opacity:1}to{opacity:0;transform:translateY(-10px)}}
.jr-step.is-on .jr-num{transform-origin:50% 100%}
.jr-step.is-leaving .jr-num{transform-origin:50% 0%}
/* progress nodes as small 3D beads */
.jr-node i{width:12px;height:12px;border:0;background:radial-gradient(circle at 35% 30%,#fff 0,#b8c9c8 45%,#3b5559 100%);box-shadow:0 2px 4px rgba(0,0,0,.45)}
.jr-node.is-done i{background:radial-gradient(circle at 35% 30%,#fff 0,#d9e9e8 50%,#7f9c9a 100%)}
.jr-node.is-on i{background:radial-gradient(circle at 35% 30%,#f4ffe3 0,var(--accent) 45%,#5c7f31 100%);border:0;box-shadow:0 0 0 5px rgba(185,226,127,.18),0 0 18px var(--accent),0 2px 4px rgba(0,0,0,.4)}
.jr.is-day .jr-node i{background:radial-gradient(circle at 35% 30%,#fff 0,#e8f1f0 45%,#8aa5a8 100%);box-shadow:0 2px 4px rgba(11,42,48,.25)}
.jr.is-day .jr-node.is-done i{background:radial-gradient(circle at 35% 30%,#bfe6e8 0,#0e7c86 55%,#06383d 100%)}
.jr.is-day .jr-node.is-on i{background:radial-gradient(circle at 35% 30%,#d8f3f4 0,#0e7c86 50%,#06383d 100%);box-shadow:0 0 0 5px rgba(14,124,134,.18),0 2px 4px rgba(11,42,48,.3)}
.jr-meter b{text-shadow:0 1px 0 rgba(255,255,255,.18),0 10px 20px rgba(0,0,0,.35)}
.jr.is-day .jr-meter b{text-shadow:0 1px 0 #fff,0 8px 16px rgba(11,42,48,.18)}
@media (max-width:900px){.jr-copy{transform:none}.jr-stepnum,.jr-bigword,.jr-line{transform:none}}
.jr-copy .jr-stepbox{margin-top:30px}

/* ---------- journey v3b: no overlap during step change, brand, booking CTA ---------- */
.jr-step{transition:opacity .16s, transform .5s cubic-bezier(.2,.7,.2,1)}
.jr-step:not(.is-on):not(.is-leaving){visibility:hidden;transition:opacity .16s, transform .5s, visibility 0s .16s}
.jr-step.is-on .jr-stepnum span{animation:jrLineIn .5s .26s cubic-bezier(.2,.8,.2,1) both}
.jr-step.is-leaving .jr-num{transform-origin:50% 0%}
.jr-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.jr-cta .jr-book{box-shadow:0 10px 26px rgba(14,124,134,.45),0 0 0 1px rgba(255,255,255,.08) inset}
.jr-cta .jr-book:hover{box-shadow:0 14px 32px rgba(14,124,134,.6)}
.jr.is-day .jr-cta .jr-book{box-shadow:0 10px 24px rgba(14,124,134,.3)}
.jr-brand{position:absolute;right:24px;top:9vh;width:150px;pointer-events:none;opacity:.95;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35))}
.jr-brand img{display:block;width:150px;height:auto;position:absolute;right:0;top:0;transition:opacity .6s}
.jr-brand .jr-brand-d{opacity:0}
.jr.is-day .jr-brand .jr-brand-n{opacity:0}
.jr.is-day .jr-brand .jr-brand-d{opacity:1}
.jr.is-day .jr-brand{filter:drop-shadow(0 6px 14px rgba(11,42,48,.15))}
.jr-copy-right{margin:6px 0 0;font-family:var(--dd-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6f8d8b}
.jr.is-day .jr-copy-right{color:#4d6b70}
@media (max-width:900px){.jr-brand{width:96px;top:16px;right:16px}.jr-brand img{width:96px}.jr-copy-right{order:5;font-size:10px}.jr-cta{gap:8px}}
.jr-meter b{font-size:62px;margin-top:0}
.jr-mbar{margin:8px 0 6px}
.jr-note{font-size:12px;line-height:1.35}
.jr-copy-right{margin-top:4px;font-size:10.5px}
@media (max-height:780px) and (min-width:901px){.jr-meter b{font-size:54px}.jr-note{display:none}}
.jr-hud{padding-top:7vh}
.jr-brand{top:7vh}
.jr-copy .jr-stepbox{min-height:330px;margin-top:22px}
.jr-copy-right{white-space:nowrap}
@media (max-height:820px) and (min-width:901px){.jr-copy .jr-stepbox{min-height:280px;margin-top:14px;padding-top:12px}.jr-num{font-size:76px}.jr-bigword{font-size:38px}.jr-line{font-size:17px;margin-top:10px}.jr-h2{font-size:1.9rem}.jr-hud{padding-top:5vh;padding-bottom:22px}.jr-brand{top:5vh;width:120px}.jr-brand img{width:120px}.jr-meter b{font-size:48px}}
.jr-cta{margin-top:14px}

/* ---------- journey ending: the runner becomes the dot of the logo ---------- */
.jr{--jr-end:0}
.jr-brand{width:118px;opacity:.78;transform-origin:6% 44%;transform:scale(calc(1 + var(--jr-end) * .55));transition:opacity .5s;will-change:transform}
.jr-brand img{width:118px}
.jr.is-end .jr-brand{opacity:1}
.jr-brand::after{content:"";position:absolute;left:6.2%;top:44.5%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--accent);opacity:0;transform:scale(.4);box-shadow:0 0 0 0 rgba(185,226,127,.6)}
.jr.is-end .jr-brand::after{animation:jrDot 1.4s .9s ease-out both}
.jr.is-day .jr-brand::after{background:#0e7c86;box-shadow:0 0 0 0 rgba(14,124,134,.5)}
@keyframes jrDot{0%{opacity:0;transform:scale(.4);box-shadow:0 0 0 0 rgba(185,226,127,.6)}25%{opacity:1;transform:scale(1.3)}100%{opacity:0;transform:scale(1);box-shadow:0 0 0 46px rgba(185,226,127,0)}}
.jr-final{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(14px);transition:opacity .6s .35s,transform .7s .35s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.jr.is-end .jr-final{opacity:1;transform:none}
.jr.is-end .jr-step{opacity:0 !important;transition:opacity .3s}
.jr-final .jr-stepnum span{padding:0}
.jr-final h3{margin:10px 0 0;font-weight:800;font-size:clamp(34px, 3.8vw, 56px);line-height:1;letter-spacing:-.035em;color:#fff}
.jr.is-day .jr-final h3{color:#0b2a30}
.jr-final p.jr-line{max-width:30ch}
@media (max-width:900px){.jr-brand{width:92px;opacity:.85}.jr-brand img{width:92px}}

/* ---------- journey v4: JS-driven step transition, smaller numeral with "Step" label, logo-figure start/ending ---------- */
.jr-stepnum{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:0 0 4px}
.jr-stepnum .jr-steplab{font-family:var(--dd-mono);font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--accent);padding:0}
.jr.is-day .jr-stepnum .jr-steplab{color:#0e7c86}
.jr-num{font-size:clamp(52px, 5.6vw, 84px);line-height:.9}
.jr-step.is-on .jr-num,.jr-step.is-on .jr-bigword,.jr-step.is-on .jr-line,.jr-step.is-on .jr-w,.jr-step.is-on .jr-stepnum span,.jr-step.is-leaving .jr-num,.jr-step.is-leaving .jr-bigword,.jr-step.is-leaving .jr-line,.jr-step.is-leaving .jr-stepnum span,.jr.jr-back .jr-step.is-on .jr-num,.jr.jr-back .jr-step.is-leaving .jr-num{animation:none !important}
.jr-step,.jr-step:not(.is-on):not(.is-leaving){transition:none !important;opacity:0;transform:none;visibility:hidden}
.jr-step.is-on,.jr-step.is-leaving{visibility:visible}
.jr-step .jr-num,.jr-step .jr-bigword,.jr-step .jr-line{will-change:transform,opacity;backface-visibility:hidden}
.jr-step .jr-num{transform-origin:50% 100%}
.jr-brand{transform:none;opacity:.85}
.jr.is-end .jr-brand{opacity:1}
@media (max-width:900px){.jr-num{font-size:48px}.jr-stepnum .jr-steplab{font-size:10px}}
@media (max-height:820px) and (min-width:901px){.jr-num{font-size:60px}}

/* ---------- journey v5: inline "STEP n", JS-driven panels, logo intro + outro ---------- */
.jr-copy{transform:none;will-change:transform,opacity}
.jr-stepnum{flex-direction:row;align-items:baseline;gap:12px;margin:0 0 10px;transform:none;transform-style:flat;perspective:420px}
.jr-stepnum .jr-steplab{font-size:13px;letter-spacing:.24em;padding:0;display:inline-block}
.jr-num{font-size:clamp(46px, 4.4vw, 66px);line-height:.95;transform-origin:50% 60%;will-change:transform,opacity}
.jr-bigword,.jr-line{transform:none;will-change:transform,opacity}
.jr-copy .jr-stepbox{margin-top:16px;padding-top:16px;min-height:300px}
.jr-step{will-change:opacity,transform}
.jr-cta{will-change:opacity,transform}
.jr-outro{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 24px 130px;box-sizing:border-box;pointer-events:none;text-align:center}
.jr-logo-slot{width:clamp(220px, 23vw, 330px);aspect-ratio:520/372;flex:none}
.jr-outro-copy{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:10px}
.jr-outro-h{margin:0;font-weight:800;font-size:clamp(30px, 3vw, 44px);line-height:1.05;letter-spacing:-.03em;color:#0b2a30}
.jr-outro-line{margin:0;max-width:40ch;font-size:clamp(16px, 1.25vw, 19px);line-height:1.5;color:#2d4a50}
.jr-outro-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:10px}
.jr-outro-h,.jr-outro-line,.jr-outro-cta{opacity:0;will-change:opacity,transform}
.jr-outro.is-live .jr-outro-cta .btn{pointer-events:auto}
.jr-outro .jr-book{box-shadow:0 10px 24px rgba(14,124,134,.32)}
.jr-outro .jr-call{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#0b2a30;box-shadow:0 0 0 1px rgba(11,42,48,.16) inset,0 6px 16px rgba(11,42,48,.08)}
.jr:not(.is-day) .jr-outro-h{color:#fff}
.jr:not(.is-day) .jr-outro-line{color:#c4d8d6}
@media (max-width:900px){
  .jr-logo-slot{width:54vw}
  .jr-outro{padding-bottom:170px}
  .jr-outro-cta{flex-direction:column;align-items:stretch;width:min(320px, 86vw)}
  .jr-outro-cta .btn{justify-content:center}
  .jr-num{font-size:44px}
}
@media (max-height:820px) and (min-width:901px){.jr-num{font-size:52px}.jr-logo-slot{width:clamp(200px, 20vw, 280px)}.jr-outro{padding-bottom:110px}}
/* logo slot sits at the optical centre of the stage; the ending copy hangs under it */
.jr-outro{display:block;padding:0}
.jr-logo-slot{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%)}
.jr-outro-copy{position:absolute;left:50%;top:calc(44% + clamp(220px, 23vw, 330px) * .358 + 18px);transform:translateX(-50%);width:min(640px, 92vw);margin:0}
@media (max-height:820px) and (min-width:901px){.jr-logo-slot{top:41%}.jr-outro-copy{top:calc(41% + clamp(200px, 20vw, 280px) * .358 + 14px)}}
@media (max-width:900px){.jr-logo-slot{top:36%}.jr-outro-copy{top:calc(36% + 54vw * .358 + 14px)}}
@media (max-width:900px){
  .jr-logo-slot{width:50vw;top:29%}
  .jr-outro-copy{top:calc(29% + 50vw * .358 + 12px);gap:6px}
  .jr-outro-h{font-size:28px}
  .jr-outro-line{font-size:14.5px}
  .jr-outro-cta{flex-direction:row;flex-wrap:wrap;width:auto;gap:8px;margin-top:6px}
  .jr-outro-cta .btn{min-height:40px;padding:.45rem .95rem;font-size:.9rem}
}

/* ---------- journey v6: longer pinned run (logo -> runner -> steps -> ending hold), bigger step numerals, intro line ---------- */
.jr{height:calc(var(--dd-vh) + 3600px)}
@media (max-width:900px){.jr{height:calc(var(--dd-vh) + 3000px)}}
.jr-stepnum{gap:14px;margin:0 0 12px}
.jr-stepnum .jr-steplab{font-size:14px}
.jr-num{font-size:clamp(60px, 5.8vw, 88px);line-height:.9}
@media (max-height:820px) and (min-width:901px){.jr-num{font-size:68px}}
@media (max-width:900px){.jr-num{font-size:56px}.jr-stepnum .jr-steplab{font-size:11px}}
.jr-lead{position:absolute;inset:0 0 auto 0;opacity:0;visibility:hidden;will-change:opacity,transform}
.jr-lead-line{margin:0;max-width:24ch;font-size:clamp(21px, 1.8vw, 27px);line-height:1.35;font-weight:500;letter-spacing:-.01em;color:#d7e7e4}
.jr-lead-cue{margin:26px 0 0;display:flex;align-items:center;gap:12px;font-family:var(--dd-mono);font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--accent)}
.jr-lead-cue i{position:relative;display:block;width:1px;height:34px;background:rgba(185,226,127,.22);overflow:hidden}
.jr-lead-cue i::after{content:"";position:absolute;left:0;top:-45%;width:1px;height:45%;background:var(--accent);animation:jrCue 1.9s cubic-bezier(.6,0,.3,1) infinite}
@keyframes jrCue{to{top:100%}}
@media (prefers-reduced-motion:reduce){.jr-lead-cue i::after{animation:none;top:30%}}
@media (max-width:900px){.jr-lead-line{font-size:18px}.jr-lead-cue{margin-top:16px;font-size:10px}.jr-lead-cue i{height:26px}}
/* phones: the intro logo sits lower, clear of the intro line; the ending logo keeps its place above the copy */
@media (max-width:900px){.jr.jr-intro-side .jr-logo-slot{top:45%}}

/* ---------- journey v7: full-height stage on every screen, short phones, tablets, phones held sideways ---------- */
:root{--jr-h:calc(100vh - var(--header-h))}
@supports (height:100svh){:root{--jr-h:calc(100svh - var(--header-h))}}
.jr{height:calc(var(--jr-h) + 3600px)}
.jr-sticky{height:var(--jr-h)}
@media (max-width:900px){.jr{height:calc(var(--jr-h) + 3000px)}}
/* tablets / phones: the logo never grows past 300 px */
@media (max-width:900px){
  .jr-logo-slot{width:min(50vw, 300px)}
  .jr-outro-copy{top:calc(29% + min(50vw, 300px) * .358 + 12px)}
}
@media (min-width:601px) and (max-width:900px){.jr.jr-intro-side .jr-logo-slot{top:50%}}
/* short phones (iPhone SE and similar): compact type so the meter and dots stay above the booking bar */
@media (max-width:900px) and (max-height:760px){
  .jr-hud{padding-top:12px}
  .jr-h2{font-size:24px}
  .jr-copy{gap:8px}
  .jr-copy .jr-stepbox{margin-top:6px;padding-top:10px;min-height:176px}
  .jr-num{font-size:44px}
  .jr-stepnum{margin-bottom:6px}
  .jr-bigword{font-size:27px !important;line-height:1.08}
  .jr-line{font-size:14.5px;line-height:1.45;margin-top:6px}
  .jr-lead-line{font-size:16px}
  .jr-lead-cue{margin-top:10px}
  .jr-note{display:none}
  .jr-meter b{font-size:30px}
  .jr-foot{gap:8px}
  .jr-cta .btn{min-height:38px;font-size:.88rem}
  .jr.jr-intro-side .jr-logo-slot{top:52%;width:min(44vw, 200px)}
  .jr-logo-slot{width:min(44vw, 200px);top:27%}
  .jr-outro-copy{top:calc(27% + min(44vw, 200px) * .358 + 10px)}
  .jr-outro-h{font-size:24px}
  .jr-outro-line{font-size:13.5px}
}
/* phones held sideways: copy on the left, logo and runner on the right, everything compact */
@media (orientation:landscape) and (max-height:500px){
  .jr-hud{padding:10px 20px 12px;max-width:none}
  .jr-copy{max-width:48%;gap:4px}
  .jr-kicker{display:none}
  .jr-h2{font-size:20px}
  .jr-copy .jr-stepbox{margin-top:6px;padding-top:8px;min-height:112px}
  .jr-num{font-size:34px}
  .jr-stepnum{margin-bottom:2px}
  .jr-stepnum .jr-steplab{font-size:10px}
  .jr-bigword{font-size:21px !important;line-height:1.1}
  .jr-line{font-size:12.5px;line-height:1.4;margin-top:4px}
  .jr-lead-line{font-size:14px;max-width:30ch}
  .jr-lead-cue{margin-top:8px;font-size:10px}
  .jr-lead-cue i{height:20px}
  .jr-cta .btn{min-height:32px;padding:.3rem .8rem;font-size:.8rem}
  .jr-foot{flex-direction:row;align-items:flex-end;gap:16px}
  .jr-path{max-width:46%}
  .jr-node span{font-size:9px}
  .jr-meter{width:auto;flex-direction:column;align-items:flex-end}
  .jr-meter b{font-size:26px}
  .jr-note,.jr-mbar{display:none}
  .jr-logo-slot,.jr.jr-intro-side .jr-logo-slot{width:clamp(110px, 30vh, 170px);top:40%;left:70%}
  .jr-outro-copy{top:calc(40% + clamp(110px, 30vh, 170px) * .358 + 6px);left:70%;width:min(360px, 52vw);gap:4px}
  .jr-outro-h{font-size:19px}
  .jr-outro-line{display:none}
  .jr-outro-cta{flex-direction:row;gap:6px;margin-top:4px}
  .jr-outro-cta .btn{min-height:32px;padding:.3rem .75rem;font-size:.8rem}
}
@media (orientation:landscape) and (max-height:500px){.jr-meter{margin-right:56px}}
/* small phones held sideways: the site's booking bar takes the bottom, so the progress row steps aside */
@media (orientation:landscape) and (max-height:500px) and (max-width:700px){.jr-hud{padding-bottom:72px}.jr-foot{display:none}}

/* ---------- without JavaScript: both sections become ordinary, readable blocks ---------- */
.dd-fallback svg{height:80%;width:auto}
.jr-cta .btn,.jr-outro-cta .btn{white-space:nowrap}
html:not(.js) .dd-anat{height:auto}
html:not(.js) .dd-anat-sticky{position:static;height:auto;overflow:visible}
html:not(.js) .dd-anat-grid{display:grid;grid-template-columns:1fr;padding:40px 0}
html:not(.js) .dd-rail,html:not(.js) .dd-stage canvas,html:not(.js) .dd-scanline,html:not(.js) .dd-loading{display:none}
html:not(.js) .dd-stage{min-height:420px;max-width:520px;margin:0 auto;width:100%}
html:not(.js) .dd-frame[hidden]{display:flex}
html:not(.js) .dd-frame{margin-bottom:36px}
html:not(.js) .jr{height:auto}
html:not(.js) .jr-sticky{position:static;height:auto}
html:not(.js) .jr-canvas,html:not(.js) .jr-outro,html:not(.js) .jr-lead-cue,html:not(.js) .jr-foot{display:none}
html:not(.js) .jr-hud{position:static;padding:48px 24px;display:block}
html:not(.js) .jr-copy{transform:none;max-width:720px}
html:not(.js) .jr-stepbox{min-height:0}
html:not(.js) .jr-step{position:static;opacity:1 !important;visibility:visible !important;transform:none !important;margin:0 0 28px}
html:not(.js) .jr-lead{position:static;opacity:1 !important;visibility:visible !important;margin-bottom:24px}
html:not(.js) .jr-cta{opacity:1 !important;visibility:visible !important}