.png-page{--png-ink:#12213e;--png-paper:#fffdf8;--png-mist:#f1f5ff;--png-coral:#ff674c;--png-lime:#c8f43e;--png-muted:#536681;--png-gutter:clamp(24px,10vw,156px);overflow:hidden;background:var(--png-paper);color:var(--png-ink)}.png-page :is(h1,h2,h3,p){margin-top:0}.png-page h1,.png-page h2{text-wrap:balance}.section-shell{padding:clamp(76px,9vw,128px) var(--png-gutter)}.eyebrow{margin:0 0 16px;color:#607733;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.eyebrow:before{display:inline-block;width:9px;height:9px;margin-right:9px;border:1.5px solid currentColor;border-radius:50%;content:""}.section-intro{max-width:760px}.section-intro h2,.quality-copy h2{margin-bottom:18px;font:650 clamp(38px,4.8vw,67px)/.98 "Bricolage Grotesque",sans-serif;letter-spacing:-.065em}.section-intro>p:last-child,.quality-copy>p{max-width:59ch;color:var(--png-muted);font-size:16px;line-height:1.62}.png-hero{position:relative;display:flex;flex-direction:column;align-items:center;padding:clamp(82px,10vw,132px) var(--png-gutter) 0;overflow:hidden;text-align:center;background:radial-gradient(circle at 85% 18%,#d7f6ff 0 0,rgba(215,246,255,.8) 0 10%,transparent 31%),radial-gradient(circle at 8% 58%,#ffe5ce 0 0,rgba(255,229,206,.76) 0 12%,transparent 31%),var(--png-paper)}.png-hero:after{position:absolute;right:2.5vw;bottom:-135px;width:290px;height:290px;border:1px solid #12213e18;border-radius:50%;background:repeating-radial-gradient(circle,#12213e00 0 14px,#12213e11 15px 16px);content:""}.png-hero__copy,.png-hero__board{position:relative;z-index:1}.png-hero__copy{max-width:860px;margin-bottom:clamp(30px,4vw,46px)}.png-hero h1{max-width:760px;margin:0 auto 23px;font:650 clamp(50px,5.5vw,82px)/.91 "Bricolage Grotesque",sans-serif;letter-spacing:-.078em}.png-hero h1 em{color:var(--png-coral);font-family:Playfair Display,serif;font-weight:600}.png-hero__lead{max-width:620px;margin:0 auto 27px;color:#405170;font-size:17px;line-height:1.62}.png-hero__facts{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 18px;margin:0;padding:0;list-style:none;color:#405170;font-size:12px;font-weight:800}.png-hero__facts li:before{margin-right:7px;color:var(--png-coral);content:"✦"}.png-hero__board{width:min(100%,960px);padding:23px;background:linear-gradient(135deg,#d9efff,#f6fbff);box-shadow:20px 26px 52px #27486a24;transform:rotate(.55deg)}.png-hero__board:before,.png-hero__board:after{position:absolute;width:22px;height:22px;border:3px solid var(--png-lime);content:""}.png-hero__board:before{top:14px;left:14px;border-right:0;border-bottom:0}.png-hero__board:after{right:14px;bottom:14px;border-top:0;border-left:0}.png-hero__board .workspace.empty{min-height:300px;box-shadow:none;outline:1px dashed #a5b6d5;outline-offset:-10px}.png-hero__board .workspace .scanner-icon{display:none}.png-hero__board .workspace h2{font:600 clamp(27px,2.5vw,35px)/1.02 "Playfair Display",serif}.png-explainer{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.3fr);gap:clamp(42px,8vw,128px);align-items:start;border-top:1px solid #12213e20}.alpha-grid{display:grid;gap:1px;background:#12213e18;border:1px solid #12213e18}.alpha-grid article{min-height:177px;padding:26px;background:var(--png-paper)}.alpha-grid__icon{display:grid;width:36px;height:36px;margin-bottom:19px;place-items:center;color:#fff;background:var(--png-ink);font:800 9px/1 DM Mono,monospace;letter-spacing:.04em}.alpha-grid__icon--subject{border-radius:50% 50% 45% 45%;background:var(--png-coral)}.alpha-grid__icon--checker{background-color:#f1f4f4;background-image:linear-gradient(45deg,#9eabb5 25%,transparent 25%),linear-gradient(-45deg,#9eabb5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#9eabb5 75%),linear-gradient(-45deg,transparent 75%,#9eabb5 75%);background-position:0 0,0 9px,9px -9px,-9px 0;background-size:18px 18px}.alpha-grid__icon--file{border-radius:3px}.alpha-grid h3,.trust-grid h3{margin-bottom:8px;font-size:18px;letter-spacing:-.04em}.alpha-grid p,.trust-grid p{max-width:52ch;margin:0;color:var(--png-muted);font-size:14px;line-height:1.58}.png-steps{background:var(--png-ink);color:#fff}.section-intro--light h2{color:#fff}.section-intro--light>p:last-child{color:#c8d4e5}.png-steps .eyebrow{color:var(--png-lime)}.step-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:50px 0 30px;padding:0;background:#ffffff2c;list-style:none}.step-grid li{min-height:224px;padding:25px;background:#183156}.step-grid span{display:block;margin-bottom:32px;color:var(--png-lime);font:500 11px/1 DM Mono,monospace;letter-spacing:.08em}.step-grid h3{margin-bottom:9px;font-size:19px;letter-spacing:-.04em}.step-grid p{margin:0;color:#d7e1ef;font-size:14px;line-height:1.58}.coral-link,.png-closing>a{display:inline-flex;align-items:center;gap:9px;padding:14px 19px;border-radius:999px;background:var(--png-coral);color:#fff;font-size:14px;font-weight:800;transition:transform .18s ease,background .18s ease}.coral-link:hover,.png-closing>a:hover{background:#e9553b;transform:translateY(-2px)}.png-use{background:#f6f8ff}.use-case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}.use-case{min-width:0}.use-case figure{position:relative;height:255px;margin:0 0 17px;overflow:hidden;background-color:#edf1f2;background-image:linear-gradient(45deg,#dce2e6 25%,transparent 25%),linear-gradient(-45deg,#dce2e6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dce2e6 75%),linear-gradient(-45deg,transparent 75%,#dce2e6 75%);background-position:0 0,0 12px,12px -12px,-12px 0;background-size:24px 24px}.use-case figure:after{position:absolute;top:14px;left:14px;padding:5px 7px;color:#fff;background:#12213ed9;font:700 9px/1 DM Mono,monospace;letter-spacing:.06em;content:"TRANSPARENT"}html[lang=th] .use-case figure:after{content:"โปร่งใส"}.use-case img{width:100%;height:100%;object-fit:contain;padding:16px}.use-case>p{margin:0 0 8px;color:#607733;font:800 10px/1 DM Mono,monospace;letter-spacing:.1em}.use-case h3{margin-bottom:8px;font-size:21px;letter-spacing:-.05em}.use-case>span{display:block;color:var(--png-muted);font-size:14px;line-height:1.55}.specialist-links{display:flex;flex-wrap:wrap;gap:9px 28px;margin-top:42px;padding-top:22px;border-top:1px solid #12213e24}.specialist-links a{color:#405170;font-size:13px;font-weight:800;text-decoration:underline;text-decoration-color:#ff674c;text-underline-offset:5px}.specialist-links span{margin-left:5px;color:var(--png-coral)}.png-quality{display:grid;grid-template-columns:minmax(280px,.84fr) minmax(0,1.16fr);gap:clamp(46px,8vw,133px);align-items:center;background:var(--png-paper)}.quality-visual{position:relative;display:grid;min-height:410px;place-items:center;overflow:hidden;background-color:#e8ecee;background-image:linear-gradient(45deg,#d2dadd 25%,transparent 25%),linear-gradient(-45deg,#d2dadd 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d2dadd 75%),linear-gradient(-45deg,transparent 75%,#d2dadd 75%);background-position:0 0,0 17px,17px -17px,-17px 0;background-size:34px 34px}.quality-visual img{width:100%;height:100%;object-fit:contain;padding:22px;filter:drop-shadow(0 16px 15px #12213e2d)}.quality-visual__label{position:absolute;top:16px;left:16px;padding:7px 9px;color:var(--png-ink);background:var(--png-lime);font:800 10px/1 DM Mono,monospace;letter-spacing:.09em}.quality-copy ul{display:grid;gap:16px;margin:28px 0;padding:0;list-style:none}.quality-copy li{padding-left:24px;color:var(--png-muted);font-size:14px;line-height:1.58}.quality-copy li:before{position:absolute;margin-left:-24px;color:var(--png-coral);content:"✦"}.quality-copy li strong{color:var(--png-ink)}.quality-note{padding:16px 18px;border-left:3px solid var(--png-coral);background:#fff4ed;font-size:13px!important}.quality-note strong{color:var(--png-ink)}.png-trust{background:#ddf2ff}.trust-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:48px;background:#12213e1a;border:1px solid #12213e1a}.trust-grid article{min-height:185px;padding:25px;background:#f8fcff}.trust-grid article>span{display:block;margin-bottom:27px;color:#607733;font:800 10px/1 DM Mono,monospace;letter-spacing:.1em}.trust-grid a{color:var(--png-ink);font-weight:800;text-decoration:underline;text-decoration-color:var(--png-coral);text-underline-offset:4px}.trust-links{display:flex;flex-wrap:wrap;gap:23px;margin:22px 0 0}.trust-links a{color:#405170;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:4px}.png-faq{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);gap:clamp(45px,8vw,130px);background:#f6f8ff}.faq-list{border-top:1px solid #12213e28}.faq-list details{border-bottom:1px solid #12213e28}.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 0;color:var(--png-ink);font-size:16px;font-weight:800;cursor:pointer;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{flex:0 0 auto;color:var(--png-coral);font-size:22px;font-weight:400}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list p{max-width:64ch;margin:0;padding:0 30px 22px 0;color:var(--png-muted);font-size:14px;line-height:1.6}.faq-list summary:focus-visible{outline:3px solid #607733;outline-offset:4px}.png-closing{padding:60px var(--png-gutter);color:#fff;background:var(--png-coral)}.png-closing .eyebrow{color:#fff7f2}.png-closing h2{max-width:660px;margin-bottom:15px;font:650 clamp(32px,4vw,52px)/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.06em}.png-closing>p:not(.eyebrow){max-width:600px;margin-bottom:23px;color:#fff7f2;font-size:16px;line-height:1.6}.png-closing>a{background:#fff;color:var(--png-coral)}.png-closing>a:hover{background:#12213e;color:#fff}.png-page a:focus-visible{outline:3px solid #607733;outline-offset:4px}@media(min-width:1512px){.png-page{--png-gutter: calc((100vw - 1152px)/2) }}@media(max-width:900px){.png-explainer,.png-quality,.png-faq{grid-template-columns:1fr}.png-hero{padding-top:72px}.png-hero__board{max-width:820px}.step-grid,.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.use-case-grid{gap:14px}.quality-visual{max-width:600px}.png-faq .section-intro{max-width:630px}}@media(max-width:620px){.section-shell{padding-block:67px}.png-hero{padding-inline:24px}.png-hero h1{font-size:clamp(42px,12vw,58px)}.png-hero__board{padding:11px;transform:none}.png-hero__board .workspace.empty{min-height:270px}.step-grid,.trust-grid,.use-case-grid{grid-template-columns:1fr}.step-grid li{min-height:0}.use-case figure{height:245px}.png-quality{gap:34px}.quality-visual{min-height:300px}.png-faq{gap:33px}.faq-list summary{font-size:15px}.png-closing{padding:48px 24px}}
