/* HangeulBondhu: one look for every inner page (title panel, eyebrow, lead text, locked cards).
   Loaded on every page through hb_assets(); selectors start with body.hb-system so they win over older page files. */
:root{--hbp-ink:#163847;--hbp-muted:#4f6873;--hbp-teal:#0b6b60;--hbp-soft:#e3f3ee;--hbp-line:#dde8e5}

/* Eyebrow label: the same small pill everywhere */
body.hb-system .hb-eyebrow{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;width:auto;margin:0 0 14px;padding:5px 12px;border:1px solid #cfe6dd;border-radius:999px;background:var(--hbp-soft);color:var(--hbp-teal);font-size:12px;font-weight:650;letter-spacing:.02em;line-height:1.5}

/* Title panel used by every inner page */
body.hb-system .hb-books-intro,
body.hb-system .hb-material-intro,
body.hb-system .hb-practice-hero,
body.hb-system .hb-learning-hero,
body.hb-system .hb-privacy>header,
body.hb-system .hbt-head{position:relative;overflow:hidden;display:block;margin:6px 0 30px;padding:42px 44px;border:1px solid var(--hbp-line);border-radius:28px;background:radial-gradient(120% 150% at 0% 0%,#e9f6f0 0,#f1f7f6 45%,#eef3fa 100%);box-shadow:0 14px 40px #123b330d;text-align:left}
body.hb-system .hb-learning-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center}
body.hb-system .hbt-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
body.hb-system .hb-books-intro::after,
body.hb-system .hb-material-intro::after,
body.hb-system .hb-practice-hero::after,
body.hb-system .hb-learning-hero::after,
body.hb-system .hb-privacy>header::after,
body.hb-system .hbt-head::after{content:"한";position:absolute;right:28px;bottom:-62px;font:700 210px/1 "HB Korean",sans-serif;color:#0b6b600a;pointer-events:none}
body.hb-system .hb-books-intro>*,
body.hb-system .hb-material-intro>*,
body.hb-system .hb-practice-hero>*,
body.hb-system .hb-learning-hero>*,
body.hb-system .hb-privacy>header>*,
body.hb-system .hbt-head>*{position:relative;z-index:1}
body.hb-system .hb-books-intro h1,
body.hb-system .hb-material-intro h1,
body.hb-system .hb-practice-hero h1,
body.hb-system .hb-learning-hero h1,
body.hb-system .hb-privacy>header h1,
body.hb-system .hbt-head h1{margin:0 0 12px;font-size:clamp(30px,4vw,46px);line-height:1.3;color:var(--hbp-ink);letter-spacing:0}
body.hb-system .hb-books-intro p,
body.hb-system .hb-material-intro p,
body.hb-system .hb-practice-hero p,
body.hb-system .hb-learning-hero p,
body.hb-system .hb-privacy>header p,
body.hb-system .hbt-head p{max-width:62ch;margin:0 0 8px;font-size:16px;line-height:1.85;color:var(--hbp-muted)}
body.hb-system .hb-privacy>header small{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:999px;background:#ffffffb3;color:var(--hbp-muted);font-size:12px}
body.hb-system .hbt-head .kc-kicker{display:inline-flex;margin:0 0 12px;padding:5px 12px;border-radius:999px;background:var(--hbp-soft);color:var(--hbp-teal);font-size:12px;letter-spacing:.06em}
body.hb-system .hbt-head .hbt-quota{flex:none;margin:0;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--hbp-line);font-size:14px;color:var(--hbp-ink)}

/* Account cards (reset code, locked pages) */
body.hb-system .kr-card,
body.hb-system .hb-locked{max-width:560px;margin:10px auto 40px;padding:36px;border-radius:24px;border:1px solid var(--hbp-line);box-shadow:0 18px 44px #123b3312}
body.hb-system .kr-card .kc-kicker{display:inline-flex;padding:5px 12px;border-radius:999px;background:var(--hbp-soft);color:var(--hbp-teal);font-size:12px}
body.hb-system .kr-card h1,body.hb-system .hb-locked h1{font-size:clamp(26px,3.2vw,34px);line-height:1.35;margin:10px 0 8px;color:var(--hbp-ink)}
body.hb-system .kr-card .kc-text-link{display:block;margin-top:12px}
body.hb-system .hb-locked{text-align:center}
body.hb-system .hb-locked .hb-eyebrow{align-self:center}
body.hb-system .hb-locked-ico{display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin:0 auto 14px;border-radius:20px;background:var(--hbp-soft);font-size:34px}
body.hb-system .hb-locked p{color:var(--hbp-muted);line-height:1.8}
body.hb-system .hb-locked-act{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:18px 0 12px}
body.hb-system .hb-locked-act .kc-button{width:auto;margin:0}

/* My page (course application) title: same scale as the other pages */
body.hb-system .kc-student-title{font-size:clamp(28px,3.6vw,40px);line-height:1.35;color:var(--hbp-ink)}

/* Home: class routine table keeps the course colour bar consistent */
body.hb-system #routine .kc-table-wrap{border-radius:20px}

@media(max-width:760px){
 body.hb-system .hb-books-intro,body.hb-system .hb-material-intro,body.hb-system .hb-practice-hero,body.hb-system .hb-learning-hero,body.hb-system .hb-privacy>header,body.hb-system .hbt-head{padding:28px 22px;border-radius:22px;margin-bottom:22px}
 body.hb-system .hb-learning-hero{grid-template-columns:1fr}
 body.hb-system .hbt-head{flex-direction:column;align-items:flex-start}
 body.hb-system .hb-books-intro::after,body.hb-system .hb-material-intro::after,body.hb-system .hb-practice-hero::after,body.hb-system .hb-learning-hero::after,body.hb-system .hb-privacy>header::after,body.hb-system .hbt-head::after{font-size:150px;bottom:-44px;right:12px}
 body.hb-system .hb-books-intro p,body.hb-system .hb-material-intro p,body.hb-system .hb-practice-hero p,body.hb-system .hb-learning-hero p,body.hb-system .hb-privacy>header p,body.hb-system .hbt-head p{font-size:15px}
 body.hb-system .kr-card,body.hb-system .hb-locked{padding:26px 20px}
}

/* Title panels take the full content width on every page */
body.hb-system .hb-books-intro,body.hb-system .hb-material-intro,body.hb-system .hb-practice-hero,body.hb-system .hb-learning-hero,body.hb-system .hb-privacy>header,body.hb-system .hbt-head{max-width:none;width:auto;box-sizing:border-box}
/* "আপনার শেখার স্টুডিও" link card: a light card, not a second title panel */
body.hb-system .hb-learning-bridge{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:center;margin:0 0 28px;padding:22px 26px;border:1px solid var(--hbp-line);border-radius:20px;background:#fff;box-shadow:0 8px 24px #123b330a}
body.hb-system .hb-learning-bridge .hb-eyebrow{grid-column:1;margin:0 0 4px}
body.hb-system .hb-learning-bridge h2{grid-column:1;margin:0;font-size:20px}
body.hb-system .hb-learning-bridge p{grid-column:1;margin:0;font-size:14px;color:var(--hbp-muted)}
body.hb-system .hb-learning-bridge .kc-button{grid-column:2;grid-row:1/span 4;width:auto;margin:0}
@media(max-width:760px){body.hb-system .hb-learning-bridge{grid-template-columns:1fr;padding:20px}body.hb-system .hb-learning-bridge .kc-button{grid-column:1;grid-row:auto;margin-top:10px}}
body.hb-system .hb-learning-bridge .hb-eyebrow{justify-self:start}
body.hb-system .kc-section>.kc-kicker:first-child{display:inline-flex;padding:5px 12px;border-radius:999px;background:var(--hbp-soft);color:var(--hbp-teal);font-size:12px}
/* Home: Korea guide + E-7-4 calculator strip */
body.hb-system .hb-home-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:8px}
body.hb-system .hb-home-guide-grid a{display:flex;flex-direction:column;gap:4px;padding:24px;border-radius:22px;border:1px solid var(--hbp-line);background:#fff;color:var(--hbp-ink);text-decoration:none;box-shadow:0 10px 28px #123b330d;transition:transform .2s,border-color .2s}
body.hb-system .hb-home-guide-grid a:hover{transform:translateY(-2px);border-color:#9fd2c4}
body.hb-system .hb-home-guide-grid span{font-size:32px}
body.hb-system .hb-home-guide-grid strong{font-size:21px}
body.hb-system .hb-home-guide-grid small{font-size:14px;color:var(--hbp-teal);font-weight:650}
body.hb-system .hb-home-guide-grid .hb-home-guide-calc{background:linear-gradient(150deg,#0f7a6b,#123f6b);color:#fff;border-color:transparent}
body.hb-system .hb-home-guide-grid .hb-home-guide-calc small{color:#bfeee2}
@media(max-width:700px){body.hb-system .hb-home-guide-grid{grid-template-columns:1fr}}
/* YouTube lesson cards */
.hbv-section{margin:44px 0}
.hbv-section>p{color:var(--hbp-muted);max-width:62ch}
.hbv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:14px}
.hbv-card{display:flex;flex-direction:column;gap:10px;padding:10px 10px 14px;border:1px solid var(--hbp-line);border-radius:18px;background:#fff;color:var(--hbp-ink);text-decoration:none;box-shadow:0 8px 22px #123b330a;transition:transform .2s,border-color .2s}
.hbv-card:hover{transform:translateY(-2px);border-color:#9fd2c4}
.hbv-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#163847}
.hbv-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hbv-thumb iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hbv-play{position:absolute;left:50%;top:50%;width:58px;height:40px;margin:-20px 0 0 -29px;border-radius:12px;background:#e62117e6;box-shadow:0 6px 18px #0006}
.hbv-play::after{content:"";position:absolute;left:23px;top:11px;border-style:solid;border-width:9px 0 9px 15px;border-color:transparent transparent transparent #fff}
.hbv-card strong{padding:0 4px;font-size:15px;line-height:1.5}
.hbv-card.is-playing{cursor:default}
.hbv-more{display:inline-block;margin-top:14px;font-weight:700;color:var(--hbp-teal)}
.hbv-group{margin:34px 0 0}
.hbv-group h2{font-size:21px;color:var(--hbp-ink);margin:0 0 4px}
/* success stories */
.hb-stories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:12px}
.hb-story{margin:0;padding:22px;border-radius:20px;background:#fff;border:1px solid var(--hbp-line);box-shadow:0 8px 22px #123b330a}
.hb-story blockquote{margin:0 0 14px;font-size:15px;line-height:1.85;color:#2d4752}
.hb-story blockquote::before{content:"“";display:block;font-size:40px;line-height:.6;color:#0b8d77}
.hb-story figcaption{font-size:14px;color:var(--hbp-muted)}
.hb-story figcaption strong{color:var(--hbp-ink)}
.hb-story figcaption span{display:inline-block;margin-left:8px;padding:2px 10px;border-radius:999px;background:var(--hbp-soft);color:var(--hbp-teal);font-weight:650;font-size:12px}
