@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai+Looped:wght@500;600&display=swap&text=%E0%B9%84%E0%B8%97%E0%B8%A2');

.l-util .lang-switch{ display:flex !important; align-items:center; gap: 2px !important; margin: 0 !important; }
html .site-header .l-util .lang-btn{ display:inline-flex !important; align-items:center; gap: 6px !important; padding: 4px 8px !important; border: 0 !important; border-radius: 4px !important; background: transparent !important; box-shadow:none !important;
  color: var(--l-mute) !important; font-size: 12px !important; font-weight: 500 !important; line-height: 1 !important; letter-spacing: .01em !important; text-decoration:none !important; }
html .site-header .l-util .lang-btn span{ color: inherit !important; }
html .site-header .l-util .lang-btn svg, .l-mlang .lang-btn svg{ display:block !important; width: 15px !important; height: 10px !important; border-radius: 1.5px; box-shadow: 0 0 0 1px rgba(20,26,35,.10); opacity: .9; }
html .site-header .l-util .lang-btn:hover{ color: var(--l-navy) !important; background: var(--l-tint) !important; }
html .site-header .l-util .lang-btn.active{ color: var(--l-navy) !important; font-weight: 600 !important; }
html .site-header .l-util .lang-btn.active svg{ opacity:1; }
.l-mlang-item{ display:none; }


.site-header .logo-area a{ display:flex !important; align-items:center !important; gap: 8px !important; text-decoration:none; }
.site-header .logo-img{ display:block; flex: 0 0 auto; }
.site-header .logo-text{ display:block !important; padding: 1px 0 1px 8px !important; margin:0 !important; line-height: 1.18 !important; font-weight: 600 !important; }
.site-header .logo-text span{ display:block !important; margin: 4px 0 0 !important; line-height: 1 !important; }

@media (min-width: 1101px){
  .site-header{ grid-template-columns: auto 1fr auto !important; grid-template-rows: 30px 66px; height: auto !important; column-gap: 0 !important; }
  .site-header .l-util{ grid-column: 1 / -1; grid-row: 1; display:flex; justify-content:flex-end; align-items:center; gap: 0; border-bottom: 1px solid var(--l-line); }
  .site-header .logo-area{ grid-row: 2 !important; }
  .site-header .main-nav{ grid-row: 2 !important; justify-self: end !important; margin-left: 24px !important; margin-right: 18px !important; }
  .site-header .header-right{ grid-row: 2 !important; }
  .site-header .main-nav .nav-item.l-home-item{ display:none !important; }
  .site-header .main-nav .nav-inner{ gap: 4px !important; }
  .site-header .nav-link{ padding: 23px 10px !important; }
  .site-header .main-nav .nav-item:first-child + .nav-item .nav-link{ padding-left: 10px !important; }
  .site-header .logo-text{ display:block !important; font-size: 13px !important; }
  .site-header .logo-img{ width: 42px !important; height: 42px !important; }
  html[lang="th"] .site-header .logo-text{ font-size: 12.5px !important; line-height: 1.22 !important; }
  html[lang="zh-Hans"] .site-header .logo-text{ font-size: 14px !important; line-height: 1.25 !important; letter-spacing: .04em !important; }
}
@media (min-width: 1101px) and (max-width: 1340px){
  .site-header .main-nav{ margin-right: 14px !important; }
  .site-header .nav-link{ padding-left: 8px !important; padding-right: 8px !important; }
}

@media (max-width: 1100px){
  .site-header .l-util{ display:none !important; }
  .main-nav.nav-open{ background: #fff !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; max-height: calc(100vh - 72px); overflow-y: auto; box-shadow: 0 16px 30px -18px rgba(20,26,35,.35); }
  .main-nav.nav-open .l-mlang-item{ display:flex; align-items:center; justify-content:space-between; gap: 12px; padding: 12px 20px; border-bottom: 1px solid var(--l-line); background: var(--l-tint); }
  .l-mlang{ display:flex !important; gap: 4px !important; margin:0 !important; }
  html .l-mlang .lang-btn{ display:inline-flex !important; align-items:center; gap: 6px !important; padding: 7px 9px !important; border: 1px solid transparent !important; border-radius: 6px !important; background: transparent !important;
    color: var(--l-text) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1 !important; }
  html .l-mlang .lang-btn span{ color: inherit !important; }
  html .l-mlang .lang-btn.active{ border-color: var(--l-line2) !important; background:#fff !important; color: var(--l-navy) !important; font-weight: 600 !important; }
  .main-nav.nav-open .nav-item:not(.open):not(:hover) .nav-dropdown{ padding:0 !important; border:0 !important; }
  .main-nav.nav-open .nav-link{ padding-top: 14px !important; padding-bottom: 14px !important; }
}



main h1, main h2, main h3, .l-head h1{ text-wrap: balance; }
html[lang="th"] main h1, html[lang="th"] main h2, html[lang="th"] main h3, html[lang="th"] main p{ text-wrap: wrap; }  
main p{ text-wrap: pretty; }

main .btn-p, .l-cform .btn-p, .l-x-go, .l-pgo{ box-sizing:border-box !important; min-height: 48px !important; display:inline-flex !important; align-items:center; justify-content:flex-start; padding-top: 0 !important; padding-bottom: 0 !important; line-height: 1.2 !important; }
.l-pb .btn-o, .l-pb .btn-nom{ box-sizing:border-box !important; min-height: 40px !important; display:inline-flex !important; align-items:center; padding-top: 0 !important; padding-bottom: 0 !important; }

.site-footer .logo-area a, .site-footer .footer-brand > a:first-child{ display:flex; align-items:center; gap: 12px; }
.site-footer .logo-text{ display:block; padding: 1px 0 1px 8px !important; margin: 0 !important; line-height: 1.18 !important; }
.site-footer .logo-text span{ display:block !important; margin: 4px 0 0 !important; line-height: 1 !important; }
@media (max-width: 700px){
  
  .site-header .header-top{ padding-left: 20px !important; padding-right: 20px !important; }
  .main-nav.nav-open .nav-link{ padding-left: 20px !important; padding-right: 20px !important; }
  .main-nav.nav-open .l-mlang-item{ padding-left: 11px !important; padding-right: 20px !important; }
  .main-nav.nav-open .nav-dropdown a{ padding-left: 36px !important; }
  html body .site-footer{ padding-left: 0 !important; padding-right: 0 !important; }
  html body .site-footer .footer-inner, html body .site-footer .footer-bottom{ width: calc(100% - 40px) !important; max-width:none !important; margin-left:auto !important; margin-right:auto !important; padding-left: 0 !important; padding-right: 0 !important; }
  html body .site-footer .footer-bottom{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; }
  .site-footer .footer-bottom, .site-footer .footer-bottom *{ text-align: left !important; justify-content: flex-start !important; margin-left:0 !important; }
}
main .btn-p, .l-cform .btn-p{ width:auto !important; align-self:flex-start !important; }  


.g-sheet{ background: #942525 !important; }

html.g-in body::after{ background: #942525 !important; }
html.g-in body::before{ content:''; position: fixed; inset: -10vh -20vw; z-index: 10000; pointer-events:none; transform: translateX(125%);
  background: url('/assets/logo-cacap-badge.svg') center / var(--lsw-b,194px) var(--lsw-b,194px) no-repeat;
  animation: lsweepc .48s cubic-bezier(.65,0,.35,1) backwards; }
@keyframes lsweepc{ 0%,20%{ transform: translateX(0); } 100%{ transform: translateX(125%); } }
@media (prefers-reduced-motion: reduce){ html.g-in body::before{ display:none !important; } }
@media (max-width: 700px){
  .g-sheet img{ width: 130px !important; height: 130px !important; }
  html.g-in body::before{ --lsw-b: 130px; }
}

.lang-btn[hreflang="th"] span{ font-family: 'Noto Sans Thai Looped', 'Noto Sans Thai', sans-serif !important; font-size: 13px !important; letter-spacing: 0 !important; }
html .l-mlang .lang-btn[hreflang="th"] span{ font-size: 14px !important; }

.site-footer .footer-brand > div:first-child{ gap: 8px !important; }

@media (min-width: 1101px){
  .site-header .main-nav .nav-item.has-dropdown:nth-last-child(-n+3) .nav-dropdown{ left: auto !important; right: 0 !important; }
}

.l-sheet-top{ flex-wrap: wrap; row-gap: 8px; }
.l-sheet-top .l-chip, .l-sheet-top .l-replay{ white-space: nowrap; flex: 0 0 auto; }
.l-sheet-top .l-sheet-no{ flex: 1 1 0; min-width: 8em; }
.l-nb{ white-space: nowrap; }


.l-mbtns{ display:none; }
@media (min-width: 1101px){ html .site-header .header-right .btn-nom{ display:inline-flex !important; } }
html .l-mbtns .btn-nom{ display:inline-flex !important; }
.site-header .header-right{ display:flex !important; align-items:center !important; gap: 10px !important; }
html .site-header .header-right .btn-nom, html .l-mbtns .btn-nom{ box-sizing:border-box !important; align-items:center !important; justify-content:center; height: 38px !important; min-height: 38px !important; padding: 0 16px !important; border-radius: 6px !important; border: 1.5px solid var(--l-navy, #1F3A5F) !important; font-size: 13.5px !important; font-weight: 600 !important; line-height: 1 !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap !important; text-decoration: none !important; }
html .site-header .header-right .btn-nom.l-portal-btn, html .l-mbtns .l-portal-btn{ background: #fff !important; color: var(--l-navy, #1F3A5F) !important; padding: 0 14px 0 12px !important; }
html .site-header .header-right .btn-nom.l-portal-btn:hover, html .l-mbtns .l-portal-btn:hover{ background: var(--l-tint, #F3F5F8) !important; }
.l-portal-btn::before{ content:''; display:inline-block; flex: 0 0 auto; width: 11px; height: 13px; margin-right: 7px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 13'%3E%3Cpath d='M2 5.5V3.75a3.5 3.5 0 017 0V5.5h.5A1.5 1.5 0 0111 7v4.5A1.5 1.5 0 019.5 13h-8A1.5 1.5 0 010 11.5V7a1.5 1.5 0 011.5-1.5zm1.5 0h4V3.75a2 2 0 00-4 0z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 13'%3E%3Cpath d='M2 5.5V3.75a3.5 3.5 0 017 0V5.5h.5A1.5 1.5 0 0111 7v4.5A1.5 1.5 0 019.5 13h-8A1.5 1.5 0 010 11.5V7a1.5 1.5 0 011.5-1.5zm1.5 0h4V3.75a2 2 0 00-4 0z'/%3E%3C/svg%3E") no-repeat center/contain; }
@media (max-width: 1100px){
  .site-header .header-right .l-portal-btn{ display:none !important; }
  .main-nav.nav-open .l-mbtns{ display:flex; gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--l-line); background:#fff; }
  .main-nav.nav-open .l-mbtns .btn-nom{ flex: 1 1 0; height: 44px !important; min-height: 44px !important; padding: 0 10px !important; font-size: 14px !important; }
  .main-nav.nav-open .l-mlang-item{ justify-content: flex-start !important; }
}
@media (min-width: 1341px){ .site-header .nav-link{ padding-left: 9px !important; padding-right: 9px !important; } }

@media (min-width: 1101px) and (max-width: 1240px){
  html .site-header .header-right .btn-nom.l-portal-btn{ width: 38px !important; padding: 0 !important; font-size: 0 !important; }
  html .site-header .header-right .btn-nom.l-portal-btn::before{ margin: 0 !important; width: 13px; height: 15px; }
  html .site-header .header-right .btn-nom:not(.l-portal-btn){ padding: 0 14px !important; }
}
html .l-mbtns .l-mnom{ background: #1F3A5F !important; border-color: #1F3A5F !important; color: #fff !important; opacity: 1 !important; }
html .l-mbtns .l-mnom:hover{ background: #172E4C !important; }
.g-sheet{ background: transparent !important; transform: translateX(-125%) !important; }
.g-sheet::before{ content:''; position:absolute; inset:0; background:#942525; transform: skewX(-5deg); }
.g-sheet.go{ transform: translateX(0) !important; }
.g-sheet img{ position: relative; width: 194px !important; height: 194px !important; transform: none !important; }
@media (max-width: 700px){ .g-sheet img{ width: 130px !important; height: 130px !important; } }

/* r11: phone footer rule spans the content width (was inset 20px each side) */
@media (max-width: 700px){ html body .site-footer .footer-bottom{ background-size: 100% 1px !important; } }