.problem-timeline{grid-column:screen;background-color:var(--color-brand-canvas);display:grid;grid-template-columns:subgrid;padding-top:32px;row-gap:96px}@container (max-width: 800px){.problem-timeline{row-gap:64px}}.problem-timeline>*{grid-column:content}@container (max-width: 500px){.problem-timeline>*{grid-column:bleed}}.problem-timeline :is(.problem-timeline__yellow-title-box,.problem-timeline__red-title-box){display:flex;justify-content:center;align-items:center;min-height:184px;padding:64px;border:3px solid var(--color-brand-accent-00);box-shadow:8px 8px 0 var(--color-brand-accent-00)}@container (max-width: 767px){.problem-timeline :is(.problem-timeline__yellow-title-box,.problem-timeline__red-title-box){padding:52px}}.problem-timeline :is(.problem-timeline__yellow-title-box,.problem-timeline__red-title-box) h1{font-family:var(--font-industrial);font-size:48px;font-weight:400;line-height:56px;text-transform:uppercase;margin:0;color:#000;text-align:center}@container (max-width: 767px){.problem-timeline :is(.problem-timeline__yellow-title-box,.problem-timeline__red-title-box) h1{font-size:32px;line-height:40px}}.problem-timeline .problem-timeline__yellow-title-box{background-color:var(--color-brand-accent2)}.problem-timeline .problem-timeline__red-title-box{background-color:var(--color-brand-accent3)}.problem-timeline .problem-timeline__headline{font-family:var(--font-industrial);font-size:40px;font-weight:400;line-height:48px;text-transform:uppercase;margin:0;color:var(--color-brand-text-fg);text-align:center}@container (max-width: 767px){.problem-timeline .problem-timeline__headline{font-size:36px;line-height:44px}}.problem-timeline .problem-timeline__flow{display:flex;flex-direction:column;gap:8px}.problem-timeline :is(.problem-timeline__step-row,.problem-timeline__arrow-row){display:grid;grid-template-columns:minmax(0,1fr) 96px minmax(0,1fr);column-gap:72px;align-items:center}.problem-timeline .problem-timeline__step-row{grid-template-areas:"box icon ."}.problem-timeline .problem-timeline__flow>.problem-timeline__step-row:nth-child(4n+3){grid-template-areas:". icon box"}.problem-timeline .problem-timeline__step-box{grid-area:box;background-color:var(--color-brand-accent-10, #fff);border:2px solid var(--color-brand-accent-00);padding:24px 16px;min-height:132px;display:flex;align-items:center;box-sizing:border-box;box-shadow:8px 8px 0 var(--color-brand-accent-00);margin-bottom:24px}.problem-timeline .problem-timeline__step-box p{margin:0;font-size:20px;line-height:28px;font-family:var(--font-body);color:var(--color-brand-text-fg-03)}.problem-timeline :is(.problem-timeline__step-icon,.problem-timeline__step-arrow){grid-column:2;justify-self:center}.problem-timeline .problem-timeline__step-icon{grid-area:icon;width:96px;height:96px;display:flex;align-items:center;justify-content:center;flex-flow:column;text-align:center}.problem-timeline .problem-timeline__step-icon img{display:block;width:64px;height:64px}.problem-timeline .problem-timeline__step-icon .problem-timeline__step-icon-title{font-family:var(--font-mono);font-size:14px;line-height:20px;color:var(--color-brand-text-fg);margin-top:8px;text-transform:uppercase;letter-spacing:2%}.problem-timeline .problem-timeline__step-arrow{margin-top:-8px;margin-bottom:-8px}.problem-timeline .problem-timeline__step-arrow img{display:block;width:15px;height:65px}@container (max-width: 767px){.problem-timeline .problem-timeline__step-icon .problem-timeline__step-icon-title{font-size:12px;line-height:16px}.problem-timeline .problem-timeline__step-box{padding:20px 16px;min-height:auto}.problem-timeline .problem-timeline__step-box p{margin:0;font-size:16px;line-height:24px;font-family:var(--font-body);color:var(--color-brand-text-fg-03)}.problem-timeline :is(.problem-timeline__step-row,.problem-timeline__arrow-row){grid-template-columns:96px minmax(0,1fr);column-gap:24px}.problem-timeline :is(.problem-timeline__step-row,.problem-timeline__flow>.problem-timeline__step-row:nth-child(4n+3)){grid-template-areas:"icon box"}.problem-timeline .problem-timeline__step-box{margin-bottom:0}.problem-timeline .problem-timeline__step-arrow{grid-column:1;justify-self:center;margin-top:0;margin-bottom:0;clip-path:inset(12px 0 12px 0)}}
/*# sourceMappingURL=jdd-component__problem-timeline.entrypoint.css.map */