/* v2.58.0 · site-audit fixes: WhatsApp contact, teacher photos, next batch line, compact course cards on phones. Uses the existing HangeulBondhu greens. */
.hb-wa-float{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px 0 14px;border-radius:999px;background:#128c4a;color:#fff!important;font-weight:600;font-size:15px;text-decoration:none;box-shadow:0 8px 22px #0e3b2a33;transition:transform .2s,box-shadow .2s}
.hb-wa-float:hover{transform:translateY(-2px);box-shadow:0 12px 26px #0e3b2a40}
.hb-wa-float:focus-visible{outline:3px solid #f2c94c;outline-offset:3px}
/* Never cover the book reader, a running mock test or the AI tutor's send button. */
body:has(.hbt,.kl-reader,#kl-timer) .hb-wa-float{display:none}
.hb-wa-button{display:inline-flex;align-items:center;gap:8px;background:#128c4a!important;border-color:#128c4a!important;color:#fff!important}
.hb-footer nav a[href^="https://wa.me"]{font-weight:600}

.hb-next-batch{display:inline-flex;align-items:center;gap:8px;margin:16px 0 0;padding:7px 14px;border-radius:999px;background:#fff7e0;border:1px solid #f0d9a0;color:#5b4310;font-size:14px}
.hb-next-batch i{width:8px;height:8px;border-radius:50%;background:#e0a21b;box-shadow:0 0 0 4px #e0a21b2b}
.hb-next-batch strong{font-weight:700}

.hb-teacher-faces{display:flex;flex-wrap:wrap;gap:14px 22px;margin:0 0 18px}
.hb-teacher-faces figure{display:flex;align-items:center;gap:12px;margin:0}
.hb-teacher-faces img{width:68px;height:68px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 4px 14px #173c2522}
.hb-teacher-faces figcaption{display:grid;line-height:1.35}
.hb-teacher-faces strong{font-size:16px}
.hb-teacher-faces small{font-size:13px;color:#5d7068}

@media(min-width:901px){.hb-footer-grid{grid-template-columns:1.5fr repeat(4,1fr)}}

/* Phones: one compact row per course (small cover beside the details) instead of a full-height book per course. */
@media(max-width:600px){
 .hb-landing #plans .kc-plan-grid{grid-template-columns:1fr;gap:16px}
 .hb-landing #plans .kc-plan{display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;align-items:start}
 .hb-landing #plans .kc-plan:before{display:none}
 .hb-landing #plans .hb-book,.hb-landing #plans .kc-plan:hover .hb-book{width:88px;max-width:88px;height:126px;min-height:126px;margin:18px 0 0;padding:12px 8px 10px 11px;border-left-width:5px;transform:perspective(500px) rotateY(-10deg)}
 .hb-landing #plans .hb-book strong,.hb-landing #plans .kc-plan .hb-book strong{font-size:13px!important;letter-spacing:0;line-height:1.15;word-break:keep-all;overflow-wrap:normal}
 .hb-landing #plans .kc-plan-grammar .hb-book strong,.hb-landing #plans .kc-plan-vocabulary .hb-book strong,.hb-landing #plans .kc-plan-topik_bundle .hb-book strong,.hb-landing #plans .kc-plan-eps .hb-book strong{font-size:10px!important}
 .hb-landing #plans .hb-book>span{font-size:13px;letter-spacing:1px}
 .hb-landing #plans .hb-book small{display:none}
 .hb-landing #plans .hb-v3-course-info{min-width:0}
 .hb-landing #plans .hb-v3-course-info h3{font-size:17px;margin:2px 0 6px;min-height:0}
 .hb-landing #plans .hb-v3-course-info p{font-size:13px;line-height:1.7;min-height:0;margin-bottom:6px}
 .hb-landing #plans .kc-price{font-size:22px!important;padding-top:10px}
 .hb-landing #plans .kc-alt-price{margin-bottom:8px}
 .hb-landing #plans .hb-course-more{margin-bottom:10px}
 .hb-landing #plans .kc-button{width:100%;min-height:42px}
 .hb-wa-float span{display:none}
 .hb-wa-float{padding:0;width:52px;height:52px;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.hb-wa-float{transition:none}}