/* St Annes "What happens at your appointment?" step-by-step walkthrough, for the dark band (TEST build). Built by stannes-expect.js. */
#appointment.is-stepper .clv-bandpic,#appointment.is-stepper .clv-steps{display:none}
.se{max-width:1060px;margin:clamp(22px,3vw,34px) auto 0}
.se__rail{position:relative;display:grid;grid-template-columns:repeat(4,1fr);max-width:860px;margin:0 auto clamp(22px,3vw,32px)}
.se__line{position:absolute;left:12.5%;right:12.5%;top:27px;height:4px;border-radius:9px;background:rgba(230,184,92,.22)}
.se__line i{display:block;height:100%;width:0;border-radius:9px;background:linear-gradient(90deg,#C9A25B,#E6B85C);transition:width .55s cubic-bezier(.22,.8,.28,1)}
.se__step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 4px;border:0;background:none;cursor:pointer;font-family:'Outfit',sans-serif;color:rgba(245,237,228,.62)}
.se__n{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-family:'Playfair Display',Georgia,serif;font-size:1.4rem;font-weight:600;color:rgba(245,237,228,.8);
  background:#2F241E;border:1.5px solid rgba(230,184,92,.35);box-shadow:inset 3px 3px 8px rgba(0,0,0,.40),inset -2px -2px 6px rgba(255,255,255,.05);transition:transform .25s,background .25s,color .25s,border-color .25s}
.se__step b{font-weight:600;font-size:.96rem;line-height:1.25;text-align:center;transition:color .3s}
.se__step:hover .se__n{transform:translateY(-2px)}
.se__step.is-done .se__n{color:#E6B85C;border-color:rgba(230,184,92,.7)}
.se__step.is-on .se__n{color:#2A1F1A;border-color:#E6B85C;background:linear-gradient(160deg,#F2CC7E,#E6B85C 60%,#C9A25B);box-shadow:0 8px 20px rgba(230,184,92,.30)}
.se__step.is-on b{color:#fff}
.se__step:focus-visible{outline:2px solid #E6B85C;outline-offset:4px;border-radius:14px}

.se__panel{display:grid;grid-template-columns:1fr 1fr;border-radius:26px;overflow:hidden;border:1px solid rgba(230,184,92,.40);
  background:rgba(255,255,255,.05);box-shadow:0 22px 54px rgba(0,0,0,.38)}
.se__photo{position:relative;min-height:400px;background:#3A302A}
.se__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .5s ease,transform .7s ease}
.se__photo img.is-on{opacity:1;transform:none}
.se__body{padding:clamp(24px,3.4vw,42px);display:flex;align-items:center}
.se__in{width:100%;animation:seIn .45s cubic-bezier(.22,.8,.28,1) both}
.se__in.is-back{animation-name:seInBack}
@keyframes seIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
@keyframes seInBack{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
.se__count{font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#E6B85C;margin:0 0 8px}
.se__body h3{font-family:'Playfair Display',Georgia,serif;font-size:clamp(1.6rem,2.8vw,2.2rem);font-weight:600;line-height:1.1;color:#fff;margin:0}
.se__lede{margin:10px 0 20px;font-size:1.02rem;line-height:1.6;color:rgba(245,237,228,.84)}
.se__senses{list-style:none;display:grid;gap:14px;margin:0 0 24px;padding:0}
.se__senses li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.se__ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#2F241E;border:1px solid rgba(230,184,92,.35);box-shadow:inset 3px 3px 7px rgba(0,0,0,.40),inset -2px -2px 5px rgba(255,255,255,.05)}
.se__ic svg{width:20px;height:20px;fill:none;stroke:#E6B85C;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.se__senses b{display:block;font-weight:600;font-size:.95rem;color:#fff}
.se__senses span:not(.se__ic){display:block;font-size:.95rem;line-height:1.5;color:rgba(245,237,228,.8)}
.se__nav{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.se__btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:999px;border:0;cursor:pointer;font-family:'Outfit',sans-serif;font-weight:600;font-size:.98rem;text-decoration:none;
  color:#2A1F1A;background:linear-gradient(160deg,#F7DCA0,#E6B85C 60%,#C9A25B);box-shadow:0 10px 22px rgba(0,0,0,.30);transition:transform .2s,box-shadow .2s}
.se__btn:hover{transform:translateY(-2px)}
.se__btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.se__btn--ghost{color:#fff;background:transparent;border:1.5px solid rgba(255,255,255,.45);box-shadow:none}
.se__btn--ghost:hover{background:rgba(255,255,255,.10)}
.se__btn:focus-visible{outline:2px solid #fff;outline-offset:3px}
.se__note{text-align:center;margin-top:20px;font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:1.06rem;color:#E6B85C}

@media(max-width:860px){
  .se__panel{grid-template-columns:1fr}
  .se__photo{min-height:0;height:240px}
}
@media(max-width:560px){
  .se__n{width:48px;height:48px;font-size:1.2rem}
  .se__line{top:22px}
  .se__step b{font-size:.78rem}
  .se__btn{width:100%}
}
@media(prefers-reduced-motion:reduce){.se__in,.se__photo img,.se__line i,.se__n{animation:none;transition:none}}
