@font-face{font-family:Plex;src:url('/assets/plex-thai-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Plex;src:url('/assets/plex-thai-500.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:Plex;src:url('/assets/plex-thai-600.ttf') format('truetype');font-weight:600;font-display:swap}
html,body{background:#f4f6f4;min-height:100%}
/* Public platform pages: /learn, /market, /a/<slug>, /jobs, /w — shares the hub palette and type. */
.hub{max-width:1180px;margin:0 auto;padding:0 20px 40px;font-family:Plex,'Noto Sans Thai',system-ui,sans-serif;color:#1d4135;box-sizing:border-box}
.hub-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0;border-bottom:1px solid #d8dfd4}
.hub-head nav{display:flex;flex-wrap:wrap;gap:18px}.hub-head a{color:inherit;text-decoration:none;font-size:16px}
.hub-brand{font-size:22px;letter-spacing:.08em;font-weight:600}
.hub-hero{padding:48px 0 28px;max-width:860px}
.hub-kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#567561;margin:0 0 10px}
.hub-hero h1{font-size:clamp(32px,4vw,54px);line-height:1.25;font-weight:500;letter-spacing:-.03em;margin:0 0 16px}
.hub-lead{font-size:18px;line-height:1.8;margin:0 0 12px}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:12px}
.hub-guide{background:#fff;border:1px solid #d8e1d4;border-radius:15px;padding:28px;min-width:0}
.hub-guide h2{font-size:24px;line-height:1.5;font-weight:500;margin:0 0 12px}.hub-guide p{font-size:16px;line-height:1.8}
.hub-guide ol,.hub-guide ul{line-height:1.9;font-size:16px;padding-left:22px}
.hub-card-top{display:flex;justify-content:space-between;font-size:13px;letter-spacing:.04em;color:#698169}
.hub-button{font:inherit;display:inline-flex;justify-content:center;align-items:center;background:#244e3e;color:#fff!important;border:1px solid #244e3e;border-radius:9px;padding:13px 22px;text-decoration:none;font-size:16px;cursor:pointer;min-height:46px}
.hub-button.secondary{background:transparent;color:#244e3e!important}.hub-button:hover{background:#173e2e}.hub-button.secondary:hover{background:#e6eee2}
.hub-foot{margin-top:48px;padding-top:24px;border-top:1px solid #d6dfd3;font-size:14px}.hub-foot a{color:#295e45}
.hub-form label{display:block;margin:.7rem 0;font-size:15px}
.hub-form input,.hub-form select,.hub-form textarea{width:100%;box-sizing:border-box;border:1px solid #b9cabb;padding:12px 14px;border-radius:8px;font:inherit;color:#1d4135;background:#fff;margin-top:6px}
.hub-form .consent input{width:auto;margin:0 .4rem 0 0}.hub-form .hub-button{margin-top:10px}
.notice{background:#edf1e7;border:1px solid #d4dec9;border-radius:10px;padding:12px 14px;font-size:15px}
.micro .chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0}.micro .chip{border:1px solid currentColor;border-radius:999px;padding:.15rem .7rem;font-size:.85rem}
.micro-licence,.micro-fine{font-size:.85rem;opacity:.85;line-height:1.7}.micro-contact{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.8rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.wallet-list{list-style:none;padding:0}.wallet-item{padding:.6rem 0;border-bottom:1px solid rgba(0,0,0,.1);line-height:1.7}
@media(max-width:600px){.hub{padding:0 16px 32px}.hub-hero{padding:32px 0 20px}.hub-guide{padding:20px}.hub-head{flex-direction:column;align-items:flex-start}}

/* Public pages (agent page, customer wallet): 16px fields so iOS does not zoom, 44px tap targets. */
.hub input, .hub select, .hub textarea { font-size: 16px; min-height: 44px; }
.hub textarea { min-height: 96px; }
.hub button, .hub .hub-button { min-height: 44px; }
.hub form label { display: block; margin: .6rem 0; }
.hub form input:not([type=checkbox]), .hub form select, .hub form textarea { width: 100%; box-sizing: border-box; }
