/* register.css | เฉพาะหน้า register.html (สมัครเรียน) */

:root { --maroon-dark: #5c0000; }

/* ===== ส่วนหัวหน้า + ปุ่มสมัครเรียน ===== */
.reg-hero { background: var(--maroon-dark); color: #fff; padding: 4rem 0 3.5rem; }
.reg-hero h1 { font-weight: 700; font-size: clamp(2rem, 5vw, 3.25rem); }
.reg-hero .lead { color: #f0d9d9; max-width: 36rem; }

.btn-apply {
  background: var(--gold);
  color: var(--maroon-dark);
  font-weight: 700;
  font-size: 1.35rem;
  padding: .9rem 2.25rem;
  border: 0;
  border-radius: 3rem;
  box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .35);
  transition: transform .2s, box-shadow .2s;
}
.btn-apply:hover, .btn-apply:focus-visible {
  background: #ffe699;
  color: var(--maroon-dark);
  transform: translateY(-2px);
  box-shadow: 0 .75rem 1.5rem rgba(0, 0, 0, .4);
}
@media (prefers-reduced-motion: no-preference) {
  .btn-apply { animation: nudge 2.6s ease-in-out 1s 2; }
}
@keyframes nudge { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }

/* แถบช่วงเวลารับสมัคร */
.period-bar { background: var(--gold); color: var(--maroon-dark); }
.period-bar .container { padding-top: .85rem; padding-bottom: .85rem; }

/* ===== หัวข้อแต่ละส่วน ===== */
.sec { padding: 3rem 0 0; }
.sec h2 {
  color: var(--maroon);
  font-weight: 700;
  font-size: 1.6rem;
  margin-bottom: 1.25rem;
  padding-left: .85rem;
  border-left: 5px solid var(--gold);
}

/* การ์ดระดับชั้น */
.level-card { border: 1px solid #e6dcdc; border-radius: 1rem; height: 100%; }
.level-card .badge-level {
  display: inline-block;
  background: var(--maroon);
  color: #fff;
  border-radius: .5rem;
  padding: .2rem .8rem;
  font-weight: 700;
  font-size: 1.15rem;
}

/* รายการติ๊กถูก */
.check-list { list-style: none; padding: 0; margin: 0; }
.check-list li { display: flex; gap: .65rem; padding: .55rem 0; border-bottom: 1px dashed #e6dcdc; }
.check-list li:last-child { border-bottom: 0; }
.check-list .bi { color: var(--maroon); margin-top: .2rem; }

/* ขั้นตอน (เป็นลำดับจริง จึงใส่เลขกำกับ) */
.steps { list-style: none; padding: 0; margin: 0; counter-reset: s; }
.steps li { position: relative; padding: 0 0 1.5rem 3.5rem; counter-increment: s; }
.steps li::before {
  content: counter(s);
  position: absolute; left: 0; top: 0;
  width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: var(--maroon); color: #fff;
  display: grid; place-items: center; font-weight: 700;
}
.steps li::after {
  content: ""; position: absolute; left: 1.2rem; top: 2.7rem; bottom: .2rem;
  width: 2px; background: #e6c7c7;
}
.steps li:last-child::after { display: none; }
.steps h3 { font-size: 1.1rem; font-weight: 700; margin: .2rem 0 .15rem; color: #333; }
.steps p { margin: 0; color: #555; }

/* ช่องทางสมัคร */
.channel { border: 1px solid #e6dcdc; border-radius: 1rem; padding: 1.5rem; height: 100%; }
.channel .icon { font-size: 2rem; color: var(--maroon); }

/* แถบเรียกให้สมัครท้ายหน้า */
.cta-end {
  background: var(--maroon-dark); color: #fff;
  border-radius: 1.25rem; padding: 2.5rem 1.5rem; text-align: center;
}
.cta-end p { color: #f0d9d9; }