/* ═══════════════════════════ Growth Gusto · visite guidée (js/tour.js) ═══════════════════════════
   A cream card on a soft ink scrim; the scrim is the giant shadow of the spotlight, so the target shows through a rounded hole. */
.gt{position:absolute;inset:0;z-index:76;pointer-events:auto;opacity:0;transition:opacity .32s var(--ease);font-family:var(--f);color:var(--ink);-webkit-tap-highlight-color:transparent}
.gt.on{opacity:1}
.gt.off{opacity:0;pointer-events:none;transition:opacity .28s var(--ease)}
.gt-catch{position:absolute;inset:0;cursor:default}

.gt-spot{position:absolute;left:0;top:0;width:0;height:0;border-radius:24px;pointer-events:none;
  box-shadow:0 0 0 2.5px rgba(255,253,248,.95),0 0 0 200vmax rgba(27,21,48,.58);
  transition:transform .55s var(--spring-soft),width .55s var(--spring-soft),height .55s var(--spring-soft),border-radius .4s var(--ease),box-shadow .35s var(--ease)}
.gt-spot::after{content:"";position:absolute;inset:-2.5px;border-radius:inherit;animation:gtPulse 2.4s .7s var(--ease) infinite}
.gt.nospot .gt-spot{box-shadow:0 0 0 0 rgba(255,253,248,0),0 0 0 200vmax rgba(27,21,48,.58)}
.gt.nospot .gt-spot::after{display:none}
@keyframes gtPulse{0%{box-shadow:0 0 0 0 rgba(246,185,59,.85)}70%,100%{box-shadow:0 0 0 12px rgba(246,185,59,0)}}

.gt-card{position:absolute;left:0;top:0;box-sizing:border-box;width:min(360px,calc(100vw - 24px));padding:16px 18px 16px;border-radius:24px;background:var(--paper);border:1.5px solid var(--rim);
  box-shadow:0 3px 0 #E2D6C2,0 26px 50px -22px rgba(27,21,48,.55);outline:none;
  transition:transform .55s var(--spring-soft)}
.gt-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.gt .gt-card{animation:gtIn .5s var(--spring) both}
@keyframes gtIn{from{opacity:0;scale:.92}to{opacity:1;scale:1}}
.gt-card.nudge{animation:gtNudge .42s var(--ease)}
@keyframes gtNudge{0%,100%{translate:0}20%{translate:-6px}45%{translate:5px}70%{translate:-3px}}

/* notch pointing at the target */
.gt-notch{position:absolute;width:16px;height:16px;background:var(--paper);border:1.5px solid var(--rim);border-radius:4px;transform:translate(-50%,-50%) rotate(45deg);display:none}
.gt-card[data-side=b] .gt-notch{display:block;top:0!important;border-right:0;border-bottom:0}
.gt-card[data-side=t] .gt-notch{display:block;top:100%!important;border-left:0;border-top:0;box-shadow:3px 3px 0 -1px #E2D6C2}
.gt-card[data-side=r] .gt-notch{display:block;left:0!important;border-right:0;border-top:0}

.gt-top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:28px;margin:-4px -6px 6px 0}
.gt-n{font-size:12.5px;font-weight:700;color:var(--faint);letter-spacing:-.01em}
.gt-skip{all:unset;box-sizing:border-box;cursor:pointer;height:32px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:650;color:var(--ink-2);background:var(--cream-2);transition:background .2s,transform .2s var(--spring)}
.gt-skip:hover{background:var(--cream-3)}
.gt-skip:active{transform:scale(.95)}
.gt-skip:focus-visible,.gt-b:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}

.gt-body.in{animation:gtFw .42s var(--spring-soft) both}
.gt-body.in.bw{animation-name:gtBw}
@keyframes gtFw{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
@keyframes gtBw{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
.gt-h{display:flex;align-items:center;gap:10px}
.gt-ic{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--accent)}
.gt-ic .ico,.gt-ic svg{width:19px;height:19px}
.gt-h b{font-family:var(--d);font-variation-settings:"opsz" 96,"wdth" 92;font-size:20px;font-weight:750;letter-spacing:-.025em;line-height:1.1}
.gt-body p{margin:8px 0 0;font-size:15.5px;line-height:1.42;font-weight:550;color:var(--ink-2);text-wrap:pretty}

.gt-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.gt-dots{display:flex;align-items:center;gap:5px;min-width:0}
.gt-dots i{width:7px;height:7px;border-radius:999px;background:#E4DACA;transition:width .35s var(--spring),background .25s}
.gt-dots i.past{background:#C9B8FF}
.gt-dots i.on{width:20px;background:var(--accent)}
.gt-btns{display:flex;gap:8px;flex:none}
.gt-b{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 16px;border-radius:15px;font-size:15px;font-weight:700;white-space:nowrap;
  transition:transform .18s var(--spring),box-shadow .18s var(--spring)}
.gt-b[hidden]{display:none}
.gt-back{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px #DCCFB8,0 4px 0 #E2D6C2}
.gt-next{background:var(--accent);color:#fff;box-shadow:0 4px 0 var(--accent-edge);padding:0 20px}
.gt-b:active{transform:translateY(4px);box-shadow:none}
.gt-back:active{box-shadow:inset 0 0 0 1.5px #DCCFB8}
.gt-b .ico,.gt-b svg{width:18px;height:18px}

/* the last card: centred, a little celebration, the first relevé as the one clear action */
.gt.fin .gt-card{width:min(380px,calc(100vw - 32px));padding:22px 22px 20px;text-align:center}
.gt.fin .gt-top{display:none}
.gt.fin .gt-h{justify-content:center}
.gt.fin .gt-h b{font-size:26px;letter-spacing:-.03em}
.gt.fin .gt-body p{margin-top:6px}
.gt.fin .gt-foot{flex-direction:column;align-items:stretch;gap:14px;margin-top:20px}
.gt.fin .gt-dots{display:none}
.gt.fin .gt-btns{flex-direction:column-reverse;gap:10px}
.gt.fin .gt-b{width:100%;height:52px;font-size:16px}
.gt.fin .gt-back{background:transparent;box-shadow:none;color:var(--ink-2);height:40px;font-weight:650}
.gt.fin .gt-back:active{transform:scale(.97)}
.gt-hero{position:relative;display:block;width:84px;height:84px;margin:2px auto 14px}
.gt-hi{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;background:var(--saffron);color:var(--ink);box-shadow:0 4px 0 var(--saffron-edge);animation:gtPop .7s .1s var(--spring) both}
.gt-hi .ico,.gt-hi svg{width:38px;height:38px}
.gt-hero i{position:absolute;border-radius:50%;animation:gtPop .6s var(--spring) both}
.gt-c1{width:14px;height:14px;background:var(--accent);left:-14px;top:12px;animation-delay:.28s!important}
.gt-c2{width:10px;height:10px;background:var(--tomato);right:-12px;top:2px;animation-delay:.36s!important}
.gt-c3{width:12px;height:12px;background:var(--sky);right:-18px;bottom:10px;animation-delay:.44s!important}
@keyframes gtPop{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}

@media (max-width:359px){.gt-b{padding:0 12px}.gt-next{padding:0 14px}}
@media (min-width:960px){.gt-card{width:380px}}

/* reduced motion: no slides, no springs, no pulse; a plain cross-fade */
.gt.rm .gt-spot,.gt.rm .gt-card{transition:none}
.gt.rm .gt-spot::after{display:none}
.gt.rm .gt-card,.gt.rm .gt-body.in,.gt.rm .gt-hi,.gt.rm .gt-hero i{animation:none}
@media (prefers-reduced-motion:reduce){
  .gt-spot,.gt-card{transition:none!important}
  .gt-spot::after{display:none}
  .gt-card,.gt-body.in,.gt-hi,.gt-hero i,.gt-card.nudge{animation:none!important}
}
.gt .gt-card:focus,.gt .gt-card:focus-visible{outline:none!important;box-shadow:0 3px 0 #E2D6C2,0 26px 50px -22px rgba(27,21,48,.55)!important}
/* a target with close neighbours (sidebar lines, tabs): the frame hugs it and the white ring is drawn inside, so it never touches the next one */
.gt-spot.tight{box-shadow:inset 0 0 0 2px rgba(255,253,248,.95),0 0 0 200vmax rgba(27,21,48,.58)}
.gt-spot.tight::after{inset:0}
.gt-card[data-side=l] .gt-notch{display:block;left:100%!important;border-left:0;border-bottom:0}