/* Scoped scene styles from the supplied S-WORK snapshot. */
.swork-showcase .swork-canvas {
    --spacing: .25rem;
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --font-weight-medium: 500;
    --shadow-sm: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --ink: #102a4c;
    --body: #3a4657;
    --muted: #5a6572;
    --primary: #5a2d82;
    --primary-dark: #4a2469;
    --primary-soft: #f3f1f8;
    --accent: #1b7fb0;
    --surface: #f7f9fb;
    --line: #e7ecf1;
    --white: #fff;
    --de-ink-line: #3c5a72;
    --secondary-dark: #13668f;
    --line-input: #718096;
    --success: #2e7d68;
    --error: #b42318;
    --tone-eae5f2: #eae5f2;
    --tone-d9e1e8: #d9e1e8;
    --tone-eef3f8: #eef3f8;
    --tone-d8c9e3: #d8c9e3;
    --tone-d8c8e5: #d8c8e5;
    --tone-d6dde5: #d6dde5;
    --tone-1877f2: #1877f2;
    --tone-c13584: #c13584;
    --tone-eef1f4: #eef1f4;
    --tone-9db8cc: #9db8cc;
    --tone-d6e2eb: #d6e2eb;
    --tone-dfcfea: #dfcfea;
    --tone-eaf1f6: #eaf1f6;
    --tone-9aacb9: #9aacb9;
}
.swork-showcase .swork-canvas * { --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-border-style: solid; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-leading: initial; --tw-font-weight: initial; }
.swork-showcase .swork-canvas * { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; }
.swork-showcase .swork-canvas hr { height: 0px; color: inherit; border-top-width: 1px; }
.swork-showcase .swork-canvas .swork-heading-1,
.swork-showcase .swork-canvas .swork-heading-2,
.swork-showcase .swork-canvas .swork-heading-3 { font-size: inherit; font-weight: inherit; }
.swork-showcase .swork-canvas .swork-link { color: inherit; text-decoration: inherit; }
.swork-showcase .swork-canvas strong { font-weight: bolder; }
.swork-showcase .swork-canvas small { font-size: 80%; }
.swork-showcase .swork-canvas summary { display: list-item; }
.swork-showcase .swork-canvas ol,
.swork-showcase .swork-canvas ul { list-style: none; }
.swork-showcase .swork-canvas img,
.swork-showcase .swork-canvas svg { vertical-align: middle; display: block; }
.swork-showcase .swork-canvas img { max-width: 100%; height: auto; }
.swork-showcase .swork-canvas button,
.swork-showcase .swork-canvas input,
.swork-showcase .swork-canvas select { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; }
.swork-showcase .swork-canvas button { appearance: button; }
.swork-showcase .swork-canvas [hidden]:where(:not([hidden="until-found"])) { display: none !important; }
.swork-showcase .swork-canvas p { margin-block: 0px 1rem; }
.swork-showcase .swork-canvas button,
.swork-showcase .swork-canvas input,
.swork-showcase .swork-canvas select { font: inherit; }
.swork-showcase .swork-canvas summary { cursor: pointer; }
.swork-showcase .swork-canvas [hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
.swork-showcase .swork-canvas * { scroll-behavior: auto !important; transition-duration: 0s !important; animation-duration: 0s !important; }
}
.swork-showcase .swork-canvas .landing-shell { --shadow-sm: 0 12px 30px #102a4c12; --shadow-md: 0 24px 60px #102a4c21; min-height: 100cqh; color: var(--ink); background: var(--white); -webkit-font-smoothing: antialiased; font-family: "Swork Barlow", "Segoe UI", sans-serif; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell *,
.swork-showcase .swork-canvas .landing-shell ::before,
.swork-showcase .swork-canvas .landing-shell ::after { box-sizing: border-box; }
.swork-showcase .swork-canvas .landing-shell .landing-page { background: var(--white); overflow: clip; }
.swork-showcase .swork-canvas .landing-shell .swork-link:not(.swork-button) { color: var(--primary); text-decoration: none; }
.swork-showcase .swork-canvas .landing-shell .swork-link:not(.swork-button):hover { text-decoration: underline; }
.swork-showcase .swork-canvas .landing-shell :focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.swork-showcase .swork-canvas .landing-shell .de-hero-title:focus { outline: none; }
.swork-showcase .swork-canvas .landing-shell .swork-heading-1,
.swork-showcase .swork-canvas .landing-shell .swork-heading-2,
.swork-showcase .swork-canvas .landing-shell .swork-heading-3,
.swork-showcase .swork-canvas .landing-shell p { margin-top: 0px; }
.swork-showcase .swork-canvas .landing-shell .landing-container,
.swork-showcase .swork-canvas .landing-shell .narrow-container { width: 100%; max-width: 1160px; margin-inline: auto; padding-inline: 20px; }
.swork-showcase .swork-canvas .landing-shell .narrow-container { max-width: 820px; }
.swork-showcase .swork-canvas .landing-shell .landing-section { padding-block: clamp(56px, 8cqw, 96px); scroll-margin-top: 88px; }
.swork-showcase .swork-canvas .landing-shell .soft-section { background: var(--surface); }
.swork-showcase .swork-canvas .landing-shell .section-heading { max-width: 720px; margin-bottom: 32px; }
.swork-showcase .swork-canvas .landing-shell .section-heading .swork-heading-2 { color: var(--ink); margin-bottom: 12px; font-size: clamp(26px, 3cqw, 34px); font-weight: 500; line-height: 1.2; }
.swork-showcase .swork-canvas .landing-shell .section-heading p { color: var(--body); text-wrap: pretty; margin-bottom: 0px; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .swork-button { min-height: 46px; box-shadow: none; text-transform: none; border-radius: 8px; padding: 11px 22px; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1.3; }
.swork-showcase .swork-canvas .landing-shell .soft-button.swork-button { background: var(--primary-soft); color: var(--primary); }
.swork-showcase .swork-canvas .landing-shell .soft-button.swork-button:hover { background: var(--tone-eae5f2); }
.swork-showcase .swork-canvas .landing-shell .block-button.swork-button { width: 100%; }
.swork-showcase .swork-canvas .landing-shell .compact-button.swork-button { min-height: 38px; padding: 8px 14px; }
.swork-showcase .swork-canvas .landing-shell .hero-section { background: var(--white); padding-block: clamp(44px, 6cqw, 76px) clamp(58px, 8cqw, 96px); scroll-margin-top: 76px; }
.swork-showcase .swork-canvas .landing-shell .hero-grid { grid-template-columns: minmax(0px, 1fr) minmax(360px, 0.95fr); align-items: center; gap: clamp(36px, 5cqw, 64px); display: grid; }
.swork-showcase .swork-canvas .landing-shell .eyebrow { color: var(--accent); letter-spacing: 0.08em; text-transform: uppercase; margin: 0px 0px 12px; font-size: 13px; font-weight: 600; }
.swork-showcase .swork-canvas .landing-shell .hero-copy .swork-heading-1 { max-width: 20ch; color: var(--ink); letter-spacing: -0.015em; text-wrap: pretty; margin-bottom: 20px; font-size: clamp(34px, 4.3cqw, 48px); font-weight: 500; line-height: 1.12; }
.swork-showcase .swork-canvas .landing-shell .hero-title:focus,
.swork-showcase .swork-canvas .landing-shell .hero-title:focus-visible { box-shadow: none; border: 0px; outline: 0px; }
.swork-showcase .swork-canvas .landing-shell .hero-lead { max-width: 60ch; color: var(--body); margin-bottom: 26px; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .button-row { flex-wrap: wrap; gap: 14px; margin-bottom: 22px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .trust-row { color: var(--body); flex-wrap: wrap; gap: 12px 24px; font-size: 15px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .trust-row span { align-items: center; gap: 6px; display: inline-flex; }
.swork-showcase .swork-canvas .landing-shell .trust-row .swork-icon { color: var(--accent); }
.swork-showcase .swork-canvas .landing-shell .hero-media { position: relative; }
.swork-showcase .swork-canvas .landing-shell .hero-media > img { aspect-ratio: 4 / 3; object-fit: cover; background: var(--surface); border-radius: 12px; width: 100%; display: block; }
.swork-showcase .swork-canvas .landing-shell .hero-note { border: 1px solid var(--line); box-shadow: var(--shadow-sm); background: rgba(255, 255, 255, 0.96); border-radius: 10px; align-items: flex-start; gap: 12px; padding: 15px 18px; display: flex; position: absolute; bottom: -22px; left: 18px; right: 18px; }
.swork-showcase .swork-canvas .landing-shell .hero-note strong,
.swork-showcase .swork-canvas .landing-shell .hero-note span { display: block; }
.swork-showcase .swork-canvas .landing-shell .hero-note strong { color: var(--ink); font-size: 15px; }
.swork-showcase .swork-canvas .landing-shell .hero-note span { color: var(--body); font-size: 13px; line-height: 1.45; }
.swork-showcase .swork-canvas .landing-shell .review-strip { border-block: 1px solid var(--line); background: var(--surface); }
.swork-showcase .swork-canvas .landing-shell .review-strip-content { padding-block: 30px 32px; }
.swork-showcase .swork-canvas .landing-shell .review-strip-head { justify-content: space-between; align-items: flex-start; gap: 20px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .review-score { align-items: flex-start; gap: 12px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .review-score > strong { font-size: 30px; font-weight: 500; line-height: 1; }
.swork-showcase .swork-canvas .landing-shell .review-score > div > span,
.swork-showcase .swork-canvas .landing-shell .review-card > p { color: var(--muted); font-size: 14px; }
.swork-showcase .swork-canvas .landing-shell .star-rating { color: var(--accent); gap: 1px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .star-rating .swork-icon { width: 17px; height: 17px; font-size: 17px; }
.swork-showcase .swork-canvas .landing-shell .star-rating .star-muted { opacity: 0.35; }
.swork-showcase .swork-canvas .landing-shell .star-rating .star-half { display: grid; }
.swork-showcase .swork-canvas .landing-shell .star-rating .star-half .swork-icon { grid-area: 1 / 1; }
.swork-showcase .swork-canvas .landing-shell .star-rating .star-half-fill { clip-path: inset(0px 50% 0px 0px); }
.swork-showcase .swork-canvas .landing-shell .review-card-grid { --review-card-gap: 20px; grid-template-columns: repeat(var(--review-page-size), minmax(0, 1fr)); gap: var(--review-card-gap); display: grid; }
.swork-showcase .swork-canvas .landing-shell .review-viewport { margin-top: 20px; }
.swork-showcase .swork-canvas .landing-shell .review-card { background: var(--white); border: 1px solid rgba(231, 236, 241, 0.65); border-radius: 12px; flex-direction: column; min-height: 184px; padding: 20px; display: flex; box-shadow: rgba(16, 42, 76, 0.024) 0px 5px 16px; }
.swork-showcase .swork-canvas .landing-shell .review-card blockquote { color: var(--ink); text-wrap: pretty; white-space-collapse: preserve; flex: 1 1 0%; margin: 12px 0px 16px; font-size: 16px; line-height: 1.55; }
.swork-showcase .swork-canvas .landing-shell .review-card > p { margin-bottom: 0px; line-height: 1.45; }
.swork-showcase .swork-canvas .landing-shell .review-card > p .swork-link { color: inherit; text-underline-offset: 3px; }
.swork-showcase .swork-canvas .landing-shell .sr-only { clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; width: 1px; height: 1px; margin: -1px; padding: 0px; position: absolute; overflow: hidden; }
.swork-showcase .swork-canvas .landing-shell .job-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .job-card { background: var(--surface); height: 100%; box-shadow: none; border: 1px solid rgba(0, 0, 0, 0); border-radius: 12px; flex-direction: column; transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s; display: flex; overflow: hidden; }
.swork-showcase .swork-canvas .landing-shell .job-card:hover { border-color: var(--tone-d9e1e8); box-shadow: var(--shadow-sm); transform: translateY(-3px); }
.swork-showcase .swork-canvas .landing-shell .job-card .card-content { flex: 1 1 0%; padding: 24px 24px 12px; }
.swork-showcase .swork-canvas .landing-shell .job-card .card-actions { padding: 0px 24px 24px; }
.swork-showcase .swork-canvas .landing-shell .job-meta { color: var(--muted); justify-content: space-between; gap: 12px; margin-bottom: 12px; font-size: 12px; font-weight: 500; display: flex; }
.swork-showcase .swork-canvas .landing-shell .job-card .swork-heading-3 { margin-bottom: 2px; font-size: 20px; font-weight: 500; }
.swork-showcase .swork-canvas .landing-shell .job-rate { margin-bottom: 0px; font-size: 28px; font-weight: 600; line-height: 1.15; }
.swork-showcase .swork-canvas .landing-shell .job-rate-label { color: var(--muted); margin-bottom: 18px; font-size: 13px; }
.swork-showcase .swork-canvas .landing-shell .job-facts { border-top: 1px solid var(--line); grid-template-columns: 112px 1fr; gap: 9px 12px; margin: 0px; padding-top: 18px; font-size: 15px; line-height: 1.45; display: grid; }
.swork-showcase .swork-canvas .landing-shell .job-facts dt { color: var(--muted); }
.swork-showcase .swork-canvas .landing-shell .job-facts dd { color: var(--ink); margin: 0px; }
.swork-showcase .swork-canvas .landing-shell .section-tail { border-top: 1px solid var(--line); flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 24px; margin-top: 24px; padding-top: 20px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .section-tail p { color: var(--muted); margin-bottom: 0px; font-size: 15px; }
.swork-showcase .swork-canvas .landing-shell .benefit-primary-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 24px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .benefit-support-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .benefit-tier-divider { border-color: var(--line); margin-block: 40px 28px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card,
.swork-showcase .swork-canvas .landing-shell .benefit-card-surface { height: 100%; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-surface { border: 1px solid var(--line); background: var(--white); }
.swork-showcase .swork-canvas .landing-shell .benefit-card-primary .benefit-card-surface { border-radius: 12px; flex-direction: column; padding: 28px; display: flex; box-shadow: rgba(16, 42, 76, 0.055) 0px 10px 24px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .benefit-card-surface { box-shadow: none; border-radius: 10px; grid-template-columns: 40px minmax(0px, 1fr); align-items: start; gap: 16px; padding: 20px 22px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .benefit-icon-tile { background: var(--primary-soft); width: 48px; height: 48px; color: var(--primary); border-radius: 10px; flex: 0 0 auto; justify-content: center; align-items: center; margin-bottom: 18px; display: inline-flex; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .benefit-icon-tile { background: var(--tone-eef3f8); width: 40px; height: 40px; color: var(--ink); border-radius: 8px; margin: 0px; }
.swork-showcase .swork-canvas .landing-shell .benefit-icon-tile .swork-icon { font-size: 24px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .benefit-icon-tile .swork-icon { font-size: 21px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card .swork-heading-3 { color: var(--ink); text-wrap: pretty; margin-bottom: 8px; font-size: 20px; font-weight: 600; line-height: 1.3; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .swork-heading-3 { font-size: 18px; }
.swork-showcase .swork-canvas .landing-shell .benefit-value-title { flex-wrap: wrap; align-items: baseline; gap: 4px 8px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .benefit-value-title > span { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 28px; }
.swork-showcase .swork-canvas .landing-shell .benefit-value-title > small { font-size: 15px; font-weight: 500; }
.swork-showcase .swork-canvas .landing-shell .benefit-card p { color: var(--body); text-wrap: pretty; margin-bottom: 0px; font-size: 16px; line-height: 1.6; }
.swork-showcase .swork-canvas .landing-shell .hero-copy .eyebrow { color: var(--secondary-dark); }
.swork-showcase .swork-canvas .landing-shell .departure-grid { grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 22px; margin: 0px; padding: 0px; list-style: none; display: grid; }
.swork-showcase .swork-canvas .landing-shell .departure-grid img { aspect-ratio: 3 / 2; object-fit: cover; background: var(--line); border-radius: 12px; width: 100%; display: block; }
.swork-showcase .swork-canvas .landing-shell .step-marker { align-items: center; gap: 10px; margin: 16px 0px 10px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .step-marker span { border: 1px solid var(--line); background: var(--white); border-radius: 50%; flex: 0 0 auto; place-items: center; width: 27px; height: 27px; font-size: 12px; font-weight: 500; display: grid; }
.swork-showcase .swork-canvas .landing-shell .step-marker i { background: var(--line); width: 100%; height: 1px; }
.swork-showcase .swork-canvas .landing-shell .departure-grid .swork-heading-3 { margin-bottom: 6px; font-size: 20px; font-weight: 500; }
.swork-showcase .swork-canvas .landing-shell .departure-grid p { color: var(--body); margin-bottom: 0px; font-size: 15px; line-height: 1.5; }
.swork-showcase .swork-canvas .landing-shell .calculator-section { background: var(--primary-soft); }
.swork-showcase .swork-canvas .landing-shell .calculator-grid { grid-template-columns: minmax(0px, 1fr) minmax(330px, 0.9fr); align-items: start; gap: clamp(28px, 5cqw, 64px); display: grid; }
.swork-showcase .swork-canvas .landing-shell .calculator-fields { gap: 25px; padding-top: 4px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .calculator-language-label { color: var(--body); margin-bottom: 8px; font-size: 15px; display: block; }
.swork-showcase .swork-canvas .landing-shell .calculator-field > strong { margin-top: 8px; font-size: 18px; font-weight: 500; display: block; }
.swork-showcase .swork-canvas .landing-shell .calculator-divider { border-top: 1px solid var(--line); padding-top: 22px; }
.swork-showcase .swork-canvas .landing-shell .calculator-field .field-shell { background: 0px 0px; }
.swork-showcase .swork-canvas .landing-shell .calculator-field > .form-field { margin-block: 8px 4px; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider { --snapping-slider-progress: 0%; align-items: center; height: 28px; display: flex; position: relative; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-track,
.swork-showcase .swork-canvas .landing-shell .snapping-slider-fill { pointer-events: none; border-radius: 99px; height: 3px; position: absolute; left: 0px; right: 0px; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-track { background: var(--tone-d8c9e3); }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-fill { width: var(--snapping-slider-progress); background: var(--primary); right: auto; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-input { z-index: 1; appearance: none; cursor: grab; touch-action: pan-y; background: 0px 0px; width: 100%; height: 28px; margin: 0px; position: relative; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-input:active { cursor: grabbing; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-input::-webkit-slider-runnable-track { background: 0px 0px; height: 3px; }
.swork-showcase .swork-canvas .landing-shell .snapping-slider-input::-webkit-slider-thumb { appearance: none; background: var(--primary); width: 14px; height: 14px; box-shadow: 0 0 0 1px var(--white), 0 2px 5px #5a2d8238; border: 0px; border-radius: 50%; margin-top: -5.5px; }
.swork-showcase .swork-canvas .landing-shell .slider-labels { color: var(--muted); justify-content: space-between; gap: 6px; font-size: 12px; font-weight: 500; display: flex; }
.swork-showcase .swork-canvas .landing-shell .slider-label-button { color: inherit; font: inherit; cursor: pointer; background: 0px 0px; border: 0px; padding: 2px 0px; }
.swork-showcase .swork-canvas .landing-shell .slider-label-button:hover,
.swork-showcase .swork-canvas .landing-shell .slider-label-button.active { color: var(--primary); }
.swork-showcase .swork-canvas .landing-shell .earnings-result { background: var(--white); border-radius: 12px; padding: 28px; }
.swork-showcase .swork-canvas .landing-shell .earnings-result p { color: var(--body); margin-bottom: 0px; font-size: 15px; line-height: 1.55; }
.swork-showcase .swork-canvas .landing-shell .earnings-result .result-label { color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 10px; font-size: 12px; font-weight: 500; }
.swork-showcase .swork-canvas .landing-shell .earnings-result .result-eur { color: var(--ink); margin-bottom: 4px; font-size: clamp(38px, 5cqw, 52px); font-weight: 500; line-height: 1.1; }
.swork-showcase .swork-canvas .landing-shell .earnings-result .result-pln { margin-bottom: 20px; font-size: 18px; }
.swork-showcase .swork-canvas .landing-shell .earnings-result .result-note { color: var(--muted); font-size: 12px; }
.swork-showcase .swork-canvas .landing-shell .earnings-result .block-button { margin-top: 12px; }
.swork-showcase .swork-canvas .landing-shell .text-action { text-align: center; width: 100%; color: var(--primary); font: inherit; cursor: pointer; background: 0px 0px; border: 0px; margin-top: 10px; padding: 4px; text-decoration: underline; display: block; }
@media (hover: hover) and (pointer: fine) {
.swork-showcase .swork-canvas .landing-shell .benefit-card:hover .benefit-card-surface { border-color: var(--tone-d9e1e8); box-shadow: var(--shadow-sm); }
.swork-showcase .swork-canvas .landing-shell .departure-grid li:hover img { box-shadow: var(--shadow-sm); }
.swork-showcase .swork-canvas .landing-shell .departure-grid li:hover .step-marker span { border-color: var(--primary); background: var(--primary); color: var(--white); }
.swork-showcase .swork-canvas .landing-shell .departure-grid li:hover .step-marker i { background: var(--tone-d8c8e5); }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
.swork-showcase .swork-canvas .landing-shell .benefit-card-surface,
.swork-showcase .swork-canvas .landing-shell .departure-grid li,
.swork-showcase .swork-canvas .landing-shell .departure-grid img,
.swork-showcase .swork-canvas .landing-shell .step-marker span,
.swork-showcase .swork-canvas .landing-shell .step-marker i { transition: transform 0.2s, border-color 0.2s, background-color 0.2s, color 0.2s, box-shadow 0.2s; }
.swork-showcase .swork-canvas .landing-shell .benefit-card:hover .benefit-card-surface { transform: translateY(-3px); }
.swork-showcase .swork-canvas .landing-shell .departure-grid li:hover { transform: translateY(-2px); }
}
.swork-showcase .swork-canvas .landing-shell .faq-section { background: var(--white); }
.swork-showcase .swork-canvas .landing-shell .faq-list { border-top: 1px solid var(--line); box-shadow: none; border-radius: 0px; }
.swork-showcase .swork-canvas .landing-shell .faq-item { border-bottom: 1px solid var(--line); box-shadow: none; border-radius: 0px; }
.swork-showcase .swork-canvas .landing-shell .faq-item .faq-summary { min-height: 68px; color: var(--ink); padding: 18px 0px; font-size: 19px; font-weight: 500; line-height: 1.4; }
.swork-showcase .swork-canvas .landing-shell .faq-item .faq-answer { padding: 0px 0px 20px; }
.swork-showcase .swork-canvas .landing-shell .faq-item .faq-answer p { color: var(--body); margin: 0px; font-size: 17px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .contact-section { border-top: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .contact-grid { grid-template-columns: minmax(0px, 1fr) minmax(340px, 0.9fr); align-items: start; gap: clamp(36px, 5cqw, 64px); display: grid; }
.swork-showcase .swork-canvas .landing-shell .contact-form { gap: 15px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .form-privacy-note { color: var(--muted); margin: 0px; font-size: 13px; line-height: 1.5; }
.swork-showcase .swork-canvas .landing-shell .form-privacy-note .swork-link,
.swork-showcase .swork-canvas .landing-shell .map-consent .swork-link { color: var(--primary); font-weight: 500; }
.swork-showcase .swork-canvas .landing-shell .form-submit.swork-button { justify-self: start; }
.swork-showcase .swork-canvas .landing-shell .field-error { color: var(--error); margin: 6px 0px 0px; font-size: 13px; }
.swork-showcase .swork-canvas .landing-shell .contact-card { background: var(--surface); border-radius: 12px; gap: 20px; padding: 26px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .contact-card p { color: var(--body); margin-bottom: 0px; font-size: 15px; line-height: 1.55; }
.swork-showcase .swork-canvas .landing-shell .small-label { color: var(--muted); margin-bottom: 6px; font-size: 12px; font-weight: 500; display: block; }
.swork-showcase .swork-canvas .landing-shell .social-links { align-items: center; gap: 10px; margin-top: 14px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .social-link { border: 1px solid var(--line); background: var(--white); border-radius: 10px; place-items: center; width: 40px; height: 40px; margin: 0px; transition: background-color 0.18s, border-color 0.18s, transform 0.18s; display: grid; }
.swork-showcase .swork-canvas .landing-shell .social-link:hover { border-color: var(--tone-d6dde5); background: var(--surface); text-decoration: none; transform: translateY(-2px); }
.swork-showcase .swork-canvas .landing-shell .social-link .swork-icon { font-size: 22px; }
.swork-showcase .swork-canvas .landing-shell .facebook-link { color: var(--tone-1877f2); }
.swork-showcase .swork-canvas .landing-shell .instagram-link { color: var(--tone-c13584); }
.swork-showcase .swork-canvas .landing-shell .contact-card-block { border-top: 1px solid var(--line); padding-top: 20px; }
.swork-showcase .swork-canvas .landing-shell .emergency-contact { grid-template-columns: auto minmax(0px, 1fr); gap: 12px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .emergency-contact > .swork-icon { color: var(--primary); margin-top: 2px; }
.swork-showcase .swork-canvas .landing-shell .office-grid { grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0px 14px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .office-grid > img,
.swork-showcase .swork-canvas .landing-shell .map-frame { aspect-ratio: 4 / 3; background: var(--tone-eef1f4); border-radius: 10px; width: 100%; overflow: hidden; }
.swork-showcase .swork-canvas .landing-shell .office-grid > img { object-fit: cover; object-position: center 62%; }
.swork-showcase .swork-canvas .landing-shell .map-consent { text-align: center; flex-direction: column; justify-content: center; align-items: center; gap: 7px; height: 100%; padding: 12px; display: flex; }
.swork-showcase .swork-canvas .landing-shell .map-consent span { color: var(--body); font-size: 12px; line-height: 1.35; }
.swork-showcase .swork-canvas .landing-shell [data-map-withdrawal] { margin-top: 8px; }
@media (prefers-reduced-motion: no-preference) {
.swork-showcase .swork-canvas .landing-shell .hero-media > img,
.swork-showcase .swork-canvas .landing-shell .benefit-card { animation: 0.5s ease 0s 1 normal both running landing-reveal; }
}
@container swork-viewport (max-width: 1080px) {
.swork-showcase .swork-canvas .landing-shell .departure-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@container swork-viewport (max-width: 860px) {
.swork-showcase .swork-canvas .landing-shell .hero-grid,
.swork-showcase .swork-canvas .landing-shell .calculator-grid,
.swork-showcase .swork-canvas .landing-shell .contact-grid { grid-template-columns: 1fr; }
.swork-showcase .swork-canvas .landing-shell .hero-media { max-width: 660px; }
.swork-showcase .swork-canvas .landing-shell .job-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
.swork-showcase .swork-canvas .landing-shell .benefit-primary-grid { gap: 16px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-primary .benefit-card-surface { padding: 22px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card .swork-heading-3 { font-size: 18px; }
.swork-showcase .swork-canvas .landing-shell .benefit-value-title > span { font-size: 24px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card p { font-size: 15px; }
}
@container swork-viewport (max-width: 719px) {
.swork-showcase .swork-canvas .landing-shell .benefit-primary-grid { grid-template-columns: 1fr; }
}
@container swork-viewport (max-width: 640px) {
.swork-showcase .swork-canvas .landing-shell { font-size: 16px; }
.swork-showcase .swork-canvas .landing-shell .landing-page { padding-bottom: 130px; }
.swork-showcase .swork-canvas .landing-shell .landing-container,
.swork-showcase .swork-canvas .landing-shell .narrow-container { padding-inline: 16px; }
.swork-showcase .swork-canvas .landing-shell .de-page { --de-gutter: 16px; }
.swork-showcase .swork-canvas .landing-shell .hero-section { padding-top: 38px; }
.swork-showcase .swork-canvas .landing-shell .hero-copy .swork-heading-1 { font-size: 34px; }
.swork-showcase .swork-canvas .landing-shell .button-row { display: grid; }
.swork-showcase .swork-canvas .landing-shell .button-row .swork-button { width: 100%; }
.swork-showcase .swork-canvas .landing-shell .trust-row { gap: 8px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .hero-note { margin-top: 10px; position: static; }
.swork-showcase .swork-canvas .landing-shell .review-card-grid { --review-card-gap: 12px; grid-template-columns: 1fr; }
.swork-showcase .swork-canvas .landing-shell .review-card { min-height: 0px; }
.swork-showcase .swork-canvas .landing-shell .job-grid,
.swork-showcase .swork-canvas .landing-shell .departure-grid { grid-template-columns: 1fr; }
.swork-showcase .swork-canvas .landing-shell .benefit-support-grid { grid-template-columns: 1fr; gap: 16px; }
.swork-showcase .swork-canvas .landing-shell .benefit-tier-divider { margin-block: 28px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-primary .benefit-card-surface { padding: 24px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .benefit-card-surface { padding: 18px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card .swork-heading-3,
.swork-showcase .swork-canvas .landing-shell .benefit-card-supporting .swork-heading-3 { font-size: 19px; }
.swork-showcase .swork-canvas .landing-shell .benefit-value-title > span { font-size: 26px; }
.swork-showcase .swork-canvas .landing-shell .benefit-card p { font-size: 16px; }
.swork-showcase .swork-canvas .landing-shell .section-tail { flex-direction: column; align-items: stretch; }
.swork-showcase .swork-canvas .landing-shell .section-tail .swork-button { width: 100%; }
.swork-showcase .swork-canvas .landing-shell .job-facts { grid-template-columns: 100px 1fr; }
.swork-showcase .swork-canvas .landing-shell .departure-grid { gap: 32px; }
.swork-showcase .swork-canvas .landing-shell .step-marker i { display: none; }
.swork-showcase .swork-canvas .landing-shell .slider-labels { gap: 4px; font-size: 13px; }
.swork-showcase .swork-canvas .landing-shell .office-grid { grid-template-columns: 1fr; }
}
.swork-showcase .swork-canvas .landing-shell .job-card .swork-heading-3 .swork-link { color: inherit; text-decoration: none; }
.swork-showcase .swork-canvas .landing-shell .job-card .swork-heading-3 .swork-link:hover,
.swork-showcase .swork-canvas .landing-shell .job-card .swork-heading-3 .swork-link:focus-visible { text-decoration: underline; }
.swork-showcase .swork-canvas .landing-shell .de-page { --de-max: 1160px; --de-gutter: 20px; --de-section: 104px; --de-h1: clamp(34px, 4.3cqw, 48px); --de-h2: clamp(26px, 3cqw, 34px); --de-num: 88px; --de-hero-cols: 1.12fr .88fr; --de-cols-2: repeat(2, minmax(0, 1fr)); --de-cols-3: repeat(3, minmax(0, 1fr)); --de-cols-4: repeat(4, minmax(0, 1fr)); --de-cols-5: repeat(5, minmax(0, 1fr)); }
.swork-showcase .swork-canvas .landing-shell .de-section > :is(.de-hero-grid, .de-one-grid, .de-about-grid, .de-faq),
.swork-showcase .swork-canvas .landing-shell .de-section > :is(p, .swork-heading-2, ul, ol, dl, div, article):not(.de-hero-grid):not(.de-one-grid):not(.de-about-grid) { max-width: var(--de-max); margin-inline: auto; }
.swork-showcase .swork-canvas .landing-shell .de-section { padding: var(--de-section) var(--de-gutter); }
.swork-showcase .swork-canvas .landing-shell .de-section-tight-top { padding-top: 0px; }
.swork-showcase .swork-canvas .landing-shell .de-section-soft { background: var(--surface); }
.swork-showcase .swork-canvas .landing-shell .de-section-experience { background: var(--surface); border-block: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .de-section-bordered { border-top: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .de-section-ink { background: var(--ink); color: var(--white); }
.swork-showcase .swork-canvas .landing-shell .de-eyebrow { color: var(--accent); letter-spacing: 0.08em; text-transform: uppercase; margin: 0px 0px 12px; font-size: 13px; font-weight: 600; }
.swork-showcase .swork-canvas .landing-shell .de-eyebrow-accent { color: var(--primary); }
.swork-showcase .swork-canvas .landing-shell .de-eyebrow-on-ink { color: var(--tone-9db8cc); }
.swork-showcase .swork-canvas .landing-shell .de-title,
.swork-showcase .swork-canvas .landing-shell .de-hero-title { max-width: 26ch; color: var(--ink); font-size: var(--de-h2); letter-spacing: -0.01em; text-wrap: pretty; margin: 0px 0px 12px; font-weight: 500; line-height: 1.2; }
.swork-showcase .swork-canvas .landing-shell .de-hero-title { max-width: 20ch; font-size: var(--de-h1); letter-spacing: -0.015em; margin-bottom: 20px; line-height: 1.12; }
.swork-showcase .swork-canvas .landing-shell .de-title-on-ink { color: var(--white); }
.swork-showcase .swork-canvas .landing-shell .de-hero-lead,
.swork-showcase .swork-canvas .landing-shell .de-lead { max-width: 60ch; color: var(--body); text-wrap: pretty; margin: 0px 0px 26px; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .de-lead-on-ink { color: var(--tone-d6e2eb); margin-bottom: 0px; font-size: 18px; }
.swork-showcase .swork-canvas .landing-shell .de-hero-highlight { border-left: 2px solid var(--tone-dfcfea); max-width: 44ch; color: var(--ink); text-wrap: pretty; margin: 0px; padding-left: 24px; font-size: 18px; font-weight: 500; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .de-hero-grid,
.swork-showcase .swork-canvas .landing-shell .de-one-grid,
.swork-showcase .swork-canvas .landing-shell .de-about-grid { grid-template-columns: var(--de-hero-cols); align-items: start; gap: 64px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .de-figure { margin: 0px; }
.swork-showcase .swork-canvas .landing-shell .de-figure img { aspect-ratio: 4 / 5; object-fit: cover; border: 1px solid var(--line); background: var(--surface); border-radius: 12px; width: 100%; height: auto; display: block; }
.swork-showcase .swork-canvas .landing-shell .de-stat-grid,
.swork-showcase .swork-canvas .landing-shell .de-support-grid,
.swork-showcase .swork-canvas .landing-shell .de-meaning-grid { grid-template-columns: var(--de-cols-2); gap: 0px 72px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .de-plain-list li,
.swork-showcase .swork-canvas .landing-shell .de-ink-list li,
.swork-showcase .swork-canvas .landing-shell .de-boundary-grid p { border-top: 1px solid var(--line); color: var(--ink); margin: 0px; padding: 18px 0px; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .de-plain-list li:last-child,
.swork-showcase .swork-canvas .landing-shell .de-ink-list li:last-child { border-bottom: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .de-stat { border-top: 1px solid var(--line); padding-top: 26px; position: relative; }
.swork-showcase .swork-canvas .landing-shell .de-stat-value { color: var(--ink); font-size: var(--de-num); font-variant-numeric: tabular-nums; letter-spacing: -0.025em; font-weight: 300; line-height: 1; display: inline-block; }
.swork-showcase .swork-canvas .landing-shell .de-stat-caption { max-width: 26ch; color: var(--ink); margin: 20px 0px 0px; font-size: 18px; line-height: 1.6; }
.swork-showcase .swork-canvas .landing-shell .de-note { max-width: 74ch; color: var(--muted); margin: 48px 0px 0px; font-size: 15px; line-height: 1.7; }
.swork-showcase .swork-canvas .landing-shell .de-meaning-grid { border: 1px solid var(--line); background: var(--line); border-radius: 12px; gap: 1px; margin-top: 48px; overflow: hidden; }
.swork-showcase .swork-canvas .landing-shell .de-meaning-grid > div,
.swork-showcase .swork-canvas .landing-shell .de-pillar,
.swork-showcase .swork-canvas .landing-shell .de-panel { background: var(--white); }
.swork-showcase .swork-canvas .landing-shell .de-meaning-grid > div { padding: 30px 32px; }
.swork-showcase .swork-canvas .landing-shell .de-card-title,
.swork-showcase .swork-canvas .landing-shell .de-pillar .swork-heading-3,
.swork-showcase .swork-canvas .landing-shell .de-panel .swork-heading-3,
.swork-showcase .swork-canvas .landing-shell .de-process-grid .swork-heading-3 { color: var(--ink); margin: 0px 0px 12px; font-size: 18px; font-weight: 500; line-height: 1.4; }
.swork-showcase .swork-canvas .landing-shell .de-meaning-grid p,
.swork-showcase .swork-canvas .landing-shell .de-pillar p,
.swork-showcase .swork-canvas .landing-shell .de-process-grid p { color: var(--body); margin: 0px; font-size: 18px; line-height: 1.65; }
.swork-showcase .swork-canvas .landing-shell .de-pillar-grid,
.swork-showcase .swork-canvas .landing-shell .de-partner-grid { border: 1px solid var(--line); background: var(--line); border-radius: 12px; gap: 1px; display: grid; overflow: hidden; }
.swork-showcase .swork-canvas .landing-shell .de-pillar-grid { grid-template-columns: var(--de-cols-4); }
.swork-showcase .swork-canvas .landing-shell .de-partner-grid { grid-template-columns: var(--de-cols-3); }
.swork-showcase .swork-canvas .landing-shell .de-pillar { padding: 32px 28px 36px; }
.swork-showcase .swork-canvas .landing-shell .de-pillar::before { content: ""; background: var(--primary); width: 22px; height: 2px; margin-bottom: 22px; display: block; }
.swork-showcase .swork-canvas .landing-shell .de-partner-grid .de-pillar::before { display: none; }
.swork-showcase .swork-canvas .landing-shell .de-panel { border: 1px solid var(--line); box-shadow: var(--shadow-sm); border-radius: 12px; padding: 40px 36px 44px; }
.swork-showcase .swork-canvas .landing-shell .de-panel .swork-heading-3 { margin-bottom: 26px; font-size: 18px; }
.swork-showcase .swork-canvas .landing-shell .de-plain-list,
.swork-showcase .swork-canvas .landing-shell .de-ink-list,
.swork-showcase .swork-canvas .landing-shell .de-process-grid { margin: 0px; padding: 0px; list-style: none; }
.swork-showcase .swork-canvas .landing-shell .de-boundary { margin-top: 32px; }
.swork-showcase .swork-canvas .landing-shell .de-boundary-grid { grid-template-columns: var(--de-cols-3); gap: 0px 40px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .de-one-grid { max-width: var(--de-max); margin-inline: auto; }
.swork-showcase .swork-canvas .landing-shell .de-ink-list li { color: var(--tone-eaf1f6); border-color: var(--de-ink-line); }
.swork-showcase .swork-canvas .landing-shell .de-process-grid { grid-template-columns: var(--de-cols-5); gap: 36px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .de-process-grid li { border-top: 1px solid var(--line); padding-top: 22px; }
.swork-showcase .swork-canvas .landing-shell .de-process-grid li:first-child { border-top: 2px solid var(--primary); }
.swork-showcase .swork-canvas .landing-shell .de-process-number { color: var(--tone-9aacb9); font-variant-numeric: tabular-nums; margin-bottom: 18px; font-size: 34px; font-weight: 300; line-height: 1; display: block; }
.swork-showcase .swork-canvas .landing-shell .de-definition-list { border-top: 1px solid var(--line); margin: 0px; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row { border-bottom: 1px solid var(--line); grid-template-columns: minmax(200px, 0.34fr) minmax(0px, 1fr); gap: 0px 24px; display: grid; }
.swork-showcase .swork-canvas .landing-shell .de-definition-list-compact .de-definition-row { grid-template-columns: minmax(150px, 0.42fr) minmax(0px, 1fr); }
.swork-showcase .swork-canvas .landing-shell .de-definition-row dt,
.swork-showcase .swork-canvas .landing-shell .de-definition-row dd { margin: 0px; padding: 22px 0px; font-size: 16px; line-height: 1.68; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row dt { color: var(--ink); font-size: 15px; font-weight: 600; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row dd { color: var(--body); }
.swork-showcase .swork-canvas .landing-shell .de-faq { max-width: 900px; }
.swork-showcase .swork-canvas .landing-shell .de-faq-item { border-top: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .de-faq-item:last-child { border-bottom: 1px solid var(--line); }
.swork-showcase .swork-canvas .landing-shell .de-faq-item summary { cursor: pointer; color: var(--ink); padding: 22px 0px 22px 10px; font-size: 18px; font-weight: 500; line-height: 1.5; }
.swork-showcase .swork-canvas .landing-shell .de-faq-item p { max-width: 70ch; color: var(--body); margin: 0px; padding: 0px 0px 26px 10px; font-size: 18px; line-height: 1.65; }
@container swork-viewport (max-width: 1180px) {
.swork-showcase .swork-canvas .landing-shell .de-page { --de-num: 70px; --de-hero-cols: 1fr; --de-cols-4: repeat(2, minmax(0, 1fr)); --de-cols-5: repeat(2, minmax(0, 1fr)); }
.swork-showcase .swork-canvas .landing-shell .de-hero-grid > .de-figure { justify-self: center; width: 100%; max-width: 480px; }
}
@container swork-viewport (max-width: 760px) {
.swork-showcase .swork-canvas .landing-shell .de-page { --de-section: 64px; --de-num: 56px; --de-cols-2: 1fr; --de-cols-3: 1fr; --de-cols-4: 1fr; --de-cols-5: 1fr; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row,
.swork-showcase .swork-canvas .landing-shell .de-definition-list-compact .de-definition-row { grid-template-columns: 1fr; gap: 0px; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row dt { padding-bottom: 6px; }
.swork-showcase .swork-canvas .landing-shell .de-definition-row dd { padding-top: 0px; }
}
.swork-showcase .swork-canvas .landing-shell .review-strip { scroll-margin-top: 88px; }
.swork-showcase .swork-canvas .field-label-compact { display: none; }
.swork-showcase .swork-canvas .phone-fields { gap: calc(var(--spacing) * 2); flex-wrap: wrap; min-width: 0px; display: flex; }
.swork-showcase .swork-canvas .phone-fields > .form-field { flex: 1 1 128px; }
.swork-showcase .swork-canvas .phone-fields > .field-select { flex-basis: 160px; }
.swork-showcase .swork-canvas .swork-button { justify-content: center; align-items: center; gap: calc(var(--spacing) * 2); border-style: var(--tw-border-style); --tw-leading: 1.3; --tw-font-weight: var(--font-weight-medium); min-height: 46px; font-size: 15px; line-height: 1.3; font-weight: var(--font-weight-medium); transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); border-width: 1px; border-radius: 8px; padding-block: 11px; padding-inline: 22px; text-decoration-line: none; display: inline-flex; }
.swork-showcase .swork-canvas .swork-button:disabled { cursor: not-allowed; }
.swork-showcase .swork-canvas .swork-button.button-primary { background-color: var(--primary); color: var(--white); border-color: rgba(0, 0, 0, 0); }
@media (hover: hover) {
.swork-showcase .swork-canvas .swork-button.button-primary:hover { background-color: var(--primary-dark); }
}
.swork-showcase .swork-canvas .swork-button.button-outline { border-color: var(--primary); color: var(--primary); background-color: rgba(0, 0, 0, 0); }
@media (hover: hover) {
.swork-showcase .swork-canvas .swork-button.button-outline:hover { background-color: var(--primary-soft); }
}
.swork-showcase .swork-canvas .swork-button:hover { text-decoration: none; }
.swork-showcase .swork-canvas .swork-icon { vertical-align: middle; flex-shrink: 0; width: 1em; height: 1em; font-size: 24px; display: inline-block; }
.swork-showcase .swork-canvas .swork-icon.icon-sm { font-size: 20px; }
.swork-showcase .swork-canvas .card-content { padding: 16px; }
.swork-showcase .swork-canvas .card-actions { padding: calc(var(--spacing) * 2); align-items: center; display: flex; }
.swork-showcase .swork-canvas .faq-summary,
.swork-showcase .swork-canvas .de-faq-item > summary { justify-content: space-between; align-items: center; gap: calc(var(--spacing) * 4); list-style: none; display: flex; }
.swork-showcase .swork-canvas .faq-summary::-webkit-details-marker { display: none; }
.swork-showcase .swork-canvas .de-faq-item > summary::-webkit-details-marker { display: none; }
.swork-showcase .swork-canvas .disclosure-chevron { color: var(--muted); transition: transform 0.26s cubic-bezier(0.2, 0, 0, 1); }
.swork-showcase .swork-canvas details[open] > summary .disclosure-chevron { transform: rotate(180deg); }
.swork-showcase .swork-canvas .faq-summary:hover,
.swork-showcase .swork-canvas .de-faq-item > summary:hover { color: var(--primary); }
.swork-showcase .swork-canvas .form-field { min-width: 0px; font-size: var(--text-base); line-height: var(--tw-leading,var(--text-base--line-height)); color: var(--body); --field-height: 56px; display: block; position: relative; }
.swork-showcase .swork-canvas .field-shell { min-height: var(--field-height); background: var(--white); border-radius: 8px; position: relative; }
.swork-showcase .swork-canvas .field-shell > input,
.swork-showcase .swork-canvas .field-shell > select { width: 100%; min-width: 0px; height: var(--field-height); border-radius: inherit; padding: calc((var(--field-height) - 24px) / 2) 14px; color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; background: 0px 0px; border: 0px; outline: none; margin: 0px; font-size: 16px; line-height: 24px; display: block; }
.swork-showcase .swork-canvas .landing-shell .field-shell > :is(input, select):focus-visible { outline: none; }
.swork-showcase .swork-canvas .field-label { z-index: 1; max-width: calc(100% - 40px); color: var(--body); transform-origin: 0px center; white-space: nowrap; text-overflow: ellipsis; pointer-events: none; margin: 0px; font-size: 16px; font-weight: 400; line-height: 24px; transition: top 0.18s cubic-bezier(0.2, 0, 0, 1), transform 0.18s cubic-bezier(0.2, 0, 0, 1), color 0.18s; position: absolute; top: 50%; left: 14px; overflow: hidden; transform: translateY(-50%); }
.swork-showcase .swork-canvas .field-date .field-label { max-width: calc(100% - 60px); }
.swork-showcase .swork-canvas .field-outline { border: 2px solid var(--line-input); border-radius: inherit; pointer-events: none; min-width: 0px; margin: 0px; padding: 0px 8px; transition: border-color 0.18s, box-shadow 0.18s; position: absolute; inset: -5px 0px 0px; }
.swork-showcase .swork-canvas .field-outline > legend { white-space: nowrap; opacity: 0; width: auto; max-width: 0.01px; height: 10px; padding: 0px; font-size: 12px; line-height: 10px; transition: max-width 0.18s cubic-bezier(0.2, 0, 0, 1); display: block; overflow: hidden; }
.swork-showcase .swork-canvas .field-outline > legend > span { padding-inline: 4px; }
.swork-showcase .swork-canvas .form-field:is(.field-select, .has-value, :focus-within, :has(input:not([type="date"]):not(:placeholder-shown))) .field-label { max-width: calc(133.333% - 40px); top: 0px; transform: translateY(-50%) scale(0.75); }
.swork-showcase .swork-canvas .form-field:is(.field-select, .has-value, :focus-within, :has(input:not([type="date"]):not(:placeholder-shown))) .field-outline > legend { max-width: 100%; }
.swork-showcase .swork-canvas .form-field:hover .field-outline { border-color: var(--muted); }
.swork-showcase .swork-canvas .form-field:focus-within .field-outline { border: 2px solid var(--primary); }
.swork-showcase .swork-canvas .form-field:focus-within .field-label { color: var(--primary); }
.swork-showcase .swork-canvas .field-select select { appearance: none; cursor: pointer; padding-right: 44px; }
.swork-showcase .swork-canvas .field-select .field-shell::after { content: ""; border-width: 5px 5px 0px; border-style: solid solid none; border-right-color: rgba(0, 0, 0, 0); border-left-color: rgba(0, 0, 0, 0); border-image: none; border-bottom-color: currentcolor; border-top-color: var(--body); pointer-events: none; position: absolute; top: calc(50% - 2px); right: 16px; }
.swork-showcase .swork-canvas .field-date input::-webkit-calendar-picker-indicator { opacity: 0.65; cursor: pointer; }
.swork-showcase .swork-canvas .field-date input:disabled::-webkit-calendar-picker-indicator { cursor: default; }
.swork-showcase .swork-canvas .consent-field { min-height: 48px; color: var(--body); cursor: pointer; align-items: center; gap: 12px; padding: 0px 12px; font-size: 16px; line-height: 1.5; display: flex; }
.swork-showcase .swork-canvas .consent-field input { appearance: none; border: 2px solid var(--primary); width: 18px; height: 18px; color: var(--white); cursor: pointer; background: 0px 0px; border-radius: 2px; flex: 0 0 18px; place-content: center; margin: 15px 3px; transition: background-color 0.16s, box-shadow 0.16s; display: grid; }
.swork-showcase .swork-canvas .consent-field input::before { content: ""; border-bottom: 2px solid; border-left: 2px solid; width: 10px; height: 6px; transition: transform 0.16s; transform: translateY(-1px) rotate(-45deg) scale(0); }
.swork-showcase .swork-canvas .consent-field input:checked { background: var(--primary); }
.swork-showcase .swork-canvas .consent-field input:checked::before { transform: translateY(-1px) rotate(-45deg) scale(1); }
.swork-showcase .swork-canvas .consent-field input:disabled { opacity: 0.5; cursor: default; }
.swork-showcase .swork-canvas .form-fields { gap: 15px; display: grid; }
.swork-showcase .swork-canvas .form-fields > :is(.form-field, .phone-fields) { margin-block: 8px 4px; }
.swork-showcase .swork-canvas .form-consents,
.swork-showcase .swork-canvas .recruitment-form { gap: 15px; display: grid; }
.swork-showcase .swork-canvas .recruitment-form > fieldset { border-style: var(--tw-border-style); border-width: 0px; gap: 15px; min-width: 0px; margin: 0px; padding: 0px; display: grid; }
.swork-showcase .swork-canvas .field-error { font-size: var(--text-sm); line-height: var(--tw-leading,var(--text-sm--line-height)); color: var(--error); margin: 6px 0px 0px; }
@media (forced-colors: active) {
.swork-showcase .swork-canvas .consent-field input:checked { color: highlighttext; forced-color-adjust: none; background: highlight; }
.swork-showcase .swork-canvas .field-outline { border-color: canvastext; }
.swork-showcase .swork-canvas .form-field:focus-within .field-outline { border-color: highlight; }
}
.swork-showcase .swork-canvas .form-feedback { border-style: var(--tw-border-style); border-width: 1px; border-color: var(--error); background-color: var(--white); padding: calc(var(--spacing) * 4); font-size: var(--text-sm); line-height: var(--tw-leading,var(--text-sm--line-height)); color: var(--error); border-radius: 8px; }
.swork-showcase .swork-canvas .form-success { border-style: var(--tw-border-style); border-width: 1px; border-color: var(--success); background-color: var(--surface); padding: calc(var(--spacing) * 5); color: var(--success); border-radius: 8px; }
.swork-showcase .swork-canvas .form-success .swork-heading-3 { margin-bottom: calc(var(--spacing) * 2); font-size: var(--text-xl); line-height: var(--tw-leading,var(--text-xl--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); }
.swork-showcase .swork-canvas .form-success p { margin-bottom: 16px; }
.swork-showcase .swork-canvas .form-privacy-note { margin-bottom: 0px; }
.swork-showcase .swork-canvas .sr-only { clip-path: inset(50%); white-space: nowrap; border-width: 0px; width: 1px; height: 1px; margin: -1px; padding: 0px; position: absolute; overflow: hidden; }
.swork-showcase .swork-canvas .m-0 { margin: 0px; }
.swork-showcase .swork-canvas .min-w-0 { min-width: 0px; }
.swork-showcase .swork-canvas .border-0 { border-style: var(--tw-border-style); border-width: 0px; }
.swork-showcase .swork-canvas .text-accent { color: var(--accent); }
.swork-showcase .swork-canvas .text-primary { color: var(--primary); }
.swork-showcase .swork-canvas .landing-page { min-height: 100cqh; }
.swork-showcase .swork-canvas .demo-nav { height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 12px 65px; border-bottom: 1px solid rgb(237, 240, 243); background: rgb(255, 255, 255); color: rgb(36, 51, 72); font-size: 14px; position: relative; z-index: 3; }
.swork-showcase .swork-canvas .demo-nav img { width: 58px; height: 44px; object-fit: contain; }
.swork-showcase .swork-canvas .shot { position: absolute; left: 0px; right: 0px; top: 72px; height: calc(-72px + 100cqh); overflow: hidden; opacity: 0; visibility: hidden; transition: opacity 0.62s, visibility 0.62s; pointer-events: none; }
.swork-showcase .swork-canvas .shot.active { opacity: 1; visibility: visible; }
.swork-showcase .swork-canvas .shot-content { will-change: transform; }
.swork-showcase .swork-canvas .shot section { margin: 0px !important; scroll-margin: 0px !important; }
.swork-showcase .swork-canvas .shot .landing-section { padding-top: 42px; padding-bottom: 46px; }
.swork-showcase .swork-canvas .shot .hero-section { padding-top: 48px; padding-bottom: 48px; }
.swork-showcase .swork-canvas .shot .de-section { padding-top: 48px; padding-bottom: 48px; }
.swork-showcase .swork-canvas .shot .review-strip { padding: 65px 0px; }
.swork-showcase .swork-canvas .shot .review-card { opacity: 1 !important; transform: none !important; }
.swork-showcase .swork-canvas .shot [data-review-viewport] { overflow: visible !important; }
.swork-showcase .swork-canvas .shot .contact-form-panel input,
.swork-showcase .swork-canvas .shot .contact-form-panel select { opacity: 1; }
.swork-showcase .swork-canvas .shot [data-calculator-eur] { transition: color 0.3s, transform 0.3s; }
.swork-showcase .swork-canvas .shot .review-card-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px; display: grid !important; }
.swork-showcase .swork-canvas .shot .review-viewport { height: auto !important; overflow: visible !important; }
.swork-showcase .swork-canvas .shot .review-card { position: relative !important; display: block !important; height: auto !important; visibility: visible !important; }
@container swork-viewport (max-width: 600px) {
.swork-showcase .swork-canvas .demo-nav { height: 64px; padding: 10px 20px; }
.swork-showcase .swork-canvas .demo-nav img { width: 50px; height: 40px; }
.swork-showcase .swork-canvas .demo-nav span { display: none; }
.swork-showcase .swork-canvas .shot { top: 64px; height: calc(-64px + 100cqh); }
.swork-showcase .swork-canvas .shot .landing-section { padding-top: 30px; padding-bottom: 30px; }
.swork-showcase .swork-canvas .shot .hero-section { padding-top: 30px; padding-bottom: 30px; }
.swork-showcase .swork-canvas .shot .de-section { padding-top: 30px; padding-bottom: 30px; }
.swork-showcase .swork-canvas .shot .review-strip { padding: 30px 0px; }
.swork-showcase .swork-canvas .shot .de-hero-title { font-size: 36px; }
.swork-showcase .swork-canvas .shot .de-hero-lead { font-size: 17px; }
.swork-showcase .swork-canvas .shot .de-hero-highlight { font-size: 17px; }
.swork-showcase .swork-canvas .shot .review-card-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
.swork-showcase .swork-canvas * { animation: auto ease 0s 1 normal none running none !important; transition: none !important; }
}