/* Strona główna i podstrony marketingowe (poznaj.php, funkcje.php). Samodzielny arkusz. */
.lp-project {
  --project-ink: #142338;
  --project-muted: #526681;
  --project-blue: #1261ef;
  --project-rule: #dce6f4;
  --project-mint: #c8f5e6;
  margin: 0;
  background: #fff;
  color: var(--project-ink);
  font-family: 'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
.lp-project *, .lp-project *::before, .lp-project *::after { box-sizing: border-box; }
.lp-project h1, .lp-project h2, .lp-project h3, .lp-project p, .lp-project figure { margin: 0; }
.lp-project h1, .lp-project h2, .lp-project h3 { font-family: 'Archivo', system-ui, sans-serif; letter-spacing: -.035em; text-wrap: balance; }
.lp-project a { color: inherit; text-decoration: none; }
.lp-project ul { margin: 0; padding: 0; list-style: none; }
.lp-project svg { flex: 0 0 auto; vertical-align: middle; }
.lp-project img { display: block; max-width: 100%; }
.lp-project section[id] { scroll-margin-top: 112px; }
.lp-project :focus-visible { outline: 3px solid #367ff5; outline-offset: 5px; border-radius: 5px; }
.lp-project ::selection { background: #c8ddff; color: #142338; }
.project-shell { width: min(1440px, calc(100% - 112px)); margin-inline: auto; }
.project-skip { position: fixed; top: -100px; left: 20px; z-index: 100; background: #fff; padding: 12px 20px; }
.project-skip:focus { top: 12px; }
.project-header { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.96); border-bottom: 1px solid #edf2f9; backdrop-filter: blur(12px); }
.project-header-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.project-brand { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; font-family: 'Archivo', system-ui, sans-serif; font-size: 23px; font-weight: 800; letter-spacing: -.04em; }
.project-brand svg { color: var(--project-blue); }
.project-header-inner.project-shell { width: min(1600px, calc(100% - 64px)); }
.project-nav { display: flex; align-items: center; gap: 4px; padding: 6px; border: 1px solid #e8edf5; border-radius: 18px; background: #f6f8fc; }
.project-nav a { position: relative; padding: 13px 16px; border-radius: 12px; font-size: 18px; line-height: 1.3; font-weight: 700; letter-spacing: -.02em; white-space: nowrap; color: #273c59; transition: color .18s, background .18s, box-shadow .18s; }
.project-nav a::after { content: ''; position: absolute; bottom: 5px; left: calc(50% - 10px); width: 20px; height: 3px; border-radius: 3px; background: #2463eb; transform: scaleX(0); transition: transform .18s; }
.project-nav a:hover, .project-nav a:focus-visible, .project-nav a:active { color: #174bad; background: #fff; box-shadow: 0 3px 10px #203e6b0d; }
.project-nav a:hover::after, .project-nav a:focus-visible::after, .project-nav a:active::after { transform: scaleX(1); }
.project-header-actions { display: flex; align-items: center; gap: 24px; }
.project-login { font-size: 14px; font-weight: 600; white-space: nowrap; padding: 11px 16px; background: #f4f7fc; border: 1px solid #e5ebf4; border-radius: 12px; }
.project-header-actions .project-login:hover { text-decoration: none; background: #eaf0fa; }
.project-login:hover, .project-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.lp-project .project-button { display: inline-flex; align-items: center; justify-content: center; gap: 16px; padding: 13px 23px; min-height: 48px; color: #fff; background: var(--project-blue); border: 1px solid var(--project-blue); border-radius: 12px; font-size: 15px; line-height: 1.3; font-weight: 700; text-align: center; box-shadow: 0 7px 18px -10px #1261ef; transition: background .18s, box-shadow .18s; }
.lp-project .project-button:hover { background: #094ecb; border-color: #094ecb; box-shadow: 0 8px 24px -9px #1261ef; }
.lp-project .project-button-outline { color: var(--project-blue); background: #fff; border-color: #9bbcfc; box-shadow: none; }
.lp-project .project-button-outline:hover { color: #094ecb; background: #eff5ff; border-color: #1261ef; box-shadow: none; }
.lp-project .project-button-lg { min-width: 208px; padding: 16px 28px; font-size: 17px; }
.lp-project .project-header-actions .project-button { background: linear-gradient(120deg, #142b4e, #204478); border-color: #1c395f; padding: 9px 10px 9px 19px; gap: 14px; border-radius: 14px; box-shadow: 0 8px 18px -12px #142338; }
.lp-project .project-header-actions .project-button > span { display: grid; place-items: center; width: 29px; height: 29px; background: #3476ef; border-radius: 9px; font-size: 18px; }
.lp-project .project-header-actions .project-button:hover { background: #203f6d; box-shadow: 0 10px 24px -12px #14233890; }
.project-eyebrow { display: inline-block; margin-bottom: 14px; color: var(--project-blue); font-size: 13px; font-weight: 800; line-height: 1.4; letter-spacing: .07em; text-transform: uppercase; }
.project-pill { padding: 8px 17px; background: #e8f3ff; border-radius: 100px; font-size: 12px; letter-spacing: .025em; }
.project-hero { position: relative; isolation: isolate; padding-top: 48px; background: linear-gradient(180deg, #f4faff, #fff 440px); }
.project-hero::before { content: ''; position: absolute; z-index: -1; inset: 0 0 auto; height: 440px; background: radial-gradient(ellipse at 0 0, #e6f3ff 0, transparent 52%), radial-gradient(ellipse at 100% 0, #eaf4ff 0, transparent 47%); pointer-events: none; }
.project-hero-copy { position: relative; text-align: center; }
.project-hero h1 { font-size: clamp(38px, 4.65vw, 70px); line-height: 1.06; font-weight: 800; }
.project-hero h1 > span { color: var(--project-blue); }
.project-hero-copy > p { margin-top: 22px; font-size: 19px; font-weight: 600; line-height: 1.5; }
.project-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; margin-top: 25px; }
.project-checks { display: flex; align-items: center; flex-wrap: wrap; gap: 13px 24px; }
.project-checks li { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.project-checks svg { width: 23px; height: 23px; padding: 4px; color: #155b47; background: var(--project-mint); border-radius: 50%; }
.project-hero .project-checks { justify-content: center; margin-top: 20px; }
.lp-project .project-hero-visual { width: min(1635px, 100%); margin: 12px auto 0; }
.project-hero-visual img { width: 100%; height: auto; }
.project-hero-visual figcaption { margin: -25px 24px 0; position: relative; color: #366fbd; text-align: center; font-size: 14px; font-weight: 600; }
.project-features { padding-block: 58px 48px; }
.project-section-heading { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 60px; margin-bottom: 28px; }
.lp-project h2 { font-size: clamp(29px, 2.8vw, 43px); line-height: 1.12; font-weight: 700; }
.project-section-heading > p { padding-left: 36px; border-left: 1px solid #b6ccec; color: var(--project-muted); font-size: 16px; }
.project-section-heading > p strong { display: block; margin-bottom: 6px; color: var(--project-ink); font-size: 17px; }
.project-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.project-feature { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 30px; border-radius: 18px; background: linear-gradient(135deg,#eef7ff,#dfeeff); }
.project-feature-order { background: linear-gradient(135deg,#edfff8,#d7f7ed); }
.project-feature-team { background: linear-gradient(135deg,#edf5ff,#dfeeff); }
.project-feature-icon { color: var(--project-blue); margin-bottom: 16px; }
.project-feature-order .project-feature-icon { color: #08606c; }
.project-feature h3 { font-size: clamp(20px,1.7vw,26px); line-height: 1.2; margin-bottom: 12px; }
.project-feature > p { font-size: 16px; line-height: 1.5; color: #344e70; margin-bottom: 22px; }
.project-mail-brands { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; width: 100%; margin-top: auto; }
.project-mail-brands .project-wordmark { display: flex; align-items: center; justify-content: center; min-height: 52px; background: #fff; border-radius: 10px; }
.project-wordmark { font-size: 18px; font-weight: 800; letter-spacing: -.04em; }
.brand-gmail { color: #ba2823; }
.brand-onet { color: #282318; }
.brand-wp { color: #d31939; }
.brand-allegro { color: #c94300; }
.brand-empik { color: #151c27; }
.brand-erli { color: #08769f; }
.brand-sellasist { color: #192d4a; }
.brand-base { color: #0f658e; }
.brand-apilo { color: #172c58; }
.project-connector { position: absolute; width: 76px; height: 64px; right: -54px; z-index: 2; overflow: visible; pointer-events: none; color: #1261ef; }
.project-connector path { stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.project-connector path:first-child { stroke-dasharray: 5 6; }
.project-connector circle { fill: currentColor; }
.project-connector-one { top: 53%; }
.project-connector-two { top: 67%; }
.project-order-card { width: 100%; margin-top: auto; padding: 16px 18px; background: #fff; border-radius: 12px; }
.project-order-card > div { display: flex; align-items: center; gap: 15px; }
.project-order-card > div:first-child { justify-content: space-between; margin-bottom: 15px; }
.project-order-card > div > span:not(.project-status) { color: var(--project-muted); font-size: 14px; }
.project-order-card strong { display: block; font-size: 17px; color: var(--project-ink); }
.project-status { display: inline-flex; align-items: center; gap: 4px; padding: 5px 9px; border-radius: 7px; background: #d5f7e9; color: #125a43; font-size: 12px; font-weight: 700; white-space: nowrap; }
.project-feature .project-order-brands { width: 100%; display: flex; justify-content: center; gap: 14px; margin: 10px 0 0; font-size: 14px; }
.project-order-brands > span { color: var(--project-blue); }
.lp-project .project-team { width: 100%; margin-top: auto; }
.project-team li { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 10px; margin-top: 7px; padding: 9px; background: rgba(255,255,255,.85); border-radius: 9px; font-size: 13px; }
.project-team li > span:last-child { font-size: 12px; color: #536681; }
.project-avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 7px; background: #142e50; color: #fff; font-size: 12px; font-weight: 700; }
.avatar-blue { background: #1261ef; }
.avatar-green { background: #008264; }
.project-ai { padding: 52px 0; background: radial-gradient(ellipse at 72% 70%,#173b62,transparent 65%), #112b48; color: #fff; }
.project-ai-inner { display: grid; grid-template-columns: 1.08fr 1fr; gap: 64px; align-items: center; }
.project-pill-mint { background: var(--project-mint); color: #123447; }
.project-ai h2 { margin-bottom: 16px; }
.project-ai p { font-size: 17px; }
.project-ai .project-checks { margin-top: 24px; gap: 12px 18px; }
.project-ai .project-checks li { font-size: 13px; }
.project-ai-demo { padding: 24px; background: #fff; color: var(--project-ink); border-radius: 14px; box-shadow: 0 20px 48px -20px rgba(0,0,0,.45); }
.project-ai-demo-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.project-ai-demo-top > span:first-child { padding: 12px; border-radius: 9px; background: #edf3fc; font-size: 14px; }
.project-ai-answer { display: flex; gap: 16px; align-items: center; margin-top: 22px; color: var(--project-blue); }
.project-ai-answer > p { padding: 18px; border-radius: 12px; background: #e7f2ff; color: #194b95; font-size: 15px; line-height: 1.6; }
.project-demo-note { display: block; text-align: right; margin-top: 13px; color: #677790; font-size: 12px; }
.project-integrations { padding-block: 46px 32px; }
.project-integrations h2 { font-size: clamp(28px,2.7vw,40px); }
.project-integration-grid { display: grid; grid-template-columns: repeat(9,minmax(0,1fr)); gap: 10px; }
.project-integration-grid li { padding: 19px 7px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; text-align: center; border: 1px solid var(--project-rule); border-radius: 12px; background: #fff; }
.project-integration-grid li > span:last-child { font-size: 12px; color: #64758b; }
.project-pricing { margin-bottom: 26px; }
.project-pricing-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 25px 30px; border-radius: 15px; background: linear-gradient(105deg,#e9f5ff,#dfedff); }
.project-pricing-copy { display: flex; align-items: center; gap: 22px; }
.project-pricing-copy > svg { color: var(--project-blue); }
.project-pricing-heading h2 { font-size: 25px; letter-spacing: -.025em; }
.project-pricing-heading p { color: #47607f; margin-top: 5px; }
.project-plans { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)); gap: 20px; margin-top: 24px; }
.project-plan { display: flex; flex-direction: column; position: relative; padding: 30px 26px; border: 1px solid var(--project-rule); border-radius: 16px; background: #fff; }
.project-plan-featured { border: 2px solid var(--project-blue); background: #f7faff; }
.project-plan-badge { align-self: flex-start; margin-bottom: 10px; color: #0c54cc; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.project-plan h3 { font-size: 23px; }
.project-plan .project-price { margin: 15px 0; font-size: 38px; font-weight: 800; line-height: 1.2; letter-spacing: -.04em; }
.project-price > span { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--project-muted); }
.project-plan > p:not(.project-price) { color: var(--project-muted); }
.project-plan ul { display: grid; gap: 9px; padding-block: 25px; }
.project-plan li { display: flex; gap: 9px; align-items: center; }
.project-plan li svg { color: #078263; }
.project-plan .project-button { margin-top: auto; }
.project-closing > div { display: flex; align-items: center; gap: 24px; padding: 25px 32px; border-radius: 16px; background: linear-gradient(110deg,#102842,#15375a); color: #fff; }
.project-closing > div > svg { color: #dae9ff; }
.project-closing h2 { font-size: 25px; letter-spacing: -.025em; }
.project-closing .project-button { margin-left: auto; flex: 0 0 auto; }
.project-footer { padding-block: 32px 22px; }
.project-footer-main { display: flex; align-items: center; gap: 28px; }
.project-footer-main small { color: var(--project-muted); font-size: 13px; }
.project-footer-main > a:last-child { margin-left: auto; font-size: 14px; white-space: nowrap; }
@media (max-width: 1250px) {
  .project-shell { width: calc(100% - 64px); }
  .project-header-inner { gap: 16px; }
  .project-header-actions { gap: 14px; }
  .project-nav a { padding-inline: 12px; }
  .project-brand { font-size: 21px; }
  .project-feature { padding: 24px; }
  .project-feature-grid { gap: 24px; }
  .project-connector { right: -42px; width: 62px; }
  .project-team li { grid-template-columns: 30px 1fr; }
  .project-team li > span:last-child { grid-column: 2; margin-top: -8px; }
  .project-team .project-avatar { width: 30px; height: 30px; grid-row: span 2; }
  .project-ai-inner { gap: 36px; }
  .project-integration-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
}
@media (min-width: 1001px) and (max-width: 1200px) {
  .project-header-inner { flex-wrap: wrap; padding-block: 14px; gap: 12px; }
  .project-nav { order: 3; margin-inline: auto; }
  .lp-project section[id] { scroll-margin-top: 170px; }
}
@media (max-width: 1000px) {
  .project-header { position: relative; }
  .project-header-inner { flex-wrap: wrap; padding-block: 16px; gap: 12px; }
  .project-nav { order: 3; width: 100%; justify-content: center; }
  .project-nav a { padding-inline: 19px; }
  .project-section-heading { grid-template-columns: 1fr; gap: 18px; }
  .project-section-heading > p { padding-left: 0; border: 0; max-width: 680px; }
  .project-ai-inner { grid-template-columns: 1fr; }
  .project-ai-demo { max-width: 680px; width: 100%; }
  .project-feature h3 { font-size: 21px; }
  .project-feature { padding: 22px 18px; }
  .project-mail-brands { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-wordmark { font-size: 17px; }
  .project-order-card { padding: 12px; }
  .project-order-card > div:first-child { align-items: flex-start; flex-direction: column; gap: 7px; }
  .project-closing > div { flex-wrap: wrap; }
  .project-closing h2 { flex: 1; }
  .project-closing .project-button { margin-left: 64px; }
}
@media (max-width: 700px) {
  .project-shell { width: calc(100% - 36px); }
  .project-header-inner { column-gap: 8px; }
  .project-header-inner.project-shell { width: calc(100% - 36px); }
  .project-brand { font-size: 20px; gap: 7px; }
  .project-brand svg { width: 24px; }
  .project-header-actions .project-button { display: none; }
  .project-header-actions { margin-left: auto; }
  .project-nav { border-radius: 14px; flex-wrap: wrap; gap: 2px; padding: 4px; }
  .project-nav a { padding: 12px; font-size: 15px; }
  .project-hero { padding-top: 34px; }
  .project-hero h1 { font-size: clamp(31px,7.8vw,50px); }
  .project-hero-copy > p { font-size: 17px; margin-top: 18px; }
  .project-hero-copy > p br { display: none; }
  .project-eyebrow { font-size: 12px; }
  .project-pill { font-size: 11px; padding: 8px 12px; }
  .project-actions { gap: 10px; }
  .lp-project .project-button-lg { min-width: 0; padding: 14px 18px; font-size: 15px; flex: 1 1 150px; }
  .project-hero .project-checks { gap: 10px 14px; }
  .project-checks li { font-size: 12px; }
  .project-checks svg { width: 20px; height: 20px; }
  .project-hero-visual figcaption { margin-top: 0; font-size: 12px; }
  .project-features { padding-block: 32px; }
  .project-section-heading { margin-bottom: 22px; }
  .lp-project h2 { font-size: clamp(27px,6.6vw,35px); }
  .project-feature-grid { grid-template-columns: 1fr; gap: 18px; }
  .project-feature { padding: 26px; }
  .project-feature h3 { font-size: 24px; }
  .project-feature > p { max-width: 440px; }
  .project-mail-brands { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .project-connector { display: none; }
  .project-order-card > div:first-child { flex-direction: row; align-items: center; }
  .project-team li { grid-template-columns: 34px minmax(0,1fr) auto; }
  .project-team .project-avatar { grid-row: auto; }
  .project-team li > span:last-child { grid-column: auto; margin: 0; }
  .project-ai { padding-block: 34px; }
  .project-ai-inner { gap: 26px; }
  .project-ai-demo { padding: 18px; }
  .project-ai-answer { gap: 10px; }
  .project-ai-answer > svg { width: 25px; }
  .project-ai-answer > p { padding: 14px; font-size: 14px; }
  .project-integrations { padding-block: 32px 24px; }
  .project-integration-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  .project-integration-grid li { padding: 16px 6px; }
  .project-integration-grid li > span:last-child { font-size: 11px; }
  .project-pricing-heading { padding: 22px; flex-direction: column; align-items: stretch; }
  .project-pricing-copy { gap: 14px; align-items: flex-start; }
  .project-pricing-copy > svg { width: 28px; }
  .project-pricing-heading h2 { font-size: 22px; }
  .project-closing > div { gap: 16px; padding: 24px; }
  .project-closing > div > svg { display: none; }
  .project-closing h2 { flex-basis: 100%; font-size: 25px; }
  .project-closing .project-button { margin: 0; width: 100%; }
  .project-footer-main { flex-wrap: wrap; gap: 14px; }
  .project-footer-main small { order: 3; flex-basis: 100%; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .lp-project *, .lp-project *::before, .lp-project *::after { transition: none !important; } }