@import './semantic.css';
@import './brand.css';
@import './application-tokens.css';
@font-face{font-family:IBM Plex Sans Thai;src:url('./ibm-thai-regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0E00-0E7F}
@font-face{font-family:IBM Plex Sans Thai;src:url('./ibm-thai-semibold.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0E00-0E7F}
@font-face{font-family:IBM Plex Sans Thai;src:url('./ibm-latin-regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:IBM Plex Sans Thai;src:url('./ibm-latin-semibold.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
*{box-sizing:border-box}
html{font-family:'IBM Plex Sans Thai',system-ui,sans-serif;font-synthesis:none;color:var(--foreground);background:var(--background);line-height:1.7}
body{margin:0}
a{color:var(--primary);text-underline-offset:4px;overflow-wrap:anywhere}
a:hover{color:var(--interaction-primary-hover)}
a:focus-visible{outline:2px solid var(--primary);outline-offset:4px;border-radius:var(--po-control-radius)}
.skip{position:absolute;left:var(--po-space-field);top:-100px;background:var(--card);padding:var(--po-space-label);z-index:1}
.skip:focus{top:var(--po-space-label)}
header,footer{max-width:var(--workspace-max-width);margin:auto;padding:var(--po-section-gap) var(--workspace-padding-inline);display:flex;gap:var(--po-section-gap);justify-content:space-between;align-items:center;flex-wrap:wrap}
header{border-bottom:var(--po-section-border)}
.brand{font-size:var(--po-title-size);line-height:var(--po-title-leading);font-weight:var(--po-heading-weight);color:var(--primary)}
nav{display:flex;gap:var(--po-space-action);flex-wrap:wrap}
nav a{display:flex;align-items:center;min-height:var(--po-control-height);padding:var(--po-space-label) var(--po-space-field);border-radius:var(--po-control-radius);text-decoration:none;color:var(--foreground);font-size:var(--po-text-size);line-height:var(--po-text-leading)}
nav a:hover{background:var(--interaction-hover-surface)}
nav a[aria-current='page']{background:var(--interaction-selected-surface);color:var(--interaction-selected-text);font-weight:var(--po-heading-weight)}
main{padding:var(--po-section-gap) var(--workspace-padding-inline)}
article{max-width:840px;margin:auto;padding:calc(var(--po-section-gap)*2);background:var(--card);border:var(--po-section-border);border-radius:var(--po-control-radius)}
.eyebrow{font-size:var(--po-meta-size);line-height:var(--po-meta-leading);color:var(--po-text-secondary);margin:0 0 var(--po-space-label)}
h1{font-size:28px;line-height:1.4;font-weight:var(--po-heading-weight);margin:0 0 var(--po-space-field);overflow-wrap:anywhere}
.intro{font-size:var(--po-title-size);line-height:var(--po-title-leading);color:var(--po-text-secondary);margin:0 0 calc(var(--po-section-gap)*2)}
section+section{margin-top:var(--po-section-gap)}
h2{font-size:var(--po-title-size);line-height:var(--po-title-leading);font-weight:var(--po-heading-weight);margin:0 0 var(--po-heading-content-gap)}
p{margin:0 0 var(--po-space-field);overflow-wrap:anywhere}
section p:last-child{margin-bottom:0}
.contact{border-top:var(--po-section-border);padding-top:var(--po-section-gap)}
footer{font-size:var(--po-meta-size);line-height:var(--po-meta-leading);color:var(--po-text-secondary);justify-content:flex-start}
@media(max-width:640px){article{padding:var(--po-section-gap)}header{gap:var(--po-space-field)}nav{width:100%}nav a{padding-inline:var(--po-space-label)}h1{font-size:24px}}
@media print{header,footer{padding-inline:0}nav,.skip{display:none}main{padding:0}article{border:0;padding:0;max-width:none}html{background:var(--card)}}