.photo.cms-replacement{object-fit:cover;display:block;width:100%;height:100%}.icon.cms-replacement{object-fit:contain}.cms-text{white-space:pre-line}.cms-preview [data-edit-key]{cursor:pointer}.cms-preview [data-edit-key]:hover{outline:2px dashed #008fee;outline-offset:3px}.cms-preview [data-edit-key].cms-selected{outline:3px solid #008fee;outline-offset:3px}.cms-preview .motion{opacity:1!important;transform:none!important}.cms-preview .carousel-track{transform:none!important}.cms-preview .hero-art,.cms-preview .expertise-art{z-index:0}.cms-preview .home-wash,.cms-preview .expertise-wash{z-index:1;pointer-events:none}.cms-preview .hero-inner,.cms-preview .expertise-inner{position:relative;z-index:2;pointer-events:none}.cms-preview .home-copy,.cms-preview .expertise-copy{pointer-events:auto}
html[data-cms-font] #app,html[data-cms-font] #app :is(h1,h2,h3,p,a,button,label,input,select,textarea,li,dt,dd,b,strong,small,span):not(.arrow):not(.cms-text){font-family:var(--cms-font-family)}

/* Feedback: align service cards and keep their headings in the same blue palette. */
.service-cards{align-items:stretch}
.service-card{display:grid;grid-template-columns:70px minmax(0,1fr);align-items:start;gap:18px;padding:22px;min-height:210px}
.service-side{align-self:stretch;gap:18px;justify-content:space-between}
.service-side .icon{width:58px;height:58px;color:#078be5}
.service-side .icon.cms-replacement{filter:brightness(0) saturate(100%) invert(30%) sepia(88%) saturate(1474%) hue-rotate(184deg) brightness(95%) contrast(108%)}
.service-number{line-height:1;font-size:38px}
.service-body{padding-top:0;align-self:start}
.service-body h2,.service-2 .service-body h2{font-size:clamp(18px,1.4vw,23px);line-height:1.35;color:#005da7;min-height:4.05em;margin:0 20px 12px 0;padding:0}
.service-body p{font-size:17px;line-height:1.6;margin:0;text-wrap:pretty}
.service-card .circle-arrow{top:22px;right:14px;color:#005da7;background:#e3f4ff}

/* The blue hover, keyboard focus and selected states use one treatment. */
.scope-nav a{transition:background-color .18s,color .18s;border-radius:4px}
.scope-nav a:hover,.scope-nav a:focus-visible,.scope-nav a.active{background:#edf8fe}
.scope-nav a:before{content:"";width:6px;position:absolute;left:-11px;top:0;bottom:0;background:#148acf;border-radius:4px;opacity:0;transition:opacity .18s}
.scope-nav a:hover:before,.scope-nav a:focus-visible:before,.scope-nav a.active:before{opacity:1}
.scope-nav a:focus-visible{outline:2px solid #148acf;outline-offset:3px}
.scope-intro h1,.scope-intro .section-heading{font-size:clamp(32px,3vw,50px);line-height:1.25;text-wrap:balance}

/* Two deliberate English lines; Thai body copy wraps naturally. */
.about-copy .about-heading-line{display:block;white-space:nowrap}
.about-copy>p:not(.eyebrow){max-width:48ch;line-height:1.75;text-wrap:pretty}
.about-copy h1,.about-copy .section-heading{font-size:clamp(28px,3vw,50px);line-height:1.16;letter-spacing:-.5px}
@media(max-width:1100px){
 .service-card{grid-template-columns:56px minmax(0,1fr);gap:14px;padding:18px}
 .service-side .icon{width:48px;height:48px}
 .service-body h2,.service-2 .service-body h2{font-size:18px;min-height:4.05em}
 .service-body p{font-size:16px}
 .about-copy h1,.about-copy .section-heading{font-size:clamp(26px,3.2vw,38px)}
}
@media(max-width:700px){
 .service-card{grid-template-columns:62px minmax(0,1fr);min-height:178px;padding:22px 18px;gap:18px}
 .service-number{font-size:35px}
 .service-side .icon{width:54px;height:54px}
 .service-body h2,.service-2 .service-body h2{font-size:21px;min-height:4.05em;margin-right:25px}
 .service-body p{font-size:17px;line-height:1.6}
 .scope-nav a{min-height:64px}
 .scope-intro h1,.scope-intro .section-heading{font-size:clamp(30px,8vw,42px);line-height:1.25}
 .about-copy{padding:30px 6%}
 .about-copy h1,.about-copy .section-heading{font-size:clamp(25px,7.1vw,46px);line-height:1.22;margin:16px 0}
 .about-copy h2:not(.section-heading){font-size:clamp(21px,5.5vw,28px);line-height:1.5}
 .about-copy>p:not(.eyebrow){font-size:17px;line-height:1.8;max-width:none}
}
@media(max-width:360px){.service-card{grid-template-columns:48px minmax(0,1fr);gap:14px;padding:18px 15px}.service-side .icon{width:44px;height:44px}.service-body h2,.service-2 .service-body h2{font-size:18px;margin-right:16px}.service-body p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.scope-nav a,.scope-nav a:before{transition:none}}

/* Reference enquiry composition: two independent image/content columns. */
.contact-section>.wide-container{max-width:1200px;width:92%}
.contact-section .page-label{font-size:15px;margin-bottom:12px}
.contact-grid{display:grid;grid-template-columns:minmax(0,38fr) minmax(0,62fr);gap:12px;align-items:stretch}
.contact-left,.contact-right{min-width:0;display:flex;flex-direction:column}
.contact-left{gap:12px}
.contact-aside{border-radius:0;padding:36px 26px 30px}
.contact-aside h1,.contact-aside .section-heading{font-size:clamp(34px,3.4vw,48px);line-height:1.08;letter-spacing:-.7px}
.contact-aside .yellow-rule{width:45px;height:4px;margin:23px 0}
.contact-aside h2:not(.section-heading){font-size:clamp(25px,2.4vw,33px);line-height:1.22;margin-bottom:26px}
.contact-line{gap:10px;min-width:0;margin-top:20px}
.contact-icon{width:36px;height:36px;border-width:1.5px}
.contact-icon .icon{width:20px;height:20px;stroke-width:2}
.contact-line>span:last-child{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 8px;min-width:0}
.contact-line b{display:inline;font-size:15px;white-space:nowrap}
.contact-line span>span{display:inline;font-size:12px;margin-top:0;overflow-wrap:anywhere}
.contact-line strong{font-size:18px;line-height:1.2;white-space:nowrap}
.contact-photo{display:block;border-radius:0;min-height:210px;height:auto;flex:1}
.contact-photo>.photo{position:absolute;inset:0;width:100%;height:100%}
.contact-banner{height:auto;aspect-ratio:2.2;overflow:hidden}
.contact-banner>.photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.contact-right .form-panel{border-radius:0;padding:24px 26px 0;flex:1}
.contact-section .form-steps{gap:14px;margin:0 auto 28px}
.contact-section .step{flex-direction:row;gap:10px;white-space:normal;align-items:center;flex:initial;text-align:left}
.contact-section .step>span{width:40px;height:40px;font-size:23px}
.contact-section .step b{font-size:14px;line-height:1.4}
.contact-section .form-steps>i{max-width:70px;flex:1;margin:0}
.contact-section .form-fields{gap:18px 22px}
.contact-section .form-fields label,.contact-section .upload-title{font-size:14px;line-height:1.5}
.contact-section input,.contact-section select,.contact-section textarea{font-size:13px;min-height:44px;padding:10px 12px;margin-top:8px;border-radius:2px}
.contact-section textarea{min-height:76px}
.contact-section .form-bottom{grid-template-columns:minmax(0,1fr) 145px;gap:16px;margin-top:16px;padding-bottom:0}
.contact-section .upload-title{margin-bottom:6px}
.contact-section .upload-box{min-height:56px;padding:10px 12px;gap:12px;border-radius:2px}
.contact-section .upload-box span{font-size:11px}
.contact-section .upload-box .icon{width:23px;height:23px;flex-shrink:0}
.contact-section .upload-box input{margin:0}
.contact-section .field-error:empty{display:none}
.contact-section .next-step{min-height:56px;padding:10px 16px;font-size:20px;border-radius:2px}
@media(max-width:850px){
 .contact-grid{grid-template-columns:minmax(0,1fr);gap:18px}
 .contact-left{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .contact-aside{padding:28px 22px}.contact-photo{min-height:260px}
 .contact-banner{aspect-ratio:2.5}
 .contact-right .form-panel{padding:24px}
}
@media(max-width:550px){
 .contact-left{display:flex}.contact-photo{min-height:190px;height:190px;flex:auto}
 .contact-right .form-panel{padding:22px 16px}
 .contact-section .form-fields{grid-template-columns:minmax(0,1fr);gap:16px}
 .contact-section .form-bottom{grid-template-columns:minmax(0,1fr);gap:14px}
 .contact-section .form-steps{gap:8px}.contact-section .step{gap:7px}
 .contact-section .step>span{width:32px;height:32px;font-size:20px}
 .contact-section .step b{font-size:12px}.contact-section .form-steps>i{max-width:20px}
}
