                                                                            
                                                                                     
:root {
  --payos-blue: #0549ac;
  --payos-yellow: #FEC016;
  --payos-gradient-yellow: linear-gradient(150deg,#ffd35c 0%,var(--payos-yellow) 46%,#f0a900 100%);
  --payos-ink: #1C1A2B;
  --payos-white: #fff;
  --payos-surface-blue: #e7eefb;
  --payos-font-body: 'Satoshi',system-ui,-apple-system,sans-serif;
  --payos-font-heading: 'Satoshi',system-ui,sans-serif;
  --payos-heading-tracking: -.03em;
  --payos-heading-weight: 900;
  --payos-card-title-weight: 800;
  --payos-h1-size: clamp(46px,5.6vw,74px);
  --payos-h1-leading: 1.06;
}
h1,h2 {
  font-family: var(--payos-font-heading) !important;
  letter-spacing: var(--payos-heading-tracking) !important;
  font-weight: var(--payos-heading-weight) !important;
}
h1 {
  font-size: var(--payos-h1-size) !important;
  line-height: var(--payos-h1-leading) !important;
}

                                                                                   
.payos-product-title { font-size:22px;font-weight:var(--payos-card-title-weight);letter-spacing:-.02em;color:var(--payos-ink);line-height:1.22; }
.payos-hero-lead { font-size:23px;line-height:1.4;color:var(--payos-ink);font-weight:700;letter-spacing:-.015em; }
.payos-intro-copy { font-size:19px;line-height:1.6;color:var(--payos-ink);font-weight:600; }
.payos-body-copy { font-size:15.5px;line-height:1.55;color:var(--payos-ink); }
.payos-article-title { font-size:16.5px;font-weight:800;letter-spacing:-.02em;line-height:1.3; }
.payos-resource-title { font-size:18.5px;font-weight:800;letter-spacing:-.02em;line-height:1.28; }
.payos-article-description { font-size:13px;line-height:1.55;color:#5a5a66; }
.payos-resource-description { font-size:14px;line-height:1.55;color:#5a5a66; }
.payos-footer-copy { font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.78); }

                                                                            
#dc-root .payos-article-title { font-size:16.5px !important;font-weight:800 !important;line-height:1.3 !important;letter-spacing:-.02em !important; }
#dc-root .payos-resource-title { font-size:18.5px !important;font-weight:800 !important;line-height:1.28 !important;letter-spacing:-.02em !important; }

                                                                                       
:root {
  --payos-metric-size:26px;
  --payos-metric-prominent-size:clamp(32px,3.4vw,44px);
  --payos-font-technical:'JetBrains Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
  --payos-technical-size:13px;
}
#dc-root [data-text-role="metric"] {
  font-family:var(--payos-font-heading) !important;
  font-size:var(--payos-metric-size) !important;
  font-weight:900 !important;
  line-height:1.1 !important;
  letter-spacing:-.02em !important;
  font-variant-numeric:lining-nums tabular-nums;
  min-width:0;overflow-wrap:break-word;
}
#dc-root [data-text-role="metric"][data-text-variant="prominent"] {
  font-size:var(--payos-metric-prominent-size) !important;
}
#dc-root [data-text-role="technical"] {
  font-family:var(--payos-font-technical) !important;
  font-size:var(--payos-technical-size) !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  letter-spacing:normal !important;
  text-transform:none;
  font-variant-numeric:lining-nums tabular-nums;
  min-width:0;overflow-wrap:anywhere;
}
#dc-root pre[data-text-role="technical"] {
  white-space:pre;overflow-x:auto;overflow-wrap:normal;max-width:100%;
}

                                                                           
#dc-root .payos-article-description { font-size:13px !important;line-height:1.55 !important; }
#dc-root .payos-resource-description { font-size:14px !important;line-height:1.55 !important; }

                                                                             
                                                                                     
:root {
  --payos-text-on-light: #1c1a2b;
  --payos-text-secondary-on-light: #57534b;
  --payos-link-on-light: #0549ac;
  --payos-text-on-dark: #ffffff;
  --payos-text-secondary-on-dark: #e7eefb;
  --payos-link-on-dark: #ffffff;
}
[data-color-surface="light"] {
  --payos-surface-text: var(--payos-text-on-light);
  --payos-surface-secondary: var(--payos-text-secondary-on-light);
  --payos-surface-link: var(--payos-link-on-light);
  color: var(--payos-surface-text);
}
[data-color-surface="dark"] {
  --payos-surface-text: var(--payos-text-on-dark);
  --payos-surface-secondary: var(--payos-text-secondary-on-dark);
  --payos-surface-link: var(--payos-link-on-dark);
  color: var(--payos-surface-text);
}
[data-color-role="primary"] { color: var(--payos-surface-text) !important; }
[data-color-role="secondary"] { color: var(--payos-surface-secondary) !important; }
[data-color-role="link"] { color: var(--payos-surface-link) !important; }

                                                                              
                                                                              
:root {
  --payos-status-success-ink:#14643d;
  --payos-status-warning-ink:#805300;
  --payos-status-warning-fill:#FEC016;
  --payos-status-warning-on-fill:#1c1a2b;
  --payos-status-info-ink:#075c70;
  --payos-status-teal-ink:#08604f;
  --payos-status-neutral-ink:#4a5568;
}
                                                                             
                                                                   
[data-illustration-readable] {
  opacity:1 !important;
  transition-property:transform, border-color, background-color !important;
}

                                                                                  
:root {
  --payos-container-content: 1160px;
  --payos-container-wide: 1360px;
  --payos-container-statement: 1180px;
  --payos-gutter: 28px;
  --payos-section-space: 124px;
  --payos-space-2: 8px;
  --payos-space-3: 12px;
  --payos-space-4: 16px;
  --payos-space-6: 24px;
  --payos-space-8: 32px;
  --payos-space-10: 40px;
  --payos-space-12: 48px;
}
.payos-container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--payos-container-content);
  margin-inline: auto;
  padding-inline: var(--payos-gutter);
}
.payos-section-content { padding-block: var(--payos-section-space); }
.payos-container--wide { max-width: var(--payos-container-wide); padding-inline: var(--payos-space-6); }
.payos-section-content--products { padding-block: 88px 24px; }
.payos-container--statement { max-width: var(--payos-container-statement); }
.payos-section-content--statement { padding-block: 104px 26px; }
.payos-section-content--stack { padding: 104px var(--payos-space-12); }
.payos-section-content--audience { padding-block: 128px 136px; }
.payos-section-heading { margin-bottom: var(--payos-space-10); }
.payos-content-grid { gap: 22px; }

                                                                               
[data-payos-home] section.payos-layout-section { padding: 0 !important; }

@media (max-width: 860px) {
  :root { --payos-gutter: 20px; --payos-section-space: 64px; }
  .payos-container { padding-inline: var(--payos-gutter); }
  .payos-section-content { padding-block: var(--payos-section-space); }
  .payos-section-heading { margin-bottom: var(--payos-space-8); }
}
@media (max-width: 600px) {
  :root { --payos-section-space: 48px; }
  .payos-content-grid { gap: var(--payos-space-6); }
}

                                                                            
[data-payos-home] > .payos-section-divider {
  margin: 0 auto !important;
  padding: var(--payos-divider-gap, 48px) 40px !important;
}
[data-payos-home] > .payos-boundary-spacer { height: 0 !important; }
[data-payos-home] > section.payos-section-plain,
[data-payos-home] > section.payos-section-panel { margin-block: 0 !important; }
.payos-section-plain > .payos-section-content { padding-block: 0; }
[data-payos-home] > section.payos-hero-boundary {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
@media (max-width: 600px) {
  [data-payos-home] { --payos-divider-gap: 32px; }
}

                                                                                      
.payos-heading-group {
  width: 100%;
  min-width: 0;
  margin: 0 0 var(--payos-space-10);
  text-align: left;
}
.payos-heading-group--products { padding-inline: var(--payos-space-2); }
[data-payos-home] .payos-section-title {
  margin: 0;
  max-width: 100%;
  white-space: normal !important;
  text-wrap: balance;
}
.payos-section-description {
  max-width: 680px;
  margin: var(--payos-space-4) 0 0;
}
.payos-heading-group--with-link {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--payos-space-4);
}
.payos-heading-group--with-link > div { flex: 1 1 40rem; min-width: 0; }
.payos-heading-group--with-link > a { flex: none; }
@media (max-width: 600px) {
  .payos-heading-group { margin-bottom: var(--payos-space-8); }
}

                                                                              
:root {
  --payos-surface-white: var(--payos-white);
  --payos-surface-yellow: #fff2cc;
  --payos-surface-dark: #04336f;
  --payos-border-subtle: rgba(28,26,43,.12);
  --payos-border-emphasis: rgba(28,26,43,.35);
  --payos-border-blue: rgba(5,73,172,.18);
  --payos-border-hover: rgba(5,73,172,.5);
  --payos-border-on-dark: rgba(255,255,255,.2);
  --payos-border-on-dark-emphasis: rgba(255,255,255,.55);
  --payos-border-yellow: rgba(201,134,0,.45);
  --payos-gradient-surface: linear-gradient(170deg,#fff 0%,#f6f9ff 58%,#eef4ff 100%);
  --payos-gradient-blue: linear-gradient(150deg,#0d5fce 0%,var(--payos-blue) 48%,var(--payos-surface-dark) 100%);
}
.payos-surface--white { background: var(--payos-surface-white); }
.payos-surface--blue { background: var(--payos-surface-blue); }
.payos-surface--yellow { background: var(--payos-surface-yellow); }
.payos-surface--dark { background: var(--payos-surface-dark); color: var(--payos-white); }

                                                            
:root {
  --payos-card-padding: var(--payos-space-6, 24px);
  --payos-card-radius: 16px;
  --payos-card-gap: var(--payos-space-6, 24px);
  --payos-card-title-gap: var(--payos-space-3, 12px);
  --payos-card-border: var(--payos-border-subtle);
}
.payos-card-grid { gap: var(--payos-card-gap); }
.payos-content-card {
  display: flex;
  flex-direction: column;
  background: var(--payos-white);
  border: 1px solid var(--payos-card-border);
  border-radius: var(--payos-card-radius);
  overflow: hidden;
  text-decoration: none;
  transition: border-color .15s ease;
}
.payos-content-card__body {
  padding: var(--payos-card-padding);
  display: flex;
  flex-direction: column;
  flex: 1;
}
.payos-content-card__title { margin: 0 0 var(--payos-card-title-gap); }
@media (hover: hover) {
  .payos-content-card:hover { border-color: var(--payos-border-hover); }
}
.payos-content-card:focus-visible {
  outline: 3px solid var(--payos-blue);
  outline-offset: 4px;
  border-color: var(--payos-blue);
}
@media (prefers-reduced-motion: reduce) {
  .payos-content-card { transition: none; }
}

                                                                                 
:root {
  --payos-product-card-padding: var(--payos-space-8, 32px);
  --payos-product-card-radius: 24px;
}
.payos-product-card {
  padding: var(--payos-product-card-padding);
  transition: transform .15s ease;
}
@media (hover: hover) {
  .payos-product-card:hover { transform: translateY(-4px); }
}
.payos-product-card:focus-visible {
  outline: 3px solid var(--payos-blue);
  outline-offset: 4px;
}
@media (max-width: 600px) {
  .payos-product-card { --payos-product-card-padding: var(--payos-card-padding); }
}
@media (prefers-reduced-motion: reduce) {
  .payos-product-card { transition: none; }
  .payos-product-card:hover { transform: none; }
}

                                                       
.xgrid > .payos-product-card { border-radius: var(--payos-product-card-radius); }

                                                                             
.audgrid > .payos-audience-card {
  padding: var(--payos-card-padding);
  border-radius: var(--payos-card-radius);
}
.payos-audience-card__description { margin-top: var(--payos-card-title-gap); }

                                                                    
.payos-example-track { gap: var(--payos-card-gap); }
.payos-example-track > .payos-example-card { border-radius: var(--payos-card-radius); }
.payos-example-panel { min-width: 0; padding: var(--payos-card-padding, 24px); }
.payos-example-track { align-items: flex-start; }
.payos-example-media-row { flex-wrap: wrap; }
.payos-example-media-row > * { min-width: 0; max-width: 100%; }
.payos-example-media-row > div { flex: 1 1 140px; }
.payos-carousel-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0 0 var(--payos-space-4, 16px);
}
.payos-carousel-pagination > div { display: flex; flex-wrap: wrap; justify-content: center; min-width: 0; }
@media (max-width: 600px) {
  .payos-example-panel { padding: var(--payos-card-padding); }
}

                                                                                  
.payos-outcome-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-block: 1px solid var(--payos-card-border);
  background: var(--payos-white);
}
.payos-outcome-cell { min-width: 0; padding: var(--payos-card-padding); }
.payos-outcome-cell + .payos-outcome-cell { border-left: 1px solid var(--payos-card-border); }
.payos-outcome-label,
.payos-outcome-title { margin-bottom: var(--payos-card-title-gap); }
@media (max-width: 860px) {
  .payos-outcome-row { grid-template-columns: 1fr; }
  .payos-outcome-cell + .payos-outcome-cell {
    border-left: 0;
    border-top: 1px solid var(--payos-card-border);
  }
}

                                                                               
                                                                                
@media (min-width: 861px) and (max-height: 800px) {
  .payos-example-track .payos-example-panel { padding: var(--payos-space-4, 16px); }
  .payos-example-track {
    --payos-example-result-padding: var(--payos-space-4, 16px);
    --payos-example-result-row-padding: var(--payos-space-1, 4px) var(--payos-space-3, 12px);
    --payos-example-block-gap: var(--payos-space-4, 16px);
  }
}

                                                                                
:root {
  --payos-font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --payos-badge-radius: 6px;
  --payos-badge-padding-y: 6px;
  --payos-label-tracking: .08em;
  --payos-label-color: #5a5a66;
  --payos-yellow-ink: #795700;
}
.payos-badge {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--payos-space-2, 8px);
  max-width: 100%;
  padding: var(--payos-badge-padding-y) var(--payos-space-3, 12px);
  border: 1px solid transparent;
  border-radius: var(--payos-badge-radius);
  font-family: var(--payos-font-body);
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
  letter-spacing: normal;
}
.payos-badge > svg, .payos-badge > span:has(svg) { flex-shrink: 0; }
.payos-badge--technical { font-family: var(--payos-font-mono); font-weight: 700; text-transform: uppercase; }
.payos-badge--uppercase { text-transform: uppercase; }
.payos-badge--filled { background: var(--payos-blue); color: var(--payos-white); }
.payos-badge--blue { background: var(--payos-surface-blue); color: var(--payos-blue); }
.payos-badge--yellow { background: var(--payos-surface-yellow); color: var(--payos-yellow-ink); }
.payos-badge--neutral { background: transparent; border-color: var(--payos-border-emphasis); color: var(--payos-ink); }
.payos-label {
  font-family: var(--payos-font-body);
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
  letter-spacing: var(--payos-label-tracking);
  text-transform: uppercase;
  color: var(--payos-label-color);
}
.payos-label--technical { font-family: var(--payos-font-mono); font-weight: 700; }
.payos-label--blue { color: var(--payos-blue); }

                                                                              
.payos-badge--compound { justify-content:flex-start;white-space:normal;text-align:left; }
.payos-badge--on-dark { background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:var(--payos-white); }
.payos-badge__number { flex:0 0 20px;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--payos-blue);color:var(--payos-white);font:inherit; }
.payos-badge__text { min-width:0;overflow-wrap:anywhere; }
.payos-badge__title { font:inherit;font-weight:800; }
.payos-badge__description { font:inherit;font-weight:400; }

                                                                                   
.payos-badge--wrap { align-self:flex-start;justify-content:flex-start;white-space:normal;text-align:left;overflow-wrap:anywhere; }

                                                                                
section.payos-refresh-section { padding-inline:0 !important; margin-block:0 !important; }
section.payos-refresh-section[style*="border-radius"] { border-radius:var(--payos-card-radius) !important; }
.payos-refresh-container { box-sizing:border-box; width:100%; max-width:var(--payos-container-content) !important; margin-inline:auto !important; padding:var(--payos-section-space) var(--payos-gutter) !important; }
.payos-refresh-section h2 { font-family:var(--payos-font-heading) !important; font-weight:var(--payos-heading-weight) !important; font-size:clamp(30px,3.6vw,42px) !important; line-height:1.12 !important; letter-spacing:var(--payos-heading-tracking) !important; overflow-wrap:break-word; }
.payos-refresh-section [style*="display: grid"] > *, .payos-refresh-section [style*="display:grid"] > * { min-width:0; }
.payos-device-frame { border-radius:30px !important; padding:8px !important; flex-shrink:0; max-width:100%; }
.payos-device-frame > div { border-radius:23px !important; }
@media(max-width:600px) {
  .payos-refresh-section [style*="white-space: nowrap"] { white-space:normal !important; }
  .payos-refresh-section iframe { max-width:100%; }
}
@media(prefers-reduced-motion:reduce) {
 .payos-refresh-section * { animation:none !important; transition:none !important; }
}

                                                                  
@media(max-width:600px) {
 .payos-bank-hero-chip { width:180px; left:clamp(90px,var(--chip-left),calc(100% - 90px)) !important; }
 .payos-bank-hero-chip > div > div { white-space:normal !important; }
}

@media(max-width:600px) { .payos-bank-hero-chip > div { min-width:0 !important; max-width:180px; } }
