/* ==========================================================================
   LaneX Jobs — Business Profile
   Fonts served locally from /profile/fonts — no third-party font runtime.
   ========================================================================== */

/* ── Fonts ─────────────────────────────────────────────────────────────── */
@font-face{font-family:"Jakarta";src:url("fonts/PlusJakartaSans-Regular.woff2") format("woff2"),url("fonts/PlusJakartaSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Jakarta";src:url("fonts/PlusJakartaSans-Medium.woff2") format("woff2"),url("fonts/PlusJakartaSans-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Jakarta";src:url("fonts/PlusJakartaSans-SemiBold.woff2") format("woff2"),url("fonts/PlusJakartaSans-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Jakarta";src:url("fonts/PlusJakartaSans-Bold.woff2") format("woff2"),url("fonts/PlusJakartaSans-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"LaoUI";src:url("fonts/NotoSansLao-Regular.woff2") format("woff2"),url("fonts/NotoSansLao-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"LaoUI";src:url("fonts/NotoSansLao-Bold.woff2") format("woff2"),url("fonts/NotoSansLao-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

/* ── Tokens ────────────────────────────────────────────────────────────── */
:root{
  /* Ink — charcoal, not blue-black */
  --ink:#0F1020;
  --ink-2:#272A3D;
  --muted:#565A73;
  --muted-2:#63677D;   /* AA on white, lavender and violet-wash grounds */

  /* Brand violet */
  --violet:#6D28D9;
  --violet-2:#7C3AED;
  --violet-3:#9061F9;
  --violet-deep:#4C1D95;
  --violet-wash:#F5F0FF;

  /* Ground */
  --white:#FFFFFF;
  --lav-50:#FBFAFE;
  --lav-100:#F6F3FD;
  --lav-150:#F1ECFC;
  --blue-50:#F2F7FE;
  --blue-100:#E6F0FC;

  /* Dark surface (trust chapter) */
  --dark:#111217;
  --dark-2:#181A22;
  --dark-line:rgba(255,255,255,.10);
  --dark-text:#EDEDF2;
  --dark-muted:#9BA0B4;

  /* Lines & accents */
  --line:#E9E5F4;
  --line-soft:#F1EEF9;
  --teal:#0E8F9F;
  --amber:#B45309;
  --green:#15803D;

  /* Elevation — very soft, used sparingly */
  --sh-xs:0 1px 2px rgba(15,16,32,.04);
  --sh-sm:0 1px 3px rgba(15,16,32,.05), 0 8px 20px -14px rgba(76,29,149,.22);
  --sh-md:0 2px 6px rgba(15,16,32,.04), 0 20px 44px -26px rgba(76,29,149,.28);
  --sh-lg:0 4px 12px rgba(15,16,32,.05), 0 44px 90px -46px rgba(76,29,149,.34);

  /* Geometry */
  --r-xs:10px; --r-sm:14px; --r-md:20px; --r-lg:26px; --r-xl:32px; --r-2xl:38px;
  --gutter:clamp(20px,3.4vw,32px);
  --maxw:1320px;
  --maxw-text:1120px;
  --sec-y:clamp(80px,8.6vw,148px);
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  /* Type */
  --f-sans:"Jakarta","LaoUI",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-lao:"LaoUI","Jakarta",system-ui,sans-serif;
  --lh-display:1.05;
  --ls-display:-.03em;
  --nav-h:74px;
}

/* Lao script: looser leading, no tracking games, no uppercase */
html[lang="lo"]{
  --f-sans:"LaoUI","Jakarta",system-ui,sans-serif;
  --lh-display:1.42;
  --ls-display:0;
}
html[lang="lo"] .eyebrow,html[lang="lo"] .kicker,html[lang="lo"] .btn,
html[lang="lo"] .chip,html[lang="lo"] .chapter,html[lang="lo"] .lbl{letter-spacing:normal;text-transform:none}
html[lang="lo"] h1,html[lang="lo"] h2,html[lang="lo"] h3{line-height:1.45}
html[lang="lo"] .lede,html[lang="lo"] p,html[lang="lo"] li{line-height:1.95}
.w{white-space:nowrap}

/* ── Reset ─────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 24px)}
body{
  margin:0;font-family:var(--f-sans);font-size:17px;line-height:1.7;
  color:var(--ink-2);background:var(--white);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:var(--violet);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--ink);margin:0;font-weight:700;letter-spacing:var(--ls-display)}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--violet-2);outline-offset:3px;border-radius:8px}
::selection{background:#DED2FF;color:var(--ink)}

.container{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
.container-text{max-width:var(--maxw-text)}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--violet);color:#fff;padding:14px 20px;border-radius:0 0 14px 0;font-weight:600}
.skip-link:focus{left:0;text-decoration:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ── Section bands ─────────────────────────────────────────────────────── */
.section{padding-block:var(--sec-y);position:relative}
.band-white{background:var(--white)}
.band-lav{background:linear-gradient(180deg,var(--lav-50),var(--lav-100) 55%,var(--lav-50))}
.band-dark{background:var(--dark);color:var(--dark-text)}
.band-dark h1,.band-dark h2,.band-dark h3{color:#fff}

/* ── Section furniture ─────────────────────────────────────────────────── */
.sec-head{max-width:860px;margin-bottom:clamp(40px,4.8vw,68px)}
.sec-head.wide{max-width:none}
.chapter{display:inline-flex;align-items:center;gap:11px;font-size:.74rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--violet);margin-bottom:20px}
.chapter i{font-style:normal;font-variant-numeric:tabular-nums;color:var(--violet-deep)}
.chapter::after{content:"";width:30px;height:1px;background:linear-gradient(90deg,var(--violet-2),transparent)}
.band-dark .chapter{color:#B69CF7}
.band-dark .chapter i{color:#CDBAFB}
.band-dark .chapter::after{background:linear-gradient(90deg,#8B5CF6,transparent)}

h1{font-size:clamp(2.35rem,4.9vw,4.3rem);line-height:var(--lh-display)}
h2{font-size:clamp(1.95rem,3.5vw,3.1rem);line-height:var(--lh-display)}
h3{font-size:1.18rem;line-height:1.38;letter-spacing:-.018em}
.lede{margin-top:22px;font-size:clamp(1.06rem,1.3vw,1.24rem);line-height:1.75;color:var(--muted);max-width:62ch}
.band-dark .lede{color:var(--dark-muted)}
.hl{color:var(--violet-deep);position:relative;white-space:nowrap}
.band-dark .hl{color:#C4B0FA}

.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 17px 8px 12px;border:1px solid var(--line);
  border-radius:999px;background:rgba(255,255,255,.85);font-size:.78rem;font-weight:600;color:var(--violet-deep);
  box-shadow:var(--sh-xs)}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--violet-2);box-shadow:0 0 0 4px rgba(124,58,237,.15)}

.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;border:1px solid var(--line);
  background:var(--white);font-size:.82rem;font-weight:600;color:var(--ink-2)}
.chip svg{width:15px;height:15px;color:var(--violet-2);flex:0 0 auto}
.band-dark .chip{background:rgba(255,255,255,.06);border-color:var(--dark-line);color:var(--dark-text)}
.band-dark .chip svg{color:#A78BFA}

/* ── Buttons ───────────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:14px;
  font-size:.95rem;font-weight:600;cursor:pointer;border:1px solid transparent;min-height:50px;
  transition:transform .24s var(--ease),box-shadow .24s var(--ease),background .24s var(--ease),border-color .24s var(--ease)}
.btn:hover{text-decoration:none}
.btn svg{width:17px;height:17px;flex:0 0 auto}
.btn-primary{background:var(--violet);color:#fff;box-shadow:0 10px 26px -12px rgba(76,29,149,.7)}
.btn-primary:hover{background:var(--violet-deep);transform:translateY(-2px);box-shadow:0 16px 34px -14px rgba(76,29,149,.8)}
.btn-ghost{background:var(--white);border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{transform:translateY(-2px);border-color:#D9CCF7;box-shadow:var(--sh-sm)}
.band-dark .btn-ghost{background:rgba(255,255,255,.07);border-color:var(--dark-line);color:#fff}
.band-dark .btn-ghost:hover{background:rgba(255,255,255,.13)}

/* ── Header ────────────────────────────────────────────────────────────── */
.nav{position:sticky;top:0;z-index:60;background:transparent;transition:background .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.nav::after{content:"";position:absolute;inset:0;border-bottom:1px solid transparent;pointer-events:none;transition:border-color .35s var(--ease)}
.nav.is-stuck{background:rgba(255,255,255,.78);backdrop-filter:saturate(1.7) blur(18px);-webkit-backdrop-filter:saturate(1.7) blur(18px);
  box-shadow:0 1px 0 rgba(15,16,32,.04),0 12px 30px -28px rgba(76,29,149,.55)}
.nav.is-stuck::after{border-bottom-color:var(--line)}
.nav-in{display:flex;align-items:center;gap:22px;height:var(--nav-h);transition:height .35s var(--ease)}
.nav.is-stuck .nav-in{height:64px}

.brand{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.brand:hover{text-decoration:none}
.brand img{width:34px;height:34px;border-radius:9px;transition:transform .35s var(--ease)}
.nav.is-stuck .brand img{transform:scale(.94)}
.brand-name{font-weight:700;font-size:1.03rem;color:var(--ink);letter-spacing:-.022em;line-height:1.1}
.brand-sub{display:block;font-size:.66rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--violet);line-height:1.5}

.nav-links{display:flex;gap:2px;margin-left:auto;position:relative}
.nav-links a{position:relative;padding:10px 15px;border-radius:11px;font-size:.9rem;font-weight:500;color:var(--muted);
  transition:color .22s var(--ease),background .22s var(--ease)}
.nav-links a:hover{color:var(--violet);background:rgba(124,58,237,.06);text-decoration:none}
.nav-links a[aria-current="true"]{color:var(--violet-deep);font-weight:600}
.nav-links a::after{content:"";position:absolute;left:15px;right:15px;bottom:4px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--violet-2),var(--violet-3));transform:scaleX(0);transform-origin:center;
  transition:transform .32s var(--ease)}
.nav-links a[aria-current="true"]::after{transform:scaleX(1)}

.nav-tools{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.langswitch{display:flex;padding:3px;gap:2px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.9)}
.langswitch button{border:0;background:transparent;cursor:pointer;padding:7px 14px;border-radius:999px;font-size:.8rem;
  font-weight:600;color:var(--muted);transition:.22s var(--ease)}
.langswitch button:hover{color:var(--violet)}
.langswitch button[aria-pressed="true"]{background:var(--violet);color:#fff;box-shadow:0 6px 14px -8px rgba(109,40,217,.9)}
.btn-print{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:rgba(255,255,255,.9);
  color:var(--ink-2);padding:10px 16px;border-radius:12px;font-size:.85rem;font-weight:600;cursor:pointer;transition:.24s var(--ease)}
.btn-print:hover{border-color:#D9CCF7;color:var(--violet-deep);box-shadow:var(--sh-sm);transform:translateY(-1px)}
.btn-print svg{width:15px;height:15px;flex:0 0 auto}

.nav-toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--line);
  background:rgba(255,255,255,.9);border-radius:12px;cursor:pointer}
.nav-toggle svg{width:20px;height:20px;color:var(--ink)}
.nav-panel{display:none}

@media (max-width:1100px){
  .nav-links{display:none}
  .nav-toggle{display:inline-flex}
  .nav-tools{margin-left:auto}
  .btn-print span{display:none}
  .nav-panel{display:block;position:absolute;left:0;right:0;top:100%;background:rgba(255,255,255,.98);
    backdrop-filter:blur(18px);border-bottom:1px solid var(--line);box-shadow:var(--sh-md);overflow:hidden;
    max-height:0;transition:max-height .36s var(--ease);visibility:hidden}
  .nav-panel[data-open="true"]{max-height:560px;visibility:visible}
  .nav-panel ul{padding:12px var(--gutter) 22px;display:grid;gap:2px}
  .nav-panel a{display:block;padding:15px 12px;border-radius:12px;font-size:1.05rem;font-weight:500;color:var(--ink-2);
    border-bottom:1px solid var(--line-soft);min-height:52px}
  .nav-panel a:hover{background:rgba(124,58,237,.06);color:var(--violet);text-decoration:none}
  .nav-panel a[aria-current="true"]{color:var(--violet-deep);font-weight:600}
  .nav-panel .panel-print{display:flex;align-items:center;gap:11px;width:100%;padding:15px 12px;border:0;border-radius:12px;
    background:transparent;font-size:1.05rem;font-weight:500;color:var(--ink-2);cursor:pointer;text-align:left;min-height:52px}
  .nav-panel .panel-print:hover{background:rgba(124,58,237,.06);color:var(--violet)}
  .nav-panel .panel-print svg{width:18px;height:18px;flex:0 0 auto}
}
@media (max-width:540px){
  .nav-in{gap:10px}
  .nav-tools{gap:7px}
  .nav .btn-print{display:none}
  .langswitch button{padding:7px 12px;font-size:.79rem}
}
@media (max-width:420px){.brand-sub{display:none}}

/* ── Hero ──────────────────────────────────────────────────────────────── */
.hero{position:relative;padding-top:clamp(40px,5vw,68px);padding-bottom:clamp(56px,6.4vw,96px);overflow:hidden;
  background:linear-gradient(180deg,#FFFFFF 0%,#FBF9FF 40%,#F4F0FD 100%)}
.hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-bg .glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55}
.hero-bg .g1{width:620px;height:620px;top:-220px;right:-120px;background:radial-gradient(circle,#DCC9FF,transparent 68%)}
.hero-bg .g2{width:520px;height:520px;bottom:-240px;left:-160px;background:radial-gradient(circle,#CFE2FF,transparent 70%)}
.hero-bg .mark{position:absolute;top:-6%;right:4%;width:min(760px,60%);opacity:.035;transform:rotate(-8deg)}

.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);
  gap:clamp(36px,4vw,60px);align-items:center}
.hero h1{margin-top:26px;max-width:none}
.hero .lede{margin-top:24px;max-width:56ch;font-size:clamp(1.06rem,1.32vw,1.2rem)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.hero-meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:30px}

@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:clamp(34px,5vw,50px)}
  .hero h1{max-width:none}
  .hero-stage{order:2}
}

/* Identity strip */
.idstrip{position:relative;margin-top:clamp(48px,5.4vw,80px);border-top:1px solid var(--line);
  display:grid;grid-template-columns:repeat(4,1fr)}
.idstrip div{padding:24px 28px;border-left:1px solid var(--line-soft)}
.idstrip div:first-child{border-left:0;padding-left:0}
.idstrip dt{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin-bottom:8px}
.idstrip dd{margin:0;font-size:1.02rem;font-weight:600;color:var(--ink);line-height:1.45}
@media (max-width:900px){
  .idstrip{grid-template-columns:repeat(2,1fr)}
  .idstrip div{padding:20px 22px}
  .idstrip div:nth-child(odd){border-left:0;padding-left:0}
  .idstrip div:nth-child(n+3){border-top:1px solid var(--line-soft)}
}
@media (max-width:480px){.idstrip{grid-template-columns:1fr}.idstrip div{border-left:0;padding-left:0}
  .idstrip div+div{border-top:1px solid var(--line-soft)}}

/* ══ Device / product UI recreations ═══════════════════════════════════════
   Real LaneX screens rebuilt in markup — no screenshots, no stock imagery.
   Copy is drawn from the app's own translation files.                      */
.hero-stage{position:relative;margin:0;display:flex;justify-content:center;align-items:center}

/* Art plate: fine inner ring + a scrim that dissolves the lower edge into the
   section ground, so the artwork reads as composed rather than pasted on. */
.artplate{position:relative;width:100%;border-radius:var(--r-2xl);overflow:hidden;
  background:linear-gradient(160deg,#F3EDFF,#E7F0FE);
  box-shadow:0 42px 90px -40px rgba(48,24,110,.5),0 10px 28px -16px rgba(15,16,32,.2)}
.artplate::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),inset 0 0 0 6px rgba(255,255,255,.28)}
.artplate img{width:100%;display:block;aspect-ratio:5/3;object-fit:cover}
.artplate-scrim{position:absolute;left:0;right:0;bottom:0;height:34%;pointer-events:none;
  background:linear-gradient(180deg,rgba(244,240,253,0),rgba(244,240,253,.72))}
.artchip{position:absolute;left:-14px;bottom:26px;display:flex;align-items:center;gap:11px;
  background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);border-radius:16px;padding:12px 16px;box-shadow:var(--sh-md);z-index:2}
.artchip .ic{width:30px;height:30px;border-radius:9px;background:#EAF7EE;color:var(--green);flex:0 0 auto;
  display:flex;align-items:center;justify-content:center}
.artchip .ic svg{width:16px;height:16px}
.artchip b{display:block;font-size:.78rem;color:var(--ink);letter-spacing:-.01em;line-height:1.3}
.artchip > span > span{font-size:.68rem;color:var(--muted-2);font-weight:500}
@media (max-width:700px){.artplate img{aspect-ratio:10/7}.artchip{left:8px;bottom:14px;padding:10px 13px}}

/* Device inside the Transactions chapter */
.tx-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.42fr);gap:clamp(28px,3.6vw,52px);
  align-items:center;margin-top:clamp(40px,4.6vw,64px)}
.tx-grid .custody{margin-top:0}
.tx-phone{display:flex;justify-content:center}
@media (max-width:1000px){.tx-grid{grid-template-columns:1fr}.tx-phone{display:none}}
.phone{position:relative;width:min(300px,74vw);border-radius:40px;background:linear-gradient(160deg,#1A1B26,#2C2E3E);
  padding:9px;box-shadow:0 40px 90px -34px rgba(48,24,110,.55),0 10px 30px -12px rgba(15,16,32,.28),
  inset 0 0 0 1px rgba(255,255,255,.10);flex:0 0 auto}
.phone-screen{position:relative;border-radius:32px;overflow:hidden;background:linear-gradient(180deg,#FBF9FF,#F2ECFD);
  aspect-ratio:9/17.6;display:flex;flex-direction:column}
.phone-notch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:86px;height:22px;border-radius:14px;
  background:#15161F;z-index:3}
.ui-bar{display:flex;align-items:center;justify-content:space-between;padding:13px 18px 6px;font-size:9.5px;
  font-weight:700;color:var(--ink);letter-spacing:.02em}
.ui-bar .sig{display:flex;gap:3px;align-items:center}
.ui-bar .sig i{display:block;width:3px;border-radius:1px;background:var(--ink);height:6px}
.ui-bar .sig i:nth-child(2){height:8px}.ui-bar .sig i:nth-child(3){height:10px}
.ui-body{flex:1;padding:10px 14px 14px;display:flex;flex-direction:column;gap:9px;overflow:hidden}
.ui-head{display:flex;align-items:center;gap:8px;padding:2px 2px 6px}
.ui-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--violet-2),var(--violet-3));
  flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700}
.ui-head b{font-size:11.5px;color:var(--ink);letter-spacing:-.01em;display:block;line-height:1.25}
.ui-head span{font-size:9px;color:var(--muted-2);display:block}
.ui-verified{margin-left:auto;display:inline-flex;align-items:center;gap:3px;font-size:8px;font-weight:700;
  color:var(--green);background:#EAF7EE;border-radius:999px;padding:3px 7px}
.ui-verified svg{width:8px;height:8px}

/* Order status card — the heart of the app */
.ui-card{background:#fff;border-radius:16px;padding:12px;box-shadow:0 6px 18px -12px rgba(48,24,110,.4);
  border:1px solid rgba(233,229,244,.9)}
.ui-track{display:flex;align-items:center;gap:4px;margin-bottom:10px}
.ui-track .st{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}
.ui-track .dot{width:16px;height:16px;border-radius:50%;background:#EDE8FA;display:flex;align-items:center;justify-content:center}
.ui-track .dot svg{width:8px;height:8px;color:#fff}
.ui-track .st.done .dot{background:var(--green)}
.ui-track .st.now .dot{background:var(--violet);box-shadow:0 0 0 3px rgba(124,58,237,.18)}
.ui-track .lbl{font-size:7.5px;font-weight:600;color:var(--muted-2);letter-spacing:.01em}
.ui-track .st.done .lbl,.ui-track .st.now .lbl{color:var(--ink)}
.ui-track .bar{flex:0 0 14px;height:2px;border-radius:2px;background:#EDE8FA;margin-bottom:12px}
.ui-track .bar.on{background:var(--green)}
.ui-amount{font-size:19px;font-weight:700;color:var(--ink);letter-spacing:-.02em;line-height:1.15}
.ui-status{font-size:9.5px;color:var(--muted);line-height:1.5;margin-top:3px}
.ui-safe{display:flex;gap:6px;align-items:flex-start;margin-top:9px;padding:8px;border-radius:10px;
  background:linear-gradient(120deg,#F3EEFF,#EAF2FF);font-size:8px;color:var(--violet-deep);line-height:1.45;font-weight:500}
.ui-safe svg{width:10px;height:10px;flex:0 0 auto;margin-top:1px;color:var(--violet)}
.ui-btn{margin-top:10px;background:var(--violet);color:#fff;border-radius:11px;padding:9px;text-align:center;
  font-size:10px;font-weight:700;letter-spacing:-.01em}
.ui-btn.sec{background:#fff;color:var(--ink-2);border:1px solid var(--line);margin-top:6px;font-weight:600}
.ui-msg{max-width:78%;padding:7px 10px;border-radius:12px;font-size:9px;line-height:1.45}
.ui-msg.them{background:#fff;border:1px solid var(--line);color:var(--ink-2);border-bottom-left-radius:4px}
.ui-msg.them:first-of-type{margin-top:auto}
.ui-msg.me{background:var(--violet);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}

/* Floating satellite cards around the phone */
.sat{position:absolute;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.9);border-radius:16px;padding:11px 14px;box-shadow:var(--sh-md);z-index:2}
.sat .sat-t{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.sat .sat-s{font-size:.65rem;color:var(--muted-2);margin-top:2px;font-weight:500}
.sat .ic{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.sat .ic svg{width:14px;height:14px}
.sat-a{top:10%;left:-2%;animation:float-a 7s ease-in-out infinite}
.sat-b{bottom:20%;right:-2%;animation:float-b 8.4s ease-in-out infinite}
.sat-c{bottom:5%;left:2%;animation:float-a 9.2s ease-in-out infinite reverse}
@keyframes float-a{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes float-b{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
@media (max-width:760px){.sat{display:none}}

/* ── Intro / what LaneX is ─────────────────────────────────────────────── */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4.6vw,72px);align-items:start}
.split-a{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
@media (max-width:940px){.split,.split-a{grid-template-columns:1fr}}
.prose p+p{margin-top:18px}
.prose p{color:var(--muted);font-size:1.04rem;line-height:1.85}
.prose strong{color:var(--ink);font-weight:600}

.cardgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);margin-top:clamp(40px,4.6vw,64px)}
@media (max-width:1000px){.cardgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cardgrid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(22px,2.3vw,28px);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:#DDD2F6}
.card .ic{width:42px;height:42px;border-radius:12px;background:var(--violet-wash);display:flex;align-items:center;
  justify-content:center;margin-bottom:16px;transition:transform .3s var(--ease)}
.card:hover .ic{transform:translateY(-2px) scale(1.04)}
.card .ic svg{width:20px;height:20px;color:var(--violet-deep)}
.card h3{font-size:1.04rem;margin-bottom:8px}
.card p{font-size:.94rem;color:var(--muted);line-height:1.68}

/* ── Bento: five pillars ───────────────────────────────────────────────── */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(14px,1.6vw,20px)}
.bento .b{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(24px,2.4vw,34px);display:flex;flex-direction:column;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),border-color .32s var(--ease)}
.bento .b:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:#DDD2F6}
.b-lg{grid-column:span 3;grid-row:span 2}
.b-md{grid-column:span 3}
.b-sm{grid-column:span 2}
.b-wide{grid-column:span 6}
@media (max-width:1000px){.b-lg,.b-md{grid-column:span 6}.b-lg{grid-row:auto}.b-sm{grid-column:span 3}}
@media (max-width:620px){.b-sm,.b-wide{grid-column:span 6}}
.b .lbl{font-size:.7rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--violet);margin-bottom:12px}
.b h3{font-size:clamp(1.12rem,1.5vw,1.34rem);margin-bottom:10px}
.b p{font-size:.96rem;color:var(--muted);line-height:1.72;max-width:46ch}
.b-art{margin-top:auto;padding-top:clamp(20px,2.4vw,28px)}

/* Mini UI panels used inside bento cards */
.mini{border-radius:16px;border:1px solid var(--line);background:linear-gradient(165deg,#FCFAFF,#F3EEFD);
  padding:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.mini-row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line-soft);border-radius:11px;
  padding:9px 11px}
.mini-row+.mini-row{margin-top:7px}
.mini-row .av{width:26px;height:26px;border-radius:8px;background:linear-gradient(140deg,#EDE4FF,#DCEBFF);flex:0 0 auto;
  display:flex;align-items:center;justify-content:center}
.mini-row .av svg{width:13px;height:13px;color:var(--violet-deep)}
.mini-row b{font-size:.79rem;color:var(--ink);display:block;line-height:1.3}
.mini-row span{font-size:.7rem;color:var(--muted-2);display:block}
.mini-row .tag{margin-left:auto;font-size:.66rem;font-weight:700;padding:3px 8px;border-radius:999px;
  background:#EAF7EE;color:var(--green);white-space:nowrap}
.mini-row .tag.v{background:var(--violet-wash);color:var(--violet-deep)}
.mini-row .tag.a{background:#FEF3E2;color:var(--amber)}

/* Map-ish rider panel */
.mini-map{position:relative;height:clamp(120px,13vw,150px);border-radius:16px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(150deg,#F2F7FE,#EFE9FC)}
.mini-map svg{position:absolute;inset:0;width:100%;height:100%}
.mini-map .pin{position:absolute;width:26px;height:26px;border-radius:50%;background:var(--violet);border:3px solid #fff;
  box-shadow:0 4px 12px rgba(76,29,149,.4);display:flex;align-items:center;justify-content:center}
.mini-map .pin svg{position:static;width:12px;height:12px;color:#fff}

/* ── Founder & team ────────────────────────────────────────────────────── */
.people{margin-top:clamp(44px,5vw,72px)}
.founder{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:center}
.founder-photo{margin:0;position:relative;border-radius:var(--r-xl);overflow:hidden;
  background:linear-gradient(160deg,#F4EEFF,#E7F1FF);border:1px solid var(--line);box-shadow:var(--sh-lg)}
.founder-photo::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.founder-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 30%;display:block}
.founder-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--violet);margin-bottom:14px}
.founder-name{font-size:clamp(1.5rem,2.6vw,2.15rem);line-height:1.14;letter-spacing:-.028em}
.founder-english{margin-top:5px;font-family:var(--f-en);font-size:1.02rem;font-weight:700;color:var(--violet-deep);line-height:1.5;letter-spacing:.01em}
.founder-role{margin-top:9px;font-size:.99rem;font-weight:600;color:var(--violet)}
.founder-bio{margin-top:12px;font-size:.97rem;line-height:1.75;color:var(--muted);max-width:48ch}
.founder-quote{margin:clamp(20px,2.4vw,28px) 0 0;padding-left:clamp(18px,2.2vw,26px);border-left:3px solid;
  border-image:linear-gradient(180deg,var(--violet-2),rgba(14,143,159,.45)) 1}
.founder-quote p{font-size:clamp(1.04rem,1.6vw,1.3rem);line-height:1.62;color:var(--ink-2);font-weight:500;
  letter-spacing:-.012em;max-width:52ch}
@media (max-width:860px){.founder{grid-template-columns:1fr;gap:24px}
  .founder-photo img{aspect-ratio:4/5;max-height:60vh}}

.team{margin-top:clamp(40px,4.6vw,64px)}
.team-head{font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--violet-deep);
  padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:clamp(16px,2vw,24px)}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,16px)}
.tcell{margin:0;border-radius:var(--r-md);overflow:hidden;background:linear-gradient(150deg,#F4EFFF,#E9F2FF);
  border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.tcell:hover{transform:translateY(-3px);box-shadow:var(--sh-md)}
.tcell img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 22%;display:block}
@media (max-width:820px){.team-grid{grid-template-columns:repeat(2,1fr)}}

/* ── Roles ─────────────────────────────────────────────────────────────── */
.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px)}
@media (max-width:1080px){.roles{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.roles{grid-template-columns:1fr}}
.role{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(22px,2.3vw,28px);
  display:flex;flex-direction:column;transition:transform .32s var(--ease),box-shadow .32s var(--ease),border-color .32s var(--ease)}
.role:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#DDD2F6}
.role .ic{width:46px;height:46px;border-radius:14px;background:linear-gradient(140deg,var(--violet-wash),#E9F1FE);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;transition:transform .32s var(--ease)}
.role:hover .ic{transform:translateY(-2px) rotate(-4deg)}
.role .ic svg{width:22px;height:22px;color:var(--violet-deep)}
.role h3{font-size:1.14rem}
.role .native{display:block;font-size:.85rem;font-weight:500;color:var(--violet);margin-top:4px;font-family:var(--f-lao)}
.role p{font-size:.93rem;color:var(--muted);line-height:1.7;margin-top:12px}
.role .wf{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:18px}
.role .wf span{font-size:.72rem;font-weight:600;color:var(--ink-2);background:var(--lav-100);border-radius:999px;padding:5px 10px}

/* ── Transaction flow ──────────────────────────────────────────────────── */
.flow{position:relative;margin-top:clamp(20px,2.4vw,32px)}
.flow-line{position:absolute;left:0;right:0;top:31px;height:2px;background:var(--line);overflow:hidden;border-radius:2px}
.flow-line i{position:absolute;inset:0;background:linear-gradient(90deg,var(--violet-2),var(--violet-3),var(--teal));
  transform:scaleX(0);transform-origin:left;transition:transform 1.5s var(--ease-out)}
.flow.is-in .flow-line i{transform:scaleX(1)}
.flow-steps{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(12px,1.6vw,22px)}
.fstep{text-align:left}
.fstep .num{width:62px;height:62px;border-radius:20px;background:#fff;border:1px solid var(--line);display:flex;
  align-items:center;justify-content:center;box-shadow:var(--sh-sm);margin-bottom:16px;transition:transform .3s var(--ease)}
.fstep:hover .num{transform:translateY(-3px)}
.fstep .num svg{width:24px;height:24px;color:var(--violet-deep)}
.fstep .k{font-size:.68rem;font-weight:700;letter-spacing:.14em;color:var(--violet);margin-bottom:7px;font-variant-numeric:tabular-nums}
.fstep h3{font-size:1rem;margin-bottom:7px}
.fstep p{font-size:.88rem;color:var(--muted);line-height:1.62}
@media (max-width:1000px){
  .flow-steps{grid-template-columns:1fr;gap:0}
  .flow-line{left:31px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .flow-line i{background:linear-gradient(180deg,var(--violet-2),var(--violet-3),var(--teal));transform:scaleY(0);transform-origin:top}
  .flow.is-in .flow-line i{transform:scaleY(1)}
  .fstep{display:grid;grid-template-columns:62px 1fr;gap:20px;padding-bottom:clamp(24px,3vw,34px)}
  .fstep .num{margin-bottom:0}
  .fstep .bd{padding-top:6px}
}

/* Custody panel */
.custody{border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(168deg,#fff,#FAF7FE);
  box-shadow:var(--sh-md);overflow:hidden;margin-top:clamp(40px,4.6vw,64px)}
.custody-h{padding:22px clamp(22px,2.6vw,30px);border-bottom:1px solid var(--line-soft);background:rgba(124,58,237,.035)}
.custody-h b{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--violet-deep)}
.custody-h h3{font-size:1.14rem;margin-top:6px}
.custody-g{display:grid;grid-template-columns:repeat(4,1fr)}
.custody-g > div{padding:clamp(20px,2.2vw,26px) clamp(22px,2.6vw,30px);border-left:1px solid var(--line-soft)}
.custody-g > div:first-child{border-left:0}
.custody-g .stage{display:inline-flex;width:30px;height:30px;border-radius:9px;align-items:center;justify-content:center;
  background:var(--violet-wash);color:var(--violet-deep);font-size:.74rem;font-weight:700;margin-bottom:12px}
.custody-g b{display:block;font-size:.96rem;color:var(--ink);margin-bottom:6px}
.custody-g span{font-size:.87rem;color:var(--muted);line-height:1.62}
@media (max-width:900px){.custody-g{grid-template-columns:repeat(2,1fr)}
  .custody-g > div:nth-child(odd){border-left:0}
  .custody-g > div:nth-child(n+3){border-top:1px solid var(--line-soft)}}
@media (max-width:520px){.custody-g{grid-template-columns:1fr}
  .custody-g > div{border-left:0}.custody-g > div+div{border-top:1px solid var(--line-soft)}}

.callout{margin-top:clamp(28px,3.2vw,40px);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;
  padding:clamp(20px,2.4vw,28px);border-radius:var(--r-lg);border:1px solid #E4DAF7;
  background:linear-gradient(120deg,rgba(124,58,237,.05),rgba(14,143,159,.035))}
.callout .ci{width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid var(--line);display:flex;
  align-items:center;justify-content:center;box-shadow:var(--sh-xs)}
.callout .ci svg{width:19px;height:19px;color:var(--violet)}
.callout h3{font-size:1.02rem;margin-bottom:6px}
.callout p{font-size:.94rem;color:var(--muted);line-height:1.72;max-width:84ch}

/* ── Trust (dark chapter) ──────────────────────────────────────────────── */
.band-dark{position:relative;overflow:hidden}
.band-dark .dk-glow{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none}
.band-dark .dk-1{width:640px;height:640px;top:-260px;right:-160px;background:radial-gradient(circle,rgba(124,58,237,.42),transparent 68%)}
.band-dark .dk-2{width:520px;height:520px;bottom:-240px;left:-140px;background:radial-gradient(circle,rgba(14,143,159,.26),transparent 70%)}
.band-dark .container{position:relative}
.tstat{font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.35;font-weight:600;color:#fff;letter-spacing:-.022em;max-width:22ch}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px);margin-top:clamp(40px,4.4vw,60px)}
@media (max-width:980px){.trust-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.trust-grid{grid-template-columns:1fr}}
.tcard{background:rgba(255,255,255,.045);border:1px solid var(--dark-line);border-radius:var(--r-lg);
  padding:clamp(22px,2.3vw,28px);transition:transform .32s var(--ease),background .32s var(--ease),border-color .32s var(--ease)}
.tcard:hover{transform:translateY(-3px);background:rgba(255,255,255,.075);border-color:rgba(167,139,250,.4)}
.tcard .ic{width:42px;height:42px;border-radius:12px;background:rgba(167,139,250,.14);display:flex;align-items:center;
  justify-content:center;margin-bottom:16px}
.tcard .ic svg{width:20px;height:20px;color:#B69CF7}
.tcard h3{font-size:1.03rem;color:#fff;margin-bottom:8px}
.tcard p{font-size:.92rem;color:var(--dark-muted);line-height:1.7}
.tnote{margin-top:clamp(30px,3.4vw,44px);font-size:.9rem;color:var(--dark-muted);max-width:76ch;
  padding-top:22px;border-top:1px solid var(--dark-line)}

/* ── Capabilities ──────────────────────────────────────────────────────── */
.caps{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(28px,3.4vw,52px)}
@media (max-width:860px){.caps{grid-template-columns:1fr}}
.capgroup h3{font-size:1.08rem;padding-bottom:15px;border-bottom:1px solid var(--line);margin-bottom:4px;
  display:flex;align-items:center;gap:11px}
.capgroup h3 svg{width:19px;height:19px;color:var(--violet-2);flex:0 0 auto}
.capgroup li{padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:.94rem;color:var(--muted);line-height:1.65}
.capgroup li b{display:block;color:var(--ink);font-weight:600;font-size:1rem;margin-bottom:3px}

/* ── Technology ────────────────────────────────────────────────────────── */
.tech{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px)}
@media (max-width:960px){.tech{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.tech{grid-template-columns:1fr}}

/* ── Impact ────────────────────────────────────────────────────────────── */
#impact{overflow:hidden}
.impact-wrap{position:relative}
/* Decorative network sits in the heading whitespace, never behind body copy. */
.impact-map{position:absolute;right:-4%;top:-6%;width:min(340px,32%);opacity:.42;pointer-events:none;z-index:0}
.impact-map svg{width:100%;height:auto}
@media (max-width:1240px){.impact-map{display:none}}
.impact{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(30px,4.6vw,70px);
  border-top:1px solid var(--line)}
.impact li{padding:clamp(24px,2.8vw,34px) 0;border-bottom:1px solid var(--line)}
.impact h3{font-size:clamp(1.06rem,1.5vw,1.24rem);margin-bottom:9px;display:flex;gap:13px;align-items:baseline}
.impact h3 i{font-style:normal;font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--violet);font-variant-numeric:tabular-nums}
.impact p{font-size:.96rem;color:var(--muted);line-height:1.75;max-width:52ch}
@media (max-width:820px){.impact{grid-template-columns:1fr}}

/* ── Inside LaneX (office) ─────────────────────────────────────────────── */
.office{position:relative;margin-top:clamp(32px,3.6vw,48px)}
.office-media{position:relative;overflow:hidden;border-radius:var(--r-2xl);border:1px solid var(--line);
  background:linear-gradient(150deg,#F1EAFF,#E4EFFF);box-shadow:var(--sh-lg)}
.office-media img{width:100%;aspect-ratio:16/9;max-height:min(66vh,600px);object-fit:cover;display:block}
.office-cap{display:flex;flex-wrap:wrap;gap:20px 30px;align-items:flex-end;justify-content:space-between;
  padding-top:clamp(22px,2.4vw,30px)}
.office-cap h3{font-size:clamp(1.16rem,1.7vw,1.44rem);margin-bottom:10px}
.office-cap p{font-size:.98rem;color:var(--muted);line-height:1.75;max-width:64ch}
@media (max-width:700px){.office-media img{aspect-ratio:4/3}}

.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);margin-top:clamp(38px,4.4vw,60px)}
@media (max-width:900px){.principles{grid-template-columns:1fr}}
.principles article{padding:clamp(22px,2.4vw,28px);border-radius:var(--r-lg);border:1px solid var(--line);background:#fff}
.principles .pnum{font-size:.7rem;font-weight:700;letter-spacing:.16em;color:var(--violet);margin-bottom:13px;font-variant-numeric:tabular-nums}
.principles p{font-size:1.02rem;line-height:1.6;color:var(--ink);font-weight:500;letter-spacing:-.012em}

/* ── Company / contact ─────────────────────────────────────────────────── */
.snapshot{border:1px solid var(--line);border-radius:var(--r-xl);background:#fff;box-shadow:var(--sh-sm);overflow:hidden}
.snapshot header{padding:20px 28px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:11px;
  background:rgba(124,58,237,.035)}
.snapshot header svg{width:17px;height:17px;color:var(--violet)}
.snapshot header b{font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--violet-deep)}
.snapshot dl{margin:0;padding:6px 28px 24px}
.snapshot dt{font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted-2);padding-top:17px}
.snapshot dd{margin:3px 0 0;font-size:.99rem;font-weight:600;color:var(--ink);line-height:1.55;padding-bottom:17px;
  border-bottom:1px solid var(--line-soft)}
.snapshot dd:last-of-type{border-bottom:0;padding-bottom:4px}

.contacts{display:grid;gap:12px}
.ccard{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:19px 22px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:#fff;color:inherit;
  transition:transform .26s var(--ease),box-shadow .26s var(--ease),border-color .26s var(--ease)}
.ccard:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:#DACDF8;text-decoration:none}
.ccard .cic{width:42px;height:42px;border-radius:12px;background:var(--violet-wash);display:flex;align-items:center;justify-content:center}
.ccard .cic svg{width:19px;height:19px;color:var(--violet-deep)}
.ccard b{display:block;font-size:.97rem;color:var(--ink)}
.ccard span{font-size:.88rem;color:var(--muted);word-break:break-word}
.ccard .arw{width:16px;height:16px;color:var(--violet-2);flex:0 0 auto;transition:transform .26s var(--ease)}
.ccard:hover .arw{transform:translateX(3px)}

/* ── Final CTA ─────────────────────────────────────────────────────────── */
.cta{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--lav-50),var(--violet-wash))}
.cta::before{content:"";position:absolute;width:760px;height:760px;border-radius:50%;top:-380px;left:50%;
  transform:translateX(-50%);background:radial-gradient(circle,rgba(124,58,237,.13),transparent 66%);pointer-events:none}
.cta-in{position:relative;text-align:center;max-width:820px;margin:0 auto}
.cta-in img{width:62px;height:62px;margin:0 auto 26px}
.cta-in h2{font-size:clamp(1.9rem,3.6vw,3rem);max-width:20ch;margin:0 auto}
.cta-in p{margin:22px auto 0;max-width:60ch;color:var(--muted);font-size:clamp(1.04rem,1.3vw,1.16rem);line-height:1.78}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:34px}

/* ── Footer ────────────────────────────────────────────────────────────── */
.site-footer{background:var(--dark);color:var(--dark-muted);padding:clamp(48px,5.4vw,72px) 0 clamp(34px,3.6vw,46px)}
.foot-top{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:clamp(28px,3.6vw,52px)}
@media (max-width:820px){.foot-top{grid-template-columns:1fr;gap:32px}}
.foot-brand{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.foot-brand img{width:38px;height:38px}
.foot-brand b{display:block;font-size:1.04rem;color:#fff;letter-spacing:-.02em}
.foot-brand span{font-size:.82rem;color:var(--dark-muted)}
.foot-desc{font-size:.92rem;line-height:1.75;max-width:42ch;color:var(--dark-muted)}
.foot-col h4{font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.foot-col a{display:block;font-size:.92rem;color:var(--dark-muted);padding:6px 0;transition:color .22s var(--ease)}
.foot-col a:hover{color:#fff;text-decoration:none}
.foot-bottom{margin-top:clamp(36px,4vw,52px);padding-top:26px;border-top:1px solid var(--dark-line);
  display:flex;flex-wrap:wrap;gap:12px 26px;justify-content:space-between;font-size:.84rem}

/* ── Motion ────────────────────────────────────────────────────────────── */
.reveal{opacity:0;transform:translate3d(0,20px,0)}
.js .reveal{transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.reveal.is-in{opacity:1;transform:none}
html:not(.js) .reveal{opacity:1;transform:none}
.js .stagger > *{opacity:0;transform:translate3d(0,16px,0);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
.stagger.is-in > *{opacity:1;transform:none}
.stagger.is-in > *:nth-child(1){transition-delay:0ms}
.stagger.is-in > *:nth-child(2){transition-delay:70ms}
.stagger.is-in > *:nth-child(3){transition-delay:140ms}
.stagger.is-in > *:nth-child(4){transition-delay:210ms}
.stagger.is-in > *:nth-child(5){transition-delay:280ms}
.stagger.is-in > *:nth-child(6){transition-delay:350ms}
html:not(.js) .stagger > *{opacity:1;transform:none}

/* Hero entrance */
.js .hero-anim{opacity:0;transform:translate3d(0,22px,0)}
.hero-anim.is-in{opacity:1;transform:none;transition:opacity .75s var(--ease-out),transform .75s var(--ease-out)}
.hero-anim.d1.is-in{transition-delay:80ms}
.hero-anim.d2.is-in{transition-delay:160ms}
.hero-anim.d3.is-in{transition-delay:240ms}
.hero-anim.d4.is-in{transition-delay:320ms}
.js .hero-stage{opacity:0;transform:translate3d(28px,0,0) scale(.97)}
.hero-stage.is-in{opacity:1;transform:none;transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);transition-delay:180ms}
html:not(.js) .hero-anim,html:not(.js) .hero-stage{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;transition-delay:0ms !important}
  .reveal,.stagger > *,.hero-anim,.hero-stage{opacity:1 !important;transform:none !important}
  .flow-line i{transform:scaleX(1) !important}
}

/* ── Print: a compact, branded corporate document (~10 pages) ──────────── */
.print-canvas,.print-brand,.print-cover,.print-watermark,.print-rule{display:none}
@page{size:A4 landscape;margin:14mm 14mm 12mm}
@media print{
  html{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{background:#fff !important;color:#111 !important;font-size:9.4pt;line-height:1.42}
  body{orphans:3;widows:3}

  /* Clean white corporate paper. Branding stays in the rule, masthead and
     footer so body text and photography remain the visual focus. */
  .print-canvas,.print-watermark{display:none !important}
  /* Brand accent hairline across the head of every page */
  .print-rule{display:block !important;position:fixed;top:0;left:0;right:0;height:2.2mm;z-index:2;
    background:linear-gradient(90deg,#4C1D95,#7C3AED 45%,#9061F9 70%,#22B8CF)}
  main,.site-footer,.print-brand,.print-cover{position:relative;z-index:1}
  main{background:#fff !important}

  /* Running header with the LaneX mark on every page */
  /* Chrome anchors repeating fixed blocks to the page foot — so this is the
     running footer, and the cover carries the masthead. */
  .print-brand{display:flex !important;position:fixed;bottom:0;left:0;right:0;align-items:center;gap:7px;
    height:8mm;background:transparent;border-top:.75pt solid #D7CDEE;padding-top:2mm;z-index:3}
  .print-cover{display:flex !important;align-items:center;gap:10px;margin-bottom:7mm;
    padding-bottom:4mm;border-bottom:.5pt solid #E2DCF2}
  .hero .print-cover{margin-top:4mm;margin-bottom:5mm}
  .print-cover img{width:26px;height:26px}
  .print-cover b{display:block;font-size:12pt;color:#0F1020;letter-spacing:-.02em;line-height:1.2}
  .print-cover > span > span{font-size:8pt;color:#6E7288;letter-spacing:.1em;text-transform:uppercase}
  .print-brand img{width:16px;height:16px}
  .print-brand .pb-name{font-size:8pt;font-weight:700;color:#0F1020;letter-spacing:-.01em}
  .print-brand .pb-name span{font-weight:500;color:#6E7288;margin-left:6px}
  .print-brand .pb-url{margin-left:auto;font-size:7.5pt;color:#6E7288}

  .nav,.nav-panel,.btn,.btn-print,.langswitch,.skip-link,.hero-bg,.sat,.cta-actions,
  .impact-map,.flow-line,.dk-glow,.tx-phone,.artchip,.artplate-scrim,.b-art,.mini,.mini-map{display:none !important}

  .section{padding-block:0 !important;padding-top:4mm}
  main > .section:first-of-type{padding-top:0}
  /* Every numbered chapter opens a page, so no heading is ever stranded. */
  #overview,#company,#roles,#transaction,#trust,#capabilities,#technology,#impact,#platform,#contact,.cta{
    break-before:page;page-break-before:always}
  .container{max-width:none;padding-inline:0}

  h1{font-size:21pt !important;line-height:1.12 !important}
  h2{font-size:14pt !important;line-height:1.18 !important;break-after:avoid}
  h3{font-size:10pt !important;break-after:avoid}
  .lede{font-size:9.6pt !important;color:#333 !important;margin-top:10px}
  p,li{color:#333 !important}
  .sec-head{margin-bottom:5mm;break-after:avoid;page-break-after:avoid}
  /* Keep chapters 06-10 as five self-contained sheets. Targeting each inner
     container is more dependable across Chromium and Safari print engines. */
  #capabilities,#technology,#impact,#platform,#contact,
  #capabilities>.container,#technology>.container,#impact>.container,#platform>.container,#contact>.container{
    break-inside:avoid-page !important;page-break-inside:avoid !important}
  .cta,.cta>.container{break-inside:avoid-page !important;page-break-inside:avoid !important}
  #capabilities>.container,#technology>.container,#impact>.container,#platform>.container,#contact>.container{
    display:block !important}
  .chapter,h2{break-after:avoid;page-break-after:avoid}
  .chapter{color:#4C1D95 !important;margin-bottom:2.8mm;font-size:7.5pt;gap:2.2mm;
    padding:1.4mm 3mm 1.4mm 1.5mm;border:.75pt solid #CFC0EE;border-radius:99mm;
    background:rgba(255,255,255,.76) !important}
  .chapter i{display:inline-grid;place-items:center;width:7mm;height:7mm;border-radius:50%;
    color:#fff !important;background:#6D28D9 !important;font-size:7pt;letter-spacing:0}
  .chapter::after{display:none !important}
  .tstat{font-size:14pt !important;max-width:none}

  /* Every surface prints flat; nothing splits across a page boundary */
  .card,.b,.role,.tcard,.snapshot,.custody,.ccard,.callout,.office-media,.principles article,
  .tech article,.artplate,.founder-photo,.tcell{
    box-shadow:0 .6pt 1.6pt rgba(76,29,149,.07) !important;background:#fff !important;
    border:.5pt solid #DED7EF !important;
    backdrop-filter:none !important;transform:none !important;break-inside:avoid;padding:3.5mm !important}
  .card,.b,.role,.tcard,.principles article,.tech article{border-radius:3mm !important}

  /* Grid groups stay whole so cards never get sliced */
  .cardgrid,.roles,.tech,.principles,.trust-grid,.custody-g,.team-grid,.flow,.caps,.impact,.bento,
  .founder,.office,.people,.contacts,.split,.split-a,.tx-grid{break-inside:avoid}

  .hero-grid{grid-template-columns:.88fr 1.12fr !important;gap:9mm !important}
  .split,.split-a,.tx-grid{grid-template-columns:1fr 1fr !important;gap:7mm !important}
  .caps{grid-template-columns:1fr 1fr !important;gap:6mm !important}
  .cardgrid,.roles{grid-template-columns:repeat(4,1fr) !important;gap:3mm !important}
  .tech,.principles,.trust-grid{grid-template-columns:repeat(3,1fr) !important;gap:3mm !important}
  .bento{grid-template-columns:repeat(3,1fr) !important;gap:3mm !important}
  .b-lg,.b-md,.b-sm,.b-wide{grid-column:span 1 !important;grid-row:auto !important}
  .flow-steps{grid-template-columns:repeat(5,1fr) !important;gap:3mm !important}
  .fstep{display:block !important;break-inside:avoid}
  .fstep .num{width:9mm;height:9mm;margin-bottom:2mm;border-radius:2.5mm}
  .fstep .num svg{width:4.5mm;height:4.5mm}
  .custody-g{grid-template-columns:repeat(2,1fr) !important}
  .custody-g > div:nth-child(odd){border-left:0}
  .custody-g > div:nth-child(n+3){border-top:.5pt solid #EEE9F8}
  .custody-g > div{padding:3.5mm !important;border-left:.5pt solid #EEE9F8}
  .impact{grid-template-columns:1fr 1fr !important}
  .team-grid{grid-template-columns:repeat(4,1fr) !important;gap:2.5mm !important}
  .capgroup li{padding:2mm 0}
  .snapshot dt{padding-top:2.5mm}.snapshot dd{padding-bottom:2.5mm}
  .snapshot dl{padding:0 4mm 3mm}.snapshot header{padding:3mm 4mm}

  /* Predictable chapter rhythm for 06-10. It is deliberately compact enough
     for the longer Lao translation without detaching a heading from its body. */
  #capabilities .sec-head,#technology .sec-head,#impact .sec-head,#platform .sec-head,#contact .sec-head{
    margin-bottom:3.5mm}
  #capabilities h2,#technology h2,#impact h2,#platform h2,#contact h2{font-size:15pt !important}
  #capabilities .lede,#technology .lede,#impact .lede,#platform .lede,#contact .lede{
    margin-top:2.5mm;font-size:8.7pt !important;line-height:1.45 !important}
  #capabilities .caps{gap:4.5mm !important}
  #capabilities .capgroup h3{margin-bottom:0;padding-bottom:2mm}
  #capabilities .capgroup li{padding:1.4mm 0;font-size:7.8pt;line-height:1.38}
  #capabilities .capgroup li b{font-size:8.2pt;margin-bottom:.5mm}
  #technology .tech{gap:2.7mm !important}
  #technology .tech article{padding:3mm !important}
  #technology .tech article p{font-size:7.9pt;line-height:1.42}
  #impact .impact li{padding:2.4mm 0}
  #impact .impact h3{font-size:9pt !important;margin-bottom:1mm}
  #impact .impact p{font-size:8pt;line-height:1.42}
  #platform .bento{gap:2.7mm !important}
  #platform .b{padding:3mm !important}
  #platform .b p{font-size:7.9pt;line-height:1.42}
  #contact .split{gap:4.5mm !important}
  #contact .snapshot dl{padding-bottom:2mm}
  #contact .snapshot dt{padding-top:1.5mm;font-size:6.7pt}
  #contact .snapshot dd{padding-bottom:1.5mm;font-size:7.8pt}
  #contact .contacts{gap:2mm}
  #contact .ccard{padding:2.4mm !important}
  #contact .ccard b{font-size:7.8pt}
  #contact .ccard span span{font-size:7.1pt}
  html[lang="lo"] #capabilities,html[lang="lo"] #technology,html[lang="lo"] #impact,
  html[lang="lo"] #platform,html[lang="lo"] #contact{font-size:8pt;line-height:1.5}
  html[lang="lo"] #capabilities p,html[lang="lo"] #capabilities li,
  html[lang="lo"] #technology p,html[lang="lo"] #impact p,
  html[lang="lo"] #platform p,html[lang="lo"] #contact p{line-height:1.55 !important}

  .artplate img{aspect-ratio:16/9;max-height:92mm}
  .office-media img{max-height:92mm}
  .founder-photo{width:52mm;padding:0 !important;justify-self:center}
  .founder-photo img{width:52mm;height:65mm;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:center center}
  .tcell img{aspect-ratio:3/4;max-height:33mm;object-position:center 18%}
  .team-grid{grid-template-columns:repeat(4,1fr) !important;gap:2.5mm !important}
  .founder{grid-template-columns:52mm minmax(0,1fr) !important;gap:7mm !important;align-items:center}
  .founder-english{font-size:9pt}.founder-bio{font-size:8.6pt}
  #company .people{break-before:page;page-break-before:always;padding-top:4mm}
  #company .principles{margin-top:4mm !important;gap:2.5mm !important}
  #company .principles article{padding:2.6mm !important}
  #company .principles .pnum{font-size:6.5pt;margin-bottom:1mm}
  #company .principles p{font-size:7.5pt;line-height:1.42}

  #overview .split{display:block !important;break-inside:auto !important;page-break-inside:auto !important}
  #overview .prose{columns:2;column-gap:8mm;margin-top:4mm}
  #overview .prose p{font-size:8.2pt !important;line-height:1.48 !important}
  #overview .prose p{break-inside:avoid-column}
  #overview .prose p+p{margin-top:0;margin-bottom:3mm}
  #overview .cardgrid{margin-top:5mm;gap:3mm !important}
  #overview .card{padding:3mm !important}
  #overview .card .ic{width:9mm;height:9mm;margin-bottom:2mm}
  #overview .card .ic svg{width:4.5mm;height:4.5mm}
  #overview .card h3{font-size:8.8pt !important;margin-bottom:1.2mm}
  #overview .card p{font-size:7.6pt;line-height:1.42}

  /* Safari cannot reliably paginate a tall CSS grid. Keep the complete People
     chapter inside one printable sheet so the next page rule never cuts it. */
  #roles .sec-head{margin-bottom:3mm}
  #roles .lede{margin-top:2mm;font-size:8.4pt !important;line-height:1.4 !important}
  #roles .roles{gap:2.5mm !important;align-items:stretch}
  #roles .role{padding:3mm !important;min-height:0}
  #roles .role .ic{width:9mm;height:9mm;border-radius:2.5mm;margin-bottom:2.2mm}
  #roles .role .ic svg{width:4.5mm;height:4.5mm}
  #roles .role h3{font-size:9pt !important;line-height:1.28}
  #roles .role .native{font-size:7.4pt;line-height:1.35;margin-top:.8mm}
  #roles .role p{font-size:7.7pt;line-height:1.46 !important;margin-top:2.2mm}
  #roles .role .wf{gap:1.2mm;padding-top:2.5mm}
  #roles .role .wf span{font-size:6.6pt;line-height:1.2;padding:1.1mm 2mm}

  /* The dark chapter prints as light stock */
  .band-lav,.band-white,.cta{background:transparent !important}
  .band-dark{background:transparent !important;color:#111 !important}
  .band-dark h1,.band-dark h2,.band-dark h3{color:#111 !important}
  .band-dark .lede,.band-dark p,.tcard p,.tnote{color:#333 !important}
  .band-dark .chapter{color:#5B21B6 !important}
  .tcard .ic{background:#F3EDFF !important}
  .tcard .ic svg{color:#4C1D95 !important}

  .cta-in img{width:34px;height:34px;margin-bottom:4mm}
  .cta .cta-in{padding-top:5mm}
  .cta-in h2{max-width:none}
  .site-footer{display:none !important}
  .foot-col{display:none !important}
  .foot-top{grid-template-columns:1fr !important}
  .foot-brand b,.foot-bottom{color:#111 !important}
  .foot-bottom{margin-top:4mm;padding-top:3mm;font-size:7.5pt}
  a{color:#4C1D95 !important;text-decoration:none}
  .ccard .arw{display:none}
  .reveal,.stagger > *,.hero-anim,.hero-stage{opacity:1 !important;transform:none !important}
}
