/* GENERATED by make_scap_banners.py from scap.co.th's site.css: only the rules its two home banners use,
   classes renamed sx-*, variables --sx-*. Do not edit by hand; re-run the script. */
.sx-banner {
    --sx-navy:#0A2D63; --sx-navy-deep:#061D40; --sx-navy-soft:#1B4488;
    --sx-gold:#F2B544; --sx-gold-deep:#E0962A;
    --sx-ink:#0E2146; --sx-muted:#5B6B86; --sx-line:#DFE6F1;
    --sx-bg:#F4F7FB; --sx-card:#FFFFFF;
    --sx-red:#D5322A; --sx-red-soft:#FFF3F2; --sx-line-green:#06C755;
    --sx-head:"Prompt","Noto Sans Thai",Tahoma,sans-serif;
    --sx-body:"Noto Sans Thai",Tahoma,sans-serif;
    --sx-radius:10px;
    color-scheme:light;
  }
.sx-banner { position: absolute; inset: 0; overflow: hidden; font-family: var(--sx-body); color: var(--sx-ink); text-align: left; line-height: 1.5; }
.sx-banner h1, .sx-banner h2, .sx-banner p, .sx-banner ul { margin: 0; padding: 0; letter-spacing: normal; }
.sx-banner h1, .sx-banner h2 { font-family: var(--sx-head); color: inherit; font-weight: 600; line-height: 1.3; overflow-wrap: normal; }   /* our site-wide navy h1/h2 must not leak in */
.sx-banner a { text-decoration: none; }
.sx-banner .sx-wrap {max-width:1180px;margin-inline:auto;padding-inline:20px}
.sx-banner .sx-icon {width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sx-banner .sx-btn {display:inline-flex;align-items:center;gap:.55em;font-family:var(--sx-head);font-weight:500;font-size:14.5px;padding:.6em 1.3em;border-radius:7px;border:1.5px solid transparent;cursor:pointer;background:transparent;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.sx-banner .sx-btn:hover {transform:translateY(-1px)}
.sx-banner .sx-btn-gold {background:linear-gradient(180deg,var(--sx-gold),var(--sx-gold-deep));color:var(--sx-navy-deep);box-shadow:0 6px 18px -8px rgba(224,150,42,.8)}
.sx-banner .sx-btn-ghost {border-color:rgba(255,255,255,.75);color:#fff;background:transparent}
.sx-banner .sx-btn-ghost:hover {background:rgba(255,255,255,.1)}
.sx-banner .ph .sx-icon {width:28px;height:28px;stroke-width:1.4}
.sx-banner .nav-actions .sx-btn {padding:.45em 1.1em;font-size:14px}
.sx-banner .sx-hero {position:relative;background:var(--sx-navy-deep);color:#fff;overflow:hidden;isolation:isolate}
.sx-banner .sx-hero-media {position:absolute;inset:0;z-index:-2}
.sx-banner .sx-hero-media .ph {height:100%}
.sx-banner .sx-hero-media img {width:100%;height:100%;object-fit:cover;object-position:68% 30%}
.sx-banner .sx-hero::before {content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(90deg,rgba(6,28,64,.95) 18%,rgba(6,28,64,.8) 34%,rgba(6,28,64,.25) 50%,rgba(6,28,64,0) 62%)}
.sx-banner .sx-hero-inner {padding-block:38px 34px;display:grid;gap:16px;max-width:540px}
.sx-banner .sx-eyebrow {font-family:var(--sx-head);font-size:14.5px;color:#C9D7EE;letter-spacing:.02em}
.sx-banner .sx-hero h1 {font-size:clamp(28px,2.75vw,40px);font-weight:500;line-height:1.32}
.sx-banner .sx-hero h1 em {font-style:normal;color:var(--sx-gold)}
.sx-banner .sx-hero-lede {color:#D6E1F2;font-size:15px;max-width:44ch}
.sx-banner .sx-hero-cta {display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.sx-banner .sx-hero-stats {display:flex;flex-wrap:wrap;gap:12px 0;margin-top:6px}
.sx-banner .sx-stat {display:flex;align-items:center;gap:10px;padding-inline:18px;border-left:1px solid rgba(255,255,255,.25)}
.sx-banner .sx-stat:first-child {padding-left:0;border-left:0}
.sx-banner .sx-stat-ic {width:40px;height:40px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);display:grid;place-items:center;color:#fff}
.sx-banner .sx-stat-ic .sx-icon {width:22px;height:22px}
.sx-banner .sx-stat p {font-size:12.5px;line-height:1.4;color:#D6E1F2}
.sx-banner .sx-stat strong {display:block;font-family:var(--sx-head);font-size:14px;font-weight:500;color:#fff}
.sx-banner .sx-hero-script {position:absolute;right:3%;top:7%;width:clamp(220px,22vw,330px);height:auto;max-width:none;pointer-events:none}
.sx-banner .loan-badge .sx-icon {width:22px;height:22px}
.sx-banner .checks .sx-icon {width:16px;height:16px;color:var(--sx-navy);background:#fff;border-radius:50%;padding:3px;stroke-width:3}
.sx-banner .gov-main .sx-btn {justify-self:start;margin-top:6px;font-size:13.5px;padding:.5em 1.1em}
.sx-banner .step-ic .sx-icon {width:20px;height:20px}
.sx-banner .why-ic .sx-icon {width:24px;height:24px}
.sx-banner .quote .sx-btn {justify-self:start;padding:.4em 1em;font-size:12.5px;border-radius:999px}
.sx-banner .faq-intro .sx-btn {justify-self:start;margin-top:8px;padding:.35em 1em;font-size:12.5px;border-radius:999px}
@media (max-width:1180px) {
  .sx-banner .sx-hero-script {right:1.5%;top:5%;width:clamp(170px,21vw,240px)}
}
@media (max-width:1060px) {
  .sx-banner .has-sub > a .sx-icon {display:none}
}
@media (max-width:920px) {
  .sx-banner .sx-hero-script {position:relative;right:auto;top:auto;display:block;width:190px;margin:24px 0 0 20px;filter:brightness(0) invert(1);opacity:.92}
  .sx-banner .sx-hero-inner {padding-top:14px}
  .sx-banner .sx-hero-media {inset:0}
  .sx-banner .sx-hero::before {background:linear-gradient(90deg,rgba(6,28,64,.94) 40%,rgba(6,28,64,.6))}
  .sx-banner .sx-stat {padding-inline:0 16px;border-left:0}
}
@media (max-width:640px) {
  .sx-banner .sx-wrap {padding-inline:16px}
  .sx-banner .nav-actions .sx-btn-gold {padding:.45em .9em;font-size:13.5px}
  .sx-banner .has-sub > a .sx-icon {display:none}
  .sx-banner .sx-hero-inner {padding-block:44px 40px}
}
.sx-banner .page-hero .sx-wrap {position:relative;z-index:2;width:100%;display:grid;grid-template-columns:minmax(0,52%) 1fr;gap:28px;align-items:center;padding-block:34px}
.sx-banner .page-hero .sx-btn {font-size:14px;padding:.55em 1.2em}
.sx-banner .chips .sx-icon {width:16px;height:16px;color:#fff;background:var(--sx-gold);border-radius:50%;padding:3.5px;stroke-width:3.5}
.sx-banner .hero-feats .sx-icon {width:24px;height:24px;color:var(--sx-gold-deep)}
.sx-banner .feature-strip .sx-wrap {display:flex;flex-wrap:wrap;gap:18px 30px;padding-block:18px}
.sx-banner .feat-ic .sx-icon {width:22px;height:22px}
.sx-banner .flow-intro .sx-btn {margin-top:14px}
.sx-banner .flow-ic .sx-icon {width:26px;height:26px}
.sx-banner .req .sx-icon {width:32px;height:32px;flex:none;color:var(--sx-navy);background:#FDF3DE;border-radius:8px;padding:6px}
.sx-banner .side-cta .sx-btn {justify-self:start}
.sx-banner .fraud-strip .sx-icon {width:20px;height:20px;color:var(--sx-red)}
.sx-banner .fraud-strip .sx-btn {margin-left:auto;padding:.35em 1em;font-size:12.5px}
@media (max-width:1080px) {
  .sx-banner .feature-strip .sx-wrap {gap:14px 20px}
}
@media (max-width:640px) {
  .sx-banner .feature-strip .sx-wrap {gap:12px 16px}
  .sx-banner .fraud-strip .sx-btn {margin-left:0}
}
.sx-banner .cover-body b .sx-icon {width:30px;height:30px;padding:5px;background:#FDF3DE;border-radius:8px;flex:none}
.sx-banner .panel-navy .mini .sx-icon {width:30px;height:30px;color:var(--sx-gold)}
.sx-banner .calc-out .sx-btn {margin-top:10px;justify-self:start}
.sx-banner .stat-band .sx-icon {width:30px;height:30px;color:var(--sx-gold)}
.sx-banner .value .sx-icon {width:52px;height:52px;padding:12px;border-radius:50%;background:#FDF3DE;color:var(--sx-navy)}
.sx-banner .channel .sx-icon {width:38px;height:38px;padding:8px;border-radius:50%;background:#FDF3DE;color:var(--sx-navy)}
.sx-banner .warn-panel h2 .sx-icon {width:34px;height:34px;color:var(--sx-gold)}
.sx-banner .warn-panel li .sx-icon {width:17px;height:17px;color:var(--sx-navy);background:var(--sx-gold);border-radius:50%;padding:3px;stroke-width:3.5;flex:none;margin-top:2px}
.sx-banner .warn-panel .sx-btn {justify-self:start}
.sx-banner .doc-list .sx-icon {width:30px;height:30px;padding:6px;border-radius:8px;background:#FDF3DE;color:var(--sx-navy);flex:none}
.sx-banner .job h3 .sx-icon {width:34px;height:34px;padding:7px;border-radius:8px;background:#FDF3DE;flex:none}
.sx-banner .consent .sx-btn {padding:.45em 1.2em;font-size:13.5px}
.sx-banner .page-hero.dark .sx-wrap {padding-block:36px}
.sx-banner .page-hero.dark .hero-feats .sx-icon {color:var(--sx-gold)}
.sx-banner .hero-search .sx-icon {width:20px;height:20px;color:var(--sx-muted);flex:none}
.sx-banner .hero-search .sx-btn {flex:none}
.sx-banner .faq-tab .sx-icon {width:22px;height:22px;flex:none;color:var(--sx-navy)}
.sx-banner .faq-tab[aria-selected="true"] .sx-icon {color:var(--sx-gold)}
@media (max-width:620px) {
  .sx-banner .mm-actions .sx-btn {display:inline-flex;justify-content:center;width:100%;padding:.72em 1em;font-size:14.5px}
  .sx-banner .mm-call .sx-icon {width:16px;height:16px;color:var(--sx-navy)}
}
@media (max-width:980px) {
  .sx-banner .page-hero .sx-wrap {width:auto}
  .sx-banner .page-hero .sx-wrap {grid-template-columns:1fr;gap:0;padding-block:22px}
}
.sx-banner .form-ok .sx-icon {width:18px;height:18px;flex:none;color:#3E8B4C}
.sx-banner .form-result h2 .sx-icon {width:22px;height:22px;color:#3E8B4C}
.sx-banner .doc-choice .sx-icon {width:34px;height:34px;padding:7px;border-radius:9px;background:#FDF3DE;color:var(--sx-navy);flex:none}
.sx-banner .crumbs .sx-wrap {display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sx-banner .prose .check .sx-icon {width:18px;height:18px;flex:none;color:#fff;background:var(--sx-navy);border-radius:50%;padding:4px;stroke-width:3}
.sx-banner .prose .sources .sx-icon {width:15px;height:15px}
.sx-banner .key-list .sx-icon {width:16px;height:16px;flex:none;margin-top:2px;color:#fff;background:var(--sx-gold-deep);border-radius:50%;padding:3px;stroke-width:3}
.sx-banner .tor-band .sx-tor-logo {width:180px;height:auto;display:block}
.sx-banner .sx-btn-tor {background:linear-gradient(180deg,#3ee0f5,#13c6e4);color:#032530;box-shadow:0 0 22px rgba(34,211,238,.3)}
.sx-banner .sx-btn-tor:hover {background:#67E8F9;color:#032530;transform:translateY(-1px)}
.sx-banner .tor-aside .sx-tor-logo {width:150px;height:auto;display:block;margin-bottom:2px}
@media (max-width:860px) {
  .sx-banner .tor-band .sx-tor-logo {width:150px}
  .sx-banner .tor-band .sx-btn-tor {justify-self:start}
}
.sx-banner .hero-slider>.sx-hero {grid-area:1/1;transition:opacity .8s ease,visibility .8s}
.sx-banner .hero-slider>.sx-hero:not(.sx-is-on) {opacity:0;visibility:hidden}
.sx-banner .hero-slider .sx-hero-inner {padding-bottom:52px}
.sx-banner .sx-hero-tor {background:radial-gradient(ellipse 60% 70% at 72% 40%,rgba(14,116,144,.22),transparent 70%),
  radial-gradient(ellipse 50% 60% at 20% 110%,rgba(45,212,191,.10),transparent 70%),#071426;color:#DCE6F5}
.sx-banner .sx-hero-tor::before {display:none}
.sx-banner .sx-hero-tor .sx-tor-logo {width:112px;height:auto;margin-bottom:2px}
.sx-banner .sx-hero-tor h2 {font-size:clamp(34px,3.4vw,52px);font-weight:700;line-height:1.2;letter-spacing:-.5px;color:#fff;margin:0}
.sx-banner .sx-g-new {background:linear-gradient(180deg,#5eead4,#10b981);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-banner .sx-g-first {background:linear-gradient(180deg,#a5f3fc,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-banner .sx-hero-tor .sx-hero-lede {color:#DBE4EF;font-size:16.5px;max-width:44ch}
.sx-banner .sx-hero-tor .sx-wrap {max-width:none;display:grid;grid-template-columns:minmax(450px,1fr) auto auto;grid-template-areas:"copy map radar";
  align-items:center;column-gap:64px;padding-left:max(20px,calc((100% - 1180px) / 2 + 20px));padding-right:max(20px,calc((100% - 1400px) / 2 + 20px))}
.sx-banner .sx-hero-tor .sx-hero-inner {grid-area:copy}
.sx-banner .sx-tor-mapbox {grid-area:map;padding-block:20px 44px}
.sx-banner .sx-tor-scan {position:relative;width:240px}
.sx-banner .sx-tor-map {width:100%;height:auto;display:block;overflow:visible}
.sx-banner .sx-tor-scan .sx-radar-big {position:absolute;left:-20%;top:4.8%;width:126%;aspect-ratio:1;border-radius:50%;pointer-events:none}
.sx-banner .sx-tor-scan .sx-radar-big svg {position:absolute;inset:0;width:100%;height:100%}
.sx-banner .sx-tor-tag {position:absolute;left:50%;top:72%;width:170px;height:auto;pointer-events:none}
.sx-banner .sx-map-dot .sx-core {fill:currentColor;filter:drop-shadow(0 0 6px currentColor);stroke:rgba(255,255,255,.55);stroke-width:3}
.sx-banner .sx-map-dot:hover .sx-core {stroke:#fff;stroke-width:5}
.sx-banner .sx-map-dot .sx-halo, .sx-banner .sx-map-dot .sx-halo2 {fill:currentColor;transform-box:fill-box;transform-origin:center;animation:sx-torDot 5s ease-out infinite}
.sx-banner .sx-map-dot .sx-halo {opacity:.12}
.sx-banner .sx-map-dot .sx-halo2 {opacity:.28;animation-name:sx-torDot2}
.sx-banner .sx-tor-map a:nth-of-type(1) circle {animation-duration:4.6s;animation-delay:-.4s}
.sx-banner .sx-tor-map a:nth-of-type(2) circle {animation-duration:5.8s;animation-delay:-2.9s}
.sx-banner .sx-tor-map a:nth-of-type(3) circle {animation-duration:5.1s;animation-delay:-1.6s}
.sx-banner .sx-tor-map a:nth-of-type(4) circle {animation-duration:6.4s;animation-delay:-4.2s}
.sx-banner .sx-tor-map a:nth-of-type(5) circle {animation-duration:4.9s;animation-delay:-3.3s}
.sx-banner .sx-tor-map a:nth-of-type(6) circle {animation-duration:6.9s;animation-delay:-.9s}
.sx-banner .sx-tor-radar {grid-area:radar;display:block;max-width:360px;color:#E2E8F0;padding-block:20px 44px}
.sx-banner .sx-radar-big .sx-sweep {position:absolute;inset:5%;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 74%,rgba(34,211,238,.08) 82%,rgba(45,212,191,.5) 100%);animation:sx-torSpin 6s linear infinite}
.sx-banner .sx-radar-big .sx-sweep::after {content:"";position:absolute;left:calc(50% - 1px);top:0;width:2px;height:50%;border-radius:1px;
  background:linear-gradient(to top,rgba(153,246,228,.25),rgba(153,246,228,.95));box-shadow:0 0 6px rgba(94,234,212,.6)}
.sx-banner .sx-radar-big .sx-hub {position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px;border-radius:50%;background:#22D3EE;box-shadow:0 0 16px 4px rgba(34,211,238,.6)}
.sx-banner .sx-radar-head {display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;margin-bottom:6px}
.sx-banner .sx-radar-head strong {font-family:var(--sx-head);font-size:19px;font-weight:700;color:#fff;white-space:nowrap;transition:color .15s}
.sx-banner .sx-tor-radar .sx-live {display:inline-flex;gap:6px;align-items:center;font-size:13px;color:#6ee7b7;padding:2px 10px;border-radius:999px;background:rgba(16,185,129,.16)}
.sx-banner .sx-tor-radar .sx-live i {width:8px;height:8px;border-radius:50%;background:#34D399;box-shadow:0 0 8px #34D399}
.sx-banner .sx-live-at {flex-basis:100%;color:#B9C8DD;font-size:12.5px}
.sx-banner .sx-radar-stats {list-style:none;padding:0;margin:0;display:grid}
.sx-banner .sx-radar-stats li {display:flex;gap:14px;align-items:center;padding:10px 0}
.sx-banner .sx-radar-stats li+li {border-top:1px solid #1a3653}
.sx-banner .sx-rs-ic {width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:rgba(34,211,238,.13);color:#22D3EE;flex:none;box-shadow:inset 0 0 0 1px rgba(34,211,238,.18)}
.sx-banner .sx-rs-ic svg {width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sx-banner .sx-radar-stats .sx-amber .sx-rs-ic {background:rgba(251,191,36,.18);color:#FBBF24}
.sx-banner .sx-radar-stats small {display:block;color:#E2E8F0;font-size:15px;line-height:1.3}
.sx-banner .sx-radar-stats b {font-family:var(--sx-head);font-size:34px;font-weight:700;line-height:1.1;color:#22D3EE;margin-right:4px;font-variant-numeric:tabular-nums}
.sx-banner .sx-radar-stats .sx-amber b {color:#FBBF24}
.sx-banner .sx-radar-stats b.sx-sm {display:block;font-size:23px;margin:0;white-space:nowrap}
.sx-banner .sx-radar-stats em {display:block;font-style:normal;color:#CBD5E1;font-size:13px;line-height:1.35}
.sx-banner .sx-tor-radar:hover .sx-radar-head strong {color:#67E8F9}
.sx-banner .sx-radar-fallback {display:none;margin:6px 0 0;color:#B9C8DD;font-size:14px}
.sx-banner .sx-tor-radar.sx-is-loading .sx-radar-stats {visibility:hidden}
.sx-banner .sx-tor-radar.sx-no-data .sx-radar-stats, .sx-banner .sx-tor-radar.sx-no-data .sx-live, .sx-banner .sx-tor-radar.sx-no-data .sx-live-at {display:none}
.sx-banner .sx-tor-radar.sx-no-data .sx-radar-fallback {display:block}
@media (max-width:1300px) {
  .sx-banner .sx-tor-scan {width:220px}
  .sx-banner .sx-tor-tag {width:155px}
  .sx-banner .sx-radar-stats b {font-size:30px}
  .sx-banner .sx-radar-stats b.sx-sm {font-size:20px}
}
@media (max-width:1180px) {
  .sx-banner .sx-hero-tor .sx-wrap {column-gap:48px}
  .sx-banner .sx-tor-scan {width:190px}
  .sx-banner .sx-tor-tag {width:130px}
}
@media (max-width:1080px) {
  .sx-banner .sx-tor-mapbox {display:none}
  .sx-banner .sx-hero-tor .sx-wrap {grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy radar"}
}
@media (max-width:920px) {
  .sx-banner .sx-hero-tor .sx-wrap {padding-inline:20px;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy map" "radar radar"}
  .sx-banner .sx-tor-tag {display:none}
  .sx-banner .sx-tor-mapbox {display:block;padding-block:30px 0}
  .sx-banner .sx-tor-scan {width:170px}
  .sx-banner .sx-hero-tor .sx-hero-inner {padding-top:30px;padding-bottom:0}
  .sx-banner .sx-tor-radar {max-width:none;padding-block:22px 52px}
  .sx-banner .sx-radar-stats {grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px}
  .sx-banner .sx-radar-stats li {flex-direction:column;align-items:flex-start;gap:6px;padding:8px 0}
  .sx-banner .sx-radar-stats li+li {border-top:0}
  .sx-banner .sx-rs-ic {display:none}
}
@media (max-width:640px) {
  .sx-banner .sx-hero-tor .sx-tor-logo {width:96px}
  .sx-banner .sx-hero-tor .sx-wrap {padding-inline:16px;grid-template-columns:1fr;grid-template-areas:"copy" "radar"}
  .sx-banner .sx-tor-mapbox {display:none}
  .sx-banner .sx-radar-stats b {font-size:22px}
  .sx-banner .sx-radar-stats b.sx-sm {font-size:15px;white-space:normal}
  .sx-banner .sx-radar-stats em {font-size:11.5px}
  .sx-banner .sx-rs-unit, .sx-banner .sx-rs-long, .sx-banner .sx-radar-stats em:not([data-r]) {display:none}
}
@media (prefers-reduced-motion:reduce) {
  .sx-banner .sx-radar-big .sx-sweep, .sx-banner .sx-map-dot .sx-halo, .sx-banner .sx-map-dot .sx-halo2 {animation:sx-none}
}
@keyframes sx-torDot {0%,46%,100%{transform:scale(1);opacity:.12}4%{transform:scale(.45);opacity:.55}40%{transform:scale(1.5);opacity:0}45%{transform:scale(1);opacity:0}}
@keyframes sx-torDot2 {0%,34%,100%{transform:scale(1);opacity:.28}3%{transform:scale(.6);opacity:.8}28%{transform:scale(1.7);opacity:0}33%{transform:scale(1);opacity:0}}
@keyframes sx-torSpin {to{transform:rotate(360deg)}}
/* fitted into our hero box */
.sx-banner .sx-hero.sx-hero { position: absolute; inset: 0; height: 100%; min-height: 0; max-height: none; opacity: 1; visibility: visible; transform: none; display: flex; align-items: center; }
.sx-banner .sx-hero > .sx-wrap { width: 100%; }   /* our box is taller than scap's: centre the content */