/* LOMY, Apple-inspired layer (08/10). Loaded after azur.css and editorial.css on every page.
   System typography (SF on Apple devices), black or white grounds, rounded cards, a translucent header,
   motion that reveals content on scroll. Dark is the default theme (prefs.js), light is fully designed too. */
:root{--x-bg:#fff;--x-bg2:#F3F6FF;--x-card:#fff;--x-tile:#EEF3FF;--x-text:#0A1430;--x-text2:#56607A;--x-line:#E3E7F0;--x-acc:#1462FF;--x-acc-h:#0B47C9;--x-btn:#1462FF;--x-btn-h:#0B47C9;--x-glass:rgba(255,255,255,.78);--x-ease:cubic-bezier(.22,.61,.36,1);--x-out:cubic-bezier(.16,1,.3,1);
  --x-font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
/* dark = the LOMY night palette: near-black navy, ink blue surfaces, azure accent */
html[data-theme=dark]{--x-bg:#04060F;--x-bg2:#070B1A;--x-card:#0E1631;--x-tile:#0B1229;--x-text:#F4F7FF;--x-text2:#A7B2CF;--x-line:rgba(126,155,255,.16);--x-acc:#7FA7FF;--x-acc-h:#A9C3FF;--x-btn:#1462FF;--x-btn-h:#2B74FF;--x-glass:rgba(4,6,15,.76)}
html[data-theme] body{font-family:var(--x-font);background:var(--x-bg);color:var(--x-text2);letter-spacing:-.012em;-webkit-font-smoothing:antialiased}
html[data-theme] :is(h1,h2,h3,h4){font-family:var(--x-font);font-stretch:100%}
html[data-theme] a{color:var(--x-acc)}html[data-theme] a:hover{color:var(--x-acc-h)}
:focus-visible{outline:2px solid var(--x-acc);outline-offset:3px}

/* header: one translucent bar */
html[data-theme] .nav,html[data-theme] .nav.is-s{background:var(--x-glass);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--x-line)}
.nav__in{height:56px}
html[data-theme] .logo,html[data-theme] .logo:hover{color:var(--x-text);font-family:var(--x-font);font-stretch:100%;font-weight:700;font-size:19px;letter-spacing:.04em}
html[data-theme] .logo span{background:var(--x-acc);width:6px;height:6px;margin-bottom:5px}
html[data-theme] .nav ul{background:none;padding:0;gap:2px}
html[data-theme] .nav nav ul li a,html[data-theme] .nav nav ul li a:hover{color:var(--x-text)}
html[data-theme] .nav ul a{color:var(--x-text);opacity:.8;font-size:13px;font-weight:500;padding:8px 12px;background:none}
html[data-theme] .nav ul a:hover{opacity:1;background:none;color:var(--x-text)}
html[data-theme] .nav .btn{height:32px;padding:0 14px;font-size:13px;font-weight:600;background:var(--x-btn);color:#fff;border-radius:999px}
html[data-theme] .nav .btn::before{display:none}html[data-theme] .nav .btn__a{display:none}
html[data-theme] .nav .btn:hover{background:var(--x-btn-h);color:#fff}
html[data-theme] .nav .theme,html[data-theme] .nav .burger{background:none;color:var(--x-text);width:36px;height:36px}
html[data-theme] .nav .burger i{background:var(--x-text)}
html[data-theme] .nav .langs a{color:var(--x-text2);font-size:12px}html[data-theme] .nav .langs a[aria-current]{color:var(--x-text);background:var(--x-line)}
html[data-theme] .menu{background:var(--x-bg)}html[data-theme] .menu ul a{color:var(--x-text);font-family:var(--x-font);font-stretch:100%}

/* footer: quiet and small */
html[data-theme] .foot{background:var(--x-bg2);color:var(--x-text2);font-size:13px;border-top:1px solid var(--x-line)}
html[data-theme] .foot h2{font-stretch:100%;letter-spacing:0;text-transform:none;font-size:13px;color:var(--x-text);font-weight:600}
html[data-theme] .foot a{color:var(--x-text2)}html[data-theme] .foot a:hover{color:var(--x-text)}
html[data-theme] .foot__b{border-top:1px solid var(--x-line)}
html[data-theme] .foot .curs button,html[data-theme] .foot .langs a{color:var(--x-text2)}
html[data-theme] .foot .curs button[aria-pressed=true],html[data-theme] .foot .langs a[aria-current]{color:var(--x-text);background:var(--x-line)}

/* building blocks */
.x-wrap{max-width:1140px;margin:0 auto;padding:0 22px}
html[data-theme] :is(.x-hero,.x-sec,.x-cta) :is(h1,h2,h3){color:var(--x-text)}
.x-btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 26px;border-radius:999px;background:var(--x-btn);font-weight:600;font-size:17px;letter-spacing:-.01em;transition:background .25s,transform .25s var(--x-out),box-shadow .25s;white-space:nowrap}
html[data-theme] .x-btn,html[data-theme] .x-btn:hover{color:#fff}
.x-btn:hover{background:var(--x-btn-h)}.x-btn:active{transform:scale(.97)}
.x-btn--ghost{background:transparent;box-shadow:inset 0 0 0 1.5px var(--x-acc)}
html[data-theme] .x-btn--ghost{color:var(--x-acc)}html[data-theme] .x-btn--ghost:hover{background:var(--x-btn);color:#fff}
.x-btn--lg{height:56px;padding:0 34px;font-size:19px}
.x-link{font-size:17px;font-weight:500;display:inline-flex;align-items:center;gap:6px}
.x-link::after{content:"";width:7px;height:7px;border-top:1.6px solid currentColor;border-right:1.6px solid currentColor;transform:rotate(45deg);transition:transform .25s var(--x-out)}
.x-link:hover::after{transform:translateX(3px) rotate(45deg)}
.x-ctas{display:flex;gap:26px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:30px}

/* reveal on scroll (motion.js adds .in); without JS everything is simply visible */
html.js [data-r]{opacity:0;transform:translateY(30px);transition:opacity .9s var(--x-ease),transform 1.1s var(--x-out);transition-delay:var(--d,0s)}
html.js [data-r].in{opacity:1;transform:none}
html.js .x-h1 .w{display:inline-block;opacity:0;transform:translateY(.32em);filter:blur(8px);animation:wIn 1s var(--x-out) forwards;animation-delay:calc(.08s + var(--i)*.07s)}
@keyframes wIn{to{opacity:1;transform:none;filter:none}}

/* hero: copy and app tabs on the left, the phone on the right, everything in the first screen */
.x-hero{--pw:clamp(250px,calc((100svh - 170px) * .4663),340px);padding:calc(56px + clamp(22px,4.5vh,56px)) 0 clamp(34px,6vh,72px);background:var(--x-bg);overflow:hidden}
.x-hero__in{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:1fr auto auto auto 1fr;grid-template-areas:". phone" "copy phone" "tabs phone" "cap phone" ". phone";column-gap:clamp(40px,7vw,120px)}
.x-hero__copy{grid-area:copy}
.x-h1{font-size:clamp(44px,5.5vw,84px);font-weight:700;line-height:1.02;letter-spacing:-.045em;margin:0;text-wrap:balance}
.x-lead{max-width:540px;margin:22px 0 0;font-size:clamp(18px,1.45vw,22px);line-height:1.4;font-weight:500;color:var(--x-text2)}
.x-hero .x-ctas{justify-content:flex-start;margin-top:28px}
.x-demo{display:contents;--glow:#9BE15D}
.x-tabs{grid-area:tabs;justify-self:start;margin-top:clamp(30px,5.5vh,56px);display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:var(--x-tile);max-width:100%;overflow-x:auto;scrollbar-width:none}
.x-tabs::-webkit-scrollbar{display:none}
.x-tab{position:relative;flex:none;height:38px;padding:0 17px;border-radius:999px;font-size:14px;font-weight:600;color:var(--x-text2);transition:color .3s,background .35s var(--x-out),box-shadow .35s}
.x-tab:hover{color:var(--x-text)}
.x-tab.is-on{background:var(--x-card);color:var(--x-text);box-shadow:0 1px 2px rgba(0,0,0,.08),0 6px 16px -8px rgba(0,0,0,.25)}
html[data-theme=dark] .x-tab.is-on{background:#18244F}
.x-tab i{position:absolute;left:17px;right:17px;bottom:5px;height:2px;border-radius:2px;background:var(--x-line);overflow:hidden;opacity:0;transition:opacity .3s}
.x-tab.is-on i{opacity:1}
.x-tab i::after{content:"";position:absolute;inset:0;background:var(--x-acc);transform:scaleX(0);transform-origin:left}
.x-tab.is-run i::after{animation:tabProg var(--dur,3s) linear forwards}
@keyframes tabProg{to{transform:scaleX(1)}}
.x-stage{grid-area:phone;position:relative;display:flex;justify-content:center;align-items:center}
.x-glow{position:absolute;top:50%;left:50%;width:calc(var(--pw) * 2.4);aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,var(--glow),transparent 70%);opacity:.3;filter:blur(40px);transition:background 1.2s var(--x-ease);pointer-events:none}
html[data-theme=light] .x-glow{opacity:.22}
.x-stage .iph{width:var(--pw);animation:none;box-shadow:0 50px 100px -50px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.04)}
.x-cap{grid-area:cap;position:relative;max-width:540px;min-height:50px;margin:16px 0 0;font-size:16px;line-height:1.45;color:var(--x-text2)}
.x-cap span{position:absolute;left:0;right:0;top:0;opacity:0;transform:translateY(8px);transition:opacity .5s var(--x-ease),transform .7s var(--x-out)}
.x-cap span.is-on{opacity:1;transform:none}
.x-cap b{color:var(--x-text);font-weight:600}

/* sections */
.x-sec{padding:clamp(96px,13vw,160px) 0;background:var(--x-bg)}
.x-sec--alt{background:var(--x-bg2)}
.x-head{text-align:center;max-width:1000px;margin:0 auto clamp(48px,6vw,76px)}
.x-head h2{font-size:clamp(38px,5.6vw,68px);font-weight:700;line-height:1.05;letter-spacing:-.04em;margin:0;text-wrap:balance}
.x-head h2 span{color:var(--x-text2)}
.x-head p{margin:22px auto 0;max-width:640px;font-size:clamp(17px,1.5vw,21px);line-height:1.45;color:var(--x-text2)}
.x-head--left{text-align:left;margin-left:0}.x-head--left p{margin-left:0}
.x-eye{font-size:clamp(17px,1.4vw,21px);font-weight:600;color:var(--x-acc);margin:0 0 10px}

/* steps */
.x-steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.x-steps__line{position:absolute;top:23px;left:24px;right:24px;height:2px;background:var(--x-line);border-radius:2px;overflow:hidden}
.x-steps__line i{position:absolute;inset:0;background:var(--x-acc);transform-origin:left;transform:scaleX(var(--p,0));transition:transform .2s linear}
.x-st{position:relative}
.x-st__n{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--x-bg2);box-shadow:inset 0 0 0 2px var(--x-acc);color:var(--x-acc);font-weight:700;font-size:18px;margin-bottom:28px}
.x-st__t{margin:0 0 6px;font-size:15px;font-weight:600;color:var(--x-acc)}
.x-st h3{font-size:clamp(24px,2.3vw,30px);font-weight:700;letter-spacing:-.03em;margin:0 0 10px}
.x-st p{margin:0;font-size:17px;line-height:1.5;color:var(--x-text2)}

/* our own apps: App Store screenshots rising out of each card */
.x-store__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.x-sa{display:flex;flex-direction:column;border-radius:30px;overflow:hidden;background:var(--x-card);box-shadow:inset 0 0 0 1px var(--x-line)}
.x-sa__t{padding:34px 34px 30px}
.x-sa__h{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.x-sa__h img{width:64px;height:64px;border-radius:15px;flex:none;box-shadow:0 0 0 1px var(--x-line)}
.x-sa h3{font-size:30px;font-weight:700;letter-spacing:-.03em;margin:0 0 5px;line-height:1.05}
.x-badge{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--x-text2)}
.x-badge::before{content:"";width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor}
.x-badge--live{color:var(--x-text)}.x-badge--live::before{background:#30D158;box-shadow:0 0 0 3px rgba(48,209,88,.22)}
.x-sa p{margin:0;font-size:17px;line-height:1.5;color:var(--x-text2);max-width:540px}
.x-sa__l{display:flex;gap:26px;margin-top:18px}
.x-sa__m{margin-top:auto;display:flex;gap:14px;justify-content:center;align-items:flex-start;height:380px;padding:36px 30px 0;overflow:hidden;background:var(--x-tile)}
.x-sa__m img,.x-sa__m video{display:block;width:30%;height:auto;border-radius:20px 20px 0 0;box-shadow:0 -10px 40px -16px rgba(0,0,0,.5),0 0 0 1px var(--x-line);transform:translateY(46px);transition:transform 1s var(--x-out)}
.x-sa.in .x-sa__m>*{transform:none}
.x-sa.in .x-sa__m>:nth-child(2){transition-delay:.08s}.x-sa.in .x-sa__m>:nth-child(3){transition-delay:.16s}
.x-sa:hover .x-sa__m>:nth-child(1),.x-sa:hover .x-sa__m>:nth-child(3){transform:translateY(-10px);transition-delay:0s}
.x-sa:hover .x-sa__m>:nth-child(2){transform:translateY(-22px);transition-delay:0s}

/* pricing */
.x-price{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.x-pc{background:var(--x-card);border-radius:30px;padding:34px;display:flex;flex-direction:column}
.x-pc--hi{box-shadow:inset 0 0 0 2px var(--x-acc)}
.x-pc h3{font-size:21px;font-weight:600;margin:0}
.x-pc__n{margin:18px 0 0;font-size:clamp(40px,4vw,52px);font-weight:700;letter-spacing:-.04em;color:var(--x-text);line-height:1}
.x-pc__n small{font-size:17px;font-weight:500;color:var(--x-text2);letter-spacing:0;margin-left:4px}
.x-pc__s{margin:10px 0 0;font-size:15px;color:var(--x-text2)}
.x-pc ul{list-style:none;margin:26px 0 30px;padding:22px 0 0;border-top:1px solid var(--x-line);display:flex;flex-direction:column;gap:12px}
.x-pc li{position:relative;padding-left:26px;font-size:16px;color:var(--x-text)}
.x-pc li::before{content:"";position:absolute;left:2px;top:6px;width:11px;height:6px;border-left:2px solid var(--x-acc);border-bottom:2px solid var(--x-acc);transform:rotate(-45deg)}
.x-pc .x-btn{margin-top:auto;align-self:flex-start}
.x-fine{text-align:center;margin:26px 0 0;font-size:15px;color:var(--x-text2)}
html[data-theme] .x-fine .curs button{color:var(--x-text2)}html[data-theme] .x-fine .curs button[aria-pressed=true]{color:var(--x-text);background:var(--x-line)}

/* faq */
.x-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(30px,6vw,90px);align-items:start}
.x-faq .x-head{margin-bottom:0;position:sticky;top:110px}
html[data-theme] .x-faq .q{border-color:var(--x-line)}
html[data-theme] .x-faq .q button{font-family:var(--x-font);font-stretch:100%;font-size:19px;font-weight:600;color:var(--x-text);letter-spacing:-.015em}
html[data-theme] .x-faq .q__a p{font-size:17px;color:var(--x-text2)}
html[data-theme] .x-faq .pm{background:var(--x-tile)}html[data-theme] .x-faq .q.open .pm{background:var(--x-acc)}

/* closing call to action */
.x-cta{padding:clamp(110px,15vw,190px) 0;text-align:center;background:var(--x-bg)}
.x-cta h2{font-size:clamp(48px,8vw,108px);font-weight:700;letter-spacing:-.05em;line-height:1;margin:0}
.x-cta p{max-width:560px;margin:22px auto 0;font-size:clamp(17px,1.5vw,21px);line-height:1.45;color:var(--x-text2)}

@media (max-width:1000px){
  .x-faq{grid-template-columns:1fr}.x-faq .x-head{position:static}
}
@media (max-width:900px){
  .x-hero{--pw:min(300px,72vw,calc((100svh - 150px) * .4663));padding-top:calc(56px + 34px)}
  .x-hero__in{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"copy" "tabs" "phone" "cap";text-align:center}
  .x-lead{margin-left:auto;margin-right:auto}
  .x-hero .x-ctas{justify-content:center}
  .x-tabs{justify-self:center;margin-top:30px}
  .x-stage{margin-top:30px}
  .x-cap{justify-self:stretch;margin:22px 0 0;min-height:70px}
}
@media (max-width:760px){
  .x-store__g,.x-price,.x-steps{grid-template-columns:minmax(0,1fr)}
  .x-steps__line{display:none}.x-st__n{margin-bottom:16px}
  .x-sa__t{padding:28px 24px 24px}.x-sa__m{height:300px;padding:28px 20px 0}
  .x-tab{padding:0 13px;font-size:13px}.x-tab i{left:13px;right:13px}
  .x-tabs{justify-self:stretch;-webkit-mask:linear-gradient(90deg,#000 88%,transparent);mask:linear-gradient(90deg,#000 88%,transparent)}
}
@media (prefers-reduced-motion:reduce){
  html.js [data-r]{opacity:1;transform:none;transition:none}
  html.js .x-h1 .w{opacity:1;transform:none;filter:none;animation:none}
  .x-tab.is-run i::after{animation:none;transform:scaleX(1)}
  .x-sa__m img,.x-sa__m video{transform:none;transition:none}
}

/* specificity fixes against the older dark rules in azur.css (a:not(.btn):not(.ulink):not(.logo)) */
html[data-theme=dark] a:not(.btn):not(.ulink):not(.logo){color:var(--x-acc)}
html[data-theme] a.x-btn:not(.z):not(.z):not(.z){color:#fff}
html[data-theme] a.x-btn--ghost:not(.z):not(.z):not(.z){color:var(--x-acc)}
html[data-theme] a.x-btn--ghost:not(.z):not(.z):not(.z):hover{color:#fff}
html[data-theme] .nav nav ul li a:not(.z):not(.z){color:var(--x-text)}
html[data-theme] .menu ul li a:not(.z):not(.z){color:var(--x-text)}
html[data-theme] .foot a:not(.z):not(.z):not(.btn){color:var(--x-text2)}
html[data-theme] .foot a:not(.z):not(.z):not(.btn):hover{color:var(--x-text)}
html[data-theme] .foot .foot__lnk{color:var(--x-text2)}html[data-theme] .foot .foot__lnk:hover{color:var(--x-text)}
html[data-theme] .x-faq .faq__list{border-top:1px solid var(--x-line)}

/* inner pages (contact, legal): same quiet language */
html[data-theme] .grid-bg{display:none}
html[data-theme] .sub{background:var(--x-bg)}
html[data-theme] .sub h1{font-stretch:100%;font-weight:700;letter-spacing:-.045em;line-height:1.02;font-size:clamp(44px,5.4vw,76px);color:var(--x-text)}
html[data-theme] .sub h1 .bl{color:var(--x-text2)}
html[data-theme] .sub__lede{color:var(--x-text2)}
html[data-theme] .form.wiz-card{background:var(--x-card);border:1px solid var(--x-line);border-radius:30px;box-shadow:0 40px 80px -50px rgba(0,0,0,.45)}
html[data-theme=dark] .form.wiz-card{background:#141416}
html[data-theme] .wiz__q,html[data-theme] .wiz legend{font-family:var(--x-font);font-stretch:100%;color:var(--x-text)}
html[data-theme] .doc{color:var(--x-text2)}html[data-theme] .doc :is(h1,h2,h3,strong){color:var(--x-text)}
html[data-theme] .nav .langs a:not(.z):not(.z),html[data-theme] .menu .langs a:not(.z):not(.z){color:var(--x-text2)}
html[data-theme] .nav .langs a[aria-current]:not(.z):not(.z),html[data-theme] .menu .langs a[aria-current]:not(.z):not(.z){color:var(--x-text)}

.iph__s{text-align:left}

/* cookie notice: a small glass card instead of the old navy block */
html[data-theme] .cc{background:var(--x-glass);-webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);color:var(--x-text2);border-radius:22px;box-shadow:0 0 0 1px var(--x-line),0 24px 60px -24px rgba(0,0,0,.45);font-family:var(--x-font);font-size:14px;width:min(400px,calc(100vw - 32px));left:16px;bottom:16px}
html[data-theme] .cc__t{color:var(--x-text);font-stretch:100%;font-size:15px}
html[data-theme] .cc a:not(.z):not(.z){color:var(--x-acc);text-decoration:underline;text-underline-offset:2px}
html[data-theme] .cc-btn{height:36px;padding:0 16px;font-size:13px;background:var(--x-btn);color:#fff}
html[data-theme] .cc-btn:hover{background:var(--x-btn-h)}
html[data-theme] .cc-btn+.cc-btn:not(.cc-btn--l){background:var(--x-line);color:var(--x-text)}
html[data-theme] .cc-btn--l{background:none;color:var(--x-acc);text-decoration:none;padding:0 6px}
html[data-theme] .cc__panel{border-top-color:var(--x-line)}
html[data-theme] .cc__row{border-bottom-color:var(--x-line)}html[data-theme] .cc__row b{color:var(--x-text)}html[data-theme] .cc__row p,html[data-theme] .cc__st,html[data-theme] .cc__row code{color:var(--x-text2)}
html[data-theme] .sw i{background:var(--x-line)}html[data-theme] .sw input:checked+i{background:#30D158}
@media (max-width:400px){.x-pc{padding:26px 22px}.x-pc .x-btn{white-space:normal;text-align:center;height:auto;min-height:48px;padding:10px 22px;line-height:1.2}}

/* LOMY marks in the hero: where we work (rotating) and three plain promises */
.x-where{margin:0 0 18px;font-size:17px;font-weight:600;color:var(--x-text2)}
.x-where .rot b{color:var(--x-acc)}
.x-trust{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;font-weight:500;color:var(--x-text2)}
.x-trust li{display:flex;align-items:center;gap:9px}
.x-trust li::before{content:"";width:7px;height:7px;background:var(--x-btn);flex:none}
@media (max-width:900px){.x-trust{justify-content:center}}

/* ===== LOMY identity (08/10, Eli: "le bleu, le blanc, le bleu foncé, comme avant") =====
   Hero on LOMY blue with white type, dark-blue sections, blue highlights, big LOMY wordmark in the footer. */
.x-hero{background:#1462FF;color:#EEF3FF}
html[data-theme] .x-hero :is(h1,h2,h3){color:#fff}
.x-hero .x-lead{color:#fff}
.x-hero .x-where{color:#fff}
.x-hero .x-where .rot b{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5);text-underline-offset:.16em}
.x-hero .x-trust{color:#fff}.x-hero .x-trust li::before{background:#fff}
html[data-theme] .x-hero a.x-btn:not(.z):not(.z):not(.z){background:#fff;color:#0A1430}
html[data-theme] .x-hero a.x-btn:not(.z):not(.z):not(.z):hover{background:#DCE6FF;color:#0A1430}
html[data-theme] .x-hero a.x-link:not(.z):not(.z){color:#fff}
.x-hero .x-tabs{background:rgba(5,20,80,.22)}
.x-hero .x-tab{color:#fff}.x-hero .x-tab:hover{color:#fff}
html[data-theme] .x-hero .x-tab.is-on{background:#fff;color:#0A1430;box-shadow:0 6px 16px -8px rgba(5,20,80,.45)}
.x-hero .x-tab i{background:rgba(10,20,48,.15)}.x-hero .x-tab i::after{background:#1462FF}
.x-hero .x-cap{color:#fff}.x-hero .x-cap b{color:#fff}
.x-hero .x-glow{background:radial-gradient(closest-side,rgba(255,255,255,.45),transparent 70%);opacity:.35}
.x-stage .iph{box-shadow:0 60px 110px -46px rgba(1,6,30,.85),0 24px 50px -28px rgba(1,6,30,.6)}
/* the header sits on the blue hero until you scroll */
html[data-demo-page] .nav:not(.is-s),html[data-demo-page] .nav:not(.is-s){background:#1462FF;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-demo-page] .nav:not(.is-s) nav ul a,html[data-demo-page] .nav:not(.is-s) nav ul a{opacity:1}
html[data-demo-page] .nav:not(.is-s) .logo:not(.z),html[data-demo-page] .nav:not(.is-s) .logo:not(.z),html[data-demo-page] .nav:not(.is-s) nav ul li a:not(.z):not(.z),html[data-demo-page] .nav:not(.is-s) nav ul li a:not(.z):not(.z){color:#fff}
html[data-demo-page] .nav:not(.is-s) .logo span,html[data-demo-page] .nav:not(.is-s) .logo span{background:#fff}
html[data-demo-page] .nav:not(.is-s) .theme,html[data-demo-page] .nav:not(.is-s) .theme{color:#fff}
html[data-demo-page] .nav:not(.is-s) .burger i,html[data-demo-page] .nav:not(.is-s) .burger i{background:#fff}
html[data-demo-page] .nav:not(.is-s) .langs a:not(.z):not(.z),html[data-demo-page] .nav:not(.is-s) .langs a:not(.z):not(.z){color:#fff}
html[data-demo-page] .nav:not(.is-s) .langs a[aria-current]:not(.z):not(.z),html[data-demo-page] .nav:not(.is-s) .langs a[aria-current]:not(.z):not(.z){color:#fff;background:rgba(5,20,80,.3)}
html[data-demo-page] .nav:not(.is-s) .btn:not(.z):not(.z),html[data-demo-page] .nav:not(.is-s) .btn:not(.z):not(.z){background:#fff;color:#0A1430}
/* pricing: the build card in LOMY blue */
html[data-theme] .x-pc--hi{background:#1462FF;box-shadow:none;color:#DCE6FF}
html[data-theme] .x-pc--hi :is(h3,.x-pc__n,li){color:#fff}
html[data-theme] .x-pc--hi .x-pc__s{color:#EEF3FF}
html[data-theme] .x-pc--hi ul{border-top-color:rgba(255,255,255,.25)}
html[data-theme] .x-pc--hi li::before{border-color:#fff}
html[data-theme] .x-pc--hi a.x-btn:not(.z):not(.z):not(.z){background:#fff;color:#0A1430}
/* closing call to action on dark blue */
.x-cta{background:#0C1330}
html[data-theme] .x-cta h2{color:#fff}
.x-cta p{color:#B8C2DB}
html[data-theme] .x-cta a.x-link:not(.z):not(.z){color:#fff}
/* footer: dark blue in both themes, with the big LOMY wordmark (blue Y) */
html[data-theme] .foot{background:#04060F;color:#8F9AB8;border-top:0}
html[data-theme] .foot h2{color:#fff}
html[data-theme] .foot a:not(.z):not(.z):not(.btn),html[data-theme] .foot .foot__lnk{color:#B8C2DB}
html[data-theme] .foot a:not(.z):not(.z):not(.btn):hover,html[data-theme] .foot .foot__lnk:hover{color:#fff}
html[data-theme] .foot__b{border-top-color:rgba(126,155,255,.16)}
html[data-theme] .foot .curs button,html[data-theme] .foot .langs a:not(.z):not(.z){color:#8F9AB8}
html[data-theme] .foot .curs button[aria-pressed=true],html[data-theme] .foot .langs a[aria-current]:not(.z):not(.z){color:#fff;background:rgba(255,255,255,.12)}
html[data-theme] .foot .big{display:flex;color:#fff}

/* trade pages: what the app does (four plain points, blue marker, no cards) */
.x-feat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,3vw,44px);border-top:1px solid var(--x-line);padding-top:34px}
.x-feat article{position:relative;padding-top:22px}
.x-feat article::before{content:"";position:absolute;left:0;top:0;width:10px;height:10px;background:var(--x-btn)}
.x-feat h3{font-size:21px;font-weight:700;letter-spacing:-.02em;margin:0 0 8px}
.x-feat p{margin:0;font-size:16px;line-height:1.5;color:var(--x-text2)}

@media (max-width:1000px){.x-feat{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.x-feat{grid-template-columns:1fr}}

/* mobile hero: the phone comes right after the headline and the buttons; the promises move under it */
@media (max-width:900px){
  .x-hero__copy{display:contents}
  .x-hero__in{grid-template-areas:"where" "h1" "lead" "ctas" "tabs" "phone" "cap" "trust"}
  .x-where{grid-area:where;margin-bottom:12px}.x-h1{grid-area:h1}.x-lead{grid-area:lead}.x-hero .x-ctas{grid-area:ctas;gap:14px 22px}
  .x-trust{grid-area:trust;margin-top:8px}
  .x-tabs{margin-top:26px}.x-stage{margin-top:22px}
}
@media (max-width:600px){
  .x-hero{padding-top:calc(56px + 22px)}
  .x-h1{font-size:clamp(40px,11vw,52px)}
  .x-lead{font-size:17px;margin-top:16px}
  .x-hero .x-ctas{margin-top:22px}
}
/* links to the London trade pages */
.x-trades .x-head{margin-bottom:30px}
.x-trade{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
html[data-theme] .x-trade a:not(.z):not(.z){display:inline-flex;align-items:center;height:46px;padding:0 20px;border-radius:999px;background:var(--x-card);box-shadow:inset 0 0 0 1px var(--x-line);color:var(--x-text);font-weight:600;font-size:16px;transition:background .25s,color .25s}
html[data-theme] .x-trade a:not(.z):not(.z):hover{background:#1462FF;color:#fff}
/* contact: book a 15-minute call */
.x-call__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,6vw,90px);align-items:start}
.x-callf{display:flex;flex-direction:column;gap:24px;background:var(--x-card);border-radius:30px;padding:clamp(24px,3vw,36px);box-shadow:0 0 0 1px var(--x-line),0 40px 80px -50px rgba(0,0,0,.45)}
.x-callf fieldset{border:0;margin:0;padding:0;min-width:0}
.x-callf legend{font-size:14px;font-weight:600;color:var(--x-text2);margin-bottom:10px;padding:0}
.x-chips{display:flex;flex-wrap:wrap;gap:8px}
.x-chip{position:relative;cursor:pointer}
.x-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.x-chip span{display:inline-flex;align-items:center;height:42px;padding:0 16px;border-radius:999px;background:var(--x-tile);box-shadow:inset 0 0 0 1px var(--x-line);color:var(--x-text);font-weight:600;font-size:15px;font-variant-numeric:tabular-nums;transition:background .2s,color .2s}
.x-chip input:checked+span{background:#1462FF;color:#fff;box-shadow:none}
.x-chip input:focus-visible+span{outline:2px solid var(--x-acc);outline-offset:2px}
.x-callf__f{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.x-callf__f label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--x-text2)}
.x-callf__f input{width:100%;min-width:0;box-sizing:border-box;height:48px;border-radius:14px;border:1px solid var(--x-line);background:var(--x-bg);color:var(--x-text);padding:0 14px;font:inherit;font-size:16px;font-weight:500}
.x-callf__f input:focus{outline:2px solid var(--x-acc);outline-offset:1px}
.x-callf__go{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.x-callf__msg{margin:0;font-size:15px;color:var(--x-text2)}
.x-callf.is-sent fieldset,.x-callf.is-sent .x-callf__f,.x-callf.is-sent button{display:none}
.x-callf.is-sent .x-callf__msg{font-size:18px;color:var(--x-text);font-weight:600}
@media (max-width:900px){.x-call__in{grid-template-columns:1fr}}
@media (max-width:600px){.x-callf__f{grid-template-columns:1fr}}