/* Generated by scripts/build-css-bundles.py from: mobile-preview.css, blog-media.css, product-poster.css, site-spacing.css, localization.css. Edit those files, not this one. */

/* --- mobile-preview.css --- */
/* Shared device frames for approved portrait screenshots. Never crop screen UI. */
.sa-mobile-preview { display:flex; align-items:center; justify-content:center; gap:clamp(12px,3vw,28px); width:100%; max-width:620px; margin-inline:auto; padding:24px 12px; position:relative; z-index:1; }
.sa-mobile-preview .sa-mobile-preview__item { flex:1 1 0; min-width:0; max-width:220px; margin:0; }
/* A shallow metallic rim adds depth outside the unmodified screen. */
.sa-device-frame { padding:7px; background:linear-gradient(135deg,#555,#171719 30%,#353538 75%,#777); border:1px solid #626267; border-radius:27px; box-shadow:inset 0 0 0 2px #101012, 3px 5px 0 #222225, 8px 18px 30px #0008; }
.sa-device-frame img { display:block; width:100%; height:auto; border-radius:20px; }
.sa-mobile-preview__item:first-child .sa-device-frame { transform:rotate(-1.5deg); }
.sa-mobile-preview__item:nth-child(2) .sa-device-frame { transform:rotate(1.5deg); }
.sa-mobile-preview--single .sa-device-frame, .sa-mobile-preview--trio .sa-mobile-preview__item:nth-child(2) .sa-device-frame { transform:none; }
.sa-mobile-preview .sa-mobile-preview__device img { display:block; width:100%; max-width:100%; height:auto; aspect-ratio:853 / 1844; object-fit:contain; border-radius:17px; }

.sa-mobile-preview--pair .sa-mobile-preview__item:nth-child(2), .sa-mobile-preview--wide .sa-mobile-preview__item:nth-child(2) { margin-top:40px; }
.sa-mobile-preview--single { max-width:290px; padding-block:16px; }
.sa-mobile-preview--single .sa-mobile-preview__item { max-width:250px; }
.sa-mobile-preview--trio { max-width:760px; }
.sa-mobile-preview--trio .sa-mobile-preview__item:nth-child(2) { margin-top:32px; }
.sa-mobile-preview--wide { max-width:600px; }
.sa-variant-label { min-height:170px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; }
.sa-variant-label svg { width:48px; height:48px; }
.sa-supported-variants .sa-variant-label { min-height:112px; gap:12px; }
/* The white-label hero keeps its product preview alongside the original copy. */
.page-hero:has(.sa-mobile-preview--hero) { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:32px; height:auto !important; min-height:700px; padding:132px max(32px,6vw) 48px; }
.page-hero:has(.sa-mobile-preview--hero) .responsive-hero-content { position:relative !important; inset:auto !important; width:100%; max-width:100% !important; padding:0; order:-1; }
.page-hero:has(.sa-mobile-preview--hero) .responsive-hero-content p { max-width:100%; }
.sa-mobile-preview--hero { padding:0; }
@media(max-width:767px) {
 .sa-mobile-preview { padding:20px 8px; gap:12px; }
 .sa-device-frame { padding:5px; border-radius:21px; }
 .sa-device-frame img, .sa-mobile-preview .sa-mobile-preview__device img { border-radius:16px; }
 .sa-mobile-preview--trio { flex-wrap:wrap; }
 .sa-mobile-preview--trio .sa-mobile-preview__item { flex-basis:40%; max-width:180px; }
 .page-hero:has(.sa-mobile-preview--hero) { grid-template-columns:1fr; min-height:0; padding:112px 24px 40px; gap:20px; }
 .sa-mobile-preview--hero { max-width:420px; }
}

.sa-mobile-preview--single .sa-mobile-preview__item:first-child .sa-device-frame { transform:none; }

/* --- blog-media.css --- */
/* Preserve every headline and the complete approved 16:9 artwork. */
.sa-blog-cover, #simple-blog img.sa-blog-cover, #simple-blog .blog-card-image img.sa-blog-cover { display:block; width:100%; height:auto; max-height:none; aspect-ratio:16/9; object-fit:contain; border-radius:12px; transform:none; }
div:has(> .sa-blog-cover) { height:auto; aspect-ratio:16/9; }
#simple-blog .blog-card-image:hover .sa-blog-cover { transform:none; }
#simple-blog .blog-recent .sa-blog-cover { width:100%; border-radius:6px; }
/* Legacy service carousel rules must not crop the editorial headline. */

/* --- product-poster.css --- */




/* Compact company introduction: one reading column alongside a bounded visual. */
.sa-about-section{background:#17191d;padding:clamp(40px,5vw,64px) 24px;scroll-margin-top:100px}
.sa-about-layout{width:100%;max-width:1180px;margin:auto;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:clamp(24px,4vw,64px)}
.sa-about-copy{min-width:0;max-width:600px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.sa-about-copy h2{font-size:clamp(30px,3.2vw,44px);line-height:1.12;font-weight:600;letter-spacing:-.025em}
.sa-about-copy>p:not(.intro-hook){color:#bfc3cc;font-size:16px;line-height:1.7;margin:0}
.sa-about-art{margin:0;min-width:0;width:100%;max-width:500px;justify-self:end}
.sa-about-art img{width:100%;height:auto;display:block;aspect-ratio:1;object-fit:contain}
.sa-about-link{display:inline-flex;align-items:center;gap:22px;background:#337fec;color:white;border-radius:7px;padding:13px 20px;min-height:48px;font-size:15px;font-weight:600;margin-top:6px}
.sa-about-link:hover{background:#2568c9}.sa-about-link:focus-visible{outline:3px solid white;outline-offset:4px}
.sa-variant-diagram{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.sa-variant-diagram>div{padding:10px 12px 12px;border:1px solid rgb(255 255 255/.1);border-radius:10px;background:rgb(255 255 255/.03)}
.sa-card-label{display:block;color:#c3cbd8;font-size:12px;font-weight:600;letter-spacing:.02em;margin-bottom:8px}
.sa-card-row{display:flex;gap:4px}.sa-mini-card{display:grid;place-items:center;width:24px;height:34px;border:1px solid #5d92d6;background:#193453;border-radius:4px;color:#e2edff;font-size:16px}
.sa-mini-card--board{background:#e1e5eb;color:#273140;border-color:#e1e5eb}
.sa-card-rule{font-size:12px;color:#93bfff;margin:12px 0!important;line-height:1.5}
.sa-variant-switch{padding:14px 0;display:grid;gap:8px;color:#aeb6c3;font-size:12px}.sa-variant-switch strong{font-size:18px;color:#dbe8ff}.sa-variant-switch strong span{color:#73abfa;margin:0 10px}
@media(max-width:767px){.sa-about-layout{grid-template-columns:minmax(0,1fr);gap:20px}.sa-about-copy{max-width:none}.sa-about-art{max-width:360px;justify-self:center}.sa-about-copy>p:not(.intro-hook){font-size:15px;line-height:1.65}.sa-about-section{padding-inline:24px}}

body:has(.sa-about-section) header{background-color:#111112}

/* Remove decorative columns rather than filling every slot with another image. */

.sa-contact-content{display:grid!important;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:clamp(28px,5vw,64px);row-gap:18px;align-items:start;padding:clamp(20px,3vw,40px)!important}
.sa-contact-content>h5{grid-column:1;grid-row:1;margin:0!important;font-size:clamp(26px,3vw,38px)!important;line-height:1.2}
.sa-contact-content>p{grid-column:1;grid-row:2;margin:0!important;color:#bac1cd;line-height:1.7}
.sa-contact-content>form{grid-column:2;grid-row:1 / span 3;margin:0!important;min-width:0}
.sa-contact-content>form>div{padding:0!important}
.sa-compact-cta{grid-template-columns:minmax(0,1fr)!important;padding:28px 32px;min-height:0!important}
.sa-compact-cta>div{padding:0!important;text-align:left!important;align-items:flex-start!important;max-width:900px;gap:14px}
.sa-compact-cta a{margin-top:8px!important}
.sa-benefits-only{display:block!important}.sa-benefits-only>div{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.sa-benefits-only>div>div{margin:0!important}
.sa-api-overview{min-height:0!important;align-items:center!important;grid-template-columns:1fr 1fr!important;gap:48px!important}.sa-api-overview>div:first-child{order:2}.sa-api-overview>div:last-child{order:1}
.sa-api-diagram{width:100%;max-width:460px;margin:0 auto;padding:28px;background:#151a21;border:1px solid #2d3848;border-radius:14px;text-align:center}
.sa-api-clients,.sa-api-endpoints{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.sa-api-clients span,.sa-api-endpoints span{padding:12px 5px;border:1px solid #39485d;border-radius:6px;color:#d7e0ed;font-size:13px}.sa-api-endpoints{grid-template-columns:repeat(2,minmax(0,1fr))}
.sa-api-core{display:flex;align-items:center;justify-content:center;gap:18px;padding:22px;border:1px solid #4e94ef;border-radius:8px;background:#172d47;font-size:22px}.sa-api-core>span{color:#80b8ff}.sa-api-connector{color:#6faaf9;font-size:24px;padding:8px}.sa-api-diagram figcaption{font-size:12px;color:#9baec5;margin-top:20px}
@media(max-width:767px){.sa-contact-content{display:flex!important;flex-direction:column;gap:20px}.sa-contact-content>form{width:100%}.sa-compact-cta{padding:24px!important}.sa-benefits-only>div{grid-template-columns:1fr}.sa-api-overview{grid-template-columns:1fr!important;gap:24px!important}.sa-api-diagram{padding:20px}}




.sa-product-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;row-gap:18px;align-items:start;max-width:1180px;margin:auto;scroll-margin-top:110px;text-align:left}
.sa-product-intro>p,.sa-product-intro>h2,.sa-product-intro>span{grid-column:1;margin:0!important}.sa-product-intro>h2{line-height:1.2}.sa-product-intro>p{line-height:1.7}.sa-product-intro>div:last-child{grid-column:2;grid-row:1 / span 6;width:100%;align-self:center}
.sa-product-intro .sa-mobile-preview{padding-block:0}.sa-product-intro .sa-mobile-preview__item{max-width:180px}
#api-overview,#api-gameplay{scroll-margin-top:110px}
@media(max-width:767px){.sa-product-intro{display:flex;flex-direction:column;gap:18px}.sa-product-intro>div:last-child{margin-top:8px}.sa-product-intro .sa-mobile-preview__item{max-width:160px}}
/* Stacked layout: the action button comes last, after the text and the illustration. */
@media(max-width:767px){.sa-about-copy{display:contents}.sa-about-link{order:1;justify-self:center}}

/* --- site-spacing.css --- */
/* Layout spacing only: keep the existing typography, colors and controls. */
.site-spacing main .page-hero:not(:has(.sa-mobile-preview--hero)) {
  display: flex;
  align-items: center;
  height: auto !important;
  min-height: clamp(480px, 72svh, 680px) !important;
  padding-block: 132px 48px;
}
.site-spacing main .page-hero > video {
  position: absolute !important;
  inset: 0;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
}
.site-spacing main .page-hero .responsive-hero-content,
.site-spacing #home-hero.page-hero .hero-content {
  position: relative !important;
  inset: auto !important;
  width: min(1120px, 88%);
  max-width: none !important;
  margin-inline: auto;
  padding: 0 !important;
}
.site-spacing main .page-hero:has(.sa-mobile-preview--hero) {
  min-height: 0 !important;
  padding-block: 132px 40px;
}
.site-spacing main .page-hero:has(.sa-mobile-preview--hero) .responsive-hero-content { width: 100%; }
.site-spacing .sa-mobile-preview--hero .sa-mobile-preview__item { max-width: 190px; }

/* Don't stack a second heading gap on top of section padding. */
.site-spacing main > section:not(.page-hero) > :is(.mt-6, .mt-8),
.site-spacing main > section:not(.page-hero) > div > :is(.mt-6, .mt-8):first-child {
  margin-top: 0;
}
.site-spacing main > section:not(.page-hero):is(.mb-6, .mt-6, .mt-8) { margin-block: 0; }
.site-spacing .contact-info-cards { align-content: start; }
.site-spacing .contact-info-card { padding: 24px; }
.site-spacing .contact-section > div > :is(img.hidden, img.md\:hidden) { max-height: 280px; width: 100%; object-fit: contain; }

@media (max-width: 1199px) {
  .site-spacing main .page-hero:not(:has(.sa-mobile-preview--hero)) {
    min-height: 0 !important;
    padding-block: 112px 32px;
  }
  .site-spacing main .page-hero .responsive-hero-content,
.site-spacing #home-hero.page-hero .hero-content {
    width: 100%;
    padding: 0 1.5rem !important;
  }
  .site-spacing main .page-hero:has(.sa-mobile-preview--hero) .responsive-hero-content { padding: 0 !important; }
}
@media (max-width: 767px) {
  .site-spacing main .page-hero:not(:has(.sa-mobile-preview--hero)) { padding-block: 104px 32px; }
  .site-spacing main .page-hero .responsive-hero-content,
.site-spacing #home-hero.page-hero .hero-content { padding: 0 1rem !important; }
  .site-spacing main .page-hero:has(.sa-mobile-preview--hero) { padding: 104px 24px 32px; }
  .site-spacing main .page-hero:has(.sa-mobile-preview--hero) .responsive-hero-content { padding: 0 !important; }
}

/* Tablet layouts: give content cards and forms room in both orientations. */
@media (min-width: 768px) and (max-width: 1199px) {
  .site-spacing main .page-hero:has(.sa-mobile-preview--hero) {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    padding: 112px 24px 32px;
    gap: 24px;
  }
  main .grid:is(.service-3-key-features, .home-key-features),
  .sa-benefits-only > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sa-contact-content {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px;
  }
  .sa-contact-content > :is(h5, p, form) { grid-column: 1; grid-row: auto; }
  .sa-contact-content > form { width: 100%; }
  .sa-api-overview { gap: 24px !important; }
  .site-footer :is(.footer-services, .footer-links) > a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .site-footer .footer-legal { flex-wrap: wrap; gap: .5rem 1rem; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  #simple-blog .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- localization.css --- */
/* Reuse the header's type, palette and controls in every language. */
.global-header .site-header-actions { display: flex; align-items: center; gap: .75rem; }
.language-selector { position: relative; flex-shrink: 0; }
.language-selector summary { display: flex; align-items: center; justify-content: center; gap: .375rem; min-height: 44px; min-width: 60px; padding: .375rem; cursor: pointer; list-style: none; }
.language-selector summary::-webkit-details-marker { display: none; }
.language-selector summary::after { content: ''; width: 6px; height: 6px; margin: -3px 3px 0 2px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); opacity: .7; }
.language-selector[open] summary::after { transform: rotate(225deg); margin-top: 3px; }
.language-selector summary:focus-visible, .language-selector a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.language-selector nav { position: absolute; right: 0; top: calc(100% + .5rem); width: 180px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 110px); overflow-y: auto; padding: .5rem; background: #252525; border-radius: .375rem; z-index: 100000; }
.language-selector a { display: flex; align-items: center; min-height: 44px; padding: .5rem .75rem; border-radius: .25rem; }
.language-selector a:hover, .language-selector a[aria-current] { background: #ffffff1a; }
html:not([lang="en"]) main :is(h1,h2,h3,h4,h5,h6,p), html:not([lang="en"]) footer a { overflow-wrap: anywhere; }
html:lang(zh) main { word-break: normal; }
html:lang(ko) main { word-break: keep-all; }
/* Translated labels can be longer than the English max-content controls. */
html:not([lang="en"]) main .w-max { max-width: 100%; }
html:not([lang="en"]) [data-slot="tabs-list"] > li { max-width: 100%; }
html:not([lang="en"]) [data-slot="tabs-trigger"] { white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
@media (min-width: 1200px) and (max-width: 1399px) {
  html:not([lang="en"]) .site-desktop-nav { display: none !important; }
  html:not([lang="en"]) .site-menu-toggle-wrap { display: block !important; }
}
/* Set by site-navigation.js when the translated desktop bar does not fit. */
html.site-nav-compact .site-desktop-nav { display: none !important; }
html.site-nav-compact .site-menu-toggle-wrap { display: block !important; }
@media (max-width: 767px) {
  .global-header .site-header-actions { gap: .375rem; }
}