/* Skytrain Dental — Promo landing pages (scoped under #sk-promo-lp) */
#sk-promo-lp{color:#0B3A47;background:#FBFCFE;overflow-x:hidden}
/* Force Noto Sans Thai across the page (like the home/service templates) — a Latin
   serif on Thai text breaks tone-mark/vowel placement ("font เพี้ยน"). */
#sk-promo-lp,#sk-promo-lp *{font-family:'Noto Sans Thai',system-ui,sans-serif!important}
#sk-promo-lp *{box-sizing:border-box}
#sk-promo-lp .sklp-wrap{max-width:1160px;margin:0 auto;padding-left:32px;padding-right:32px}
#sk-promo-lp .sklp-sec{padding:64px 0}
#sk-promo-lp .sklp-h1{font-family:'Noto Serif Display','Noto Sans Thai',serif;font-weight:600;font-size:40px;line-height:1.32;margin:0;color:#0B3A47;letter-spacing:-.01em}
#sk-promo-lp .sklp-h2{font-family:'Noto Serif Display','Noto Sans Thai',serif;font-weight:600;font-size:30px;line-height:1.35;margin:0;color:#0B3A47}
#sk-promo-lp .sklp-center{text-align:center}
#sk-promo-lp .sklp-sec-head{margin-bottom:34px}
#sk-promo-lp .sklp-sec-sub{font-size:16.5px;line-height:1.8;color:#4A6570;margin:12px 0 0}

/* HERO */
#sk-promo-lp .sklp-hero{background:linear-gradient(160deg,#EAF7FB,#F5FBFD 60%,#FBFCFE);padding:38px 0 56px}
#sk-promo-lp .sklp-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
#sk-promo-lp .sklp-crumb{font-size:13px;color:#6B838C;display:flex;gap:8px;align-items:center;margin-bottom:16px}
#sk-promo-lp .sklp-crumb a{color:#6B838C;text-decoration:none}
#sk-promo-lp .sklp-eyebrow{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #CFE7EE;color:#0E8CAE;font-weight:600;font-size:13.5px;padding:7px 15px;border-radius:999px;margin-bottom:16px}
#sk-promo-lp .sklp-diamond{width:8px;height:8px;background:#F47B3F;border-radius:2px;transform:rotate(45deg)}
#sk-promo-lp .sklp-lead{font-size:17px;line-height:1.85;color:#4A6570;margin:16px 0 0;max-width:560px}
#sk-promo-lp .sklp-pricecard{display:inline-flex;align-items:baseline;gap:14px;background:#fff;border:1px solid #E4EDF0;border-radius:18px;padding:16px 26px;margin:24px 0 0;box-shadow:0 14px 34px rgba(11,58,71,.08)}
#sk-promo-lp .sklp-price-big{font-family:'Noto Serif Display',serif;font-weight:500;font-size:46px;line-height:1;color:#17B0D4}
#sk-promo-lp .sklp-price-note{font-size:14.5px;color:#4A6570}
#sk-promo-lp .sklp-facts{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 0}
#sk-promo-lp .sklp-fact{background:#fff;border:1px solid #E4EDF0;border-radius:14px;padding:12px 16px;min-width:120px}
#sk-promo-lp .sklp-fact-k{display:block;font-size:12.5px;color:#6B838C}
#sk-promo-lp .sklp-fact-v{display:block;font-size:16px;color:#0B3A47;margin-top:2px}
#sk-promo-lp .sklp-hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 0}
#sk-promo-lp .sklp-btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:13px 22px;border-radius:999px;text-decoration:none;transition:filter .15s,transform .15s}
#sk-promo-lp .sklp-btn:hover{transform:translateY(-1px)}
#sk-promo-lp .sklp-btn-line{background:#06C755;color:#fff;box-shadow:0 8px 20px rgba(6,199,85,.28)}
#sk-promo-lp .sklp-btn-line:hover{filter:brightness(1.05)}
#sk-promo-lp .sklp-btn-call{background:#fff;color:#0E8CAE;border:1.5px solid #CFE7EE}
#sk-promo-lp .sklp-btn-call:hover{background:#F1F8FB}
#sk-promo-lp .sklp-line-ico{font-size:16px}
#sk-promo-lp .sklp-validity{font-size:13.5px;color:#8199A2;margin:16px 0 0}
#sk-promo-lp .sklp-hero-frame{border-radius:24px;overflow:hidden;box-shadow:0 30px 66px rgba(11,58,71,.18);background:#DCEFF4;aspect-ratio:4/5}
#sk-promo-lp .sklp-hero-frame img{width:100%;height:100%;object-fit:cover;display:block}

/* VALUE BREAKDOWN */
#sk-promo-lp .sklp-value{background:#fff}
#sk-promo-lp .sklp-value-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
#sk-promo-lp .sklp-value-item{display:flex;align-items:center;gap:12px;background:#F7FBFC;border:1px solid #EAF1F4;border-radius:14px;padding:14px 18px}
#sk-promo-lp .sklp-check{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:#17B0D4;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px}
#sk-promo-lp .sklp-value-name{flex:1;font-size:15.5px;color:#2A3B38}
#sk-promo-lp .sklp-value-val{font-size:14.5px;font-weight:600;color:#0E8CAE;white-space:nowrap}

/* STEPS — 2 columns: image + 2x2 grid */
#sk-promo-lp .sklp-steps-2col{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:center}
#sk-promo-lp .sklp-steps-2col.sklp-steps-nomedia{grid-template-columns:1fr}
#sk-promo-lp .sklp-steps-media{border-radius:24px;overflow:hidden;box-shadow:0 24px 56px rgba(11,58,71,.16);aspect-ratio:1/1;background:#DCEFF4}
#sk-promo-lp .sklp-steps-media img{width:100%;height:100%;object-fit:cover;display:block}
#sk-promo-lp .sklp-steps-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
#sk-promo-lp .sklp-step{background:#fff;border:1px solid #E4EDF0;border-radius:18px;padding:26px 20px;text-align:center;box-shadow:0 10px 26px rgba(11,58,71,.06)}
#sk-promo-lp .sklp-step-n{width:40px;height:40px;margin:0 auto 14px;border-radius:50%;background:linear-gradient(135deg,#17B0D4,#0E8CAE);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px}
#sk-promo-lp .sklp-step-l{font-size:15.5px;color:#41606B;margin-bottom:8px}
#sk-promo-lp .sklp-step-a{font-family:'Noto Serif Display',serif;font-size:22px;color:#17B0D4;font-weight:500}

/* WHY + STATS */
#sk-promo-lp .sklp-why{background:#fff}
#sk-promo-lp .sklp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:44px}
#sk-promo-lp .sklp-stat{text-align:center;background:linear-gradient(160deg,#EAF7FB,#F5FBFD);border-radius:20px;padding:28px 18px}
#sk-promo-lp .sklp-stat-n{font-family:'Noto Serif Display',serif;font-size:42px;color:#17B0D4;line-height:1}
#sk-promo-lp .sklp-stat-l{font-size:15px;color:#4A6570;margin-top:8px}
#sk-promo-lp .sklp-why-h{margin-bottom:24px}
#sk-promo-lp .sklp-why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
#sk-promo-lp .sklp-why-item{display:flex;gap:14px;background:#F7FBFC;border:1px solid #EAF1F4;border-radius:16px;padding:20px 22px}
#sk-promo-lp .sklp-why-item b{display:block;font-size:16px;color:#0B3A47;margin-bottom:4px}
#sk-promo-lp .sklp-why-item span{display:block;font-size:14.5px;line-height:1.7;color:#4A6570}

/* FAQ */
#sk-promo-lp .sklp-faq{background:#FBFCFE}
#sk-promo-lp .sklp-faq-wrap{max-width:860px}
#sk-promo-lp .sklp-faq-list{display:flex;flex-direction:column;gap:12px;margin-top:30px}
#sk-promo-lp .sklp-faq-item{background:#fff;border:1px solid #E4EDF0;border-radius:16px;overflow:hidden}
#sk-promo-lp .sklp-faq-item[open]{border-color:#BFE4EE;box-shadow:0 10px 28px rgba(11,58,71,.08)}
#sk-promo-lp .sklp-faq-q{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-weight:600;font-size:16px;color:#0B3A47}
#sk-promo-lp .sklp-faq-q::-webkit-details-marker{display:none}
#sk-promo-lp .sklp-faq-ico{position:relative;width:20px;height:20px;flex-shrink:0}
#sk-promo-lp .sklp-faq-ico::before,#sk-promo-lp .sklp-faq-ico::after{content:'';position:absolute;background:#17B0D4;border-radius:2px;transition:transform .2s}
#sk-promo-lp .sklp-faq-ico::before{top:9px;left:0;width:20px;height:2px}
#sk-promo-lp .sklp-faq-ico::after{left:9px;top:0;width:2px;height:20px}
#sk-promo-lp .sklp-faq-item[open] .sklp-faq-ico::after{transform:scaleY(0)}
#sk-promo-lp .sklp-faq-a{padding:0 22px 20px;font-size:15.5px;line-height:1.85;color:#4A6570}

/* BOOKING FORM + CTA */
#sk-promo-lp .sklp-book{background:linear-gradient(160deg,#0E7C97,#0B5E75);color:#fff}
#sk-promo-lp .sklp-book-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
#sk-promo-lp .sklp-book-cta .sklp-h2{color:#fff}
#sk-promo-lp .sklp-book-cta .sklp-sec-sub{color:rgba(255,255,255,.9)}
/* "call me back" card → opens the popup form */
#sk-promo-lp .sklp-book-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:22px;padding:34px 30px;text-align:center}
#sk-promo-lp .sklp-book-ico{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:#F47B3F;color:#fff;margin-bottom:16px}
#sk-promo-lp .sklp-book-ico svg{width:26px;height:26px}
#sk-promo-lp .sklp-book-card-h{display:block;font-size:20px;font-weight:700;color:#fff}
#sk-promo-lp .sklp-book-card-p{display:block;font-size:14.5px;color:rgba(255,255,255,.85);margin:6px 0 20px;line-height:1.6}
#sk-promo-lp .sklp-btn-reg{width:100%;justify-content:center;background:#F47B3F;color:#fff;border:0;cursor:pointer;font-size:16px;padding:15px 22px;box-shadow:0 12px 28px rgba(244,123,63,.32)}
#sk-promo-lp .sklp-btn-reg:hover{filter:brightness(1.05)}

/* booking form popup — same .skb-modal pattern as the branch page (global, fixed) */
.skb-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:flex-start;justify-content:center;background:rgba(6,26,32,.9);padding:40px 20px;overflow-y:auto}
.skb-modal[hidden]{display:none}
.skb-modal-box{position:relative;background:#fff;border-radius:20px;width:100%;max-width:620px;margin:auto;padding:34px 34px 30px;box-shadow:0 30px 80px rgba(0,0,0,.4)}
.skb-modal-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;background:#F1F5F7;color:#0B3A47;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s}
.skb-modal-close:hover{background:#E1EAEE}
.skb-modal-head{margin:0 30px 20px 0}
.skb-modal-head h3{margin:0;font-size:22px;font-weight:700;color:#0B3A47}
.skb-modal-head p{margin:6px 0 0;font-size:14.5px;color:#5B7680;line-height:1.6}
.skb-modal-body .nf-form-cont,.skb-modal-body .nf-form-layout{max-width:100%}
body.skb-modal-open{overflow:hidden}
@media(max-width:560px){.skb-modal-box{padding:26px 20px 22px}.skb-modal{padding:20px 12px}}

/* ---------- responsive ---------- */
@media(max-width:1000px){
	#sk-promo-lp .sklp-hero-grid{grid-template-columns:1fr;gap:34px}
	#sk-promo-lp .sklp-hero-media{max-width:420px;margin:0 auto}
	#sk-promo-lp .sklp-steps-2col{grid-template-columns:1fr;gap:28px}
	#sk-promo-lp .sklp-steps-media{max-width:440px;margin:0 auto;width:100%}
	#sk-promo-lp .sklp-book-grid{grid-template-columns:1fr;gap:30px}
}
@media(max-width:640px){
	#sk-promo-lp .sklp-wrap{padding-left:20px;padding-right:20px}
	#sk-promo-lp .sklp-sec{padding:46px 0}
	#sk-promo-lp .sklp-h1{font-size:29px}
	#sk-promo-lp .sklp-h2{font-size:24px}
	#sk-promo-lp .sklp-value-grid,#sk-promo-lp .sklp-why-grid,#sk-promo-lp .sklp-stats{grid-template-columns:1fr}
	#sk-promo-lp .sklp-hero-btns .sklp-btn{flex:1;justify-content:center}
}
