/* Hero-only scope: safe to insert without replacing the rest of a saved page. */
.pf-freedom-hero { position: relative; isolation: isolate; overflow: hidden; background: #eaf5fc; color: #102b50; font-family: 'Manrope', ui-sans-serif, sans-serif; }
.pf-freedom-hero *, .pf-freedom-hero *::before, .pf-freedom-hero *::after { box-sizing: border-box; }
.pf-freedom-hero::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #f2f9fdee 0%, #f2f9fdd9 27%, #f2f9fd9c 40%, #f2f9fd12 61%, transparent 76%); }
.pf-freedom-hero .pf-freedom-photo { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.pf-freedom-hero .pf-freedom-photo img { display: block; width: 100%; height: 100%; max-width: none; aspect-ratio: auto; object-fit: cover; object-position: 66% center; }
.pf-freedom-hero .pf-freedom-inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(0, 1fr); align-items: center; gap: 58px; width: min(1280px, calc(100% - 96px)); min-height: 650px; margin: 0 auto; padding: 65px 0 70px; }
.pf-freedom-hero .pf-freedom-copy { max-width: 585px; min-width: 0; }
.pf-freedom-hero .pf-freedom-eyebrow { margin: 0 0 19px; color: #164d92; font-size: 11px; font-weight: 800; line-height: 1.5; letter-spacing: .12em; }
.pf-freedom-hero .pf-freedom-copy h1 { margin: 0; color: #102b50; font-size: clamp(42px, 4.05vw, 62px); font-weight: 800; line-height: 1.08; letter-spacing: -.055em; overflow-wrap: normal; }
.pf-freedom-hero .pf-freedom-accent { color: #075deb; }
.pf-freedom-hero .pf-freedom-promise { margin: 22px 0 0; font-size: 18px; font-weight: 750; line-height: 1.5; color: #183c66; }
.pf-freedom-hero .pf-freedom-description { max-width: 475px; margin: 12px 0 0; font-size: 15px; line-height: 1.7; color: #344f6a; }
.pf-freedom-hero .pf-freedom-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; margin: 27px 0 0; }
.pf-freedom-hero .pf-button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 48px; padding: 12px 23px; border: 1px solid #075deb; border-radius: 99px; background: #075deb; color: #fff; font-size: 14px; font-weight: 750; text-decoration: none; box-shadow: 0 5px 18px #075deb20; }
.pf-freedom-hero .pf-button:hover { background: #0649b7; border-color: #0649b7; }
.pf-freedom-hero .pf-freedom-secondary { margin: 0; }
.pf-freedom-hero .pf-freedom-secondary a { display: inline-flex; align-items: center; gap: 13px; min-height: 44px; color: #123d75; font-size: 14px; font-weight: 750; text-decoration: none; }
.pf-freedom-hero .pf-freedom-secondary a:hover { text-decoration: underline; text-underline-offset: 5px; }
.pf-freedom-hero a:focus-visible { outline: 3px solid #092b57; outline-offset: 5px; }
.pf-freedom-hero .pf-freedom-dashboard { width: 276px; max-width: 100%; align-self: start; justify-self: start; margin: 12px 0 0 18px; padding: 18px 20px 14px; border: 1px solid #fff; border-radius: 13px; background: #ffffffed; color: #15304f; box-shadow: 0 14px 40px #1234541c; }
.pf-freedom-hero .pf-freedom-dashboard-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pf-freedom-hero .pf-freedom-dashboard-title { margin: 0; font-size: 13px; line-height: 1.5; font-weight: 800; }
.pf-freedom-hero .pf-freedom-demo-label { margin: 0; padding: 3px 5px; border-radius: 4px; background: #eaf2ff; color: #30517e; font-size: 9px; font-weight: 800; line-height: 1.5; letter-spacing: .04em; }
.pf-freedom-hero .pf-freedom-today { margin: 10px 0 9px; font-size: 11px; line-height: 1.4; color: #5e6f83; }
.pf-freedom-hero .pf-freedom-metrics { display: grid; grid-template-columns: .85fr 1.15fr; gap: 14px; }
.pf-freedom-hero .pf-freedom-metric-label { margin: 0; color: #52677f; font-size: 11px; line-height: 1.5; }
.pf-freedom-hero .pf-freedom-metric-value { margin: 3px 0 0; color: #15304f; font-size: 25px; line-height: 1.25; font-weight: 800; letter-spacing: -.04em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pf-freedom-hero .pf-freedom-chart { margin: 15px 0 9px; }
.pf-freedom-hero .pf-freedom-chart img { display: block; width: 100%; height: auto; aspect-ratio: 280 / 64; }
.pf-freedom-hero .pf-freedom-dashboard-caption { margin: 0; font-size: 10px; line-height: 1.5; color: #52677f; }
@media (min-width: 1800px) {
  .pf-freedom-hero .pf-freedom-inner { min-height: 740px; }
  .pf-freedom-hero .pf-freedom-dashboard { margin-left: 55px; }
}
@media (max-width: 1100px) and (min-width: 781px) {
  .pf-freedom-hero .pf-freedom-inner { width: calc(100% - 64px); grid-template-columns: 1.15fr .85fr; gap: 30px; min-height: 610px; padding-block: 56px 65px; }
  .pf-freedom-hero .pf-freedom-copy h1 { font-size: clamp(37px, 4.7vw, 48px); }
  .pf-freedom-hero .pf-freedom-dashboard { width: 235px; margin: 0; padding: 16px; }
  .pf-freedom-hero .pf-freedom-metric-value { font-size: 22px; }
  .pf-freedom-hero::before { background: linear-gradient(90deg, #f2f9fdf5, #f2f9fddc 38%, #f2f9fd1a 70%, transparent); }
}
@media (max-width: 780px) {
  .pf-freedom-hero { display: flex; flex-direction: column; }
  .pf-freedom-hero::before { display: none; }
  .pf-freedom-hero .pf-freedom-inner { display: contents; }
  .pf-freedom-hero .pf-freedom-copy { order: 1; position: relative; z-index: 2; max-width: 620px; width: calc(100% - 40px); margin: 0 auto; padding: 42px 0 32px; }
  .pf-freedom-hero .pf-freedom-copy h1 { font-size: clamp(36px, 6.4vw, 50px); }
  .pf-freedom-hero .pf-freedom-eyebrow { font-size: 10px; margin-bottom: 15px; }
  .pf-freedom-hero .pf-freedom-promise { margin-top: 18px; font-size: 16px; }
  .pf-freedom-hero .pf-freedom-description { font-size: 14px; }
    .pf-freedom-hero .pf-freedom-actions { gap: 10px 18px; margin-top: 22px; }
  .pf-freedom-hero .pf-freedom-photo { order: 2; position: relative; height: clamp(260px, 54vw, 390px); width: 100%; }
  .pf-freedom-hero .pf-freedom-photo img { object-position: 81% center; }
  .pf-freedom-hero .pf-freedom-dashboard { order: 3; position: relative; z-index: 2; align-self: center; width: min(340px, calc(100% - 40px)); margin: -34px auto 0; padding: 17px 20px; }
  .pf-freedom-hero .pf-freedom-chart { margin-top: 11px; }
  .pf-freedom-hero .pf-freedom-chart img { max-height: 43px; }
  }

/* v3: brand line sits under the founder, larger and on the photo */
.pf-freedom-hero .pf-freedom-description { margin: 22px 0 0; font-size: 16px; color: #344f6a; }
.pf-freedom-hero .pf-freedom-promise { margin: 10px 0 0; }
.pf-freedom-hero .pf-freedom-focus { position: absolute; z-index: 2; right: 4%; bottom: 26px; margin: 0; padding: 10px 22px; border-radius: 99px; background: #0f2a4dcc; color: #fff; font-size: 20px; font-weight: 800; letter-spacing: .03em; line-height: 1.4; white-space: nowrap; box-shadow: 0 8px 26px #0f2a4d33; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.pf-freedom-hero .pf-freedom-photo img { object-position: 60% center; }
@media (max-width: 1100px) and (min-width: 781px) {
  .pf-freedom-hero .pf-freedom-focus { font-size: 16px; padding: 8px 16px; right: 3%; bottom: 20px; }
}
@media (max-width: 780px) {
  .pf-freedom-hero .pf-freedom-focus { order: 4; position: relative; right: auto; bottom: auto; align-self: center; margin: 18px auto 26px; padding: 9px 16px; font-size: 15px; white-space: normal; text-align: center; background: #0f2a4d; }
  .pf-freedom-hero .pf-freedom-description { font-size: 15px; }
}

/* v4: deep-blue ocean stays visible; screen in the photo replaces the demo card */
.pf-freedom-hero .pf-freedom-dashboard { display: none !important; }
.pf-freedom-hero::before { background: linear-gradient(90deg, #f4faffd0 0%, #f4faffa8 26%, #f4faff52 42%, #f4faff00 58%) !important; }
.pf-freedom-hero .pf-freedom-photo img { object-position: 58% 50%; }
.pf-freedom-hero .pf-freedom-copy h1, .pf-freedom-hero .pf-freedom-promise { text-shadow: 0 1px 14px #ffffffb3; }
.pf-freedom-hero .pf-freedom-description { color: #1d3a5a; font-weight: 500; text-shadow: 0 1px 10px #ffffffd9; }
.pf-freedom-hero .pf-freedom-eyebrow { text-shadow: 0 1px 8px #ffffffd9; }
@media (max-width: 1100px) and (min-width: 781px) {
  .pf-freedom-hero::before { background: linear-gradient(90deg, #f4faffe0 0%, #f4faffbd 40%, #f4faff3a 66%, #f4faff00 80%) !important; }
}

/* v5: store migration steps + customer reels & reviews */

/* ---- Already have a store? ---- */
.pf-migrate { background: linear-gradient(135deg, #102c53 0%, #163a6b 60%, #1d4b86 100%); color: #fff; padding: 96px 0; position: relative; overflow: hidden; }
.pf-migrate::after { content: ''; position: absolute; right: -160px; top: -160px; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, #3b82f633 0%, #3b82f600 70%); pointer-events: none; }
.pf-migrate-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center; position: relative; z-index: 1; }
.pf-migrate .pf-eyebrow { color: #93c5fd; }
.pf-migrate h2 { color: #fff; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.02em; margin: 10px 0 18px; }
.pf-migrate h2 .pf-accent { color: #7db4ff; }
.pf-migrate-sub { color: #cfe0f5; font-size: 18px; line-height: 1.6; margin: 0 0 22px; max-width: 540px; }
.pf-migrate-checks { list-style: none; padding: 0; margin: 0 0 30px; display: grid; gap: 12px; }
.pf-migrate-checks li { display: flex; align-items: center; gap: 12px; font-size: 16px; font-weight: 600; color: #fff; }
.pf-migrate-checks li::before { content: '\2713'; flex: 0 0 24px; height: 24px; border-radius: 50%; background: #22c55e; color: #fff; display: grid; place-items: center; font-size: 13px; font-weight: 800; }
.pf-migrate-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; }
.pf-migrate-btn { display: inline-flex; align-items: center; gap: 10px; background: #2563eb; color: #fff !important; padding: 15px 28px; border-radius: 999px; font-weight: 700; font-size: 16px; text-decoration: none; box-shadow: 0 12px 28px #2563eb55; transition: background .15s, transform .15s; }
.pf-migrate-btn:hover { background: #1d4ed8; transform: translateY(-1px); }
.pf-migrate-link { color: #cfe0f5 !important; font-weight: 600; text-decoration: none; }
.pf-migrate-link:hover { color: #fff !important; }
.pf-migrate-steps { list-style: none; margin: 0; padding: 0; position: relative; display: grid; gap: 14px; }
.pf-migrate-steps::before { content: ''; position: absolute; left: 27px; top: 34px; bottom: 34px; border-left: 2px dashed #ffffff40; }
.pf-migrate-step { position: relative; display: flex; gap: 18px; align-items: flex-start; background: #ffffff10; border: 1px solid #ffffff1f; border-radius: 16px; padding: 18px 20px 18px 14px; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.pf-migrate-num { flex: 0 0 28px; width: 28px; height: 28px; margin: 2px 0 0; border-radius: 50%; background: #fff; color: #102c53; font-weight: 800; font-size: 14px; display: grid; place-items: center; position: relative; z-index: 1; }
.pf-migrate-step h3 { color: #fff; font-size: 18px; margin: 0 0 4px; }
.pf-migrate-step p { color: #b9cde6; font-size: 14.5px; line-height: 1.5; margin: 0; }
.pf-migrate-step--live { background: #2563eb; border-color: #3b82f6; box-shadow: 0 14px 34px #2563eb55; }
.pf-migrate-step--live .pf-migrate-num { background: #22c55e; color: #fff; }
.pf-migrate-step--live p { color: #dbeafe; }

/* ---- Customer reels ---- */
.pf-voices { padding: 96px 0; background: #f6f9fd; }
.pf-voices-head { text-align: center; max-width: 720px; margin: 0 auto 44px; }
.pf-voices-head h2 { font-size: clamp(30px, 3.4vw, 44px); letter-spacing: -.02em; margin: 10px 0 12px; }
.pf-voices-intro { color: #4b5d73; font-size: 17px; margin: 0; }
.pf-reels { display: grid; grid-template-columns: repeat(3, minmax(0, 300px)); justify-content: center; gap: 28px; }
.pf-reel { margin: 0; }
.pf-reel-media { position: relative; aspect-ratio: 9 / 16; border-radius: 22px; overflow: hidden; background: #0f2a4d; box-shadow: 0 20px 44px #0f2a4d2e; }
.pf-reel-media img, .pf-reel-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pf-reel-media img { filter: saturate(.85) brightness(.82); }
.pf-reel-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #0f2a4d00 45%, #0f2a4dcc 100%); pointer-events: none; }
.pf-reel-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; width: 68px; height: 68px; border-radius: 50%; border: 0; background: #ffffffe6; box-shadow: 0 10px 30px #0006; cursor: not-allowed; display: grid; place-items: center; }
.pf-reel-play span { width: 0; height: 0; border-left: 20px solid #2563eb; border-top: 12px solid transparent; border-bottom: 12px solid transparent; margin-left: 5px; }
.pf-reel-soon { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 2; padding: 6px 14px; border-radius: 999px; background: #ffffff26; color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.pf-reel.is-ready .pf-reel-play { cursor: pointer; }
.pf-reel.is-ready .pf-reel-soon { display: none; }
.pf-reel-copy h3 { font-size: 19px; margin: 18px 0 6px; }
.pf-reel-copy p { color: #4b5d73; font-size: 15px; margin: 0; }

/* ---- Reviews ---- */
.pf-reviews-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 10px 24px; margin: 72px 0 22px; padding-top: 40px; border-top: 1px solid #dfe7f1; }
.pf-reviews-head h3 { font-size: 26px; margin: 0; letter-spacing: -.01em; }
.pf-reviews-rating { margin: 0; color: #64748b; font-size: 14px; }
.pf-stars { color: #f59e0b; letter-spacing: 2px; }
.pf-reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.pf-review { margin: 0; background: #fff; border: 1px solid #e3eaf3; border-radius: 18px; padding: 26px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 6px 20px #0f2a4d0d; }
.pf-review .pf-stars { font-size: 17px; }
.pf-review blockquote { margin: 0; padding: 0; border: 0; font-size: 16px; line-height: 1.6; color: #1e293b; flex: 1; }
.pf-review figcaption { display: flex; align-items: center; gap: 12px; font-size: 13.5px; color: #64748b; }
.pf-review figcaption b { display: block; color: #0f2a4d; font-size: 15px; }
.pf-review-avatar { flex: 0 0 40px; height: 40px; border-radius: 50%; background: #dbeafe; color: #1d4ed8; font-weight: 800; display: grid; place-items: center; }

@media (max-width: 960px) {
  .pf-migrate { padding: 72px 0; }
  .pf-migrate-grid { grid-template-columns: 1fr; gap: 40px; }
  .pf-reviews { grid-template-columns: 1fr; }
}
@media (max-width: 780px) {
  .pf-voices { padding: 72px 0; }
  .pf-reels { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 72%; justify-content: start; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 20px 12px; margin: 0 -20px; scrollbar-width: none; }
  .pf-reels::-webkit-scrollbar { display: none; }
  .pf-reel { scroll-snap-align: center; }
  .pf-migrate-sub { font-size: 16px; }
}

/* v6: six-stage dropshipping route (replaces the 3-card "work behind the delivery" block) */
.pf-journey { padding: 96px 0; background: #f5f9ff; border-top: 1px solid #e4ecf7; border-bottom: 1px solid #e4ecf7; }
.pf-journey-head { max-width: 760px; margin: 0 0 54px; }
.pf-journey-head h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.12; letter-spacing: -0.02em; margin: 10px 0 14px; color: #0a2540; }
.pf-journey-sub { font-size: 17px; line-height: 1.6; color: #44607f; margin: 0; }

/* horizontal rail on desktop, vertical on small screens */
.pf-journey-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; position: relative; }
.pf-journey-track::before { content: ''; position: absolute; left: 0; right: 0; top: 27px; height: 2px; background: linear-gradient(90deg, #2563eb 0%, #60a5fa 72%, #ff6b35 100%); opacity: .35; }

.pf-jstage { position: relative; padding: 0 18px 0 0; }
.pf-jstage:last-child { padding-right: 0; }
.pf-jbadge { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 16px; background: #fff; border: 2px solid #2563eb; box-shadow: 0 10px 22px -12px rgba(37, 99, 235, .55); }
.pf-jbadge svg { width: 25px; height: 25px; fill: none; stroke: #2563eb; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pf-jstage-final .pf-jbadge { border-color: #ff6b35; box-shadow: 0 10px 22px -12px rgba(255, 107, 53, .6); }
.pf-jstage-final .pf-jbadge svg { stroke: #ff6b35; }

.pf-jbody { padding-top: 20px; }
.pf-jnum { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #7c93ad; margin: 0 0 4px; }
.pf-jbody h3 { font-size: 19px; line-height: 1.2; margin: 0 0 10px; color: #0a2540; letter-spacing: -0.01em; }
.pf-jdesc { font-size: 14px; line-height: 1.62; color: #46607d; margin: 0 0 14px; }
.pf-jfacts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pf-jfacts li { position: relative; padding-left: 18px; font-size: 12.5px; line-height: 1.4; color: #1d4ed8; font-weight: 600; }
.pf-jfacts li::before { content: ''; position: absolute; left: 0; top: 5px; width: 9px; height: 5px; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.pf-jstage-final .pf-jfacts li { color: #d1491d; }

/* ownership summary + CTA */
.pf-journey-split { margin-top: 56px; display: flex; flex-wrap: wrap; align-items: center; gap: 18px 36px; padding: 24px 28px; background: #fff; border: 1px solid #e0e9f6; border-radius: 16px; }
.pf-journey-side-lbl { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #7c93ad; margin: 0 0 4px; }
.pf-journey-side-val { font-size: 15.5px; font-weight: 700; color: #0a2540; margin: 0; }
.pf-journey-side-us .pf-journey-side-val { color: #2563eb; }
.pf-journey-cta { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; background: #2563eb; color: #fff; font-weight: 700; font-size: 15px; padding: 13px 24px; border-radius: 10px; text-decoration: none; transition: background .18s ease, transform .18s ease; }
.pf-journey-cta:hover { background: #1d4ed8; transform: translateY(-1px); color: #fff; }

@media (max-width: 1080px) {
  .pf-journey-track { grid-template-columns: repeat(3, 1fr); gap: 36px 0; }
  .pf-journey-track::before { display: none; }
}
@media (max-width: 720px) {
  .pf-journey { padding: 64px 0; }
  .pf-journey-head { margin-bottom: 36px; }
  /* vertical rail: badge column with a connecting line */
  .pf-journey-track { grid-template-columns: 1fr; gap: 0; }
  .pf-journey-track::before { display: block; left: 26px; right: auto; top: 10px; bottom: 40px; height: auto; width: 2px; background: linear-gradient(180deg, #2563eb 0%, #60a5fa 72%, #ff6b35 100%); }
  .pf-jstage { display: grid; grid-template-columns: 54px 1fr; gap: 16px; padding: 0 0 28px; }
  .pf-jstage:last-child { padding-bottom: 0; }
  .pf-jbody { padding-top: 2px; }
  .pf-jfacts { flex-direction: row; flex-wrap: wrap; gap: 6px 16px; }
  .pf-journey-split { margin-top: 36px; padding: 20px; }
  .pf-journey-cta { margin-left: 0; width: 100%; justify-content: center; }
  /* keep the CTA clear of the floating chat widget */
  .pf-journey-split { padding-bottom: 86px; }
}

/* v7 batch 2: hero signup CTA, without/with contrast, stage routing */

/* --- hero: free signup becomes the primary action --- */
.pf-freedom-actions .pf-signup-btn { display: inline-flex; align-items: center; gap: 9px; background: #ff6b35; color: #fff; font-weight: 700; font-size: 16px; line-height: 1.2; padding: 15px 28px; border-radius: 10px; text-decoration: none; box-shadow: 0 14px 30px -14px rgba(255, 107, 53, .85); transition: background .18s ease, transform .18s ease; }
.pf-freedom-actions .pf-signup-btn:hover,
.pf-freedom-actions .pf-signup-btn:focus { background: #ea580c; color: #fff; transform: translateY(-1px); }
.pf-freedom-actions .pf-signup-note { flex-basis: 100%; margin: 4px 0 0; font-size: 13px; line-height: 1.5; font-weight: 600; color: #214866; }
.pf-freedom-actions .pf-quote-link,
.pf-freedom-actions .pf-quote-preview { background: rgba(255, 255, 255, .92); border: 1.5px solid #c9d8e8; color: #0a2540; box-shadow: 0 8px 20px -14px rgba(10, 37, 64, .6); }
.pf-freedom-actions .pf-quote-link:hover,
.pf-freedom-actions .pf-quote-preview:hover { background: #fff; border-color: #2563eb; color: #1d4ed8; }

/* --- without / with --- */
.pf-contrast { padding: 92px 0; background: #fff; }
.pf-contrast-head { max-width: 720px; margin: 0 0 44px; }
.pf-contrast-head h2 { font-size: clamp(30px, 3.3vw, 42px); line-height: 1.14; letter-spacing: -0.02em; margin: 10px 0 14px; color: #0a2540; }
.pf-contrast-sub { font-size: 17px; line-height: 1.6; color: #44607f; margin: 0; }
.pf-contrast-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.pf-contrast-col { padding: 30px 30px 34px; border-radius: 18px; border: 1px solid #e4ecf7; }
.pf-contrast-without { background: #fbfcfe; }
.pf-contrast-with { background: #f3f8ff; border-color: #c7dcfb; }
.pf-contrast-label { font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; margin: 0 0 20px; color: #8396ab; }
.pf-contrast-with .pf-contrast-label { color: #1d4ed8; }
.pf-contrast-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 15px; }
.pf-contrast-list li { position: relative; padding-left: 32px; font-size: 15px; line-height: 1.58; color: #3c566f; }
.pf-contrast-without .pf-contrast-list li::before { content: ''; position: absolute; left: 4px; top: 7px; width: 13px; height: 13px; border-radius: 50%; border: 2px solid #c3cfdc; }
.pf-contrast-without .pf-contrast-list li::after { content: ''; position: absolute; left: 8px; top: 12px; width: 9px; height: 2px; background: #c3cfdc; border-radius: 2px; }
.pf-contrast-with .pf-contrast-list li { color: #23405e; font-weight: 500; }
.pf-contrast-with .pf-contrast-list li::before { content: ''; position: absolute; left: 4px; top: 6px; width: 12px; height: 7px; border-left: 2.4px solid #2563eb; border-bottom: 2.4px solid #2563eb; transform: rotate(-45deg); }

/* --- stage routing --- */
.pf-route { padding: 92px 0; background: #0a2540; color: #fff; }
.pf-route-head { max-width: 720px; margin: 0 0 40px; }
.pf-route .pf-eyebrow { color: #7fb0ff; }
.pf-route-head h2 { font-size: clamp(30px, 3.3vw, 42px); line-height: 1.14; letter-spacing: -0.02em; margin: 10px 0 14px; color: #fff; }
.pf-route-sub { font-size: 17px; line-height: 1.6; color: rgba(226, 238, 255, .78); margin: 0; }
.pf-route-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.pf-route-card { display: flex; flex-direction: column; gap: 10px; padding: 26px 24px 24px; border-radius: 16px; background: rgba(255, 255, 255, .055); border: 1px solid rgba(255, 255, 255, .13); text-decoration: none; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.pf-route-card:hover { background: rgba(255, 255, 255, .1); border-color: rgba(127, 176, 255, .6); transform: translateY(-3px); }
.pf-route-when { font-size: 16.5px; font-weight: 700; line-height: 1.32; color: #fff; margin: 0; letter-spacing: -0.01em; }
.pf-route-do { font-size: 14px; line-height: 1.58; color: rgba(221, 234, 252, .76); margin: 0; flex: 1; }
.pf-route-go { font-size: 14px; font-weight: 700; color: #7fb0ff; display: inline-flex; align-items: center; gap: 7px; }
.pf-route-card:hover .pf-route-go { color: #a8c9ff; }

.pf-route-foot { margin-top: 36px; display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; padding-top: 30px; border-top: 1px solid rgba(255, 255, 255, .14); }
.pf-route-foot-copy { margin: 0; font-size: 15.5px; line-height: 1.55; color: rgba(226, 238, 255, .82); max-width: 560px; }
.pf-route-cta { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; background: #ff6b35; color: #fff; font-weight: 700; font-size: 15px; padding: 14px 26px; border-radius: 10px; text-decoration: none; transition: background .18s ease, transform .18s ease; }
.pf-route-cta:hover { background: #ea580c; color: #fff; transform: translateY(-1px); }

@media (max-width: 1080px) {
  .pf-route-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .pf-contrast, .pf-route { padding: 62px 0; }
  .pf-contrast-head, .pf-route-head { margin-bottom: 30px; }
  .pf-contrast-grid { grid-template-columns: 1fr; gap: 16px; }
  .pf-contrast-col { padding: 24px 22px 26px; }
  .pf-route-grid { grid-template-columns: 1fr; }
  .pf-route-foot { margin-top: 26px; padding-bottom: 76px; }
  .pf-route-cta { margin-left: 0; width: 100%; justify-content: center; }
  .pf-freedom-actions .pf-signup-btn { width: 100%; justify-content: center; }
}