/* /hp/ walkthrough: pink variant of the LINE walkthrough (line-page-a.css). */
.lb--hp .lb__title em{color:var(--pink-ink);background:linear-gradient(transparent 64%,#fbd7e3 64%)}
.lb--hp .lb__cta{background:var(--pink);box-shadow:0 8px 20px rgba(196, 68, 91,.28)}
@media (hover: hover) and (pointer: fine) {
    .lb--hp .lb__cta:hover {background:#c94874}
}
.lb--hp .lb__lead{max-width:40em}

/* Same viewport ratio as LINE (720/1427) so the phone never changes size between steps. */
.lb--hp .lb__frame img.full{object-position:top}
.lb--hp .lb__frame--bottom img.full{object-position:bottom}


/* Keep the complete live booking screen visible without cropping. */
.lb--hp .lb__frame--live{background:#fff}
.lb--hp .lb__frame--live img.full{object-fit:contain}

/* Real screen captures with a focused magnified callout. */
.lb--hp .hp-zoom__source{position:absolute;border:1px solid #a8364c;border-radius:4px;left:9%;width:82%;pointer-events:none;box-sizing:border-box}
.lb--hp .hp-zoom--instagram .hp-zoom__source{top:41.9%;height:3.4%;left:6.6%;width:86.8%}
.lb--hp .hp-zoom--maps .hp-zoom__source{top:71%;height:4.7%;left:9.8%;width:79.4%}
.lb--hp .hp-zoom__source--replacement{display:flex;align-items:center;background:#fff;color:#243c58;font-size:8px;font-weight:700;white-space:nowrap;overflow:hidden;padding:0 4px}
.hp-zoom__connector{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.hp-zoom__connector path{fill:none;stroke:#a8364c;stroke-width:1;vector-effect:non-scaling-stroke}
.hp-zoom__card{position:absolute;left:3%;width:94%;box-sizing:border-box;background:#fff;border:1.5px solid #c77c97;border-radius:12px;padding:14px 12px;box-shadow:0 10px 24px #38252f26;text-align:left}
.hp-zoom--instagram .hp-zoom__card{top:57%}
.hp-zoom--maps .hp-zoom__card{top:42%;bottom:auto;padding:10px 12px}
.hp-zoom--maps .hp-zoom__heading{margin-bottom:8px}
.hp-zoom--maps .hp-zoom__heading b{font-size:15px}
.hp-zoom--maps .hp-zoom__heading>span{font-size:10px;color:#65585d}
.hp-zoom__heading{display:flex;justify-content:space-between;align-items:center;gap:4px;margin-bottom:12px;color:#8d2d50}
.hp-zoom__heading b{font-size:11px}
.hp-zoom__heading>span{font-size:8px;white-space:nowrap;color:#766b70}
.hp-zoom__url{display:block;font-size:16px;line-height:1.7;color:#243c58;letter-spacing:-.03em}
.hp-zoom__url span{padding-left:1.2em}
.hp-zoom__crop{display:block;width:100%;height:auto}
@media(max-width:880px){
  .lb--hp .lb__steps{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row}
  .lb--hp .lb__step b{font-size:10px;white-space:normal}
  .lb--hp .lb__step{padding:10px 2px}
  .lb--hp .lb__phone{width:min(280px,calc(100vw - 40px))}
  .hp-zoom__card{padding:12px 10px}
  .hp-zoom__heading b{font-size:10px}
  .hp-zoom__heading>span{font-size:7px}
  .hp-zoom__url{font-size:14px}
  .lb--hp .hp-zoom__source--replacement{font-size:7px}
}

.hp-zoom--instagram .hp-zoom__heading b{font-size:13px}
.hp-zoom--instagram .hp-zoom__heading>span{font-size:10px;color:#65585d}
.hp-zoom--instagram .hp-zoom__url{font-size:17px;line-height:1.4}
/* Reuse LINE's visual-first order, CTA spacing and note hierarchy. */
.hp-plan-hint{display:block;margin-top:4px;font-size:11px;font-weight:400;color:var(--muted);text-decoration:none}
.lb--hp .lb__links{align-items:flex-start}

/* Date selection uses the shared LINE spotlight, including reduced-motion support. */

/* Match LINE step 2 exactly: same capture and spotlight. */
.lb--hp .hp-zoom--datetime img.full{object-fit:cover}