/* Luminos page system (DESIGN.md): shared by the hand-built service page templates. Scope class: .lx-page. Linked in right after get_header() on purpose: several rules rely on coming after the Elementor kit CSS in the cascade. */ .lx-page{ --ground:#fbfbfb; --ink:#151620; --ink-2:#3a3b47; --muted:#5d5f6e; --faint:#8c8e9c; --line:#e6e6ea; --line-2:#efeff2; --card:#fff; --soft:#f4f4f7; --orange:#ffb774; --pink:#f68dff; --blue:#7087ff; --grad:linear-gradient(100deg,#ffb774 0%,#f68dff 52%,#7087ff 100%); --good:#128a5c; --good-bg:#e8f6ef; --bad:#c23a4b; --bad-bg:#fdecee; --warn:#a4620b; --warn-bg:#fff3e2; --shadow:0 1px 2px rgba(21,22,32,.05),0 18px 44px -26px rgba(21,22,32,.32); --shadow-lg:0 2px 4px rgba(21,22,32,.04),0 40px 80px -40px rgba(21,22,32,.42); --r:22px; --r-sm:14px; font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; font-size:17px; line-height:1.6; color:var(--ink); background:var(--ground); -webkit-font-smoothing:antialiased; overflow-x:clip; background-image:radial-gradient(rgba(21,22,32,.075) 1px,transparent 1.2px); background-size:22px 22px; } .lx-page *,.lx-page *::before,.lx-page *::after{box-sizing:border-box} .lx-page ::selection{background:#f9c9ff;color:var(--ink)} .lx-page a{color:inherit} .lx-page :focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px} .lx-page h1,.lx-page h2,.lx-page h3,.lx-page h4{font-family:"Urbanist",sans-serif;color:var(--ink);margin:0;letter-spacing:-.025em;text-wrap:balance} :where(.lx-page) p{margin:0;text-wrap:pretty} :where(.lx-page) ul{margin:0;padding:0;list-style:none} .lx-page button{font:inherit;box-shadow:none !important;background-image:none;text-transform:none;letter-spacing:normal} /* 1400px of content on wide screens; the side padding keeps text clear of the site's fixed accessibility button (bottom-left, ~65px wide). */ .lx-wrap{max-width:calc(1400px + 2 * clamp(24px,5vw,72px));margin:0 auto;padding:0 clamp(24px,5vw,72px)} .lx-sec{padding:144px 0;position:relative} .lx-sec--tight{padding:120px 0} .lx-page .lx-h2{font-size:clamp(34px,4.4vw,58px);font-weight:800;line-height:1.02} .lx-page .lx-lede{font-size:19px;color:var(--muted);max-width:60ch;margin-top:20px} .lx-tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px 10px 4px 8px;white-space:nowrap} .lx-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--grad)} /* ---------- Buttons & form ---------- */ .lx-btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px; font-family:"Urbanist",sans-serif !important;font-weight:800 !important;font-size:18px !important;letter-spacing:-.005em;color:#fff !important;text-shadow:0 1px 1px rgba(60,20,80,.25); background:linear-gradient(100deg,#f7a15c 0%,#e16ff0 50%,#6479f7 100%) !important;border:0 !important;border-radius:999px;padding:17px 28px;min-height:56px;text-decoration:none;white-space:nowrap; box-shadow:0 14px 30px -14px rgba(214,110,220,.75) !important;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .2s ease} .lx-btn:hover,.lx-btn:focus{color:#fff !important;background:linear-gradient(100deg,#f7a15c 0%,#e16ff0 50%,#6479f7 100%) !important} .lx-btn:hover{transform:translateY(-2px);box-shadow:0 20px 38px -16px rgba(214,110,220,.85) !important} .lx-btn:active{transform:translateY(0)} .lx-btn[disabled]{filter:saturate(.6) brightness(.95);cursor:progress;transform:none} .lx-btn svg{width:18px;height:18px;flex:none} .lx-link{font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;text-decoration-color:var(--pink)} .lx-link:hover{text-decoration-color:var(--blue)} /* Concentric: fields and button are 56px pills (radius 28); the card adds its 10px padding, so 38. */ .lx-form{margin-top:36px;background:var(--card);border:1px solid var(--line);border-radius:38px;padding:10px;box-shadow:var(--shadow);max-width:560px} .lx-form__row{display:grid;grid-template-columns:1fr 1fr;gap:8px} .lx-form__row .lx-btn{grid-column:1/-1;width:100%} .lx-field{position:relative;display:block} .lx-field span{position:absolute;left:24px;top:9px;font-size:11.5px;font-weight:700;color:var(--muted);pointer-events:none;letter-spacing:.01em} .lx-page .lx-field input{width:100%;height:56px !important;margin:0 !important;border:1px solid transparent !important;background:var(--soft) !important;border-radius:28px !important;padding:22px 22px 6px 24px !important; font:500 16px/1.2 "DM Sans",sans-serif !important;color:var(--ink) !important;box-shadow:none !important;outline:none;transition:border-color .2s,background .2s,box-shadow .2s} .lx-page .lx-field input::placeholder{color:#9a9ca8 !important;font-family:"DM Sans",sans-serif !important;opacity:1} .lx-page .lx-field input:hover{background:#efeff3 !important} .lx-page .lx-field input:focus{outline:none;background:#fff !important;border-color:var(--blue) !important;box-shadow:0 0 0 4px rgba(112,135,255,.16) !important} .lx-page .lx-field input[aria-invalid="true"]{border-color:var(--bad) !important;background:#fff !important} .lx-hp{position:absolute !important;left:-9999px;width:1px;height:1px;opacity:0} .lx-form__note{display:flex;gap:10px;align-items:flex-start;margin:12px 18px 6px;font-size:14px;color:var(--muted);line-height:1.45} .lx-form__note svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--good)} .lx-form__err{margin:10px 18px 4px;font-size:14px;font-weight:600;color:var(--bad)} .lx-form__done{display:none;padding:18px 18px 16px;gap:14px;align-items:flex-start} .lx-form__done svg{flex:none;width:28px;height:28px;color:var(--good)} .lx-form__done h3,.lx-form__done-t{font:800 21px/1.25 "Urbanist",sans-serif;color:var(--ink);margin:0} .lx-form__done p{font-size:15px;color:var(--muted);margin-top:4px} .lx-form.is-done .lx-form__row,.lx-form.is-done .lx-form__note,.lx-form.is-done .lx-form__err{display:none} .lx-form.is-done .lx-form__done{display:flex} /* ---------- Hero ---------- */ .lx-hero{padding:148px 0 120px} .lx-hero__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:64px;align-items:center} .lx-hero h1{font-size:clamp(44px,5.4vw,78px);font-weight:900;line-height:.98;letter-spacing:-.035em;isolation:isolate;max-width:11ch} .lx-hero h1 .lx-under{position:relative;white-space:nowrap} .lx-hero h1 .lx-under::after{content:"";position:absolute;left:.02em;right:.02em;bottom:.02em;height:.12em;border-radius:99px;background:var(--grad);z-index:-1;opacity:.9} .lx-page .lx-hero__lede{font-size:20px;color:var(--ink-2);margin-top:36px;max-width:34ch} .lx-hero__alt{margin-top:18px;font-size:15px;color:var(--muted)} /* Surface switcher */ .lx-sw{position:relative} .lx-sw__frame{background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow-lg);overflow:hidden} .lx-sw__top{display:flex;align-items:center;gap:12px;padding:18px 20px 0} .lx-sw__query{flex:1;display:flex;align-items:center;gap:10px;height:48px;border:1px solid var(--line);border-radius:999px;padding:0 18px;font-size:16px;font-weight:500;color:var(--ink);background:#fff} .lx-sw__query svg{width:18px;height:18px;color:var(--faint);flex:none} .lx-sw__caret{display:inline-block;width:1.5px;height:1.1em;background:var(--ink);margin-left:1px;vertical-align:-3px;animation:lx-blink 1s steps(1) infinite} @keyframes lx-blink{50%{opacity:0}} .lx-sw__tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:16px 20px 0;padding:4px;background:var(--soft);border-radius:14px} .lx-sw__tab{appearance:none;border:0 !important;background:transparent !important;color:var(--muted) !important;border-radius:10px;padding:10px 8px 12px;cursor:pointer;color:var(--muted);font-weight:700;font-size:14.5px;position:relative;overflow:hidden;transition:color .2s,background .2s} .lx-sw__tab:hover,.lx-sw__tab:focus{color:var(--ink) !important;background:transparent !important} .lx-sw__tab[aria-selected="true"],.lx-sw__tab[aria-selected="true"]:hover,.lx-sw__tab[aria-selected="true"]:focus{background:#fff !important;color:var(--ink) !important;box-shadow:0 1px 2px rgba(21,22,32,.08),0 6px 14px -8px rgba(21,22,32,.25) !important} .lx-sw__bar{position:absolute;left:12px;right:12px;bottom:5px;height:2.5px;border-radius:9px;background:var(--line);overflow:hidden;opacity:0} .lx-sw__tab[aria-selected="true"] .lx-sw__bar{opacity:1} .lx-sw__bar i{display:block;height:100%;width:100%;background:var(--grad);transform-origin:left;transform:scaleX(0)} .lx-sw__panels{position:relative;min-height:392px;padding:18px 20px 20px} .lx-sw__panel{position:absolute;inset:18px 20px 20px;opacity:0;visibility:hidden;transform:translateY(10px);filter:blur(6px); transition:opacity .45s cubic-bezier(.2,.8,.2,1),transform .55s cubic-bezier(.2,.8,.2,1),filter .45s ease,visibility 0s linear .5s} .lx-sw__panel.is-on{opacity:1;visibility:visible;transform:none;filter:none;transition:opacity .45s cubic-bezier(.2,.8,.2,1) .05s,transform .55s cubic-bezier(.2,.8,.2,1) .05s,filter .45s ease .05s,visibility 0s} .lx-sw__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px 16px;border-top:1px solid var(--line-2);font-size:13px;color:var(--muted)} /* Google results */ .lx-res{display:flex;flex-direction:column;gap:6px} .lx-res li{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start;padding:9px 12px;border-radius:12px} .lx-res__n{font:700 13px/1.5 "Urbanist",sans-serif;color:var(--faint);text-align:right;padding-top:1px} .lx-res__u{font-size:12.5px;color:var(--muted)} .lx-res__t{font-size:15.5px;font-weight:600;color:#3246c4;line-height:1.3} .lx-res__gap{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--faint);padding:2px 12px 2px 52px} .lx-res__gap::before,.lx-res__gap::after{content:"";flex:1;height:1px;background:repeating-linear-gradient(90deg,var(--line) 0 5px,transparent 5px 9px)} .lx-res li.is-you{background:linear-gradient(var(--card),var(--card)) padding-box,var(--grad) border-box;border:1.5px solid transparent} .lx-res li.is-you .lx-res__n{color:var(--ink)} .lx-res li.is-you .lx-res__t{color:var(--ink)} .lx-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;margin-top:6px;white-space:nowrap} .lx-pill--bad{color:var(--bad);background:var(--bad-bg)} .lx-pill--good{color:var(--good);background:var(--good-bg)} .lx-pill--warn{color:var(--warn);background:var(--warn-bg)} /* AI answer */ .lx-ai{border:1px solid var(--line);border-radius:18px;padding:18px 18px 16px;background:linear-gradient(180deg,#fff, #fcfbff)} .lx-ai__who{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:var(--muted)} .lx-ai__dot{width:26px;height:26px;border-radius:9px;background:var(--grad);display:grid;place-items:center} .lx-ai__dot svg{width:15px;height:15px;color:#fff} .lx-ai__text{margin-top:12px;font-size:15px;color:var(--ink-2);line-height:1.55} .lx-ai__list{margin-top:10px;display:flex;flex-direction:column;gap:8px} .lx-ai__list li{display:flex;gap:10px;align-items:baseline;font-size:15px} .lx-ai__list b{font-weight:700;color:var(--ink)} .lx-ai__list span{color:var(--muted);font-size:14px} .lx-ai__miss{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:12px;background:var(--soft);font-size:14.5px;font-weight:600} /* Site health */ .lx-hl{display:flex;flex-direction:column} .lx-hl li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line-2);font-size:15px} .lx-hl li:last-child{border-bottom:0} .lx-hl__i{width:26px;height:26px;border-radius:8px;display:grid;place-items:center} .lx-hl__i svg{width:15px;height:15px} .lx-hl__i--bad{background:var(--bad-bg);color:var(--bad)} .lx-hl__i--warn{background:var(--warn-bg);color:var(--warn)} .lx-hl__i--good{background:var(--good-bg);color:var(--good)} .lx-hl small{display:block;color:var(--muted);font-size:13px} .lx-hl__v{font:700 14px "Urbanist",sans-serif;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} /* ---------- Three places ---------- */ .lx-places{margin-top:80px;border-top:1px solid var(--line)} .lx-place{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:72px;padding:72px 0;border-bottom:1px solid var(--line);align-items:center} .lx-place h3{font-size:clamp(30px,3.2vw,42px);font-weight:800;line-height:1.05} .lx-place h3 small{display:block;font:600 15px/1.4 "DM Sans",sans-serif;color:var(--muted);letter-spacing:0;margin-top:10px} .lx-page .lx-place p{color:var(--ink-2);font-size:18px;margin-top:22px;max-width:52ch} .lx-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px} .lx-chips li{font-size:13.5px;font-weight:600;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px} .lx-mini{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg);padding:18px} .lx-mini > .lx-demo{position:absolute;top:-11px;right:18px} .lx-mini__q{display:flex;align-items:center;gap:10px;height:42px;border:1px solid var(--line);border-radius:999px;padding:0 16px;font-size:15px;font-weight:500;margin-bottom:12px} .lx-mini__q svg{width:16px;height:16px;color:var(--faint);flex:none} .lx-mini .lx-res li{padding:10px 12px} .lx-mini .lx-res li:not(.is-you){opacity:.55} .lx-score{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:4px 4px 12px;border-bottom:1px solid var(--line-2);margin-bottom:4px} .lx-score span{font-size:13px;font-weight:700;color:var(--muted)} .lx-score b{font:900 34px/1 "Urbanist",sans-serif;font-variant-numeric:tabular-nums} .lx-score b small{font:700 14px "DM Sans",sans-serif;color:var(--good);margin-left:8px} /* ---------- Who it is for (photo band) ---------- */ .lx-who__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:56px} .lx-who__item{margin:0} .lx-who__item img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:24px;box-shadow:var(--shadow)} .lx-page .lx-who__item figcaption{margin-top:18px;font-style:normal;text-align:left} .lx-who__item b{display:block;font:800 22px/1.2 "Urbanist",sans-serif;letter-spacing:-.02em;color:var(--ink)} .lx-who__item span{display:block;margin-top:6px;font-size:16px;color:var(--muted);line-height:1.5} /* ---------- Photo breaks ---------- */ .lx-band{margin:-40px 0} .lx-band__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px} .lx-band--flip .lx-band__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)} .lx-band figure{margin:0} .lx-band img{display:block;width:100%;height:clamp(200px,30vw,400px);object-fit:cover;border-radius:24px;box-shadow:var(--shadow)} /* ---------- We make the changes ---------- */ .lx-dark{border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .lx-vs{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;margin-top:64px;align-items:start} .lx-usual{border:1.5px dashed #cfcfd8;background:#f3f3f6;border-radius:var(--r);padding:32px} .lx-usual h3,.lx-ours h3{font-size:22px;font-weight:800} .lx-usual ol{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:column;gap:0} .lx-usual li{position:relative;padding:0 0 22px 30px;color:var(--muted);font-size:16px} .lx-usual li::before{content:"";position:absolute;left:5px;top:8px;width:9px;height:9px;border-radius:50%;border:2px solid #9a9ca8} .lx-usual li::after{content:"";position:absolute;left:9px;top:21px;bottom:2px;width:1.5px;background:#d6d6de} .lx-usual li:last-child::after{display:none} .lx-usual li b{color:var(--ink-2);font-weight:700;display:block} .lx-ours{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r);padding:32px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden} .lx-ours::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)} .lx-ours h3{color:var(--ink)} .lx-ours__list{margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px} .lx-ours__list li{display:flex;gap:10px;font-size:15.5px;line-height:1.45;color:var(--ink-2)} .lx-ours__list li svg{flex:none;width:18px;height:18px;margin-top:3px;color:var(--good)} .lx-ours__list b{color:var(--ink)} .lx-log{margin-top:28px;border:1px solid var(--line);border-radius:16px;overflow:hidden} .lx-log__h{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--soft);font-size:13px;font-weight:700;color:var(--muted)} .lx-log li{display:grid;grid-template-columns:74px 1fr auto;gap:14px;padding:12px 16px;border-top:1px solid var(--line-2);font-size:14.5px;align-items:baseline} .lx-log time{font:700 12.5px "Urbanist",sans-serif;color:var(--faint);font-variant-numeric:tabular-nums} .lx-log em{font-style:normal;font-size:12px;font-weight:700;color:var(--muted);background:var(--soft);border-radius:6px;padding:2px 8px;white-space:nowrap} .lx-platforms{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px} .lx-platforms span{font-size:13px;font-weight:700;color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:5px 12px} /* ---------- Portal tour ---------- */ .lx-tour{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:56px;margin-top:64px;align-items:start} .lx-steps{display:flex;flex-direction:column;gap:8px;position:sticky;top:120px} .lx-step{appearance:none;text-align:left;border:1px solid transparent !important;background:transparent !important;border-radius:18px !important;padding:20px 22px;cursor:pointer;color:var(--ink) !important;white-space:normal;width:100%;transition:background .25s,border-color .25s} .lx-step:hover,.lx-step:focus{background:rgba(255,255,255,.7) !important;color:var(--ink) !important} .lx-step__t{font:800 22px/1.2 "Urbanist",sans-serif;letter-spacing:-.02em;display:flex;align-items:center;gap:12px} .lx-step__t i{width:10px;height:10px;border-radius:50%;background:var(--line);flex:none;transition:background .25s,transform .25s} .lx-step__d{margin-top:8px;color:var(--muted);font-size:16px;display:none;opacity:0;transition:opacity .35s ease} .lx-step[aria-selected="true"],.lx-step[aria-selected="true"]:hover,.lx-step[aria-selected="true"]:focus{background:#fff !important;border-color:var(--line) !important;box-shadow:var(--shadow) !important} .lx-step[aria-selected="true"] .lx-step__t i{background:var(--grad);transform:scale(1.2)} .lx-step[aria-selected="true"] .lx-step__d{display:block;opacity:1;animation:lx-fade .4s ease} @keyframes lx-fade{from{opacity:0}to{opacity:1}} .lx-app{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg);overflow:hidden} .lx-app__bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line-2);background:#fcfcfd} .lx-app__bar i{width:10px;height:10px;border-radius:50%;background:#e3e3e8} .lx-app__url{margin-left:10px;flex:1;max-width:340px;height:28px;border-radius:8px;background:var(--soft);font-size:12.5px;color:var(--muted);display:flex;align-items:center;padding:0 12px;white-space:nowrap;overflow:hidden} .lx-app__body{padding:22px;min-height:470px;position:relative} .lx-app__head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px} .lx-app__head h4{font-size:19px;font-weight:800} .lx-screen{display:none;animation:lx-in .5s cubic-bezier(.2,.8,.2,1)} .lx-screen.is-on{display:block} @keyframes lx-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .lx-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} .lx-kpi{border:1px solid var(--line);border-radius:14px;padding:14px} .lx-kpi small{display:block;font-size:12px;font-weight:600;color:var(--muted)} .lx-kpi b{display:block;font:800 26px/1.2 "Urbanist",sans-serif;margin-top:6px;font-variant-numeric:tabular-nums} .lx-kpi em{font-style:normal;font-size:12px;font-weight:700;color:var(--good)} .lx-chart{margin-top:14px;border:1px solid var(--line);border-radius:14px;padding:14px 14px 8px} .lx-chart__h{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:space-between;font-size:13px;font-weight:700;color:var(--ink-2)} .lx-chart__h > span{display:flex;gap:14px;font-weight:600;color:var(--muted)} .lx-chart__h > span > span{display:inline-flex;align-items:center;gap:6px} .lx-chart__h i{display:inline-block;width:12px;height:3px;border-radius:2px} .lx-chart svg{display:block;width:100%;height:190px;margin-top:6px} .lx-tbl{width:100%;border-collapse:collapse;border:0 !important;margin:0;font-size:14px;font-variant-numeric:tabular-nums} .lx-page .lx-tbl tr,.lx-page .lx-tbl th,.lx-page .lx-tbl td{background:transparent !important;border-left:0 !important;border-right:0 !important;border-top:0 !important} .lx-tbl th{font-size:12px;font-weight:700;color:var(--muted);text-align:center;padding:9px 8px;border-bottom:1px solid var(--line)} .lx-tbl th:first-child,.lx-tbl td:first-child{text-align:left} .lx-tbl td{text-align:center;padding:11px 8px;border-bottom:1px solid var(--line-2)} .lx-tbl td:first-child{font-weight:600} .lx-tbl .up{color:var(--good);font-weight:700} .lx-tbl .dn{color:var(--bad);font-weight:700} .lx-tbl .p3{color:var(--good);font-weight:800} .lx-tbl .p10{color:#3246c4;font-weight:800} .lx-tbl svg{width:64px;height:20px;display:block;margin:0 auto} .lx-audit{display:flex;flex-direction:column;gap:10px} .lx-audit li{display:grid;grid-template-columns:96px 1fr 70px;gap:14px;align-items:center;font-size:14px} .lx-audit time{font-weight:700;color:var(--muted);font-size:13px} .lx-audit__bar{height:10px;border-radius:9px;background:var(--soft);overflow:hidden} .lx-audit__bar i{display:block;height:100%;border-radius:9px;background:var(--grad)} .lx-audit b{font:800 15px "Urbanist",sans-serif;text-align:right} .lx-audit-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px} .lx-cnt{display:flex;flex-direction:column;gap:10px} .lx-cnt li{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-size:14.5px} .lx-cnt small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px} .lx-hours{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:14px;border-radius:14px;background:var(--soft);font-size:14.5px;font-weight:600} .lx-hours b{font:800 22px "Urbanist",sans-serif} .lx-demo{font-size:12px;font-weight:700;color:var(--warn);background:var(--warn-bg);border-radius:999px;padding:3px 10px;white-space:nowrap} /* ---------- AI section ---------- */ .lx-aisec{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:center} .lx-qs{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:10px} .lx-qs__h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px 14px;font-size:13.5px;font-weight:700;color:var(--muted)} .lx-qs li{display:grid;grid-template-columns:1fr auto;gap:8px 16px;padding:14px;border-top:1px solid var(--line-2);align-items:center} .lx-qs q{font-size:15.5px;font-weight:600;color:var(--ink);quotes:"\201C" "\201D"} .lx-qs small{grid-column:1/-1;font-size:13px;color:var(--muted);margin-top:-4px} .lx-meter{display:flex;align-items:center;gap:14px;padding:14px;border-top:1px solid var(--line-2)} .lx-meter__track{flex:1;height:10px;border-radius:9px;background:var(--soft);overflow:hidden} .lx-meter__track i{display:block;height:100%;width:25%;border-radius:9px;background:var(--grad)} .lx-meter b{font:800 15px "Urbanist",sans-serif;white-space:nowrap} .lx-points{margin-top:32px;display:flex;flex-direction:column;gap:18px} .lx-points li{display:grid;grid-template-columns:38px 1fr;gap:14px} .lx-points li span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff;border:1px solid var(--line)} .lx-points li span svg{width:18px;height:18px;color:var(--blue)} .lx-points b{display:block;font-size:17px} .lx-points p{color:var(--muted);font-size:16px;margin-top:2px} /* ---------- 90 days ---------- */ .lx-plan{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative} .lx-plan::before{content:"";position:absolute;left:0;right:0;top:15px;height:3px;border-radius:3px;background:var(--grad);opacity:.9} .lx-phase{padding:0 32px 0 0;position:relative} .lx-phase__dot{display:inline-flex;align-items:center;height:33px;padding:0 14px;border-radius:999px;background:#fff;border:2.5px solid var(--ink);font:800 14px "Urbanist",sans-serif;position:relative;z-index:1;white-space:nowrap} .lx-phase h3{font-size:30px;font-weight:800;margin-top:22px} .lx-phase ul{margin-top:18px;display:flex;flex-direction:column;gap:12px} .lx-phase li{position:relative;padding-left:20px;color:var(--ink-2);font-size:16px} .lx-phase li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:2px;border-radius:2px;background:var(--ink)} .lx-after{margin-top:56px;display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 28px;box-shadow:var(--shadow)} .lx-after svg{width:28px;height:28px;color:var(--blue)} .lx-after p{color:var(--ink-2)} .lx-after b{color:var(--ink)} /* ---------- Fit ---------- */ .lx-fit{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px} .lx-fit > div{border-radius:var(--r);padding:36px} .lx-fit__yes{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)} .lx-fit__no{border:1.5px dashed #cfcfd8} .lx-fit h3{font-size:26px;font-weight:800} .lx-fit ul{margin-top:20px;display:flex;flex-direction:column;gap:14px} .lx-fit li{display:flex;gap:12px;font-size:16.5px;color:var(--ink-2);line-height:1.5} .lx-fit li svg{flex:none;width:20px;height:20px;margin-top:3px} .lx-fit__yes li svg{color:var(--good)} .lx-fit__no li svg{color:var(--faint)} /* ---------- FAQ ---------- */ .lx-faqwrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:start} .lx-faq details{border-bottom:1px solid var(--line)} .lx-faq details:first-child{border-top:1px solid var(--line)} .lx-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 4px;font:800 20px/1.3 "Urbanist",sans-serif;color:var(--ink)} .lx-faq summary::-webkit-details-marker{display:none} .lx-faq summary i{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:transform .45s cubic-bezier(.22,.8,.24,1),background .3s,color .3s,border-color .3s} .lx-faq summary i svg{width:14px;height:14px} .lx-faq details[open] summary i{transform:rotate(45deg);background:var(--ink);color:#fff;border-color:var(--ink)} .lx-faq details.is-closing summary i{transform:none;background:transparent;color:inherit;border-color:var(--line)} .lx-faq summary:hover i{border-color:#cfcfd8} .lx-faq details p{padding:0 56px 26px 4px;color:var(--ink-2);font-size:17px;max-width:68ch} /* ---------- Close ---------- */ .lx-close{padding:0 0 128px} .lx-close__card{position:relative;overflow:hidden;border-radius:36px;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-lg);padding:88px 72px;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:56px;align-items:center} .lx-close__card::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad)} .lx-page .lx-close h2{color:var(--ink);font-size:clamp(38px,4.8vw,64px);font-weight:900;line-height:1} .lx-page .lx-close__lede{color:var(--muted);font-size:19px;margin-top:24px} .lx-close .lx-form__note{color:var(--muted)} .lx-close .lx-form{margin-top:0;max-width:none;box-shadow:none;background:var(--soft);border-color:var(--line-2)} .lx-page .lx-close .lx-field input{background:#fff !important} .lx-close .lx-form__row{grid-template-columns:1fr} .lx-close__alt{margin-top:18px;font-size:15.5px;color:var(--muted)} /* ---------- Motion ---------- */ .lx-reveal{opacity:1;transform:none} .lx-js .lx-reveal{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)} .lx-js .lx-reveal.is-in{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){ .lx-js .lx-reveal{opacity:1;transform:none;transition:none} .lx-sw__panel,.lx-sw__panel.is-on{transition:none;filter:none;transform:none} .lx-sw__caret{animation:none} .lx-screen{animation:none} } /* ---------- Responsive ---------- */ @media (max-width:1100px){ .lx-hero__grid{grid-template-columns:1fr;gap:56px} .lx-hero__lede{max-width:48ch} .lx-place{grid-template-columns:1fr;gap:40px;padding:56px 0} .lx-mini{max-width:560px} .lx-who__grid{gap:20px} .lx-vs,.lx-tour,.lx-aisec,.lx-faqwrap{grid-template-columns:1fr} .lx-steps{position:static;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px} .lx-step{flex:0 0 min(78%,320px);scroll-snap-align:start;border-color:var(--line);background:rgba(255,255,255,.6)} .lx-step__d{display:block !important;opacity:1} .lx-close__card{grid-template-columns:1fr;padding:64px 48px} } @media (max-width:760px){ .lx-page{font-size:16px} .lx-wrap{padding:0 20px} .lx-sec{padding:72px 0} .lx-hero{padding:108px 0 80px} .lx-hero h1{max-width:none} .lx-hero__lede{font-size:18px} .lx-form__row{grid-template-columns:1fr} .lx-btn{width:100%} .lx-sw__panels{min-height:420px;padding:16px} .lx-sw__panel{inset:16px} .lx-sw__top{padding:14px 14px 0} .lx-sw__tabs{margin:12px 14px 0} .lx-sw__tab{font-size:13px;padding:9px 4px 11px} .lx-sw__foot{flex-direction:column;align-items:flex-start;padding:12px 16px 14px} .lx-res li{padding:8px 10px;grid-template-columns:24px 1fr} .lx-res__t{font-size:14.5px} .lx-res__gap{padding-left:44px} .lx-place{padding:48px 0;gap:32px} .lx-who__grid{grid-template-columns:1fr;gap:36px;margin-top:40px} .lx-band{margin:-24px 0} .lx-band__grid,.lx-band--flip .lx-band__grid{grid-template-columns:1.25fr 1fr;gap:10px} .lx-band img{height:180px;border-radius:18px} .lx-who__item img{aspect-ratio:16/10} .lx-usual,.lx-ours{padding:24px} .lx-ours__list{grid-template-columns:1fr} .lx-log li{grid-template-columns:62px 1fr} .lx-log li em{grid-column:2;justify-self:start} .lx-app__body{padding:16px;min-height:0} .lx-kpis{grid-template-columns:1fr 1fr} .lx-tbl th:nth-child(3),.lx-tbl td:nth-child(3),.lx-tbl th:nth-child(5),.lx-tbl td:nth-child(5){display:none} .lx-audit li{grid-template-columns:78px 1fr 44px} .lx-plan{grid-template-columns:1fr;gap:40px;padding-left:22px} .lx-plan::before{left:0;right:auto;top:0;bottom:0;width:3px;height:auto} .lx-phase{padding:0} .lx-phase h3{margin-top:14px} .lx-fit{grid-template-columns:1fr} .lx-fit > div{padding:28px 24px} .lx-faq summary{font-size:18px;padding:20px 2px} .lx-faq details p{padding-right:8px} .lx-close{padding-bottom:72px} .lx-close__card{padding:48px 24px;border-radius:28px} .lx-after{grid-template-columns:1fr;padding:22px} } /* FAQ heading stays in view while the answers scroll (desktop only). */ @media (min-width:1101px){.lx-faqwrap > div:first-child{position:sticky;top:120px}} /* Related reading: keeps blog posts and sibling services linked from service pages. */ .lx-related{border-top:1px solid var(--line);padding-top:40px;margin-top:8px} .lx-related h2{font-size:24px;font-weight:800} .lx-related ul{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px} .lx-related li a{display:flex;align-items:baseline;gap:10px;font-size:16.5px;font-weight:600;color:var(--ink);text-decoration:none;padding:6px 0} .lx-related li a::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--grad);transform:translateY(-2px)} .lx-related li a span{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;text-decoration-color:var(--line)} .lx-related li a:hover span{text-decoration-color:var(--pink)} .lx-related li small{display:block;font-size:13px;color:var(--muted);font-weight:500;margin-top:2px} @media (max-width:760px){.lx-related ul{grid-template-columns:1fr}} /* SEO page H1 carries the keyword, so it runs longer: wider measure, slightly smaller. */ .lx-page .lx-hero h1.lx-h1--seo{max-width:14ch;font-size:clamp(42px,4.9vw,70px)} /* The theme italicizes figcaption; our captions are set upright. */ .lx-page figcaption,.lx-page figcaption *{font-style:normal}