/* Phase 1: opt-in styles only. Legacy files and tokens are untouched. */
.zynith-page, .editor-styles-wrapper {
    --zynith-ds-primary: #8D2AEA;
    --zynith-ds-on-primary: #FFFFFF;
    --zynith-ds-secondary: #0060D8;
    --zynith-ds-on-secondary: #FFFFFF;
    --zynith-ds-accent: #FF00FA;
    --zynith-ds-on-accent: #000000;
    --zynith-ds-primary-container: #38115E;
    --zynith-ds-on-primary-container: #FFFFFF;
    --zynith-ds-secondary-container: #002656;
    --zynith-ds-on-secondary-container: #FFFFFF;
    --zynith-ds-surface: #121218;
    --zynith-ds-on-surface: #FFFFFF;
    --zynith-ds-surface-variant: #1C1429;
    --zynith-ds-on-surface-variant: #FFFFFF;
    --zynith-ds-outline: #7D7D80;
    --zynith-ds-error: #F2B8B5;
    --zynith-ds-on-error: #000000;
    --zynith-ds-text-soft: rgba(255,255,255,0.78);
    --zynith-ds-text-muted: rgba(255,255,255,0.60);
    --zynith-ds-border: rgba(125,125,128,0.32);
    --zynith-ds-gradient: linear-gradient(135deg, #0060D8 0%, #8D2AEA 55%, #FF00FA 100%);
}

.zynith-page .zynith-ds-card.zynith-ds-card,
.zynith-page .is-style-zynith-ds-card.is-style-zynith-ds-card,
.zynith-page .zynith-ds-feature-card.zynith-ds-feature-card,
.zynith-page .is-style-zynith-ds-feature-card.is-style-zynith-ds-feature-card,
.zynith-page .zynith-ds-media-card.zynith-ds-media-card,
.zynith-page .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card,
.zynith-page .zynith-ds-connected-card.zynith-ds-connected-card,
.zynith-page .is-style-zynith-ds-connected-card.is-style-zynith-ds-connected-card,
.zynith-page .zynith-ds-panel.zynith-ds-panel,
.zynith-page .is-style-zynith-ds-panel.is-style-zynith-ds-panel,
.editor-styles-wrapper .zynith-ds-card.zynith-ds-card,
.editor-styles-wrapper .is-style-zynith-ds-card.is-style-zynith-ds-card,
.editor-styles-wrapper .zynith-ds-feature-card.zynith-ds-feature-card,
.editor-styles-wrapper .is-style-zynith-ds-feature-card.is-style-zynith-ds-feature-card,
.editor-styles-wrapper .zynith-ds-media-card.zynith-ds-media-card,
.editor-styles-wrapper .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card,
.editor-styles-wrapper .zynith-ds-connected-card.zynith-ds-connected-card,
.editor-styles-wrapper .is-style-zynith-ds-connected-card.is-style-zynith-ds-connected-card,
.editor-styles-wrapper .zynith-ds-panel.zynith-ds-panel,
.editor-styles-wrapper .is-style-zynith-ds-panel.is-style-zynith-ds-panel {
    box-sizing: border-box; min-width: 0; padding: clamp(20px, 3vw, 30px); background: var(--zynith-ds-surface-variant); color: var(--zynith-ds-on-surface-variant); border: 1px solid var(--zynith-ds-border); border-radius: 14px;
}

.zynith-page .zynith-ds-feature-card.zynith-ds-feature-card,
.zynith-page .is-style-zynith-ds-feature-card.is-style-zynith-ds-feature-card,
.zynith-page .zynith-ds-media-card.zynith-ds-media-card,
.zynith-page .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card,
.editor-styles-wrapper .zynith-ds-feature-card.zynith-ds-feature-card,
.editor-styles-wrapper .is-style-zynith-ds-feature-card.is-style-zynith-ds-feature-card,
.editor-styles-wrapper .zynith-ds-media-card.zynith-ds-media-card,
.editor-styles-wrapper .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card {
    display: flex; flex-direction: column; gap: 16px; overflow: hidden;
}

.zynith-page .zynith-ds-media-card.zynith-ds-media-card,
.zynith-page .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card,
.editor-styles-wrapper .zynith-ds-media-card.zynith-ds-media-card,
.editor-styles-wrapper .is-style-zynith-ds-media-card.is-style-zynith-ds-media-card {
    padding: 0;
}

.zynith-page .zynith-ds-connected-card.zynith-ds-connected-card,
.zynith-page .is-style-zynith-ds-connected-card.is-style-zynith-ds-connected-card,
.editor-styles-wrapper .zynith-ds-connected-card.zynith-ds-connected-card,
.editor-styles-wrapper .is-style-zynith-ds-connected-card.is-style-zynith-ds-connected-card {
    border-radius: 0; border: 0; background: transparent; padding: 28px; text-align: center;
}

.zynith-page .zynith-ds-panel.zynith-ds-panel,
.zynith-page .is-style-zynith-ds-panel.is-style-zynith-ds-panel,
.editor-styles-wrapper .zynith-ds-panel.zynith-ds-panel,
.editor-styles-wrapper .is-style-zynith-ds-panel.is-style-zynith-ds-panel {
    padding: clamp(24px, 4vw, 44px); border-radius: 22px; background: linear-gradient(180deg, rgba(141,42,234,0.12), transparent), var(--zynith-ds-surface-variant);
}

.zynith-page .zynith-ds-surface-section.zynith-ds-surface-section,
.zynith-page .is-style-zynith-ds-surface-section.is-style-zynith-ds-surface-section,
.zynith-page .zynith-ds-accent-section.zynith-ds-accent-section,
.zynith-page .is-style-zynith-ds-accent-section.is-style-zynith-ds-accent-section,
.editor-styles-wrapper .zynith-ds-surface-section.zynith-ds-surface-section,
.editor-styles-wrapper .is-style-zynith-ds-surface-section.is-style-zynith-ds-surface-section,
.editor-styles-wrapper .zynith-ds-accent-section.zynith-ds-accent-section,
.editor-styles-wrapper .is-style-zynith-ds-accent-section.is-style-zynith-ds-accent-section {
    box-sizing: border-box; padding: clamp(48px, 6vw, 96px) clamp(20px, 4vw, 48px); color: var(--zynith-ds-on-surface); background: var(--zynith-ds-surface);
}

.zynith-page .zynith-ds-accent-section.zynith-ds-accent-section,
.zynith-page .is-style-zynith-ds-accent-section.is-style-zynith-ds-accent-section,
.editor-styles-wrapper .zynith-ds-accent-section.zynith-ds-accent-section,
.editor-styles-wrapper .is-style-zynith-ds-accent-section.is-style-zynith-ds-accent-section {
    background: var(--zynith-ds-primary-container); color: var(--zynith-ds-on-primary-container);
}

.zynith-page .zynith-ds-container.zynith-ds-container,
.zynith-page .is-style-zynith-ds-container.is-style-zynith-ds-container,
.editor-styles-wrapper .zynith-ds-container.zynith-ds-container,
.editor-styles-wrapper .is-style-zynith-ds-container.is-style-zynith-ds-container {
    box-sizing: border-box; width: min(100%, 1200px); margin-inline: auto;
}

.zynith-page .zynith-ds-grid-2.zynith-ds-grid-2,
.zynith-page .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2,
.zynith-page .zynith-ds-grid-3.zynith-ds-grid-3,
.zynith-page .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.zynith-page .zynith-ds-grid-4.zynith-ds-grid-4,
.zynith-page .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.zynith-page .zynith-ds-connected-grid.zynith-ds-connected-grid,
.zynith-page .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid,
.editor-styles-wrapper .zynith-ds-grid-2.zynith-ds-grid-2,
.editor-styles-wrapper .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2,
.editor-styles-wrapper .zynith-ds-grid-3.zynith-ds-grid-3,
.editor-styles-wrapper .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.editor-styles-wrapper .zynith-ds-grid-4.zynith-ds-grid-4,
.editor-styles-wrapper .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.editor-styles-wrapper .zynith-ds-connected-grid.zynith-ds-connected-grid,
.editor-styles-wrapper .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid {
    display: grid; gap: 24px; align-items: stretch;
}

.zynith-page .zynith-ds-grid-2.zynith-ds-grid-2,
.zynith-page .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2,
.editor-styles-wrapper .zynith-ds-grid-2.zynith-ds-grid-2,
.editor-styles-wrapper .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.zynith-page .zynith-ds-grid-3.zynith-ds-grid-3,
.zynith-page .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.editor-styles-wrapper .zynith-ds-grid-3.zynith-ds-grid-3,
.editor-styles-wrapper .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.zynith-page .zynith-ds-grid-4.zynith-ds-grid-4,
.zynith-page .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.editor-styles-wrapper .zynith-ds-grid-4.zynith-ds-grid-4,
.editor-styles-wrapper .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.zynith-page .zynith-ds-connected-grid.zynith-ds-connected-grid,
.zynith-page .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid,
.editor-styles-wrapper .zynith-ds-connected-grid.zynith-ds-connected-grid,
.editor-styles-wrapper .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--zynith-ds-border); border-radius: 16px; background: var(--zynith-ds-border);
}

.zynith-page .zynith-ds-connected-grid.zynith-ds-connected-grid > *,
.zynith-page .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid > *,
.editor-styles-wrapper .zynith-ds-connected-grid.zynith-ds-connected-grid > *,
.editor-styles-wrapper .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid > * {
    background: var(--zynith-ds-surface-variant);
}

.zynith-page .zynith-ds-split-40-60.zynith-ds-split-40-60,
.zynith-page .is-style-zynith-ds-split-40-60.is-style-zynith-ds-split-40-60,
.editor-styles-wrapper .zynith-ds-split-40-60.zynith-ds-split-40-60,
.editor-styles-wrapper .is-style-zynith-ds-split-40-60.is-style-zynith-ds-split-40-60 {
    display: grid; grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); gap: clamp(24px, 5vw, 64px); align-items: center;
}

.zynith-page .zynith-ds-split-50-50.zynith-ds-split-50-50,
.zynith-page .is-style-zynith-ds-split-50-50.is-style-zynith-ds-split-50-50,
.editor-styles-wrapper .zynith-ds-split-50-50.zynith-ds-split-50-50,
.editor-styles-wrapper .is-style-zynith-ds-split-50-50.is-style-zynith-ds-split-50-50 {
    display: grid; grid-template-columns: minmax(0, 50fr) minmax(0, 50fr); gap: clamp(24px, 5vw, 64px); align-items: center;
}

.zynith-page .zynith-ds-split-60-40.zynith-ds-split-60-40,
.zynith-page .is-style-zynith-ds-split-60-40.is-style-zynith-ds-split-60-40,
.editor-styles-wrapper .zynith-ds-split-60-40.zynith-ds-split-60-40,
.editor-styles-wrapper .is-style-zynith-ds-split-60-40.is-style-zynith-ds-split-60-40 {
    display: grid; grid-template-columns: minmax(0, 60fr) minmax(0, 40fr); gap: clamp(24px, 5vw, 64px); align-items: center;
}

.zynith-page .zynith-ds-actions.zynith-ds-actions,
.zynith-page .is-style-zynith-ds-actions.is-style-zynith-ds-actions,
.editor-styles-wrapper .zynith-ds-actions.zynith-ds-actions,
.editor-styles-wrapper .is-style-zynith-ds-actions.is-style-zynith-ds-actions {
    display: flex; flex-wrap: wrap; align-items: center; gap: 16px;
}

.zynith-page .zynith-ds-eyebrow.zynith-ds-eyebrow,
.zynith-page .is-style-zynith-ds-eyebrow.is-style-zynith-ds-eyebrow,
.zynith-page .zynith-ds-hero-eyebrow.zynith-ds-hero-eyebrow,
.zynith-page .is-style-zynith-ds-hero-eyebrow.is-style-zynith-ds-hero-eyebrow,
.editor-styles-wrapper .zynith-ds-eyebrow.zynith-ds-eyebrow,
.editor-styles-wrapper .is-style-zynith-ds-eyebrow.is-style-zynith-ds-eyebrow,
.editor-styles-wrapper .zynith-ds-hero-eyebrow.zynith-ds-hero-eyebrow,
.editor-styles-wrapper .is-style-zynith-ds-hero-eyebrow.is-style-zynith-ds-hero-eyebrow {
    margin: 0 0 16px; font-size: 0.8rem; font-weight: 700; line-height: 1.3; letter-spacing: 0.12em; text-transform: uppercase; color: var(--zynith-ds-on-surface);
}

.zynith-page .zynith-ds-eyebrow.zynith-ds-eyebrow,
.zynith-page .is-style-zynith-ds-eyebrow.is-style-zynith-ds-eyebrow,
.zynith-page .zynith-ds-gradient-highlight.zynith-ds-gradient-highlight,
.zynith-page .is-style-zynith-ds-gradient-highlight.is-style-zynith-ds-gradient-highlight,
.editor-styles-wrapper .zynith-ds-eyebrow.zynith-ds-eyebrow,
.editor-styles-wrapper .is-style-zynith-ds-eyebrow.is-style-zynith-ds-eyebrow,
.editor-styles-wrapper .zynith-ds-gradient-highlight.zynith-ds-gradient-highlight,
.editor-styles-wrapper .is-style-zynith-ds-gradient-highlight.is-style-zynith-ds-gradient-highlight {
    background: var(--zynith-ds-gradient); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}

.zynith-page .zynith-ds-hero-eyebrow.zynith-ds-hero-eyebrow,
.zynith-page .is-style-zynith-ds-hero-eyebrow.is-style-zynith-ds-hero-eyebrow,
.editor-styles-wrapper .zynith-ds-hero-eyebrow.zynith-ds-hero-eyebrow,
.editor-styles-wrapper .is-style-zynith-ds-hero-eyebrow.is-style-zynith-ds-hero-eyebrow {
    display: inline-flex; width: fit-content; padding: 8px 14px; border: 1px solid var(--zynith-ds-outline); border-radius: 999px; background: var(--zynith-ds-secondary-container); color: var(--zynith-ds-on-secondary-container);
}

.zynith-page .zynith-ds-display.zynith-ds-display,
.zynith-page .is-style-zynith-ds-display.is-style-zynith-ds-display,
.zynith-page .zynith-ds-section-heading.zynith-ds-section-heading,
.zynith-page .is-style-zynith-ds-section-heading.is-style-zynith-ds-section-heading,
.zynith-page .zynith-ds-card-heading.zynith-ds-card-heading,
.zynith-page .is-style-zynith-ds-card-heading.is-style-zynith-ds-card-heading,
.editor-styles-wrapper .zynith-ds-display.zynith-ds-display,
.editor-styles-wrapper .is-style-zynith-ds-display.is-style-zynith-ds-display,
.editor-styles-wrapper .zynith-ds-section-heading.zynith-ds-section-heading,
.editor-styles-wrapper .is-style-zynith-ds-section-heading.is-style-zynith-ds-section-heading,
.editor-styles-wrapper .zynith-ds-card-heading.zynith-ds-card-heading,
.editor-styles-wrapper .is-style-zynith-ds-card-heading.is-style-zynith-ds-card-heading {
    margin: 0 0 16px; color: var(--zynith-ds-on-surface); line-height: 1.15; letter-spacing: -0.025em; text-wrap: balance;
}

.zynith-page .zynith-ds-display.zynith-ds-display,
.zynith-page .is-style-zynith-ds-display.is-style-zynith-ds-display,
.editor-styles-wrapper .zynith-ds-display.zynith-ds-display,
.editor-styles-wrapper .is-style-zynith-ds-display.is-style-zynith-ds-display {
    font-size: clamp(2.6rem, 5vw, 4.5rem); line-height: 1.05;
}

.zynith-page .zynith-ds-section-heading.zynith-ds-section-heading,
.zynith-page .is-style-zynith-ds-section-heading.is-style-zynith-ds-section-heading,
.editor-styles-wrapper .zynith-ds-section-heading.zynith-ds-section-heading,
.editor-styles-wrapper .is-style-zynith-ds-section-heading.is-style-zynith-ds-section-heading {
    font-size: clamp(2rem, 3vw, 2.9rem);
}

.zynith-page .zynith-ds-card-heading.zynith-ds-card-heading,
.zynith-page .is-style-zynith-ds-card-heading.is-style-zynith-ds-card-heading,
.editor-styles-wrapper .zynith-ds-card-heading.zynith-ds-card-heading,
.editor-styles-wrapper .is-style-zynith-ds-card-heading.is-style-zynith-ds-card-heading {
    font-size: 1.15rem; line-height: 1.25;
}

.zynith-page .zynith-ds-lead.zynith-ds-lead,
.zynith-page .is-style-zynith-ds-lead.is-style-zynith-ds-lead,
.zynith-page .zynith-ds-intro.zynith-ds-intro,
.zynith-page .is-style-zynith-ds-intro.is-style-zynith-ds-intro,
.zynith-page .zynith-ds-muted.zynith-ds-muted,
.zynith-page .is-style-zynith-ds-muted.is-style-zynith-ds-muted,
.zynith-page .zynith-ds-small.zynith-ds-small,
.zynith-page .is-style-zynith-ds-small.is-style-zynith-ds-small,
.editor-styles-wrapper .zynith-ds-lead.zynith-ds-lead,
.editor-styles-wrapper .is-style-zynith-ds-lead.is-style-zynith-ds-lead,
.editor-styles-wrapper .zynith-ds-intro.zynith-ds-intro,
.editor-styles-wrapper .is-style-zynith-ds-intro.is-style-zynith-ds-intro,
.editor-styles-wrapper .zynith-ds-muted.zynith-ds-muted,
.editor-styles-wrapper .is-style-zynith-ds-muted.is-style-zynith-ds-muted,
.editor-styles-wrapper .zynith-ds-small.zynith-ds-small,
.editor-styles-wrapper .is-style-zynith-ds-small.is-style-zynith-ds-small {
    margin: 0 0 20px; color: var(--zynith-ds-text-soft); line-height: 1.65;
}

.zynith-page .zynith-ds-lead.zynith-ds-lead,
.zynith-page .is-style-zynith-ds-lead.is-style-zynith-ds-lead,
.editor-styles-wrapper .zynith-ds-lead.zynith-ds-lead,
.editor-styles-wrapper .is-style-zynith-ds-lead.is-style-zynith-ds-lead {
    font-size: clamp(1.1rem, 1.5vw, 1.3rem); max-width: 760px;
}

.zynith-page .zynith-ds-intro.zynith-ds-intro,
.zynith-page .is-style-zynith-ds-intro.is-style-zynith-ds-intro,
.editor-styles-wrapper .zynith-ds-intro.zynith-ds-intro,
.editor-styles-wrapper .is-style-zynith-ds-intro.is-style-zynith-ds-intro {
    font-size: 1.1rem; max-width: 760px;
}

.zynith-page .zynith-ds-muted.zynith-ds-muted,
.zynith-page .is-style-zynith-ds-muted.is-style-zynith-ds-muted,
.editor-styles-wrapper .zynith-ds-muted.zynith-ds-muted,
.editor-styles-wrapper .is-style-zynith-ds-muted.is-style-zynith-ds-muted {
    color: var(--zynith-ds-text-muted);
}

.zynith-page .zynith-ds-small.zynith-ds-small,
.zynith-page .is-style-zynith-ds-small.is-style-zynith-ds-small,
.editor-styles-wrapper .zynith-ds-small.zynith-ds-small,
.editor-styles-wrapper .is-style-zynith-ds-small.is-style-zynith-ds-small {
    font-size: 0.875rem;
}

.zynith-page .zynith-ds-primary.zynith-ds-primary .wp-block-button__link,
.zynith-page .is-style-zynith-ds-primary.is-style-zynith-ds-primary .wp-block-button__link,
.editor-styles-wrapper .zynith-ds-primary.zynith-ds-primary .wp-block-button__link,
.editor-styles-wrapper .is-style-zynith-ds-primary.is-style-zynith-ds-primary .wp-block-button__link {
    display: inline-flex; justify-content: center; align-items: center; box-sizing: border-box; padding: 0.8em 1.35em; border: 1px solid transparent; border-radius: 8px; font-weight: 700; text-decoration: none; color: var(--zynith-ds-on-primary); background: var(--zynith-ds-gradient);
}

.zynith-page .zynith-ds-secondary.zynith-ds-secondary .wp-block-button__link,
.zynith-page .is-style-zynith-ds-secondary.is-style-zynith-ds-secondary .wp-block-button__link,
.editor-styles-wrapper .zynith-ds-secondary.zynith-ds-secondary .wp-block-button__link,
.editor-styles-wrapper .is-style-zynith-ds-secondary.is-style-zynith-ds-secondary .wp-block-button__link {
    display: inline-flex; justify-content: center; align-items: center; box-sizing: border-box; padding: 0.8em 1.35em; border: 1px solid transparent; border-radius: 8px; font-weight: 700; text-decoration: none; color: var(--zynith-ds-on-primary); background: var(--zynith-ds-gradient); background: var(--zynith-ds-secondary-container); border-color: var(--zynith-ds-secondary); color: var(--zynith-ds-on-secondary-container);
}

.zynith-page .zynith-ds-quiet.zynith-ds-quiet .wp-block-button__link,
.zynith-page .is-style-zynith-ds-quiet.is-style-zynith-ds-quiet .wp-block-button__link,
.editor-styles-wrapper .zynith-ds-quiet.zynith-ds-quiet .wp-block-button__link,
.editor-styles-wrapper .is-style-zynith-ds-quiet.is-style-zynith-ds-quiet .wp-block-button__link {
    display: inline-flex; justify-content: center; align-items: center; box-sizing: border-box; padding: 0.8em 1.35em; border: 1px solid transparent; border-radius: 8px; font-weight: 700; text-decoration: none; color: var(--zynith-ds-on-primary); background: var(--zynith-ds-gradient); background: var(--zynith-ds-surface-variant); border-color: var(--zynith-ds-outline); color: var(--zynith-ds-on-surface-variant);
}

.zynith-page .zynith-ds-text-link.zynith-ds-text-link .wp-block-button__link,
.zynith-page .is-style-zynith-ds-text-link.is-style-zynith-ds-text-link .wp-block-button__link,
.editor-styles-wrapper .zynith-ds-text-link.zynith-ds-text-link .wp-block-button__link,
.editor-styles-wrapper .is-style-zynith-ds-text-link.is-style-zynith-ds-text-link .wp-block-button__link {
    display: inline-flex; justify-content: center; align-items: center; box-sizing: border-box; padding: 0.8em 1.35em; border: 1px solid transparent; border-radius: 8px; font-weight: 700; text-decoration: none; color: var(--zynith-ds-on-primary); background: var(--zynith-ds-gradient); background: transparent; padding: 0; color: inherit; text-decoration: underline; text-underline-offset: 0.2em;
}

.zynith-page .zynith-ds-screenshot.zynith-ds-screenshot,
.zynith-page .is-style-zynith-ds-screenshot.is-style-zynith-ds-screenshot,
.editor-styles-wrapper .zynith-ds-screenshot.zynith-ds-screenshot,
.editor-styles-wrapper .is-style-zynith-ds-screenshot.is-style-zynith-ds-screenshot {
    overflow: hidden; margin: 0; border: 1px solid var(--zynith-ds-border); border-radius: 14px; box-shadow: 0 24px 70px rgba(0,0,0,0.32);
}

.zynith-page .zynith-ds-screenshot.zynith-ds-screenshot img,
.zynith-page .is-style-zynith-ds-screenshot.is-style-zynith-ds-screenshot img,
.editor-styles-wrapper .zynith-ds-screenshot.zynith-ds-screenshot img,
.editor-styles-wrapper .is-style-zynith-ds-screenshot.is-style-zynith-ds-screenshot img {
    display: block; width: 100%; height: auto;
}

.zynith-page .zynith-ds-card-media.zynith-ds-card-media,
.zynith-page .is-style-zynith-ds-card-media.is-style-zynith-ds-card-media,
.editor-styles-wrapper .zynith-ds-card-media.zynith-ds-card-media,
.editor-styles-wrapper .is-style-zynith-ds-card-media.is-style-zynith-ds-card-media {
    margin: 0; aspect-ratio: 16 / 9; overflow: hidden;
}

.zynith-page .zynith-ds-card-media.zynith-ds-card-media img,
.zynith-page .is-style-zynith-ds-card-media.is-style-zynith-ds-card-media img,
.editor-styles-wrapper .zynith-ds-card-media.zynith-ds-card-media img,
.editor-styles-wrapper .is-style-zynith-ds-card-media.is-style-zynith-ds-card-media img {
    display: block; width: 100%; height: 100%; object-fit: cover;
}

.zynith-page .zynith-ds-icon-small.zynith-ds-icon-small,
.zynith-page .is-style-zynith-ds-icon-small.is-style-zynith-ds-icon-small,
.editor-styles-wrapper .zynith-ds-icon-small.zynith-ds-icon-small,
.editor-styles-wrapper .is-style-zynith-ds-icon-small.is-style-zynith-ds-icon-small {
    box-sizing: content-box; display: grid; place-items: center; width: 32px; height: 32px; margin: 0 0 16px; padding: 7px; border: 1px solid var(--zynith-ds-primary); border-radius: 11px; background: var(--zynith-ds-primary-container);
}

.zynith-page .zynith-ds-icon-small.zynith-ds-icon-small img,
.zynith-page .is-style-zynith-ds-icon-small.is-style-zynith-ds-icon-small img,
.editor-styles-wrapper .zynith-ds-icon-small.zynith-ds-icon-small img,
.editor-styles-wrapper .is-style-zynith-ds-icon-small.is-style-zynith-ds-icon-small img {
    display: block; width: 100%; height: 100%; object-fit: contain;
}

.zynith-page .zynith-ds-icon-medium.zynith-ds-icon-medium,
.zynith-page .is-style-zynith-ds-icon-medium.is-style-zynith-ds-icon-medium,
.editor-styles-wrapper .zynith-ds-icon-medium.zynith-ds-icon-medium,
.editor-styles-wrapper .is-style-zynith-ds-icon-medium.is-style-zynith-ds-icon-medium {
    box-sizing: content-box; display: grid; place-items: center; width: 48px; height: 48px; margin: 0 0 16px; padding: 7px; border: 1px solid var(--zynith-ds-primary); border-radius: 11px; background: var(--zynith-ds-primary-container);
}

.zynith-page .zynith-ds-icon-medium.zynith-ds-icon-medium img,
.zynith-page .is-style-zynith-ds-icon-medium.is-style-zynith-ds-icon-medium img,
.editor-styles-wrapper .zynith-ds-icon-medium.zynith-ds-icon-medium img,
.editor-styles-wrapper .is-style-zynith-ds-icon-medium.is-style-zynith-ds-icon-medium img {
    display: block; width: 100%; height: 100%; object-fit: contain;
}

.zynith-page .zynith-ds-icon-large.zynith-ds-icon-large,
.zynith-page .is-style-zynith-ds-icon-large.is-style-zynith-ds-icon-large,
.editor-styles-wrapper .zynith-ds-icon-large.zynith-ds-icon-large,
.editor-styles-wrapper .is-style-zynith-ds-icon-large.is-style-zynith-ds-icon-large {
    box-sizing: content-box; display: grid; place-items: center; width: 64px; height: 64px; margin: 0 0 16px; padding: 7px; border: 1px solid var(--zynith-ds-primary); border-radius: 11px; background: var(--zynith-ds-primary-container);
}

.zynith-page .zynith-ds-icon-large.zynith-ds-icon-large img,
.zynith-page .is-style-zynith-ds-icon-large.is-style-zynith-ds-icon-large img,
.editor-styles-wrapper .zynith-ds-icon-large.zynith-ds-icon-large img,
.editor-styles-wrapper .is-style-zynith-ds-icon-large.is-style-zynith-ds-icon-large img {
    display: block; width: 100%; height: 100%; object-fit: contain;
}

.zynith-page .zynith-ds-card-content.zynith-ds-card-content,
.zynith-page .is-style-zynith-ds-card-content.is-style-zynith-ds-card-content,
.editor-styles-wrapper .zynith-ds-card-content.zynith-ds-card-content,
.editor-styles-wrapper .is-style-zynith-ds-card-content.is-style-zynith-ds-card-content {
    padding: 24px;
}

.zynith-page .zynith-ds-card-interactive.zynith-ds-card-interactive,
.zynith-page .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive,
.editor-styles-wrapper .zynith-ds-card-interactive.zynith-ds-card-interactive,
.editor-styles-wrapper .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive {
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.zynith-page .zynith-ds-card-interactive.zynith-ds-card-interactive:hover,
.zynith-page .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive:hover,
.editor-styles-wrapper .zynith-ds-card-interactive.zynith-ds-card-interactive:hover,
.editor-styles-wrapper .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive:hover {
    transform: translateY(-3px); box-shadow: 0 20px 42px rgba(0,0,0,0.16);
}

.zynith-page .zynith-ds-float.zynith-ds-float,
.zynith-page .is-style-zynith-ds-float.is-style-zynith-ds-float,
.editor-styles-wrapper .zynith-ds-float.zynith-ds-float,
.editor-styles-wrapper .is-style-zynith-ds-float.is-style-zynith-ds-float {
    animation: zynith-ds-float 7s ease-in-out infinite;
}

@keyframes zynith-ds-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

@media (max-width: 900px) {
.zynith-page .zynith-ds-grid-3.zynith-ds-grid-3,
.zynith-page .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.zynith-page .zynith-ds-grid-4.zynith-ds-grid-4,
.zynith-page .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.zynith-page .zynith-ds-connected-grid.zynith-ds-connected-grid,
.zynith-page .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid,
.editor-styles-wrapper .zynith-ds-grid-3.zynith-ds-grid-3,
.editor-styles-wrapper .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.editor-styles-wrapper .zynith-ds-grid-4.zynith-ds-grid-4,
.editor-styles-wrapper .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.editor-styles-wrapper .zynith-ds-connected-grid.zynith-ds-connected-grid,
.editor-styles-wrapper .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 640px) {
.zynith-page .zynith-ds-grid-2.zynith-ds-grid-2,
.zynith-page .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2,
.zynith-page .zynith-ds-grid-3.zynith-ds-grid-3,
.zynith-page .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.zynith-page .zynith-ds-grid-4.zynith-ds-grid-4,
.zynith-page .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.zynith-page .zynith-ds-connected-grid.zynith-ds-connected-grid,
.zynith-page .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid,
.zynith-page .zynith-ds-split-40-60.zynith-ds-split-40-60,
.zynith-page .is-style-zynith-ds-split-40-60.is-style-zynith-ds-split-40-60,
.zynith-page .zynith-ds-split-50-50.zynith-ds-split-50-50,
.zynith-page .is-style-zynith-ds-split-50-50.is-style-zynith-ds-split-50-50,
.zynith-page .zynith-ds-split-60-40.zynith-ds-split-60-40,
.zynith-page .is-style-zynith-ds-split-60-40.is-style-zynith-ds-split-60-40,
.editor-styles-wrapper .zynith-ds-grid-2.zynith-ds-grid-2,
.editor-styles-wrapper .is-style-zynith-ds-grid-2.is-style-zynith-ds-grid-2,
.editor-styles-wrapper .zynith-ds-grid-3.zynith-ds-grid-3,
.editor-styles-wrapper .is-style-zynith-ds-grid-3.is-style-zynith-ds-grid-3,
.editor-styles-wrapper .zynith-ds-grid-4.zynith-ds-grid-4,
.editor-styles-wrapper .is-style-zynith-ds-grid-4.is-style-zynith-ds-grid-4,
.editor-styles-wrapper .zynith-ds-connected-grid.zynith-ds-connected-grid,
.editor-styles-wrapper .is-style-zynith-ds-connected-grid.is-style-zynith-ds-connected-grid,
.editor-styles-wrapper .zynith-ds-split-40-60.zynith-ds-split-40-60,
.editor-styles-wrapper .is-style-zynith-ds-split-40-60.is-style-zynith-ds-split-40-60,
.editor-styles-wrapper .zynith-ds-split-50-50.zynith-ds-split-50-50,
.editor-styles-wrapper .is-style-zynith-ds-split-50-50.is-style-zynith-ds-split-50-50,
.editor-styles-wrapper .zynith-ds-split-60-40.zynith-ds-split-60-40,
.editor-styles-wrapper .is-style-zynith-ds-split-60-40.is-style-zynith-ds-split-60-40 {
    grid-template-columns: minmax(0, 1fr);
}
}

@media (prefers-reduced-motion: reduce) {
.zynith-page .zynith-ds-float.zynith-ds-float,
.zynith-page .is-style-zynith-ds-float.is-style-zynith-ds-float,
.zynith-page .zynith-ds-card-interactive.zynith-ds-card-interactive,
.zynith-page .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive,
.editor-styles-wrapper .zynith-ds-float.zynith-ds-float,
.editor-styles-wrapper .is-style-zynith-ds-float.is-style-zynith-ds-float,
.editor-styles-wrapper .zynith-ds-card-interactive.zynith-ds-card-interactive,
.editor-styles-wrapper .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive {
    animation: none; transition: none; transform: none;
}
.zynith-page .zynith-ds-card-interactive.zynith-ds-card-interactive:hover,
.zynith-page .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive:hover,
.editor-styles-wrapper .zynith-ds-card-interactive.zynith-ds-card-interactive:hover,
.editor-styles-wrapper .is-style-zynith-ds-card-interactive.is-style-zynith-ds-card-interactive:hover {
    transform: none;
}
}
