/* Conversion improvements, loaded after the existing theme. */
.lf-eyebrow { color: #5153b7; font-size: 15px; font-weight: 600; letter-spacing: .03em; }
.lf-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 28px; }
.lf-secondary-link { color: #303c49; text-underline-offset: 5px; }
.kl-homepage .kl-section-hero { min-height: 580px; }
.kl-homepage .kl-section-hero h1 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.2; }
.lf-service-group { margin-bottom: 56px; scroll-margin-top: 30px; }
.lf-service-group h2 { margin-bottom: 24px; font-weight: 700; }
.lf-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lf-service-card { display: flex; flex-direction: column; align-items: flex-start; padding: 26px; border: 1px solid #dfdfef; border-radius: 14px; background: #f8f8fd; color: #233c4a; text-decoration: none; }
.lf-service-card:hover { color: #233c4a; border-color: #6264d6; background: #f0f0ff; }
.lf-service-card img { object-fit: contain; margin-bottom: 22px; }
.lf-service-card h3 { font-size: 21px; line-height: 1.4; font-weight: 600; }
.lf-service-card p { margin: 12px 0 24px; font-size: 15px; }
.lf-service-card strong { display: block; }
.lf-service-action { margin-top: auto; color: #5052b5; font-weight: 600; font-size: 15px; }
.lf-seo-banner { background: #f0f0fc; padding: 40px 0; }
.lf-seo-banner > div { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.lf-seo-banner h2 { font-size: 28px; }
.lf-seo-banner p { margin-bottom: 0; }
a:focus-visible, button:focus-visible { outline: 3px solid #41439f; outline-offset: 5px; }
.kl-daily-rate[hidden] { display: none; }
@media (max-width: 767px) {
  .lf-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .lf-service-card { padding: 18px; }
  .lf-service-card h3 { font-size: 18px; }
  .lf-seo-banner > div { flex-direction: column; align-items: flex-start; }
  .kl-homepage .kl-section-hero { min-height: auto; }
  .kl-homepage .kl-wrapper-img-hero { max-height: 280px; }
}
@media (max-width: 420px) {
  .lf-service-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .kl-homepage .kl-animate { opacity: 1 !important; visibility: visible !important; animation: none !important; }
}
/* Keep the illustration in its column so it cannot cover the copy or buttons. */
.kl-homepage .kl-section-hero .row { align-items: center; }
.kl-homepage .kl-section-hero .kl-img-hero-home { position: static; max-width: 100%; width: 100%; height: auto; margin-bottom: 0; }

/* Design-to-code handoff: an illustration beside a continuous project sequence. */
.lf-process { --lf-violet: #5753bd; --lf-mint: #7ee2bc; padding: 96px 0 110px; background: #f4f3fc; color: #233c4a; }
.lf-process-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: start; }
.lf-process-story h2, .lf-team-story h2 { font-size: clamp(40px, 5vw, 60px); line-height: 1.07; font-weight: 500; letter-spacing: -.05em; margin: 0 0 26px; }
.lf-process-story > p { font-size: 18px; line-height: 1.7; margin: 0; }
.lf-handoff { position: relative; height: 310px; margin: 30px 0 34px; max-width: 450px; }
.lf-design-sheet { position: absolute; width: 74%; height: 224px; left: 8px; top: 12px; background: white; border: 1px solid #d9d6ee; border-radius: 8px; transform: rotate(-7deg); box-shadow: 0 10px 28px #3732710d; }
.lf-sheet-bar { height: 34px; display: flex; align-items: center; gap: 5px; border-bottom: 1px solid #d9d6ee; padding: 0 14px; }
.lf-sheet-bar > span:not(.lf-code-mark) { width: 5px; height: 5px; background: #aca7c9; border-radius: 50%; }
.lf-sheet-bar small { font-size: 10px; margin-left: auto; }
.lf-design-canvas { position: relative; margin: 22px; height: 128px; }
.lf-design-canvas i { position: absolute; left: 0; top: 8px; width: 49%; height: 17px; background: #5753bd; box-shadow: 0 25px #5753bd; }
.lf-design-canvas b { position: absolute; right: 0; top: 0; width: 36%; height: 96px; background: #7ee2bc; border-radius: 50% 50% 5px 5px; }
.lf-design-canvas em { position: absolute; left: 0; top: 77px; width: 33%; height: 7px; background: #d9d6ee; box-shadow: 0 15px #d9d6ee; }
.lf-design-canvas > span { position: absolute; left: 0; bottom: 0; width: 55px; height: 16px; border-radius: 3px; background: #7ee2bc; }
.lf-code-sheet { position: absolute; right: 0; bottom: 0; width: 78%; background: #5753bd; color: white; border-radius: 8px; transform: rotate(4deg); box-shadow: 0 16px 32px #37327118; }
.lf-code-sheet .lf-sheet-bar { border-color: #ffffff30; height: 40px; }
.lf-code-sheet .lf-sheet-bar small { margin: 0; font-size: 11px; }
.lf-code-mark { margin-left: auto; font-size: 15px; color: #7ee2bc; }
.lf-code-lines { display: grid; gap: 7px; padding: 21px 22px 25px; font: 12px/1.5 monospace; }
.lf-code-lines span { color: #d8d5ff; }
.lf-code-lines span:nth-child(3) { color: #b3ffdf; }
.lf-process-path { padding: 8px 0 0; margin: 0; list-style: none; }
.lf-process-path li { position: relative; display: grid; grid-template-columns: 36px 1fr; gap: 24px; padding-bottom: 30px; }
.lf-process-path li:not(:last-child)::before { content: ''; position: absolute; left: 17px; top: 37px; bottom: 1px; width: 1px; background: #cecae7; }
.lf-path-number { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #b9b3df; border-radius: 50%; color: #5753bd; font-size: 14px; }
.lf-process-path li:last-child .lf-path-number { background: #7ee2bc; border-color: #7ee2bc; color: #233c4a; }
.lf-process-path h3 { font-size: 22px; font-weight: 500; letter-spacing: -.025em; margin: 2px 0 11px; }
.lf-process-path p { font-size: 15px; line-height: 1.8; color: #5c6575; margin: 0; }
.lf-benefits { background: #5753bd; color: white; padding: 88px 0 0; border-top-left-radius: 84px; margin-top: -25px; position: relative; }
.lf-benefits-layout { display: grid; grid-template-columns: .95fr 1.25fr; gap: 9%; padding-bottom: 60px; }
.lf-team-story h2 { font-size: clamp(36px, 4.4vw, 50px); color: white; }
.lf-team-story > p { font-size: 16px; line-height: 1.8; color: #eeedff; max-width: 340px; }
.lf-team-signature { display: flex; align-items: center; gap: 20px; margin: 30px 0 0; color: #b3ffdf; }
.lf-team-signature > span:first-child, .lf-team-signature > span:last-child { font-size: 88px; font-weight: 300; line-height: 1; }
.lf-team-signature > span:nth-child(2) { font-size: 25px; line-height: 1.2; letter-spacing: -.035em; }
.lf-benefits-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 42px 32px; padding-top: 6px; }
.lf-benefits-copy h3 { font-size: 21px; line-height: 1.4; font-weight: 500; margin: 0 0 15px; color: white; letter-spacing: -.02em; }
.lf-benefits-copy p { font-size: 15px; line-height: 1.8; color: #eeedff; margin: 0; }
.lf-track-record { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #ffffff40; padding: 32px 0 38px; margin: 0; gap: 30px; }
.lf-track-record > div { display: flex; flex-direction: column-reverse; }
.lf-track-record dd { margin: 0 0 4px; font-size: 34px; font-weight: 500; letter-spacing: -.04em; }
.lf-track-record dt { font-size: 13px; font-weight: 400; color: #eeedff; }
@media (max-width: 991px) {
  .lf-process-layout, .lf-benefits-layout { gap: 40px; }
  .lf-benefits-layout { grid-template-columns: 1fr; }
  .lf-team-story { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; }
  .lf-team-signature { display: none; }
  .lf-handoff { height: 260px; }
  .lf-code-lines { font-size: 10px; padding: 18px 12px; }
  .lf-process-path h3 { font-size: 20px; }
}
@media (max-width: 575px) {
  .lf-process { padding: 56px 0 68px; }
  .lf-process-layout { grid-template-columns: 1fr; gap: 46px; }
  .lf-process-story h2 { font-size: 52px; }
  .lf-handoff { max-width: 360px; height: 275px; margin: 24px 0 28px; }
  .lf-code-lines { font-size: 11px; }
  .lf-process-path li { gap: 18px; padding-bottom: 28px; }
  .lf-benefits { padding-top: 52px; border-top-left-radius: 48px; }
  .lf-team-story { display: block; }
  .lf-team-story h2 { font-size: 42px; }
  .lf-benefits-copy { grid-template-columns: 1fr; gap: 28px; }
  .lf-benefits-copy article { max-width: 360px; }
  .lf-benefits-layout { gap: 22px; padding-bottom: 38px; }
  .lf-track-record { gap: 12px; padding-top: 24px; }
  .lf-track-record dd { font-size: 27px; }
  .lf-track-record dt { font-size: 11px; }
}

/* Static tool directory: readable marks and labels, including on small screens. */
.lf-tools{padding:80px 0;color:#233c4a;background:#f7f7fc}
.lf-tools h2{font-size:clamp(30px,3.5vw,44px);line-height:1.2;font-weight:600;letter-spacing:-.035em;margin:0 0 24px}
.lf-tools-intro{max-width:740px;font-size:18px;line-height:1.75;margin-bottom:44px}
.lf-tool-group+.lf-tool-group{margin-top:40px;padding-top:32px;border-top:1px solid #deddeb}
.lf-tool-group h3{font-size:20px;font-weight:500;margin:0 0 24px}
.lf-tool-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:24px 16px;list-style:none;padding:0;margin:0}
.lf-tool-grid li{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;min-width:0}
.lf-tool-grid img{display:block;width:72px;height:72px;max-width:none;object-fit:contain}
.lf-tool-grid span{font-size:15px;font-weight:500;line-height:1.4}
@media(max-width:991px){.lf-tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:575px){.lf-tools{padding:48px 0}.lf-tools-intro{font-size:16px;margin-bottom:32px}.lf-tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 12px}.lf-tool-grid img{width:64px;height:64px}.lf-tool-grid span{font-size:14px}}
@media(max-width:359px){.lf-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}