/* HB Photography – Extras: Spotlight, Scroll-Story, Express-Termin, Schnellkontakt */

/* ---------- Spotlight ---------- */
.hb-spot-toggle{display:inline-flex;align-items:center;gap:12px;margin-top:22px;padding:11px 18px;border:1px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);font:500 13px/1 Arial,Helvetica,sans-serif;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.hb-spot-toggle:hover,.hb-spot-toggle:focus-visible{background:var(--ink);color:var(--white)}
.hb-spot-toggle svg{width:16px;height:16px}
.hb-spot-overlay{position:fixed;inset:0;z-index:80;pointer-events:none;opacity:0;transition:opacity .6s ease;
  background:radial-gradient(circle var(--hb-r,230px) at var(--hb-x,50%) var(--hb-y,45%),rgba(8,12,9,0) 0,rgba(8,12,9,0) 55%,rgba(8,12,9,.55) 80%,rgba(8,12,9,.93) 100%)}
html.hb-spot-on .hb-spot-overlay{opacity:1}
.hb-spot-off{white-space:nowrap;position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:81;display:none;align-items:center;gap:10px;padding:13px 22px;border:0;border-radius:999px;background:var(--accent);color:var(--ink);font:600 13px/1 Arial,Helvetica,sans-serif;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 30px rgba(0,0,0,.35)}
html.hb-spot-on .hb-spot-off{white-space:nowrap;display:inline-flex}
html.hb-spot-on .hb-fab{display:none!important}

/* ---------- Scroll-Story „Vom Paket zum Bild“ ---------- */
.hb-journey{padding:100px 5%;border-top:1px solid var(--line)}
.hb-journey__intro{max-width:760px;margin-bottom:60px}
.hb-journey__intro p:last-child{color:var(--muted);max-width:560px}
.hb-journey__layout{display:grid;grid-template-columns:1fr 1fr;gap:6%}
.hb-journey__visual{position:sticky;top:40px;height:calc(100vh - 80px);max-height:680px;display:flex;flex-direction:column;justify-content:center;background:var(--white);border:1px solid var(--line);padding:40px}
.hb-journey__num{font-family:Georgia,'Times New Roman',serif;font-size:22px;color:var(--muted)}
.hb-journey__stage{position:relative;flex:1;min-height:220px}
.hb-journey__icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(12px) scale(.97);transition:opacity .5s ease,transform .5s ease}
.hb-journey__icon.is-active{opacity:1;transform:none}
.hb-journey__icon svg{width:min(62%,280px);height:auto;stroke:var(--ink);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.hb-journey__icon .hb-accent{fill:var(--accent);stroke:none}
.hb-journey__icon.is-active .hb-draw{stroke-dasharray:400;stroke-dashoffset:400;animation:hb-draw 1.2s ease forwards}
@keyframes hb-draw{to{stroke-dashoffset:0}}
.hb-journey__route{position:relative;display:grid;grid-template-columns:repeat(6,1fr);margin-top:24px}
.hb-journey__route::before,.hb-journey__route::after{content:"";position:absolute;left:8px;right:8px;top:7px;height:2px;background:var(--line)}
.hb-journey__route::after{background:var(--ink);right:auto;width:calc((100% - 16px) * var(--hb-progress,0));transition:width .3s linear}
.hb-journey__route li{list-style:none;position:relative;z-index:1;font-size:0}
.hb-journey__route li::before{content:"";display:block;width:16px;height:16px;border-radius:50%;background:var(--white);border:2px solid var(--line);margin-bottom:10px;transition:all .3s}
.hb-journey__route li.is-done::before{background:var(--ink);border-color:var(--ink)}
.hb-journey__route li.is-active::before{background:var(--accent);border-color:var(--ink);transform:scale(1.25)}
.hb-journey__route{padding:0;margin-bottom:0}
.hb-journey__steps{padding:0;margin:0}
.hb-journey__step{list-style:none;margin-bottom:48px}
.hb-js .hb-journey__step{min-height:70vh;margin:0;display:flex;flex-direction:column;justify-content:center;opacity:.35;transition:opacity .4s}
.hb-js .hb-journey__step.is-active{opacity:1}
.hb-js .hb-journey__step:last-child{min-height:60vh}
.hb-journey__visual{display:none}
.hb-js .hb-journey__visual{display:flex}
.hb-journey__layout{display:block}
.hb-js .hb-journey__layout{display:grid}
.hb-journey__step h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(30px,3vw,44px);letter-spacing:-1px;line-height:1.1;margin:12px 0 16px}
.hb-journey__step p{margin:0;max-width:460px;color:var(--ink)}
@media(max-width:900px){
  .hb-journey{padding:70px 6%}
  .hb-journey__layout{display:block}
  .hb-journey__visual{top:10px;height:42vh;min-height:260px;padding:20px;z-index:2}
  .hb-js .hb-journey__step{min-height:55vh}
  .hb-js .hb-journey__layout{display:block}
}
.hb-reduced .hb-journey__step{opacity:1!important}
.hb-reduced .hb-journey__icon.is-active .hb-draw{animation:none;stroke-dashoffset:0}

/* ---------- Express-Termin ---------- */
.hb-express{display:inline-flex;align-items:center;gap:12px;margin:0 0 22px;padding:10px 16px 10px 14px;background:var(--white);border:1px solid var(--line);border-radius:999px;font-size:14px;color:var(--ink);text-decoration:none}
.hb-express[hidden]{display:none}
.hb-express strong{font-weight:600}
.hb-express__dot{width:9px;height:9px;border-radius:50%;background:var(--text);box-shadow:0 0 0 0 rgba(201,169,110,.5);animation:hb-pulse 2s infinite}
@keyframes hb-pulse{70%{box-shadow:0 0 0 9px rgba(201,169,110,0)}100%{box-shadow:0 0 0 0 rgba(201,169,110,0)}}
a.hb-express:hover{border-color:var(--ink)}

/* ---------- Schnellkontakt (nur Handy/Tablet) ---------- */
.hb-fab{display:none}
@media(max-width:900px){
  .hb-fab{display:block;position:fixed;right:18px;bottom:18px;z-index:70}
  .hb-fab__main{width:58px;height:58px;border-radius:50%;border:0;background:var(--ink);color:var(--white);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(30,41,34,.35);cursor:pointer;transition:transform .25s}
  .hb-fab__main svg{width:24px;height:24px}
  .hb-fab__menu{position:absolute;right:0;bottom:72px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .2s,transform .2s}
  .hb-fab.is-open .hb-fab__menu{opacity:1;transform:none;pointer-events:auto}
  .hb-fab__menu a{display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:999px;background:var(--white);color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap;box-shadow:0 6px 20px rgba(30,41,34,.18)}
  .hb-fab__menu svg{width:20px;height:20px;flex:none}
}
@media(prefers-reduced-motion:reduce){.hb-express__dot{animation:none}.hb-journey__icon{transition:none}}
