/* Sutpinan Corporate Public Experience, tenant-neutral v2. No ERP styles modified. */
:root{color-scheme:light;--ink:#132332;--deep:#071725;--gold:#d3ae72;--gold-soft:#f5e3bc;--muted:#667580;--line:#e2e9ec;--paper:#f8faf9;--font: "Noto Sans Thai","Leelawadee UI",Tahoma,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:95px}
body{margin:0;color:var(--ink);background:#fff;font:400 16px/1.7 var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.shell{width:min(1392px,calc(100% - 104px));margin-inline:auto}.skip-link{position:absolute;z-index:100;top:-100px;left:20px;background:#fff;padding:12px 18px}.skip-link:focus{top:10px}
.topline{height:34px;background:#071521;color:#d2dae0;font:700 9px/1.2 'Segoe UI',sans-serif;letter-spacing:2px}.topline-inner{height:100%;display:flex;align-items:center;justify-content:space-between}.topline-inner>span{display:flex;align-items:center;gap:10px}.status-dot{display:inline-block;width:6px;height:6px;background:#c5a673;border-radius:50%;box-shadow:0 0 0 3px #c5a67333}.topline-right{opacity:.64}.top-divider{width:1px;height:12px;background:#b0bac1;opacity:.6}
.site-header{position:relative;z-index:20;background:#fff;border-bottom:1px solid #f0f1ef}.header-inner{height:90px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:13px;min-width:190px}.brand-symbol{position:relative;isolation:isolate;width:47px;height:47px;display:grid;place-items:center;background:var(--deep);color:#fff;overflow:hidden;clip-path:polygon(0 0,100% 0,100% 79%,79% 100%,0 100%)}.brand-symbol>span{font:bold 22px/1 'Segoe UI',sans-serif;position:relative;z-index:1}.brand-symbol i{position:absolute;width:37px;height:4px;background:var(--gold);transform:rotate(-42deg);bottom:1px;right:-13px}.brand-text{display:flex;flex-direction:column;line-height:1.16;gap:4px}.brand-text strong{font:800 20px/1.15 'Segoe UI',var(--font);letter-spacing:-.5px}.brand-text small{font:bold 9px/1 'Segoe UI',sans-serif;letter-spacing:2px;color:#84919b}.desktop-nav{display:flex;gap:clamp(17px,2.3vw,37px);align-items:center;margin-left:auto}.desktop-nav a{font-size:12px;font-weight:650;color:#354451;white-space:nowrap;transition:color .2s}.desktop-nav a:hover{color:#b7873a}.header-login{display:flex;align-items:center;gap:15px;border:1px solid #162b3a;background:#122b3e;color:white;font-size:12px;font-weight:700;padding:13px 19px;white-space:nowrap;transition:background .2s,transform .2s}.header-login:hover{background:#264b60;transform:translateY(-1px)}.lock-icon{font-size:18px;line-height:1;color:var(--gold)}.mobile-menu{display:none}
.hero{position:relative;min-height:700px;height:min(765px,calc(100svh - 124px));background:#071725;overflow:hidden;color:#fff}.hero.cms-hero:before{content:none}.cms-hero-overlay{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(3,16,27,.96) 0%,rgba(4,20,32,.88) 20%,rgba(5,23,35,.68) 41%,rgba(4,22,35,.24) 74%,rgba(3,19,30,.05) 100%),linear-gradient(0deg,rgba(1,9,16,.72) 0%,transparent 32%)}.hero:before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(3,16,27,.99) 0%,rgba(4,20,32,.96) 20%,rgba(5,23,35,.84) 41%,rgba(4,22,35,.30) 74%,rgba(3,19,30,.10) 100%),linear-gradient(0deg,rgba(1,9,16,.83) 0%,transparent 32%);pointer-events:none}.hero-visual{position:absolute;inset:0;background-image:url('/corporate-assets/hero-campus.svg');background-position:center center;background-size:cover;animation:hero-zoom 16s ease-out both}.hero-grain{pointer-events:none;position:absolute;inset:0;z-index:2;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E")}.hero-main{position:relative;z-index:3;height:100%;display:flex;align-items:center}.hero-content{max-width:775px;padding-bottom:10px;margin-top:-35px}.kicker{font:bold 11px/1.3 'Segoe UI',sans-serif;letter-spacing:2.5px;color:var(--gold-soft);display:flex;align-items:center;gap:14px}.kicker-line{width:32px;height:1px;background:var(--gold)}.kicker-index{font-size:10px;color:#a6bcc4;letter-spacing:2px}.hero-overline{font:700 11px/1.6 'Segoe UI',sans-serif;letter-spacing:4px;margin:47px 0 8px;color:#c2ced3;opacity:.78}.hero h1{margin:0;font-size:clamp(46px,5.1vw,82px);line-height:1.17;letter-spacing:-2.6px;font-weight:750;max-width:840px;text-wrap:balance;text-shadow:0 5px 40px #06192850}.hero-gold{color:var(--gold)}.hero-deck{max-width:600px;margin:27px 0 0;font-size:15px;line-height:2.1;color:#dce7e9;font-weight:450}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px}.button{min-height:54px;display:inline-flex;align-items:center;justify-content:space-between;gap:40px;padding:14px 23px;font-size:13px;font-weight:750;transition:transform .25s,background .25s,border-color .25s}.button:hover{transform:translateY(-3px)}.button-gold{background:#d4b27e;border:1px solid #d4b27e;color:#102432}.button-gold:hover{background:#edcd99}.button-outline{border:1px solid #9fb4bb88;color:#fff;background:#ffffff08}.button-outline:hover{background:#fff2;border-color:white}.button span{font-size:20px;font-weight:400;line-height:1}.hero-rule{height:1px;background:linear-gradient(90deg,#d4b27e80,#ffffff20 66%,transparent);width:min(500px,100%);margin-top:51px}.hero-meta{display:flex;gap:40px;color:#9fb5c0;font:700 9px/1.4 'Segoe UI',sans-serif;letter-spacing:2.2px;margin-top:20px}.hero-meta span{display:flex;align-items:center;gap:10px}.mini-spark{font-size:16px;color:var(--gold);font-style:normal}.hero-side-note{position:absolute;z-index:3;top:46%;right:18px;transform:rotate(90deg) translateX(50%);transform-origin:right center;color:#bdcbd0;font:bold 9px/1 'Segoe UI',sans-serif;letter-spacing:3px;opacity:.75}.hero-side-note span{padding:0 10px}.hero-scroll{position:absolute;z-index:5;right:5.1%;bottom:61px;display:flex;align-items:center;gap:13px;font:700 9px/1.4 'Segoe UI',sans-serif;letter-spacing:2px;color:#e2ebee}.mouse-scroll{width:22px;height:35px;border:1px solid #ffffff99;border-radius:13px;position:relative}.mouse-scroll:after{content:'';position:absolute;top:8px;left:10px;width:2px;height:8px;background:#e4bd7c;animation:scroll-hint 2s infinite}.hero-bottom{position:absolute;left:0;right:0;bottom:0;z-index:3;height:32px;display:flex;align-items:center;gap:20px;padding-left:max(52px,calc((100vw - 1392px)/2));font:700 9px/1 'Segoe UI',sans-serif;letter-spacing:2px;color:#d9e5e9}.hero-bottom-line{height:1px;width:60px;background:var(--gold)}
.intro-strip{background:#ead9b9}.strip-inner{min-height:98px;display:flex;gap:40px;align-items:center;justify-content:space-between}.strip-tag{font:bold 10px 'Segoe UI',sans-serif;letter-spacing:2px;white-space:nowrap;color:#5f4a31}.strip-inner p{margin:0;font-size:20px;line-height:1.5;letter-spacing:-.3px;color:#243544}.strip-inner strong{font-weight:750}.strip-inner>a{display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border:1px solid #ae9472;border-radius:100%;font-size:22px}
.section-pad{padding:130px 0}.about-section{background:#fff}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(60px,8vw,155px);align-items:center}.about-art{position:relative;max-height:655px;aspect-ratio:6/7;min-width:0;background:#0b293c;isolation:isolate}.about-art>img{width:100%;height:100%;object-fit:cover;display:block}.about-art:after{content:'';position:absolute;inset:0;border:1px solid #fff3;pointer-events:none}.about-art-stamp{position:absolute;bottom:-27px;right:-28px;width:180px;height:180px;background:#e9d4b3;color:#1c2f3e;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 18px 40px #0d293222}.about-art-stamp span{font:bold 13px 'Segoe UI',sans-serif;letter-spacing:8px;padding-left:8px}.about-art-stamp strong{font:900 37px/.95 'Segoe UI',sans-serif;letter-spacing:-2px}.about-art-stamp small{font:bold 8px 'Segoe UI',sans-serif;letter-spacing:1.5px;margin-top:13px}.about-ornament{position:absolute;width:115px;height:115px;bottom:-37px;left:-33px;border-left:1px solid #c8a56e;border-bottom:1px solid #c8a56e;z-index:-1}.section-eyebrow{font:800 11px/1.3 'Segoe UI',sans-serif;letter-spacing:2.4px;color:#9b8057}.section-eyebrow b{color:#b08a54}.about-copy h2,.section-heading h2,.contact-inner h2{letter-spacing:-1.6px;font-weight:750;line-height:1.42}.about-copy h2{font-size:clamp(32px,3.7vw,55px);margin:29px 0 20px}.about-copy h2 em,.contact-inner h2 em{font-style:normal;color:#b59160}.gold-dash{display:block;width:72px;height:2px;background:#bf9f6b;margin:29px 0}.about-copy p{font-size:15px;line-height:2.15;color:#647582;max-width:550px;margin:0 0 22px}.about-copy .lead{color:#253645;font-size:16px;font-weight:650}.text-link{display:inline-flex;align-items:center;gap:34px;border-bottom:1px solid #b3905f;color:#173547;font-weight:750;font-size:13px;margin-top:15px;padding:0 0 10px}.text-link span{font:400 22px 'Segoe UI',sans-serif;color:#b09060;transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}
.statement-section{position:relative;background:radial-gradient(ellipse at 70% 28%,#204355,#0c2535 41%,#071521 80%);color:white;overflow:hidden}.statement-section:before{content:'';position:absolute;inset:0;opacity:.12;background-image:repeating-linear-gradient(90deg,#e5f2f9 0px,transparent 1px,transparent 70px),repeating-linear-gradient(0deg,#e5f2f9 0px,transparent 1px,transparent 70px)}.statement-shine{position:absolute;left:48%;top:-170px;width:600px;height:500px;filter:blur(130px);border-radius:50%;background:#51aabb26}.statement-inner{position:relative;padding:120px 0 125px}.statement-inner>span{display:block;font:800 11px 'Segoe UI',sans-serif;letter-spacing:3px;color:#c9ad7b;margin-bottom:27px}.statement-inner h2{font-size:clamp(37px,5.3vw,80px);line-height:1.4;letter-spacing:-2px;font-weight:400;margin:0;position:relative;z-index:1}.statement-inner h2 strong{color:#e4be81;font-weight:800}.statement-inner p{margin:27px 0 0;font:700 13px 'Segoe UI',sans-serif;letter-spacing:4px;color:#b5c7cd}.statement-outline{position:absolute;right:6%;top:1%;font:900 460px/.9 'Segoe UI',sans-serif;color:transparent;-webkit-text-stroke:1px #a9d5dc22;transform:rotate(-13deg);pointer-events:none}
.principles-section{background:#f6f8f8}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:49px}.section-heading h2{font-size:clamp(32px,3.6vw,52px);margin:20px 0 0}.gold-point{color:#c39c63}.section-heading>p{max-width:370px;font-size:13px;line-height:2;color:#697984;margin:0 0 6px}.principle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.principle-card{position:relative;background:#fff;border:1px solid #e5ebed;min-height:370px;padding:34px 38px 40px;overflow:hidden;transition:box-shadow .25s,transform .25s,border-color .25s}.principle-card:before{content:'';position:absolute;height:3px;width:0;background:#caa66e;top:0;left:0;transition:width .35s}.principle-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px #12334a12;border-color:#d6cbb7}.principle-card:hover:before{width:100%}.p-num{font:800 10px 'Segoe UI',sans-serif;letter-spacing:2px;color:#a38c68}.p-icon{display:grid;place-items:center;width:75px;height:75px;color:#ba955f;background:#f7f3eb;border-radius:50%;margin-top:38px}.p-icon svg{width:48px;height:48px}.principle-card h3{font-size:25px;margin:25px 0 8px}.principle-card p{font-size:14px;line-height:2;color:#75838d;margin:0;max-width:280px}.p-arrow{font:300 26px/1 'Segoe UI',sans-serif;color:#a0afb6;position:absolute;right:30px;top:31px}
.news-section{background:#fff}.news-heading{margin-bottom:44px}.news-feature{display:grid;grid-template-columns:1.05fr 1fr;min-height:436px;background:#112b3e}.news-image{position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 38% 30%,#39667c,#193749 43%,#061b29)}.news-image:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#ffffff0c 1px,transparent 1px),linear-gradient(0deg,#ffffff0c 1px,transparent 1px);background-size:37px 37px;transform:perspective(250px) rotateX(15deg) scale(1.4);opacity:.46}.news-image:after{content:'';position:absolute;width:70%;height:70%;border:1px solid #d6b17d45;border-radius:50%;box-shadow:0 0 0 55px #ffffff06,0 0 0 95px #ffffff04}.news-pattern{position:absolute;width:600px;height:600px;border:1px solid #ffffff12;transform:rotate(35deg)}.news-mark{z-index:1;font:900 clamp(130px,13vw,240px)/1 'Segoe UI',sans-serif;color:#ffffff17;text-shadow:0 0 2px #bdd4dc55}.news-content{color:#fff;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:60px clamp(40px,5vw,85px)}.news-kicker{font:800 11px 'Segoe UI',sans-serif;letter-spacing:2.2px;color:#ebc994;display:flex;align-items:center;gap:12px}.news-kicker i{width:8px;height:8px;background:#d1aa73;display:inline-block;border-radius:50%}.news-content h3{font-size:clamp(30px,3.2vw,46px);line-height:1.5;letter-spacing:-.7px;margin:23px 0 17px;font-weight:650}.news-content p{font-size:14px;line-height:2;color:#c7d6df;max-width:485px;margin:0 0 29px}.news-pending{border-top:1px solid #ffffff44;padding-top:18px;font:700 10px 'Segoe UI',sans-serif;color:#a5bac7;letter-spacing:1.7px}.news-pending>span{font-size:17px;color:#c9a575;margin-right:8px}.notice-bar{display:flex;align-items:center;gap:20px;border:1px solid #e4eaec;background:#f8fafb;margin-top:22px;padding:21px 30px}.notice-indicator{height:38px;width:4px;background:#c6a16e}.notice-bar>div{display:flex;gap:8px;flex-direction:column}.notice-bar strong{font-size:14px}.notice-bar div span{font-size:12px;color:#71818b}.notice-label{margin-left:auto;font:800 10px 'Segoe UI',sans-serif;letter-spacing:2px;color:#b1bcc2}
.contact-section{overflow:hidden;background:#0b2130;color:white}.contact-inner{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:535px;padding-top:80px;padding-bottom:80px}.contact-inner h2{position:relative;z-index:2;font-size:clamp(39px,4.4vw,67px);margin:22px 0}.contact-inner p{font-size:14px;line-height:2;max-width:460px;color:#beccd4;margin:0 0 35px}.contact-graphic{position:absolute;right:6%;top:50%;width:430px;height:430px;transform:translateY(-50%);display:grid;place-items:center}.contact-graphic .circle{position:absolute;border:1px solid #cfad7852;border-radius:50%}.contact-graphic .c1{width:98%;height:98%}.contact-graphic .c2{width:73%;height:73%}.contact-graphic .c3{width:48%;height:48%;border-style:dashed;animation:slow-spin 70s linear infinite}.contact-letter{font:900 245px/1 'Segoe UI',sans-serif;color:#e3cb9d0f;-webkit-text-stroke:1px #dcb57755}
.site-footer{background:#071521;color:#cedade}.footer-upper{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:56px 0;border-bottom:1px solid #ffffff1c}.footer-brand .brand-symbol{background:#d4b17b;color:#0c2638}.footer-brand .brand-symbol i{background:#0d2c3a}.footer-brand .brand-text strong{color:white}.footer-brand .brand-text small{color:#8ea5b0}.footer-upper p{font-size:12px;color:#9eafb8}.footer-links{display:flex;gap:25px}.footer-links a{font-size:12px;color:#e0e8eb;white-space:nowrap}.footer-links a:hover{color:#e8c48e}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding:23px 0;color:#8a9ca7;font:700 9px/1.4 'Segoe UI',sans-serif;letter-spacing:1.4px}.footer-bottom b{color:#dfb679;margin:0 9px}
@keyframes scroll-hint{0%{opacity:0;transform:translateY(-3px)}50%{opacity:1}100%{opacity:0;transform:translateY(9px)}}@keyframes hero-zoom{from{transform:scale(1.055)}to{transform:scale(1)}}@keyframes slow-spin{to{transform:rotate(360deg)}}
@media(max-width:1200px){.shell{width:min(100% - 64px,1392px)}.desktop-nav{gap:18px}.desktop-nav a{font-size:11px}.brand{min-width:150px}.header-login{padding:11px 13px;font-size:11px;gap:7px}.hero{min-height:630px}.about-layout{gap:75px}.about-art-stamp{right:-15px}}
@media(max-width:960px){.desktop-nav,.header-login{display:none}.mobile-menu{display:block;margin-left:auto;position:relative}.mobile-menu summary{list-style:none;width:46px;height:43px;border:1px solid #d7e0e4;display:flex;justify-content:center;flex-direction:column;gap:6px;padding:10px;cursor:pointer}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu summary span{display:block;height:2px;width:100%;background:#193649}.mobile-menu nav{position:absolute;top:55px;right:0;width:min(320px,calc(100vw - 38px));background:#fff;box-shadow:0 16px 50px #1a3b552b;border:1px solid #e3e7ea;padding:10px;z-index:30;display:flex;flex-direction:column}.mobile-menu nav a{font-size:14px;padding:11px 14px;color:#15334a}.mobile-menu nav a:last-child{background:#0a273a;color:white;margin-top:4px}.about-layout{gap:45px}.about-copy h2{font-size:37px}.section-pad{padding:95px 0}.contact-graphic{right:-70px;opacity:.8}.footer-upper{flex-wrap:wrap}}
@media(max-width:690px){.shell{width:calc(100% - 38px)}.topline{height:28px}.topline-inner{font-size:8px;letter-spacing:1.2px}.topline-right{font-size:8px}.header-inner{height:70px}.brand-symbol{width:41px;height:41px}.brand-text strong{font-size:18px}.brand-text small{font-size:8px}.hero{height:auto;min-height:640px}.hero:before{background:linear-gradient(90deg,#03111deF,#061d2deB 50%,#061b2e8A),linear-gradient(0deg,#03111ce6,transparent 58%)}.hero-visual{background-position:58% center}.hero-main{min-height:640px;align-items:center}.hero-content{margin-top:-25px;padding-bottom:0}.kicker{font-size:9px;letter-spacing:1.8px;gap:8px}.kicker-line{width:20px}.hero-overline{margin-top:33px;letter-spacing:2px;font-size:9px}.hero h1{font-size:clamp(40px,11vw,57px);letter-spacing:-1.7px;line-height:1.25}.hero-deck{font-size:13px;line-height:2;max-width:410px;margin-top:19px}.desktop-break{display:none}.hero-actions{gap:9px;margin-top:27px}.button{gap:17px;min-height:49px;padding:12px 15px;font-size:12px}.hero-rule{margin-top:36px}.hero-meta{gap:14px;letter-spacing:1.1px;font-size:8px;flex-wrap:wrap}.hero-side-note,.hero-scroll{display:none}.hero-bottom{padding-left:19px;font-size:8px}.intro-strip .strip-inner{min-height:110px;gap:12px}.strip-tag{display:none}.strip-inner p{font-size:17px}.strip-inner>a{width:31px;height:31px}.section-pad{padding:72px 0}.about-layout{grid-template-columns:1fr;gap:67px}.about-art{width:calc(100% - 23px);max-height:500px}.about-art-stamp{width:128px;height:128px;right:-22px;bottom:-23px}.about-art-stamp strong{font-size:28px}.about-art-stamp span{font-size:10px}.about-art-stamp small{font-size:7px}.about-copy h2{font-size:clamp(31px,8.6vw,43px);margin-top:20px}.about-copy p{font-size:14px}.statement-inner{padding:87px 0}.statement-inner h2{font-size:clamp(32px,9vw,50px);letter-spacing:-.5px}.statement-inner p{font-size:10px;letter-spacing:2.5px}.statement-outline{font-size:300px;right:-15%;top:25%}.section-heading{display:block;margin-bottom:28px}.section-heading h2{font-size:clamp(30px,8.6vw,42px);margin-top:17px}.section-heading>p{margin-top:13px;font-size:12px}.principle-grid{grid-template-columns:1fr;gap:12px}.principle-card{min-height:255px;padding:26px 28px}.p-icon{margin-top:17px;width:62px;height:62px}.p-icon svg{width:39px;height:39px}.principle-card h3{font-size:23px;margin-top:15px}.principle-card p{font-size:13px}.news-feature{grid-template-columns:1fr}.news-image{min-height:240px}.news-content{padding:35px 26px 45px}.news-content h3{font-size:33px;margin:16px 0 12px}.news-content p{font-size:13px}.notice-bar{padding:17px;gap:14px}.notice-label{display:none}.contact-inner{min-height:470px}.contact-inner h2{font-size:clamp(34px,9.5vw,49px)}.contact-graphic{width:330px;height:330px;right:-145px;opacity:.4}.contact-letter{font-size:190px}.footer-upper{display:block;padding:43px 0 31px}.footer-upper p{margin:22px 0}.footer-links{flex-wrap:wrap;gap:12px 18px}.footer-bottom{display:block;font-size:8px}.footer-bottom span{display:block;margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
