/** Shopify CDN: Minification failed Line 221:0 Unexpected "}" **/ .dd-page { --dd-ink: #17151d; --dd-muted: #625d6b; --dd-paper: #f7f4ee; --dd-paper-2: #fffdf9; --dd-lilac: #eae5f1; --dd-line: #ddd5e8; --dd-violet: #40365f; --dd-violet-2: #6c5fa7; --dd-gold: #bea06a; --dd-night: #1b1828; background: var(--dd-paper); color: var(--dd-ink); font-family: "Public Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; } .dd-page *, .dd-page *::before, .dd-page *::after { box-sizing: border-box; } .dd-page a { color: var(--dd-violet); text-decoration-thickness: 1px; text-underline-offset: 3px; } .dd-page a:hover { color: var(--dd-violet-2); } .dd-page :focus-visible { outline: 2px solid var(--dd-violet-2); outline-offset: 3px; } .dd-shell { width: min(1160px, calc(100% - 36px)); margin-inline: auto; } .dd-reading-width { width: min(780px, 100%); } .dd-section { padding: clamp(52px, 7vw, 92px) 0; } .dd-section--compact { padding: clamp(38px, 5vw, 64px) 0; } .dd-section--lilac { background: var(--dd-lilac); border-block: 1px solid var(--dd-line); } .dd-section--night { background: var(--dd-night); color: #edeaf3; } .dd-breadcrumbs { display: flex; flex-wrap: wrap; gap: 7px; padding-top: 20px; color: var(--dd-muted); font-size: 13px; } .dd-breadcrumbs a { color: inherit; } .dd-hero { position: relative; overflow: hidden; padding: clamp(48px, 7vw, 98px) 0 clamp(62px, 8vw, 112px); } .dd-hero::before, .dd-hero::after { position: absolute; content: ""; border: 1px solid rgba(108, 95, 167, .18); border-radius: 50%; pointer-events: none; } .dd-hero::before { width: 360px; height: 360px; top: -180px; right: -90px; } .dd-hero::after { width: 170px; height: 170px; top: -84px; right: 8px; } .dd-eyebrow { margin: 0 0 14px; color: var(--dd-violet); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; } .dd-page h1, .dd-page h2, .dd-page h3 { margin-top: 0; color: inherit; font-family: "Spectral", Georgia, serif; font-weight: 400; } .dd-page h1 { max-width: 900px; margin-bottom: 20px; font-size: clamp(42px, 7vw, 78px); line-height: .98; letter-spacing: -.045em; } .dd-page h2 { margin-bottom: 16px; font-size: clamp(30px, 4vw, 46px); line-height: 1.08; letter-spacing: -.025em; } .dd-page h3 { margin-bottom: 8px; font-size: 22px; line-height: 1.2; } .dd-deck { max-width: 720px; margin: 0; color: #4a4553; font-family: "Spectral", Georgia, serif; font-size: clamp(19px, 2.3vw, 25px); line-height: 1.45; } .dd-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; } .dd-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 19px; border: 1px solid var(--dd-violet); border-radius: 9px; background: var(--dd-violet); color: #fff !important; font-size: 14px; font-weight: 700; line-height: 1.2; text-decoration: none; } .dd-button:hover { background: var(--dd-violet-2); border-color: var(--dd-violet-2); } .dd-button--ghost { background: transparent; color: var(--dd-violet) !important; } .dd-button--ghost:hover { background: rgba(108, 95, 167, .08); } .dd-search-wrap { display: grid; gap: 16px; margin-top: 36px; } .dd-search { width: min(620px, 100%); min-height: 52px; padding: 13px 16px; border: 1px solid #c9bedc; border-radius: 10px; background: var(--dd-paper-2); color: var(--dd-ink); font: inherit; } .dd-alpha { display: flex; flex-wrap: wrap; gap: 7px; } .dd-alpha span, .dd-alpha a { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid var(--dd-line); border-radius: 50%; background: rgba(255,255,255,.5); color: #9a94a0; font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; text-decoration: none; } .dd-alpha a { border-color: #b8acd0; background: var(--dd-paper-2); color: var(--dd-violet); font-weight: 700; } .dd-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } .dd-card { display: flex; min-width: 0; min-height: 100%; flex-direction: column; padding: 24px; border: 1px solid var(--dd-line); border-radius: 14px; background: var(--dd-paper-2); } .dd-card[hidden] { display: none; } .dd-card__letter { margin-bottom: 28px; color: var(--dd-gold); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; font-weight: 700; letter-spacing: .15em; } .dd-card p { margin: 0 0 18px; color: var(--dd-muted); font-size: 14px; } .dd-card__link { margin-top: auto; font-size: 14px; font-weight: 700; } .dd-empty { margin: 22px 0 0; padding: 22px; border: 1px dashed #b8acd0; border-radius: 12px; color: var(--dd-muted); } .dd-note { padding: 25px 28px; border-left: 3px solid var(--dd-gold); background: rgba(190,160,106,.09); color: #413c48; } .dd-note strong { color: var(--dd-ink); } .dd-prose p { margin: 0 0 20px; color: #48434f; } .dd-prose p:last-child { margin-bottom: 0; } .dd-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid #2a2438; border-radius: 14px; background: #2a2438; } .dd-step { padding: 25px; background: #211d2e; } .dd-step b { display: block; margin-bottom: 14px; color: var(--dd-gold); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; letter-spacing: .14em; } .dd-step h3 { color: #f3f0f7; } .dd-step p { margin: 0; color: #aaa3ba; font-size: 14px; } .dd-answer { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: start; margin-top: 36px; padding: 26px; border: 1px solid var(--dd-line); border-radius: 14px; background: var(--dd-paper-2); } .dd-answer__label { color: var(--dd-violet); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; } .dd-answer p { margin: 0; color: #3f3a46; font-size: 17px; } .dd-theme-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 28px; } .dd-theme { padding: 22px; border: 1px solid var(--dd-line); border-radius: 12px; background: var(--dd-paper-2); } .dd-theme p { margin: 0; color: var(--dd-muted); font-size: 14px; } .dd-scenario-list { display: grid; gap: 0; margin-top: 26px; border-top: 1px solid var(--dd-line); } .dd-scenario { display: grid; grid-template-columns: minmax(190px, .7fr) minmax(0, 1.3fr); gap: 28px; padding: 24px 0; border-bottom: 1px solid var(--dd-line); } .dd-scenario h3 { margin: 0; font-size: 20px; } .dd-scenario p { margin: 0; color: var(--dd-muted); } .dd-question-list { display: grid; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; counter-reset: dd-question; } .dd-question-list li { position: relative; padding: 17px 18px 17px 54px; border: 1px solid var(--dd-line); border-radius: 10px; background: var(--dd-paper-2); counter-increment: dd-question; } .dd-question-list li::before { position: absolute; left: 18px; content: counter(dd-question, decimal-leading-zero); color: var(--dd-gold); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 11px; font-weight: 700; } .dd-related { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; } .dd-related a { padding: 16px; border: 1px solid var(--dd-line); border-radius: 10px; background: var(--dd-paper-2); font-family: "Spectral", Georgia, serif; font-size: 18px; line-height: 1.2; text-decoration: none; } .dd-cta { display: grid; grid-template-columns: minmax(0, 1.2fr) auto; gap: 28px; align-items: center; padding: clamp(28px, 5vw, 48px); border: 1px solid #343044; border-radius: 16px; background: #211d2e; } .dd-cta h2 { margin-bottom: 10px; } .dd-cta p { max-width: 660px; margin: 0; color: #aaa3ba; } .dd-cta .dd-button { border-color: #d7c18f; background: #d7c18f; color: #211d2e !important; } .dd-faq { border-top: 1px solid var(--dd-line); } .dd-faq details { border-bottom: 1px solid var(--dd-line); } .dd-faq summary { padding: 20px 4px; cursor: pointer; color: var(--dd-ink); font-weight: 700; } .dd-faq details p { max-width: 790px; margin: 0; padding: 0 4px 22px; color: var(--dd-muted); } .dd-bridge { padding: clamp(36px, 5vw, 60px) 0; background: #eae5f1; color: #17151d; font-family: "Public Sans", system-ui, sans-serif; } .dd-bridge__inner { width: min(1160px, calc(100% - 36px)); margin-inline: auto; } .dd-bridge__head { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-bottom: 20px; } .dd-bridge h2 { margin: 0 0 6px; color: #17151d !important; font-family: "Spectral", Georgia, serif; font-size: clamp(28px, 3.5vw, 42px); font-weight: 400; line-height: 1.08; } .dd-bridge p { max-width: 660px; margin: 0; color: #5f5a6b; } .dd-bridge__all { white-space: nowrap; color: #40365f; font-size: 14px; font-weight: 700; } .dd-bridge__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; } .dd-bridge__grid a { padding: 17px; border: 1px solid #d2c9de; border-radius: 10px; background: #fffdf9; color: #40365f; font-family: "Spectral", Georgia, serif; font-size: 18px; line-height: 1.2; text-decoration: none; } @media (max-width: 900px) { .dd-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dd-steps { grid-template-columns: 1fr; } .dd-related, .dd-bridge__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px) { .dd-shell { width: min(100% - 28px, 1160px); } .dd-page h1 { font-size: clamp(39px, 13vw, 58px); } .dd-grid, .dd-theme-grid { grid-template-columns: 1fr; } .dd-answer, .dd-scenario { grid-template-columns: 1fr; gap: 10px; } .dd-cta { grid-template-columns: 1fr; } .dd-cta .dd-button { width: 100%; } .dd-bridge__head { display: block; } .dd-bridge__all { display: inline-block; margin-top: 14px; } .dd-related, .dd-bridge__grid { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { .dd-page *, .dd-page *::before, .dd-page *::after { scroll-behavior: auto !important; transition: none !important; } } }