:root{font-size:min(.1340482574vw,1.9303px);--navy:#002443;--navy2:#00345f;--blue:#075893;--cyan:#04a5e7;--ink:#184c75;--light:#eaf6fd;--muted:#597b99}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:12rem}body{margin:0;background:white;color:var(--ink);font:400 11rem/1.5 Noto,Arial,sans-serif}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer;color:inherit}button{border:0;background:none}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;object-fit:cover}h1,h2,h3,p,blockquote{margin:0}b,strong{font-weight:700}i[data-icon]{width:16rem;height:16rem;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-style:normal}i svg{display:block;width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2rem solid #08a8ed;outline-offset:3rem}.page{max-width:1440px;margin:auto;overflow:hidden;background:#fff}.container{width:680rem;max-width:calc(100% - 60rem);margin:auto}.button{display:inline-flex;align-items:center;justify-content:center;gap:9rem;background:linear-gradient(#069ce1,#0085cd);border:1rem solid #009fe5;color:#fff;border-radius:3rem;padding:6rem 17rem;font-size:11rem;font-weight:600;line-height:1.5;min-height:30rem;transition:background .2s,transform .2s}.button:hover{background:#058ddd;transform:translateY(-1rem)}.button i{width:13rem;height:13rem}.button.outline{border-color:#d1e2ed;background:#09253f60;min-width:100rem}.button.small{font-size:9rem;min-height:24rem;padding:3rem 18rem;background:linear-gradient(#076fa9,#00578f);border-color:#158cbd}.section-title{font-size:20rem;font-weight:700;line-height:1.25;letter-spacing:-.5rem}.section-sub{font-size:11rem;color:#4e7fa7;line-height:1.4}.micro{font-family:Noto,Arial,sans-serif;font-size:6.5rem;letter-spacing:1rem;line-height:1.6}.header{height:49rem;background:linear-gradient(115deg,#002344 30%,#004172 90%);color:#fff;position:relative;z-index:10}.header-inner{height:49rem;display:flex;align-items:center;gap:15rem}.brand{display:flex;align-items:center;gap:6rem;flex-shrink:0;width:187rem}.brand img{width:53rem;height:37rem;object-fit:contain;mix-blend-mode:screen}.brand b{font-size:7rem;white-space:nowrap;display:block}.brand small{font-size:6.3rem;white-space:nowrap;display:block;margin-top:3rem;letter-spacing:.05rem}.header-right{flex:1;align-self:stretch}.utility{display:flex;justify-content:flex-end;align-items:center;gap:12rem;height:20rem;color:#a7d4f1;font-size:7rem;padding-right:119rem;white-space:nowrap}.utility span,.utility a{display:flex;align-items:center;gap:4rem}.utility i{width:9rem;height:9rem;color:#68cdf3}.nav{height:29rem;display:flex;align-items:center;justify-content:space-between;gap:0}.nav>a{font-size:7.8rem;font-weight:500;padding:6rem 10rem;white-space:nowrap;border-left:1rem solid #4083a02a}.nav>a:first-child{border:0}.nav>a.active{border-bottom:2rem solid #14b7f6}.nav>a:not(.nav-cta):hover{color:#58d5ff}.nav>.nav-cta{font-size:9rem;min-height:25rem;padding:3rem 18rem;margin-left:10rem;border:1rem solid #087cb4;position:relative;top:-1rem}.menu-toggle,.mobile-nav{display:none}.hero{height:238rem;position:relative;color:#fff;isolation:isolate}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#001e35a8,transparent 68%);z-index:-2}.hero-content{position:relative;padding-top:45rem}.hero h1{font-size:29rem;line-height:1.3;font-weight:800;letter-spacing:-.6rem;color:#9de7ff;text-shadow:0 2rem 4rem #00284577}.hero h2{font-size:19.5rem;line-height:1.45;letter-spacing:-.3rem;font-weight:600}.hero-content>p{font-size:12rem;font-weight:500;color:#9feaff;margin-top:1rem}.hero-actions{display:flex;gap:10rem;margin-top:11rem}.hero-note{position:absolute;right:23rem;top:21rem;font-size:17rem;font-weight:600;line-height:1.2;color:#075c9e;transform:rotate(-13deg);font-style:italic;text-align:center;text-shadow:0 1rem 4rem white}.hero-note span{display:block;width:66rem;border-top:1rem solid #387eac;margin:8rem auto 0;transform:rotate(-4deg)}.hero-micro{position:absolute;right:18rem;bottom:9rem;color:#d9e9f1}.trust-strip{height:49rem;background:linear-gradient(90deg,#f5fbff,#eaf6fd);border-bottom:1rem solid #f1f7fb}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);height:100%;align-items:center;gap:12rem}.trust-grid>div{display:flex;gap:8rem;align-items:center;position:relative;min-width:0}.trust-grid>div:not(:last-child):after{content:"";position:absolute;right:-4rem;top:2rem;bottom:2rem;width:1rem;background:#d5e5ed}.round-icon{display:grid;place-items:center;width:36rem;height:36rem;background:#d7f0fc;border-radius:50%;flex-shrink:0;color:#027ab5}.round-icon i{width:24rem;height:24rem}.trust-grid b{display:block;font-size:10rem;line-height:1.3}.trust-grid small{display:block;font-size:7rem;color:#5a85aa;white-space:nowrap}.services{height:266rem;position:relative;isolation:isolate;overflow:hidden}.services-photo{position:absolute;inset:0 0 0 auto;width:65%;height:100%;object-position:center;z-index:-3}.services-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#eef8ff 0%,#f7fcff 31%,#f2faffec 36%,transparent 55%,#00395d22 74%,#003050 100%)}.services-inner{height:100%;display:flex;align-items:stretch;justify-content:space-between}.services-copy{padding-top:11rem;width:295rem}.services-copy h2{font-size:21rem;line-height:1.3;letter-spacing:-.5rem}.services-copy>p{font-size:11rem;color:#40799f}.service-list{display:flex;flex-direction:column;gap:5rem;margin-top:7rem}.service-list button{display:flex;align-items:center;gap:12rem;text-align:left;padding:0;width:100%;min-height:29rem}.service-list button>i{background:#cbeafa77;border:1rem solid #b4daee;color:#218bbe;width:25rem;height:25rem;padding:3rem;border-radius:3rem}.service-list b{font-size:10.5rem;display:block;line-height:1.3}.service-list small{font-size:8.5rem;display:block;color:#5c82a0;line-height:1.35}.service-list button:hover b{color:#039add}.services blockquote{align-self:flex-end;color:#c2efff;font-size:19rem;font-style:italic;font-weight:600;line-height:1.15;margin:0 0 15rem 0;max-width:207rem;text-align:center;text-shadow:0 2rem 3rem #002b4280}.services blockquote .micro{display:block;text-align:left;font-style:normal;margin:15rem 0 0 76rem;color:#65a1c5;font-weight:400;font-size:6.4rem;letter-spacing:.9rem;white-space:nowrap}.services blockquote em{display:block;border-top:1rem solid #266282;width:112rem;margin:11rem 0 0 auto;position:relative}.services blockquote em:before{content:"";position:absolute;top:-2rem;left:0;width:22rem;border-top:2rem solid #ffdc6c}
.systems{height:244rem;background:linear-gradient(90deg,#002b51f7,#00355fde),url('assets/office.webp') center right/cover;color:white;position:relative;padding-top:12rem}.systems .section-sub{color:#a5c9df}.system-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11rem;margin-top:7rem}.system-card>img{width:100%;height:84rem;border:1rem solid #81afce6b;object-fit:cover}.system-card h3{font-size:12rem;line-height:1.25;margin:5rem 3rem}.system-card ul{list-style:none;padding:0 0 0 3rem;margin:0 0 5rem;min-height:44rem;color:#c4e1f0;font-size:9rem;line-height:1.3}.system-card li{position:relative;padding-left:15rem;margin-bottom:4rem}.system-card li:before{content:'✓';position:absolute;left:0;color:#9bdef8;font-weight:700}.system-card .button{margin-left:3rem;font-size:8.5rem;min-height:23rem;padding-inline:17rem}.system-micro{position:absolute;bottom:9rem;right:21rem;color:#689fc5;font-size:6rem;letter-spacing:.7rem}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:5rem}.projects{height:242rem;padding-top:7rem;background:white}.projects .section-title{font-size:19rem}.projects .section-heading .button{align-self:flex-start;margin-top:3rem}.project-grid{display:grid;grid-template-columns:286fr 117fr 130fr 127fr;gap:7rem}.project-card{padding:0;text-align:left;border:1rem solid #e0e7ed;min-width:0;height:191rem;display:flex;flex-direction:column;background:#fff;transition:border-color .2s,box-shadow .2s}.project-card:hover{border-color:#50a9d1;box-shadow:0 4rem 12rem #00558818}.project-cover{width:100%;height:96rem;object-fit:cover}.project-copy{padding:6rem 7rem;flex:1;position:relative}.project-copy h3{font-size:10.5rem;line-height:1.35;font-weight:700}.project-copy p{font-size:10rem;line-height:1.3;margin-top:5rem;color:#25699d}.project-copy .place{position:absolute;left:7rem;bottom:7rem;font-size:7.5rem;color:#528199;display:flex;align-items:center;gap:2rem}.place i{width:8rem;height:9rem;color:#2a9ecc}.featured .project-cover{height:105rem}.featured .project-copy{padding:4rem 8rem;flex:none;height:41rem}.featured .project-copy h3{font-size:11rem}.featured .project-copy p{margin-top:1rem}.featured .place{left:auto;right:8rem;bottom:10rem}.project-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;padding:0 8rem 7rem;height:44rem}.project-thumbs img{width:100%;height:36rem}
.process{height:167rem;background:linear-gradient(110deg,#f6fbff 5%,#d3edffbc 55%,#ebf7fff5),url('assets/towers.webp') right center/cover;padding-top:11rem}.process .container{width:716rem;max-width:calc(100% - 30rem)}.process-title{display:flex;gap:15rem;align-items:center;padding-inline:20rem;margin-bottom:10rem}.process-title .section-title{font-size:18rem}.process-title p{font-size:11rem;color:#42789f}.process-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4rem;list-style:none;padding:0;margin:0}.process-grid li>img{width:100%;height:82rem;object-fit:cover;border:1rem solid #e2ecf1}.process-grid li>div{display:flex;gap:9rem;align-items:center;padding:7rem 9rem 0}.process-grid li>div>span{display:grid;place-items:center;border-radius:50%;width:21rem;height:21rem;flex-shrink:0;background:linear-gradient(130deg,#12a9df,#00699e);color:white;font-size:12rem;box-shadow:inset 1rem 1rem 2rem #ffffff85}.process-grid b{font-size:8.5rem;display:block;line-height:1.2}.process-grid small{font-size:7.6rem;display:block;white-space:nowrap;color:#527e9d}
.building-types{height:147rem;padding-top:7rem}.building-types .container{width:700rem;max-width:calc(100% - 46rem)}.building-types .section-title{font-size:18rem;margin:0 12rem 5rem}.building-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5rem}.building-grid article{position:relative;height:112rem;isolation:isolate;color:white;overflow:hidden;border:1rem solid #b1d1e7}.building-grid article img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;z-index:-2}.building-grid article:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(0deg,#003457ee,transparent);z-index:-1}.building-grid article>div{position:absolute;inset:auto 8rem 6rem}.building-grid h3{font-size:12rem;line-height:1.3;margin-bottom:3rem}.building-grid p{font-size:9rem;line-height:1.25}
.why-kp{height:80rem;background:linear-gradient(90deg,#00345c,#004578f0),url('assets/towers.webp') center right/cover;color:#fff}.why-kp .container{width:700rem;max-width:calc(100% - 46rem)}.why-grid{height:100%;display:grid;grid-template-columns:170rem repeat(5,1fr);align-items:center;gap:5rem}.why-title h2{font-size:16rem;line-height:1.3}.why-title p{font-size:12rem;color:#74d5fa;margin-top:3rem;line-height:1.55}.why-grid>div:not(:first-child){text-align:center}.why-grid>div>span{display:grid;place-items:center;margin:0 auto 5rem;width:29rem;height:29rem;border:1rem solid #027fba;background:radial-gradient(#126b9b,#004776);border-radius:50%;box-shadow:0 0 12rem #1a90c244;color:#9bdefc}.why-grid i{width:18rem;height:18rem}.why-grid b{font-size:7.7rem;display:block;line-height:1.4}.why-grid small{font-size:7.5rem;display:block;color:#a7d3eb;line-height:1.3}
.team-section{height:118rem;display:grid;grid-template-columns:300rem 208rem 182rem;gap:15rem;padding:0 16rem}.team-photos{display:grid;grid-template-columns:58% 42%;height:118rem;overflow:hidden;position:relative}.team-photos:after{content:'';position:absolute;inset:0 0 0 75%;background:linear-gradient(90deg,transparent,white)}.team-photos img{width:100%;height:118rem;object-fit:cover}.team-copy{align-self:center}.team-copy h2{font-size:14rem;line-height:1.4;letter-spacing:-.3rem;white-space:nowrap}.team-copy p{font-size:9rem;line-height:1.5;margin:5rem 0}.team-copy .button{min-height:22rem;font-size:8rem;padding-inline:15rem}.team-collage{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-self:center}.team-collage img{height:50rem;width:100%;object-fit:cover}
.editorial{height:147rem;padding-top:8rem}.editorial-grid{display:grid;grid-template-columns:224rem 1fr;gap:15rem}.editorial h2,.contact-grid h2{font-size:14rem;line-height:1.4;margin-bottom:5rem;letter-spacing:-.2rem}.video-thumb{position:relative;height:114rem;width:100%;color:white;padding:0;overflow:hidden}.video-thumb>img{height:100%;width:100%;object-fit:cover}.video-thumb:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#002434ed)}.play-icon{position:absolute;z-index:2;left:50%;top:43%;transform:translate(-50%,-50%);width:39rem;height:39rem;border:2rem solid white;border-radius:50%;display:grid;place-items:center;background:#152b3780;transition:background .2s}.play-icon i{width:23rem;height:23rem;margin-right:2rem}.video-thumb:hover .play-icon{background:#058cca}.video-caption{position:absolute;bottom:6rem;left:11rem;z-index:2;font-size:10rem;line-height:1.25;text-align:left}.article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7rem}.article-card{border:1rem solid #e5edf2;padding:0;text-align:left;height:114rem;display:flex;flex-direction:column;transition:border-color .2s}.article-card:hover{border-color:#64b6dc}.article-card>img{width:100%;height:47rem;object-fit:cover}.article-card h3{font-size:9.5rem;font-weight:600;line-height:1.25;padding:6rem 7rem 0}.article-card>span{display:flex;align-items:center;gap:3rem;font-size:8rem;color:#007caf;padding:4rem 7rem 5rem;margin-top:auto}.article-card>span i{width:10rem;height:10rem}
.contact-section{min-height:247rem;padding-top:8rem;padding-bottom:19rem}.contact-grid{display:grid;grid-template-columns:218rem 306rem 138rem;gap:11rem}.contact-grid>div,.contact-grid>aside{min-width:0}.faq details{border:1rem solid #e0e8ee;border-radius:3rem;margin-bottom:8rem;background:#fff;font-size:9rem}.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:6rem;min-height:25rem;padding:5rem 8rem;color:#435a6c;line-height:1.3}.faq summary::-webkit-details-marker{display:none}.faq summary i{width:9rem;height:9rem;flex-shrink:0;color:#7c8b9a;transition:transform .2s}.faq details[open] summary i{transform:rotate(45deg)}.faq details[open] summary{color:#006f9c;background:#f1faff}.faq details p{padding:5rem 9rem 9rem;line-height:1.65;font-size:9rem;color:#4b7795}.contact-form-wrap>p{font-size:8rem;margin-top:-4rem;color:#628098;margin-bottom:8rem}.form-row{display:grid;gap:10rem;margin-top:6rem}.form-row.three{grid-template-columns:1fr 1fr 1fr;gap:8rem}.form-row.two{grid-template-columns:96rem 1fr}.form-row label{font-size:7.5rem;color:#617a8d;display:block;min-width:0}.form-row label em{font-style:normal;color:#e77575}input,select,textarea{width:100%;min-width:0;border:1rem solid #d8e1e7;border-radius:3rem;background:#fff;color:#315b78;line-height:1.4;display:block;padding:3rem 5rem;font-size:9rem;box-shadow:inset 0 1rem 2rem #00243c05}input,select{height:19rem}select{font-size:7.5rem;padding-inline:4rem 0}textarea{resize:vertical;min-height:45rem}.message-row{grid-template-columns:1fr 140rem;gap:6rem;align-items:end}.message-row .upload-box{position:relative;display:flex;gap:5rem;align-items:center;background:#e8f4ff;border:1rem solid #c8e2f5;border-radius:3rem;height:45rem;padding:8rem 6rem;color:#1875ae;cursor:pointer;overflow:hidden}.upload-box:focus-within{outline:2rem solid #08a8ed;outline-offset:2rem}.upload-box input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.upload-box>i{background:white;border:1rem solid #dae8f0;padding:4rem;width:22rem;height:25rem;flex-shrink:0}.upload-box b{font-size:8rem;display:block}.upload-box small{font-size:5.5rem;display:block;line-height:1.4;overflow-wrap:anywhere}.upload-box>span{min-width:0}.submit-button{margin-top:8rem;width:100%;min-height:24rem!important;font-size:9rem!important}.form-error{font-size:8rem;color:#b82f3b;background:#fff4f4;padding:5rem;margin-top:5rem;border-radius:3rem}.form-hint{display:block;font-size:6.3rem;color:#7b91a3;text-align:center;margin-top:4rem}.contact-info h2{font-size:11rem;margin-top:2rem}.contact-info>a:not(.button),.contact-info>button,.contact-info>p{display:flex;gap:7rem;align-items:center;font-size:8rem;line-height:1.4;margin:4rem 0;padding:0;text-align:left;min-width:0}.contact-info i{height:13rem;width:13rem;color:#075e99;flex-shrink:0}.contact-info>[data-contact] i{color:#09bd60}.contact-info .contact-email{font-size:7.3rem;overflow-wrap:anywhere}.contact-info .contact-email span{min-width:0;overflow-wrap:anywhere}.contact-info .address{align-items:flex-start;font-size:7.7rem;line-height:1.35}.map-panel{height:61rem;margin-top:8rem;overflow:hidden;border:1rem solid #deebf1;border-radius:3rem;background:#edf6fb}.map-panel iframe{width:100%;height:100%;border:0}.map-button{width:100%;font-size:7.5rem!important;padding-inline:5rem!important;min-height:24rem!important;margin-top:4rem;gap:3rem!important}.map-button i{width:10rem;color:#fff}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.gallery-grid button{padding:0;border:1px solid #dbe9f2;border-radius:5px;overflow:hidden;text-align:left;display:block}.gallery-grid img{width:100%;height:140px;object-fit:cover}.gallery-grid h3{font-size:14px;margin:10px}.modal-actions{display:flex;flex-wrap:wrap;gap:10px}.modal-actions .button.secondary{background:#edf5fa;color:#176291;border-color:#b8d9e9}
.footer{height:115rem;color:#d1e4f1;background:linear-gradient(110deg,#002447,#001b34)}.footer-main{display:flex;align-items:center;gap:15rem;height:66rem}.footer-main .brand{width:207rem}.footer-main .brand img{width:60rem;height:47rem}.footer-main nav{display:flex;gap:0;align-items:center;flex:1;justify-content:center}.footer-main nav a{font-size:7rem;padding-inline:8rem;white-space:nowrap;border-right:1rem solid #316385}.footer-main nav a:last-child{border:0}.socials{display:flex;gap:11rem;align-items:center}.social{width:26rem;height:26rem;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.social.facebook{background:#007ef4;font-family:Arial,sans-serif;font-size:26rem;font-weight:700;padding-top:4rem}.social.line{background:#00c951;font-size:6rem;font-weight:800}.social.email{background:#0582bc}.social.email i{width:17rem;height:17rem}.footer-bottom{border-top:1rem solid #52728a66;padding-top:12rem;display:flex;align-items:flex-start;justify-content:space-between;gap:20rem;font-size:7rem;line-height:1.5}.footer-bottom p>span{display:block;font-size:6.5rem;color:#668da7;margin-top:4rem}.footer-bottom>p:last-child{font-size:7rem;white-space:nowrap;margin-top:1rem}.skip{position:fixed;left:15px;top:-60px;background:white;padding:8px 14px;z-index:100;font-size:15px}.skip:focus{top:8px}
dialog{font:400 15px/1.65 Noto,Arial,sans-serif;color:#184c75;border:1px solid #dceaf3;border-radius:12px;padding:30px;max-width:calc(100% - 32px);width:680px;max-height:88vh;overflow:auto;box-shadow:0 20px 80px #001a3b4d}dialog::backdrop{background:#001c38a3;backdrop-filter:blur(4px)}dialog h2{font-size:25px;line-height:1.4;margin-right:25px;margin-bottom:10px}dialog h3{font-size:18px;margin:18px 0 7px}dialog p{margin:10px 0;color:#567692}dialog ul{padding-left:22px;color:#567692}dialog .modal-close{position:absolute;top:10px;right:10px;width:35px;height:35px;border-radius:50%;background:#eef7fc;display:grid;place-items:center}dialog i[data-icon]{width:19px;height:19px}dialog .button{font-size:14px;min-height:42px;border-radius:4px;padding:8px 18px;margin-top:10px;gap:9px}dialog .modal-cover{width:100%;max-height:300px;object-fit:cover;border-radius:6px;margin:12px 0 18px}dialog .notice{padding:12px 15px;background:#f0f7fc;font-size:13px;border-radius:6px}dialog .review-list{display:grid;grid-template-columns:130px 1fr;gap:7px;border:1px solid #e2edf4;padding:15px;border-radius:7px;font-size:14px}dialog .review-list dt{font-weight:600}dialog .review-list dd{margin:0;overflow-wrap:anywhere}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#003458;color:white;border:1px solid #1777a9;border-radius:8px;padding:12px 22px;font-size:14px;z-index:100;width:max-content;max-width:calc(100% - 30px);text-align:center}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* === 1D1D: เพิ่มเติม (ไม่แตะดีไซน์ที่อนุมัติ) === */

/* เจ้าของสั่งแก้ 17/9/2569: หน้าเว็บต้องเต็มจอ ห้ามมีขอบขาวสองข้าง
   ของเดิม :root{font-size:min(.134vw,1.9303px)} + .page{max-width:1440px}
   = พอจอกว้างเกิน 1440px ดีไซน์หยุดขยาย แล้วเหลือแถบขาวข้างละ 240px (จอ 1920) ถึง 560px (จอ 2560)
   แก้โดยปล่อยให้หน่วย rem ขยายตามความกว้างจอต่อไป และถอดเพดานความกว้างของ .page ออก
   → สัดส่วนทุกชิ้นเท่าไฟล์ที่อนุมัติเป๊ะ เปลี่ยนแค่ "ขยายตามจอ" แทนที่จะ "หยุดแล้วเว้นขาว"
   → ที่ความกว้าง 1440px ลงมา ผลลัพธ์เหมือนเดิมทุกพิกเซล (design-check ยังเทียบผ่าน)
   ดู docs/ขออนุมัติแก้ดีไซน์.md ข้อ 7 */
:root { font-size: min(.1340482574vw, 3.4306px); }
.page { max-width: none; }

/* เจ้าของสั่งเพิ่ม 28/9/2569: แถบโลโก้แบรนด์เครื่องปรับอากาศที่จำหน่าย วางก่อนฟุตเตอร์
   เป็น "ส่วนใหม่" ที่ไฟล์ที่ลูกค้าอนุมัติไม่มี — ดู docs/ขออนุมัติแก้ดีไซน์.md ข้อ 8
   ใช้ token เดิมของดีไซน์ทั้งหมด (--light --ink --muted, .container, .section-title) */
.kp-brands { background: var(--light); padding: 30rem 0 32rem; text-align: center; }
.kp-brands .section-title { font-size: 16rem; }
.kp-brand-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 18rem 34rem; margin-top: 22rem; }
/* วางโลโก้บนการ์ดขาว — ไฟล์โลโก้ของแต่ละแบรนด์พื้นหลังไม่เหมือนกัน (บางอันขาว บางอันโปร่งใส)
   การ์ดขาวทำให้ทุกยี่ห้อดูเป็นชุดเดียวกัน และรองรับโลโก้ที่เจ้าของอัปเพิ่มทีหลังได้ทุกแบบ */
.kp-brand { display: inline-flex; align-items: center; justify-content: center;
  width: 124rem; height: 54rem; padding: 8rem 14rem; background: #fff; border-radius: 4rem;
  box-shadow: 0 1rem 3rem #0b3c611a; transition: box-shadow .25s, transform .25s; }
.kp-brand img { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.kp-brand:hover { transform: translateY(-2rem); box-shadow: 0 5rem 12rem #0b3c6126; }
a.kp-brand:focus-visible { box-shadow: 0 0 0 2rem var(--cyan); }

@media (max-width: 700px) {
  .kp-brands { padding: 26rem 0; }
  .kp-brands .section-title { font-size: 21rem; line-height: 1.35; }
  .kp-brand-row { gap: 12rem; margin-top: 20rem; }
  .kp-brand { width: 45%; max-width: 160rem; height: 62rem; padding: 10rem 14rem; }
}
@media (prefers-reduced-motion: reduce) {
  .kp-brand { transition: none; }
  .kp-brand:hover { transform: none; }
}