/* Skytrain Dental — Branches landing page (scoped #sk-branchpage, prefix .skbp-). */
#sk-branchpage,#sk-branchpage *{font-family:'Noto Sans Thai',system-ui,sans-serif!important;box-sizing:border-box}
#sk-branchpage{color:#34505A;background:#F4FBFC}
#sk-branchpage a{text-decoration:none;color:#0E8CAE}
#sk-branchpage .skbp-wrap{max-width:1200px;margin:0 auto;padding-left:20px;padding-right:20px}
.skbp-dia{width:7px;height:7px;background:#4FD1E9;transform:rotate(45deg);display:inline-block;flex:0 0 auto}

/* HERO */
.skbp-hero{background:linear-gradient(170deg,#E7F6FA 0%,#F4FBFC 64%);border-bottom:1px solid #E4F1F4}
#sk-branchpage .skbp-crumb{font-size:12.5px;color:#7897A3;padding-top:16px}
.skbp-crumb a{color:#7897A3}.skbp-crumb a:hover{color:#0E8CAE}.skbp-crumb span{opacity:.5}
.skbp-hero-in{padding:20px 20px 48px;text-align:center;max-width:820px;margin:0 auto}
.skbp-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;letter-spacing:2.6px;font-weight:600;color:#0E8CAE;text-transform:uppercase;margin-bottom:14px}
#sk-branchpage .skbp-h1{font-size:clamp(27px,4vw,42px);line-height:1.3;font-weight:700;color:#0B3A47;margin:0 0 14px;letter-spacing:-.3px}
.skbp-sub{font-size:16px;line-height:1.9;color:#4E6E7A;margin:0 auto 24px;max-width:620px}
.skbp-facts{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:24px}
.skbp-facts>div{background:#fff;border:1px solid #DCEBEF;border-radius:14px;padding:12px 20px;display:flex;align-items:center;gap:10px}
.skbp-facts b{font-size:18px;color:#0E8CAE;font-weight:700;display:flex;align-items:center}
.skbp-facts .skbp-dot{width:9px;height:9px;border-radius:50%;background:#2BC46A;display:inline-block}
.skbp-facts span{font-size:13px;color:#6B838C}
.skbp-hero-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
#sk-branchpage .skbp-btn{font-weight:600;font-size:14.5px;padding:14px 26px;border-radius:999px;display:inline-block}
.skbp-btn-line{background:#06C755;color:#fff!important;box-shadow:0 10px 22px rgba(6,199,85,.22)}
.skbp-btn-line:hover{filter:brightness(1.04);color:#fff!important}
.skbp-btn-soft{background:#fff;color:#0E8CAE!important;border:1px solid #CBE7EE}
.skbp-btn-soft:hover{border-color:#0E8CAE}

/* GRID */
#sk-branchpage .skbp-list{padding-top:44px;padding-bottom:60px}
.skbp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:980px){.skbp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.skbp-grid{grid-template-columns:1fr}}

.skbp-card{background:#fff;border:1px solid #E4EDF0;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 2px rgba(11,58,71,.04);transition:transform .16s,box-shadow .16s,border-color .16s}
.skbp-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(11,58,71,.12);border-color:#BFE6F0}
.skbp-card-thumb{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#EAF7FB}
.skbp-card-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.skbp-transit{position:absolute;left:12px;bottom:12px;background:rgba(11,58,71,.82);color:#fff;font-size:12px;font-weight:600;padding:5px 12px;border-radius:999px;backdrop-filter:blur(2px)}
.skbp-card-body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
#sk-branchpage .skbp-card-name{font-size:17px;font-weight:700;color:#0B3A47;margin:0 0 8px;line-height:1.35}
#sk-branchpage .skbp-card-name a{color:#0B3A47;display:block}
#sk-branchpage .skbp-card-name a:hover{color:#0E8CAE}
#sk-branchpage .skbp-card-alt{display:block;font-size:12.5px;font-weight:600;color:#0E8CAE;margin-top:3px;letter-spacing:.2px}
#sk-branchpage .skbp-card-name a:hover .skbp-card-alt{color:#0B6E88}
.skbp-card-addr{font-size:13.5px;line-height:1.7;color:#5B7680;margin:0 0 6px}
.skbp-card-travel{font-size:12.5px;line-height:1.7;color:#8AA2AB;margin:0 0 16px}
.skbp-card-actions{margin-top:auto;display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;padding-top:14px;border-top:1px solid #EEF3F5}
#sk-branchpage .skbp-act{font-size:13px;color:#5B7680;font-weight:500}
#sk-branchpage .skbp-act:hover{color:#0E8CAE}
#sk-branchpage .skbp-act-main{color:#0E8CAE;font-weight:600;margin-right:auto}

/* CTA BAND */
#sk-branchpage .skbp-cta-wrap{padding-bottom:76px}
.skbp-cta{background:linear-gradient(135deg,#17B0D4,#0E8CAE);border-radius:26px;padding:clamp(28px,4vw,46px);display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;box-shadow:0 22px 46px rgba(14,140,174,.24)}
@media(max-width:760px){.skbp-cta{grid-template-columns:1fr;gap:20px}}
#sk-branchpage .skbp-cta-title{color:#fff;font-size:clamp(21px,2.6vw,29px);font-weight:700;margin:0 0 8px;line-height:1.35}
.skbp-cta-sub{color:#E2F7FC;font-size:14.5px;line-height:1.85;margin:0;max-width:520px}
.skbp-cta-btns{display:flex;gap:12px;flex-wrap:wrap}
#sk-branchpage .skbp-cta-white{background:#fff;color:#0E8CAE!important;font-weight:600;font-size:14.5px;padding:14px 26px;border-radius:999px}
#sk-branchpage .skbp-cta-ghost{border:1px solid rgba(255,255,255,.6);color:#fff!important;font-weight:600;font-size:14.5px;padding:14px 26px;border-radius:999px}
#sk-branchpage .skbp-cta-ghost:hover{border-color:#fff}