.journey-hero { position: relative; overflow: hidden; padding: clamp(76px, 9vw, 126px) 0 0; color: #fff; background: radial-gradient(circle at 82% 12%, rgb(29 112 229 / 30%), transparent 31%), linear-gradient(135deg, #04162f 0%, #082b66 58%, #075fd8 140%); }
.journey-hero::after { position: absolute; right: -12%; bottom: -58%; width: 620px; aspect-ratio: 1; border: 1px solid rgb(255 255 255 / 10%); border-radius: 50%; content: ""; }
.journey-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .72fr); gap: clamp(36px, 7vw, 96px); align-items: center; }
.journey-copy .eyebrow, .journey-access-card .eyebrow { color: #87bcff; }
.journey-copy h1 { max-width: 760px; margin: 15px 0 22px; font-family: "Bebas Neue", sans-serif; font-size: clamp(4.5rem, 8.3vw, 8.8rem); font-weight: 400; line-height: .84; letter-spacing: -.025em; text-transform: uppercase; }
.journey-copy > p { max-width: 690px; margin-bottom: 30px; color: rgb(255 255 255 / 72%); font-size: .9rem; line-height: 1.75; }
.journey-access-card { display: grid; gap: 22px; padding: clamp(25px, 3vw, 38px); background: rgb(2 18 48 / 72%); border: 1px solid rgb(255 255 255 / 16%); border-radius: 28px; box-shadow: 0 30px 80px rgb(0 0 0 / 22%); backdrop-filter: blur(18px); }
.journey-access-icon { width: 50px; height: 50px; display: grid; place-items: center; color: #fff; background: var(--brand-blue); border-radius: 16px; }
.journey-access-icon svg { width: 24px; }
.journey-access-card h2 { margin-top: 8px; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(1.35rem, 2.1vw, 2rem); line-height: 1.15; letter-spacing: -.04em; }
.journey-access-list { display: grid; gap: 1px; overflow: hidden; background: rgb(255 255 255 / 10%); border-radius: 17px; }
.journey-access-list > div { display: grid; grid-template-columns: 22px 1fr; gap: 12px; padding: 15px; background: rgb(255 255 255 / 6%); }
.journey-access-list svg { width: 18px; color: #6faeff; }
.journey-access-list span { color: rgb(255 255 255 / 62%); font-size: .69rem; line-height: 1.55; }
.journey-access-list strong { display: block; margin-bottom: 3px; color: #fff; font-size: .75rem; }
.journey-access-card > a { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-size: .72rem; font-weight: 800; text-decoration: none; }
.journey-access-card > a svg { width: 16px; transition: transform .2s ease; }
.journey-access-card > a:hover svg { transform: translateX(4px); }
.journey-proof { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: clamp(58px, 8vw, 100px); border-top: 1px solid rgb(255 255 255 / 13%); }
.journey-proof > div { min-height: 116px; display: flex; flex-direction: column; justify-content: center; padding: 22px clamp(16px, 3vw, 38px); }
.journey-proof > div + div { border-left: 1px solid rgb(255 255 255 / 13%); }
.journey-proof strong { font-family: "Bebas Neue", sans-serif; font-size: 2.25rem; font-weight: 400; }
.journey-proof span { color: rgb(255 255 255 / 55%); font-size: .68rem; }
.journey-section { background: #fff; }
.journey-heading { display: flex; justify-content: space-between; align-items: end; gap: 34px; margin-bottom: 34px; }
.journey-heading h2, .journey-choice-copy h2, .journey-trust h2 { max-width: 780px; margin-top: 8px; font-family: "Bebas Neue", sans-serif; font-size: clamp(3rem, 5.6vw, 5.4rem); font-weight: 400; line-height: .92; letter-spacing: -.02em; text-transform: uppercase; }
.journey-heading > p { max-width: 440px; color: var(--ink-600); font-size: .75rem; line-height: 1.7; }
.journey-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.journey-steps article { position: relative; min-height: 345px; display: flex; flex-direction: column; padding: 24px; overflow: hidden; background: #f4f7fb; border: 1px solid #e4eaf2; border-radius: 22px; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.journey-steps article:hover { z-index: 1; border-color: #b9d5fb; box-shadow: 0 22px 50px rgb(12 38 81 / 11%); transform: translateY(-6px); }
.journey-steps article > span { color: #a6b2c3; font-family: "Bebas Neue", sans-serif; font-size: 1.4rem; }
.journey-steps article > i { width: 46px; height: 46px; display: grid; place-items: center; margin: 38px 0 18px; color: var(--brand-blue); background: #e5f0ff; border-radius: 14px; }
.journey-steps article > i svg { width: 21px; }
.journey-steps h3 { font: 800 1rem/1.25 "Plus Jakarta Sans", sans-serif; letter-spacing: -.025em; }
.journey-steps p { margin: 10px 0 22px; color: var(--ink-600); font-size: .68rem; line-height: 1.65; }
.journey-steps button, .journey-steps a { display: inline-flex; align-items: center; gap: 7px; margin-top: auto; padding: 0; color: var(--brand-blue); background: none; border: 0; font-size: .68rem; font-weight: 800; text-decoration: none; cursor: pointer; }
.journey-steps button svg, .journey-steps a svg { width: 15px; }
.journey-choice-section { background: #edf3fa; }
.journey-choice { display: grid; grid-template-columns: minmax(280px, .65fr) minmax(0, 1.35fr); gap: clamp(38px, 7vw, 94px); align-items: center; }
.journey-choice-copy p { max-width: 520px; margin: 22px 0 28px; color: var(--ink-600); font-size: .78rem; line-height: 1.7; }
.journey-options { display: grid; gap: 12px; }
.journey-options article { display: grid; grid-template-columns: minmax(100px, .42fr) minmax(120px, .75fr) 1fr; gap: 20px; align-items: center; padding: 23px 25px; background: #fff; border: 1px solid #dde6f1; border-radius: 20px; }
.journey-options article.featured { color: #fff; background: var(--brand-blue-dark); border-color: transparent; box-shadow: 0 20px 45px rgb(7 95 216 / 22%); }
.journey-options span { color: var(--brand-blue); font-family: "Bebas Neue", sans-serif; font-size: 1.3rem; }
.journey-options .featured span { color: #8fc1ff; }
.journey-options h3 { font: 800 .92rem/1.25 "Plus Jakarta Sans", sans-serif; }
.journey-options p, .journey-options small { color: var(--ink-600); font-size: .67rem; line-height: 1.55; }
.journey-options .featured p, .journey-options .featured small { color: rgb(255 255 255 / 64%); }
.journey-trust { display: grid; grid-template-columns: minmax(280px, .7fr) minmax(0, 1fr); gap: clamp(38px, 7vw, 94px); align-items: start; }
.journey-trust-list { display: grid; gap: 1px; overflow: hidden; background: var(--line); border: 1px solid var(--line); border-radius: 22px; }
.journey-trust-list > div { display: grid; grid-template-columns: 42px 1fr; gap: 15px; padding: 20px; background: #fff; }
.journey-trust-list > div > svg { width: 20px; color: var(--brand-blue); }
.journey-trust-list span { color: var(--ink-600); font-size: .7rem; line-height: 1.6; }
.journey-trust-list strong { display: block; margin-bottom: 4px; color: var(--ink-950); font-size: .78rem; }
.journey-final-actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 1100px) { .journey-hero-grid { grid-template-columns: 1fr; } .journey-access-card { max-width: 760px; } .journey-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } .journey-choice, .journey-trust { grid-template-columns: 1fr; } .journey-choice-copy { max-width: 730px; } .journey-final-actions { grid-column: 1; } }
@media (max-width: 960px) { .journey-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } .journey-steps article { min-height: 310px; padding: 19px; } .journey-options { grid-template-columns: repeat(3, minmax(0, 1fr)); } .journey-options article { min-width: 0; grid-template-columns: 1fr; align-content: start; gap: 9px; padding: 18px; } .journey-options span,.journey-options h3,.journey-options p,.journey-options small { overflow-wrap: anywhere; } .journey-trust-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .journey-trust-list > div { min-width: 0; grid-template-columns: 32px minmax(0,1fr); padding: 15px; } }
@media (max-width: 760px) { .journey-hero { padding-top: 62px; } .journey-copy h1 { font-size: clamp(4.1rem, 20vw, 6.2rem); } .journey-access-card { padding: 22px; border-radius: 22px; } .journey-proof { grid-template-columns: repeat(2, 1fr); } .journey-proof > div { min-height: 92px; padding: 17px; } .journey-proof > div:nth-child(3) { border-top: 1px solid rgb(255 255 255 / 13%); border-left: 0; } .journey-proof > div:nth-child(4) { border-top: 1px solid rgb(255 255 255 / 13%); } .journey-heading { align-items: flex-start; flex-direction: column; } .journey-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; } .journey-steps article { min-height: 232px; padding: 12px 9px; border-radius: 15px; } .journey-steps article > i { width: 34px; height: 34px; margin: 18px 0 12px; } .journey-steps h3 { font-size: .68rem; overflow-wrap: anywhere; } .journey-steps p { display: block; overflow: visible; margin: 7px 0 14px; font-size: .54rem; overflow-wrap: anywhere; } .journey-steps button,.journey-steps a { font-size: .55rem; } .journey-options { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; } .journey-options article { min-width: 0; grid-template-columns: 1fr; align-content: start; gap: 7px; padding: 12px 9px; border-radius: 14px; } .journey-options span { font-size: .88rem; overflow-wrap: anywhere; } .journey-options h3 { font-size: .68rem; } .journey-options p { display: block; overflow: visible; font-size: .54rem; overflow-wrap: anywhere; } .journey-options small { display: none; } .journey-trust-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; } .journey-trust-list > div { min-width: 0; grid-template-columns: 1fr; padding: 10px 8px; } .journey-trust-list svg { width: 20px; } .journey-trust-list strong { font-size: .62rem; overflow-wrap: anywhere; } .journey-trust-list span { font-size: .53rem; } .journey-final-actions .btn { width: 100%; } }
@media (max-width: 460px) { .journey-copy h1 { font-size: clamp(3.6rem, 17vw, 4.6rem); } .journey-copy > p { font-size: .78rem; } }