/* All tokens are validated and set on each instance. No global theme resets. */
.st4ck-gateway {
 --st4ck-density: 1;
 position: relative;
 isolation: isolate;
 box-sizing: border-box;
 width: 100%;
 padding: var(--st4ck-page-padding);
 background: var(--st4ck-color-page);
 color: var(--st4ck-color-text);
 font: var(--st4ck-font-size)/var(--st4ck-line-height) var(--st4ck-body-font);
 overflow-wrap: anywhere;
}
.st4ck-gateway *, .st4ck-gateway *::before, .st4ck-gateway *::after { box-sizing: border-box; }
.st4ck-gateway .st4ck-composition { position: relative; max-width: var(--st4ck-content-width); margin-inline: auto; display: grid; gap: var(--st4ck-gap); min-width: 0; }
.st4ck-gateway .st4ck-hero { min-width: 0; text-align: var(--st4ck-align, start); padding-block: var(--st4ck-gap); }
.st4ck-gateway .st4ck-heading { font-family: var(--st4ck-heading-font); font-weight: var(--st4ck-heading-weight); line-height: 1.12; font-size: calc(1em * var(--st4ck-heading-scale)); letter-spacing: -.035em; color: inherit; margin: 0; }
.st4ck-gateway .st4ck-intro { color: var(--st4ck-color-muted); max-width: 52ch; margin: 1.25em 0 0; white-space: pre-line; }
.st4ck-gateway img { max-width: 100%; height: auto; display: block; }
.st4ck-gateway .st4ck-logo_id { max-width: min(180px, 100%); max-height: 80px; width: auto; object-fit: contain; margin-block-end: var(--st4ck-gap); }
.st4ck-gateway .st4ck-visual:empty { display: none; }
.st4ck-gateway .st4ck-visual { margin-block-start: var(--st4ck-gap); }
.st4ck-gateway .st4ck-visual img { width: 100%; max-height: 420px; object-fit: cover; border-radius: var(--st4ck-radius); }
/* Shared forms, cards and accessible controls. */
.st4ck-gateway .st4ck-forms { display: grid; gap: var(--st4ck-gap); align-items: start; min-width: 0; }
.st4ck-gateway .st4ck-panel { min-width: 0; width: 100%; max-width: var(--st4ck-form-width); margin-inline: auto; padding: calc(var(--st4ck-gap) * var(--st4ck-density)); border: var(--st4ck-border-width) solid var(--st4ck-color-border); border-radius: var(--st4ck-radius); background: var(--st4ck-color-surface); box-shadow: var(--st4ck-shadow, none); }
.st4ck-gateway .st4ck-panel h2 { margin: 0 0 1em; font-family: var(--st4ck-heading-font); font-weight: var(--st4ck-heading-weight); line-height: 1.3; font-size: 1.4em; color: inherit; letter-spacing: normal; }
.st4ck-gateway .st4ck-panel p { margin: 0 0 calc(1em * var(--st4ck-density)); }
.st4ck-gateway .st4ck-panel p:last-child { margin-bottom: 0; }
.st4ck-gateway form { margin: 0 0 1em; padding: 0; }
.st4ck-gateway label { display: block; font-size: .9em; font-weight: 600; color: inherit; }
.st4ck-gateway input:not([type="hidden"]):not([type="checkbox"]), .st4ck-gateway select { display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 44px; padding: .6em .75em; margin: .4em 0 0; border: 1px solid var(--st4ck-color-border); border-radius: var(--st4ck-input-radius); background: var(--st4ck-color-input); color: var(--st4ck-color-input-text); font: inherit; box-shadow: none; }
.st4ck-gateway input[type="checkbox"] { width: 1.2em; height: 1.2em; vertical-align: middle; accent-color: var(--st4ck-color-accent); }
.st4ck-gateway label:has(input[type="checkbox"]) { min-height: 44px; display: flex; align-items: center; gap: .5em; }
.st4ck-gateway button { width: 100%; min-height: var(--st4ck-button-size); padding: .65em 1em; border: 2px solid var(--st4ck-color-accent); border-radius: var(--st4ck-button-radius); background: var(--st4ck-color-accent); color: var(--st4ck-color-button-text); font: inherit; font-weight: var(--st4ck-button-weight); cursor: pointer; text-transform: none; letter-spacing: normal; white-space: normal; }
.st4ck-gateway a { color: var(--st4ck-color-accent); text-decoration: underline; text-underline-offset: .2em; }
.st4ck-gateway :is(a, button, input, select):focus-visible { outline: 3px solid var(--st4ck-color-accent); outline-offset: 4px; }
.st4ck-gateway .st4ck-field-checkbox { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; column-gap: .65em; }
.st4ck-gateway .st4ck-field-checkbox input { margin-top: .2em; }
.st4ck-gateway .st4ck-field-checkbox :is(a, .st4ck-field-help) { grid-column: 2; }
.st4ck-gateway .st4ck-field-help { display: block; margin-top: .35em; color: var(--st4ck-color-muted); font-size: .9em; }
.st4ck-gateway [role="alert"] { color: var(--st4ck-color-error); border-inline-start: 3px solid currentColor; padding-inline-start: .75em; }
.st4ck-gateway [role="alert"]:focus { outline: 3px solid currentColor; outline-offset: 4px; scroll-margin-block: 48px; }
.st4ck-gateway [role="status"] { color: var(--st4ck-color-success); border-inline-start: 3px solid currentColor; padding-inline-start: .75em; }
/* Bounded treatment controls, shared by every preset. */
.st4ck-density-compact { --st4ck-density: .85; }
.st4ck-density-spacious { --st4ck-density: 1.25; }
.st4ck-alignment-center { --st4ck-align: center; }
.st4ck-alignment-center .st4ck-intro, .st4ck-alignment-center .st4ck-logo_id { margin-inline: auto; }
.st4ck-shadow-soft { --st4ck-shadow: 0 8px 28px #00000012; }
.st4ck-shadow-raised { --st4ck-shadow: 0 20px 50px #00000024; }
.st4ck-surface-transparent .st4ck-panel { background: transparent; }
.st4ck-button-outline button { background: transparent; color: var(--st4ck-color-accent); }
.st4ck-background-gradient { background: linear-gradient(135deg, var(--st4ck-color-page), var(--st4ck-color-surface)); }
.st4ck-gateway .st4ck-backdrop { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.st4ck-gateway .st4ck-backdrop img { width: 100%; height: 100%; object-fit: cover; }
.st4ck-background-overlay .st4ck-backdrop::after { content: ''; position: absolute; inset: 0; background: var(--st4ck-color-page); opacity: .85; }
.st4ck-background-image .st4ck-hero, .st4ck-background-overlay .st4ck-hero { background: var(--st4ck-color-page); padding: var(--st4ck-gap); border-radius: var(--st4ck-radius); }
.st4ck-forms-side-by-side .st4ck-forms, .st4ck-forms-cards .st4ck-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st4ck-forms-side-by-side .st4ck-forms { background: var(--st4ck-color-surface); border: var(--st4ck-border-width) solid var(--st4ck-color-border); border-radius: var(--st4ck-radius); gap: 0; }
.st4ck-forms-side-by-side .st4ck-panel { border: 0; background: transparent; box-shadow: none; }
.st4ck-gateway .st4ck-forms:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
/* Compositions change geometry; tokens remain freely editable. */
.st4ck-layout-minimal .st4ck-composition { max-width: min(var(--st4ck-content-width), calc(var(--st4ck-form-width) + 2 * var(--st4ck-gap))); }
.st4ck-layout-split.st4ck-full .st4ck-composition { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.st4ck-layout-split .st4ck-hero { padding: calc(2 * var(--st4ck-gap)) var(--st4ck-gap); position: sticky; top: var(--st4ck-gap); }
.st4ck-layout-hero .st4ck-hero { padding-block: calc(2 * var(--st4ck-gap)) calc(3 * var(--st4ck-gap)); }
.st4ck-layout-hero .st4ck-forms { margin-top: calc(-1 * var(--st4ck-gap)); }
.st4ck-layout-landing .st4ck-hero { display: grid; grid-template-columns: 3fr 2fr; gap: var(--st4ck-gap); padding-block: calc(2 * var(--st4ck-gap)); }
.st4ck-layout-landing .st4ck-heading, .st4ck-layout-landing .st4ck-intro { grid-column: 1; }
.st4ck-layout-landing .st4ck-visual { grid-column: 2; grid-row: 1 / span 3; margin: 0; }
.st4ck-layout-landing .st4ck-forms { padding-block-start: var(--st4ck-gap); border-top: 2px solid var(--st4ck-color-accent); }
.st4ck-layout-corporate .st4ck-hero { display: flex; align-items: center; flex-wrap: wrap; gap: var(--st4ck-gap); border-bottom: 3px solid var(--st4ck-color-accent); }
.st4ck-layout-corporate .st4ck-intro { margin: 0; flex-basis: 100%; }
.st4ck-layout-corporate .st4ck-logo_id { margin: 0; }
.st4ck-layout-corporate .st4ck-visual { max-width: 240px; margin: 0; }
.st4ck-layout-dark .st4ck-hero { border: var(--st4ck-border-width) solid var(--st4ck-color-border); border-radius: var(--st4ck-radius); padding: var(--st4ck-gap); }
.st4ck-embedded .st4ck-composition { display: block; }
.st4ck-embedded .st4ck-forms { margin: 0; padding: 0; border-top: 0; }
/* Container queries keep embeds responsive inside columns as well as viewports. */
.st4ck-gateway { container-type: inline-size; }
@container (max-width: 680px) {
 .st4ck-gateway.st4ck-full .st4ck-composition, .st4ck-gateway .st4ck-forms, .st4ck-gateway .st4ck-hero { grid-template-columns: minmax(0, 1fr); }
 .st4ck-gateway .st4ck-hero { position: static; }
 .st4ck-layout-landing .st4ck-visual { grid-column: 1; grid-row: auto; }
 .st4ck-gateway .st4ck-heading { font-size: min(calc(1em * var(--st4ck-heading-scale)), 2.4em); }
}
@media (max-width: 600px) {
 .st4ck-gateway { padding: min(var(--st4ck-page-padding), 16px); }
 .st4ck-gateway .st4ck-panel, .st4ck-gateway .st4ck-hero { padding: min(var(--st4ck-gap), 20px); }
}

/* Phase 4 sections: one bounded composition system, never theme-global rules. */
.st4ck-gateway .st4ck-sections { display: grid; gap: var(--st4ck-gap); min-width: 0; }
.st4ck-gateway.st4ck-sectioned.st4ck-full .st4ck-composition { display: block; }
.st4ck-gateway.st4ck-sectioned .st4ck-hero { position: static; top: auto; display: block; padding: var(--st4ck-gap); }
.st4ck-gateway.st4ck-sectioned .st4ck-section-split { display: grid; }
.st4ck-gateway .st4ck-section { min-width: 0; padding: var(--st4ck-gap); border-radius: var(--st4ck-radius); }
.st4ck-gateway .st4ck-section > :first-child,
.st4ck-gateway .st4ck-section-copy > :first-child { margin-top: 0; }
.st4ck-gateway .st4ck-section > :last-child,
.st4ck-gateway .st4ck-section-copy > :last-child { margin-bottom: 0; }
.st4ck-gateway .st4ck-section > h2,
.st4ck-gateway .st4ck-section-copy > h2,
.st4ck-gateway .st4ck-section-title { color: inherit; font-family: var(--st4ck-heading-font); font-weight: var(--st4ck-heading-weight); line-height: 1.18; }
.st4ck-gateway .st4ck-section-hero .st4ck-section-copy > h2 { margin-bottom: .4em; font-size: min(calc(1em * var(--st4ck-heading-scale)), 4.5em); letter-spacing: -.035em; }
.st4ck-gateway .st4ck-section h2 { margin-bottom: .65em; font-size: 1.75em; }
.st4ck-gateway .st4ck-section-subheading { max-width: 62ch; color: var(--st4ck-color-muted); font-size: 1.12em; }
.st4ck-gateway .st4ck-section-body { max-width: 72ch; }
.st4ck-gateway .st4ck-section-body > :last-child { margin-bottom: 0; }
.st4ck-gateway .st4ck-section-media img { width: 100%; max-height: 440px; object-fit: cover; border-radius: var(--st4ck-radius); }
.st4ck-gateway .st4ck-section-surface-surface { border: var(--st4ck-border-width) solid var(--st4ck-color-border); background: var(--st4ck-color-surface); box-shadow: var(--st4ck-shadow, none); }
.st4ck-gateway .st4ck-section-surface-accent { background: var(--st4ck-color-accent); color: var(--st4ck-color-button-text); }
.st4ck-gateway .st4ck-section-surface-accent :is(a, .st4ck-section-subheading) { color: inherit; }
.st4ck-gateway .st4ck-section-card { border: var(--st4ck-border-width) solid var(--st4ck-color-border); background: var(--st4ck-color-surface); }
.st4ck-gateway .st4ck-section-hero.st4ck-section-centered .st4ck-section-copy { max-width: 64ch; margin-inline: auto; text-align: center; }
.st4ck-gateway .st4ck-section-align-center { text-align: center; }
.st4ck-gateway .st4ck-section-align-center :is(.st4ck-section-body, .st4ck-section-subheading) { margin-inline: auto; }
.st4ck-gateway .st4ck-section-space-compact { padding-block: calc(var(--st4ck-gap) * .6); }
.st4ck-gateway .st4ck-section-space-spacious { padding-block: calc(var(--st4ck-gap) * 2); }
.st4ck-gateway :is(.st4ck-section-split, .st4ck-section-image-left, .st4ck-section-image-right) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: calc(var(--st4ck-gap) * 1.5); }
.st4ck-gateway .st4ck-section-image-left .st4ck-section-media { order: -1; }
.st4ck-gateway .st4ck-section-items { display: grid; gap: var(--st4ck-gap); }
.st4ck-gateway .st4ck-section-inline .st4ck-section-items,
.st4ck-gateway .st4ck-section-cards .st4ck-section-items { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.st4ck-gateway .st4ck-trust-item { min-width: 0; padding: calc(var(--st4ck-gap) * .75); border: var(--st4ck-border-width) solid var(--st4ck-color-border); border-radius: var(--st4ck-radius); }
.st4ck-gateway .st4ck-section-inline .st4ck-trust-item { padding: 0; border: 0; }
.st4ck-gateway .st4ck-trust-item p { margin: .4em 0 0; color: var(--st4ck-color-muted); }
.st4ck-gateway .st4ck-faq-item { border-bottom: var(--st4ck-border-width) solid var(--st4ck-color-border); padding-block: .75em; }
.st4ck-gateway .st4ck-faq-item summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: 600; }
.st4ck-gateway .st4ck-faq-item summary:focus-visible { outline: 3px solid var(--st4ck-color-accent); outline-offset: 4px; }
.st4ck-gateway .st4ck-section-auth { display: grid; gap: var(--st4ck-gap); min-width: 0; }
.st4ck-gateway .st4ck-section-side-by-side .st4ck-section-auth,
.st4ck-gateway .st4ck-section-cards .st4ck-section-auth { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st4ck-gateway .st4ck-section-side-by-side .st4ck-section-auth { gap: 0; border: var(--st4ck-border-width) solid var(--st4ck-color-border); border-radius: var(--st4ck-radius); }
.st4ck-gateway .st4ck-section-side-by-side .st4ck-panel { border: 0; background: transparent; box-shadow: none; }
.st4ck-gateway .st4ck-contact-details { display: grid; gap: .6em; }
.st4ck-gateway .st4ck-section-columns .st4ck-contact-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st4ck-gateway .st4ck-section-footer { border-top: var(--st4ck-border-width) solid var(--st4ck-color-border); }
.st4ck-gateway .st4ck-section-footer ul { display: flex; flex-wrap: wrap; gap: .75em 1.25em; padding: 0; margin: 1em 0 0; list-style: none; }
.st4ck-gateway .st4ck-section-footer.st4ck-section-stacked ul { display: grid; }
@container (max-width: 680px) {
 .st4ck-gateway :is(.st4ck-section-split, .st4ck-section-image-left, .st4ck-section-image-right),
 .st4ck-gateway .st4ck-section-side-by-side .st4ck-section-auth,
 .st4ck-gateway .st4ck-section-cards .st4ck-section-auth,
 .st4ck-gateway .st4ck-section-columns .st4ck-contact-details { grid-template-columns: minmax(0, 1fr); }
 .st4ck-gateway .st4ck-section-image-left .st4ck-section-media { order: 0; }
}
