/* ฟอนต์ self-host ตามมติ D-W5 — สร้างด้วย fetch_fonts.py อย่าแก้ด้วยมือ
   ที่มา: Google Fonts (Poppins, Noto Sans Thai) · ใบอนุญาต SIL Open Font License 1.1 */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-thai-0558c764.woff2) format('woff2');
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-ext-fbba4ed1.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-65739977.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-thai-0558c764.woff2) format('woff2');
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-ext-fbba4ed1.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-65739977.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-thai-0558c764.woff2) format('woff2');
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-ext-fbba4ed1.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-65739977.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-thai-0558c764.woff2) format('woff2');
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-ext-fbba4ed1.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansThai-latin-65739977.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Poppins-latin-ext-1fae5e73.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Poppins-latin-3dc5d0c5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Poppins-latin-ext-f8f0c286.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Poppins-latin-289e0afc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Poppins-latin-ext-72efc6a3.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Poppins-latin-872e8629.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/Poppins-latin-ext-2477683a.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/Poppins-latin-197a3cbd.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


    body{margin:0;background:#FFFFFF;color:#1F2430;font-family:'Poppins','Noto Sans Thai','Sarabun',sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
    a{color:#3D6FC4;text-decoration:none} a:hover{color:#23388C}
    h1,h2,h3{margin:0;font-weight:600;line-height:1.15;text-wrap:balance;color:#23388C}
    p{margin:0;text-wrap:pretty}
    .wrap{max-width:1200px;margin:0 auto;padding:0 40px}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:6px;font-weight:500;font-size:15px;white-space:nowrap}
    .btn-w{background:#FFFFFF;color:#23388C} .btn-w:hover{background:#F2F4F8;color:#23388C}
    .btn-n{background:#23388C;color:#FFFFFF} .btn-n:hover{background:#1B2C70;color:#FFFFFF}
    .btn-o{border:1px solid rgba(255,255,255,.4);color:#FFFFFF} .btn-o:hover{border-color:#FFFFFF;color:#FFFFFF}
    .hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#23388C 0%,#1B2C70 100%);color:#FFFFFF}
    .ribbon{position:absolute;height:14px;background:linear-gradient(to right,#E87B35 0 34%,#3D6FC4 34% 66%,rgba(255,255,255,.9) 66% 100%);transform:rotate(-18.5deg);opacity:.9;pointer-events:none}
    .nav a{color:rgba(255,255,255,.85);padding-bottom:4px;border-bottom:2px solid transparent} .nav a:hover{color:#FFFFFF} .nav a.active{color:#FFFFFF;border-bottom-color:#E87B35}
    .skew{display:inline-block;transform:skewX(-18.5deg)} .skew>span{display:inline-block;transform:skewX(18.5deg)}
    .chip{color:#FFFFFF;font-family:'Poppins','Noto Sans Thai',sans-serif;font-weight:600;font-size:13px;padding:6px 14px;letter-spacing:.04em}
    .card{background:#FFFFFF;border:1px solid #E2E5EB}
    .lift{box-shadow:0 24px 60px rgba(35,56,140,.10)}
    .glass{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:12px}
    .ring{position:absolute;border:90px solid #FFFFFF;border-radius:160px;transform:rotate(18.5deg);opacity:.8;pointer-events:none}
    .eyebrow{font-family:'Poppins','Noto Sans Thai',sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#5A6270}
    /* ไทยไม่รับระยะตัวอักษรแบบบวก สระกับวรรณยุกต์จะดูหลุดจากพยัญชนะ */
    .no-ls{letter-spacing:normal !important}
    .foot a{color:rgba(255,255,255,.78)} .foot a:hover{color:#FFFFFF}
    .rows>div{display:flex;gap:20px;padding:22px 0;border-top:1px solid #C9CFDA} .rows>div:last-child{border-bottom:1px solid #C9CFDA}
    .rows b{font-family:'Poppins','Noto Sans Thai',sans-serif;font-weight:600;color:#E87B35;font-size:15px;width:36px;flex:0 0 36px}
    ul.plain{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;color:#5A6270;font-size:14.5px}
    ul.plain li{display:flex;gap:10px;align-items:flex-start}
    ul.plain li::before{content:"";flex:0 0 6px;width:6px;height:6px;border-radius:50%;background:#3D6FC4;margin-top:9px}
    table.reg{width:100%;border-collapse:collapse;font-size:15px}
    table.reg th,table.reg td{text-align:left;vertical-align:top;padding:14px 16px;border-bottom:1px solid #E2E5EB}
    table.reg th{width:34%;font-weight:500;color:#5A6270;background:#F2F4F8} table.reg td{color:#1F2430}
    .num{font-family:'Poppins','Noto Sans Thai',sans-serif} .mono{font-family:'Poppins','Noto Sans Thai',sans-serif;background:#FFFFFF;padding:1px 6px;border-radius:4px;font-size:13.5px}
    label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;color:#1F2430}
    .field{height:48px;border:1px solid #E2E5EB;border-radius:6px;padding:0 14px;display:flex;align-items:center;color:#8A909C;font-weight:400;font-size:15px;background:#FFFFFF}
    .area{min-height:132px;border:1px solid #E2E5EB;border-radius:6px;padding:12px 14px;color:#8A909C;font-weight:400;font-size:15px;background:#FFFFFF}
    .pill{display:inline-flex;align-items:center;height:32px;padding:0 13px;border-radius:999px;font-size:13.5px;white-space:nowrap;background:#FFFFFF;border:1px solid #E2E5EB;color:#1F2430}
    @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    @keyframes slide{from{opacity:0;transform:translate(60px,20px)}to{opacity:1;transform:none}}
    .rise{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}.d1{animation-delay:.05s}.d2{animation-delay:.15s}.d3{animation-delay:.25s}.d4{animation-delay:.35s}
    .mark{animation:slide 1s cubic-bezier(.2,.7,.2,1) .1s both}

/* ── ฟอร์มจริง — บน artboard ช่องเหล่านี้เป็น div ภาพนิ่ง ที่นี่เป็น input จริง ── */
input.field,select.field,textarea.area{width:100%;box-sizing:border-box;font-family:inherit;font-size:15px;color:#1F2430;display:block;appearance:none}
select.field{cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235A6270' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}
textarea.area{resize:vertical;line-height:1.6}
input.field::placeholder,textarea.area::placeholder{color:#8A909C}
input.field:focus,select.field:focus,textarea.area:focus{outline:none;border-color:#3D6FC4;box-shadow:0 0 0 3px rgba(61,111,196,.15)}
button.btn{border:0;cursor:pointer;font-family:inherit}
button.btn:disabled{opacity:.6;cursor:default}
/* กับดักสแปม — ต้องมองไม่เห็นแต่ไม่ใช่ display:none เพราะบอตบางตัวข้ามช่องที่ซ่อนแบบนั้น */
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}

/* ── ย่อจอได้ — มีเฉพาะเว็บจริง artboard บน canvas ยังตรึง 1440 ตามเดิม ──
   เลย์เอาต์ต้นทางเขียนด้วย inline style เกือบทั้งหมด ⇒ กฎที่นี่ต้อง !important
   และจับด้วย attribute selector เพื่อครอบ grid ที่ประกาศในหน้าเพจโดยไม่ต้องไล่แก้ทีละหน้า */
img,svg{max-width:100%;height:auto}
html,body{overflow-x:hidden}
.wrap{padding-left:24px !important;padding-right:24px !important}

@media (max-width:1024px){
  .wrap{padding-left:20px !important;padding-right:20px !important}
  /* กริด 3-4 คอลัมน์ → 2 คอลัมน์ */
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns:repeat(4"]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  /* กริด 12 คอลัมน์ (hero + footer) → คอลัมน์เดียว */
  [style*="grid-template-columns:repeat(12"]{grid-template-columns:1fr !important}
  [style*="grid-column:span"]{grid-column:1 / -1 !important}
  h1{font-size:42px !important;max-width:none !important}
}

@media (max-width:768px){
  .wrap{padding-left:18px !important;padding-right:18px !important}
  h1{font-size:32px !important;line-height:1.2 !important}
  h2{font-size:24px !important}
  /* กริดทุกแบบเหลือคอลัมน์เดียว */
  [style*="grid-template-columns:repeat("]{grid-template-columns:1fr !important}
  /* การ์ดที่ต่อกันเป็นแถบเดียวบนจอใหญ่ ต้องคืนเส้นขอบซ้ายเมื่อซ้อนเป็นแนวตั้ง */
  .card[style*="border-left:0"]{border-left:1px solid #E2E5EB !important;border-top:0 !important}
  /* แถวที่ต้องหักลงเป็นแนวตั้ง */
  .cta-inner{flex-direction:column !important;align-items:flex-start !important;padding:36px !important}
  .foot-bottom{flex-direction:column !important;gap:8px}
  .btn-row{width:100%}
  .btn-row .btn{width:100%;justify-content:center}
  /* nav ห่อบรรทัดแทนการซ่อนลิงก์ — ไม่มีปุ่มแฮมเบอร์เกอร์ก็ยังกดครบทุกเมนู */
  .nav-bar{height:auto !important;flex-wrap:wrap;gap:14px;padding:16px 0}
  .nav{flex-wrap:wrap;gap:18px !important;font-size:14px !important}
  /* ตารางข้อมูลนิติบุคคลบน /about เลื่อนแนวนอนในกล่องตัวเอง ไม่ดันทั้งหน้า */
  table{display:block;width:100%;overflow-x:auto}
  /* โลโก้ตกแต่งขนาดยักษ์หลัง hero ทับเมนูจนอ่านไม่ออกบนจอแคบ */
  .hero .mark{display:none}
}

@media (max-width:480px){
  .wrap{padding-left:16px !important;padding-right:16px !important}
  h1{font-size:27px !important}
  .ribbon,.ring{display:none}
  .cta-inner{padding:28px !important}
}