@font-face{font-family:"Inter";src:url("../fonts/inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
color-scheme:dark;
--bg:#0A0A0B;--bg-2:#0F0F11;--surface:#141416;--surface-2:#1B1B1E;--hover:#1F1F23;
--ink:#F4F4F2;--ink-2:#D3D3D0;--mute:#9C9CA3;--faint:#8A8A92;--line:#232327;--line-2:#34343A;
--accent:#3DD68C;--accent-ink:#06140D;--accent-soft:rgba(61,214,140,.12);
--blue:#6AAEFF;--dark:#0F0F11;--on-dark:#F4F4F2;--on-dark-2:#9C9CA3;--dark-line:#232327;
--c-web:#5AA2FF;--c-srv:#3DD68C;--c-sec:#F5B83D;--c-err:#FF6B5E;
--svc:var(--accent);
--mono:ui-monospace,"SF Mono","JetBrains Mono","Cascadia Mono",Consolas,"Liberation Mono",monospace;
--r-sm:12px;--r:20px;--r-lg:28px;--pill:999px;
--w:1200px;--w-narrow:760px;--gut:clamp(20px,4vw,40px);
--ease:cubic-bezier(.2,.7,.2,1);
--fs-hero:clamp(2.6rem,6vw,5.25rem);--fs-h2:clamp(2rem,3.8vw,3.25rem);--fs-h3:clamp(1.3rem,1.8vw,1.6rem);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 "Inter",system-ui,-apple-system,"Segoe UI",sans-serif;font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:500;letter-spacing:-.028em;line-height:1.08;text-wrap:balance}
h1{font-size:var(--fs-hero);letter-spacing:-.04em;line-height:1.02}
h2{font-size:var(--fs-h2);letter-spacing:-.035em}
h3{font-size:var(--fs-h3);line-height:1.2}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--pill);text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:calc(var(--w) + 2*var(--gut));margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:calc(var(--w-narrow) + 2*var(--gut))}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mute{color:var(--mute)}
.lead{font-size:clamp(1.125rem,1.4vw,1.3rem);line-height:1.55;color:var(--mute);max-width:40ch}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.875rem;color:var(--mute);margin-bottom:22px}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink)}
.dark .eyebrow{color:var(--on-dark-2)}.dark .eyebrow::before{background:var(--on-dark)}
.tlink{color:var(--blue);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.tlink:hover{text-decoration-thickness:2px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:var(--pill);font:500 .975rem/1 "Inter",sans-serif;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),transform .2s var(--ease);white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn-p{background:var(--ink);color:var(--bg)}
.btn-p:hover{background:#FFFFFF}
.btn-s{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-s:hover{border-color:#5A5A62;background:var(--surface)}
.btn-sm{min-height:40px;padding:0 18px;font-size:.9rem}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.hd{position:sticky;top:0;z-index:50;background:rgba(10,10,11,.78);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:border-color .25s var(--ease)}
.hd.is-scrolled,.menu-open .hd{border-bottom-color:var(--line)}
.hd-in{display:flex;align-items:center;gap:32px;height:72px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:1.06rem;letter-spacing:-.02em;flex:none}
.logo svg{width:26px;height:26px;flex:none}
.logo b{font-weight:600}.logo span{color:var(--mute);font-weight:400}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav>a,.nav-item>button{font:400 .95rem/1 "Inter",sans-serif;color:var(--mute);text-decoration:none;padding:10px 14px;border-radius:var(--pill);background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s var(--ease)}
.nav>a:hover,.nav-item>button:hover,.nav-item>button[aria-expanded=true]{background:var(--hover);color:var(--ink)}
.nav a[aria-current=page],.nav-item>button.is-current{color:var(--ink);font-weight:500}
.chev{width:10px;height:10px;transition:transform .25s var(--ease)}
[aria-expanded=true] .chev{transform:rotate(180deg)}
.hd-cta{margin-left:12px}
.nav-item{position:static}
.mega{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);visibility:hidden;opacity:0;transform:translateY(-6px);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s .22s;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.mega.is-open{visibility:visible;opacity:1;transform:none;transition:opacity .22s var(--ease),transform .22s var(--ease)}
.mega-in{display:grid;grid-template-columns:repeat(3,1fr) 1.1fr;gap:40px;padding-top:36px;padding-bottom:40px}
.mega h3{font-size:.8rem;font-weight:500;letter-spacing:0;color:var(--mute);margin-bottom:14px}
.mega h3 a{text-decoration:none}.mega h3 a:hover{color:var(--ink)}
.mega ul{list-style:none;display:grid;gap:2px}
.mega li a{display:block;text-decoration:none;padding:8px 0;font-size:.98rem;transition:color .15s,transform .2s var(--ease)}
.mega li a small{display:block;color:var(--mute);font-size:.85rem;margin-top:2px}
.mega li a:hover{transform:translateX(3px)}
.mega-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.mega-box p{color:var(--mute);font-size:.95rem}
.mega-box strong{font-weight:500;font-size:1.05rem}
.menu-btn{display:none;margin-left:auto;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--pill);min-height:42px;padding:0 16px;font:500 .9rem/1 "Inter",sans-serif;cursor:pointer;color:var(--ink)}
.menu-btn i{width:14px;height:8px;position:relative;display:block}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .25s var(--ease),top .25s var(--ease)}
.menu-btn i::before{top:0}.menu-btn i::after{top:6.5px}
.menu-open .menu-btn i::before{top:3.25px;transform:rotate(45deg)}.menu-open .menu-btn i::after{top:3.25px;transform:rotate(-45deg)}
.drawer{position:fixed;inset:72px 0 0;z-index:49;background:var(--bg);overflow:auto;padding:12px var(--gut) 40px;visibility:hidden;opacity:0;transition:opacity .25s var(--ease),visibility 0s .25s}
.menu-open .drawer{visibility:visible;opacity:1;transition:opacity .25s var(--ease)}
.menu-open body{overflow:hidden}
.drawer a,.drawer summary{display:flex;justify-content:space-between;align-items:center;padding:16px 0;font-size:1.3rem;letter-spacing:-.02em;text-decoration:none;border-bottom:1px solid var(--line);cursor:pointer;list-style:none}
.drawer summary::-webkit-details-marker{display:none}
.drawer details[open] summary .chev{transform:rotate(180deg)}
.drawer details ul{list-style:none;padding:4px 0 12px 0}
.drawer details li a{font-size:1.05rem;border:0;padding:10px 0;color:var(--ink-2)}
.drawer .btns{margin-top:28px}.drawer .btns .btn{flex:1;font-size:1rem;padding:0 20px;display:flex;border:1px solid transparent}
.drawer .btns .btn-s{border-color:var(--line-2)}
@media (max-width:1079px){.nav,.hd-cta{display:none}.menu-btn{display:inline-flex}}
@media (min-width:1080px){.drawer{display:none}}
.sec{padding:clamp(80px,11vw,152px) 0}
.sec-t{padding-top:0}
.sec-head{display:grid;gap:20px;margin-bottom:clamp(40px,6vw,72px);max-width:760px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center;justify-items:center}
.sec-head p{color:var(--mute);font-size:1.15rem;max-width:56ch}
.hr{border:0;border-top:1px solid var(--line);margin:0}
.dark{background:var(--dark);color:var(--on-dark)}
.dark .mute,.dark .sec-head p{color:var(--on-dark-2)}
.hero{padding:clamp(88px,13vw,176px) 0 clamp(72px,9vw,120px);text-align:center}
.hero h1{max-width:15ch;margin:0 auto}
.hero .lead{margin:28px auto 0;max-width:46ch}
.hero .btns{justify-content:center;margin-top:40px}
.facts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px;margin-top:40px;list-style:none;color:var(--mute);font-size:.92rem}
.facts li{display:flex;align-items:center;gap:8px}
.facts li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--line-2)}
.ask{max-width:720px;margin:clamp(56px,7vw,88px) auto 0;text-align:left}
.ask-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 20px 16px 24px;box-shadow:0 0 0 1px rgba(255,255,255,.02),0 20px 50px -30px rgba(0,0,0,.9);transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.ask-box:focus-within{border-color:#45454D;box-shadow:0 0 0 4px rgba(255,255,255,.04),0 20px 50px -30px rgba(0,0,0,.9)}
.ask label{display:block;font-size:.85rem;color:var(--mute);margin-bottom:6px}
.ask textarea{width:100%;border:0;resize:none;font:400 1.1rem/1.5 "Inter",sans-serif;color:var(--ink);background:transparent;min-height:56px;padding:0}
.ask textarea:focus{outline:none}
.ask textarea::placeholder{color:var(--faint)}
.ask-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:400 .88rem/1 "Inter",sans-serif;padding:9px 14px;border-radius:var(--pill);border:1px solid var(--line);background:var(--bg);color:var(--ink-2);cursor:pointer;transition:border-color .2s,background .2s}
.chip:hover{border-color:var(--line-2)}
.chip[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.ask-note{font-size:.82rem;color:var(--mute);margin-top:12px;text-align:center}
.rows{border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:72px 1.1fr 1.4fr auto;gap:32px;align-items:start;padding:40px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .3s var(--ease)}
.row .n{font-size:.9rem;color:var(--mute);padding-top:8px;font-variant-numeric:tabular-nums}
.row h3{font-size:clamp(1.6rem,2.6vw,2.25rem);letter-spacing:-.03em}
.row p{color:var(--mute)}
.row .go{padding-top:6px;font-size:.95rem;white-space:nowrap;border-bottom:1px solid var(--line-2);transition:border-color .2s}
a.row:hover .go{border-color:var(--ink)}
a.row:hover h3{transform:translateX(4px)}
.row h3{transition:transform .3s var(--ease)}
.row ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.row li{font-size:.85rem;padding:6px 12px;border:1px solid var(--line);border-radius:var(--pill);color:var(--ink-2);background:var(--surface)}
.checks{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--dark-line)}
.checks li{padding:28px 0;border-bottom:1px solid var(--dark-line);display:grid;gap:6px}
.checks li:nth-child(odd){padding-right:40px}
.checks li:nth-child(even){padding-left:40px;border-left:1px solid var(--dark-line)}
.checks strong{font-weight:500;font-size:1.15rem;letter-spacing:-.01em}
.checks span{color:var(--on-dark-2);font-size:.98rem}
.light .checks{border-color:var(--line)}.light .checks li{border-color:var(--line)}.light .checks span{color:var(--mute)}
.split{display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,6vw,96px);align-items:start}
.split .sec-head{margin-bottom:0;position:sticky;top:120px}
.proj-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3vw,40px) clamp(20px,2.5vw,32px)}
.proj{text-decoration:none;display:grid;gap:18px}
.proj figure{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--surface);aspect-ratio:16/9}
.proj img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s var(--ease)}
.proj:hover img{transform:scale(1.025)}
.proj-m{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.proj h3{font-size:1.25rem;letter-spacing:-.02em}
.proj .mute{font-size:.92rem}
.proj p.desc{color:var(--mute);font-size:.98rem;max-width:52ch;margin-top:-8px}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s;border-top:1px solid var(--line)}
.steps li{padding:32px 28px 0 0;position:relative}
.steps li+li{padding-left:28px;border-left:1px solid var(--line)}
.steps .n{display:block;font-size:.85rem;color:var(--mute);margin-bottom:40px;font-variant-numeric:tabular-nums}
.steps h3{font-size:1.25rem;margin-bottom:10px}
.steps p{color:var(--mute);font-size:.98rem}
.steps li::before{content:"";position:absolute;top:-1px;left:0;height:1px;width:0;background:var(--ink);transition:width .9s var(--ease)}
.steps li.in::before{width:100%}
.steps.five{grid-template-columns:repeat(5,1fr)}
.ptease{list-style:none;border-top:1px solid var(--line)}
.ptease li{display:grid;grid-template-columns:1fr 1.6fr 200px;gap:24px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--line)}
.ptease h3{font-size:1.4rem}
.ptease .price{font-size:1.4rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums;text-align:right}
.ptease p{color:var(--mute)}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:36px 32px 28px;display:flex;flex-direction:column;gap:24px}
.plan.is-key{border-color:rgba(61,214,140,.55);box-shadow:0 0 0 1px rgba(61,214,140,.3)}
.plan-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.plan-h h2,.plan-h h3{font-size:1.5rem;letter-spacing:-.02em}
.badge{font-size:.78rem;padding:6px 12px;border-radius:var(--pill);border:1px solid rgba(61,214,140,.35);color:var(--accent);background:var(--accent-soft)}
.plan .amount{font-size:clamp(1.9rem,2.4vw,2.5rem);white-space:nowrap;letter-spacing:-.04em;line-height:1;font-weight:500;font-variant-numeric:tabular-nums}
.plan .amount small{display:block;white-space:normal;font-size:.9rem;letter-spacing:0;color:var(--mute);font-weight:400;margin-top:10px}
.plan>p{color:var(--mute)}
.plan .btn{width:100%}
.ticks{list-style:none;display:grid;gap:12px;font-size:.98rem}
.ticks li{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start}
.ticks li::before{content:"";width:14px;height:8px;border-left:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(-45deg) translate(1px,6px)}
.ticks li.no{color:var(--mute)}
.ticks li.no::before{border:0;height:1.5px;width:10px;background:var(--line-2);transform:translate(2px,11px)}
.dark .ticks li::before{border-color:var(--on-dark)}
.acc{border-bottom:1px solid var(--line)}
.acc summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;cursor:pointer;list-style:none;font-size:1.15rem;letter-spacing:-.01em;font-weight:500}
.acc summary::-webkit-details-marker{display:none}
.acc summary .pm{flex:none;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;position:relative;transition:transform .3s var(--ease),background .2s}
.acc summary .pm::before,.acc summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:var(--ink);transform:translate(-50%,-50%)}
.acc summary .pm::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s var(--ease)}
.acc[open] summary .pm::after{transform:translate(-50%,-50%) rotate(0)}
.acc summary:hover .pm{background:var(--surface)}
.acc-b{overflow:hidden}
.acc-b>div{padding:0 56px 28px 0;color:var(--mute);display:grid;gap:12px}
.accs{border-top:1px solid var(--line)}
.plan .acc{border-bottom:0;border-top:1px solid var(--line)}
.plan .acc summary{font-size:.98rem;padding:18px 0 4px}
.plan .acc summary .pm{width:28px;height:28px}
.plan .acc-b>div{padding:12px 0 4px}
.bar{margin-top:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:0 28px}
.bar.acc summary{padding:22px 0}
.bar .acc-b>div{padding:0 0 28px}
.bar .cols{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 48px}
.bar h4{font-weight:500;font-size:1rem;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.phero{padding:clamp(72px,10vw,136px) 0 clamp(56px,7vw,96px)}
.phero h1{font-size:clamp(2.5rem,5.4vw,4.5rem);max-width:16ch}
.phero .lead{margin-top:24px;max-width:52ch}
.phero .btns{margin-top:36px}
.crumb{font-size:.88rem;color:var(--mute);margin-bottom:28px;display:flex;gap:8px}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--ink)}
.simple{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:200px 1fr;gap:32px}
.simple h2{font-size:1rem;letter-spacing:0;color:var(--mute);font-weight:400}
.simple p{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.45;letter-spacing:-.02em}
.topics{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}
.topic{padding:36px 0;border-bottom:1px solid var(--line);display:grid;gap:10px;scroll-margin-top:110px}
.topic:nth-child(odd){padding-right:48px}
.topic:nth-child(even){padding-left:48px;border-left:1px solid var(--line)}
.topic h3{font-size:1.35rem}
.topic p{color:var(--mute)}
.cta{text-align:center;padding:clamp(88px,12vw,160px) 0}
.cta h2{max-width:18ch;margin:0 auto}
.cta p{color:var(--mute);margin:20px auto 0;max-width:46ch;font-size:1.15rem}
.cta .btns{justify-content:center;margin-top:36px}
.big-statement{font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.25;letter-spacing:-.03em;max-width:28ch;font-weight:400}
.big-statement .mute{color:var(--mute)}
.kv{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.kv div{border-top:1px solid var(--line);padding-top:20px;display:grid;gap:8px}
.kv strong{font-weight:500;font-size:1.1rem}
.kv span{color:var(--mute);font-size:.98rem}
.pfull{display:grid;grid-template-columns:7fr 5fr;gap:clamp(28px,5vw,72px);align-items:center;padding:clamp(48px,6vw,80px) 0;border-top:1px solid var(--line)}
.pfull figure{margin:0;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:var(--surface)}
.pfull img{width:100%;height:100%;object-fit:cover;object-position:top}
.pfull h2{font-size:clamp(1.8rem,3vw,2.5rem);margin:6px 0 16px}
.pfull p{color:var(--mute)}
.pfull dl{display:grid;grid-template-columns:auto 1fr;gap:8px 24px;margin:24px 0 0;font-size:.95rem}
.pfull dt{color:var(--mute)}.pfull dd{margin:0}
.contact{display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,6vw,96px);align-items:start}
.ways{list-style:none;border-top:1px solid var(--line);margin-top:40px}
.ways li{border-bottom:1px solid var(--line)}
.ways a{display:grid;gap:4px;padding:20px 0;text-decoration:none}
.ways a span{font-size:.85rem;color:var(--mute)}
.ways a strong{font-weight:500;font-size:1.1rem;letter-spacing:-.01em;transition:transform .25s var(--ease)}
.ways a:hover strong{transform:translateX(3px)}
.form{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,4vw,44px);display:grid;gap:20px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:grid;gap:8px}
.field label{font-size:.92rem;font-weight:500}
.field label .opt{color:var(--mute);font-weight:400}
.field input,.field select,.field textarea{width:100%;font:400 1rem/1.4 "Inter",sans-serif;color:var(--ink);background:var(--bg-2);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:13px 14px;transition:border-color .2s,box-shadow .2s,background .2s;appearance:none}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%239C9CA3' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}
.field textarea{min-height:150px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#4A4A52}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(61,214,140,.18);background:var(--surface-2)}
.field [aria-invalid=true]{border-color:var(--c-err)}
.err{color:var(--c-err);font-size:.85rem}
.form .note{font-size:.85rem;color:var(--mute)}
.form-ok{border:1px solid var(--line);border-radius:var(--r);padding:20px;background:var(--bg)}
.form-ok strong{font-weight:500;display:block;margin-bottom:4px}
.form.is-sent .fbody{display:none}
.legal{max-width:760px}
.legal h2{font-size:1.35rem;letter-spacing:-.02em;margin:44px 0 12px}
.legal h2:first-child{margin-top:0}
.legal h3{font-size:1.1rem;margin:28px 0 8px}
.legal p,.legal ul,.legal address{color:var(--ink-2);margin:0 0 14px;font-style:normal}
.legal ul{padding-left:20px}
.legal a{color:var(--blue);text-underline-offset:3px}
.legal-tabs{display:flex;gap:8px;margin-bottom:40px}
.legal-grid{
display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;
margin:0 0 clamp(40px,6vw,64px);max-width:760px
}
.legal-card{
padding:28px 26px;border:1px solid #262626;border-radius:20px;background:#0e0e0e
}
.legal-card .eyebrow{margin:0 0 10px}
.legal-card h2{margin:0 0 16px;font-size:1.35rem;letter-spacing:-.03em;font-weight:500}
.legal-card address{
margin:0;font-style:normal;color:var(--mute);line-height:1.65;font-size:.98rem
}
.legal-card address strong{display:block;color:#fff;font-weight:500;margin-bottom:4px}
.legal-contact{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.legal-contact li{display:grid;gap:4px}
.legal-contact span{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:#777}
.legal-contact a{color:#fff;text-decoration:none;font-size:.98rem}
.legal-contact a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:699px){.legal-grid{grid-template-columns:1fr}}
.ft{border-top:1px solid var(--line);padding:56px 0 32px;font-size:.9rem}
.ft-top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.ft p{color:var(--mute);max-width:32ch;margin-top:14px}
.ft h2{font-size:.85rem;font-weight:500;letter-spacing:0;margin-bottom:14px}
.ft ul{list-style:none;display:grid;gap:10px}
.ft ul a{color:var(--mute);text-decoration:none;transition:color .15s}
.ft ul a:hover{color:var(--ink)}
.ft-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);color:var(--mute);font-size:.82rem}
.ft-bot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.ft-bot a{color:var(--mute);text-decoration:none}.ft-bot a:hover{color:var(--ink)}
.nf{min-height:60vh;display:grid;place-items:center;text-align:center;padding:120px 0}
.nf .lead{margin:20px auto 0}.nf .btns{justify-content:center;margin-top:32px}
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}
.hero .rv{transition-duration:1s}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;transition-delay:0s!important}.js .rv{opacity:1;transform:none}.steps li::before{width:100%}}
@media (max-width:1079px){
.row{grid-template-columns:48px 1fr;gap:12px 20px}
.row>div:nth-of-type(2),.row .go{grid-column:2}
.plans{grid-template-columns:1fr;max-width:620px;margin:0 auto}
.steps,.steps.five{grid-template-columns:repeat(2,1fr)}
.steps li,.steps li+li{padding:28px 24px 32px 0;border-left:0}
.steps li:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}
.steps li{border-bottom:1px solid var(--line)}
.steps .n{margin-bottom:20px}
.split,.contact{grid-template-columns:1fr}
.split .sec-head{position:static}
.pfull{grid-template-columns:1fr}
.ft-top{grid-template-columns:1fr 1fr}
.ft-top>div:first-child{grid-column:1/-1}
.mega-in{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:719px){
body{font-size:1.0625rem}
.proj-grid,.topics,.checks,.kv,.bar .cols,.fgrid{grid-template-columns:1fr}
.topic:nth-child(n),.checks li:nth-child(n){padding-left:0;padding-right:0;border-left:0}
.steps,.steps.five{grid-template-columns:1fr}
.steps li:nth-child(n){padding:24px 0;border-left:0}
.ptease li{grid-template-columns:1fr auto;gap:6px 16px}
.ptease li p{grid-column:1/-1;grid-row:2}
.ptease .btn{display:none}
.simple{grid-template-columns:1fr;gap:12px}
.hero{text-align:left}.hero h1{margin:0}.hero .lead{margin-left:0}.hero .btns,.facts{justify-content:flex-start}
.facts{flex-direction:column;gap:8px}
.ask-note{text-align:left}
.btns .btn{flex:1 1 auto}
.acc-b>div{padding-right:0}
.ft-top{grid-template-columns:1fr 1fr}
.row{grid-template-columns:1fr}.row>div:nth-of-type(2),.row .go,.row .n{grid-column:1}.row .n{padding:0}
.plan{padding:28px 24px 22px}
.bar{padding:0 20px}
}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-fail{border:1px solid rgba(255,107,94,.4);border-radius:var(--r);padding:20px;background:rgba(255,107,94,.08);color:var(--ink)}
.form-fail strong{font-weight:500;display:block;margin-bottom:4px;color:var(--c-err)}
.btn:disabled{opacity:.6;cursor:progress}
.ft-cookie{font:inherit;color:var(--mute);background:none;border:0;padding:0;cursor:pointer}
.ft-cookie:hover{color:var(--ink)}
.ft-cookie:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.cookie{position:fixed;left:20px;bottom:20px;z-index:80;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:0 24px 60px -20px rgba(0,0,0,.85);opacity:0;transform:translateY(10px);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.cookie.on{opacity:1;transform:none}
.cookie h2{font-size:1.05rem;font-weight:500;letter-spacing:-.01em;margin:0 0 8px}
.cookie p{color:var(--mute);font-size:.9rem;line-height:1.55;margin:0}
.cookie-b{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.cookie-b .btn{width:100%}
@media (max-width:719px){.cookie{left:12px;right:12px;bottom:12px;max-width:none;padding:20px}}
::selection{background:rgba(61,214,140,.28);color:#fff}
html{background:var(--bg);scrollbar-color:#34343A var(--bg)}
.svc-web{--svc:var(--c-web);--svc-soft:rgba(90,162,255,.12);--svc-line:rgba(90,162,255,.32)}
.svc-srv{--svc:var(--c-srv);--svc-soft:rgba(61,214,140,.12);--svc-line:rgba(61,214,140,.32)}
.svc-sec{--svc:var(--c-sec);--svc-soft:rgba(245,184,61,.12);--svc-line:rgba(245,184,61,.32)}
.ico{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--svc-soft,var(--accent-soft));border:1px solid var(--svc-line,rgba(61,214,140,.3));color:var(--svc);flex:none;font-style:normal}
.ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ico-s{width:26px;height:26px;border-radius:8px}.ico-s svg{width:15px;height:15px}
.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.eyebrow::before{background:var(--svc);box-shadow:0 0 0 3px color-mix(in srgb,var(--svc) 22%,transparent)}
.dark .eyebrow::before{background:var(--svc)}
.eyebrow-svc{gap:18px}.eyebrow-svc::before{display:none}
.eyebrow-svc span{display:inline-flex;align-items:center;gap:8px}
.eyebrow-svc span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--svc);box-shadow:0 0 0 3px var(--svc-soft)}
.svc-tag{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--svc);padding:5px 14px 5px 5px;border:1px solid var(--svc-line);background:var(--svc-soft);border-radius:var(--pill);margin-bottom:26px}
.svc-tag .ico{border:0;background:transparent}
.crumb{font-family:var(--mono);font-size:.78rem;letter-spacing:.02em}
.row .n em,.steps .n,.ptease .price{font-variant-numeric:tabular-nums}
.tlink{color:var(--ink);text-decoration-color:var(--accent)}
.tlink:hover{color:var(--accent)}
.legal a{color:var(--accent)}
.legal p,.legal ul,.legal address{color:var(--ink-2)}
h1{color:#FAFAF8}
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;z-index:-1;left:50%;top:-38%;width:min(1200px,140vw);aspect-ratio:2/1;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,255,255,.07),rgba(255,255,255,.02) 55%,transparent 75%);pointer-events:none}
.hero::after{content:"";position:absolute;z-index:-1;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;opacity:.35;-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 30%,#000 10%,transparent 70%);mask-image:radial-gradient(ellipse 60% 55% at 50% 30%,#000 10%,transparent 70%);pointer-events:none}
.facts li::before{background:var(--accent)}
.ask-box{background:var(--surface)}
.chip{background:var(--bg-2);color:var(--ink-2);border-color:var(--line-2)}
.chip:hover{border-color:#4A4A52;color:var(--ink)}
.chip[data-v=Webseite]{--svc:var(--c-web)}.chip[data-v=Servermanagement]{--svc:var(--c-srv)}.chip[data-v=Sicherheit]{--svc:var(--c-sec)}
.chip{display:inline-flex;align-items:center;gap:8px}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--svc)}
.chip[aria-pressed=true]::before{background:var(--bg)}
.hd.is-scrolled,.menu-open .hd{border-bottom-color:var(--line)}
.nav a[aria-current=page],.nav-item>button.is-current{color:var(--ink)}
.mega{background:var(--bg-2)}
.mega h3{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase}
.mega h3 a{display:inline-flex;align-items:center;gap:10px;color:var(--ink)}
.mega h3 a:hover{color:var(--svc)}
.mega li a{color:var(--ink-2)}.mega li a:hover{color:var(--ink)}
.mega-in>div:not(.mega-box){border-left:1px solid var(--line);padding-left:24px}
.drawer li[class^=svc] a span{display:inline-flex;align-items:center;gap:12px}
.menu-btn{background:var(--surface)}
.dark{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hr{border-top-color:var(--line)}
.rows .row{position:relative}
.row .n{display:grid;gap:10px;justify-items:start;padding-top:0}
.row .n em{font-style:normal;font-family:var(--mono);font-size:.78rem;color:var(--faint)}
.row li{background:var(--bg-2);border-color:var(--line-2);color:var(--ink-2)}
.row .go{border-bottom-color:var(--svc-line,var(--line-2))}
a.row:hover .go{border-color:var(--svc)}
a.row:hover h3{color:#fff}
a.row::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:var(--svc);transition:width .6s var(--ease)}
a.row:hover::before{width:100%}
.checks{border-top-color:var(--line)}
.checks li{grid-template-columns:22px 1fr;column-gap:14px;border-color:var(--line)!important}
.checks li::before{content:"";grid-row:1/3;width:20px;height:20px;margin-top:2px;border-radius:6px;background:var(--svc-soft,var(--accent-soft)) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 6.2 2.3 2.3 4.7-5' fill='none' stroke='%23F4F4F2' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");box-shadow:inset 0 0 0 1px var(--svc-line,rgba(61,214,140,.3))}
.checks li:nth-child(even){border-left-color:var(--line)}
main.svc-web .checks li::before,main.svc-srv .checks li::before,main.svc-sec .checks li::before,.svc-sec .checks li::before{background-color:var(--svc-soft)}
.steps{border-top-color:var(--line)}
.steps li+li{border-left-color:var(--line)}
.steps li::before{background:var(--svc);height:2px;top:-1.5px}
.steps .n{font-family:var(--mono);color:var(--svc)}
.topic{border-color:var(--line)!important}
.topic h3{display:flex;align-items:center;gap:12px}
.topic h3::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--svc);flex:none}
.simple{background:var(--surface);border-color:var(--line)}
.simple h2{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.plan{background:var(--surface);border-color:var(--line)}
.ticks li::before{border-color:var(--accent)}
.ticks li.no::before{background:var(--line-2)}
.acc summary .pm{border-color:var(--line-2)}
.acc summary:hover .pm{background:var(--surface-2)}
.acc[open] summary .pm{border-color:var(--accent)}
.bar{background:var(--surface)}
.proj figure,.pfull figure{border-color:var(--line);box-shadow:0 30px 60px -40px rgba(0,0,0,.9)}
.proj:hover figure{border-color:var(--line-2)}
.proj .mute,.pfull .mute{font-family:var(--mono);font-size:.78rem;letter-spacing:.02em}
.kv div{border-top-color:var(--line)}
.kv div:nth-child(1){--svc:var(--c-web)}.kv div:nth-child(2){--svc:var(--c-srv)}.kv div:nth-child(3){--svc:var(--c-sec)}
.kv div{position:relative}.kv div::before{content:"";position:absolute;top:-1px;left:0;width:40px;height:2px;background:var(--svc)}
.form{background:var(--surface);border-color:var(--line)}
.form-ok{background:rgba(61,214,140,.08);border-color:rgba(61,214,140,.35)}
.form-ok strong{color:var(--accent)}
.field select option{background:var(--surface);color:var(--ink)}
.ways a:hover strong{color:#fff}
.ft{background:var(--bg);border-top-color:var(--line)}
.ft h2{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.ft-bot{border-top-color:var(--line)}
.cookie{background:var(--surface-2);border-color:var(--line-2)}
.cookie h2{color:var(--ink)}
.nf h1{color:#FAFAF8}
[hidden]{display:none!important}
:root{--bg:#09090A;--bg-2:#0E0E10;--surface:#121214;--surface-2:#19191C;--line:#222226;--line-2:#303036;--r:18px;--r-lg:24px;
--fs-hero:clamp(2.6rem,6.4vw,5.6rem);--fs-h2:clamp(2rem,3.6vw,3.1rem);--sp-1:8px;--sp-2:16px;--sp-3:24px;--sp-4:32px;--sp-5:48px;--sp-6:64px}
body{background:var(--bg)}
.sec{padding:clamp(88px,10vw,140px) 0}
.sec-t{padding-top:0}
.sec-head{gap:18px;margin-bottom:clamp(40px,5vw,64px)}
.sec-head h2{max-width:22ch}
.sec-head.center h2{margin:0 auto}
.sec-head.center p{margin:0 auto}
.eyebrow{font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:4px}
.eyebrow::before{width:5px;height:5px;background:var(--accent)}
.btns.center{justify-content:center}
.btn{font-weight:500;letter-spacing:-.005em}
.btn-s{background:var(--surface-2);border-color:var(--line-2)}
.btn-s:hover{background:var(--hover);border-color:#4A4A52}
.btn-p:hover{background:#fff}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.hd{background:rgba(9,9,10,.8)}
.hd-in{height:68px}
.ft{padding-top:clamp(64px,8vw,96px)}
.h4{position:relative;padding:clamp(72px,10vw,128px) 0 clamp(72px,9vw,120px);text-align:center;overflow:hidden;isolation:isolate}
.h4::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--line-2),transparent)}
.h4-tag{display:inline-flex;align-items:center;gap:0;padding:6px;border:1px solid var(--line);border-radius:var(--pill);background:var(--bg-2);font-family:var(--mono);font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);margin-bottom:32px}
.h4-tag span{display:inline-flex;align-items:center;gap:8px;padding:5px 12px}
.h4-tag span+span{border-left:1px solid var(--line)}
.h4-tag span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--svc)}
.h4 h1{max-width:14ch;margin:0 auto;font-size:var(--fs-hero);letter-spacing:-.045em;line-height:1}
.h4 h1 span{display:block;color:#8F8F96}
.h4 .lead{margin:28px auto 0;max-width:52ch;color:var(--mute)}
.h4 .btns{justify-content:center;margin-top:36px}
.h4-meta{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:8px 28px;margin-top:28px;font-size:.88rem;color:var(--mute)}
.h4-meta li{display:inline-flex;align-items:center;gap:8px}
.h4-meta li::before{content:"";width:14px;height:14px;background:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='m3 7.2 2.6 2.6L11 4.4' fill='none' stroke='%233DD68C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.sys{position:relative;margin:clamp(56px,7vw,88px) auto 0;max-width:1120px;text-align:left;background:var(--bg-2);border:1px solid var(--line-2);border-radius:20px;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 40px 120px -40px rgba(0,0,0,1),0 0 0 6px rgba(255,255,255,.015)}
.sys::after{content:"";position:absolute;left:8%;right:8%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(61,214,140,.5),transparent)}
.sys-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:44px;padding:0 16px;border-bottom:1px solid var(--line)}
.sys-dots{display:flex;gap:7px}.sys-dots i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.sys-url{display:inline-flex;align-items:center;gap:8px;justify-self:center;min-width:min(320px,48vw);justify-content:center;height:28px;padding:0 14px;border-radius:8px;background:var(--surface);border:1px solid var(--line);font-family:var(--mono);font-size:.78rem;color:var(--ink-2)}
.sys-url svg{width:12px;height:12px;fill:none;stroke:var(--accent);stroke-width:1.3}
.sys-live{justify-self:end;display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.74rem;color:var(--ink-2)}
.sys-live i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(61,214,140,.5);animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(61,214,140,.45)}70%{box-shadow:0 0 0 7px rgba(61,214,140,0)}100%{box-shadow:0 0 0 0 rgba(61,214,140,0)}}
.sys-body{display:grid;grid-template-columns:1.55fr 1fr;gap:12px;padding:12px}
.sys-site{border-radius:12px;overflow:hidden;background:#EEEEEA;color:#16161A;min-height:100%}
.ms{padding:18px 22px 22px;display:grid;gap:22px}
.ms-nav{display:flex;align-items:center;gap:18px;font-size:.78rem;color:#4A4A52}
.ms-nav b{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#16161A;margin-right:auto;font-size:.85rem}
.ms-nav b i{width:16px;height:16px;border-radius:5px;background:#16161A}
.ms-nav em{font-style:normal;background:#16161A;color:#F4F4F2;padding:6px 12px;border-radius:999px;font-weight:500}
.ms-hero{display:grid;gap:10px;padding:26px 0 6px;max-width:440px}
.ms-hero small{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:#1F5FB8}
.ms-hero strong{font-size:clamp(1.3rem,2.3vw,1.9rem);line-height:1.08;letter-spacing:-.035em;font-weight:600}
.ln{display:block;height:8px;border-radius:4px;background:#D6D6D1;width:88%}.ln.s{width:62%}
.ms-btns{display:flex;gap:10px;margin-top:8px;font-size:.75rem}
.ms-btns i{font-style:normal;background:#1F5FB8;color:#fff;padding:8px 14px;border-radius:999px}
.ms-btns u{text-decoration:none;border:1px solid #C9C9C3;padding:7px 14px;border-radius:999px;color:#2A2A30}
.ms-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ms-cards div{background:#fff;border:1px solid #DFDFDA;border-radius:10px;padding:10px;display:grid;gap:7px}
.ms-cards div i{display:block;aspect-ratio:16/9;border-radius:6px;background:linear-gradient(135deg,#DCE6F5,#EEF2F8)}
.ms-cards div:nth-child(2) i{background:linear-gradient(135deg,#DFF3E8,#EFF7F2)}
.ms-cards div:nth-child(3) i{background:linear-gradient(135deg,#F7EBD3,#F8F3E8)}
.ms-cards .ln{height:6px}
.sys-side{display:grid;gap:12px;grid-template-rows:auto 1fr}
.pnl{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:grid;gap:12px;align-content:start;min-width:0}
.pnl-h{display:flex;align-items:center;justify-content:space-between;font-size:.86rem;color:var(--ink)}
.pnl-h span{display:inline-flex;align-items:center;gap:10px}
.pnl-h .ico-s{width:24px;height:24px;border-radius:7px}
.st{font-family:var(--mono);font-size:.7rem;font-weight:400;color:var(--svc);background:var(--svc-soft);border:1px solid var(--svc-line);padding:3px 8px;border-radius:999px}
.spark{width:100%;height:56px;display:block}
.spark-a{fill:rgba(61,214,140,.08)}
.spark-l{fill:none;stroke:var(--c-srv);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-dasharray:420;stroke-dashoffset:420;animation:draw 3.2s var(--ease) .6s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.kvs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.kvs li{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:8px;background:var(--bg-2);border:1px solid var(--line);font-size:.76rem;color:var(--mute)}
.kvs b{font-weight:500;color:var(--ink-2)}
.log{position:relative;height:132px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}
.log-in{display:grid;gap:4px;animation:logs 18s linear infinite}
@keyframes logs{to{transform:translateY(-50%)}}
.log p{display:grid;grid-template-columns:34px 38px 1fr auto;gap:8px;align-items:center;font-family:var(--mono);font-size:.7rem;color:var(--mute);padding:4px 2px;white-space:nowrap}
.log code{font:inherit;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
.log b{font-weight:500}.log b.ok{color:var(--c-srv)}.log b.bad{color:var(--c-err)}.log b.warn{color:var(--c-sec)}
.log em{font-style:normal;color:var(--faint)}
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.bc{position:relative;display:flex;flex-direction:column;gap:14px;padding:clamp(24px,3vw,36px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);text-decoration:none;color:inherit;overflow:hidden;transition:border-color .25s var(--ease),background .25s var(--ease)}
.bc-7{grid-column:span 7}.bc-5{grid-column:span 5}
a.bc:hover{border-color:var(--svc-line);background:#141417}
.bc::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--svc-line,var(--line-2)),transparent);opacity:.9}
.bc-h{display:flex;align-items:center;gap:14px}
.bc-k{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.bc h3{font-size:clamp(1.35rem,2vw,1.7rem);letter-spacing:-.03em;max-width:22ch;margin-top:6px}
.bc-p{color:var(--mute);max-width:52ch;font-size:1rem}
.bc-ui{margin-top:auto;list-style:none}
.bc-go{align-self:flex-start;font-size:.92rem;color:var(--ink);border-bottom:1px solid var(--svc-line);padding-bottom:2px;transition:border-color .2s}
a.bc:hover .bc-go{border-color:var(--svc)}
.bc-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.bc-chips li{font-size:.82rem;padding:6px 12px;border-radius:999px;background:var(--bg-2);border:1px solid var(--line-2);color:var(--ink-2)}
.ui-web{position:relative;height:210px;margin-top:12px}
.dv{position:absolute;background:var(--bg-2);border:1px solid var(--line-2);overflow:hidden}
.dv-d{left:0;right:22%;top:0;bottom:0;border-radius:12px;transition:transform .5s var(--ease)}
.dv-top{display:flex;gap:5px;padding:9px 12px;border-bottom:1px solid var(--line)}.dv-top i{width:7px;height:7px;border-radius:50%;background:var(--line-2)}
.dv-c{padding:16px;display:grid;gap:8px;align-content:start}
.dv .hl{display:block;height:14px;width:60%;border-radius:4px;background:#3A3A42}
.dv .ln{background:#26262C;height:7px}
.dv .bt{display:block;width:84px;height:20px;border-radius:999px;background:var(--svc);margin-top:4px}
.dv .gr{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.dv .gr i{height:44px;border-radius:7px;background:var(--surface-2);border:1px solid var(--line)}
.dv-m{right:4%;width:21%;min-width:104px;top:18px;bottom:-20px;border-radius:18px;border-width:1px;box-shadow:-20px 0 40px -10px rgba(0,0,0,.8);transition:transform .5s var(--ease)}
.dv-m .dv-c{padding:22px 12px}.dv-m .gr{grid-template-columns:1fr}.dv-m .bt{width:60px}
a.bc:hover .dv-m{transform:translateY(-8px)}a.bc:hover .dv-d{transform:translateY(-3px)}
.ui-srv{display:grid;gap:8px}
.ui-srv li{display:grid;grid-template-columns:8px 1fr auto;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--bg-2);border:1px solid var(--line)}
.ui-srv li>i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:var(--svc);box-shadow:0 0 0 3px var(--svc-soft)}
.ui-srv span{font-size:.9rem;color:var(--ink)}
.ui-srv small{grid-column:2;font-size:.78rem;color:var(--mute)}
.bars{grid-column:3;grid-row:1/3;display:flex;align-items:flex-end;gap:3px;height:22px}
.bars b{width:4px;border-radius:2px;background:var(--svc);opacity:.55;height:40%;animation:bar 2.8s ease-in-out infinite}
.bars b:nth-child(2){animation-delay:-.4s}.bars b:nth-child(3){animation-delay:-.9s}.bars b:nth-child(4){animation-delay:-1.5s}.bars b:nth-child(5){animation-delay:-2.1s}
.ui-srv li:nth-child(2) .bars b{animation-duration:3.4s}.ui-srv li:nth-child(3) .bars b{animation-duration:2.2s}.ui-srv li:nth-child(4) .bars b{animation-duration:3.9s}
@keyframes bar{0%,100%{height:30%}50%{height:100%}}
.ui-sec{display:grid;gap:0;border:1px solid var(--line);border-radius:12px;background:var(--bg-2);overflow:hidden}
.ui-sec li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px}
.ui-sec li+li{border-top:1px solid var(--line)}
.ui-sec span{display:grid;font-size:.9rem;color:var(--ink)}
.ui-sec small{font-size:.78rem;color:var(--mute)}
.tg{flex:none;width:34px;height:20px;border-radius:999px;background:rgba(245,184,61,.22);border:1px solid var(--svc-line);position:relative}
.tg::after{content:"";position:absolute;top:2px;right:2px;width:14px;height:14px;border-radius:50%;background:var(--svc)}
.bc-std{--svc-line:rgba(61,214,140,.32)}
.std{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:auto;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.std li{display:grid;gap:4px;padding:16px;background:var(--bg-2)}
.std strong{font-weight:500;font-size:.92rem;display:flex;gap:8px;align-items:center}
.std strong::before{content:"";flex:none;width:14px;height:14px;background:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='m3 7.2 2.6 2.6L11 4.4' fill='none' stroke='%233DD68C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.std span{font-size:.82rem;color:var(--mute);padding-left:22px}
.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.pcard{position:relative;display:flex;flex-direction:column;gap:10px;padding:32px 28px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.pcard.is-key{background:#131615;border-color:rgba(61,214,140,.45);box-shadow:0 0 0 1px rgba(61,214,140,.18),0 30px 80px -40px rgba(61,214,140,.25)}
.pcard-h{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:30px}
.pcard-h h3{font-size:1.15rem;letter-spacing:-.01em}
.pcard-p{font-size:clamp(1.8rem,2.6vw,2.3rem);letter-spacing:-.035em;font-weight:500;font-variant-numeric:tabular-nums;margin-top:10px;line-height:1.1}
.pcard-n{font-family:var(--mono);font-size:.74rem;color:var(--mute);letter-spacing:.02em}
.pcard-i{color:var(--mute);font-size:.98rem;margin-top:6px}
.pcard-t{list-style:none;display:grid;gap:10px;margin:14px 0 24px;padding-top:18px;border-top:1px solid var(--line);font-size:.92rem;color:var(--ink-2)}
.pcard-t li{display:flex;gap:10px}
.pcard-t li::before{content:"";flex:none;width:14px;height:14px;margin-top:4px;background:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='m3 7.2 2.6 2.6L11 4.4' fill='none' stroke='%233DD68C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.pcard .btn{margin-top:auto;width:100%}
.plans{grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.plan{border-radius:var(--r-lg);padding:32px 28px 24px;gap:20px}
.plan.is-key{background:#131615;border-color:rgba(61,214,140,.45);box-shadow:0 0 0 1px rgba(61,214,140,.18),0 30px 80px -40px rgba(61,214,140,.25)}
.plan .btn{width:100%}
.plan .acc{margin-top:auto}
.amount{letter-spacing:-.035em}
.start{padding:clamp(88px,10vw,140px) 0;border-top:1px solid var(--line);background:var(--bg-2)}
.start-in{max-width:760px;margin:0 auto;text-align:center}
.start h2{max-width:18ch;margin:0 auto}
.start p{color:var(--mute);margin:20px auto 0;max-width:52ch;font-size:1.1rem}
.start .ask{margin-top:40px}
.start-alt{font-size:.95rem!important}
.ask-box{border-radius:20px;background:var(--surface)}
.proj figure{border-radius:16px}
.proj figure img{transition:transform .6s var(--ease)}
.proj:hover figure img{transform:scale(1.015)}
.acc summary{transition:color .2s}
.acc summary:hover{color:#fff}
.phero{border-bottom:1px solid var(--line)}
.phero+.sec-t{padding-top:clamp(56px,7vw,96px)}
@media (max-width:1079px){
.bc-7,.bc-5{grid-column:span 12}
.sys-body{grid-template-columns:1fr}
.sys-side{grid-template-columns:1fr 1fr;grid-template-rows:auto}
.pcards,.plans{grid-template-columns:repeat(3,1fr);max-width:none}
}
@media (max-width:899px){
.pcards,.plans{grid-template-columns:1fr;max-width:620px;margin-left:auto;margin-right:auto}
}
@media (max-width:719px){
.h4{text-align:left;padding-top:56px}
.h4 h1{margin:0}
.h4 .lead{margin-left:0}
.h4 .btns,.h4-meta{justify-content:flex-start}
.h4-meta{flex-direction:column;gap:8px}
.h4-tag{font-size:.68rem;padding:4px}.h4-tag span{padding:4px 8px}
.sys{margin-top:48px;border-radius:16px}
.sys-bar{grid-template-columns:auto 1fr;padding:0 12px}.sys-dots{display:none}.sys-url{min-width:0;justify-self:start}
.sys-body{padding:8px;gap:8px}
.sys-side{grid-template-columns:1fr}
.ms{padding:14px 14px 16px;gap:16px}
.ms-nav span{display:none}
.ms-cards{grid-template-columns:1fr 1fr}.ms-cards div:nth-child(3){display:none}
.log{height:104px}
.std{grid-template-columns:1fr 1fr}
.ui-web{height:170px}
.start-in{text-align:left}.start h2,.start p{margin-left:0}
.sec-head.center{text-align:left;justify-items:start}.sec-head.center h2,.sec-head.center p{margin-left:0}
.btns.center{justify-content:flex-start}
}
@media (max-width:420px){.std{grid-template-columns:1fr}.log p{grid-template-columns:30px 34px 1fr}.log em{display:none}}
@media (prefers-reduced-motion:reduce){.log-in,.bars b,.sys-live i{animation:none!important}.spark-l{stroke-dashoffset:0}}
.h4{padding:clamp(64px,8vw,104px) 0 0}
.h4 h1{max-width:none;font-size:clamp(2.5rem,5.6vw,4.9rem)}
.h4-tag{margin-bottom:28px}
.h4 .lead{margin-top:24px}
.h4 .btns{margin-top:32px}
.h4-meta{margin-top:24px}
.sys{margin-top:clamp(48px,5.5vw,72px)}
.h4+.sec{padding-top:clamp(96px,11vw,152px)}
.pnl.svc-sec{display:flex;flex-direction:column}
.pnl.svc-sec .log{flex:1;min-height:132px;height:auto}
@media (max-width:719px){
.h4-tag{flex-wrap:wrap;border:0;background:none;padding:0;gap:6px 16px;border-radius:0}
.h4-tag span{padding:0}.h4-tag span+span{border-left:0}
.pnl.svc-sec .log{min-height:104px;max-height:104px}
}
@media (min-width:720px) and (max-width:1079px){.pnl.svc-sec .log{max-height:150px}}
.flow{display:flex;align-items:center;gap:0;margin:auto 0 8px;padding:20px 0}
.flow span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--svc-line);background:var(--svc-soft);font-size:.85rem;color:var(--ink);white-space:nowrap}
.flow span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--svc)}
.flow i{position:relative;flex:1;height:1px;background:var(--line-2);overflow:hidden;min-width:16px}
.flow i::after{content:"";position:absolute;top:0;left:-30%;width:30%;height:1px;background:var(--svc);animation:flow 3s var(--ease) infinite}
.flow i+span+i::after{animation-delay:1.5s}
@keyframes flow{to{left:100%}}
.bc-std .std{margin-top:0}
@media (max-width:420px){.flow span{padding:6px 10px;font-size:.78rem}}
@media (prefers-reduced-motion:reduce){.flow i::after{animation:none!important;display:none}}
.phero-g{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,88px);align-items:center}
.svc-vis{background:var(--surface);border:1px solid var(--line-2);border-radius:20px;padding:12px 16px 16px;box-shadow:0 40px 100px -50px rgba(0,0,0,1);position:relative}
.svc-vis::after{content:"";position:absolute;left:10%;right:10%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--svc),transparent);opacity:.6}
.svc-vis-h{display:flex;align-items:center;justify-content:space-between;padding:2px 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.svc-vis-h span{display:flex;gap:6px}.svc-vis-h span i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.svc-vis-h b{font-family:var(--mono);font-weight:400;font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.svc-vis .ui-web{margin-top:0;height:260px}
.sec-k{padding-top:clamp(64px,8vw,112px)}
.sec-k h1{margin-top:4px}
@media (max-width:1079px){.phero-g{grid-template-columns:1fr}.svc-vis{max-width:560px}}
@media (max-width:719px){.svc-vis .ui-web{height:190px}}
:root{
--bg:#000000;--bg-2:#0A0A0A;--surface:#0F0F0F;--surface-2:#141414;--hover:#1A1A1A;
--ink:#F5F5F5;--ink-2:#D4D4D4;--mute:#A1A1A1;--faint:#737373;--line:#1F1F1F;--line-2:#2A2A2A;
--accent:#F5F5F5;--accent-ink:#000;--accent-soft:rgba(255,255,255,.06);
--blue:#F5F5F5;--c-web:#F5F5F5;--c-srv:#F5F5F5;--c-sec:#F5F5F5;--c-err:#EF4444;
--r-sm:8px;--r:12px;--r-lg:16px;
}
body{background:var(--bg);color:var(--ink);font-feature-settings:"cv11"}
h1,h2,h3,h4{font-weight:500}
h1{color:var(--ink)}
::selection{background:rgba(255,255,255,.16);color:#fff}
.logo{gap:6px;font-size:1.05rem;letter-spacing:-.03em}
.logo svg{display:none}
.logo b{font-weight:600;color:var(--ink)}
.logo span{color:var(--mute);font-weight:400}
.hd{background:rgba(0,0,0,.92);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid transparent}
.hd.is-scrolled,.menu-open .hd{border-bottom-color:var(--line);background:#000}
.mega{box-shadow:none;background:#0A0A0A}
.mega li a:hover{transform:none}
.mega-box{background:var(--surface);border-color:var(--line)}
.btn{border-radius:999px;transition:background .15s ease,border-color .15s ease,color .15s ease}
.btn:active{transform:none}
.btn-p{background:#fff;color:#000}
.btn-p:hover{background:#E8E8E8;color:#000}
.btn-s{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-s:hover{background:var(--surface);border-color:#3A3A3A}
@keyframes pulse{to{}}
@keyframes draw{to{}}
@keyframes logs{to{}}
@keyframes bar{to{}}
@keyframes flow{to{}}
.sys-live i,.spark-l,.log-in,.bars b,.flow i::after{animation:none!important}
.spark-l{stroke-dashoffset:0}
.log{-webkit-mask-image:none;mask-image:none;overflow:auto}
.ui-srv li>i{box-shadow:none}
.eyebrow::before,.eyebrow-svc span::before,.h4-tag span::before{box-shadow:none!important}
.sys,.sys::after,.svc-vis,.svc-vis::after,.bc::before,.flow,.bc-ui,.ui-web,.ui-srv,.ui-sec,.h4-tag{display:none!important}
.sys{display:none!important}
.js .rv,.js .rv.d1,.js .rv.d2,.js .rv.d3,.hero .rv{opacity:1!important;transform:none!important;transition:none!important}
.h4{text-align:center;padding:clamp(96px,14vw,168px) 0 clamp(72px,10vw,120px);overflow:visible}
.h4::before,.hero::before,.hero::after{display:none!important}
.h4 .eyebrow{justify-content:center;margin-bottom:28px;font-family:inherit;font-size:.9rem;letter-spacing:.02em;text-transform:none;color:var(--mute)}
.h4 .eyebrow::before{display:none}
.h4 h1{max-width:16ch;margin:0 auto;font-size:clamp(2.75rem,6.2vw,5.25rem);letter-spacing:-.045em;line-height:1.02;font-weight:500}
.h4 h1 span{display:block;color:var(--mute)}
.h4 .lead{margin:28px auto 0;max-width:42ch;color:var(--mute);font-size:clamp(1.1rem,1.5vw,1.25rem)}
.h4 .btns{justify-content:center;margin-top:36px}
.h4-meta{justify-content:center;margin-top:32px;gap:8px 24px;color:var(--faint);font-size:.9rem}
.h4-meta li::before{display:none}
.h4+.sec{padding-top:clamp(72px,9vw,112px)}
@media (max-width:719px){
.h4{text-align:left;padding-top:72px}
.h4 h1,.h4 .lead{margin-left:0;margin-right:0}
.h4 .eyebrow,.h4 .btns,.h4-meta{justify-content:flex-start}
}
.phero-g{grid-template-columns:1fr;max-width:720px}
.phero-svc{padding:clamp(64px,8vw,112px) 0 clamp(48px,6vw,80px)}
.svc-tag{font-family:inherit;letter-spacing:0;text-transform:none;color:var(--mute);background:transparent;border:0;padding:0;margin-bottom:20px;gap:0}
.svc-tag .ico{display:none}
.bc{border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);box-shadow:none;gap:16px;padding:clamp(28px,3vw,40px)}
a.bc:hover{border-color:var(--line-2);background:var(--surface-2);transform:none}
.bc-k{font-family:inherit;letter-spacing:.02em;text-transform:none;font-size:.85rem;color:var(--mute);margin:0}
.bc h3{margin-top:4px;max-width:24ch}
.bc-go{border-bottom:1px solid var(--line-2);margin-top:8px}
a.bc:hover .bc-go{border-color:var(--ink)}
.bc-chips li{border-radius:6px;background:transparent;border-color:var(--line-2)}
.bc-list{list-style:none;display:grid;gap:10px;margin-top:8px;padding-top:16px;border-top:1px solid var(--line);color:var(--ink-2);font-size:.95rem}
.bc-list li{display:flex;gap:10px;align-items:center}
.bc-list li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--mute);flex:none}
.bc-std .std{border-radius:var(--r);background:var(--line);margin-top:12px}
.std li{background:var(--bg-2)}
.std strong::before{filter:grayscale(1) brightness(2)}
.ico{display:none}
.pcard,.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:none}
.pcard.is-key,.plan.is-key{background:var(--surface-2);border-color:var(--line-2);box-shadow:none}
.badge{background:var(--ink);color:var(--bg);font-size:.75rem;font-weight:500;padding:4px 10px;border-radius:999px}
.pcard-n,.pcard-t li::before{font-family:inherit}
.pcard-t li::before{filter:grayscale(1) brightness(2)}
.ticks li::before{border-color:var(--ink)}
.eyebrow,.ft h2,.simple h2,.crumb,.steps .n,.pcard-n,.mega h3,.proj .mute,.pfull .mute{
font-family:inherit;letter-spacing:.01em;text-transform:none
}
.eyebrow{font-size:.9rem;color:var(--mute);margin-bottom:12px}
.eyebrow::before{display:none}
.steps .n{color:var(--mute);font-variant-numeric:tabular-nums}
.steps li::before{background:var(--line-2);height:1px}
.checks li::before{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line-2);filter:none}
.row h3{transition:none}a.row:hover h3{transform:none;color:var(--ink)}
a.row::before{display:none}
.proj figure,.pfull figure{box-shadow:none;border-radius:var(--r)}
.proj:hover img,.proj figure img{transform:none!important;transition:none!important}
.ways a strong{transition:none}.ways a:hover strong{transform:none;color:var(--ink)}
.contact{gap:clamp(48px,7vw,96px);align-items:start}
.contact h1{font-size:clamp(2.4rem,4.5vw,3.5rem);letter-spacing:-.04em;max-width:12ch}
.contact .lead{margin-top:20px;max-width:36ch}
.contact-copy .crumb{margin-bottom:24px}
.form{background:transparent;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(28px,3.5vw,40px);gap:24px;box-shadow:none}
.form h2{font-size:1.15rem;font-weight:500;letter-spacing:-.02em;margin:0 0 4px;color:var(--ink)}
.fbody{display:grid;gap:20px}
.field label{font-size:.875rem;font-weight:400;color:var(--mute)}
.field input,.field select,.field textarea{
background:var(--bg);border:1px solid var(--line-2);border-radius:8px;padding:12px 14px;
color:var(--ink);box-shadow:none;transition:border-color .15s ease
}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#3A3A3A}
.field input:focus,.field select:focus,.field textarea:focus{
outline:none;border-color:#666;box-shadow:none;background:var(--bg)
}
.form-ok{background:var(--surface);border-color:var(--line);border-radius:var(--r)}
.form-ok strong{color:var(--ink)}
.ways{margin-top:40px}
.ways a{padding:18px 0}
.ways a span{font-size:.8rem;letter-spacing:.02em}
.sec-k{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(72px,10vw,120px)}
.start{background:var(--bg);border-top:1px solid var(--line)}
.start-in{max-width:640px}
.start h2{font-size:clamp(1.8rem,3.2vw,2.6rem)}
.start-alt{margin-top:28px!important;color:var(--mute)}
.ask,.ask-box,.chips{display:none!important}
.tlink{color:var(--ink);text-decoration-color:var(--line-2)}
.tlink:hover{color:#fff;text-decoration-color:#fff}
.acc[open] summary .pm{border-color:var(--ink)}
.acc summary .pm::before,.acc summary .pm::after{background:var(--ink)}
.ft{background:#000}
.cookie{box-shadow:none}
.hd-in{height:64px}
.nav>a,.nav-item>button{color:var(--mute)}
.nav>a:hover,.nav-item>button:hover{color:var(--ink);background:transparent}
.nav a[aria-current=page]{color:var(--ink)}
.topic h3::before{background:var(--mute);border-radius:50%;width:5px;height:5px}
.simple{background:var(--surface);border-color:var(--line)}
.dark{background:var(--bg-2)}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
h1,h2,h3,h4{letter-spacing:-.02em}
h1{letter-spacing:-.03em}
.h4 h1{letter-spacing:-.035em;font-weight:500}
body{letter-spacing:-.005em}
.menu-btn{border-radius:8px;background:transparent;border-color:var(--line-2)}
.contact .form{max-width:560px}
@media (min-width:900px){
.contact{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:start}
.contact .form{max-width:none}
}
:root{--w:1440px;--gut:clamp(24px,5vw,64px)}
.wrap{max-width:calc(var(--w) + 2*var(--gut))}
.hero-c{padding:clamp(80px,11vw,140px) 0 clamp(72px,9vw,112px);border-bottom:1px solid var(--line)}
.hero-c-in{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.75fr);gap:clamp(48px,8vw,120px);align-items:center;width:100%}
.hero-c h1{max-width:18ch}
.hero-c-copy{min-width:0}
.hero-c .eyebrow{margin-bottom:20px;justify-content:flex-start}
.hero-c h1{font-size:clamp(2.8rem,5.8vw,5rem);letter-spacing:-.038em;line-height:1.02;max-width:none;margin:0;font-weight:500}
.hero-c h1 span{color:var(--mute)}
.hero-c .lead{margin-top:24px;max-width:48ch;font-size:clamp(1.1rem,1.35vw,1.25rem);color:var(--mute)}
.hero-c .btns{margin-top:32px;justify-content:flex-start}
.hero-c-meta{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:28px;padding:0;font-size:.9rem;color:var(--faint)}
.hero-c-meta li{display:inline-flex;align-items:center;gap:8px}
.hero-c-meta li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--mute)}
.hero-c-aside{display:flex;flex-direction:column;align-items:center;gap:20px;justify-self:end;text-align:center}
.kirobot-cap{margin:0;max-width:28ch}
.kirobot-cap strong{display:block;font-weight:500;font-size:1.05rem;margin-bottom:6px}
.kirobot-cap span{display:block;font-size:.9rem;color:var(--mute);line-height:1.45}
@media (max-width:899px){
.hero-c-in{grid-template-columns:1fr;gap:48px}
.hero-c-aside{justify-self:start;align-items:flex-start;text-align:left}
}
.kirobot{display:grid;place-items:center;position:relative}
.kirobot svg,.kirobot img{width:100%;height:auto;display:block}
.kirobot-sm{width:56px;height:56px;flex:none}
.kirobot-md{width:88px;height:88px;flex:none}
.kirobot-lg{width:min(220px,46vw);filter:drop-shadow(0 24px 48px rgba(0,0,0,.55))}
.kirobot .k-body{transform-origin:60px 60px}
@media (prefers-reduced-motion:no-preference){
.kirobot[data-kirobot]{animation:kiro-float 4.5s ease-in-out infinite}
.kirobot .k-eye{transform-box:fill-box;transform-origin:center;animation:kiro-blink 5.2s ease-in-out infinite}
.kirobot .k-eye:nth-of-type(2){animation-delay:.08s}
.kirobot .k-pupil{transition:transform .35s var(--ease)}
}
@keyframes kiro-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes kiro-blink{0%,42%,46%,100%{transform:scaleY(1)}44%{transform:scaleY(.08)}}
.sec-svc{padding-top:clamp(72px,9vw,120px)}
.sec-head-wide{max-width:none;margin-bottom:clamp(40px,5vw,64px)}
.sec-head-wide h2{max-width:22ch}
.sec-head-wide p{max-width:56ch;color:var(--mute);margin-top:12px}
.svc-rows{display:grid;border-top:1px solid var(--line)}
.svc-row{display:grid;grid-template-columns:72px minmax(0,1.4fr) minmax(0,1fr) auto;gap:24px 32px;align-items:center;padding:36px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;transition:background .2s}
.svc-row:hover{background:rgba(255,255,255,.02)}
.svc-row-n{font-size:.9rem;color:var(--faint);font-variant-numeric:tabular-nums}
.svc-row-b h3{font-size:clamp(1.35rem,2vw,1.75rem);margin:0 0 8px;letter-spacing:-.025em}
.svc-row-b p{margin:0;color:var(--mute);max-width:48ch;font-size:1.02rem}
.svc-row-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.svc-row-tags li{font-size:.8rem;color:var(--ink-2);border:1px solid var(--line-2);padding:5px 10px;border-radius:6px}
.svc-row-go{font-size:.9rem;color:var(--mute);border-bottom:1px solid var(--line-2);padding-bottom:2px;white-space:nowrap}
.svc-row:hover .svc-row-go{color:var(--ink);border-color:var(--ink)}
@media (max-width:899px){
.svc-row{grid-template-columns:48px 1fr;gap:12px 16px}
.svc-row-tags,.svc-row-go{grid-column:2}
.svc-row-go{justify-self:start;margin-top:4px}
}
.kiro-band{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;margin-top:48px;padding:28px 32px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.kiro-band h3{font-size:1.25rem;margin:4px 0 8px}
.kiro-band .mute{margin:0;max-width:52ch}
@media (max-width:799px){
.kiro-band{grid-template-columns:1fr;gap:16px;padding:24px}
}
.flow-c{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0;padding:0;border-top:1px solid var(--line)}
.flow-c li{position:relative;padding:36px 28px 28px 0;border-right:1px solid var(--line)}
.flow-c li:last-child{border-right:0;padding-right:0}
.flow-c-n{display:block;font-size:.85rem;color:var(--faint);margin-bottom:18px;font-variant-numeric:tabular-nums}
.flow-c h3{font-size:1.2rem;margin:0 0 10px}
.flow-c p{margin:0;color:var(--mute);font-size:.98rem;max-width:28ch}
.flow-c-t{display:inline-block;margin-top:18px;font-size:.78rem;color:var(--faint);border:1px solid var(--line-2);padding:4px 10px;border-radius:999px}
@media (max-width:899px){
.flow-c{grid-template-columns:1fr 1fr}
.flow-c li:nth-child(2){border-right:0;padding-right:0}
.flow-c li:nth-child(1),.flow-c li:nth-child(2){border-bottom:1px solid var(--line)}
}
@media (max-width:559px){.flow-c{grid-template-columns:1fr}.flow-c li{border-right:0;padding-right:0;border-bottom:1px solid var(--line)}.flow-c li:last-child{border-bottom:0}}
.mega-box.mega-kiro{gap:10px;background:var(--surface);border:1px solid var(--line);padding:22px}
.mega-kiro .kirobot{margin-bottom:4px}
.mega-kiro strong{font-size:1rem;font-weight:500}
.mega-kiro p{font-size:.9rem;line-height:1.45}
.mega-kiro .btn{margin-top:6px}
.field select.vs-native{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.csel{position:relative}
.csel-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;font:400 1rem/1.4 "Inter",sans-serif;color:var(--ink);background:var(--bg);border:1px solid var(--line-2);border-radius:8px;padding:12px 14px;cursor:pointer;text-align:left}
.csel-btn:hover{border-color:#3A3A3A}
.csel.is-open .csel-btn,.csel-btn:focus{outline:none;border-color:#666}
.csel-btn svg{width:12px;height:12px;flex:none;opacity:.7;transition:transform .2s}
.csel.is-open .csel-btn svg{transform:rotate(180deg)}
.csel-list{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;background:#121214;border:1px solid var(--line-2);border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.55);max-height:260px;overflow:auto;display:none}
.csel.is-open .csel-list{display:grid;gap:2px}
.csel-list button{width:100%;text-align:left;background:transparent;border:0;color:var(--ink-2);font:400 .975rem/1.3 "Inter",sans-serif;padding:11px 12px;border-radius:8px;cursor:pointer}
.csel-list button:hover,.csel-list button[aria-selected=true]{background:rgba(255,255,255,.06);color:var(--ink)}
.csel-list button[aria-selected=true]{font-weight:500}
.kirobot,.mega-kiro,.kirobot-cap{display:none!important}
.hero-c-aside{width:100%;max-width:420px;justify-self:end}
.hero-slot{width:100%;aspect-ratio:1;border-radius:28px;border:1px solid var(--line);background:linear-gradient(160deg,#121214,#0A0A0A);min-height:280px}
.phero-g{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.75fr);gap:clamp(32px,6vw,80px);align-items:center}
.phero-aside{justify-self:end;width:100%;max-width:380px}
.phero-svc .svc-tag,.phero-svc .ico{display:none}
@media (max-width:899px){
.phero-g{grid-template-columns:1fr}
.phero-aside{max-width:none;justify-self:stretch}
.hero-c-aside{max-width:none;justify-self:stretch}
}
.svc-rows{display:none}
.svc-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1199px){.svc-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc-card{
display:flex;flex-direction:column;gap:12px;padding:22px 22px 20px;
border:1px solid #262626;border-radius:22px;background:#141414;
text-decoration:none;color:inherit;min-height:100%;overflow:hidden;position:relative;
transition:border-color .25s,background .25s,transform .25s cubic-bezier(.16,1,.3,1)
}
.svc-card::before{
content:"";position:absolute;left:0;right:0;top:0;height:2px;opacity:.9;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent)
}
.svc-card.is-web::before{background:linear-gradient(90deg,transparent,#7dd3fc,transparent)}
.svc-card.is-srv::before{background:linear-gradient(90deg,transparent,#5EEAD4,transparent)}
.svc-card.is-sec::before{background:linear-gradient(90deg,transparent,#FDBA74,transparent)}
.svc-card.is-game::before{background:linear-gradient(90deg,transparent,#C4B5FD,transparent)}
.svc-card:hover{border-color:#3A3A3A;background:#181818;transform:translateY(-3px)}
.svc-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.svc-card-n{font-size:.78rem;color:var(--faint);font-variant-numeric:tabular-nums}
.svc-ico{
display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
border:1px solid #2e2e2e;background:#1a1a1a;color:#c8c8c8
}
.svc-ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.svc-card h3{font-size:1.28rem;margin:0;letter-spacing:-.03em;font-weight:500}
.svc-card>p{margin:0;color:var(--mute);font-size:.9rem;line-height:1.45;flex:1}
.svc-card-go{
margin-top:4px;align-self:flex-start;font-size:.86rem;color:#ddd;
border-bottom:1px solid #333;padding-bottom:2px;transition:border-color .2s,color .2s
}
.svc-card:hover .svc-card-go{border-color:#fff;color:#fff}
.svc-mini{
margin-top:6px;border:1px solid #2a2a2a;border-radius:14px;background:#0f0f0f;
padding:10px;min-height:96px;overflow:hidden
}
.svc-mini-bar{
display:flex;align-items:center;gap:5px;margin-bottom:8px;font-size:.62rem;color:#888
}
.svc-mini-bar i{width:7px;height:7px;border-radius:50%;background:#333}
.svc-mini-bar i:first-child{background:#ef4444}
.svc-mini-bar i:nth-child(2){background:#eab308}
.svc-mini-bar i:nth-child(3){background:#22c55e}
.svc-mini-bar em{margin-left:auto;font-style:normal}
.svc-mini-hero{
height:36px;border-radius:8px;margin-bottom:8px;
background:linear-gradient(120deg,#1c2430,#121820 40%,#1a222c);
border:1px solid #243040;position:relative;overflow:hidden
}
.svc-mini-hero::after{
content:"";position:absolute;inset:8px 30% 8px 10%;border-radius:4px;background:rgba(125,211,252,.18)
}
.svc-mini-rows{display:grid;gap:5px}
.svc-mini-rows span{display:block;height:6px;border-radius:4px;background:#1c1c1c}
.svc-mini-rows span:nth-child(1){width:88%}
.svc-mini-rows span:nth-child(2){width:64%}
.svc-mini-rows span:nth-child(3){width:74%}
.svc-meter{display:grid;grid-template-columns:36px 1fr;gap:8px;align-items:center;margin-bottom:8px;font-size:.68rem;color:#9a9a9a}
.svc-meter b{display:block;height:7px;border-radius:999px;background:#1c1c1c;overflow:hidden;font-weight:400}
.svc-meter b i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2dd4bf,#5EEAD4);transition:width .7s ease}
.svc-mini-sec pre{
margin:0;font:500 .68rem/1.55 ui-monospace,Consolas,monospace;color:#9AE6B4;min-height:72px;white-space:pre-wrap
}
.svc-mini-game{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:72px}
.svc-game-chip{
font-size:.68rem;padding:6px 10px;border-radius:999px;border:1px solid #2e2e2e;
background:#161616;color:#aaa
}
.svc-game-chip.is-on{color:#C4B5FD;border-color:rgba(196,181,253,.35);background:rgba(196,181,253,.08);box-shadow:0 0 12px rgba(167,139,250,.12)}
@media (max-width:639px){.svc-cards{grid-template-columns:1fr}}
.sec-flow{padding:clamp(72px,9vw,120px) 0}
.flow-c{gap:16px;border:0;padding:8px 0}
.flow-c li{border:1px solid var(--line);border-radius:24px;background:var(--surface);padding:28px 24px;margin:0}
.flow-c li:last-child{border-right:1px solid var(--line);padding-right:24px}
@media (max-width:899px){
.flow-c{grid-template-columns:1fr 1fr;gap:14px}
.flow-c li:nth-child(1),.flow-c li:nth-child(2){border-bottom:1px solid var(--line)}
}
@media (max-width:559px){.flow-c{grid-template-columns:1fr}}
.check-board{display:grid;gap:14px}
.check-board-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.check-item{display:grid;grid-template-columns:28px 1fr;gap:16px;align-items:start;padding:22px 24px;border:1px solid var(--line);border-radius:20px;background:var(--surface);scroll-margin-top:110px}
.check-dot{width:18px;height:18px;margin-top:4px;border-radius:50%;border:1.5px solid #5A5A62;background:radial-gradient(circle at center,#F5F5F5 0 35%,transparent 36%);flex:none}
.check-item h3{font-size:1.15rem;margin:0 0 6px;letter-spacing:-.02em}
.check-item p{margin:0;color:var(--mute);font-size:.98rem;line-height:1.5}
@media (max-width:719px){.check-board-2{grid-template-columns:1fr}}
.pack-rules{margin-top:48px;padding:36px 32px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.pack-rules h2{font-size:1.5rem;margin:0 0 8px}
.pack-rules-lead{margin:0 0 28px;color:var(--mute)}
.pack-rules-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 28px}
.pack-rules-grid h3{font-size:1rem;margin:0 0 8px;font-weight:500}
.pack-rules-grid p{margin:0;color:var(--mute);font-size:.95rem;line-height:1.5}
.price-extra{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 32px;padding:32px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.price-extra h2{font-size:clamp(1.4rem,2.2vw,1.8rem);margin:6px 0 10px}
.price-extra p{margin:0;color:var(--mute);max-width:52ch}
.price-extra-links{display:flex;flex-wrap:wrap;gap:10px}
.sec-note{margin-top:28px;font-size:.95rem}
@media (max-width:899px){.pack-rules-grid{grid-template-columns:1fr 1fr}.pack-rules{padding:28px 22px}}
@media (max-width:559px){.pack-rules-grid{grid-template-columns:1fr}}
.topics .topic{border-radius:20px}
:root{
--bg:#000000;--bg-2:#0A0A0A;--surface:#111111;--surface-2:#161616;--hover:#1C1C1C;
--ink:#FFFFFF;--ink-2:#E8E8E8;--mute:#A3A3A3;--faint:#737373;
--line:#1F1F1F;--line-2:#2A2A2A;
--c-web:#E5E5E5;--c-srv:#B8B8B8;--c-sec:#D4D4D4;--c-game:#FFFFFF;--accent:#FFFFFF;
--r:16px;--r-lg:24px;--r-xl:28px;
}
html,body{background:var(--bg);color:var(--ink)}
.hd{background:rgba(0,0,0,.86)}
.hd.is-scrolled,.menu-open .hd,.drawer{background:#000!important;border-bottom-color:var(--line)}
.mega{background:#0A0A0A!important}
.ft{background:#000}
.dark{background:var(--bg-2)}
.hero-slot{background:linear-gradient(160deg,#1A1A1A,#0A0A0A);border-color:var(--line)}
.form,.contact .form{
background:transparent!important;border:0!important;border-radius:0!important;
padding:0!important;box-shadow:none!important;max-width:none
}
.form h2{margin-bottom:8px}
.field input,.field select,.field textarea,.csel-btn{
background:var(--bg-2)!important;border-radius:14px!important;border-color:var(--line-2)!important
}
.csel-list{background:var(--surface-2);border-radius:16px}
.mega-in{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
padding-top:28px;padding-bottom:32px
}
.mega-in>div{border-left:0;padding-left:0;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:18px 16px}
.mega h3{margin-bottom:12px}
.mega li a{padding:10px 12px;border-radius:12px;margin:0 -4px}
.mega li a:hover{background:rgba(255,255,255,.04);color:var(--ink)}
.mega-box{display:none!important}
@media (max-width:1099px){.mega-in{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:699px){.mega-in{grid-template-columns:1fr}}
.svc-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:699px){.svc-cards{grid-template-columns:1fr}}
.svc-card{border-radius:28px;padding:32px 28px;background:linear-gradient(180deg,#141414 0%,#0A0A0A 100%);border-color:var(--line);overflow:hidden;position:relative}
.svc-card::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)}
.svc-card:hover{border-color:#333;background:linear-gradient(180deg,#1A1A1A 0%,#0E0E0E 100%)}
.svc-card ul li{
border:1px solid var(--line-2);color:var(--ink-2);font-weight:500;padding:7px 14px;border-radius:999px;
background:rgba(255,255,255,.04);box-shadow:none
}
.flow-c{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
border-top:1px solid var(--line);border-radius:0;padding:0;background:transparent
}
.flow-c li{
position:relative;border:0;border-radius:0;background:transparent;
padding:36px 28px 8px 0;margin:0
}
.flow-c li+li{padding-left:28px;border-left:1px solid var(--line)}
.flow-c li:last-child{border-right:0;padding-right:0}
.flow-c li::before{
content:"";position:absolute;top:-1px;left:0;height:2px;width:0;
background:linear-gradient(90deg,var(--ink),transparent);opacity:.35
}
.flow-c-n{display:block;font-size:.82rem;color:var(--faint);margin-bottom:28px}
.flow-c h3{font-size:1.2rem;margin:0 0 10px}
.flow-c p{margin:0;color:var(--mute);font-size:.98rem;max-width:26ch}
.flow-c-t{
display:inline-block;margin-top:20px;font-size:.75rem;color:var(--ink-2);
padding:5px 12px;border-radius:999px;
background:rgba(255,255,255,.04);border:1px solid var(--line);box-shadow:none
}
@media (max-width:899px){
.flow-c{grid-template-columns:1fr 1fr;gap:0}
.flow-c li:nth-child(2){border-right:0}
.flow-c li:nth-child(1),.flow-c li:nth-child(2){border-bottom:1px solid var(--line);padding-bottom:28px}
}
@media (max-width:559px){.flow-c{grid-template-columns:1fr}.flow-c li{border-left:0!important;padding-left:0!important;border-bottom:1px solid var(--line);padding-bottom:28px}.flow-c li:last-child{border-bottom:0}}
.check-item{border-radius:22px;background:var(--surface);border-color:var(--line)}
.pack-rules,.price-extra,.pcard,.plan{border-radius:24px;background:var(--surface)}
.page-web,.page-srv,.page-sec,.page-game{--page-accent:#FFFFFF;--page-glow:rgba(255,255,255,.18)}
.page-web .phero h1 span,.page-srv .phero h1 span,.page-sec .phero h1 span,.page-game .phero h1 span{color:var(--ink-2)}
.page-web .check-dot,.page-srv .check-dot,.page-sec .check-dot,.page-game .check-dot{
border-color:rgba(255,255,255,.35);
background:radial-gradient(circle at center,#fff 0 38%,transparent 40%);
box-shadow:none
}
.page-web .hero-slot,.page-srv .hero-slot,.page-sec .hero-slot{
background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.08),transparent 55%),linear-gradient(160deg,#1A1A1A,#0A0A0A)
}
.page-web .phero,.page-srv .phero,.page-sec .phero{background:radial-gradient(ellipse at 20% 0%,rgba(255,255,255,.06),transparent 50%)}
.detail-hero{padding:clamp(72px,10vw,128px) 0 clamp(48px,6vw,72px);position:relative;overflow:hidden}
.detail-hero::before{content:none;display:none}
.detail-hero .wrap{position:relative}
.detail-kicker{
display:inline-flex;align-items:center;gap:10px;font-size:.85rem;color:var(--ink-2);
padding:8px 14px;border-radius:999px;margin-bottom:22px;
background:rgba(255,255,255,.04);border:1px solid var(--line);box-shadow:none
}
.detail-panel{
display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:start;
padding:clamp(28px,4vw,40px);border-radius:28px;border:1px solid var(--line);
background:linear-gradient(165deg,var(--surface),var(--bg-2))
}
.detail-panel h2{font-size:clamp(1.5rem,2.4vw,2rem);margin:0 0 12px}
.detail-panel p{color:var(--mute);margin:0 0 14px}
.detail-list{list-style:none;display:grid;gap:12px;margin:20px 0 0;padding:0}
.detail-list li{
display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;
background:rgba(255,255,255,.03);border:1px solid var(--line)
}
.detail-list li::before{
content:"";width:8px;height:8px;margin-top:7px;border-radius:50%;flex:none;
background:var(--ink);box-shadow:none
}
.detail-visual{
border-radius:24px;min-height:280px;border:1px solid var(--line);
background:
radial-gradient(circle at 30% 30%,color-mix(in srgb,var(--page-accent) 28%,transparent),transparent 50%),
linear-gradient(145deg,#222228,#141418);
display:grid;place-items:center;padding:32px;text-align:center;color:var(--mute)
}
.detail-visual strong{display:block;color:var(--ink);font-size:1.4rem;font-weight:500;margin-bottom:8px}
.detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(40px,6vw,72px)}
.detail-grid article{
padding:24px;border-radius:22px;border:1px solid var(--line);background:var(--surface)
}
.detail-grid h3{margin:0 0 8px;font-size:1.1rem}
.detail-grid p{margin:0;color:var(--mute);font-size:.95rem}
@media (max-width:899px){
.detail-panel{grid-template-columns:1fr}
.detail-grid{grid-template-columns:1fr}
}
.pfull{
border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--surface);
padding:0;display:grid;grid-template-columns:1.15fr .85fr;gap:0;margin-bottom:28px;align-items:stretch
}
.pfull figure{margin:0;border:0;border-radius:0;aspect-ratio:auto;min-height:280px}
.pfull figure img{height:100%;object-fit:cover}
.pfull>div{padding:clamp(24px,3vw,40px)}
.pfull:nth-child(even){grid-template-columns:.85fr 1.15fr}
.pfull:nth-child(even) figure{order:2}
@media (max-width:899px){
.pfull,.pfull:nth-child(even){grid-template-columns:1fr}
.pfull:nth-child(even) figure{order:0}
}
a.check-item{text-decoration:none;color:inherit;transition:border-color .2s,background .2s,transform .2s}
a.check-item:hover{border-color:color-mix(in srgb,var(--page-accent,#888) 45%,var(--line));background:var(--surface-2);transform:translateY(-2px)}
a.check-item:hover h3{color:var(--page-accent,#F2F2F0)}
.page-web .check-board{gap:14px}
.page-srv .check-board{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.page-sec .check-board{display:grid;grid-template-columns:1fr;gap:12px}
.page-sec .check-item{grid-template-columns:36px 1fr;padding:26px 28px}
@media (max-width:699px){.page-srv .check-board{grid-template-columns:1fr}}
.detail-lp .detail-visual{background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.12),transparent 45%),linear-gradient(160deg,#141414,#000)}
.detail-lp .detail-panel{background:linear-gradient(135deg,#161616,#0A0A0A)}
.detail-op .detail-visual{background:linear-gradient(180deg,rgba(255,255,255,.1),transparent 40%),linear-gradient(145deg,#161616,#000);border-radius:40px}
.detail-op .detail-grid{grid-template-columns:1fr;max-width:640px}
.detail-op .detail-grid article{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center}
.detail-co .detail-panel{grid-template-columns:1fr;gap:24px}
.detail-co .detail-visual{min-height:180px;border-radius:20px}
.detail-co .detail-grid{grid-template-columns:repeat(3,1fr)}
.detail-rl .detail-panel{background:linear-gradient(200deg,#1A1A1A 0%,#000 55%,#111 100%)}
.detail-se .detail-visual{background:radial-gradient(circle at 30% 70%,rgba(255,255,255,.1),transparent 50%),linear-gradient(160deg,#141414,#000)}
.detail-sm .detail-kicker{border-radius:12px}
.detail-sm .detail-grid article{border-left:3px solid #fff;border-radius:16px}
.detail-sb .detail-panel{border-radius:32px;background:linear-gradient(160deg,#141414,#0A0A0A)}
.detail-su .detail-list li{border-radius:12px}
.detail-ss .detail-visual{background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.12),transparent 55%),linear-gradient(145deg,#161616,#000)}
.detail-sc .detail-panel{border-radius:16px}
.detail-sc .detail-grid{grid-template-columns:1fr 1fr 1fr;gap:12px}
.detail-sf .detail-hero h1{max-width:16ch}
.detail-sf .detail-visual{clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);border-radius:0}
.detail-suw .detail-kicker{background:linear-gradient(90deg,rgba(255,255,255,.18),transparent)}
.detail-suw .detail-grid article{background:linear-gradient(180deg,#161616,#0A0A0A)}
@media (max-width:899px){
.detail-op .detail-grid article{grid-template-columns:1fr}
.detail-co .detail-grid,.detail-sc .detail-grid{grid-template-columns:1fr}
.detail-sf .detail-visual{clip-path:none;border-radius:24px}
}
.game-hero{
position:relative;min-height:min(92vh,920px);display:grid;align-items:center;
padding:clamp(100px,12vw,150px) 0 clamp(56px,8vw,96px);overflow:hidden;background:#000
}
.game-hero-media{position:absolute;inset:0}
.game-hero-video{
width:100%;height:100%;object-fit:cover;object-position:center;
filter:saturate(.85) contrast(1.05) brightness(.72)
}
.game-hero-veil{
position:absolute;inset:0;
background:
linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.35) 35%,rgba(0,0,0,.75) 78%,#000 100%),
linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 48%,rgba(0,0,0,.55) 100%)
}
.game-hero-grid{
position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
gap:clamp(28px,4vw,56px);align-items:center;width:100%
}
.game-hero-copy{max-width:520px}
.game-hero-kicker{
display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;
font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);
padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);
background:rgba(0,0,0,.35);backdrop-filter:blur(8px)
}
.game-hero h1{
font-size:clamp(2.6rem,6.5vw,5rem);letter-spacing:-.045em;line-height:.98;margin:0 0 18px;
text-shadow:0 8px 40px rgba(0,0,0,.55)
}
.game-hero h1 span{color:rgba(255,255,255,.72);font-weight:450}
.game-hero-lead{max-width:42ch;color:rgba(255,255,255,.82);font-size:clamp(1.05rem,1.5vw,1.18rem);margin:0 0 14px;line-height:1.55}
.game-hero-more{max-width:44ch;color:rgba(255,255,255,.68);font-size:.98rem;margin:0 0 28px;line-height:1.6}
.game-hero .btn-s{background:rgba(0,0,0,.35);border-color:rgba(255,255,255,.28);backdrop-filter:blur(6px)}
.game-hero-aside{display:flex;justify-content:center;align-items:center}
.game-hero-shot{
margin:0;width:100%;max-width:640px;border-radius:16px;overflow:hidden;
transform:rotate(3.5deg) translateY(6px);
border:1px solid var(--line);
box-shadow:0 28px 60px rgba(0,0,0,.65)
}
.game-hero-shot img{width:100%;height:auto;display:block;vertical-align:middle}
.game-split{padding-top:clamp(56px,8vw,96px)}
.game-split-in{
display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(28px,4vw,56px);align-items:center
}
.game-split-copy h2{margin:10px 0 16px}
.game-split-lead{color:var(--mute);max-width:48ch;margin:0 0 28px;font-size:1.05rem;line-height:1.65}
.game-feats{display:grid;gap:18px;margin:0 0 32px}
.game-feats article{
padding:0 0 18px;border-bottom:1px solid var(--line);background:transparent;border-radius:0
}
.game-feats article:last-child{border-bottom:0;padding-bottom:0}
.game-feats strong{
display:block;font-size:1.05rem;font-weight:500;letter-spacing:-.02em;margin:0 0 6px;color:var(--ink)
}
.game-feats p{margin:0;color:var(--mute);font-size:.98rem;line-height:1.55;max-width:48ch}
.game-split-visual{display:flex;justify-content:center;align-items:center;min-width:0}
.game-vid-window{
width:100%;max-width:760px;border-radius:18px;overflow:hidden;
background:#0C0C0C;border:1px solid var(--line);
box-shadow:0 32px 70px rgba(0,0,0,.55);
transform:rotate(1.25deg)
}
.game-vid-chrome{
display:flex;align-items:center;gap:8px;padding:12px 14px;
background:#141414;border-bottom:1px solid var(--line)
}
.game-vid-chrome span{
width:10px;height:10px;border-radius:50%;flex:none
}
.game-vid-chrome span:nth-child(1){background:#FF5F57}
.game-vid-chrome span:nth-child(2){background:#FEBC2E}
.game-vid-chrome span:nth-child(3){background:#28C840}
.game-vid-chrome em{
margin-left:10px;font-style:normal;font-size:.78rem;letter-spacing:.04em;
color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.game-vid-screen{position:relative;aspect-ratio:16/10;background:#000}
.game-vid{
width:100%;height:100%;object-fit:cover;display:block;
pointer-events:none
}
.game-panels-shell{position:relative;margin-top:8px;padding:0;overflow:visible}
.game-panels-shell::before,.game-panels-shell::after{content:none;display:none}
.game-panels{
position:relative;z-index:1;
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px
}
.game-panel{
position:relative;isolation:isolate;overflow:hidden;border-radius:20px;
min-height:clamp(400px,50vw,540px);border:1px solid var(--line);
display:flex;align-items:flex-end;color:inherit;background:#111;box-shadow:none
}
.game-panel>picture{display:contents}
.game-panel>img,.game-panel>picture>img{
position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
transition:transform .55s var(--ease);z-index:0
}
.game-panel-veil{
position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.25) 42%,rgba(0,0,0,.88) 100%)
}
.game-panel-body{
position:relative;z-index:2;padding:22px 20px 24px;width:100%;
display:flex;flex-direction:column;justify-content:flex-end;gap:8px
}
.game-panel h3{
margin:0;font-size:clamp(1.15rem,1.4vw,1.35rem);letter-spacing:-.02em;
text-shadow:0 2px 16px rgba(0,0,0,.6)
}
.game-panel p{
margin:0;color:rgba(255,255,255,.78);font-size:.9rem;line-height:1.45;
max-width:28ch;text-shadow:0 2px 12px rgba(0,0,0,.5)
}
.game-panel:hover>img,.game-panel:hover>picture>img{transform:scale(1.04)}
.game-panel:hover{border-color:var(--line-2)}
.game-flow{position:relative;padding:clamp(64px,9vw,110px) 0;background:#000}
.game-flow::before{content:none;display:none}
.game-flow .wrap{position:relative;z-index:1}
.game-flow-head{max-width:52ch;margin-bottom:clamp(28px,4vw,44px)}
.game-flow-head h2{margin:8px 0 12px}
.game-flow-head p{margin:0;color:var(--mute);font-size:1.05rem}
.game-steps{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px
}
.game-step{
position:relative;padding:28px 24px;border-radius:20px;
border:1px solid var(--line);background:var(--surface);overflow:hidden
}
.game-step::before{content:none;display:none}
.game-step-badge{
display:inline-flex;align-items:center;
font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
padding:6px 12px;border-radius:999px;margin-bottom:18px;color:var(--ink-2);
background:rgba(255,255,255,.06);border:1px solid var(--line)
}
.game-step h3{margin:0 0 10px;font-size:1.2rem}
.game-step p{margin:0;color:var(--mute);font-size:.96rem;line-height:1.55}
.game-flow-band{
display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
padding:24px 28px;border-radius:20px;border:1px solid var(--line);background:var(--surface)
}
.game-flow-band::before{content:none;display:none}
.game-flow-band strong{display:block;font-size:1.1rem;font-weight:500;margin-bottom:4px}
.game-flow-band p{margin:0;color:var(--mute);max-width:46ch}
@media (max-width:1099px){
.game-panels{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.game-panel{min-height:360px}
.game-steps{grid-template-columns:1fr 1fr}
}
@media (max-width:899px){
.game-split-in{grid-template-columns:1fr}
.game-hero{min-height:auto;align-items:start}
.game-hero-grid{grid-template-columns:1fr;gap:36px}
.game-hero-aside{order:-1}
.game-hero-shot{transform:rotate(2deg);max-width:100%}
.game-split-visual{order:-1}
.game-vid-window{transform:rotate(.6deg);max-width:100%}
.game-panels-shell{padding:16px 0 0}
}
@media (max-width:559px){
.game-panels{grid-template-columns:1fr}
.game-panel{min-height:320px}
.game-steps{grid-template-columns:1fr}
.game-hero-shot{transform:none}
.game-vid-window{transform:none}
.game-flow-band{flex-direction:column;align-items:flex-start}
}
.pfull{box-shadow:0 24px 60px -40px rgba(0,0,0,.7)}
.pfull .mute{
display:inline-flex;padding:6px 12px;border-radius:999px;margin-bottom:12px;
background:rgba(255,255,255,.04);border:1px solid var(--line);box-shadow:none
}
.pfull dd{padding:6px 12px;border-radius:999px;background:var(--bg-2);border:1px solid var(--line);font-size:.88rem;color:var(--ink-2);width:fit-content}
.drawer,.menu-open .hd{background:#000}
.doc-hero{
padding:clamp(88px,11vw,128px) 0 clamp(48px,6vw,72px);
border-bottom:1px solid var(--line);
background:linear-gradient(180deg,#0C0C0E 0%,var(--bg) 100%)
}
.doc-hero-rich{padding:clamp(96px,12vw,140px) 0 clamp(56px,7vw,88px)}
.doc-hero-grid{
display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
gap:clamp(32px,5vw,64px);align-items:center
}
.doc-hero-copy{text-align:left;max-width:540px}
.doc-hero .crumb{margin-bottom:24px}
.doc-hero .eyebrow{margin-bottom:16px}
.doc-hero h1{
margin:0 0 20px;max-width:14ch;text-align:left;text-wrap:pretty;
font-size:clamp(2.45rem,5.2vw,4.1rem);letter-spacing:-.042em;line-height:1.02
}
.doc-hero .lead{
max-width:42ch;margin:0 0 28px;color:var(--mute);text-align:left;
font-size:clamp(1.05rem,1.35vw,1.18rem);line-height:1.65
}
.doc-hero .btns{justify-content:flex-start;gap:12px}
.doc-hero-media{min-width:0}
.doc-jump{
display:flex;flex-wrap:wrap;gap:8px;margin-top:36px;padding-top:24px;
border-top:1px solid var(--line);justify-content:flex-start
}
.doc-jump a{
text-decoration:none;font-size:.86rem;color:var(--mute);padding:9px 14px;border-radius:999px;
border:1px solid var(--line);background:rgba(255,255,255,.025);
transition:color .18s,border-color .18s,background .18s
}
.doc-jump a:hover{color:var(--ink);border-color:var(--line-2);background:rgba(255,255,255,.05)}
.doc-narrow,.doc-flow{max-width:720px;margin-left:auto;margin-right:auto;text-align:left}
.doc-overview{padding:clamp(56px,8vw,96px) 0;border-bottom:1px solid var(--line)}
.doc-overview-in{
display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:clamp(32px,5vw,64px);align-items:center
}
.doc-overview-copy h2{margin:10px 0 18px;max-width:16ch;letter-spacing:-.035em}
.doc-overview-copy p{color:var(--mute);font-size:1.08rem;line-height:1.7;margin:0 0 16px;max-width:48ch}
.doc-feature{
padding:clamp(56px,8vw,100px) 0;border-top:1px solid var(--line);scroll-margin-top:100px
}
.doc-feature-in{
display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
gap:clamp(32px,5vw,64px);align-items:center
}
.doc-feature-flip .doc-feature-in{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.doc-feature-flip .doc-feature-copy{order:2}
.doc-feature-flip .doc-feature-media{order:1}
.doc-feature-copy{text-align:left;max-width:520px}
.doc-feature-copy h2{margin:0 0 16px;max-width:16ch;letter-spacing:-.035em;font-size:clamp(1.6rem,2.6vw,2.2rem)}
.doc-feature-copy>p{color:var(--mute);font-size:1.05rem;line-height:1.7;margin:0 0 14px;max-width:48ch}
.doc-feature-media{min-width:0}
.doc-media-win{max-width:none;width:100%;transform:none}
.doc-media-win .game-vid-screen img{
width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0
}
.doc-kicker{
font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0 0 14px
}
.doc-list{
list-style:none;display:grid;gap:0;margin:28px 0 0;padding:0;max-width:46ch;
border-top:1px solid var(--line)
}
.doc-list li{
position:relative;padding:14px 0 14px 22px;color:var(--ink-2);font-size:.98rem;line-height:1.55;
border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent
}
.doc-list li::before{
content:"";position:absolute;left:0;top:1.35em;width:6px;height:1px;border-radius:0;background:var(--faint)
}
.doc-note{
margin:40px 0 0;padding:0;border:0;border-top:1px solid var(--line);border-radius:0;
background:transparent;color:var(--mute);font-size:.98rem;line-height:1.65;max-width:46ch;
padding-top:22px
}
.doc-note strong{
display:block;color:var(--ink);font-weight:500;margin:0 0 8px;font-size:.78rem;
letter-spacing:.1em;text-transform:uppercase
}
@media (max-width:899px){
.doc-hero-grid,.doc-overview-in,.doc-feature-in,.doc-feature-flip .doc-feature-in{grid-template-columns:1fr}
.doc-feature-flip .doc-feature-copy,.doc-feature-flip .doc-feature-media{order:0}
}
.media-ph{
position:absolute;inset:0;display:grid;place-content:center;gap:10px;text-align:center;
background:linear-gradient(160deg,#161618,#0A0A0B 60%);
border:0
}
.media-ph span{
display:inline-flex;padding:6px 12px;border-radius:999px;font-size:.72rem;font-weight:600;
letter-spacing:.1em;text-transform:uppercase;color:var(--ink);
border:1px solid var(--line-2);background:rgba(255,255,255,.06)
}
.media-ph em{font-style:normal;color:var(--mute);font-size:.92rem;max-width:28ch;line-height:1.4}
.game-hero-shot{position:relative;aspect-ratio:16/10;background:#0A0A0A;overflow:hidden}
.game-panel>.media-ph{z-index:0}
.game-vid-screen>.media-ph,.game-vid-screen>.viz{position:absolute;inset:0}
.viz-screen{position:relative;overflow:hidden;background:#0B0B0C}
.viz{position:absolute;inset:0;padding:22px;color:var(--ink-2);font-size:.82rem}
.viz-site{display:grid;grid-template-rows:auto 1fr auto;gap:14px;background:#0E0E10}
.viz-site-nav{display:flex;align-items:center;gap:8px;height:28px}
.viz-site-nav i{width:36px;height:6px;border-radius:3px;background:rgba(255,255,255,.12)}
.viz-site-nav b{margin-left:auto;width:52px;height:18px;border-radius:9px;background:rgba(255,255,255,.88)}
.viz-site-hero{display:grid;align-content:center;gap:10px;padding:28px 18px;border-radius:12px;background:linear-gradient(135deg,#1A1A1E,#101012);border:1px solid var(--line)}
.viz-site-hero span{display:block;height:10px;width:55%;border-radius:4px;background:rgba(255,255,255,.55)}
.viz-site-hero .s2{width:38%;height:8px;background:rgba(255,255,255,.2)}
.viz-site-hero em{display:block;width:72px;height:22px;border-radius:11px;background:#F4F4F2;margin-top:6px}
.viz-site-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.viz-site-grid i{height:52px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.viz-wire{display:grid;grid-template-columns:1fr 1.2fr;gap:16px;background:#0E0E10}
.viz-wire-col{display:grid;gap:10px;align-content:start}
.viz-wire-col span{display:block;height:12px;border-radius:4px;background:rgba(255,255,255,.08);border:1px solid var(--line)}
.viz-wire-col .lg{height:72px;background:rgba(255,255,255,.04)}
.viz-phone{display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#1A1A1E,#0A0A0B)}
.viz-phone-bezel{width:min(46%,168px);aspect-ratio:9/17;border-radius:22px;padding:8px;border:1px solid #2A2A2E;background:#111;box-shadow:0 24px 50px rgba(0,0,0,.55)}
.viz-phone-notch{width:42%;height:6px;margin:4px auto 10px;border-radius:4px;background:#1C1C1F}
.viz-phone-screen{display:grid;gap:8px;padding:4px 6px}
.viz-phone-screen b{height:9px;width:70%;border-radius:3px;background:rgba(255,255,255,.5)}
.viz-phone-screen span{height:6px;width:88%;border-radius:3px;background:rgba(255,255,255,.14)}
.viz-phone-screen .s2{width:62%}
.viz-phone-cards{display:grid;gap:6px;margin-top:4px}
.viz-phone-cards i{height:36px;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.viz-phone-screen em{height:24px;border-radius:12px;background:#F4F4F2;margin-top:8px}
.viz-map{display:grid;place-content:center;gap:18px;text-align:center;background:#0E0E10}
.viz-map-node{display:inline-flex;margin:0 auto;padding:8px 14px;border-radius:8px;border:1px solid var(--line-2);background:rgba(255,255,255,.06);font-size:.8rem;color:var(--ink)}
.viz-map-lines{width:1px;height:18px;margin:0 auto;background:var(--line-2)}
.viz-map-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.viz-map-row span{padding:7px 11px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.75rem;color:var(--mute)}
.viz-cta{display:grid;align-content:center;gap:12px;padding:28px;background:linear-gradient(160deg,#141416,#0C0C0E)}
.viz-cta-kicker{width:64px;height:6px;border-radius:3px;background:rgba(255,255,255,.2)}
.viz-cta strong{display:block;height:12px;width:70%;border-radius:4px;background:rgba(255,255,255,.55)}
.viz-cta p{height:8px;width:88%;border-radius:3px;background:rgba(255,255,255,.12);margin:0}
.viz-cta-btn{width:96px;height:28px;border-radius:14px;background:#F4F4F2;margin:4px 0 8px}
.viz-cta ul{list-style:none;display:grid;gap:8px;margin:0;padding:0}
.viz-cta li{height:7px;width:55%;border-radius:3px;background:rgba(255,255,255,.1)}
.viz-cta li:nth-child(2){width:48%}.viz-cta li:nth-child(3){width:40%}
.viz-status{display:grid;gap:14px;background:#0E0E10;padding:20px}
.viz-status-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--line);padding-bottom:12px}
.viz-status-h span{color:var(--faint);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.viz-status-h b{font-weight:500;font-size:.85rem;color:#D4D4D0}
.viz-status ul{list-style:none;display:grid;gap:10px;margin:0;padding:0}
.viz-status li{display:grid;grid-template-columns:10px 1fr auto;gap:12px;align-items:center}
.viz-status i{width:8px;height:8px;border-radius:50%}
.viz-status i.ok{background:#9AE6B4}
.viz-status i.warn{background:#E8D48A}
.viz-status em{font-style:normal;color:var(--faint);font-variant-numeric:tabular-nums}
.viz-term{display:grid;grid-template-rows:auto 1fr;padding:0;background:#0A0A0B}
.viz-term-bar{display:flex;align-items:center;gap:7px;padding:10px 12px;background:#141414;border-bottom:1px solid var(--line)}
.viz-term-bar i{width:9px;height:9px;border-radius:50%;background:#3A3A3E}
.viz-term-bar i:nth-child(1){background:#FF5F57}
.viz-term-bar i:nth-child(2){background:#FEBC2E}
.viz-term-bar i:nth-child(3){background:#28C840}
.viz-term-bar em{margin-left:8px;font-style:normal;font-size:.72rem;color:var(--faint)}
.viz-term pre{margin:0;padding:16px 14px;overflow:auto;font:400 .78rem/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#C8C8C4}
.viz-term .c{color:#6B7280}
.viz-term .ok{color:#9AE6B4}
.viz-chart{display:grid;grid-template-rows:auto 1fr auto;gap:14px;background:#0E0E10}
.viz-chart-h{display:flex;justify-content:space-between;color:var(--mute);font-size:.78rem}
.viz-chart-h em{font-style:normal;color:var(--faint)}
.viz-chart-bars{display:flex;align-items:flex-end;gap:6px;min-height:120px;padding:0 2px}
.viz-chart-bars i{flex:1;height:var(--h,40%);border-radius:4px 4px 0 0;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.08));border:1px solid rgba(255,255,255,.08)}
.viz-chart-meta{display:flex;gap:16px;color:var(--faint);font-size:.75rem;font-variant-numeric:tabular-nums}
.viz-backup{display:grid;grid-template-columns:auto 1fr;gap:12px 18px;align-items:center;background:#0E0E10}
.viz-backup-ring{
width:64px;height:64px;border-radius:50%;display:grid;place-items:center;
border:2px solid rgba(154,230,180,.45);color:#9AE6B4;font-weight:600;font-size:.8rem;
box-shadow:inset 0 0 0 6px rgba(154,230,180,.06)
}
.viz-backup-copy{display:grid;gap:4px}
.viz-backup-copy b{font-weight:500;font-size:.9rem;color:var(--ink)}
.viz-backup-copy em{font-style:normal;color:var(--mute);font-size:.8rem}
.viz-backup ul{grid-column:1/-1;list-style:none;display:grid;gap:8px;margin:8px 0 0;padding:0;color:var(--mute);font-size:.8rem}
.viz-backup li{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.02)}
.viz-shield{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:radial-gradient(circle at 30% 40%,#161618,#0A0A0B)}
.viz-shield-mark{width:72px;height:80px;color:rgba(244,244,242,.85)}
.viz-shield-mark svg{width:100%;height:100%}
.viz-shield ul{list-style:none;display:grid;gap:10px;margin:0;padding:0}
.viz-shield li{display:flex;align-items:center;gap:10px;color:var(--ink-2);font-size:.88rem}
.viz-shield li i{width:6px;height:6px;border-radius:50%;background:var(--ink);flex:none}
.viz-scan{display:grid;gap:12px;align-content:center;background:#0E0E10}
.viz-scan-h{display:flex;justify-content:space-between;font-size:.78rem;color:var(--mute);padding-bottom:8px;border-bottom:1px solid var(--line)}
.viz-scan-h em{font-style:normal;color:var(--faint)}
.viz-scan-row{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.viz-scan-row b{font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.viz-scan-row.hi b{color:#F0A8A0}.viz-scan-row.mid b{color:#E8D48A}.viz-scan-row.low b{color:#A8B0BC}
.viz-scan-row span{color:var(--mute);font-size:.84rem}
.viz-fw{display:grid;gap:12px;align-content:center;background:#0E0E10}
.viz-fw-h{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.viz-fw-rule{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.viz-fw-rule span{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:500}
.viz-fw-rule em{font-style:normal;font-size:.8rem}
.viz-fw-rule.allow em{color:#9AE6B4}.viz-fw-rule.deny em{color:#F0A8A0}
.viz-alert{display:grid;gap:8px;align-content:center;padding:28px;background:linear-gradient(160deg,#141416,#0C0C0E);position:relative}
.viz-alert-pulse{width:10px;height:10px;border-radius:50%;background:#F0A8A0;box-shadow:0 0 0 0 rgba(240,168,160,.5);animation:viz-pulse 2.2s ease-out infinite}
@keyframes viz-pulse{0%{box-shadow:0 0 0 0 rgba(240,168,160,.45)}70%{box-shadow:0 0 0 12px rgba(240,168,160,0)}100%{box-shadow:0 0 0 0 rgba(240,168,160,0)}}
.viz-alert b{font-weight:500;font-size:.95rem;color:var(--ink)}
.viz-alert>em{font-style:normal;color:var(--mute);font-size:.84rem}
.viz-alert-log{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.viz-alert-log span{padding:6px 10px;border-radius:6px;border:1px solid var(--line);font-size:.75rem;color:var(--faint);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.viz-rbx-shot{
position:absolute;inset:0;display:grid;place-content:center;gap:8px;text-align:center;
background:
linear-gradient(160deg,rgba(20,20,22,.2),rgba(0,0,0,.55)),
radial-gradient(ellipse at 60% 40%,#2A2A30,#0A0A0B 70%)
}
.viz-rbx-shot span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.viz-rbx-shot em{font-style:normal;color:rgba(255,255,255,.45);font-size:.9rem}
.viz-rbx .viz-site-hero{background:linear-gradient(135deg,#1C1C22,#0E0E12)}
.viz-game{
display:grid;grid-template-rows:auto 1fr auto;gap:12px;width:100%;max-width:300px;
padding:14px;border-radius:14px;background:#0E0E10;border:1px solid var(--line)
}
.viz-game-bar{display:flex;align-items:center;gap:6px}
.viz-game-bar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.2)}
.viz-game-bar i:nth-child(1){background:#FF5F57}
.viz-game-bar i:nth-child(2){background:#FEBC2E}
.viz-game-bar i:nth-child(3){background:#28C840}
.viz-game-bar em{margin-left:auto;font-style:normal;font-size:.68rem;color:var(--faint);letter-spacing:.04em}
.viz-game-stage{
position:relative;aspect-ratio:16/10;border-radius:10px;overflow:hidden;
background:linear-gradient(145deg,#1A1A1E 0%,#0C0C0E 55%,#14141A 100%);
border:1px solid var(--line)
}
.viz-game-stage span{
position:absolute;left:12%;bottom:18%;width:28%;height:42%;border-radius:8px 8px 4px 4px;
background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.08)
}
.viz-game-stage .s2{left:auto;right:14%;bottom:22%;width:22%;height:34%;opacity:.7}
.viz-game-stage b{
position:absolute;left:50%;top:28%;width:18%;height:48%;transform:translateX(-50%);
border-radius:10px 10px 6px 6px;background:rgba(255,255,255,.22);
box-shadow:0 12px 28px -12px rgba(0,0,0,.8)
}
.viz-game-hud{display:flex;gap:8px}
.viz-game-hud i{flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.1)}
.viz-game-hud i:first-child{flex:1.4;background:rgba(255,255,255,.2)}
.game-panel-css .game-panel-bg{position:absolute;inset:0;z-index:0}
.game-panel-css .gp-a{background:radial-gradient(ellipse at 30% 20%,#2A2A32 0%,#101012 55%,#0A0A0B 100%)}
.game-panel-css .gp-b{background:radial-gradient(ellipse at 70% 30%,#242428 0%,#0E0E10 50%,#080808 100%)}
.game-panel-css .gp-c{background:linear-gradient(145deg,#1A1A1E 0%,#0C0C0E 45%,#121218 100%)}
.game-panel-css .gp-d{background:radial-gradient(circle at 50% 80%,#222228 0%,#0A0A0B 60%)}
.game-panel-css .game-panel-bg::after{
content:"";position:absolute;inset:18% 12% auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)
}
.game-panel-css:hover .game-panel-bg{filter:brightness(1.08);transition:filter .4s var(--ease)}
@media (prefers-reduced-motion:reduce){.viz-alert-pulse{animation:none}}
.doc-dev{padding:clamp(64px,9vw,112px) 0;border-top:1px solid var(--line);background:#080808}
.doc-dev-in{
display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:center;
max-width:1080px;margin:0 auto
}
.doc-dev-copy h2{margin:10px 0 14px;letter-spacing:-.035em}
.doc-dev-copy>p{color:var(--mute);max-width:38ch;margin:0 0 28px;line-height:1.65;font-size:1.05rem}
.doc-stats{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0}
.doc-stats li{display:grid;gap:4px}
.doc-stats strong{font-size:1.05rem;font-weight:500}
.doc-stats span{font-size:.85rem;color:var(--mute);line-height:1.35}
.codebox{min-width:0}
.codebox-frame{
border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#0C0C0C;
box-shadow:0 28px 60px rgba(0,0,0,.45)
}
.codebox-bar{
display:flex;align-items:center;justify-content:space-between;gap:12px;
padding:12px 14px;background:#141414;border-bottom:1px solid var(--line)
}
.codebox-dots{display:flex;gap:8px}
.codebox-dots i{width:10px;height:10px;border-radius:50%;display:block}
.codebox-dots i:nth-child(1){background:#FF5F57}
.codebox-dots i:nth-child(2){background:#FEBC2E}
.codebox-dots i:nth-child(3){background:#28C840}
.codebox-copy{
appearance:none;border:1px solid var(--line);background:rgba(255,255,255,.04);
color:var(--ink-2);font:500 .8rem/1 Inter,sans-serif;padding:7px 12px;border-radius:999px;cursor:pointer
}
.codebox-copy:hover,.codebox-copy.is-done{color:var(--ink);border-color:var(--line-2)}
.codebox-pre{
margin:0;padding:20px 18px 24px;overflow:auto;max-height:340px;
font:400 .82rem/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#D4D4D8
}
.codebox-pre code{white-space:pre;font:inherit}
.tok-cmt{color:#6B7280;font-style:italic}
.tok-str{color:#86EFAC}
.tok-num{color:#FDBA74}
.tok-kw{color:#F9A8D4}
.tok-tag{color:#93C5FD}
.tok-attr{color:#FCD34D}
.tok-pun{color:#A1A1AA}
.tok-fn{color:#7DD3FC}
.tok-prop{color:#C4B5FD}
.tok-sel{color:#5EEAD4}
.codebox-pre code .tok-kw,.codebox-pre code .tok-tag,.codebox-pre code .tok-str,
.codebox-pre code .tok-num,.codebox-pre code .tok-attr,.codebox-pre code .tok-fn,
.codebox-pre code .tok-prop,.codebox-pre code .tok-sel,.codebox-pre code .tok-cmt{font-weight:inherit}
.codebox-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.codebox-tabs button{
appearance:none;border:0;background:transparent;color:var(--mute);
font:500 .88rem/1 Inter,sans-serif;padding:9px 14px;border-radius:999px;cursor:pointer
}
.codebox-tabs button[aria-selected=true]{
background:rgba(255,255,255,.08);color:var(--ink)
}
.codebox-tabs button:hover{color:var(--ink)}
@media (max-width:899px){
.doc-split,.doc-dev-in{grid-template-columns:1fr}
.doc-aside{position:static}
.doc-stats{grid-template-columns:1fr;gap:14px}
.rbx-hero-grid{grid-template-columns:1fr;gap:36px}
.rbx-hero{min-height:0;padding:clamp(72px,12vw,100px) 0 48px}
.rbx-hero-media{min-height:240px;aspect-ratio:16/10}
}
.page-rbx{--rbx:#C8C8C8;--rbx-accent:#E8E8E8}
.rbx-hero{
position:relative;padding:clamp(96px,12vw,136px) 0 clamp(56px,8vw,88px);
border-bottom:1px solid var(--line);
background:
radial-gradient(ellipse 70% 55% at 85% 20%,rgba(255,255,255,.04),transparent 60%),
linear-gradient(180deg,#0C0C0E 0%,var(--bg) 100%)
}
.rbx-hero-grid{
position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);
gap:clamp(36px,6vw,72px);align-items:center;
max-width:1120px;margin:0 auto
}
.rbx-hero-copy{text-align:left;padding-right:clamp(0px,2vw,24px)}
.rbx-pill{
display:inline-flex;align-items:center;margin:0 0 20px;padding:0;
font-size:.875rem;letter-spacing:0;text-transform:none;color:var(--mute);
background:transparent;border:0;border-radius:0
}
.rbx-pill::before{
content:"";width:6px;height:6px;border-radius:50%;background:var(--ink);margin-right:10px
}
.rbx-hero h1{
margin:0 0 20px;font-size:clamp(2.5rem,5.2vw,4.2rem);letter-spacing:-.042em;line-height:1.02;
text-wrap:pretty;max-width:12ch
}
.rbx-hero h1 span{color:var(--ink-2)}
.rbx-hero .lead{max-width:40ch;margin:0 0 32px;color:var(--mute);font-size:1.1rem;line-height:1.65}
.rbx-hero-media{
position:relative;min-height:clamp(280px,36vw,440px);border-radius:20px;
border:1px solid var(--line);background:#0A0A0A;overflow:hidden;
box-shadow:0 36px 80px -36px rgba(0,0,0,.85)
}
.rbx-hero-media video,.rbx-hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.rbx-video-ph{
position:absolute;inset:0;display:grid;place-content:center;gap:10px;text-align:center;
background:linear-gradient(160deg,#121214 0%,#0A0A0B 55%,#0E0E10 100%)
}
.rbx-video-ph span{
font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:500
}
.rbx-video-ph p{margin:0;color:var(--mute);font-size:.95rem}
.rbx-wide{
max-width:720px;margin:0 auto;padding:0 clamp(0px,2vw,12px);text-align:left
}
.rbx-intro{padding:clamp(64px,9vw,110px) 0;border-bottom:1px solid var(--line)}
.rbx-intro h2{margin:10px 0 20px;max-width:16ch;letter-spacing:-.035em}
.rbx-intro p{color:var(--mute);font-size:1.1rem;line-height:1.75;margin:0 0 18px;max-width:48ch}
.rbx-block{padding:clamp(64px,9vw,110px) 0;scroll-margin-top:100px}
.rbx-block.rbx-alt{
background:#080808;border-top:1px solid var(--line);border-bottom:1px solid var(--line)
}
.rbx-step{
margin:0 0 14px;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
color:var(--faint);font-variant-numeric:tabular-nums
}
.rbx-block h2{margin:0 0 18px;font-size:clamp(1.75rem,3vw,2.4rem);max-width:14ch;letter-spacing:-.035em}
.rbx-block p{color:var(--mute);font-size:1.08rem;line-height:1.75;margin:0 0 8px;max-width:48ch}
.rbx-block .doc-list{margin-top:28px}
.rbx-cta{
padding:clamp(80px,11vw,128px) 0;border-top:1px solid var(--line);text-align:left;
background:linear-gradient(180deg,var(--bg) 0%,#0C0C0E 100%)
}
.rbx-cta .rbx-wide{display:grid;justify-items:start}
.rbx-cta h2{margin:0 0 14px;max-width:12ch;letter-spacing:-.035em}
.rbx-cta p{color:var(--mute);margin:0 0 32px;max-width:40ch;font-size:1.08rem;line-height:1.65}
.game-rbx-teaser{
display:grid;grid-template-columns:auto 1fr auto;gap:20px 28px;align-items:center;
padding:28px 32px;border:1px solid var(--line);border-radius:20px;background:var(--surface);
text-decoration:none;color:inherit;transition:border-color .2s,background .2s;
max-width:920px;margin:0 auto
}
.game-rbx-teaser:hover{border-color:var(--line-2);background:#161618}
.game-rbx-teaser-mark{
width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--ink);flex:none
}
.game-rbx-teaser-mark svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}
.game-rbx-eye{margin-bottom:8px}
.game-rbx-teaser h3{margin:0 0 6px;font-size:1.25rem}
.game-rbx-teaser p{margin:0;color:var(--mute);font-size:.98rem;max-width:48ch}
.game-rbx-teaser-go{font-size:.9rem;color:var(--ink);border-bottom:1px solid var(--line-2);padding-bottom:2px;white-space:nowrap}
@media (max-width:719px){
.game-rbx-teaser{grid-template-columns:44px 1fr;gap:14px 16px}
.game-rbx-teaser-go{grid-column:2}
}
.hd{
background:rgba(0,0,0,.72);
backdrop-filter:saturate(1.2) blur(16px);
-webkit-backdrop-filter:saturate(1.2) blur(16px);
border-bottom:1px solid transparent;
transition:border-color .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease)
}
.hd.is-scrolled,.menu-open .hd{
background:rgba(0,0,0,.92)!important;
border-bottom-color:var(--line);
box-shadow:0 12px 40px -24px rgba(0,0,0,.8)
}
.hd-in{height:70px}
.logo{gap:8px;transition:opacity .2s}
.logo:hover{opacity:.88}
.logo b{letter-spacing:-.03em}
.logo span{letter-spacing:-.01em}
.nav>a,.nav-item>button{
position:relative;color:var(--mute);font-weight:450;
transition:color .2s var(--ease),background .2s var(--ease)
}
.nav>a:hover,.nav-item>button:hover,.nav-item>button[aria-expanded=true]{
background:rgba(255,255,255,.06);color:var(--ink)
}
.nav a[aria-current=page],.nav-item>button.is-current{color:var(--ink);font-weight:500}
.nav a[aria-current=page]::after{
content:"";position:absolute;left:14px;right:14px;bottom:6px;height:1px;
background:rgba(255,255,255,.35)
}
.hd-cta{
box-shadow:0 0 0 1px rgba(255,255,255,.06),0 8px 24px -12px rgba(255,255,255,.25);
transition:box-shadow .25s var(--ease),background .2s,transform .2s
}
.hd-cta:hover{box-shadow:0 0 0 1px rgba(255,255,255,.12),0 12px 28px -10px rgba(255,255,255,.35)}
.menu-btn{
background:rgba(255,255,255,.04);border-color:var(--line-2);
transition:background .2s,border-color .2s
}
.menu-btn:hover{background:rgba(255,255,255,.08);border-color:#3A3A3A}
.drawer{inset:70px 0 0}
.mega{
background:rgba(8,8,8,.96)!important;
backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
box-shadow:0 40px 80px -40px rgba(0,0,0,.9)
}
.mega-in>div{
box-shadow:0 0 0 0 transparent
}
.svc-card{
box-shadow:0 0 28px -18px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.04);
transition:border-color .25s var(--ease),background .25s var(--ease),box-shadow .3s var(--ease),transform .25s var(--ease)
}
.svc-card:hover,.svc-card:focus-visible{
border-color:#3A3A3A;
box-shadow:
0 0 0 1px rgba(255,255,255,.06),
0 0 40px -12px rgba(255,255,255,.14),
0 24px 48px -32px rgba(0,0,0,.8);
transform:translateY(-2px)
}
@media (prefers-reduced-motion:reduce){
.svc-card:hover,.svc-card:focus-visible{transform:none}
}
.hero-c{position:relative;overflow:hidden}
.hero-c-aside{max-width:520px;width:100%}
.hero-c .game-vid-window{
width:100%;max-width:100%;transform:none;margin:0;
box-shadow:0 40px 80px -40px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.06)
}
.hero-c .game-vid-screen{aspect-ratio:16/10}
.hero-c .game-vid-screen img{
width:100%;height:100%;object-fit:cover;display:block
}
.hero-shot-stack{display:grid;gap:14px;width:100%}
.hero-shot-stack .game-hero-shot{
margin:0;border-radius:18px;overflow:hidden;
border:1px solid var(--line);aspect-ratio:16/10;
box-shadow:0 28px 60px -36px rgba(0,0,0,.85)
}
.hero-shot-stack .game-hero-shot img{width:100%;height:100%;object-fit:cover}
.hero-slot:empty,.hero-slot.media-ph{
display:grid;place-items:center;gap:8px;text-align:center;
aspect-ratio:16/10;min-height:0;border-radius:18px;
border:1px dashed var(--line-2);
background:linear-gradient(160deg,#141414,#0A0A0A)
}
.media-ph strong{font-size:.85rem;font-weight:500;color:var(--ink-2);letter-spacing:.02em}
.media-ph em{font-style:normal;color:var(--faint);font-size:.85rem}
.sec-flow .flow-c{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
border:0;padding:0;background:transparent
}
.sec-flow .flow-c li{
position:relative;padding:28px 24px;margin:0;
border:1px solid var(--line)!important;border-radius:20px;
background:var(--surface);overflow:hidden;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
transition:border-color .2s,box-shadow .25s
}
.sec-flow .flow-c li:hover{
border-color:#333!important;
box-shadow:0 0 36px -14px rgba(255,255,255,.1),inset 0 1px 0 rgba(255,255,255,.05)
}
.sec-flow .flow-c li+li{padding:28px 24px;border-left:1px solid var(--line)!important}
.sec-flow .flow-c li::before{content:none;display:none}
.sec-flow .flow-c-n{
display:inline-flex;align-items:center;margin-bottom:18px;
font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
padding:6px 12px;border-radius:999px;color:var(--ink-2);
background:rgba(255,255,255,.06);border:1px solid var(--line)
}
.sec-flow .flow-c h3{font-size:1.2rem;margin:0 0 10px}
.sec-flow .flow-c p{margin:0;color:var(--mute);font-size:.96rem;line-height:1.55;max-width:none}
.sec-flow .flow-c-t{
margin-top:18px;font-size:.75rem;color:var(--ink-2);
padding:5px 12px;border-radius:999px;
background:rgba(255,255,255,.04);border:1px solid var(--line)
}
@media (max-width:899px){
.sec-flow .flow-c{grid-template-columns:1fr 1fr;gap:14px}
.sec-flow .flow-c li,.sec-flow .flow-c li+li{padding:28px 24px}
}
@media (max-width:559px){
.sec-flow .flow-c{grid-template-columns:1fr}
}
.phero-compact,.legal-hero{
padding:clamp(40px,6vw,72px) 0 clamp(28px,4vw,40px);
border-bottom:1px solid var(--line)
}
.phero-compact h1,.legal-hero h1{
font-size:clamp(1.65rem,2.8vw,2.15rem);
letter-spacing:-.03em;line-height:1.15;
max-width:28ch;font-weight:500;margin:0
}
.phero-compact .lead,.legal-hero .lead{
margin-top:12px;max-width:48ch;
font-size:clamp(1rem,1.15vw,1.1rem);color:var(--mute)
}
.phero-compact .crumb,.legal-hero .crumb{margin-bottom:16px}
.phero-compact+.sec-t,.legal-hero+.sec-t{padding-top:clamp(40px,5vw,64px)}
.phero-price{
padding:clamp(48px,7vw,88px) 0 clamp(36px,5vw,56px);
border-bottom:1px solid var(--line);text-align:center
}
.phero-price .wrap{display:flex;flex-direction:column;align-items:center}
.phero-price .crumb{margin-bottom:18px;justify-content:center}
.phero-price h1{
font-size:clamp(2rem,3.5vw,2.75rem);letter-spacing:-.035em;
max-width:none;margin:0;font-weight:500
}
.phero-price .lead{
margin:14px auto 0;text-align:center;max-width:42ch;
font-size:clamp(1.02rem,1.2vw,1.12rem)
}
.doc-hero,.doc-hero-rich{
padding:clamp(56px,8vw,96px) 0 clamp(40px,5vw,64px)
}
.doc-hero h1{
font-size:clamp(1.85rem,3.6vw,2.75rem);
letter-spacing:-.035em;line-height:1.12;max-width:18ch
}
.doc-hero .lead{font-size:clamp(1.02rem,1.2vw,1.12rem);margin-bottom:24px}
.doc-hero .crumb{margin-bottom:18px}
.doc-jump{margin-top:28px;padding-top:20px}
.sec-k{padding-top:clamp(40px,6vw,72px)}
.contact-copy h1{
font-size:clamp(1.65rem,2.8vw,2.15rem)!important;
letter-spacing:-.03em;max-width:16ch;margin-top:4px
}
.contact-copy .lead{margin-top:12px;font-size:clamp(1rem,1.15vw,1.1rem)}
.contact-copy .crumb{margin-bottom:16px}
.plan{
position:relative;overflow:hidden;
transition:border-color .25s,box-shadow .3s,transform .25s
}
.plan .amount{color:var(--ink)}
.plan.is-key{
background:linear-gradient(180deg,#131815 0%,#0E100F 100%)!important;
border-color:rgba(61,214,140,.45)!important;
box-shadow:
0 0 0 1px rgba(61,214,140,.2),
0 0 48px -16px rgba(61,214,140,.28),
0 28px 60px -40px rgba(0,0,0,.7)!important
}
.plan.is-key:hover{transform:translateY(-2px)}
.badge{
background:rgba(61,214,140,.12)!important;
color:#3DD68C!important;
border:1px solid rgba(61,214,140,.35)!important;
font-size:.75rem;font-weight:500;padding:5px 11px;border-radius:999px
}
.pack-rules,.price-extra{
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
transition:border-color .2s
}
.pack-rules:hover,.price-extra:hover{border-color:#2E2E2E}
.svc-media-row{
display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px
}
.svc-media-win{margin:0;transform:none;max-width:none;width:100%}
.svc-media-win .game-vid-screen{aspect-ratio:16/10}
.svc-media-win .game-vid-screen img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:719px){.svc-media-row{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
.plan.is-key:hover,.svc-card:hover{transform:none}
.hd,.mega-in>div{transition:none}
}
.hd{
background:#000!important;
backdrop-filter:none;-webkit-backdrop-filter:none
}
.hd.is-scrolled,.menu-open .hd{background:#000!important;box-shadow:none}
.mega{
background:#000!important;
backdrop-filter:none;-webkit-backdrop-filter:none;
border-bottom:1px solid var(--line);
box-shadow:none;
opacity:0;visibility:hidden;
transform:translateY(-10px);
transition:
opacity .38s cubic-bezier(.16,1,.3,1),
transform .45s cubic-bezier(.16,1,.3,1),
visibility 0s .45s
}
.mega.is-open{
opacity:1;visibility:visible;transform:none;
transition:
opacity .38s cubic-bezier(.16,1,.3,1),
transform .45s cubic-bezier(.16,1,.3,1),
visibility 0s
}
.mega-in>div{
background:#0A0A0A;border:1px solid var(--line);
box-shadow:none!important;
opacity:0;transform:translateY(8px)
}
.mega.is-open .mega-in>div{
opacity:1;transform:none;
transition:
opacity .4s cubic-bezier(.16,1,.3,1),
transform .45s cubic-bezier(.16,1,.3,1)
}
.mega.is-open .mega-in>div:nth-child(1){transition-delay:.04s}
.mega.is-open .mega-in>div:nth-child(2){transition-delay:.08s}
.mega.is-open .mega-in>div:nth-child(3){transition-delay:.12s}
.mega.is-open .mega-in>div:nth-child(4){transition-delay:.16s}
.mega li a{
transition:background .2s cubic-bezier(.16,1,.3,1),color .2s,transform .25s cubic-bezier(.16,1,.3,1)
}
.mega li a:hover{
transform:translateX(2px);background:rgba(255,255,255,.06);color:var(--ink)
}
.mega h3 a{
border-radius:12px;padding:8px 10px;margin:0 -10px 0;
transition:background .2s,color .2s
}
.mega h3 a:hover{background:rgba(255,255,255,.06);color:var(--ink)}
.nav>a,.nav-item>button{
transition:color .22s cubic-bezier(.16,1,.3,1),background .22s cubic-bezier(.16,1,.3,1)
}
.nav>a:hover,.nav-item>button:hover,.nav-item>button[aria-expanded=true]{
background:rgba(255,255,255,.06)
}
.hd-cta{box-shadow:none;transition:background .2s,transform .2s cubic-bezier(.16,1,.3,1)}
.hd-cta:hover{box-shadow:none;transform:translateY(-1px)}
.ticks li::before{
content:"✓"!important;border:0!important;box-shadow:none!important;
width:auto!important;height:auto!important;transform:none!important;
background:none!important;font:400 1rem/1 var(--sans);color:#22C55E!important;
text-shadow:none!important
}
.ticks li.no{color:var(--mute)}
.ticks li.no::before{content:"×"!important;color:#EF4444!important;background:none!important;font-weight:400}
.plan.is-key{
background:#111!important;
border-color:#3A3A3A!important;
box-shadow:0 0 0 1px rgba(255,255,255,.08)!important
}
.plan.is-key:hover{transform:none}
.badge,.badge-quiet{
background:rgba(255,255,255,.08)!important;
color:#fff!important;
border:1px solid var(--line-2)!important
}
.phero-price{
padding:clamp(72px,10vw,120px) 0 clamp(48px,6vw,72px)!important
}
.phero-price+.sec-t,.sec-t:has(.plans){
padding-top:clamp(40px,5vw,64px)!important
}
.plans{margin-top:8px;gap:20px}
.sec-compare{padding-top:clamp(48px,6vw,80px)}
.sec-compare .sec-head{margin-bottom:clamp(28px,4vw,44px)}
.sec-compare .sec-head p{margin-top:10px;color:var(--mute)}
.cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:20px;background:#0A0A0A}
.cmp{width:100%;border-collapse:collapse;min-width:640px}
.cmp th,.cmp td{
padding:16px 20px;text-align:center;border-bottom:1px solid var(--line);
font-size:.95rem;vertical-align:middle
}
.cmp thead th{
padding:22px 16px 18px;background:#000;position:sticky;top:0;z-index:1
}
.cmp thead th span{display:block;font-size:1.05rem;font-weight:500;color:var(--ink)}
.cmp thead th em{display:block;font-style:normal;font-size:.82rem;color:var(--mute);margin-top:6px}
.cmp thead th:first-child,.cmp tbody th{text-align:left;font-weight:400;color:var(--ink-2)}
.cmp tbody th{padding-left:24px;max-width:28ch}
.cmp .is-key{background:rgba(255,255,255,.025)}
.cmp thead th.is-key{background:#0E0E0E;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.cmp-cat th{
text-align:left!important;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;
color:var(--faint);padding:20px 24px 10px;background:#000;border-bottom-color:transparent
}
.cmp-yes{
color:#22C55E;font-weight:400;font-size:1.1rem;line-height:1;text-shadow:none
}
.cmp-no{
color:#EF4444;font-weight:400;font-size:1.15rem;line-height:1;text-shadow:none
}
.cmp-note{margin:20px 0 0;color:var(--mute);font-size:.92rem;max-width:62ch;text-align:center;margin-left:auto;margin-right:auto}
.about-top{padding:clamp(48px,7vw,88px) 0 clamp(24px,3vw,40px)}
.about-top .crumb{margin-bottom:clamp(28px,4vw,48px)}
.about-top .big-statement{
font-size:clamp(2.1rem,4.8vw,3.6rem);line-height:1.18;letter-spacing:-.035em;
max-width:18ch;font-weight:500;margin:0
}
.about-lead{margin-top:28px;max-width:46ch}
.page-about .ab-hero{
padding:clamp(110px,15vw,168px) 0 clamp(48px,6vw,72px);
background:
radial-gradient(55% 40% at 40% 0%,rgba(255,255,255,.05),transparent 60%),
linear-gradient(180deg,#0a0a0a 0%,#000 100%)
}
.page-about .ab-hero-in{max-width:760px}
.page-about .ab-hero .crumb{margin-bottom:22px}
.page-about .ab-hero h1{
margin:10px 0 18px;font-size:clamp(2.3rem,4.8vw,3.5rem);
letter-spacing:-.045em;line-height:1.05;font-weight:500
}
.page-about .ab-hero .lead{max-width:48ch;color:var(--mute);font-size:1.08rem;line-height:1.55}
.page-about .ab-manifesto{padding:clamp(56px,8vw,100px) 0;border-top:1px solid #1a1a1a}
.page-about .ab-k{
margin:0 0 14px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#777
}
.page-about .ab-manifesto h2{
margin:0 0 16px;font-size:clamp(1.55rem,2.8vw,2.15rem);
letter-spacing:-.035em;font-weight:500;line-height:1.15;max-width:22ch
}
.page-about .ab-manifesto p{margin:0;color:var(--mute);font-size:1.05rem;line-height:1.6;max-width:52ch}
.page-about .ab-values{padding:0 0 clamp(72px,10vw,120px)}
.page-about .ab-values .eyebrow.center{text-align:center}
.page-about .ab-values-h{
margin:10px auto 40px;text-align:center;font-size:clamp(1.5rem,2.8vw,2rem);
letter-spacing:-.03em;font-weight:500;max-width:18ch
}
.page-about .ab-value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.page-about .ab-value{
padding:26px 24px;border:1px solid #242424;border-radius:18px;background:#0e0e0e;
transition:border-color .25s,background .25s,transform .25s
}
.page-about .ab-value:hover{border-color:#333;background:#121212;transform:translateY(-2px)}
.page-about .ab-value span{
display:block;margin-bottom:14px;font-size:.72rem;letter-spacing:.08em;color:#777;font-weight:500
}
.page-about .ab-value h3{margin:0 0 10px;font-size:1.15rem;font-weight:500;letter-spacing:-.02em}
.page-about .ab-value p{margin:0;color:var(--mute);font-size:.92rem;line-height:1.5}
.page-about .ab-infra{
padding:clamp(64px,9vw,110px) 0;border-top:1px solid #1a1a1a;background:#080808
}
.page-about .ab-infra-grid{
display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
gap:clamp(28px,5vw,56px);align-items:center
}
.page-about .ab-infra-copy h2{
margin:10px 0 14px;font-size:clamp(1.55rem,2.8vw,2.15rem);
letter-spacing:-.035em;font-weight:500;max-width:16ch
}
.page-about .ab-infra-copy p{margin:0;color:var(--mute);line-height:1.55;max-width:42ch}
.page-about .ab-infra-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.page-about .ab-infra-list li{
display:flex;flex-direction:column;gap:4px;padding:16px 18px;
border:1px solid #262626;border-radius:14px;background:#0e0e0e
}
.page-about .ab-infra-list strong{font-size:.98rem;font-weight:500;color:#eee}
.page-about .ab-infra-list span{font-size:.88rem;color:var(--mute);line-height:1.45}
.page-about .wrap.narrow{max-width:720px;margin-left:auto;margin-right:auto}
@media (max-width:899px){
.page-about .ab-value-grid{grid-template-columns:1fr 1fr}
.page-about .ab-infra-grid{grid-template-columns:1fr;gap:28px}
}
@media (max-width:599px){
.page-about .ab-value-grid{grid-template-columns:1fr}
.page-about .ab-values-h,.page-about .ab-values .eyebrow.center{text-align:left;margin-left:0}
}
.hero-x{
padding:clamp(96px,14vw,168px) 0 clamp(56px,8vw,96px);
text-align:center;border-bottom:0
}
.hero-x-in{display:flex;flex-direction:column;align-items:center;max-width:920px;margin:0 auto}
.hero-x h1{
font-size:clamp(2.6rem,6vw,4.6rem);letter-spacing:-.042em;line-height:1.05;
font-weight:500;margin:0;max-width:16ch
}
.hero-x .lead{
margin:22px auto 0;max-width:42ch;text-align:center;
font-size:clamp(1.08rem,1.4vw,1.22rem);color:var(--mute)
}
.hero-x .btns{margin-top:32px;justify-content:center}
.hero-rot{
display:inline-block;vertical-align:baseline;
min-width:8.5ch;color:var(--mute);text-align:left
}
.hero-rot-in{display:inline;color:inherit}
@keyframes hero-caret{0%,46%{opacity:1}47%,100%{opacity:0}}
.sec-bento{padding:0 0 clamp(64px,8vw,100px)}
.bento{
display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px
}
.bento-card{
position:relative;display:flex;flex-direction:column;
border:1px solid var(--line);border-radius:22px;overflow:hidden;
background:#0A0A0A;text-decoration:none;color:inherit;min-height:280px;
transition:border-color .28s cubic-bezier(.16,1,.3,1),background .28s,transform .28s cubic-bezier(.16,1,.3,1)
}
.bento-card:hover{border-color:#2E2E2E;background:#0E0E0E;transform:translateY(-2px)}
.bento-lg{grid-row:span 1;min-height:320px}
.bento-wide{
grid-column:1/-1;min-height:0;flex-direction:row;align-items:center;
justify-content:space-between;gap:24px;padding:32px 36px
}
.bento-kiro{
grid-column:span 2;min-height:320px;
background:#0C0C0C;border-color:#222;display:flex;padding:0;overflow:hidden
}
.bento-kiro:hover{border-color:#333;background:#0E0E0E;transform:translateY(-2px)}
.bento-kiro-in{
flex:1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;
align-items:center;gap:clamp(18px,2.5vw,28px);
padding:clamp(20px,2.5vw,28px) clamp(20px,2.5vw,30px);min-width:0
}
.bento-kiro-side{
position:relative;display:flex;flex-direction:column;align-items:center;
justify-content:center;flex:none;width:120px
}
.px-kiro{
width:112px;height:112px;image-rendering:pixelated;image-rendering:crisp-edges;
overflow:visible;position:relative;z-index:1
}
.px-kiro .k-body{fill:#C4B5FD}
.px-kiro .k-mid{fill:#8B7BB8}
.px-kiro .k-eye{fill:#FFFBFF}
.px-kiro .k-pupil{fill:#1A1228}
.px-kiro .k-shine{fill:#FFFFFF}
.px-kiro .k-mouth{fill:#5B4F7A}
.px-kiro .k-blush{fill:#E8A0C8;opacity:.55}
.px-kiro.is-white .k-body{fill:#F4F4F4}
.px-kiro.is-white .k-mid{fill:#C8C8C8}
.px-kiro.is-white .k-mouth{fill:#6A6A6A}
.px-kiro.is-white .k-blush{fill:#E8B4C8}
.px-kiro.is-violet .k-body{fill:#C4B5FD}
.px-kiro.is-violet .k-mid{fill:#8B7BB8}
.px-kiro.is-violet .k-mouth{fill:#5B4F7A}
.px-kiro.is-teal .k-body{fill:#5EEAD4}
.px-kiro.is-teal .k-mid{fill:#2DD4BF}
.px-kiro.is-teal .k-mouth{fill:#0F766E}
.px-kiro.is-orange .k-body{fill:#FDBA74}
.px-kiro.is-orange .k-mid{fill:#FB923C}
.px-kiro.is-orange .k-mouth{fill:#9A3412}
.px-kiro.is-blue .k-body{fill:#93C5FD}
.px-kiro.is-blue .k-mid{fill:#60A5FA}
.px-kiro.is-blue .k-mouth{fill:#1E40AF}
.px-kiro.is-pink .k-body{fill:#F9A8D4}
.px-kiro.is-pink .k-mid{fill:#F472B6}
.px-kiro.is-pink .k-mouth{fill:#9D174D}
.px-kiro.is-lime .k-body{fill:#BEF264}
.px-kiro.is-lime .k-mid{fill:#A3E635}
.px-kiro.is-lime .k-mouth{fill:#3F6212}
.bento-kiro-shadow{
display:block;width:48px;height:8px;margin-top:-4px;border-radius:50%;
background:rgba(0,0,0,.4);filter:blur(3px);z-index:0
}
.px-kiro .k-eyes{
transform-box:fill-box;transform-origin:center 55%;
transition:transform .09s ease
}
.px-kiro .k-eye{transition:fill .06s ease}
.px-kiro .k-pupils{transform-box:fill-box;transform-origin:center;transition:transform .4s ease,opacity .06s ease}
.px-kiro .k-lids{opacity:0;pointer-events:none}
.px-kiro .k-lid{fill:#C4B5FD}
.px-kiro.is-white .k-lid{fill:#F4F4F4}
.px-kiro.is-violet .k-lid{fill:#C4B5FD}
.px-kiro.is-teal .k-lid{fill:#5EEAD4}
.px-kiro.is-orange .k-lid{fill:#FDBA74}
.px-kiro.is-blue .k-lid{fill:#93C5FD}
.px-kiro.is-pink .k-lid{fill:#F9A8D4}
.px-kiro.is-lime .k-lid{fill:#BEF264}
.px-kiro.is-blink .k-lids{opacity:0}
.px-kiro.is-blink .k-eyes{transform:scaleY(.18)}
.px-kiro.is-blink .k-pupils{opacity:0}
.px-kiro.is-blink .k-eye{fill:#5B4F7A}
.px-kiro.is-white.is-blink .k-eye{fill:#6A6A6A}
.px-kiro.is-teal.is-blink .k-eye{fill:#0F766E}
.px-kiro.is-orange.is-blink .k-eye{fill:#9A3412}
.px-kiro.is-blue.is-blink .k-eye{fill:#1E40AF}
.px-kiro.is-pink.is-blink .k-eye{fill:#9D174D}
.px-kiro.is-lime.is-blink .k-eye{fill:#3F6212}
.px-kiro.is-look-l .k-pupils{transform:translateX(-1px)}
.px-kiro.is-look-r .k-pupils{transform:translateX(1px)}
.px-kiro .k-brows{opacity:0}
.px-kiro .k-brow{fill:#111}
.px-kiro.is-white .k-brow{fill:#0a0a0a}
.px-kiro .km{opacity:0}
.px-kiro .km-neutral{opacity:1}
.px-kiro.is-confused .km{opacity:0}
.px-kiro.is-confused .km-confused{opacity:1}
.px-kiro.is-confused .k-brows-confused{opacity:1}
.px-kiro.is-confused .k-pupils{transform:translate(1px,-1px)}
.px-kiro.is-gross .km{opacity:0}
.px-kiro.is-gross .km-gross{opacity:1}
.px-kiro.is-gross .k-eyes{transform:scaleY(.7) translateY(.5px)}
.px-kiro.is-gross .k-pupils{transform:translateY(1px)}
.px-kiro.is-gross .k-tongue{fill:#f9a8d4}
.px-kiro.is-mad .km{opacity:0}
.px-kiro.is-mad .km-mad{opacity:1}
.px-kiro.is-mad .k-brows-mad{opacity:1}
.px-kiro.is-mad .k-pupils{transform:translateY(1px)}
.px-kiro.is-happy .km{opacity:0}
.px-kiro.is-happy .km-happy{opacity:1}
.px-kiro.is-happy .k-blush{opacity:.9}
.px-kiro.is-wow .km{opacity:0}
.px-kiro.is-wow .km-wow{opacity:1}
.px-kiro.is-wow .k-eyes{transform:scale(1.06)}
.px-kiro.is-sleepy .km{opacity:0}
.px-kiro.is-sleepy .km-sleepy{opacity:1}
.px-kiro.is-sleepy .k-eyes{transform:scaleY(.45) translateY(.4px)}
.px-kiro.is-sleepy .k-pupils{opacity:.4;transform:translateY(1px)}
.px-kiro.is-sleepy .k-blush{opacity:.2}
.px-kiro.is-sleepy .k-lids{opacity:0}
.px-kiro.is-expr .k-pupils{transition:transform .35s ease,opacity .2s}
.bento-kiro-main{min-width:0}
.bento-kiro-main .eyebrow{margin:0 0 6px;color:#8A8A8A}
.bento-kiro-main>strong{
display:block;font-size:clamp(1.4rem,2.2vw,1.85rem);font-weight:500;
letter-spacing:-.03em;color:#fff;margin:0 0 6px
}
.bento-kiro-lead{
margin:0 0 12px;color:var(--mute);font-size:.92rem;line-height:1.45;max-width:42ch
}
.bento-kiro-p{
margin:0 0 8px;color:var(--mute);font-size:.88rem;line-height:1.45;max-width:48ch
}
.bento-kiro-p span{color:#fff;font-weight:500}
.bento-kiro-p em{font-style:normal;color:#5EEAD4;font-weight:500}
.bento-kiro-p+.bento-kiro-feats{margin-top:12px}
.bento-kiro-feats{
list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0
}
.bento-kiro-feats li{
font-size:.68rem;font-weight:500;padding:5px 10px;border-radius:999px;
border:1px solid;background:#141414;letter-spacing:-.01em
}
.bento-kiro-feats .is-teal{color:#5EEAD4;border-color:rgba(94,234,212,.4);background:rgba(94,234,212,.05)}
.bento-kiro-feats .is-violet{color:#C4B5FD;border-color:rgba(196,181,253,.4);background:rgba(196,181,253,.06)}
.bento-kiro-feats .is-orange{color:#FDBA74;border-color:rgba(253,186,116,.4);background:rgba(253,186,116,.05)}
.bento-kiro-feats li.is-on{box-shadow:0 0 0 1px currentColor}
.bento-kiro-go{
font-size:.88rem;color:var(--mute);white-space:nowrap;align-self:end;transition:color .2s
}
.bento-kiro:hover .bento-kiro-go{color:#fff}
@media (prefers-reduced-motion:no-preference){
.px-kiro .k-eyes{transition:transform .12s steps(1)}
.px-kiro .k-pupils{transition:transform .35s ease}
.px-kiro .k-blush{animation:kiro-blush 3.4s ease-in-out infinite}
}
@keyframes kiro-blush{
0%,100%{opacity:.4}
50%{opacity:.7}
}
.bento-viz{
flex:1;display:grid;place-items:center;padding:28px 24px 8px;min-height:180px
}
.bento-viz .viz{transform:scale(.92);width:100%;max-width:320px}
.bento-viz-img{padding:0;overflow:hidden;position:relative;flex:1;min-height:280px}
.bento-viz-img img{
width:100%;height:100%;object-fit:cover;object-position:center top;display:block;
opacity:.95;transition:opacity .35s,transform .55s cubic-bezier(.16,1,.3,1)
}
.bento-card:hover .bento-viz-img img{opacity:1;transform:scale(1.03)}
.bento-card-photo{min-height:320px}
.bento-card-photo .bento-viz{min-height:100%;padding:0}
.bento-lg.bento-card-photo{
min-height:360px;
box-shadow:0 0 0 1px rgba(255,255,255,.04),0 24px 60px rgba(0,0,0,.35)
}
.bento-lg .bento-viz-img::before{
content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:
radial-gradient(80% 60% at 15% 20%,rgba(251,146,60,.14),transparent 55%),
radial-gradient(70% 55% at 90% 80%,rgba(45,212,191,.12),transparent 50%)
}
.bento-card-live{
background:#1E1E1E;border-color:#2B2B2B;
height:340px;min-height:340px;max-height:340px;
box-shadow:0 0 0 1px rgba(255,255,255,.04);overflow:hidden
}
.bento-card.bento-card-live:hover,
.bento-card.bento-card-live:focus-visible{
border-color:#2B2B2B;background:#1E1E1E;transform:none
}
.bento-card-live .bento-viz.bento-ide,
.bento-card-live .bento-viz.bento-sec,
.bento-card-live .bento-viz.bento-chat{
display:flex!important;flex-direction:column;place-items:stretch;
align-items:stretch;justify-content:flex-start;
flex:1 1 auto;width:100%;min-height:0;max-height:100%;height:0;
padding:0!important;margin:0;background:#141414;overflow:hidden;
font-family:var(--mono);max-width:none
}
.bento-card-live .bento-viz.bento-chat{font-family:var(--sans);background:#0C0C0C}
.bento-ide-title{
display:flex;align-items:center;justify-content:flex-start;gap:10px;
padding:7px 10px 7px 12px;background:#252526;flex:0 0 auto;width:100%;box-sizing:border-box
}
.bento-ide-dots{display:inline-flex;align-items:center;gap:6px;flex:none;margin-right:4px}
.bento-ide-dots i{width:10px;height:10px;border-radius:50%;display:block;flex:none}
.bento-ide-dots i:nth-child(1){background:#FF5F57}
.bento-ide-dots i:nth-child(2){background:#FEBC2E}
.bento-ide-dots i:nth-child(3){background:#28C840}
.bento-ide-title em{
font-style:normal;font-size:.65rem;color:#CCCCCC;letter-spacing:.01em;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.bento-ide-tabs,.bento-sec-bar{
display:flex;gap:0;background:#1E1E1E;border-bottom:1px solid #2B2B2B;flex:0 0 auto;width:100%
}
.bento-ide-tabs span,.bento-sec-bar span{
padding:6px 12px;font-size:.65rem;color:#969696;border-right:1px solid #2B2B2B;
transition:background .15s,color .15s;cursor:default
}
.bento-ide-tabs span:hover,.bento-sec-bar span:hover{
background:#2A2D2E;color:#CCCCCC
}
.bento-ide-tabs .is-on,.bento-sec-bar .is-on{background:#1E1E1E;color:#FFFFFF}
.bento-ide-tabs .is-on:hover,.bento-sec-bar .is-on:hover{background:#2A2D2E;color:#fff}
.bento-ide-main{
flex:1 1 auto;display:grid;grid-template-columns:32px minmax(0,1fr);
min-height:0;overflow:hidden;background:#1E1E1E;width:100%
}
.bento-ide-gutter{
padding:8px 0;text-align:right;font-size:.6rem;line-height:1.45;
color:#858585;background:#1E1E1E;border-right:1px solid #2B2B2B;user-select:none;
overflow:hidden
}
.bento-ide-gutter span{display:block;padding:0 6px}
.bento-ide-code{
margin:0;padding:8px 10px;overflow:hidden;font:400 .62rem/1.45 var(--mono);
color:#D4D4D4;white-space:pre;min-width:0;min-height:0
}
.bento-ide-code code{font:inherit;color:inherit}
.bento-ide-code .kw{color:#569CD6}
.bento-ide-code .fn{color:#DCDCAA}
.bento-ide-code .str{color:#CE9178}
.bento-ide-code .cm{color:#6A9955}
.bento-ide-code .num{color:#B5CEA8}
.bento-ide-code .ty{color:#4EC9B0}
.bento-ide-term{
flex:0 0 96px;height:96px;max-height:96px;background:#1E1E1E;border-top:1px solid #2B2B2B;
display:flex;flex-direction:column;width:100%;overflow:hidden
}
.bento-ide-term-h{
display:flex;align-items:center;gap:10px;padding:4px 10px;
font-size:.58rem;letter-spacing:.06em;color:#CCCCCC;background:#252526;flex:0 0 auto
}
.bento-ide-term-h span{color:#858585;letter-spacing:0;text-transform:none;font-size:.58rem}
.bento-ide-term-b{
margin:0;padding:6px 10px 8px;flex:1;min-height:0;overflow:hidden;
font:400 .6rem/1.4 var(--mono);color:#CCCCCC;white-space:pre
}
.bento-ide-term-b .t-cmd{color:#DCDCAA}
.bento-ide-term-b .t-ok{color:#4EC9B0}
.bento-ide-term-b .t-dim{color:#858585}
.bento-ide-term-b .t-warn{color:#CE9178}
.bento-ide-caret{display:none}
.bento-chat-thread{
flex:1 1 auto;min-height:0;overflow:hidden;
display:flex;flex-direction:column;justify-content:flex-end;gap:7px;
padding:12px 10px 12px
}
.bento-chat-row{
display:flex;flex-direction:column;max-width:88%;
opacity:0;transform:translateY(10px) scale(.96);
animation:bento-chat-in .42s cubic-bezier(.16,1,.3,1) forwards
}
.bento-chat-row.is-ops{align-self:flex-start;align-items:flex-start}
.bento-chat-row.is-client{align-self:flex-end;align-items:flex-end}
.bento-chat-row .who{
font-size:.55rem;letter-spacing:.04em;text-transform:uppercase;
color:#6A6A6A;margin:0 2px 3px;font-weight:500
}
.bento-chat-row.is-ops .who{color:#8A8A8A}
.bento-chat-bubble{
padding:8px 11px;border-radius:14px;font-size:.7rem;line-height:1.35;
color:#E8E8E8;letter-spacing:-.01em;word-wrap:break-word
}
.bento-chat-row.is-ops .bento-chat-bubble{
background:#2A2A2A;border-bottom-left-radius:4px
}
.bento-chat-row.is-client .bento-chat-bubble{
background:#1A1A1A;border:1px solid #2E2E2E;border-bottom-right-radius:4px;color:#D4D4D4
}
.bento-chat-typing{
display:inline-flex;align-items:center;gap:4px;padding:10px 12px;
background:#2A2A2A;border-radius:14px;border-bottom-left-radius:4px;min-height:14px
}
.bento-chat-typing i{
width:5px;height:5px;border-radius:50%;background:#8A8A8A;
animation:bento-chat-dot 1.2s ease-in-out infinite
}
.bento-chat-typing i:nth-child(2){animation-delay:.15s}
.bento-chat-typing i:nth-child(3){animation-delay:.3s}
@keyframes bento-chat-in{
to{opacity:1;transform:none}
}
@keyframes bento-chat-dot{
0%,60%,100%{opacity:.35;transform:translateY(0)}
30%{opacity:1;transform:translateY(-2px)}
}
@media (prefers-reduced-motion:reduce){
.bento-chat-row{animation:none;opacity:1;transform:none}
.bento-chat-typing i{animation:none;opacity:.7}
}
.bento-sec-term{
margin:0;padding:10px 12px;flex:1 1 auto;min-height:0;overflow:hidden;
font:400 .62rem/1.45 var(--mono);color:#CCCCCC;white-space:pre;background:#0E0E0E
}
.bento-sec-term .t-cmd{color:#DCDCAA}
.bento-sec-term .t-ok{color:#4EC9B0}
.bento-sec-term .t-dim{color:#858585}
.bento-sec-term .t-warn{color:#CE9178}
.bento-sec-term .t-alert{color:#F48771}
.bento-card-live .bento-foot{
border-top:1px solid #2B2B2B;padding:10px 14px 12px;margin:0;background:#252526;flex:0 0 auto
}
.bento-card-live .bento-foot strong{color:#fff;font-size:.95rem}
.bento-card-live .bento-foot span{color:#969696}
.bento-foot{
display:flex;justify-content:space-between;align-items:center;gap:12px;
padding:16px 22px 20px;margin-top:auto;border-top:1px solid transparent
}
.bento-foot-over{
position:absolute;left:0;right:0;bottom:0;margin:0;z-index:2;
padding:18px 20px;
background:linear-gradient(180deg,transparent,rgba(0,0,0,.72) 55%,rgba(0,0,0,.88));
pointer-events:none
}
.bento-foot-over strong{font-weight:500;font-size:1.05rem;color:#fff}
.bento-foot-over span{color:rgba(255,255,255,.7)}
.bento-card-photo:hover .bento-foot-over span{color:#fff}
.bento-foot strong{font-weight:500;font-size:1.05rem}
.bento-foot span{font-size:.88rem;color:var(--mute);transition:color .2s}
.bento-card:hover .bento-foot span{color:var(--ink)}
.bento-copy{text-align:left}
.bento-copy h2{font-size:clamp(1.35rem,2.2vw,1.75rem);margin:6px 0 10px;max-width:22ch}
.bento-copy p{margin:0;color:var(--mute);max-width:48ch}
.bento-go{font-size:.95rem;color:var(--ink);white-space:nowrap;border-bottom:1px solid var(--line-2);padding-bottom:2px}
.sec-head.center,.sec-head-wide.center{margin-left:auto;margin-right:auto;text-align:center;justify-items:center}
.sec-head-wide.center p{margin-left:auto;margin-right:auto}
.flow-track{
list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;
margin:clamp(28px,4vw,40px) 0 0;padding:0;position:relative
}
.flow-track::before{
content:"";position:absolute;left:4%;right:4%;top:28px;height:1px;
background:linear-gradient(90deg,transparent,#2a2a2a 10%,#2a2a2a 90%,transparent);z-index:0
}
.flow-track li{
position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;
padding:22px 20px;border:1px solid #262626;border-radius:20px;background:#141414;
transition:border-color .3s,background .3s,box-shadow .3s,transform .3s
}
.flow-track li.is-on{
border-color:#3a3a3a;background:#181818;
box-shadow:0 0 0 1px rgba(255,255,255,.04),0 18px 40px rgba(0,0,0,.25)
}
.flow-track .flow-c-n{
display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
border-radius:50%;border:1px solid #333;background:#0f0f0f;font-size:.78rem;color:#888;
font-variant-numeric:tabular-nums;margin-bottom:4px;transition:border-color .3s,color .3s,background .3s
}
.flow-track li.is-on .flow-c-n{border-color:#fff;color:#fff;background:#1a1a1a;box-shadow:0 0 0 4px rgba(255,255,255,.06)}
.flow-track h3{margin:0 0 8px;font-size:1.12rem;font-weight:500;letter-spacing:-.02em}
.flow-track p{margin:0;color:var(--mute);font-size:.9rem;line-height:1.45}
.flow-track .flow-c-t{
display:inline-block;margin-top:14px;align-self:flex-start;font-size:.72rem;color:#888;
border:1px solid #2e2e2e;padding:4px 10px;border-radius:999px;background:#101010
}
@media (max-width:899px){
.flow-track{grid-template-columns:1fr 1fr}
.flow-track::before{display:none}
}
@media (max-width:559px){.flow-track{grid-template-columns:1fr}}
.sec-why{padding:clamp(72px,9vw,120px) 0;border-top:1px solid var(--line)}
.why-grid{
display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
gap:clamp(32px,5vw,64px);align-items:center
}
.why-copy h2{margin:8px 0 14px;max-width:16ch}
.why-copy>p{color:var(--mute);max-width:46ch;margin:0 0 28px}
.why-list{list-style:none;display:grid;gap:14px;margin:0 0 32px;padding:0}
.why-list li{display:grid;gap:2px;padding:14px 0;border-top:1px solid var(--line)}
.why-list strong{font-weight:500}
.why-list span{color:var(--mute);font-size:.92rem}
.why-stage{
position:relative;border-radius:24px;overflow:hidden;min-height:420px;
border:1px solid #262626;background:#0a0a0a;
display:grid;place-items:center;padding:clamp(28px,4vw,40px)
}
.why-stage-bg{
position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
opacity:.9;pointer-events:none;z-index:0
}
.why-win{
position:relative;z-index:1;width:min(100%,380px);
border-radius:18px;border:1px solid #2e2e2e;background:rgba(14,14,14,.92);
backdrop-filter:blur(10px);overflow:hidden;
box-shadow:0 24px 50px rgba(0,0,0,.45)
}
.why-win-bar{
display:flex;align-items:center;gap:6px;padding:10px 12px;
border-bottom:1px solid #222;background:#161616;font-size:.7rem;color:#888
}
.why-win-bar i{width:8px;height:8px;border-radius:50%;background:#333}
.why-win-bar i:nth-child(1){background:#ef4444}
.why-win-bar i:nth-child(2){background:#eab308}
.why-win-bar i:nth-child(3){background:#22c55e}
.why-win-bar em{margin-left:8px;font-style:normal}
.why-win-body{padding:18px 16px 16px}
.why-card-h{
display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:16px
}
.why-av{
width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
background:#1a1a1a;border:1px solid #333;font-size:.72rem;font-weight:600;color:#fff;letter-spacing:.04em
}
.why-card-h strong{display:block;font-size:1rem;font-weight:500;color:#fff}
.why-card-h em{display:block;font-style:normal;font-size:.78rem;color:#8a8a8a;margin-top:2px}
.why-online{
display:inline-flex;align-items:center;gap:6px;font-size:.68rem;font-weight:500;color:#5EEAD4;
padding:5px 10px;border-radius:999px;border:1px solid rgba(94,234,212,.28);background:rgba(94,234,212,.07)
}
.why-online i{
width:6px;height:6px;border-radius:50%;background:#5EEAD4;box-shadow:0 0 8px #5EEAD4;
animation:kf-dot 1.4s ease-in-out infinite
}
.why-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.why-pills span{
font-size:.72rem;padding:6px 11px;border-radius:999px;border:1px solid #2e2e2e;
background:#151515;color:#9a9a9a;transition:color .3s,border-color .3s,background .3s,box-shadow .3s
}
.why-pills span.is-on{
color:#fff;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06);
box-shadow:0 0 0 1px rgba(255,255,255,.04)
}
.why-quote{
margin:0 0 18px;padding:0;border:0;font-size:.98rem;line-height:1.5;color:#d6d6d6;letter-spacing:-.01em
}
.why-split{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.why-metric{
padding:14px 14px 12px;border-radius:16px;border:1px solid #262626;background:#101010
}
.why-metric span{display:block;font-size:.68rem;color:#777;margin-bottom:6px}
.why-metric strong{display:block;font-size:1.15rem;font-weight:500;color:#fff;letter-spacing:-.02em}
.why-metric em{display:block;font-style:normal;font-size:.72rem;color:#8a8a8a;margin-top:4px}
.why-card-f{
display:flex;justify-content:space-between;align-items:center;gap:12px;
padding-top:14px;border-top:1px solid #222;font-size:.78rem
}
.why-card-f span{color:#777}
.why-card-f em{font-style:normal;color:#e8e8e8;font-weight:500}
@media (max-width:559px){
.why-split{grid-template-columns:1fr}
.why-card-h{grid-template-columns:44px 1fr;grid-template-rows:auto auto}
.why-online{grid-column:2;justify-self:start}
}
.svc-card{box-shadow:none;transition:border-color .25s,background .25s,transform .25s cubic-bezier(.16,1,.3,1)}
.svc-card:hover,.svc-card:focus-visible{
box-shadow:none;border-color:#2E2E2E;transform:translateY(-2px)
}
.kiro-hero{padding:clamp(72px,10vw,120px) 0 clamp(28px,4vw,48px);text-align:center}
.kiro-hero-in{max-width:720px;margin:0 auto}
.kiro-hero h1{
display:inline-flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:-.04em;font-weight:500;margin:0
}
.kiro-hero-mark{display:inline-grid;place-items:center;vertical-align:middle}
.kiro-hero .lead{margin:18px auto 0;max-width:46ch;color:var(--mute)}
.kiro-hero .lead strong{color:#fff;font-weight:500}
.kiro-hero .btns{margin-top:28px;justify-content:center}
.wl-dlg{
position:fixed;width:min(440px,calc(100vw - 32px));margin:auto;padding:0;border:1px solid #2A2A2A;
border-radius:20px;background:#141414;color:var(--ink);
box-shadow:0 40px 100px -40px rgba(0,0,0,.9)
}
.wl-dlg::backdrop{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.wl-dlg-close{position:absolute;top:12px;right:12px;margin:0;z-index:2}
.wl-dlg-close button{
display:grid;place-items:center;width:40px;height:40px;margin:0;padding:0;border:0;
border-radius:10px;background:transparent;color:#9A9A9A;font-size:1.6rem;line-height:1;cursor:pointer
}
.wl-dlg-close button:hover{background:rgba(255,255,255,.06);color:#fff}
.wl-dlg-in{position:relative;padding:clamp(28px,4vw,36px) clamp(22px,4vw,32px) clamp(24px,3vw,32px)}
.wl-dlg .eyebrow{margin:0 0 10px}
.wl-dlg h2{margin:0;font-size:clamp(1.35rem,3vw,1.7rem);font-weight:500;letter-spacing:-.03em}
.wl-dlg-lead{margin:10px 0 0;color:var(--mute);font-size:.95rem;line-height:1.5}
.wl-dlg .wl-form{
margin-top:22px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;gap:16px
}
.wl-dlg .wl-form .fbody{display:grid;gap:14px}
.wl-dlg .wl-form .btn{width:100%;justify-content:center}
.wl-dlg .form-ok,.wl-dlg .form-fail{margin-top:8px;text-align:left}
.wl-dlg[open]{animation:wl-in .28s var(--ease)}
@keyframes wl-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.wl-dlg[open]{animation:none}}
.kiro-demo-sec{padding:0 0 clamp(64px,8vw,100px)}
.kiro-win{
border:1px solid #2A2A2A;border-radius:18px;overflow:hidden;background:#141414;
box-shadow:0 30px 80px -40px rgba(0,0,0,.8);max-width:1080px;margin:0 auto
}
.kiro-win-bar{
display:flex;align-items:center;gap:7px;padding:10px 14px;background:#1A1A1A;border-bottom:1px solid #222
}
.kiro-win-bar i{width:10px;height:10px;border-radius:50%;display:block}
.kiro-win-bar i:nth-child(1){background:#FF5F57}
.kiro-win-bar i:nth-child(2){background:#FEBC2E}
.kiro-win-bar i:nth-child(3){background:#28C840}
.kiro-win-bar em{margin-left:8px;font-style:normal;font-size:.75rem;color:#888}
.kiro-win-body{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:520px}
.kiro-side{
display:flex;flex-direction:column;border-right:1px solid #222;background:#121212;min-height:0
}
.kiro-search{
margin:12px 12px 8px;padding:9px 12px;border-radius:10px;background:#1A1A1A;border:1px solid #262626;
color:#666;font-size:.82rem
}
.kiro-list{flex:1;overflow:auto;padding:4px 8px 12px;display:flex;flex-direction:column;gap:2px}
.kiro-item{
display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;
width:100%;text-align:left;border:0;background:transparent;color:inherit;cursor:pointer;
padding:10px 10px;border-radius:12px;font:inherit
}
.kiro-item:hover{background:rgba(255,255,255,.04)}
.kiro-item.is-on{background:rgba(255,255,255,.07)}
.kiro-item .px-kiro{width:32px;height:32px}
.kiro-item-meta{min-width:0}
.kiro-item-meta strong{display:block;font-size:.88rem;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kiro-item-meta span{display:block;font-size:.72rem;color:#777;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.kiro-item time{font-size:.68rem;color:#555;white-space:nowrap}
.kiro-you{
display:flex;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid #222;
font-size:.82rem;color:#aaa
}
.kiro-you-av{
width:28px;height:28px;border-radius:50%;background:#2A2A2A;display:grid;place-items:center;
font-size:.65rem;font-weight:500;color:#fff;text-transform:uppercase
}
.kiro-pane{display:flex;flex-direction:column;min-width:0;background:#161616;min-height:0}
.kiro-pane-h{
display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid #222
}
.kiro-pane-h .px-kiro{width:28px;height:28px}
.kiro-pane-h strong{display:block;font-size:.95rem;font-weight:500;color:#fff}
.kiro-pane-h em{display:block;font-style:normal;font-size:.72rem;color:#6A6A6A;margin-top:2px}
.kiro-thread{
flex:1;overflow:auto;padding:18px 20px 12px;display:flex;flex-direction:column;gap:12px;min-height:0
}
.kiro-msg{max-width:92%;font-size:.9rem;line-height:1.45}
.kiro-msg.is-bot{align-self:flex-start;color:#D8D8D8}
.kiro-msg.is-user{
align-self:flex-end;background:#EDEDED;color:#111;padding:10px 14px;border-radius:16px;border-bottom-right-radius:5px
}
.kiro-msg.is-sys{align-self:flex-start;font-size:.78rem;color:#777}
.kiro-msg.is-action{
align-self:flex-start;width:min(100%,360px);background:#1C1C1C;border:1px solid #2E2E2E;
border-radius:14px;padding:12px 14px
}
.kiro-msg.is-action .kiro-act-h{
display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px
}
.kiro-msg.is-action strong{font-size:.82rem;font-weight:500;color:#fff}
.kiro-msg.is-action .kiro-done{
font-size:.65rem;font-weight:500;color:#5EEAD4;border:1px solid rgba(94,234,212,.35);
background:rgba(94,234,212,.08);border-radius:999px;padding:3px 8px
}
.kiro-msg.is-action p{margin:0;font-size:.8rem;color:#9A9A9A;line-height:1.4}
.kiro-composer{
display:flex;align-items:center;gap:10px;margin:8px 14px 14px;padding:10px 12px 10px 16px;
border-radius:999px;background:#1A1A1A;border:1px solid #2A2A2A;opacity:.72
}
.kiro-composer-ph{flex:1;font-size:.85rem;color:#666}
.kiro-composer-send{
width:28px;height:28px;border-radius:50%;background:#2A2A2A;flex:none;
box-shadow:inset 0 0 0 1px #333
}
@media (max-width:799px){
.kiro-win-body{grid-template-columns:1fr;min-height:0}
.kiro-side{border-right:0;border-bottom:1px solid #222;max-height:240px}
.kiro-pane{min-height:420px}
}
.kiro-band-sec{padding:clamp(28px,4vw,48px) 0 clamp(48px,6vw,80px)}
.kiro-band{
position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(180px,.7fr);
gap:12px;align-items:center;overflow:hidden;
background:#161616;border:1px solid #2A2A2A;border-radius:28px;
padding:clamp(36px,5vw,56px) clamp(28px,5vw,56px) clamp(32px,4vw,48px);
min-height:clamp(220px,28vw,300px)
}
.kiro-band-copy{position:relative;z-index:2;max-width:38ch;padding:4px 0 8px}
.kiro-band-copy h2{
margin:0 0 16px;font-size:clamp(1.75rem,3.2vw,2.55rem);letter-spacing:-.04em;font-weight:500;line-height:1.12
}
.kiro-band-copy p{margin:0;color:#A3A3A3;font-size:clamp(.95rem,1.15vw,1.05rem);line-height:1.55}
.kiro-band-pet{
position:relative;z-index:1;justify-self:end;align-self:end;
margin:0 -6% -18% 0;width:min(300px,42vw);
filter:drop-shadow(0 24px 40px rgba(0,0,0,.5))
}
.kiro-band-pet .px-kiro{width:100%;height:auto;display:block}
.kiro-feat-sec{padding:0 0 clamp(56px,7vw,96px)}
.kiro-feats{
display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:clamp(28px,4vw,40px)
}
.kiro-feat{
display:flex;flex-direction:column;gap:12px;
background:#141414;border:1px solid #262626;border-radius:22px;
padding:22px 22px 0;min-height:340px;overflow:hidden
}
.kiro-feat h3{margin:0;font-size:1.18rem;font-weight:500;letter-spacing:-.025em}
.kiro-feat>p{margin:0;color:var(--mute);font-size:.9rem;line-height:1.45;max-width:42ch}
.kf-stage{
position:relative;margin-top:auto;min-height:200px;border-radius:16px 16px 0 0;
overflow:hidden;isolation:isolate
}
.kf-grain{
position:absolute;inset:0;z-index:0;pointer-events:none;
background:
radial-gradient(120% 80% at 20% 80%,rgba(74,110,70,.45),transparent 55%),
radial-gradient(90% 70% at 80% 30%,rgba(120,90,60,.35),transparent 50%),
radial-gradient(70% 60% at 50% 100%,rgba(40,55,50,.5),transparent 60%),
linear-gradient(180deg,#1a1c18 0%,#0e0e0e 100%);
filter:saturate(.85) contrast(1.05)
}
.kf-grain::after{
content:"";position:absolute;inset:0;opacity:.22;mix-blend-mode:overlay;
background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")
}
.kf-glass{
position:relative;z-index:1;margin:28px 18px 0;border:1px solid rgba(255,255,255,.1);
border-radius:14px 14px 0 0;background:rgba(12,12,12,.78);backdrop-filter:blur(14px);
box-shadow:0 18px 40px rgba(0,0,0,.45);overflow:hidden;min-height:168px
}
.kf-glass-bar{
display:flex;align-items:center;justify-content:space-between;gap:10px;
padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.06);font-size:.7rem;color:#9a9a9a
}
.kf-badge{
display:inline-flex;align-items:center;gap:5px;font-style:normal;font-size:.65rem;font-weight:500;
padding:3px 9px;border-radius:999px;letter-spacing:-.01em
}
.kf-badge.is-you{
color:#E8A54B;border:1px solid rgba(232,165,75,.45);background:rgba(232,165,75,.1);
box-shadow:0 0 12px rgba(232,165,75,.2)
}
.kf-badge.is-you i{
width:6px;height:6px;border-radius:50%;background:#E8A54B;
box-shadow:0 0 6px #E8A54B;animation:kf-dot 1.2s ease-in-out infinite
}
.kf-badge.is-work{
color:#FDBA74;border:1px solid rgba(253,186,116,.45);background:rgba(253,186,116,.1);
box-shadow:0 0 14px rgba(253,186,116,.25)
}
.kf-badge.is-work svg{animation:kf-spin 2.4s linear infinite}
.kf-glass-body{position:relative;padding:14px;min-height:148px;overflow:hidden}
.kf-work label{display:block;font-size:.62rem;color:#777;margin:0 0 4px}
.kf-field{
position:relative;display:flex;align-items:center;height:30px;padding:0 10px;margin:0 0 10px;
border-radius:8px;border:1px solid #2e2e2e;background:#161616;font-size:.78rem;color:#e8e8e8;
transition:border-color .25s,box-shadow .25s
}
.kf-field.is-focus{
border-color:rgba(255,255,255,.28);box-shadow:0 0 0 2px rgba(255,255,255,.06)
}
.kf-field[data-field-pass] span{letter-spacing:.14em;color:#bbb}
.kf-caret{
width:1px;height:14px;background:#e8e8e8;margin-left:1px;flex:none;
animation:kf-caret .9s steps(1) infinite
}
.kf-btn{
margin-top:4px;border:0;border-radius:8px;padding:8px 14px;font-size:.74rem;font-weight:500;
background:#2a2a2a;color:#ddd;cursor:default;transition:background .2s,transform .15s
}
.kf-btn.is-press{background:#3a3a3a;transform:scale(.97)}
.kf-login,.kf-queue{position:relative}
.kf-login[hidden],.kf-queue[hidden]{display:none!important}
.kf-prompt{margin:0 0 12px;font-size:.78rem;color:#d4d4d4;line-height:1.35}
.kf-tasks{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.kf-tasks li{
font-size:.74rem;color:#8a8a8a;padding:7px 10px 7px 28px;position:relative;
border-radius:8px;border:1px solid transparent;background:#161616;transition:color .25s,border-color .25s,background .25s
}
.kf-tasks li::before{
content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;
border-radius:50%;border:1.5px solid #444;background:transparent
}
.kf-tasks li.is-on{color:#eee;border-color:#2e2e2e;background:#1a1a1a}
.kf-tasks li.is-on::before{border-color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.12)}
.kf-tasks li.is-done{color:#6a6a6a;text-decoration:line-through}
.kf-tasks li.is-done::before{border-color:#5EEAD4;background:#5EEAD4}
.kf-cursor{
position:absolute;left:0;top:0;z-index:6;pointer-events:none;
display:flex;align-items:flex-start;gap:5px;will-change:transform;
transition:transform .7s cubic-bezier(.22,.82,.18,1)
}
.kf-cursor b{
display:block;width:11px;height:16px;flex:none;
background:#fff;
clip-path:polygon(0 0,0 100%,28% 76%,48% 100%,58% 94%,38% 68%,100% 68%);
filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))
}
.kf-cursor em{
font-style:normal;font-size:.62rem;font-weight:600;color:#111;background:#fff;
border-radius:6px;padding:2px 7px;margin-top:11px;box-shadow:0 2px 8px rgba(0,0,0,.35);white-space:nowrap
}
.kf-ring{
position:absolute;left:-5px;top:-5px;width:20px;height:20px;border-radius:50%;
border:2px solid rgba(255,255,255,.9);opacity:0;pointer-events:none
}
.kf-cursor.is-click .kf-ring{animation:kf-ring .5s ease-out}
.kf-teach .kf-glass{margin-top:22px;min-height:186px;position:relative}
.kf-teach .kf-glass-body,.kf-teach .kf-sheet{position:relative}
.kf-teach-btn{
display:inline-flex;align-items:center;gap:6px;border:1px solid #3a3a3a;border-radius:999px;
background:#1c1c1c;color:#e8e8e8;font-size:.68rem;font-weight:500;padding:5px 11px;cursor:default;
transition:border-color .25s,box-shadow .25s,background .25s;margin-left:auto
}
.kf-teach-btn i{width:7px;height:7px;border-radius:50%;background:#FF3B3B;box-shadow:0 0 8px rgba(255,59,59,.55)}
.kf-teach-btn.is-hot{border-color:rgba(255,255,255,.3);box-shadow:0 0 0 3px rgba(255,255,255,.08);background:#242424}
.kf-recbar{
display:flex;align-items:center;gap:10px;
padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.06);font-size:.68rem;color:#bdbdbd
}
.kf-recbar.is-rec [data-teach-label]{color:#e8e8e8}
.kf-recbar.is-rec .kf-teach-btn{display:none}
.kf-recbar time{
margin-left:auto;color:#FF5C5C;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:500
}
.kf-recbar.is-rec time{display:inline!important}
.kf-sheet{padding:10px 12px 14px}
.kf-sheet-toolbar{display:flex;gap:8px;margin-bottom:10px}
.kf-sel{
font-size:.65rem;color:#ddd;padding:4px 9px;border-radius:7px;
border:1px solid #2e2e2e;background:#181818
}
.kf-sel.is-mute{color:#777}
.kf-sel.is-open{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 2px rgba(255,255,255,.06)}
.kf-table{width:100%;border-collapse:collapse;font-size:.7rem}
.kf-table th{
text-align:left;font-weight:500;color:#666;padding:0 6px 6px;border-bottom:1px solid #222
}
.kf-table td{
padding:7px 6px;color:#c8c8c8;border-bottom:1px solid #1e1e1e;vertical-align:middle
}
.kf-table td:first-child{width:18px;padding-left:2px}
.kf-table td i{
display:block;width:11px;height:11px;border-radius:3px;border:1.5px solid #3a3a3a;background:transparent
}
.kf-table tr.is-on td{background:rgba(255,255,255,.03)}
.kf-table tr.is-on td i{border-color:#fff;background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.1)}
.kf-table tr.is-done td{color:#7a7a7a}
.kf-table tr.is-done td i{border-color:#5EEAD4;background:#5EEAD4}
.kf-table em{font-style:normal;font-size:.62rem;color:#888;padding:2px 7px;border-radius:999px;background:#1a1a1a;border:1px solid #2a2a2a}
.kf-table tr.is-done em{color:#5EEAD4;border-color:rgba(94,234,212,.25);background:rgba(94,234,212,.06)}
.kf-teach .kf-cursor{left:0;top:0}
.kf-mem{
display:flex;flex-direction:column;gap:10px;justify-content:flex-end;
padding:18px 8px 22px;min-height:210px;background:
radial-gradient(80% 60% at 50% 100%,rgba(80,60,120,.12),transparent 60%)
}
.kf-mem .kf-grain{display:none}
.kf-bub{
max-width:94%;font-size:.78rem;line-height:1.4;color:#d0d0d0;
background:#1c1c1c;border:1px solid #2c2c2c;border-radius:14px;padding:11px 13px;
opacity:0;transform:translateY(14px)
}
.kf-bub.is-in{opacity:1;transform:none;transition:opacity .45s ease,transform .45s ease}
.kf-bub.is-b{align-self:stretch}
.kf-memfoot{
display:flex;align-items:center;gap:8px;margin-top:4px;font-size:.72rem;color:#9a9a9a;
opacity:0;transform:translateY(8px)
}
.kf-memfoot.is-in{opacity:1;transform:none;transition:opacity .4s ease .05s,transform .4s ease}
.kf-pill{
display:inline-flex;align-items:center;gap:6px;color:#C4B5FD;font-weight:500;
background:rgba(124,92,255,.12);border:1px solid rgba(167,139,250,.35);
border-radius:999px;padding:4px 10px 4px 6px;box-shadow:0 0 16px rgba(124,92,255,.18)
}
.kf-pill .px-kiro{width:16px;height:16px}
.kf-link{
display:grid;place-items:center;min-height:210px;padding:24px 12px 28px;
background:radial-gradient(60% 50% at 50% 60%,rgba(255,255,255,.03),transparent 70%)
}
.kf-dock{
display:flex;align-items:center;gap:2px;padding:8px;border-radius:999px;
background:rgba(20,20,20,.9);border:1px solid #2a2a2a;
box-shadow:0 12px 40px rgba(0,0,0,.4)
}
.kf-av{display:grid;place-items:center;width:40px;height:40px;flex:none}
.kf-av .px-kiro{width:34px;height:34px}
.kf-status{
display:inline-flex;align-items:center;gap:3px;margin:0 6px;padding:8px 14px;
border-radius:999px;font-size:.72rem;font-weight:500;white-space:nowrap;
transition:color .3s,background .3s,border-color .3s
}
.kf-status i{
width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.35;
animation:kf-ellip 1.1s ease-in-out infinite
}
.kf-status i:nth-child(2){animation-delay:.15s}
.kf-status i:nth-child(3){animation-delay:.3s}
.kf-status.is-ask{color:#5EEAD4;background:rgba(94,234,212,.08);border:1px solid rgba(94,234,212,.28)}
.kf-status.is-ping{color:#FDBA74;background:rgba(253,186,116,.08);border:1px solid rgba(253,186,116,.3)}
.kf-status.is-loop{color:#C4B5FD;background:rgba(196,181,253,.08);border:1px solid rgba(196,181,253,.3)}
.kf-link[data-mode="ping"] .kf-dock .kf-av:first-child{order:2}
.kf-link[data-mode="ping"] .kf-status{order:3}
.kf-link[data-mode="ping"] .kf-av:nth-child(3){order:1}
.kf-link[data-mode="ping"] .kf-av:nth-child(4){order:4}
.kf-link[data-mode="loop"] .kf-dock .kf-av:first-child{order:1}
.kf-link[data-mode="loop"] .kf-status{order:2}
.kf-link[data-mode="loop"] .kf-av:nth-child(3){order:3}
.kf-link[data-mode="loop"] .kf-av:nth-child(4){order:4}
.kiro-video-sec{padding:0 0 clamp(56px,7vw,96px)}
.kiro-video-sec h2{text-align:center;font-size:clamp(1.45rem,2.4vw,1.9rem);letter-spacing:-.03em;color:#fff;margin:0 0 clamp(22px,3vw,34px)}
.kvp{max-width:1180px;margin:0 auto}
.kiro-video{position:relative;margin:0 auto;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#111;isolation:isolate}
.kiro-video video{display:block;width:100%;height:100%;object-fit:cover;background:#111;cursor:pointer}
.kv-hint{position:absolute;top:14px;right:14px;z-index:1;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 11px;margin:0;border:0;border-radius:999px;background:rgba(10,10,11,.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font:500 .85rem/1 "Inter",sans-serif;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s linear .3s,background-color .2s}
.kv-hint[hidden]{display:none}
.kvp.is-muted .kv-hint{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ease),transform .3s var(--ease),background-color .2s}
.kv-hint:hover{background:rgba(32,32,35,.86)}
.kv-hint svg{width:17px;height:17px;flex:none}
.kv-bar{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;gap:4px;padding:6px 10px;border-radius:12px;background:rgba(28,28,30,.88);border:1px solid rgba(255,255,255,.12);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .28s var(--ease),transform .28s var(--ease)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.kv-bar{background:rgba(28,28,30,.45);-webkit-backdrop-filter:blur(14px) saturate(1.2) brightness(.7);backdrop-filter:blur(14px) saturate(1.2) brightness(.7)}}
.kvp.is-paused:not(.is-preview) .kv-bar,.kvp.ui-on:not(.is-preview) .kv-bar,.kv-bar:focus-within{opacity:1;transform:none;pointer-events:auto}
.kvp:not(.ui-on):not(.is-paused):not(.is-preview) video{cursor:none}
.kv-bar[hidden]{display:none}
.kv-btn{flex:none;display:inline-grid;place-items:center;width:40px;height:40px;margin:0;padding:0;border:0;border-radius:10px;background:transparent;color:#fff;cursor:pointer;transition:background-color .2s var(--ease)}
.kv-btn:hover{background:rgba(255,255,255,.12)}
.kv-btn svg{width:22px;height:22px}
.kv-btn:focus,.kv-slider:focus,.kv-hint:focus{outline:none}
.kv-btn:focus-visible,.kv-slider:focus-visible,.kv-hint:focus-visible{outline:2px solid #fff;outline-offset:2px}
.kvp:not(.is-paused) .i-play,.kvp.is-paused .i-pause,.kvp.is-muted .kv-btn .i-vol,.kvp:not(.is-muted) .kv-btn .i-mute,.kvp.is-fs .i-fs,.kvp:not(.is-fs) .i-fsx{display:none}
.kv-time{flex:none;min-width:2.9em;text-align:center;font:500 .82rem/1 "Inter",sans-serif;font-variant-numeric:tabular-nums;color:#fff}
.kv-slider{--p:0%;--b:0%;position:relative;flex:1 1 auto;min-width:0;height:34px;margin:0 6px;border-radius:6px;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}
.kv-vol{flex:0 0 84px;margin-left:0}
.kv-track{position:absolute;left:0;right:0;top:50%;height:4px;transform:translateY(-50%);border-radius:4px;background:rgba(255,255,255,.34);overflow:hidden;transition:height .2s var(--ease)}
.kv-buf,.kv-fill{position:absolute;top:0;bottom:0;left:0}
.kv-buf{width:var(--b);background:rgba(255,255,255,.55);transition:width .4s linear}
.kv-fill{width:var(--p);background:#fff}
.kv-thumb{position:absolute;top:50%;left:var(--p);width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:#fff;transform:scale(0);transition:transform .2s var(--ease)}
.kv-slider:hover .kv-thumb,.kv-slider:focus-visible .kv-thumb,.kv-slider.is-drag .kv-thumb{transform:scale(1)}
.kv-slider:hover .kv-track,.kv-slider.is-drag .kv-track{height:6px}
.kvp:fullscreen{max-width:none;display:flex;flex-direction:column;padding:0;background:#000}
.kvp:fullscreen .kiro-video{border-radius:0;flex:1 1 auto;width:100%;max-width:none;max-height:none;aspect-ratio:auto;min-height:0}
.kvp:fullscreen video{object-fit:contain;background:#000}
.kvp:-webkit-full-screen{max-width:none;width:100%;height:100%;display:flex;flex-direction:column;padding:0;background:#000}
.kvp:-webkit-full-screen .kiro-video{border-radius:0;flex:1 1 auto;width:100%;max-width:none;max-height:none;aspect-ratio:auto;min-height:0}
.kvp:-webkit-full-screen video{object-fit:contain;background:#000}
@media (max-width:640px) and (orientation:portrait){
.kvp{max-width:440px}
.kiro-video{aspect-ratio:9/16;max-height:82svh;border-radius:14px}
.kiro-video video{object-fit:contain}
.kv-bar{left:8px;right:8px;bottom:8px;gap:0;padding:4px 6px;border-radius:11px}
.kv-btn{width:40px;height:40px}
.kv-vol{display:none}
.kv-time{min-width:2.6em;font-size:.78rem}
.kv-slider{margin:0 4px}
}
@media (prefers-reduced-motion:reduce){.kv-hint,.kvp.is-muted .kv-hint,.kv-bar,.kv-btn,.kv-track,.kv-buf,.kv-thumb{transition:none}}
.kiro-faq-sec{padding:0 0 clamp(48px,6vw,80px)}
.kiro-faq-sec .acc-list{margin-top:clamp(24px,3vw,36px)}
@keyframes kf-caret{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes kf-dot{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes kf-spin{to{transform:rotate(360deg)}}
@keyframes kf-ring{
0%{opacity:.9;transform:scale(.55)}
100%{opacity:0;transform:scale(1.7)}
}
@keyframes kf-ellip{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
@media (prefers-reduced-motion:reduce){
.kf-badge.is-you i,.kf-badge.is-work svg,.kf-caret,.kf-status i,.kf-ring{animation:none!important}
.kf-bub,.kf-memfoot{opacity:1;transform:none}
.kf-cursor{transition:none}
}
@media (max-width:799px){
.kiro-band{grid-template-columns:1fr;padding-bottom:clamp(80px,22vw,120px);min-height:0}
.kiro-band-pet{justify-self:center;margin:8px auto -22%;width:min(220px,55vw)}
.kiro-feats{grid-template-columns:1fr}
.kiro-feat{min-height:300px}
}
@media (max-width:899px){
.bento{grid-template-columns:1fr 1fr}
.bento-wide,.bento-kiro{grid-column:1/-1}
.bento-kiro-in{grid-template-columns:auto 1fr;grid-template-rows:auto auto}
.bento-kiro-go{grid-column:2;justify-self:start;margin-top:6px}
.why-grid{grid-template-columns:1fr}
}
@media (max-width:559px){
.bento{grid-template-columns:1fr}
.bento-kiro{grid-column:1}
.bento-kiro-in{grid-template-columns:1fr;gap:14px}
.bento-kiro-side{align-items:flex-start}
.bento-kiro-go{grid-column:1}
.hero-rot{min-width:6.5ch}
}
@media (prefers-reduced-motion:reduce){
.mega,.mega-in>div,.bento-card,.nav>a,.hero-rot-in{transition:none!important}
.mega.is-open .mega-in>div{transition-delay:0s!important}
.bento-card:hover,.svc-card:hover{transform:none}
}
.lx-hero{padding:clamp(100px,14vw,160px) 0 clamp(40px,5vw,64px);text-align:center}
.lx-hero-in{max-width:720px;margin:0 auto}
.lx-hero .crumb{justify-content:center;margin-bottom:20px}
.lx-hero .eyebrow{margin-bottom:18px}
.lx-hero h1{
margin:0 0 18px;font-size:clamp(2.4rem,5.5vw,4rem);font-weight:500;
letter-spacing:-.045em;line-height:1.05
}
.lx-hero .lead{margin:0 auto;max-width:42ch;color:var(--mute);font-size:1.05rem;line-height:1.55}
.lx-grid-sec{padding:0 0 clamp(56px,7vw,96px)}
.lx-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lx-card{
display:flex;flex-direction:column;border:1px solid #262626;border-radius:24px;
background:#121212;overflow:hidden;text-decoration:none;color:inherit;
min-height:420px;position:relative;transition:border-color .25s,transform .25s,background .25s
}
.lx-card:hover{border-color:#3a3a3a;background:#161616;transform:translateY(-3px)}
.lx-card-n{
position:absolute;top:16px;left:16px;z-index:2;font-size:.72rem;color:#888;
font-variant-numeric:tabular-nums;padding:5px 9px;border-radius:999px;
border:1px solid #2e2e2e;background:rgba(10,10,10,.7)
}
.lx-card-viz{flex:1;min-height:220px;position:relative;overflow:hidden;background:#0a0a0a}
.lx-card-viz img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92;transition:transform .55s ease,opacity .35s}
.lx-card:hover .lx-card-viz img{transform:scale(1.03);opacity:1}
.lx-card-viz-live{display:grid;place-items:center;padding:28px}
.lx-card-body{padding:22px 22px 24px;border-top:1px solid #222}
.lx-card-body h2{margin:0 0 8px;font-size:1.35rem;font-weight:500;letter-spacing:-.03em}
.lx-card-body p{margin:0 0 16px;color:var(--mute);font-size:.92rem;line-height:1.45;max-width:40ch}
.lx-go{font-size:.88rem;color:#ddd;border-bottom:1px solid #333;padding-bottom:2px}
.lx-card:hover .lx-go{color:#fff;border-color:#fff}
.lx-ops,.lx-scan{width:min(100%,280px);display:grid;gap:8px}
.lx-ops-row,.lx-scan-row{
display:flex;justify-content:space-between;align-items:center;gap:10px;
padding:10px 12px;border-radius:12px;border:1px solid #262626;background:#101010;font-size:.8rem;color:#9a9a9a
}
.lx-ops-row.is-on{color:#e8e8e8;border-color:#333}
.lx-ops-row em,.lx-scan-row span{font-style:normal;color:#6a6a6a}
.lx-ops-row.is-on em{color:#5EEAD4}
.lx-scan-row b{font-weight:500;font-size:.68rem;padding:2px 7px;border-radius:6px}
.lx-scan-row.hi b{color:#FDBA74;background:rgba(253,186,116,.1)}
.lx-scan-row.mid b{color:#93C5FD;background:rgba(147,197,253,.08)}
.lx-scan-row.low b{color:#9a9a9a;background:#1a1a1a}
.lx-band-sec{padding:0 0 clamp(64px,8vw,100px)}
.lx-band{
display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px;align-items:center;
padding:clamp(28px,4vw,40px);border:1px solid #262626;border-radius:24px;background:#121212
}
.lx-band h2{margin:8px 0 10px;font-size:clamp(1.4rem,2.4vw,1.85rem);letter-spacing:-.03em;font-weight:500}
.lx-band>div p:last-child{margin:0;color:var(--mute);max-width:42ch;line-height:1.5}
.lx-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lx-steps li{
display:flex;flex-direction:column;gap:4px;padding:14px 14px;border-radius:14px;
border:1px solid #262626;background:#0e0e0e
}
.lx-steps strong{font-size:.72rem;color:#777;font-weight:500}
.lx-steps span{font-size:.92rem;color:#e8e8e8}
@media (max-width:799px){
.lx-grid{grid-template-columns:1fr}
.lx-band{grid-template-columns:1fr}
.lx-card{min-height:360px}
}
.page-web .wrap.narrow,
.page-srv .wrap.narrow,
.page-sec .wrap.narrow{max-width:720px;margin-left:auto;margin-right:auto}
.ls-sec{padding:0 0 clamp(64px,8vw,100px)}
.ls-index{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto clamp(36px,5vw,56px)}
.ls-index a{
display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border-radius:999px;
border:1px solid #2a2a2a;background:#0d0d0d;color:#d4d4d4;font-size:.88rem;text-decoration:none;
transition:border-color .25s,color .25s,background .25s
}
.ls-index a span{font-family:var(--mono);font-size:.72rem;color:#8a8a8a;transition:color .25s}
.ls-index a:hover{border-color:#404040;background:#141414;color:#fff}
.ls-index a:hover span{color:#d4d4d4}
.ls-index a:focus-visible,.ls-list a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ls-stack{display:grid;gap:16px}
.ls-panel{
display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
gap:clamp(24px,4vw,56px);align-items:stretch;
padding:clamp(16px,2vw,24px);border:1px solid var(--line);border-radius:28px;background:#0A0A0A;
scroll-margin-top:96px;transition:border-color .3s cubic-bezier(.16,1,.3,1),background .3s
}
.ls-panel:hover{border-color:#2c2c2c;background:#0C0C0C}
.ls-panel.is-rev{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.ls-panel.is-rev .ls-copy{order:2}
.ls-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(8px,2.2vw,32px);min-width:0}
.ls-n{
display:block;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:#8a8a8a;margin-bottom:16px
}
.ls-copy h2{
margin:0 0 16px;font-size:clamp(1.9rem,3.1vw,2.6rem);font-weight:500;letter-spacing:-.035em;line-height:1.06;max-width:16ch
}
.ls-copy h2 span{display:block;color:var(--mute);font-size:.62em;letter-spacing:-.025em;line-height:1.2;margin-top:10px}
.ls-copy>p{margin:0;color:var(--mute);font-size:1rem;line-height:1.55;max-width:44ch}
.ls-list{list-style:none;margin:26px 0 30px;padding:0;border-top:1px solid var(--line)}
.ls-list li{border-bottom:1px solid var(--line)}
.ls-list a{
display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:16px;align-items:baseline;
padding:13px 2px;color:inherit;text-decoration:none;transition:padding .25s cubic-bezier(.16,1,.3,1)
}
.ls-list strong{font-weight:500;font-size:.95rem;color:#e8e8e8;transition:color .2s}
.ls-list span{font-size:.86rem;color:var(--mute);text-align:right}
.ls-list a:hover{padding-left:8px}
.ls-list a:hover strong{color:#fff}
.ls-copy .btn{align-self:flex-start}
.ls-stage{
position:relative;border-radius:20px;overflow:hidden;min-height:440px;
border:1px solid #262626;background:#0a0a0a;display:grid;place-items:center;
padding:clamp(20px,3.6vw,48px)
}
.ls-stage-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9;pointer-events:none;z-index:0}
.ls-win{
position:relative;z-index:1;width:100%;max-width:600px;border-radius:16px;border:1px solid #2e2e2e;
background:rgba(14,14,14,.94);overflow:hidden;box-shadow:0 28px 60px rgba(0,0,0,.5);
transition:transform .45s cubic-bezier(.16,1,.3,1)
}
.ls-win-live{max-width:500px}
.ls-panel:hover .ls-win{transform:translateY(-4px)}
.ls-win-bar{
display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid #222;
background:#161616;font-size:.7rem;color:#9a9a9a
}
.ls-win-bar i{width:8px;height:8px;border-radius:50%;background:#333;flex:none}
.ls-win-bar i:nth-child(1){background:#ef4444}
.ls-win-bar i:nth-child(2){background:#eab308}
.ls-win-bar i:nth-child(3){background:#22c55e}
.ls-win-bar em{margin-left:8px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ls-live{
margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:.66rem;font-weight:500;color:#5EEAD4;
padding:3px 9px;border-radius:999px;border:1px solid rgba(94,234,212,.28);background:rgba(94,234,212,.07)
}
.ls-live b{width:6px;height:6px;border-radius:50%;background:#5EEAD4;animation:kf-dot 1.4s ease-in-out infinite}
.ls-win-img{background:#0a0a0a}
.ls-win-img img{display:block;width:100%;height:auto;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.ls-panel:hover .ls-win-img img{transform:scale(1.02)}
.ls-win-chat{display:flex;flex-direction:column;height:320px;background:#0C0C0C;font-family:var(--sans)}
.ls-win-chat .bento-chat-thread{padding:16px 14px;gap:9px;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 44px);mask-image:linear-gradient(180deg,transparent 0,#000 44px)}
.ls-win-chat .bento-chat-bubble{font-size:.8rem;padding:9px 12px}
.ls-win-chat .bento-chat-row .who{font-size:.6rem;color:#8a8a8a}
.ls-win-term{display:flex;flex-direction:column}
.ls-win-term .bento-sec-term{height:300px;flex:none;font-size:.7rem;line-height:1.55;padding:14px 16px}
@media (max-width:960px){
.ls-panel,.ls-panel.is-rev{grid-template-columns:1fr;gap:8px}
.ls-panel.is-rev .ls-copy{order:0}
.ls-stage{min-height:340px;order:-1}
.ls-copy{padding:20px 8px 12px}
}
@media (max-width:560px){
.ls-index{justify-content:flex-start}
.ls-index a{padding:8px 13px;font-size:.84rem}
.ls-panel{padding:12px;border-radius:22px}
.ls-copy{padding:18px 6px 8px}
.ls-list{margin:22px 0 24px}
.ls-list a{padding:11px 2px}
.ls-list a{grid-template-columns:1fr;gap:2px}
.ls-list span{text-align:left}
.ls-stage{min-height:0;padding:16px;border-radius:16px}
.ls-win-chat{height:280px}
.ls-win-term .bento-sec-term{height:260px;font-size:.62rem}
}
@media (prefers-reduced-motion:reduce){
.ls-win,.ls-win-img img,.ls-list a{transition:none}
.ls-panel:hover .ls-win,.ls-panel:hover .ls-win-img img{transform:none}
.ls-live b{animation:none}
}
.sec-promise{padding:clamp(72px,9vw,120px) 0;border-top:1px solid var(--line)}
.promise-head{
display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,72px);
align-items:end;margin-bottom:clamp(36px,5vw,56px)
}
.promise-head h2{margin:0;font-size:clamp(2rem,3.6vw,3rem);font-weight:500;letter-spacing:-.04em;line-height:1.04;max-width:15ch}
.promise-head>p{margin:0;color:var(--mute);font-size:1.05rem;line-height:1.6;max-width:44ch}
.promise-board{
display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr) 1px minmax(0,1fr);
padding:clamp(12px,1.4vw,16px);border:1px solid var(--line);border-radius:28px;background:#0A0A0A
}
.promise-card{display:flex;flex-direction:column;min-width:0;padding:0 clamp(4px,.6vw,8px)}
.promise-viz{
position:relative;overflow:hidden;border-radius:20px;border:1px solid #232323;background:#0a0a0a;
height:290px;display:grid;place-items:center;padding:24px;transition:border-color .5s
}
.promise-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;transition:opacity .6s;pointer-events:none}
.promise-card.is-on .promise-viz{border-color:#333}
.promise-card.is-on .promise-bg{opacity:.95}
.promise-win{
position:relative;z-index:1;width:100%;max-width:320px;border-radius:14px;border:1px solid #2a2a2a;
background:rgba(14,14,14,.95);overflow:hidden;box-shadow:0 24px 50px rgba(0,0,0,.5);
transform:translateY(6px);opacity:.78;transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .6s,border-color .6s
}
.promise-card.is-on .promise-win{transform:none;opacity:1;border-color:#3a3a3a}
.promise-win .ls-win-bar{padding:8px 10px;font-size:.66rem}
.promise-win .ls-win-bar i{width:7px;height:7px}
.promise-copy{padding:22px clamp(8px,1.2vw,16px) 14px}
.promise-n{display:block;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:#8a8a8a;margin-bottom:12px;transition:color .4s}
.promise-card.is-on .promise-n{color:#e5e5e5}
.promise-card h3{margin:0 0 8px;font-size:1.12rem;font-weight:500;letter-spacing:-.02em;line-height:1.3}
.promise-card p{margin:0;color:var(--mute);font-size:.92rem;line-height:1.55;max-width:34ch}
.promise-join{position:relative;background:var(--line);margin:24px 0;overflow:hidden}
.promise-join i{position:absolute;inset:0;display:block}
.promise-join i::after{
content:"";position:absolute;left:0;right:0;top:0;height:35%;
background:#d4d4d4;opacity:0;transition:opacity .4s
}
.promise-board.is-run .promise-join.is-lit i::after{opacity:.7;animation:promise-run 2.4s ease-in-out infinite}
@keyframes promise-run{0%{transform:translateY(-110%)}100%{transform:translateY(310%)}}
.pv-browser{position:relative;padding:12px;display:grid;gap:10px}
.pv-nav{display:flex;align-items:center;justify-content:space-between}
.pv-nav>b{width:34px;height:6px;border-radius:3px;background:#3a3a3a}
.pv-nav span{display:flex;gap:5px}
.pv-nav span i{width:16px;height:4px;border-radius:2px;background:#262626}
.pv-hero{display:grid;justify-items:start;gap:6px;padding:14px 12px;border-radius:9px;border:1px solid #222;background:#111;position:relative;overflow:hidden}
.pv-hero b{display:block;height:7px;border-radius:4px;background:#d4d4d4}
.pv-h1{width:72%}.pv-hero .pv-h2{width:48%;background:#5a5a5a}
.pv-btn{margin-top:6px;width:52px;height:14px;border-radius:999px;background:#fff}
.pv-hero::after{
content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);opacity:0
}
.promise-card.is-on .pv-hero::after{opacity:1;animation:promise-scan 2.6s ease-in-out infinite}
.pv-lines{display:grid;gap:6px}
.pv-lines b{display:block;height:5px;border-radius:3px;background:#1f1f1f}
.pv-lines b:nth-child(1){width:88%}.pv-lines b:nth-child(2){width:64%}.pv-lines b:nth-child(3){width:76%}
.pv-cursor{
position:absolute;right:30%;bottom:34%;width:10px;height:10px;border-left:2px solid #fff;border-top:2px solid #fff;
transform:rotate(-12deg);opacity:0;transition:opacity .4s
}
.promise-card.is-on .pv-cursor{opacity:1;animation:promise-cursor 2.8s ease-in-out infinite}
.pv-rack{padding:12px;display:grid;gap:7px;font-family:var(--mono);font-size:.7rem}
.pv-rack-row{
display:flex;justify-content:space-between;padding:8px 10px;border-radius:8px;border:1px solid #222;
background:#111;color:#8a8a8a;transition:color .4s,border-color .4s
}
.pv-rack-row em{font-style:normal;color:#737373}
.pv-rack-row.is-on{color:#e8e8e8;border-color:#333}
.pv-rack-row.is-on em{color:#fff}
.pv-meter{height:4px;border-radius:999px;background:#1f1f1f;overflow:hidden;margin-top:2px}
.pv-meter i{display:block;height:100%;border-radius:inherit;background:#e5e5e5;transition:width 1s cubic-bezier(.16,1,.3,1)}
.pv-tag{justify-self:start;margin-top:2px;font-family:var(--sans);font-size:.66rem;color:#d4d4d4;padding:3px 9px;border-radius:999px;border:1px solid #333;background:#141414}
.pv-shield{display:flex;align-items:center;gap:16px;padding:16px 14px}
.pv-shield svg{flex:none}
.pv-shield-path{fill:none;stroke:#4a4a4a;stroke-width:2;stroke-linejoin:round;transition:stroke .5s}
.pv-check{fill:none;stroke:#4a4a4a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke .5s}
.promise-card.is-on .pv-shield-path{stroke:#e5e5e5}
.promise-card.is-on .pv-check{stroke:#fff;animation:promise-check .7s ease forwards .2s}
.pv-checks{list-style:none;margin:0;padding:0;display:grid;gap:6px;flex:1;min-width:0}
.pv-checks li{
position:relative;padding:7px 10px 7px 26px;border-radius:8px;border:1px solid #222;background:#111;
font-size:.72rem;color:#8a8a8a;transition:color .4s,border-color .4s,background .4s
}
.pv-checks li::before{content:"";position:absolute;left:10px;top:50%;width:7px;height:7px;margin-top:-4px;border-radius:50%;border:1px solid #555}
.pv-checks li.is-on{color:#fff;border-color:#3a3a3a;background:#161616}
.pv-checks li.is-on::before{background:#fff;border-color:#fff}
@keyframes promise-scan{0%{left:-40%}100%{left:120%}}
@keyframes promise-cursor{0%,100%{transform:translate(0,0) rotate(-12deg)}50%{transform:translate(-14px,-8px) rotate(-12deg)}}
@keyframes promise-check{to{stroke-dashoffset:0}}
@media (max-width:960px){
.promise-head{grid-template-columns:1fr;align-items:start}
.promise-board{grid-template-columns:1fr;gap:0}
.promise-join{height:1px;margin:4px 8px}
.promise-join i::after{top:0;bottom:0;left:0;height:auto;width:30%}
.promise-board.is-run .promise-join.is-lit i::after{animation-name:promise-run-h}
.promise-card{padding:8px 0}
.promise-viz{height:230px}
.promise-win{max-width:340px}
}
@keyframes promise-run-h{0%{transform:translateX(-110%)}100%{transform:translateX(340%)}}
@media (prefers-reduced-motion:reduce){
.promise-join i::after,.pv-cursor,.pv-hero::after,.pv-check{animation:none!important}
.pv-check{stroke-dashoffset:0}
.promise-win{transition:none}
}
.page-web,.page-srv,.page-sec{--page-accent:#fff}
.svc-hero{padding:clamp(104px,13vw,150px) 0 clamp(56px,7vw,88px)}
.svc-hero-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
.svc-hero-copy{min-width:0}
.svc-hero .crumb{margin-bottom:22px}
.svc-hero h1{margin:0 0 20px;font-size:clamp(2.4rem,4.4vw,3.7rem);font-weight:500;letter-spacing:-.045em;line-height:1}
.svc-hero .lead{margin:0;max-width:44ch;color:var(--mute);font-size:1.08rem;line-height:1.6}
.svc-hero .btns{margin-top:30px}
.svc-stage{min-height:440px}
.svc-win{max-width:500px}
.svc-win-wide{max-width:600px}
.svc-live{
margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:.66rem;font-weight:500;color:#e5e5e5;
padding:3px 9px;border-radius:999px;border:1px solid #333;background:#141414
}
.svc-live b{width:6px;height:6px;border-radius:50%;background:#fff;animation:kf-dot 1.6s ease-in-out infinite}
.svc-win-note{margin-left:auto;font-size:.66rem;color:#8a8a8a;white-space:nowrap}
.svc-status{list-style:none;margin:0;padding:6px 0;font-family:var(--mono);font-size:.84rem}
.svc-status li{display:grid;grid-template-columns:1fr auto 8px;gap:14px;align-items:center;padding:13px 16px;border-bottom:1px solid #1c1c1c}
.svc-status li:last-child{border-bottom:0}
.svc-status span{color:#e8e8e8}
.svc-status em{font-style:normal;color:var(--mute)}
.svc-status i{width:7px;height:7px;border-radius:50%;background:#d4d4d4;box-shadow:0 0 0 3px rgba(255,255,255,.06)}
.svc-find{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:16px;border-bottom:1px solid #1c1c1c;scroll-margin-top:110px}
.svc-find:last-child{border-bottom:0}
.svc-find b{
align-self:start;justify-self:start;font-size:.64rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
padding:4px 8px;border-radius:6px;border:1px solid #333;color:#d4d4d4
}
.svc-find.hi b{background:#fff;border-color:#fff;color:#000}
.svc-find.low b{color:#a3a3a3;border-color:#2a2a2a}
.svc-find strong{display:block;margin:0 0 4px;font-size:.95rem;font-weight:500;color:#f0f0f0;letter-spacing:-.01em}
.svc-find p{margin:0;font-size:.84rem;line-height:1.45;color:var(--mute)}
.svc-intro{padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--line)}
.svc-intro-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,72px);align-items:end}
.svc-k,.svc-intro .svc-k{margin:0 0 14px;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:#8a8a8a}
.svc-intro h2{margin:0;font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.06;max-width:17ch}
.svc-intro-grid>p{margin:0;color:var(--mute);font-size:1.05rem;line-height:1.6;max-width:46ch}
.svc-cards-sec{padding:0 0 clamp(72px,9vw,120px);scroll-margin-top:80px}
.svc-sec-head{margin-bottom:clamp(28px,4vw,44px)}
.svc-sec-head h2{margin:0;font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.06}
.svc-index{justify-content:flex-start;margin:26px 0 0}
.svc-card-n{
display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;padding:0 9px;border-radius:999px;
border:1px solid #2a2a2a;background:#111;font-family:var(--mono);font-size:.72rem;color:#a3a3a3
}
.svc-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.svc-card{
padding:clamp(24px,3vw,36px);border:1px solid var(--line);border-radius:22px;background:#0A0A0A;
min-height:240px;display:flex;flex-direction:column;scroll-margin-top:110px;transition:border-color .3s,background .3s
}
.svc-card:hover,.svc-row:hover,.svc-f:hover{border-color:#2e2e2e;background:#0C0C0C}
.svc-card h3{margin:auto 0 10px;padding-top:40px;font-size:1.4rem;font-weight:500;letter-spacing:-.03em}
.svc-card p{margin:0;color:var(--mute);font-size:.95rem;line-height:1.55;max-width:48ch}
.svc-card .svc-card-n{align-self:flex-start}
.svc-rows{display:grid;gap:12px}
.svc-row{
display:grid;grid-template-columns:56px minmax(0,1.3fr) minmax(0,.9fr);gap:clamp(16px,3vw,40px);align-items:start;
padding:clamp(24px,3vw,34px);border:1px solid var(--line);border-radius:22px;background:#0A0A0A;scroll-margin-top:110px;
transition:border-color .3s,background .3s
}
.svc-row h3{margin:0 0 10px;font-size:1.35rem;font-weight:500;letter-spacing:-.03em}
.svc-row p{margin:0;color:var(--mute);font-size:.95rem;line-height:1.55;max-width:52ch}
.svc-pts{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.svc-pts li{position:relative;padding:11px 0 11px 20px;border-bottom:1px solid var(--line);font-size:.9rem;color:#d4d4d4}
.svc-pts li::before{content:"";position:absolute;left:2px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#e5e5e5}
.svc-praxis{padding:0 0 clamp(72px,9vw,120px)}
.svc-praxis-grid{
display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center;
padding:clamp(28px,4vw,52px);border:1px solid var(--line);border-radius:28px;background:#0A0A0A
}
.svc-praxis h2{margin:0 0 16px;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:500;letter-spacing:-.04em;line-height:1.08}
.svc-praxis-grid>div>p:last-child{margin:0;color:var(--mute);line-height:1.6;max-width:44ch}
.svc-facts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.svc-facts li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:18px 20px;border:1px solid #222;border-radius:14px;background:#111}
.svc-facts strong{font-size:1rem;font-weight:500;color:#f0f0f0}
.svc-facts span{font-size:.86rem;color:var(--mute);text-align:right}
.svc-formats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.svc-f{
display:flex;flex-direction:column;padding:clamp(24px,3vw,36px);border:1px solid var(--line);border-radius:22px;background:#0A0A0A;
scroll-margin-top:110px;transition:border-color .3s,background .3s;min-width:0
}
.svc-f-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px}
.svc-f-top span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;padding:0 9px;border-radius:999px;border:1px solid #2a2a2a;background:#111;font-family:var(--mono);font-size:.72rem;color:#a3a3a3}
.svc-f-top em{font-style:normal;font-size:.78rem;color:#a3a3a3}
.svc-f h3{margin:0 0 12px;font-size:clamp(1.5rem,2.4vw,1.9rem);font-weight:500;letter-spacing:-.035em}
.svc-f p{margin:0 0 12px;color:var(--mute);font-size:.95rem;line-height:1.55;max-width:50ch}
.svc-f .svc-f-lead{color:#e5e5e5;font-size:1.02rem}
.svc-f-viz{margin-top:auto;padding-top:20px}
.svc-flow{display:flex;flex-wrap:wrap;gap:6px}
.svc-flow span{font-size:.78rem;color:#d4d4d4;padding:6px 12px;border-radius:999px;border:1px solid #2a2a2a;background:#111}
.svc-flow span:first-child{background:#fff;color:#000;border-color:#fff}
.svc-sitemap{list-style:none;margin-bottom:0;padding-left:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.svc-sitemap li{font-size:.76rem;color:#a3a3a3;text-align:center;padding:9px 4px;border-radius:9px;border:1px solid #222;background:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.svc-sitemap li:first-child{color:#fff;border-color:#3a3a3a}
.svc-steps{list-style:none;margin-bottom:0;padding-left:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;counter-reset:st}
.svc-steps li{display:grid;gap:4px;padding:12px;border-radius:12px;border:1px solid #222;background:#111}
.svc-steps strong{font-size:.9rem;font-weight:500;color:#eee}
.svc-steps span{font-size:.78rem;color:var(--mute);line-height:1.4}
.svc-f-land{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:stretch;padding:clamp(16px,2vw,24px)}
.svc-f-land-copy{padding:clamp(8px,2vw,24px);display:flex;flex-direction:column;justify-content:center}
.svc-f-land .svc-pts{margin-top:14px;max-width:360px}
.svc-f-stage{min-height:320px}
.svc-lp{max-width:420px}
.svc-lp-body{display:grid;justify-items:center;gap:9px;padding:34px 24px 30px}
.svc-lp-body b{display:block;height:9px;border-radius:5px;background:#e5e5e5}
.svc-lp-h{width:70%}.svc-lp-body .svc-lp-h2{width:46%;height:9px}
.svc-lp-body .svc-lp-l{width:58%;height:5px;background:#3a3a3a;margin-top:6px}
.svc-lp-body .svc-lp-l.s{width:40%;margin-top:0}
.svc-f-wide{
grid-column:1/-1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:clamp(24px,4vw,56px);
grid-template-areas:"top top" "h viz" "p viz";align-content:start
}
.svc-f-wide>.svc-f-top{grid-area:top}
.svc-f-wide>h3{grid-area:h}
.svc-f-wide>p{grid-area:p}
.svc-f-wide>.svc-f-viz{grid-area:viz;align-self:center;margin:0;padding:0}
.svc-lp-cta{margin-top:12px;font-size:.78rem;font-weight:600;color:#000;background:#fff;padding:8px 16px;border-radius:999px}
.svc-stack{padding:0 0 clamp(72px,9vw,120px)}
.svc-stack-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:22px;background:#0A0A0A;overflow:hidden}
.svc-stack-grid>div{padding:clamp(24px,3vw,32px);border-left:1px solid var(--line)}
.svc-stack-grid>div:first-child{border-left:0}
.svc-stack-grid h3{margin:28px 0 8px;font-size:1.12rem;font-weight:500;letter-spacing:-.02em}
.svc-stack-grid p{margin:0;color:var(--mute);font-size:.92rem;line-height:1.55}
.svc-code{padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--line)}
.svc-code-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,64px);align-items:center}
.svc-code-head h2{margin:0 0 14px;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:500;letter-spacing:-.04em;line-height:1.08}
.svc-code-head p:last-child:not(.eyebrow){margin:0;color:var(--mute);line-height:1.6;max-width:42ch}
.page-web .codebox-pre,.page-srv .codebox-pre,.page-sec .codebox-pre{color:#d4d4d4}
@media (max-width:960px){
.svc-hero-grid,.svc-intro-grid,.svc-code-grid,.svc-praxis-grid,.svc-f-land{grid-template-columns:1fr}
.svc-intro-grid{align-items:start}
.svc-stage{min-height:340px;order:0}
.svc-f-stage{order:0}
.svc-row{grid-template-columns:44px minmax(0,1fr)}
.svc-row .svc-pts{grid-column:2}
.svc-formats{grid-template-columns:1fr}
.svc-f-wide{display:flex}
.svc-f-wide>.svc-f-viz{margin-top:8px}
}
@media (max-width:700px){
.svc-cards,.svc-stack-grid{grid-template-columns:1fr}
.svc-stack-grid>div{border-left:0;border-top:1px solid var(--line)}
.svc-stack-grid>div:first-child{border-top:0}
.svc-card{min-height:0}
.svc-card h3{padding-top:28px}
.svc-sitemap{grid-template-columns:repeat(3,minmax(0,1fr))}
.svc-steps{grid-template-columns:1fr}
}
@media (max-width:560px){
.svc-stage{min-height:0;padding:16px;border-radius:16px}
.svc-row{grid-template-columns:1fr;gap:14px}
.svc-row .svc-pts{grid-column:auto}
.svc-facts li{flex-direction:column;gap:4px}
.svc-facts span{text-align:left}
.svc-find{grid-template-columns:1fr;gap:8px}
.svc-status{font-size:.72rem}
.svc-status li{padding:12px}
.svc-f-stage{min-height:260px}
}
@media (prefers-reduced-motion:reduce){.svc-live b{animation:none}}
.au-hero{padding-top:clamp(72px,9vw,120px)}
.au-win{max-width:460px}
.au-card{padding:22px 22px 18px;display:grid;gap:18px}
.au-card-h{display:flex;align-items:center;gap:12px}
.au-av{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fff;color:#000;font-weight:600;font-size:.86rem;letter-spacing:-.02em;flex:none}
.au-card-h strong{display:block;font-weight:500;color:#fff;font-size:.98rem}
.au-card-h em{display:block;font-style:normal;color:#a3a3a3;font-size:.8rem;margin-top:2px}
.au-chain{list-style:none;margin:0;padding:0;border:1px solid #242424;border-radius:14px;overflow:hidden}
.au-chain li{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:14px 16px;border-top:1px solid #1f1f1f;background:#0d0d0d;transition:background .35s cubic-bezier(.16,1,.3,1)}
.au-chain li:first-child{border-top:0}
.au-chain span{font-family:var(--mono);font-size:.7rem;color:#8a8a8a}
.au-chain strong{font-weight:500;color:#f5f5f5;font-size:.95rem}
.au-chain em{font-style:normal;font-size:.72rem;color:#d4d4d4;padding:3px 10px;border-radius:999px;border:1px solid #2e2e2e;background:#141414}
.svc-stage:hover .au-chain li:nth-child(1),.au-chain li:hover{background:#121212}
.au-card-f{display:flex;flex-wrap:wrap;gap:6px}
.au-card-f span{font-size:.72rem;color:#a3a3a3;padding:5px 10px;border-radius:999px;border:1px solid #262626}
.au-intro h2{max-width:20ch}
.au-values{padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--line)}
.au-values-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:start}
.au-values-head{position:sticky;top:110px}
.au-values-head h2{margin:0;font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.06;max-width:14ch}
.au-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.au-list li{display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-areas:"n h" "n p";column-gap:12px;padding:26px 0;border-bottom:1px solid var(--line)}
.au-list span{grid-area:n;font-family:var(--mono);font-size:.74rem;color:#8a8a8a;padding-top:6px}
.au-list h3{grid-area:h;margin:0 0 6px;font-size:1.22rem;font-weight:500;letter-spacing:-.025em;color:#fff}
.au-list p{grid-area:p;margin:0;color:var(--mute);font-size:.98rem;line-height:1.6;max-width:52ch}
.au-infra{padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--line)}
.au-infra-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center}
.au-infra-copy h2{margin:0 0 16px;font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.06;max-width:16ch}
.au-infra-copy p:not(.eyebrow){margin:0;color:var(--mute);font-size:1.05rem;line-height:1.6;max-width:46ch}
.au-infra-copy .btns{margin-top:28px}
.au-infra-stage{min-height:400px}
.au-rack{list-style:none;margin:0;padding:10px}
.au-rack li{position:relative;display:grid;gap:3px;padding:14px 16px 14px 40px;border-radius:12px}
.au-rack li+li{margin-top:2px}
.au-rack li::before{content:"";position:absolute;left:16px;top:20px;width:8px;height:8px;border-radius:50%;background:#e5e5e5;box-shadow:0 0 0 4px rgba(255,255,255,.06)}
.au-rack li:hover{background:#141414}
.au-rack strong{font-weight:500;color:#fff;font-size:.96rem}
.au-rack span{color:#a3a3a3;font-size:.88rem;line-height:1.5}
.au-work{padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--line)}
.au-work-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:clamp(28px,4vw,44px)}
.au-work-head h2{margin:0;font-size:clamp(1.9rem,3.4vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.06}
.au-work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.au-shot{display:grid;gap:14px;text-decoration:none;color:inherit;padding:clamp(14px,2vw,20px);border:1px solid var(--line);border-radius:22px;background:#0A0A0A;transition:border-color .3s,background .3s}
.au-shot .ls-win{max-width:none;box-shadow:none}
.au-shot>span{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:0 4px}
.au-shot strong{font-weight:500;color:#fff}
.au-shot em{font-style:normal;font-size:.8rem;color:#a3a3a3}
.au-shot:hover{border-color:#333;background:#0E0E0E}
.au-shot:hover .ls-win-img img{transform:scale(1.02)}
.au-shot:focus-visible{outline:2px solid #fff;outline-offset:3px}
.pj-hero{padding:clamp(64px,8vw,104px) 0 clamp(40px,5vw,56px);border-bottom:1px solid var(--line)}
.pj-hero .crumb{margin-bottom:22px}
.pj-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,5vw,72px);align-items:end;margin-bottom:clamp(28px,4vw,44px)}
.pj-hero h1{margin:0;font-size:clamp(2.4rem,4.4vw,3.7rem);font-weight:500;letter-spacing:-.045em;line-height:1}
.pj-hero .lead{margin:0;max-width:40ch;color:var(--mute);font-size:1.08rem;line-height:1.6}
.pj-index{justify-content:flex-start;margin:0}
.pj-list{padding:clamp(40px,5vw,64px) 0 clamp(72px,9vw,120px)}
.pj-list .wrap{display:grid;gap:16px}
.pj-case{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(20px,3.5vw,48px);align-items:center;padding:clamp(14px,2vw,20px);border:1px solid var(--line);border-radius:24px;background:#0A0A0A;scroll-margin-top:96px;transition:border-color .3s}
.pj-case:hover{border-color:#2e2e2e}
.pj-win{margin:0;max-width:none;box-shadow:none;border-color:#262626}
.pj-case:hover .ls-win-img img{transform:scale(1.015)}
.pj-body{padding:clamp(4px,1.5vw,16px) clamp(4px,1.5vw,16px) clamp(4px,1.5vw,16px) 0;min-width:0}
.pj-top{display:flex;align-items:center;gap:10px;margin-bottom:22px}
.pj-top span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;padding:0 9px;border-radius:999px;border:1px solid #2a2a2a;background:#111;font-family:var(--mono);font-size:.72rem;color:#a3a3a3}
.pj-top em{font-style:normal;font-size:.8rem;color:#d4d4d4}
.pj-body h2{margin:0 0 12px;font-size:clamp(1.5rem,2.4vw,1.95rem);font-weight:500;letter-spacing:-.035em;line-height:1.1}
.pj-body>p{margin:0;color:var(--mute);font-size:.96rem;line-height:1.6;max-width:48ch}
.pj-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:22px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pj-meta div{padding:12px 0}
.pj-meta div+div{padding-left:16px;border-left:1px solid var(--line)}
.pj-meta dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:#8a8a8a;margin-bottom:4px}
.pj-meta dd{margin:0;color:#f5f5f5;font-size:.92rem}
.pj-tags{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.pj-tags li{font-size:.76rem;color:#d4d4d4;padding:5px 11px;border-radius:999px;border:1px solid #2a2a2a;background:#111}
@media (max-width:960px){
.au-values-grid,.au-infra-grid,.pj-hero-grid,.pj-case{grid-template-columns:1fr}
.au-values-head{position:static}
.pj-body{padding:4px 6px 8px}
}
@media (max-width:700px){
.au-work-grid{grid-template-columns:1fr}
.au-work-head{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){
.au-infra-stage{min-height:0;padding:16px;border-radius:16px}
.au-list li{grid-template-columns:40px minmax(0,1fr);padding:22px 0}
.pj-case{border-radius:18px;padding:12px}
.pj-index a{font-size:.82rem}
}
@media (prefers-reduced-motion:reduce){
.au-chain li,.au-shot,.pj-case{transition:none}
.au-shot:hover .ls-win-img img,.pj-case:hover .ls-win-img img{transform:none}
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,video,svg{max-width:100%}
@media (max-width:1079px){
.logo{min-height:44px}
.menu-btn{min-height:44px;padding:0 16px;-webkit-tap-highlight-color:transparent}
.menu-btn i{width:16px}
.menu-btn i::before,.menu-btn i::after{transition:transform .35s cubic-bezier(.2,.8,.2,1),top .35s cubic-bezier(.2,.8,.2,1)}
.menu-open,.menu-open body{overflow:hidden}
.drawer{overscroll-behavior:contain;padding-bottom:calc(40px + env(safe-area-inset-bottom));transform:translateY(-6px);transition:opacity .3s cubic-bezier(.2,.8,.2,1),transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s .35s}
.menu-open .drawer{transform:none;transition:opacity .3s cubic-bezier(.2,.8,.2,1),transform .35s cubic-bezier(.2,.8,.2,1)}
.drawer nav>*{opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .4s cubic-bezier(.2,.8,.2,1)}
.menu-open .drawer nav>*{opacity:1;transform:none}
.menu-open .drawer nav>:nth-child(1){transition-delay:.04s}
.menu-open .drawer nav>:nth-child(2){transition-delay:.08s}
.menu-open .drawer nav>:nth-child(3){transition-delay:.12s}
.menu-open .drawer nav>:nth-child(4){transition-delay:.16s}
.menu-open .drawer nav>:nth-child(5){transition-delay:.2s}
.drawer a,.drawer summary{min-height:56px;padding:12px 0}
.drawer details li a{min-height:48px;padding:8px 0}
.drawer .chev{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.drawer details[open] ul{animation:vsDrop .3s cubic-bezier(.2,.8,.2,1)}
.drawer .btns .btn{min-height:50px}
.ft ul{gap:0}
.ft ul a{display:inline-flex;align-items:center;min-height:44px}
.ft ul li:not(:has(a)){min-height:44px;display:flex;align-items:center}
.ft-bot nav{gap:0 20px}
.ft-bot a,.ft-bot .ft-cookie{display:inline-flex;align-items:center;min-height:44px}
.ft h2{font-size:.75rem;margin-bottom:6px}
.crumb{align-items:center}
.crumb a{display:inline-flex;align-items:center;min-height:44px;margin:-12px 0}
.ls-index a{min-height:44px}
.codebox-tabs button{min-height:44px;padding:0 16px}
.codebox-copy{min-height:44px;min-width:56px;padding:0 14px}
.svc-card-n,.game-step-badge,.ls-n,.svc-k,.ls-index a span{font-size:.75rem}
}
@media (max-width:719px){
input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px}
.btns{gap:10px}
}
@keyframes vsDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
.drawer,.drawer nav>*,.menu-btn i::before,.menu-btn i::after{transition:none!important;transform:none!important}
.drawer details[open] ul{animation:none}
}
@media (max-width:1079px),(pointer:coarse){.btn-sm{min-height:44px}}
.contact-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.contact-actions .contact-btn{
flex:1 1 180px;justify-content:center;align-items:center;gap:10px;
min-height:52px;padding:0 22px;border-radius:14px;font-weight:500;letter-spacing:-.01em;
transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.contact-actions .contact-btn:active{transform:scale(.985)}
.contact-actions .btn-p.contact-btn{box-shadow:0 0 0 1px rgba(255,255,255,.06)}
.contact-actions .btn-chat{
background:transparent;color:var(--ink);border:1px solid #3A3A3A;
}
.contact-actions .btn-chat:hover{background:#141414;border-color:#5A5A5A}
.contact-actions .btn-chat svg{flex:none;opacity:.9}
.contact-actions .contact-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.lc-widget{
position:fixed;z-index:80;font-family:"Inter",sans-serif;
right:max(18px,env(safe-area-inset-right,0px));
bottom:max(18px,env(safe-area-inset-bottom,0px));
display:flex;flex-direction:column;align-items:flex-end;gap:12px;
max-width:calc(100vw - 24px);
}
.lc-widget.is-open .lc-fab{display:none!important}
.lc-widget.is-min .lc-fab{display:grid!important}
.lc-fab{
position:relative;width:58px;height:58px;border:0;border-radius:50%;
background:#fff;color:#000;display:grid;place-items:center;cursor:pointer;
box-shadow:0 10px 36px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.08);
transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
flex:none;-webkit-tap-highlight-color:transparent;z-index:2;
}
.lc-fab:hover{background:#F3F3F3;transform:translateY(-2px);box-shadow:0 14px 40px rgba(0,0,0,.5)}
.lc-fab:active{transform:scale(.96)}
.lc-fab:focus-visible{outline:2px solid #fff;outline-offset:3px}
.lc-fab-ico{display:block}
.lc-fab-dot{
position:absolute;top:8px;right:8px;width:10px;height:10px;border-radius:50%;
background:#22C55E;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.15);
}
.lc-panel{
width:min(380px,calc(100vw - 24px));
height:min(520px,calc(100dvh - 100px));
max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 88px);
display:grid;grid-template-rows:auto minmax(0,1fr) auto;
border:1px solid #1A1A1A;border-radius:20px;background:#000;color:#fff;
box-shadow:0 28px 80px rgba(0,0,0,.65);overflow:hidden;animation:lcIn .22s ease;
}
@keyframes lcIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.lc-head{
display:flex;align-items:center;justify-content:space-between;gap:10px;
padding:14px 12px 14px 14px;border-bottom:1px solid #1A1A1A;background:#000;min-width:0;
}
.lc-brand{display:flex;align-items:center;gap:10px;min-width:0}
.lc-avatar{
width:36px;height:36px;border-radius:50%;background:#fff;color:#000;flex:none;
display:grid;place-items:center;font:600 .95rem/1 "Inter",sans-serif;letter-spacing:-.04em;
}
.lc-head strong{display:block;font-size:.92rem;font-weight:600;letter-spacing:-.03em;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lc-status{display:block;margin-top:3px;font-style:normal;font-size:.72rem;color:#8E8E8E;letter-spacing:.02em}
.lc-status::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#22C55E;margin-right:6px;vertical-align:middle}
.lc-status.is-off::before{background:#666}
.lc-head-actions{display:flex;gap:2px;flex:none}
.lc-icon{
width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:#A3A3A3;
display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.lc-icon:hover{background:#111;color:#fff}
.lc-thread{
overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
padding:14px;display:flex;flex-direction:column;gap:10px;background:#000;min-height:0;
}
.lc-b{max-width:84%;padding:11px 13px;border-radius:16px;border:1px solid #222;background:#0A0A0A}
.lc-b p{margin:0;font-size:.9rem;line-height:1.45;overflow-wrap:anywhere;word-break:break-word;color:#F2F2F2}
.lc-b time{display:block;margin-top:7px;font-size:.68rem;color:#6B6B6B}
.lc-b.is-me{align-self:flex-end;background:#fff;border-color:#fff;border-bottom-right-radius:6px}
.lc-b.is-me p{color:#000}
.lc-b.is-me time{color:#666}
.lc-b.is-them{align-self:flex-start;border-bottom-left-radius:6px}
.lc-foot{
border-top:1px solid #1A1A1A;background:#000;
padding:12px 12px max(12px,env(safe-area-inset-bottom,0px));
}
.lc-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.lc-compose textarea{
width:100%;resize:none;min-height:44px;max-height:88px;padding:11px 14px;border-radius:14px;
border:1px solid #2A2A2A;background:#0A0A0A;color:#fff;caret-color:#fff;
font:400 .92rem/1.4 "Inter",sans-serif;box-sizing:border-box;
}
.lc-compose textarea::placeholder{color:#666}
.lc-compose textarea:focus{outline:none;border-color:#555;background:#000}
.lc-send{
width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:#000;
display:grid;place-items:center;cursor:pointer;flex:none;
transition:background .15s ease,transform .15s ease;padding:0;
-webkit-tap-highlight-color:transparent;
}
.lc-send svg{margin-left:1px}
.lc-send:hover{background:#EDEDED}
.lc-send:active{transform:scale(.94)}
.lc-send:focus-visible{outline:2px solid #fff;outline-offset:2px}
.lc-compose.is-busy{opacity:.6;pointer-events:none}
@media (max-width:640px){
.contact-actions .contact-btn{flex:1 1 100%}
.lc-widget{
right:max(12px,env(safe-area-inset-right,0px));
left:max(12px,env(safe-area-inset-left,0px));
bottom:max(12px,env(safe-area-inset-bottom,0px));
max-width:none;align-items:stretch;
}
.lc-widget.is-min{
align-items:flex-end;
left:auto;
right:max(12px,env(safe-area-inset-right,0px));
}
.lc-widget.is-open{
left:0;right:0;bottom:0;max-width:none;gap:0;padding:0;
align-items:stretch;
}
.lc-widget.is-open .lc-panel{
width:100%;
border-radius:18px 18px 0 0;
border-left:0;border-right:0;border-bottom:0;
height:min(70dvh,560px);
max-height:calc(100dvh - 12px);
box-shadow:0 -12px 48px rgba(0,0,0,.55);
animation:lcSheet .22s ease;
}
.lc-widget.is-kb .lc-panel{
border-radius:14px 14px 0 0;
}
.lc-widget.is-kb .lc-foot{
padding-bottom:10px;
}
.lc-widget.is-open .lc-foot{
padding-bottom:max(10px,env(safe-area-inset-bottom,0px));
}
.lc-widget.is-kb.is-open .lc-foot{
padding-bottom:10px;
}
.lc-fab{width:56px;height:56px;align-self:flex-end}
.lc-b{max-width:88%}
.lc-head{padding:12px}
.lc-thread{padding:12px}
.lc-compose textarea{font-size:16px;min-height:44px;max-height:72px}
.lc-send{width:44px;height:44px}
}
@keyframes lcSheet{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (max-width:380px){
.lc-head strong{font-size:.86rem}
.lc-avatar{width:32px;height:32px}
}
@media (prefers-reduced-motion:reduce){
.lc-panel,.lc-widget.is-open .lc-panel{animation:none}
.contact-actions .contact-btn,.lc-fab,.lc-send{transition:none}
}