/* หน้า /learning — ต่อยอดจาก style.css ใช้โทเคนเดียวกับ amornphat.com
   สร้าง 3 ต.ค. 2569 ตามถ้อยคำใน doxzilla_2026-10-03_learning-guide-grade-signup-COPY.md */

/* ประโยคเปิดเผยการตัดเงิน ขนาดเท่าเนื้อความปกติ ห้ามทำตัวเล็กจาง */
.charge{font-size:17px;line-height:1.8;color:var(--ink-soft);max-width:680px;margin:14px 0 0}

/* บล็อก 3 การ์ดช่วงชั้น */
.gcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px;margin:30px 0 0}
.gcard{display:flex;flex-direction:column;gap:8px;padding:24px;border:1px solid var(--line);
  border-radius:14px;text-decoration:none;color:var(--ink);background:var(--bg);transition:border-color .15s}
.gcard:hover{border-color:var(--ink)}
.gcard__g{font-size:24px;font-weight:500;letter-spacing:-.5px}
.gcard__d{font-size:16px;line-height:1.75;color:var(--ink-soft);flex:1}
.gcard__n{font-size:14px;color:var(--ink-soft)}
.gcard__go{font-size:15px;color:var(--accent);margin-top:4px}

/* กล่องกางดูรายละเอียด */
.more{margin:34px 0 0;border-top:1px solid var(--line);padding-top:8px}
.more>summary{cursor:pointer;list-style:none;padding:14px 0;font-size:17px;color:var(--accent)}
.more>summary::-webkit-details-marker{display:none}
.more>summary::after{content:" ↓"}
.more[open]>summary::after{content:" ↑"}

/* บล็อก 4 ห้าขั้น สองสำนวน */
.hero-line{font-size:clamp(22px,2.4vw,30px);line-height:1.55;font-weight:500;
  letter-spacing:-.5px;max-width:860px;margin:18px 0 10px}
.steps5{margin:34px 0 0;border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:200px minmax(0,1fr) minmax(0,1fr);gap:28px;
  padding:26px 0;border-bottom:1px solid var(--line);align-items:start}
.step h3{margin:0;font-size:23px;font-weight:500;line-height:1.5;display:flex;gap:12px;align-items:baseline}
.step__n{color:#a0a0a5;font-size:14px}
.step__c p{margin:6px 0 0;font-size:17px;line-height:1.85}
.step__w{font-size:12px;font-weight:600;letter-spacing:1.2px;color:var(--ink-soft)}
.incl{margin:44px 0 0;padding:28px 30px 26px;background:var(--bg);border:1px solid var(--line);border-radius:14px}
.incl h3{margin:0 0 14px;font-size:21px;font-weight:500}

/* บล็อก 6 สัปดาห์แรก */
.week{margin:26px 0 0;padding:0 0 0 22px;max-width:760px}
.week li{font-size:18px;line-height:1.9;margin-bottom:16px}

/* บล็อก 9 คำถามที่พบบ่อย */
.faq{max-width:760px;margin-top:26px}
.faq h3{margin:30px 0 10px;font-size:20px;font-weight:600;line-height:1.6}
.faq h3:first-child{margin-top:0}
.faq p{margin:0;font-size:18px;line-height:1.9}
.todo{color:var(--ink-soft)}

/* บล็อก 11 ปิดท้าย */
.close h2{font-size:clamp(30px,3.6vw,46px);line-height:1.45}
.close .charge{margin:16px 0 24px}

@media(max-width:1080px){
  .step{grid-template-columns:1fr;gap:12px;padding:22px 0}
  .step h3{font-size:21px}
}
@media(max-width:680px){
  .gcards{grid-template-columns:1fr;gap:14px}
  .gcard{padding:20px}
  .charge{font-size:16px}
  .week li{font-size:17px}
  .faq p{font-size:17px}
  .incl{padding:22px 20px 20px}
}

/* รูปหลักหน้า learning */
.hero-photo{margin:34px 0 0;max-width:720px}
.hero-photo img{display:block;width:100%;height:auto;border-radius:16px}

/* สองประตู และการ์ดเครื่องมือ (4 ต.ค. 2569) */
.doors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.card--link{display:block;text-decoration:none;color:var(--ink);background:var(--bg);transition:border-color .15s}
.card--link:hover{border-color:var(--ink)}
.card--link h3{font-size:21px}
@media(max-width:680px){.doors{grid-template-columns:1fr}}