:root{
  color-scheme: dark;

  
  --lg-bg:            #0D0F12;   
  --lg-surface-1:     #13161A;   
  --lg-surface-2:     #1A1D20;   
  --lg-surface-3:     #22262B;   
  --lg-graphite:      #1A1D20;   

  
  --lg-text:          #EDEFF2;   
  --lg-text-muted:    #9BA3AE;   
  --lg-text-faint:    #7A828D;   

  
  --lg-border:        rgba(237, 239, 242, 0.08);
  --lg-border-strong: rgba(237, 239, 242, 0.16);

  
  --lg-lime:          #CCFF00;   
  --lg-lime-hover:    #D8FF4D;
  --lg-lime-press:    #B8E600;
  --lg-lime-dim:      rgba(204, 255, 0, 0.12);  
  --lg-lime-line:     rgba(204, 255, 0, 0.45);  
  --lg-lime-glow:     rgba(204, 255, 0, 0.28);  
  --lg-on-lime:       #0D0F12;   
  --lg-lime-on-light: #6F8F00;   

  
  --lg-success:       #CCFF00;
  --lg-warning:       #FFB547;
  --lg-danger:        #FF6B6B;

  
  --lg-info:          #93B2D3;   
  --lg-info-dim:      rgba(147, 178, 211, 0.12);
  --lg-info-line:     rgba(147, 178, 211, 0.28);
  --lg-ok:            #5FD39A;   
  --lg-ok-dim:        rgba(95, 211, 154, 0.12);
  --lg-warn:          #FFB547;   
  --lg-warn-dim:      rgba(255, 181, 71, 0.12);
  --lg-violet:        #B79CFF;   
  --lg-violet-dim:    rgba(183, 156, 255, 0.12);

  
  --lg-font-display:  'Sofia Sans Semi Condensed', 'Segoe UI', system-ui, sans-serif;
  --lg-font-body:     'Sofia Sans', 'Segoe UI', system-ui, sans-serif;
  --lg-font-mono:     'JetBrains Mono', ui-monospace, 'Cascadia Code', Consolas, monospace;

  --lg-fs-12: 0.75rem;   --lg-fs-14: 0.875rem;  --lg-fs-16: 1rem;
  --lg-fs-18: 1.125rem;  --lg-fs-22: 1.375rem;  --lg-fs-28: 1.75rem;
  --lg-fs-36: 2.25rem;   --lg-fs-48: 3rem;      --lg-fs-64: 4rem;
  --lg-fs-hero: clamp(2.5rem, 6vw, 4.5rem);

  --lg-fw-light: 300;  --lg-fw-regular: 400;  --lg-fw-medium: 500;  --lg-fw-semibold: 600;
  --lg-lh-tight: 1.08; --lg-lh-snug: 1.3;     --lg-lh-body: 1.65;
  --lg-tracking-display: -0.025em;
  --lg-tracking-label: 0.08em;

  
  --lg-s-1: 4px;   --lg-s-2: 8px;   --lg-s-3: 12px;  --lg-s-4: 16px;
  --lg-s-5: 24px;  --lg-s-6: 32px;  --lg-s-7: 48px;  --lg-s-8: 64px;
  --lg-s-9: 96px;  --lg-s-10: 128px;
  --lg-container: 1200px;

  
  --lg-radius-sm: 6px;    
  --lg-radius-md: 10px;   
  --lg-radius-lg: 16px;   
  --lg-radius-pill: 999px;

  
  
  --lg-ease: cubic-bezier(0.2, 0.8, 0.2, 1);          
  --lg-ease-draw: cubic-bezier(0.65, 0, 0.35, 1);     
  --lg-ease-pop: cubic-bezier(0.34, 1.4, 0.64, 1);    
  --lg-dur-fast: 120ms;
  --lg-dur-base: 200ms;
  --lg-dur-open: 320ms;
  --lg-dur-slow: 420ms;
  --lg-dur-draw: 560ms;
  --lg-stagger: 70ms;

  
  --lg-glow-sm: 0 0 0 1px var(--lg-lime-line), 0 6px 20px -8px var(--lg-lime-glow);
  --lg-glow-md: 0 0 0 1px var(--lg-lime), 0 10px 32px -10px var(--lg-lime-glow);
  --lg-focus:   0 0 0 2px var(--lg-bg), 0 0 0 4px var(--lg-lime);
}
.lg-logo{
  display: inline-flex; align-items: center; line-height: 0;
  color: var(--lg-text); text-decoration: none; border-radius: var(--lg-radius-sm);
}
.lg-logo svg{ display: block; height: 22px; width: auto; }
@media (max-width: 600px){
.lg-logo svg{ height: 19px; }
}
.lg-mark__edge{ fill: none; stroke: var(--lg-text-faint); stroke-linejoin: round; stroke-linecap: round; }
.lg-mark__node,.lg-wordmark{ fill: currentColor; }
.lg-mark__head{ fill: var(--lg-lime); }
.lg-logo:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.lg-btn{
  --_h: 48px;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--lg-s-2);
  height: var(--_h); padding: 0 var(--lg-s-5);
  font-family: var(--lg-font-body); font-size: var(--lg-fs-16); font-weight: var(--lg-fw-semibold);
  border-radius: var(--lg-radius-sm); border: 1px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color var(--lg-dur-fast) var(--lg-ease),
              border-color var(--lg-dur-fast) var(--lg-ease),
              color var(--lg-dur-fast) var(--lg-ease),
              box-shadow var(--lg-dur-base) var(--lg-ease),
              transform var(--lg-dur-fast) var(--lg-ease);
}
.lg-btn:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.lg-btn:active{ transform: translateY(1px); }
.lg-btn--primary{ background: var(--lg-lime); color: var(--lg-on-lime); }
.lg-btn--primary:hover{ background: var(--lg-lime-hover); transform: translateY(-1px); }
.lg-btn--primary:active{ background: var(--lg-lime-press); box-shadow: none; transform: translateY(0); }
.lg-btn--secondary{ background: transparent; color: var(--lg-text); border-color: var(--lg-border-strong); }
.lg-btn--secondary:hover{ border-color: var(--lg-lime-line); color: var(--lg-lime); background: var(--lg-lime-dim); }
.lg-link{
  color: var(--lg-text); text-decoration: none;
  background: linear-gradient(var(--lg-lime), var(--lg-lime)) 0 100% / 0 1px no-repeat;
  transition: background-size var(--lg-dur-base) var(--lg-ease), color var(--lg-dur-fast) var(--lg-ease);
}
.lg-link:hover{ background-size: 100% 1px; color: var(--lg-lime); }
.lg-link:focus-visible{ outline: none; box-shadow: var(--lg-focus); border-radius: 2px; }
@media (prefers-reduced-motion: reduce){
*,*::before,*::after{ transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}
@font-face{ font-family: 'Manrope'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url(/assets/fonts/manrope-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family: 'Manrope'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url(/assets/fonts/manrope-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url(/assets/fonts/jbmono-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url(/assets/fonts/jbmono-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root{
  --wrap: 1240px;
  --gutter: clamp(20px, 4vw, 48px);
  --header-h: 72px;
  --rail: 56px;
  --node: 9px;
  --node-end: 15px;
  --rule: rgba(237, 239, 242, 0.12);
  --sec: clamp(72px, 10vh, 128px);
  
  --paper: #EEF0F3; --paper-card: #FFFFFF; --ink: #121418; --ink-muted: #5C636E; --ink-line: #D9DDE2;
}
@media (max-width: 720px){
:root{ --header-h: 64px; --rail: 30px; --node: 8px; --node-end: 13px; }
}
*,*::before,*::after{ box-sizing: border-box; }
html{ -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body{
  margin: 0; background: var(--lg-bg); color: var(--lg-text);
  font-family: var(--lg-font-body); font-size: 1rem; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-wrap: break-word;
}
body.menu-open{ overflow: hidden; }
a{ color: inherit; }
h1,h2,h3,p,ol,ul,figure,dl,dd,blockquote{ margin: 0; }
ol,ul{ padding: 0; list-style: none; }
img{ max-width: 100%; }
.lt{ font-weight: var(--lg-fw-light); }
.visually-hidden{ position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.wrap{
  width: 100%; max-width: calc(var(--wrap) + 2 * var(--gutter)); margin-inline: auto;
  padding-left: max(var(--gutter), env(safe-area-inset-left, 0px)); padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}
.mono{ font-family: var(--lg-font-mono); font-size: 0.8125rem; letter-spacing: 0.01em; color: var(--lg-text-faint); font-weight: 400; }
.skip{
  position: absolute; left: 12px; top: 12px; z-index: 100; padding: 10px 14px; transform: translateY(calc(-100% - 24px));
  background: var(--lg-lime); color: var(--lg-on-lime); border-radius: var(--lg-radius-sm); font-weight: 600; text-decoration: none;
}
.skip:focus{ transform: none; outline: none; box-shadow: var(--lg-focus); }
.ico{ flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ico .f{ fill: currentColor; stroke: none; }
.therefore{ width: 0.95em; height: 0.95em; fill: currentColor; flex: none; vertical-align: -0.1em; margin-right: 0.45em; }
.lg-btn{ height: auto; min-height: var(--_h); padding-block: 6px; white-space: normal; text-align: center; }
.lg-btn .ico{ transition: transform var(--lg-dur-base) var(--lg-ease); }
.lg-btn:active{ transform: translateY(1px) scale(0.985); }
@media (hover: hover){
.lg-btn:hover .ico{ transform: translateX(3px); }
}
@media (hover: none){
.lg-btn--primary:hover{ background: var(--lg-lime); transform: none; }
.lg-btn--secondary:hover{ border-color: var(--lg-border-strong); color: var(--lg-text); background: transparent; }
}
.lg-link{ padding-bottom: 1px; background-size: 100% 1px; background-image: linear-gradient(var(--lg-border-strong), var(--lg-border-strong)); }
.lg-link:hover{ background-image: linear-gradient(var(--lg-lime), var(--lg-lime)); }
.section-head{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 38ch); gap: 18px 64px; align-items: start; margin-bottom: clamp(32px, 5vh, 56px); }
.section-head .section-intro{ padding-top: 0.6em; }
.section-head__label{ grid-column: 1 / -1; }
.section-title{ font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem); line-height: 1.06; font-weight: 600; letter-spacing: -0.03em; text-wrap: balance; overflow-wrap: anywhere; }
.section-title--s{ font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.375rem); line-height: 1.1; letter-spacing: -0.025em; }
.section-intro{ color: var(--lg-text-muted); font-size: 1.0625rem; max-width: 60ch; }
@media (max-width: 860px){
.section-head{ grid-template-columns: 1fr; }
}
.badge{
  display: inline-flex; align-items: center; gap: 8px; padding: 5px 11px 5px 9px; border-radius: 999px;
  font-family: var(--lg-font-mono); font-size: 0.75rem; line-height: 1.2; letter-spacing: 0.01em;
  background: #1A1D20; color: #EDEFF2;
}
.badge i{ width: 8px; height: 8px; border-radius: 50%; background: var(--lg-lime); box-shadow: 0 0 0 1.5px #1A1D20; }
.crumbs ol{ display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 0.875rem; color: var(--lg-text-faint); }
.crumbs li{ display: flex; align-items: center; gap: 8px; }
.crumbs a{ color: var(--lg-text-muted); text-decoration: none; border-radius: 4px; }
.crumbs a:hover{ color: var(--lg-text); }
.crumbs a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.crumbs [aria-current]{ color: var(--lg-text); }
.site-header{ position: sticky; top: 0; z-index: 50; background: var(--lg-bg); border-bottom: 1px solid transparent; transition: border-color var(--lg-dur-base) var(--lg-ease); }
.site-header.is-scrolled,.site-header.is-mega{ border-bottom-color: var(--lg-border); }
.site-header__inner{ height: var(--header-h); display: flex; align-items: center; gap: 24px; }
.nav{ margin-left: auto; }
.nav__list{ display: flex; gap: 2px; }
.nav__link{
  position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; border: 0; border-radius: var(--lg-radius-sm);
  background: none; font: 500 0.9375rem/1.2 var(--lg-font-body); color: var(--lg-text-muted); text-decoration: none; cursor: pointer;
  transition: color var(--lg-dur-fast) var(--lg-ease);
}
.nav__link::after{ content: ""; position: absolute; left: 14px; right: 14px; bottom: 5px; height: 1px; background: var(--lg-lime); transform: scaleX(0); transform-origin: left; transition: transform var(--lg-dur-base) var(--lg-ease-draw); }
.nav__link:hover,.nav__link[aria-current="page"],.nav__trigger[aria-expanded="true"]{ color: var(--lg-text); }
.nav__link:hover::after,.nav__link[aria-current="page"]::after{ transform: scaleX(1); }
.nav__trigger::after{ right: 34px; }
.nav__link:focus-visible{ outline: none; box-shadow: var(--lg-focus); color: var(--lg-text); }
.nav__chev{ transition: transform var(--lg-dur-base) var(--lg-ease); }
.nav__trigger[aria-expanded="true"] .nav__chev{ transform: rotate(180deg); }
.site-header__cta{ --_h: 42px; padding: 0 18px; font-size: 0.9375rem; }
.mega{ position: absolute; left: 0; right: 0; top: 100%; background: var(--lg-bg); border-bottom: 1px solid var(--lg-border); box-shadow: 0 24px 48px -24px rgba(0, 0, 0, 0.6); }
.mega[hidden]{ display: none; }
.mega__grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.mega__item,.mega__support{
  display: flex; gap: 14px; align-items: flex-start; padding: 14px; border-radius: var(--lg-radius-md); text-decoration: none;
  transition: background-color var(--lg-dur-fast) var(--lg-ease);
}
.mega__item:hover,.mega__support:hover{ background: var(--lg-surface-1); }
.mega__item:focus-visible,.mega__support:focus-visible,.mega__all:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.mega__item.is-current{ background: var(--lg-surface-1); }
.mega__icon{
  flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px;
  background: var(--lg-surface-2); color: var(--lg-text); border: 1px solid var(--lg-border);
  transition: color var(--lg-dur-fast) var(--lg-ease), border-color var(--lg-dur-fast) var(--lg-ease);
}
.mega__item:hover .mega__icon,.mega__support:hover .mega__icon{ color: var(--lg-lime); border-color: var(--lg-lime-line); }
.mega__text{ display: grid; gap: 3px; }
.mega__title{ font-weight: 600; font-size: 1rem; line-height: 1.3; color: var(--lg-text); }
.mega__desc{ font-size: 0.875rem; line-height: 1.45; color: var(--lg-text-muted); }
.mega__aside{ display: grid; align-content: start; gap: 16px; padding-left: 32px; border-left: 1px solid var(--lg-border); }
.mega__support{ padding: 14px; background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.mega__all{ display: inline-flex; align-items: center; gap: 8px; justify-self: start; padding: 6px 2px; font-weight: 600; text-decoration: none; border-radius: 4px; }
.mega__all:hover{ color: var(--lg-lime); }
.motion .mega.is-entering{ animation: mega-in var(--lg-dur-base) var(--lg-ease) both; }
.motion .mega.is-entering .mega__item,.motion .mega.is-entering .mega__aside > *{ animation: item-in var(--lg-dur-open) var(--lg-ease) both; animation-delay: calc(40ms + var(--i, 0) * 30ms); }
@keyframes mega-in{ from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes item-in{ from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.menu-btn{
  display: none; margin-left: auto; height: 44px; padding: 0 12px 0 14px; gap: 10px; align-items: center;
  background: transparent; color: var(--lg-text); border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-sm);
  font: 500 0.9375rem/1 var(--lg-font-body); cursor: pointer;
}
.menu-btn:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.menu-btn__icon{ position: relative; width: 16px; height: 10px; }
.menu-btn__icon::before,.menu-btn__icon::after{ content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; border-radius: 1px; transition: transform var(--lg-dur-base) var(--lg-ease), top var(--lg-dur-base) var(--lg-ease); }
.menu-btn__icon::before{ top: 0; }
.menu-btn__icon::after{ top: 8.5px; }
.menu-btn[aria-expanded="true"] .menu-btn__icon::before{ top: 4.25px; transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-btn__icon::after{ top: 4.25px; transform: rotate(-45deg); }
@media (max-width: 1100px){
.nav,.site-header__cta{ display: none; }
.menu-btn{ display: inline-flex; }
}
.mobile-menu{ position: fixed; z-index: 45; inset: var(--header-h) 0 0; background: var(--lg-bg); border-top: 1px solid var(--lg-border); overflow-y: auto; overscroll-behavior: contain; }
.mobile-menu[hidden]{ display: none; }
.mobile-menu__inner{ display: flex; flex-direction: column; gap: 28px; padding-block: 16px 40px; min-height: 100%; }
.mobile-menu__inner:focus{ outline: none; }
.mnav__item{ border-bottom: 1px solid var(--lg-border-strong); }
.mnav__link{
  display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0;
  background: none; border: 0; color: var(--lg-text); text-align: left; text-decoration: none; cursor: pointer;
  font: 600 1.625rem/1.15 var(--lg-font-body); letter-spacing: -0.02em; border-radius: 4px;
}
.mnav__link:focus-visible,.mnav__sub a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.mnav__chev{ transition: transform var(--lg-dur-base) var(--lg-ease); color: var(--lg-text-muted); }
.mnav__toggle[aria-expanded="true"] .mnav__chev{ transform: rotate(180deg); }
.mnav__panel[hidden]{ display: none; }
.mnav__sub{ display: grid; padding: 0 0 16px; }
.mnav__sub a{ display: flex; align-items: center; gap: 12px; padding: 11px 4px; font-size: 1.0625rem; font-weight: 500; text-decoration: none; color: var(--lg-text); border-radius: 4px; }
.mnav__sub .ico{ color: var(--lg-text-muted); }
.mnav__all a{ color: var(--lg-text-muted); font-weight: 600; }
.mobile-menu .lg-btn{ width: 100%; --_h: 52px; }
.motion .mobile-menu.is-entering{ animation: menu-in var(--lg-dur-open) var(--lg-ease) both; }
.motion .mobile-menu.is-entering .mnav__item,.motion .mobile-menu.is-entering .mobile-menu__foot{ animation: item-in var(--lg-dur-slow) var(--lg-ease) both; animation-delay: calc(80ms + var(--i, 0) * 50ms); }
.motion .mnav__panel.is-entering .mnav__sub li{ animation: item-in var(--lg-dur-open) var(--lg-ease) both; }
@keyframes menu-in{ from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@media (min-width: 1101px){
.mobile-menu{ display: none !important; }
}
.lg-mark__pulse{ fill: none; stroke: var(--lg-lime); stroke-linecap: round; stroke-dasharray: 0.24 2; stroke-dashoffset: 0.24; opacity: 0; }
.lg-mark__ring{ fill: none; stroke: var(--lg-lime); stroke-width: 4; opacity: 0; transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference){
.lg-logo:hover .lg-mark__pulse,.lg-logo:focus-visible .lg-mark__pulse{ animation: logo-pulse 440ms var(--lg-ease-draw) both; }
.lg-logo:hover .lg-mark__head,.lg-logo:focus-visible .lg-mark__head{ animation: logo-head 560ms var(--lg-ease) 380ms both; }
.lg-logo:hover .lg-mark__ring,.lg-logo:focus-visible .lg-mark__ring{ animation: logo-ring 560ms var(--lg-ease) 380ms both; }
}
@keyframes logo-pulse{ 0% { stroke-dashoffset: 0.24; opacity: 1; } 88% { opacity: 1; } 100% { stroke-dashoffset: -1; opacity: 0; } }
@keyframes logo-head{ 0%, 100% { fill: var(--lg-lime); } 30% { fill: #EBFF99; } }
@keyframes logo-ring{ 0% { opacity: 0.6; transform: scale(1); } 100% { opacity: 0; transform: scale(1.5); } }
[data-derivation]{ position: relative; }
.rail{ position: absolute; left: calc(var(--rail) / 2 - 0.5px); width: 1px; top: 0; height: 0; background: var(--lg-border-strong); transform-origin: top; pointer-events: none; }
.step{ position: relative; padding-left: var(--rail); }
.node{ position: absolute; left: calc(var(--rail) / 2 - var(--node) / 2); top: calc(var(--node-y, 0.8em) - var(--node) / 2); width: var(--node); height: var(--node); border-radius: 50%; background: var(--lg-text); box-shadow: 0 0 0 4px var(--lg-bg); }
:is(.motion:not(.motion-done) .hero__comp, .js.motion .hero__comp.is-armed):not(.is-proven) .rail{ transform: scaleY(0); }
:is(.motion:not(.motion-done) .hero__comp, .js.motion .hero__comp.is-armed):not(.is-proven) .node{ opacity: 0; transform: scale(0.3); }
.motion [data-derivation].is-proving .rail{ transition: transform var(--rail-dur, 640ms) var(--lg-ease-draw) var(--rail-delay, 0ms); }
.motion [data-derivation].is-proving .node{ transition: opacity var(--lg-dur-fast) linear var(--d, 0ms), transform var(--lg-dur-slow) var(--lg-ease-pop) var(--d, 0ms), background-color var(--lg-dur-base) var(--lg-ease) var(--d, 0ms); }
.hero{ position: relative; isolation: isolate; padding-block: clamp(40px, 7vh, 96px) var(--sec); }
.hero > .wrap{ position: relative; z-index: 1; }
.hero__actions{ display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(28px, 4vh, 40px); }
.hero__actions .lg-btn,.svc-hero__actions .lg-btn{ --_h: 52px; padding-inline: 22px; }
@keyframes press{ 0%, 100% { transform: none; } 40% { transform: scale(0.97); } }
@media (max-width: 520px){
.hero{ padding-top: 28px; }
.hero__actions{ flex-direction: column; }
.hero__actions .lg-btn{ width: 100%; }
}
.projects{ padding-block: var(--sec); }
.svc-hero__visual,.related__visual,.next-proj__visual,.decision__visual{ container-type: inline-size; }
.portal{
  --ink: #121418; --muted: #5C636E; --line: #DDE1E6; --card: #FFFFFF; --tint: #EEF0F3; --bg: #F5F6F8;
  font-size: clamp(9px, 1.62cqi, 13px); line-height: 1.4; color: var(--ink); background: var(--bg); text-align: left;
  border-radius: 1em; box-shadow: 0 2.5em 5em -2.5em rgba(0, 0, 0, 0.55); font-variant-numeric: tabular-nums;
}
.portal small,.portal b{ display: block; }
.portal__bar{ display: flex; align-items: center; gap: 1.2em; padding: 0.85em 1.2em; background: var(--card); border-bottom: 1px solid var(--line); border-radius: 1em 1em 0 0; }
.portal__brand{ display: flex; align-items: center; gap: 0.55em; font-weight: 700; white-space: nowrap; }
.portal__mark{ width: 1.25em; height: 1.25em; border-radius: 0.3em; background: var(--ink); }
.portal__search{ flex: 1; max-width: 22em; display: flex; align-items: center; gap: 0.55em; height: 2.4em; padding: 0 0.8em; border: 1px solid var(--line); border-radius: 0.6em; color: var(--muted); white-space: nowrap; overflow: hidden; }
.portal .ico{ width: 1.15em; height: 1.15em; }
.portal__user{ position: relative; display: flex; align-items: center; gap: 0.6em; margin-left: auto; white-space: nowrap; }
.portal__avatar{ display: grid; place-items: center; width: 2.3em; height: 2.3em; border-radius: 50%; background: var(--ink); color: #fff; font-style: normal; font-weight: 700; font-size: 0.8em; }
.portal__user small{ font-size: 0.82em; color: var(--muted); }
.portal__body{ display: grid; grid-template-columns: 12.6em minmax(0, 1fr); }
.portal__side{ display: grid; align-content: start; gap: 0.15em; padding: 1em 0.8em; background: var(--card); border-right: 1px solid var(--line); border-radius: 0 0 0 1em; }
.portal__side > span{ display: flex; align-items: center; gap: 0.6em; padding: 0.55em 0.6em; border-radius: 0.5em; color: var(--muted); font-weight: 600; font-size: 0.92em; white-space: nowrap; }
.portal__side > .is-active{ background: var(--tint); color: var(--ink); }
.portal__side em{ margin-left: auto; display: grid; place-items: center; min-width: 1.6em; height: 1.6em; border-radius: 1em; background: var(--ink); color: #fff; font-style: normal; font-size: 0.78em; }
.portal__terms{ display: grid; gap: 0.3em; margin-top: 1.2em; padding: 0.8em; border: 1px dashed #C8CDD4; border-radius: 0.6em; }
.portal__terms small{ font-size: 0.8em; color: var(--muted); }
.portal__terms b{ font-size: 0.85em; }
.portal__main{ display: grid; gap: 0.9em; padding: 1em; align-content: start; }
.portal__row{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.9em; }
.pcard{ position: relative; display: grid; gap: 0.6em; align-content: start; padding: 0.95em; background: var(--card); border: 1px solid var(--line); border-radius: 0.8em; }
.pcard__head{ display: flex !important; align-items: baseline; justify-content: space-between; gap: 1em; }
.pcard__head small{ font-size: 0.8em; color: var(--muted); white-space: nowrap; }
.pcard__list li,.pcard__rfq li{ display: flex; align-items: center; justify-content: space-between; gap: 0.8em; padding: 0.4em 0; border-bottom: 1px solid var(--tint); font-size: 0.9em; }
.pcard__list i{ min-width: 2.8em; padding: 0.1em 0.4em; border: 1px solid var(--line); border-radius: 0.4em; font-style: normal; font-weight: 700; text-align: center; }
.st{ padding: 0.25em 0.65em; border-radius: 1em; background: var(--tint); color: var(--muted); font-style: normal; font-size: 0.82em; font-weight: 700; white-space: nowrap; }
.st--ok{ display: inline-flex; align-items: center; gap: 0.45em; background: var(--ink); color: #fff; }
.st--ok::before{ content: ""; width: 0.55em; height: 0.55em; border-radius: 50%; background: var(--lg-lime); }
.pbtn{ display: inline-flex; align-items: center; justify-content: center; gap: 0.45em; justify-self: start; min-height: 2.5em; padding: 0.35em 0.95em; border-radius: 0.55em; background: var(--ink); color: #fff; font-size: 0.88em; font-weight: 700; }
.pbtn--ghost{ background: transparent; color: var(--ink); border: 1px solid var(--line); }
.pbtn--block{ justify-self: stretch; width: 100%; }
.ptable{ display: grid; grid-template-columns: 5.6em minmax(0, 1fr) 4.6em 5.4em 5.8em; font-size: 0.88em; }
.ptable > *{ padding: 0.5em 0.4em; border-bottom: 1px solid var(--tint); display: block; text-decoration: none; }
.ptable__h{ font-size: 0.82em; font-weight: 700; color: var(--muted); border-bottom-color: var(--line); }
.ptable__code{ font-family: var(--lg-font-mono); font-size: 0.9em; color: var(--muted); }
.ptable__muted{ color: var(--muted); }
.ptable s.ptable__muted{ text-decoration: line-through; }
.ptable__num{ text-align: right; }
.ptable--3{ grid-template-columns: minmax(0, 1fr) 6.5em 6em; }
.callout{
  position: absolute; top: -0.85em; left: -0.85em; z-index: 2; display: grid; place-items: center; width: 2.1em; height: 2.1em; border-radius: 50%;
  background: #1A1D20; color: var(--lg-lime); font: 500 0.8em/1 var(--lg-font-mono); box-shadow: 0 0 0 0.3em rgba(255, 255, 255, 0.9);
}
.portal__user .callout{ left: -2.6em; top: 50%; margin-top: -1.05em; }
@container (max-width: 560px){
.portal{ font-size: 11px; }
.portal__side,.portal__search{ display: none; }
.portal__body{ grid-template-columns: 1fr; }
.portal__row{ grid-template-columns: 1fr; }
.ptable:not(.ptable--3){ grid-template-columns: minmax(0, 1fr) auto; }
.ptable:not(.ptable--3) > :nth-child(5n + 1),.ptable:not(.ptable--3) > :nth-child(5n + 3),.ptable:not(.ptable--3) > :nth-child(5n + 4){ display: none; }
.portal__main{ border-radius: 0 0 1em 1em; }
.pcard__head{ flex-wrap: wrap; row-gap: 0.2em; }
.pcard__head small{ white-space: normal; }
}
@container (max-width: 400px){
.portal{ font-size: 10px; }
.portal__bar{ gap: 0.8em; padding-inline: 1em; }
.portal__user > span{ display: none; }
}
.screen{
  --ink: #121418; --muted: #5C636E; --line: #DDE1E6; --tint: #EEF0F3;
  display: grid; gap: 1em; padding: 1.4em; font-size: clamp(11px, 2.5cqi, 14px); line-height: 1.4; color: var(--ink);
  background: #FFFFFF; border-radius: 1em; box-shadow: 0 2em 4em -2.4em rgba(0, 0, 0, 0.7); font-variant-numeric: tabular-nums;
}
.screen small,.screen b{ display: block; }
.screen__head{ display: flex; justify-content: space-between; align-items: baseline; gap: 1em; flex-wrap: wrap; }
.screen__head b{ font-size: 1.1em; }
.screen__head small,.screen__note{ font-size: 0.85em; color: var(--muted); }
.screen__note{ display: flex; align-items: center; gap: 0.5em; }
.screen .ico{ width: 1.15em; height: 1.15em; }
.screen__foot{ display: flex; justify-content: space-between; align-items: center; gap: 1em; flex-wrap: wrap; padding-top: 0.9em; border-top: 1px solid var(--line); }
.screen__foot > span:first-child:not(.pbtn){ color: var(--muted); font-size: 0.9em; }
.screen__foot b{ display: inline; color: var(--ink); font-size: 1.15em; margin-left: 0.4em; }
.timeline{ display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
.timeline::before{ content: ""; position: absolute; left: 0.55em; right: calc(33.3% - 0.55em); top: 0.55em; height: 2px; background: var(--line); }
.timeline li{ position: relative; display: grid; gap: 0.15em; padding-top: 1.7em; }
.timeline i{ position: absolute; top: 0; left: 0; width: 1.1em; height: 1.1em; border-radius: 50%; background: #fff; border: 2px solid #AEB4BD; }
.timeline .is-done i{ background: var(--ink); border-color: var(--ink); }
.timeline .is-now i{ background: var(--lg-lime); border-color: #1A1D20; }
.timeline small{ font-size: 0.82em; color: var(--muted); }
.timeline--v{ grid-template-columns: 1fr; gap: 0.9em; }
.timeline--v::before{ left: 0.5em; right: auto; top: 0.6em; bottom: 0.6em; width: 2px; height: auto; }
.timeline--v li{ padding: 0 0 0 2em; }
.prodrows{ display: grid; gap: 0.7em; }
.prodrows li{ display: grid; grid-template-columns: 3.2em minmax(0, 1fr) auto 2.8em; gap: 0.9em; align-items: center; padding: 0.7em; border: 1px solid var(--line); border-radius: 0.8em; }
.prodrows__img{ width: 3.2em; height: 3.2em; border-radius: 0.6em; background: linear-gradient(135deg, #E3E6EB, #CDD2D9); }
.prodrows__name small{ margin-top: 0.15em; font-size: 0.82em; color: var(--muted); }
.prodrows__price{ text-align: right; }
.prodrows__price s{ font-size: 0.82em; color: var(--muted); }
.prodrows__price b{ font-size: 1.1em; }
.prodrows__price small{ font-size: 0.75em; color: var(--muted); }
.prodrows__qty{ display: grid; place-items: center; height: 2.4em; border: 1px solid var(--line); border-radius: 0.5em; font-weight: 700; }
.approval{ display: grid; grid-template-columns: 1fr 1fr; gap: 0.8em; }
.approval > span{ padding: 0.8em 0.9em; background: var(--tint); border-radius: 0.7em; }
.approval small{ font-size: 0.8em; color: var(--muted); }
.approval b{ font-size: 1.25em; margin-top: 0.15em; }
.approval__sum{ box-shadow: inset 0 0 0 1.5px var(--ink); background: #fff !important; }
.phone{ width: 100%; max-width: 300px; margin-inline: auto; padding: 0.7em; background: #1A1D20; border-radius: 2.2em; box-shadow: 0 2em 4em -2em rgba(0, 0, 0, 0.8); font-size: clamp(10px, 4.6cqi, 13px); }
.phone__screen{ display: grid; gap: 0.9em; padding: 1.6em 1.1em 1.2em; background: #F5F6F8; border-radius: 1.7em; color: #121418; line-height: 1.35; }
.phone small,.phone b{ display: block; }
.phone__top b{ font-size: 1.15em; }
.phone__top small,.phone__addr{ font-size: 0.82em; color: #5C636E; }
.phone__addr{ display: flex; align-items: center; gap: 0.4em; }
.phone .ico{ width: 1.1em; height: 1.1em; }
.phone__list{ display: grid; gap: 0.5em; }
.phone__list li{ display: flex; align-items: center; justify-content: space-between; gap: 0.6em; padding: 0.6em 0.7em; background: #fff; border: 1px solid #DDE1E6; border-radius: 0.7em; font-size: 0.9em; font-weight: 600; }
.stepper{ display: inline-flex; align-items: center; gap: 0.15em; flex: none; }
.stepper i{ display: grid; place-items: center; width: 1.7em; height: 1.7em; border-radius: 0.45em; background: #EEF0F3; font-style: normal; font-weight: 700; }
.stepper b{ min-width: 2em; text-align: center; }
.faq{ padding-block: var(--sec); border-top: 1px solid var(--lg-border); }
.tech__chips{ display: flex; flex-wrap: wrap; gap: 8px; }
.tech__chip{ display: inline-flex; align-items: center; gap: 9px; padding: 7px 13px 7px 10px; border: 1px solid var(--lg-border-strong); border-radius: 999px; font-size: 0.9375rem; font-weight: 500; }
.tech__logo{ width: 18px; height: 18px; fill: currentColor; color: var(--lg-text-muted); }
@media (max-width: 860px){
.tech__chips{ margin-top: 6px; }
}
.steps{ --gap: clamp(20px, 2.6vw, 40px); position: relative; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 0 var(--gap); }
.steps::before{ content: ""; position: absolute; top: 4px; left: 0; width: calc((100% - (var(--n) - 1) * var(--gap)) / var(--n) * (var(--n) - 1) + (var(--n) - 1) * var(--gap)); height: 1px; background: var(--lg-border-strong); transform-origin: left; }
.steps__item{ position: relative; padding-top: 34px; }
.steps__node{ position: absolute; top: 0; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--lg-text); box-shadow: 0 0 0 4px var(--lg-bg); }
.steps__item--end .steps__node{ top: -3px; left: -3px; width: 15px; height: 15px; background: var(--lg-lime); }
.steps__num{ display: block; margin-bottom: 10px; }
.steps__title{ font-size: clamp(1.1875rem, 1.05rem + 0.5vw, 1.4375rem); line-height: 1.2; font-weight: 600; letter-spacing: -0.02em; }
.steps__text{ margin-top: 10px; color: var(--lg-text-muted); max-width: 34ch; font-size: 0.9688rem; }
.steps__out{ display: flex; align-items: center; margin-top: 14px; font-family: var(--lg-font-mono); font-size: 0.8125rem; color: var(--lg-text-faint); }
.steps__item--end .steps__out{ color: var(--lg-text); }
.steps__item--end .steps__out .therefore circle:first-child{ fill: var(--lg-lime); }
.js.motion .steps:not(.is-in)::before{ transform: scaleX(0); }
.js.motion .steps:not(.is-in) .steps__node{ opacity: 0; transform: scale(0.3); }
.js.motion .steps:not(.is-in) .steps__out{ opacity: 0; }
.js.motion .steps:not(.is-in) .steps__item::after{ transform: scaleY(0); }
.js.motion .steps.is-in::before{ transition: transform 1100ms var(--lg-ease-draw) 100ms; }
.js.motion .steps.is-in .steps__node{ transition: opacity var(--lg-dur-fast) linear calc(100ms + var(--i) * 280ms), transform var(--lg-dur-slow) var(--lg-ease-pop) calc(100ms + var(--i) * 280ms); }
.js.motion .steps.is-in .steps__out{ transition: opacity var(--lg-dur-slow) var(--lg-ease) calc(220ms + var(--i) * 280ms); }
.js.motion .steps.is-in .steps__item::after{ transition: transform 320ms var(--lg-ease-draw) calc(160ms + var(--i) * 280ms); }
@media (max-width: 860px){
.steps{ grid-template-columns: 1fr; gap: 30px; }
.steps::before{ display: none; }
.steps__item{ padding: 0 0 0 36px; }
.steps__node{ top: 0.45em; }
.steps__item--end .steps__node{ top: calc(0.45em - 3px); }
.steps__item:not(:last-child)::after{ content: ""; position: absolute; left: 4px; top: calc(0.45em + 13px); bottom: calc(-30px - 0.45em + 4px); width: 1px; background: var(--lg-border-strong); transform-origin: top; }
}
.geo{ padding-block: clamp(56px, 8vh, 96px); border-top: 1px solid var(--lg-border); }
.map{ max-width: 600px; justify-self: end; width: 100%; -webkit-mask-image: radial-gradient(ellipse 72% 70% at 58% 54%, #000 62%, transparent 100%); mask-image: radial-gradient(ellipse 72% 70% at 58% 54%, #000 62%, transparent 100%); }
@media (max-width: 860px){
.map{ justify-self: stretch; }
}
.faq__grid{ display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr); gap: 24px clamp(32px, 6vw, 96px); align-items: start; }
.faq .section-head{ grid-template-columns: 1fr; margin-bottom: 0; }
.faq__list{ border-top: 1px solid var(--rule); }
.faq__item{ border-bottom: 1px solid var(--rule); }
.faq__item summary{ display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 0; list-style: none; cursor: pointer; border-radius: var(--lg-radius-sm); font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem); line-height: 1.35; font-weight: 600; }
.faq__item summary::-webkit-details-marker{ display: none; }
.faq__item summary:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.faq__icon{ flex: none; position: relative; width: 36px; height: 36px; border: 1px solid var(--lg-border-strong); border-radius: 50%; transition: border-color var(--lg-dur-fast) var(--lg-ease); }
.faq__icon::before,.faq__icon::after{ content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 1.5px; margin: -0.75px 0 0 -6px; background: var(--lg-text); border-radius: 1px; transition: transform var(--lg-dur-base) var(--lg-ease), background-color var(--lg-dur-fast) var(--lg-ease); }
.faq__icon::after{ transform: rotate(90deg); }
.faq__item[open] .faq__icon::after{ transform: rotate(0deg); }
@media (hover: hover){
.faq__item summary:hover .faq__icon{ border-color: var(--lg-lime); }
.faq__item summary:hover .faq__icon::before,.faq__item summary:hover .faq__icon::after{ background: var(--lg-lime); }
}
.faq__a{ padding: 0 56px 22px 0; max-width: 68ch; color: var(--lg-text-muted); }
.js.motion .faq__item[open] .faq__a{ animation: faq-in var(--lg-dur-open) var(--lg-ease) both; }
@keyframes faq-in{ from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (max-width: 860px){
.faq__grid{ grid-template-columns: 1fr; }
.faq__a{ padding-right: 0; }
}
.contact{ position: relative; isolation: isolate; padding-block: clamp(56px, 8vh, 96px); border-top: 1px solid var(--lg-border); }
.contact > .wrap{ position: relative; z-index: 1; }
.founder__figure{ grid-area: figure; position: relative; align-self: end; width: min(320px, calc(100% - 2 * var(--pad))); aspect-ratio: 300 / 340; margin: 28px var(--pad) 0; }
.founder__figure img{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; }
.js.motion .founder__figure:not(.is-in) img{ opacity: 0; transform: translateY(10px); }
.js.motion .founder__figure.is-in img{ transition: opacity var(--lg-dur-slow) var(--lg-ease) 140ms, transform var(--lg-dur-slow) var(--lg-ease) 140ms; }
.inquiry{ grid-area: form; --field-border: #6A727D; position: relative; display: grid; gap: 20px; align-content: start; padding: var(--pad); border-left: 1px solid var(--lg-border); }
.inquiry__note{ font-size: 0.875rem; color: var(--lg-text-muted); }
.inquiry__row{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
@supports (grid-template-rows: subgrid){
.inquiry__row{ grid-template-rows: auto auto auto; row-gap: 0; }
.inquiry__row > .field{ grid-row: span 3; grid-template-rows: subgrid; row-gap: 8px; align-items: end; }
.inquiry__row > .field > .field__error{ align-self: start; }
}
.field{ display: grid; gap: 8px; align-content: start; min-width: 0; margin: 0; padding: 0; border: 0; }
.field__label{ padding: 0; font-size: 0.9375rem; line-height: 1.4; font-weight: 600; color: var(--lg-text); }
.field__opt{ font-weight: 400; color: var(--lg-text-muted); }
.field__hint{ margin-top: -2px; font-size: 0.875rem; color: var(--lg-text-muted); }
.field__input{ width: 100%; height: 48px; padding: 0 14px; font: inherit; font-size: 1rem; color: var(--lg-text); background: var(--lg-bg); border: 1px solid var(--field-border); border-radius: var(--lg-radius-sm); transition: border-color var(--lg-dur-fast) var(--lg-ease), box-shadow var(--lg-dur-fast) var(--lg-ease); }
.field__input--area{ height: auto; min-height: 132px; padding: 12px 14px; line-height: 1.55; resize: vertical; }
.field__input:hover{ border-color: var(--lg-text-faint); }
.field__input:focus{ outline: none; border-color: var(--lg-lime); box-shadow: 0 0 0 1px var(--lg-lime); }
.field__input[aria-invalid="true"]{ border-color: var(--lg-danger); }
.field__input[aria-invalid="true"]:focus{ box-shadow: 0 0 0 1px var(--lg-danger); }
.field__error{ font-size: 0.875rem; line-height: 1.45; color: #FF8A8A; }
.field__error:empty{ display: none; }
.choices__list{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.choice{ position: relative; display: flex; min-width: 0; }
.choice input{ position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.choice span{ flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 8px; border: 1px solid var(--field-border); border-radius: var(--lg-radius-sm); font-size: 0.875rem; line-height: 1.25; font-weight: 500; text-align: center; color: var(--lg-text-muted); transition: border-color var(--lg-dur-fast) var(--lg-ease), color var(--lg-dur-fast) var(--lg-ease), background-color var(--lg-dur-fast) var(--lg-ease); }
.choice span::before{ content: ""; flex: none; width: 0; height: 8px; margin-left: -8px; border-radius: 50%; background: var(--lg-lime); transition: width var(--lg-dur-base) var(--lg-ease), margin var(--lg-dur-base) var(--lg-ease); }
.choice input:checked + span{ color: var(--lg-text); border-color: var(--lg-lime); background: var(--lg-lime-dim); }
.choice input:checked + span::before{ width: 8px; margin-left: 0; }
.choice input:focus-visible + span{ box-shadow: var(--lg-focus); }
@media (hover: hover){
.choice:hover input:not(:checked) + span{ border-color: var(--lg-text-faint); color: var(--lg-text); }
}
.inquiry__trap{ position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.inquiry__privacy{ font-size: 0.875rem; color: var(--lg-text-muted); }
.inquiry__privacy .lg-link{ color: var(--lg-text); }
.inquiry__actions{ display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.inquiry__submit{ --_h: 52px; padding: 0 20px 0 24px; }
.inquiry__submit[aria-disabled="true"]{ cursor: progress; opacity: 0.75; transform: none; }
.inquiry__submit[aria-disabled="true"] .btn-arrow{ visibility: hidden; }
.inquiry__status:not(:empty),.inquiry__alert:not(:empty){ padding: 14px 16px; border-radius: var(--lg-radius-sm); line-height: 1.5; }
.inquiry__status:not(:empty){ border: 1px solid var(--lg-lime-line); background: var(--lg-lime-dim); }
.inquiry__alert:not(:empty){ border: 1px solid rgba(255, 107, 107, 0.55); background: rgba(255, 107, 107, 0.08); }
.inquiry__status:focus,.inquiry__alert:focus{ outline: none; box-shadow: var(--lg-focus); }
.btn-arrow{ display: inline-flex; overflow: hidden; }
.btn-arrow > span{ display: inline-flex; }
.inquiry__submit:hover .ico{ transform: none; }
@media (hover: hover){
.inquiry__submit:hover:not([aria-disabled="true"]) .btn-arrow > span{ animation: arrow-through 420ms var(--lg-ease) both; }
}
@keyframes arrow-through{ 0% { transform: none; } 45% { transform: translateX(120%); } 46% { transform: translateX(-120%); } 100% { transform: none; } }
@media (max-width: 1080px){
.founder__figure{ width: 150px; margin: 28px 0 0 var(--pad); }
.inquiry{ border-left: 0; border-top: 1px solid var(--lg-border); }
}
@media (max-width: 760px){
.founder__figure{ width: 112px; margin-top: 24px; }
.inquiry__row{ grid-template-columns: 1fr; grid-template-rows: none; row-gap: 20px; }
.inquiry__row > .field{ grid-row: auto; grid-template-rows: none; }
.choices__list{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
.inquiry__submit{ width: 100%; }
}
.site-footer{ padding-block: 56px 32px; border-top: 1px solid var(--lg-border); }
.site-footer__top{ display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 40px; }
.site-footer__brand p{ margin-top: 18px; max-width: 32ch; color: var(--lg-text-muted); }
.site-footer__label{ margin-bottom: 12px; font: 400 0.8125rem var(--lg-font-mono); color: var(--lg-text-faint); }
.site-footer__col ul{ display: grid; gap: 2px; }
.site-footer__col a,.site-footer__legal a{ display: inline-block; padding: 5px 0; color: var(--lg-text-muted); text-decoration: none; border-radius: 4px; transition: color var(--lg-dur-fast) var(--lg-ease); }
.site-footer__col a:hover,.site-footer__legal a:hover{ color: var(--lg-text); }
.site-footer__col a:focus-visible,.site-footer__legal a:focus-visible{ outline: none; box-shadow: var(--lg-focus); color: var(--lg-text); }
.site-footer__col p{ color: var(--lg-text-muted); }
.site-footer__col .lg-link{ padding: 0 0 1px; color: var(--lg-text); }
.site-footer__bottom{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--lg-border); font-size: 0.875rem; color: var(--lg-text-faint); }
@media (max-width: 980px){
.site-footer__top{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.site-footer__brand{ grid-column: 1 / -1; }
}
@media (max-width: 600px){
.site-footer__top{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px){
.site-footer__top{ grid-template-columns: 1fr; }
}
.svc-hero{ position: relative; isolation: isolate; padding-block: clamp(28px, 5vh, 56px) clamp(56px, 9vh, 112px); }
.svc-hero > .wrap{ position: relative; z-index: 1; }
.svc-hero__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 40px clamp(32px, 4.5vw, 72px); align-items: center; }
.svc-hero__text{ display: grid; gap: 18px; justify-items: start; }
.svc-hero__num{ margin-top: 18px; }
.svc-hero__title{ font-size: clamp(2.25rem, 1.2rem + 2.8vw, 3.75rem); line-height: 1.02; font-weight: 600; letter-spacing: -0.035em; overflow-wrap: anywhere; }
.svc-hero__title .lt{ display: block; }
.svc-hero__lead{ max-width: 44ch; color: var(--lg-text-muted); font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem); }
.svc-hero__actions{ display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.svc-hero__visual{ display: grid; gap: 12px; }
.svc-hero__caption{ text-align: right; }
@media (max-width: 1080px){
.svc-hero__grid{ grid-template-columns: 1fr; }
.svc-hero__caption{ text-align: left; }
}
@media (max-width: 520px){
.svc-hero__actions{ flex-direction: column; justify-self: stretch; }
.svc-hero__actions .lg-btn{ width: 100%; }
}
.fit{ padding-block: var(--sec); border-top: 1px solid var(--lg-border); }
.fit__grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px clamp(40px, 6vw, 96px); }
.fit__col{ display: grid; gap: 16px; align-content: start; }
.checklist{ display: grid; gap: 12px; margin-top: 8px; }
.checklist li{ display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; }
.checklist .ico{ margin-top: 2px; color: var(--lg-text-muted); }
.fit__not{ margin-top: 8px; padding: 14px 16px; border-left: 2px solid var(--lg-border-strong); color: var(--lg-text-muted); font-size: 0.9375rem; }
.fit__not b{ color: var(--lg-text); font-weight: 600; }
.deliver{ display: grid; gap: 4px; margin-top: 8px; }
.deliver li{ display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.deliver li:last-child{ border-bottom: 0; }
@media (max-width: 860px){
.fit__grid{ grid-template-columns: 1fr; }
}
.features,.compare,.process,.svc-tech{ padding-block: var(--sec); border-top: 1px solid var(--lg-border); }
.features__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.feature{ display: grid; gap: 10px; align-content: start; padding: 22px; border: 1px solid var(--lg-border); border-radius: var(--lg-radius-lg); }
.feature__top{ display: flex; justify-content: space-between; align-items: center; }
.feature__icon{ display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: var(--lg-surface-2); }
.feature__n{ display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #1A1D20; color: var(--lg-lime); font-size: 0.75rem; }
.feature__title{ font-size: 1.125rem; font-weight: 600; line-height: 1.3; }
.feature p{ color: var(--lg-text-muted); font-size: 0.9375rem; }
@media (max-width: 980px){
.features__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
.features__grid{ grid-template-columns: 1fr; }
}
.needs{ display: flex; gap: 12px; align-items: flex-start; margin-top: 40px; padding: 18px 20px; border: 1px dashed var(--lg-border-strong); border-radius: var(--lg-radius-md); color: var(--lg-text-muted); }
.needs .ico{ margin-top: 2px; color: var(--lg-text); }
.needs b{ color: var(--lg-text); font-weight: 600; }
.svc-tech__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px clamp(40px, 6vw, 96px); align-items: center; }
.svc-tech__text{ margin: 14px 0 18px; color: var(--lg-text-muted); max-width: 54ch; }
.related{ position: relative; display: grid; gap: 12px; justify-items: start; padding: 20px; background: var(--paper); color: var(--ink); border-radius: var(--lg-radius-lg); text-decoration: none; }
.related__label{ color: var(--ink-muted); }
.related__visual{ width: 100%; }
.related__title{ font-size: 1.25rem; font-weight: 600; line-height: 1.25; letter-spacing: -0.015em; }
.related__go{ display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.related:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@media (hover: hover){
.related:hover .related__go .ico{ transform: translate(2px, -2px); }
}
.related .ico{ transition: transform var(--lg-dur-base) var(--lg-ease); }
@media (max-width: 860px){
.svc-tech__grid{ grid-template-columns: 1fr; }
}
.cta-band{ padding-block: clamp(48px, 7vh, 80px); border-top: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.cta-band__inner{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; }
.cta-band__title{ max-width: 30ch; font-size: clamp(1.5rem, 1.15rem + 1.2vw, 2.125rem); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; }
.cta-band__actions{ display: grid; gap: 10px; justify-items: start; }
.cta-band__actions .lg-btn{ --_h: 52px; padding-inline: 22px; }
.cta-band__note{ font-size: 0.875rem; color: var(--lg-text-faint); }
.proj-hero{ padding-block: clamp(28px, 5vh, 56px) clamp(48px, 7vh, 88px); }
.proj-hero__head{ display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 24px 64px; align-items: end; margin-top: 28px; }
.proj-hero__head .badge{ margin-bottom: 18px; }
.proj-hero__title{ font-size: clamp(2rem, 1.1rem + 3vw, 3.75rem); line-height: 1.04; font-weight: 600; letter-spacing: -0.03em; overflow-wrap: anywhere; }
.proj-hero__summary{ color: var(--lg-text-muted); font-size: 1.0625rem; }
.proj-facts{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 36px; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.proj-facts > div{ padding: 16px 20px 16px 0; }
.proj-facts > div + div{ padding-left: 20px; border-left: 1px solid var(--rule); }
.proj-facts dt{ font: 400 0.8125rem var(--lg-font-mono); color: var(--lg-text-faint); }
.proj-facts dd{ margin-top: 4px; font-weight: 500; }
@media (max-width: 980px){
.proj-hero__head{ grid-template-columns: 1fr; }
.proj-facts{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.proj-facts > div:nth-child(3){ padding-left: 0; border-left: 0; }
.proj-facts > div:nth-child(n + 3){ border-top: 1px solid var(--rule); }
}
@media (max-width: 520px){
.proj-facts{ grid-template-columns: 1fr; }
.proj-facts > div{ padding-left: 0 !important; border-left: 0 !important; }
.proj-facts > div + div{ border-top: 1px solid var(--rule); }
}
.assume,.decisions,.proj-arch,.next-proj{ padding-block: var(--sec); border-top: 1px solid var(--lg-border); }
.assume__grid{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 40px clamp(40px, 6vw, 96px); align-items: start; }
.assume__grid .section-intro{ margin-top: 14px; }
.assume__list{ display: grid; }
.assume__list li{ display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.assume__list li:first-child{ border-top: 1px solid var(--rule); }
.decision{ display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 32px clamp(40px, 6vw, 96px); align-items: center; padding-block: clamp(28px, 4vw, 48px); }
.decision + .decision{ border-top: 1px solid var(--rule); }
.decision--flip{ grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); }
.decision--flip .decision__text{ order: 2; }
.decision__text{ display: grid; gap: 12px; align-content: center; }
.decision__n{ display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #1A1D20; color: var(--lg-lime); }
.decision__title{ font-size: clamp(1.375rem, 1.1rem + 0.9vw, 1.875rem); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; }
.decision__text p{ color: var(--lg-text-muted); max-width: 46ch; }
.decision__visual{ padding: clamp(20px, 3vw, 40px); background: var(--paper); border-radius: var(--lg-radius-lg); }
.decision__visual .phone{ max-width: 260px; }
@media (max-width: 860px){
.assume__grid,.decision,.decision--flip{ grid-template-columns: 1fr; }
.decision--flip .decision__text{ order: 0; }
}
.proj-arch__grid{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 40px clamp(40px, 6vw, 96px); align-items: start; }
.proj-arch__grid .section-intro{ margin: 14px 0 18px; }
@media (max-width: 860px){
.proj-arch__grid{ grid-template-columns: 1fr; }
}
.next-proj__link{ position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; grid-template-rows: auto auto auto 1fr; gap: 12px 40px; align-items: start; justify-items: start; padding: clamp(22px, 3vw, 36px); background: var(--lg-surface-1); border: 1px solid var(--lg-border); border-radius: var(--lg-radius-lg); text-decoration: none; }
.next-proj__title{ font-size: clamp(1.375rem, 1.1rem + 1vw, 2rem); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; }
.next-proj__visual{ grid-column: 2; grid-row: 1 / span 4; width: 100%; padding: 16px; background: var(--paper); border-radius: var(--lg-radius-md); }
.next-proj__go{ grid-column: 3; grid-row: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--lg-border-strong); }
.next-proj__link:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@media (hover: hover){
.next-proj__link:hover .next-proj__go{ color: var(--lg-lime); border-color: var(--lg-lime-line); }
}
@media (max-width: 860px){
.next-proj__link{ grid-template-columns: minmax(0, 1fr) auto; }
.next-proj__visual{ grid-column: 1 / -1; grid-row: auto; }
.next-proj__go{ grid-column: 2; }
}
.page-head{ padding-block: clamp(28px, 5vh, 56px) clamp(28px, 4vh, 48px); }
.page-head__title{ margin-top: 24px; font-size: clamp(2.5rem, 1.4rem + 4vw, 5rem); line-height: 1; font-weight: 600; letter-spacing: -0.04em; }
.page-head__lead{ margin-top: 18px; max-width: 56ch; color: var(--lg-text-muted); font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); }
.stub{ padding-block: clamp(28px, 5vh, 56px) var(--sec); }
.legal{ max-width: calc(46rem + 2 * var(--gutter)); padding-block: clamp(28px, 6vh, 64px) var(--sec); }
.legal__title{ margin-top: 14px; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem); line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; }
.legal h2{ margin-top: 40px; font-size: 1.25rem; line-height: 1.3; font-weight: 600; }
.legal p{ margin-top: 12px; color: var(--lg-text-muted); max-width: 68ch; }
.legal__back{ margin-top: 48px !important; }
.lattice{
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M0 .5H56M0 49H56M0 0L56 97M56 0L0 97' fill='none' stroke='%23EDEFF2' stroke-opacity='.075'/%3E%3C/svg%3E");
  background-size: 56px 97px;
}
.lattice--svc{ left: 42%; -webkit-mask-image: radial-gradient(ellipse 60% 60% at 60% 50%, #000 0%, transparent 100%); mask-image: radial-gradient(ellipse 60% 60% at 60% 50%, #000 0%, transparent 100%); }
@media (max-width: 980px){
.lattice--svc{ left: 0; -webkit-mask-image: radial-gradient(ellipse 80% 34% at 50% 80%, #000 0%, rgba(0, 0, 0, 0.55) 50%, transparent 100%); mask-image: radial-gradient(ellipse 80% 34% at 50% 80%, #000 0%, rgba(0, 0, 0, 0.55) 50%, transparent 100%); }
}
.js.motion .lattice{ opacity: 0; }
.js.motion .lattice.is-in{ opacity: 1; transition: opacity 1800ms var(--lg-ease); }
@media (prefers-reduced-motion: reduce){
.nav__link::after,.nav__chev,.mnav__chev{ transition: none; }
.inquiry__submit:hover .btn-arrow > span{ animation: none; }
.lattice{ opacity: 1; }
}
.site-header{ background: #13161A; border-bottom: 1px solid rgba(237, 239, 242, 0.1); transition: background-color var(--lg-dur-slow) var(--lg-ease), box-shadow var(--lg-dur-slow) var(--lg-ease); }
.site-header.is-scrolled{ background: #171B20; border-bottom-color: rgba(237, 239, 242, 0.12); box-shadow: 0 10px 28px -20px rgba(0, 0, 0, 0.8); }
.site-header.is-mega{ border-bottom-color: rgba(237, 239, 242, 0.12); }
.mega{ left: 0; right: 0; top: calc(100% + 1px); background: transparent; border: 0; box-shadow: none; pointer-events: none; }
.mega__wrap{ display: flex; justify-content: flex-end; padding-top: 10px; }
.mega__panel{
  pointer-events: auto; width: min(680px, 100%); padding: 10px; background: #171B20;
  border: 1px solid rgba(237, 239, 242, 0.14); border-radius: 14px; box-shadow: 0 28px 60px -24px rgba(0, 0, 0, 0.85);
}
.mega__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; }
.mega__item{ position: relative; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; }
.mega__item::before{ content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 2px; border-radius: 2px; background: var(--lg-lime); transform: scaleY(0); transition: transform var(--lg-dur-base) var(--lg-ease); }
.mega__item:hover,.mega__item:focus-visible,.mega__item.is-current{ background: #1F242A; }
.mega__item:hover::before,.mega__item:focus-visible::before,.mega__item.is-current::before{ transform: scaleY(1); }
.mega__icon{ width: 38px; height: 38px; border-radius: 10px; background: #13161A; }
.mega__icon--s{ width: 30px; height: 30px; border-radius: 8px; }
.mega__title{ font-size: 0.9688rem; }
.mega__desc{ font-size: 0.8125rem; line-height: 1.35; }
.mega__foot{ display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; padding: 8px 6px 2px 8px; border-top: 1px solid rgba(237, 239, 242, 0.1); }
.mega__support{ display: flex; align-items: center; gap: 10px; padding: 8px; background: none; border: 0; border-radius: 8px; font-size: 0.875rem; color: var(--lg-text-muted); }
.mega__support b{ color: var(--lg-text); font-weight: 600; }
.mega__support:hover{ background: #1F242A; }
.mega__all{ font-size: 0.875rem; padding: 8px; }
.mega__aside{ display: none; }
.is-paused [data-anim],.is-paused [data-anim] *,[data-anim].is-offscreen,[data-anim].is-offscreen *,.is-hidden [data-anim],.is-hidden [data-anim] *{ animation-play-state: paused !important; }
@keyframes motif-run{ 0% { stroke-dashoffset: 0.06; opacity: 0; } 8% { opacity: 0.55; } 85% { opacity: 0.55; } 100% { stroke-dashoffset: -1; opacity: 0; } }
@keyframes motif-node{ 0%, 80%, 100% { opacity: 0.25; } 90% { opacity: 0.8; } }
.hero--v2{ padding-block: clamp(36px, 6vh, 72px) clamp(28px, 4vh, 48px); }
@keyframes triad-run{ 0% { stroke-dashoffset: 0.14; opacity: 0; } 12% { opacity: 1; } 78% { opacity: 1; } 100% { stroke-dashoffset: -1; opacity: 0; } }
@keyframes triad-ring{ 0%, 60% { opacity: 0; transform: scale(1); } 70% { opacity: 0.7; } 100% { opacity: 0; transform: scale(2.2); } }
.svx__btn{
  all: unset; box-sizing: border-box; display: grid; grid-template-columns: 40px minmax(0, 1fr) 20px; gap: 14px; align-items: center; width: 100%;
  padding: 14px 16px; border-radius: 12px; cursor: pointer; color: var(--lg-text-muted); font-weight: 600; font-size: 1.0625rem;
  transition: background-color var(--lg-dur-fast) var(--lg-ease), color var(--lg-dur-fast) var(--lg-ease);
}
.svx__btn:hover{ background: var(--lg-surface-1); color: var(--lg-text); }
.svx__btn:focus-visible{ box-shadow: var(--lg-focus); color: var(--lg-text); }
.svx__btn[aria-expanded="true"]{ background: var(--lg-surface-1); color: var(--lg-text); box-shadow: inset 2px 0 0 var(--lg-lime); }
.svx__btn[aria-expanded="true"]:focus-visible{ box-shadow: inset 2px 0 0 var(--lg-lime), var(--lg-focus); }
.support-line{ display: flex; align-items: center; gap: 12px; margin-top: 16px; padding: 14px 18px; border: 1px dashed var(--lg-border-strong); border-radius: 12px; text-decoration: none; color: var(--lg-text-muted); font-size: 0.9375rem; }
.support-line b{ color: var(--lg-text); }
.support-line > .ico:last-child{ margin-left: auto; }
.support-line:hover{ border-color: var(--lg-lime-line); color: var(--lg-text); }
.support-line:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@keyframes marquee{ from { transform: translateX(0); } to { transform: translateX(-50%); } }
.faq--home .section-intro .lg-link{ color: var(--lg-text); }
.pshow__stage{ position: relative; container-type: inline-size; padding: clamp(20px, 3vw, 40px) clamp(20px, 3vw, 40px) clamp(28px, 4vw, 52px); background: #DCE0E5; border-radius: var(--lg-radius-lg); overflow: hidden; }
.pshow__stage > *{ font-size: clamp(8px, 1.5cqi, 12px); }
.geo--home{ padding-block: clamp(56px, 8vh, 96px); }
@keyframes base-pulse{ 0% { opacity: 0.8; transform: scale(1); } 100% { opacity: 0; transform: scale(4); } }
.cf-sec{ position: relative; isolation: isolate; padding-top: clamp(56px, 8vh, 96px); border-top: 1px solid var(--lg-border); overflow: hidden; }
.cf-sec > .wrap{ position: relative; z-index: 1; }
.how{ padding-block: var(--sec); border-top: 1px solid var(--lg-border); }
.how__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.how__grid li{ display: grid; gap: 8px; padding-top: 18px; border-top: 1px solid var(--rule); }
.how__grid b{ font-size: 1.125rem; }
.how__grid p{ color: var(--lg-text-muted); }
@media (max-width: 760px){
.how__grid{ grid-template-columns: 1fr; }
}
.about-f{ padding-block: 8px var(--sec); }
.about-f .founder__figure{ width: 340px; margin: 0; }
@media (max-width: 860px){
.about-f .founder__figure{ width: 220px; order: 2; }
}
.principles__grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.principles__grid li{ display: grid; gap: 10px; align-content: start; padding: 22px; background: var(--lg-surface-1); border: 1px solid var(--lg-border); border-radius: var(--lg-radius-lg); }
.principles__grid b{ font-size: 1.0625rem; }
.principles__grid p{ color: var(--lg-text-muted); font-size: 0.9375rem; }
@media (max-width: 1080px){
.principles__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
.principles__grid{ grid-template-columns: 1fr; }
}
.about-f .founder__figure{ grid-area: auto; }
.faq--home{ padding-block: clamp(56px, 8vh, 96px); }
.ph-img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.hs{ container: hs / inline-size; width: 100%; max-width: 680px; justify-self: end; }
.sc{ position: absolute; inset: 0; display: grid; opacity: 0; visibility: hidden; }
.sc.is-on{ opacity: 1; visibility: visible; }
.js.motion .sc{ transition: opacity 0.5s var(--lg-ease) 0.9s, visibility 0s linear 1.4s; }
.js.motion .sc.is-on{ transition: opacity 0.6s var(--lg-ease) 1s, visibility 0s linear 0s; }
@media (prefers-reduced-motion: no-preference){
.hs.is-run .sc.is-on .act--sw{ animation: act-sw 0.4s var(--lg-ease) 2s both; }
.hs.is-run .sc.is-on .act--press{ animation: act-press 0.35s var(--lg-ease) 2.35s both; }
}
@keyframes hs-node{ 0% { transform: scale(0.5); background: #3A3F45; } 55% { transform: scale(1.35); } 100% { transform: none; } }
@keyframes hs-pulse{ 0% { stroke-dashoffset: 0.2; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { stroke-dashoffset: -1; opacity: 0; } }
@keyframes hs-apex{ 0% { transform: scale(0.6); background: #3A3F45; } 60% { transform: scale(1.3); } 100% { transform: none; } }
@keyframes hs-ring{ 0% { opacity: 0.9; transform: scale(0.8); } 100% { opacity: 0; transform: scale(2.4); } }
@keyframes hs-progress{ from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes act-up{ from { opacity: 0; transform: translateY(0.8em); } to { opacity: 1; transform: none; } }
@keyframes act-sw{ 0% { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12); } 100% { box-shadow: 0 0 0 2px #F7F2EB, 0 0 0 3.5px #2A2420; } }
@keyframes act-press{ 0%, 100% { transform: none; } 45% { transform: scale(0.95); } }
@keyframes act-pop{ 0% { opacity: 0; transform: scale(0.4); } 100% { opacity: 1; transform: none; } }
@keyframes act-move{ from { transform: translateX(calc(-100% - 2.2em)); } to { transform: none; } }
@media (max-width: 980px){
.hs{ justify-self: center; max-width: 560px; }
}
.v3{ --ink: #121418; --muted: #5C636E; --line: #DFE2E6; position: relative; width: 100%; max-width: 600px; color: var(--ink); }
.v3 > *{ font-size: clamp(9.5px, 2.05cqi, 13.5px); }
.v3 small{ display: block; color: var(--muted); }
.v3 .ico{ width: 1.15em; height: 1.15em; }
@keyframes art-in{ from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes act-sw2{ 0% { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.14); } 100% { box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3.5px #121418; } }
@keyframes act-slide{ from { opacity: 0; transform: translateX(1.6em); } to { opacity: 1; transform: none; } }
@keyframes act-flash{ 0%, 100% { background: transparent; } 30% { background: rgba(204, 255, 0, 0.45); } }
@keyframes act-draw{ from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes chip-a{ 0% { left: 14%; top: 70%; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { left: 42%; top: 22%; opacity: 0; } }
@keyframes chip-b{ 0% { right: 14%; top: 70%; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { right: 42%; top: 22%; opacity: 0; } }
@keyframes token{ 0% { left: 12.5%; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { left: 87.5%; opacity: 0; } }
.gl{ --gl-ink: #2A2420; --gl-muted: #7A6B5D; --gl-bg: #F7F2EB; --gl-accent: #A4583A; display: grid; gap: 1.2em; padding: 1em 1.4em 1.6em; background: var(--gl-bg); color: var(--gl-ink); }
.pp__qty{ display: inline-flex; align-items: center; gap: 0.5em; padding: 0.2em; border: 1px solid #DCE0E5; border-radius: 0.5em; font-weight: 700; }
.pp__qty i{ display: grid; place-items: center; width: 1.5em; height: 1.5em; border-radius: 0.35em; background: #F1F3F5; font-style: normal; }
.pp-m small{ font-size: 0.78em; color: #5C636E; }
.pp-m__t{ font-size: 1.05em; line-height: 1.2; }
.pp-m__row{ display: flex; justify-content: space-between; align-items: center; gap: 0.5em; padding: 0.55em 0.6em; border-radius: 0.6em; background: #FFFFFF; border: 1px solid #E3E6EA; font-size: 0.86em; font-weight: 600; }
.pp-m__sum{ display: flex; justify-content: space-between; font-size: 0.9em; padding-top: 0.3em; }
.pp-m__btn{ padding: 0.75em; border-radius: 0.6em; background: #1F3A5F; color: #FFFFFF; font-weight: 700; text-align: center; font-size: 0.9em; }
.pshow__stage{ background: #DCE0E5; }
@media (max-width: 760px){
.pshow__stage{ display: grid; aspect-ratio: auto; padding: 16px 0 18px 16px; }
.pshow__stage > *{ font-size: 7.6px; }
}
.geo--home .map{ display: none; }
@keyframes pm-run{ 0%, 8% { stroke-dashoffset: 0.12; opacity: 0; } 14% { opacity: 1; } 66% { opacity: 1; } 72%, 100% { stroke-dashoffset: -1; opacity: 0; } }
@keyframes pm-ring{ 0% { opacity: 0.9; transform: scale(1); } 22%, 100% { opacity: 0; transform: scale(3.2); } }
@keyframes pm-apex{ 0%, 66% { opacity: 0; transform: scale(0.8); } 72% { opacity: 1; } 100% { opacity: 0; transform: scale(2.3); } }
@keyframes node-breathe{ 0%, 100% { transform: scale(1); } 50% { transform: scale(1.5); } }
.badge--client{ background: #1A1D20; }
.badge--client i{ background: var(--lg-text); }
.devs{ container-type: inline-size; display: flex; align-items: flex-end; justify-content: center; gap: 4%; }
.mb{ flex: 0 0 72%; }
.mb__lid{ position: relative; padding: 2.6% 2.6% 3%; border-radius: 4.5% 4.5% 1.2% 1.2% / 7% 7% 2% 2%; background: #1C1C1E; box-shadow: inset 0 0 0 1.5px #3A3A3C, 0 30px 60px -30px rgba(0, 0, 0, 0.55); }
.mb__lid::before{ content: ""; position: absolute; left: 50%; top: 1%; width: 0.9%; aspect-ratio: 1; border-radius: 50%; background: #2C2C2E; transform: translateX(-50%); }
.mb__screen{ aspect-ratio: 16 / 10; overflow: hidden; border-radius: 0.6%; background: #000; }
.mb__screen img,.ip__screen img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.mb__base{ position: relative; width: 116%; margin-left: -8%; height: 0; padding-bottom: 3.4%; border-radius: 0 0 46% 46% / 0 0 100% 100%; background: linear-gradient(#E3E5E8, #B9BCC1 70%, #9EA2A8); }
.mb__base::before{ content: ""; position: absolute; left: 50%; top: 0; width: 15%; height: 42%; transform: translateX(-50%); border-radius: 0 0 0.6em 0.6em; background: #A9ACB1; }
.ip{ flex: 0 0 22%; aspect-ratio: 9 / 19.5; padding: 2.6%; border-radius: 17% / 7.8%; background: #1C1C1E; box-shadow: inset 0 0 0 1.5px #48484A, 0 30px 60px -30px rgba(0, 0, 0, 0.6); }
.ip__screen{ position: relative; height: 100%; overflow: hidden; border-radius: 14% / 6.4%; background: #000; }
.ip__island{ position: absolute; left: 50%; top: 1.8%; width: 31%; height: 3.4%; transform: translateX(-50%); border-radius: 99px; background: #000; }
.ip__screen{ display: flex; flex-direction: column; background: #FFFFFF; }
.ip__status{ flex: none; display: flex; justify-content: space-between; align-items: center; height: 6.2%; padding: 0 9% 0 11%; font: 600 clamp(6px, 1.35cqi, 11px)/1 -apple-system, 'Segoe UI', sans-serif; color: #000; }
.ip__status i{ width: 18%; height: 34%; border-radius: 2px; border: 1px solid #000; }
.ip__screen img{ flex: 1; min-height: 0; height: auto; }
.mb__base{ box-shadow: 0 18px 24px -18px rgba(0, 0, 0, 0.55); }
.site-header .site-header__cta{ background: transparent; color: var(--lg-text); border: 1px solid rgba(237, 239, 242, 0.42); }
.site-header .site-header__cta:hover{ background: rgba(237, 239, 242, 0.06); border-color: var(--lg-lime); color: var(--lg-lime); transform: none; }
.site-header .site-header__cta:active{ background: rgba(204, 255, 0, 0.1); }
.site-header .site-header__cta:focus-visible{ box-shadow: var(--lg-focus); }
@keyframes s4-chip{ from { background: #FFFFFF; color: #5C636E; border-color: #D9DEDD; } to { background: #1F3A3A; color: #FFFFFF; border-color: #1F3A3A; } }
@keyframes s4-type{ from { color: transparent; } to { color: #121418; } }
@keyframes s4-drawer{ from { opacity: 0; transform: translateY(1em); } to { opacity: 1; transform: none; } }
@keyframes s4-st-a{ 0%, 30% { opacity: 1; } 34%, 100% { opacity: 0; } }
@keyframes s4-st-b{ 0%, 30% { opacity: 0; } 34%, 82% { opacity: 1; } 86%, 100% { opacity: 0; } }
@keyframes s4-st-c{ 0%, 82% { opacity: 0; } 86%, 100% { opacity: 1; } }
.v4{ --ink: #121418; --muted: #5C636E; position: relative; width: 100%; max-width: 600px; color: var(--ink); }
.v4{ font-size: clamp(10px, 2.4cqi, 14.5px); }
.v4 small{ display: block; color: var(--muted); }
.v4 .ico{ width: 1.15em; height: 1.15em; }
.v4--shop{ display: grid; grid-template-columns: minmax(0, 1fr) 12% minmax(0, 1fr); align-items: center; }
.v4s__prod{ display: grid; gap: 0.5em; padding: 1em; background: #FFFFFF; border-radius: 0.9em; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.5); }
.v4s__img{ aspect-ratio: 1; border-radius: 0.6em; overflow: hidden; }
.v4s__prod > b{ font-size: 1.1em; }
.v4s__price{ font-weight: 700; font-size: 1.15em; }
.v4s__sw{ display: flex; gap: 0.45em; }
.v4s__sw i{ width: 1.4em; height: 1.4em; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.14); }
.v4s__sw i.is-on{ box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3.5px #121418; }
.v4s__btn{ display: inline-flex; align-items: center; justify-content: center; gap: 0.4em; padding: 0.65em; border-radius: 0.55em; background: #121418; color: #FFFFFF; font-weight: 700; }
.v4__link{ width: 100%; height: 1.4em; overflow: visible; }
.v4__link path{ fill: none; stroke: #121418; stroke-width: 1.5; vector-effect: non-scaling-stroke; stroke-dasharray: 1; }
.v4s__cart{ display: grid; gap: 0.55em; padding: 1.1em; border-radius: 0.9em; background: #1A1D20; color: #EDEFF2; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.6); }
.v4s__h{ display: flex; justify-content: space-between; font-weight: 700; }
.v4s__h i{ display: grid; place-items: center; min-width: 1.6em; height: 1.6em; border-radius: 1em; background: var(--lg-lime); color: #1A1D20; font-style: normal; font-size: 0.85em; }
.v4s__row,.v4s__sum{ display: flex; justify-content: space-between; gap: 0.6em; font-size: 0.92em; }
.v4s__row small{ color: #9BA3AE; }
.v4s__row--m{ color: #9BA3AE; }
.v4s__sum{ padding-top: 0.55em; border-top: 1px solid #2E3339; font-size: 1em; }
.v4s__go{ padding: 0.6em; border-radius: 0.5em; background: #EDEFF2; color: #1A1D20; font-weight: 700; text-align: center; }
.v4--site{ display: grid; grid-template-columns: 2.4em minmax(0, 1fr); }
.v4w{ grid-column: 2; display: grid; gap: 0.6em; }
.v4w__s{ position: relative; display: grid; gap: 0.35em; padding: 0.85em 1em; border-radius: 0.7em; background: #FFFFFF; box-shadow: 0 0.8em 1.6em -1.2em rgba(0, 0, 0, 0.4); }
.v4w__s::before{ content: ""; position: absolute; left: -1.85em; top: 50%; width: 0.75em; height: 0.75em; margin-top: -0.375em; border-radius: 50%; background: #121418; box-shadow: 0 0 0 0.25em #E6E9ED; }
.v4w__s--form::before{ width: 1.05em; height: 1.05em; margin-top: -0.52em; left: -2em; background: var(--lg-lime); box-shadow: 0 0 0 0.25em #E6E9ED, 0 0 0 0.32em #1A1D20; }
.v4w__s small{ font: 500 0.8em var(--lg-font-mono); }
.v4w__s--h b{ font-size: 1.35em; line-height: 1.1; }
.v4w__s--h span{ color: var(--muted); }
.v4w__chips{ display: flex; gap: 0.35em; }
.v4w__chips i{ padding: 0.3em 0.7em; border-radius: 2em; border: 1px solid #DFE2E6; font-style: normal; font-size: 0.88em; }
.v4w__bars{ display: flex; gap: 0.4em; }
.v4w__bars i{ flex: 1; height: 2.2em; border-radius: 0.4em; background: #EEF0F3; }
.v4w__s--form{ box-shadow: 0 0 0 1.5px #121418, 0 1em 2em -1.4em rgba(0, 0, 0, 0.5); }
.v4w__form{ display: grid; grid-template-columns: 1fr 1fr auto; gap: 0.4em; }
.v4w__form i{ padding: 0.45em 0.6em; border: 1px solid #DFE2E6; border-radius: 0.4em; font-style: normal; color: #8A9099; font-size: 0.88em; }
.v4w__form b{ padding: 0.45em 0.8em; border-radius: 0.4em; background: #121418; color: #FFFFFF; font-size: 0.88em; }
.v4w__path{ grid-column: 1; grid-row: 1; width: 100%; height: 100%; }
.v4w__path path{ fill: none; stroke: #8E959E; stroke-width: 1.5; vector-effect: non-scaling-stroke; stroke-dasharray: 1; }
.v4w__node{ display: none; }
.v4--erp{ aspect-ratio: 400 / 250; }
.v4e__lines{ position: absolute; inset: 0; width: 100%; height: 100%; }
.v4e__edge{ fill: none; stroke: #8E959E; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.v4e__pulse{ fill: none; stroke: #121418; stroke-width: 3.2; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 0.16 1.3; stroke-dashoffset: 0.16; opacity: 0; }
.v4e__apex{ position: absolute; left: 50%; top: 0; transform: translateX(-50%); display: grid; justify-items: center; gap: 0.2em; text-align: center; white-space: nowrap; }
.v4e__apex i{ display: grid; place-items: center; width: 2.6em; height: 2.6em; border-radius: 50%; background: var(--lg-lime); color: #1A1D20; box-shadow: 0 0 0 0.35em #E6E9ED, 0 0 0 0.45em #1A1D20; }
.v4e__apex .ico{ stroke-width: 2.6; }
.v4e__apex b{ margin-top: 0.3em; }
.v4e__sys{ position: absolute; bottom: 0; left: 0; width: 44%; display: grid; gap: 0.3em; padding: 0.95em 1em; border-radius: 0.9em; background: #FFFFFF; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.55); font-size: 0.95em; }
.v4e__sys small{ display: flex; align-items: center; gap: 0.4em; }
.v4e__sys > b{ font-size: 1.08em; }
.v4e__sys--erp{ left: auto; right: 0; background: #1A1D20; color: #EDEFF2; }
.v4e__sys--erp small{ color: #9BA3AE; }
.v4e__sys s{ color: #9BA3AE; }
.v4e__sys--erp .act--num{ color: var(--lg-lime); }
.v4--consult{ display: grid; gap: 0.7em; }
.v4c__prob{ padding: 0.9em 1.1em; border-radius: 0.8em; background: #1A1D20; color: #EDEFF2; }
.v4c__prob small{ color: #9BA3AE; font: 500 0.8em var(--lg-font-mono); }
.v4c__opts{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5em; }
.v4c__opt{ display: grid; gap: 0.3em; align-content: start; padding: 0.8em; border-radius: 0.7em; background: #FFFFFF; box-shadow: 0 0.8em 1.6em -1.2em rgba(0, 0, 0, 0.4); font-size: 0.92em; }
.v4c__opt i{ display: grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: 50%; border: 1.5px solid #8E959E; font-style: normal; font-weight: 700; }
.v4c__opt.is-pick{ box-shadow: 0 0 0 1.5px #121418, 0 0.8em 1.6em -1.2em rgba(0, 0, 0, 0.4); }
.v4c__opt.is-pick i{ background: var(--lg-lime); border-color: #1A1D20; }
.v4c__score{ display: flex; gap: 0.25em; margin-top: 0.2em; }
.v4c__score u{ width: 1.2em; height: 0.35em; border-radius: 1em; background: #DFE2E6; }
.v4c__score u.on{ background: #121418; }
.v4c__plan{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5em; padding: 0.8em; border-radius: 0.8em; background: #FFFFFF; box-shadow: 0 0.8em 1.6em -1.2em rgba(0, 0, 0, 0.4); }
.v4c__plan li{ display: flex; gap: 0.5em; align-items: flex-start; font-size: 0.9em; font-weight: 600; }
.v4c__plan li i{ display: grid; place-items: center; flex: none; width: 1.6em; height: 1.6em; border-radius: 50%; background: #121418; color: #FFFFFF; font-style: normal; font-size: 0.85em; }
.v4c__plan li.is-end i{ background: var(--lg-lime); color: #1A1D20; }
.v4f{ display: grid; grid-template-columns: auto repeat(3, minmax(0, 1fr)); gap: 0.4em; padding: 1em; border-radius: 0.9em; background: #FFFFFF; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.5); }
.v4f__col{ font-size: 0.82em; font-weight: 700; color: var(--muted); text-align: center; padding-bottom: 0.3em; border-bottom: 1px solid #EEF0F3; }
.v4f__role{ display: flex; align-items: center; gap: 0.45em; padding-right: 0.6em; font-size: 0.9em; font-weight: 600; white-space: nowrap; }
.v4f__cell{ min-height: 3.6em; border-radius: 0.55em; background: #F4F5F7; }
.v4f__cell.is-on{ display: grid; align-content: center; justify-items: center; background: #1A1D20; color: #EDEFF2; text-align: center; }
.v4f__cell.is-on b{ font: 500 0.82em var(--lg-font-mono); color: var(--lg-lime); }
.v4f__cell.is-on small{ color: #C9CED4; font-size: 0.82em; }
.v4f__note{ margin-top: 0.8em; font-size: 0.9em; color: var(--muted); }
.v4r{ display: grid; gap: 0.5em; padding: 1.2em; border-radius: 0.9em; background: #FFFFFF; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.5); }
.v4r__h{ display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 0.2em; }
.v4r__h b{ font-size: 1.2em; }
.v4r__row{ display: grid; grid-template-columns: auto 1fr auto; gap: 0.6em; align-items: center; padding-top: 0.5em; border-top: 1px solid #EEF0F3; font-size: 0.95em; }
.v4r__row .ico{ color: #2F7A4B; stroke-width: 2.6; }
@container (max-width: 430px){
.v4--shop{ grid-template-columns: 1fr; gap: 0.6em; }
.v4__link{ display: none; }
.v4c__opts{ grid-template-columns: 1fr; }
.v4c__plan{ grid-template-columns: 1fr; }
.v4--erp{ aspect-ratio: 400 / 330; }
.v4e__sys{ width: 47%; padding: 0.8em; }
.v4f__role{ font-size: 0.82em; }
}
.devs{ container-type: inline-size; display: flex; align-items: flex-end; justify-content: center; gap: 4%; }
.mb{ flex: 0 0 71%; }
.ip{ flex: 0 0 21%; }
.mb__screen{ container-type: inline-size; position: relative; background: #FFFFFF; }
.mb__screen > .shot,.ip__view > .shot{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.ip__view{ container-type: inline-size; position: relative; flex: 1; min-height: 0; overflow: hidden; }
.ui--desk{ font-size: calc(100cqi / 72); height: 100%; overflow: hidden; }
.ui--desk .gl{ min-height: 100%; }
.ui--desk,.ui--ph{ color: #121418; }
.ui--ph{ font-size: calc(100cqi / 13.5); height: 100%; overflow: hidden; display: grid; gap: 0.55em; align-content: start; padding: 0.8em 0.8em 1em; }
.ui--ph.pp-m{ background: #F4F5F7; }
.mb__lid{ box-shadow: inset 0 0 0 1.5px #3A3A3C, 0 34px 50px -30px rgba(0, 0, 0, 0.6); }
.ip{ box-shadow: inset 0 0 0 1.5px #48484A, 0 34px 50px -30px rgba(0, 0, 0, 0.65); }
.pshow__stage--dev{ display: block; padding: clamp(26px, 3.4vw, 46px) clamp(20px, 3vw, 40px) clamp(22px, 3vw, 36px); background: linear-gradient(180deg, #C9D0D8, #B7BFC9); border-radius: var(--lg-radius-lg); overflow: hidden; }
.pshow__stage--dev .devs{ transition: transform var(--lg-dur-slow) var(--lg-ease); }
@media (max-width: 760px){
.pshow__stage--dev{ padding: 18px 12px 16px; }
.pshow__stage--dev .devs{ gap: 3%; }
}
.me{ position: relative; width: 100%; max-width: 600px; justify-self: end; }
.me__svg{ display: block; width: 100%; height: auto; overflow: visible; }
.me__land{ fill: #1C2026; stroke: rgba(237, 239, 242, 0.24); stroke-width: 0.6; stroke-linejoin: round; }
.me__land--base{ fill: rgba(204, 255, 0, 0.22); stroke: var(--lg-lime); stroke-width: 1.1; }
.me__arc{ fill: none; stroke: rgba(204, 255, 0, 0.32); stroke-width: 1.2; stroke-dasharray: 0.05 0.03; stroke-linecap: round; }
.me__base{ fill: var(--lg-lime); stroke: var(--lg-bg); stroke-width: 2.5; }
.me__ring{ fill: none; stroke: var(--lg-lime); stroke-width: 1.2; opacity: 0; transform-box: fill-box; transform-origin: center; }
.me__legend{ display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 14px; font-size: 0.875rem; color: var(--lg-text-muted); }
.me__legend li{ display: flex; align-items: center; gap: 8px; }
.me__legend b{ color: var(--lg-text); font-weight: 600; }
.me__k{ width: 12px; height: 12px; border-radius: 50%; }
.me__k--base{ background: var(--lg-lime); }
.me__k--remote{ width: 22px; height: 2px; border-radius: 1px; background: repeating-linear-gradient(90deg, rgba(204, 255, 0, 0.7) 0 4px, transparent 4px 7px); }
@media (prefers-reduced-motion: no-preference){
.js .me__arc{ animation: me-flow 6s linear infinite; animation-delay: calc(var(--i) * -0.8s); }
.js .me__ring{ animation: pm-ring 3.6s var(--lg-ease) infinite; }
}
@keyframes me-flow{ to { stroke-dashoffset: -0.32; } }
@media (max-width: 860px){
.me{ justify-self: stretch; max-width: none; }
}
@media (prefers-reduced-motion: reduce){
.me__arc{ stroke-dasharray: none; }
}
.pp-m__kv{ display: grid; gap: 0.15em; padding-top: 0.5em; border-top: 1px solid #E3E6EA; font-size: 0.86em; }
.svc-hero__art{ container-type: inline-size; display: grid; place-items: center; padding: clamp(18px, 3vw, 36px); min-height: 320px; background: #E6E9ED; border-radius: var(--lg-radius-lg); }
.svc-hero__art .v4{ max-width: 560px; }
.svc-pager{ border-top: 1px solid var(--lg-border); }
.svc-pager__grid{ display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px 24px; align-items: center; padding-block: clamp(24px, 4vh, 40px); }
.svc-pager__link{ display: grid; gap: 6px; padding: 16px 18px; border: 1px solid var(--lg-border); border-radius: 12px; color: var(--lg-text); text-decoration: none; transition: border-color var(--lg-dur-base) var(--lg-ease), background var(--lg-dur-base) var(--lg-ease); }
.svc-pager__link span{ display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; color: var(--lg-text-muted); }
.svc-pager__link b{ font-size: 1.0625rem; }
.svc-pager__link--next{ text-align: right; justify-items: end; }
.svc-pager__link:hover{ border-color: var(--lg-lime); background: rgba(237, 239, 242, 0.03); }
.svc-pager__link:focus-visible,.svc-pager__all:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.svc-pager__all{ color: var(--lg-text); font-weight: 600; text-underline-offset: 4px; }
@media (max-width: 760px){
.svc-pager__grid{ grid-template-columns: 1fr 1fr; }
.svc-pager__all{ grid-column: 1 / -1; grid-row: 2; justify-self: center; }
}
.svc-list{ padding-bottom: clamp(40px, 7vh, 72px); }
.svc-list__grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 860px){
.svc-list__grid{ grid-template-columns: 1fr; }
}
.choose{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.choose__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.choose__item{ display: grid; gap: 8px; align-content: start; padding: 20px; border: 1px solid var(--lg-border); border-radius: 12px; }
.choose__q{ color: var(--lg-text-muted); }
.choose__arrow{ color: var(--lg-lime); }
.choose__a{ font-size: 1.25rem; font-weight: 700; color: var(--lg-text); text-underline-offset: 4px; }
.choose__a:hover{ color: var(--lg-lime); }
.choose__why{ font-size: 0.9375rem; color: var(--lg-text-muted); }
.choose__consult{ display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 16px 20px; border-radius: 12px; background: var(--lg-surface-2); color: var(--lg-text); text-decoration: none; }
.choose__consult .ico:first-child{ color: var(--lg-lime); flex: none; }
.choose__consult span{ flex: 1; }
.choose__consult:hover{ box-shadow: inset 0 0 0 1px var(--lg-lime); }
.choose__consult:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@media (max-width: 860px){
.choose__grid{ grid-template-columns: 1fr; }
}
.proj-devs{ margin-top: clamp(24px, 4vh, 40px); padding: clamp(26px, 4vw, 56px) clamp(18px, 5vw, 80px) clamp(22px, 3vw, 40px); border-radius: var(--lg-radius-lg); background: linear-gradient(180deg, #C9D0D8, #B7BFC9); }
.proj-devs .devs{ max-width: 1000px; margin-inline: auto; }
.decision__visual--v4{ display: grid; place-items: center; background: #E6E9ED; }
.decision__visual--v4 .v4{ max-width: 560px; }
.related__visual--dev,.next-proj__visual--dev{ display: block; padding: 18px 14px 14px; background: linear-gradient(180deg, #C9D0D8, #B7BFC9); border-radius: var(--lg-radius-md); }
.features__grid:has(> li:nth-child(4):last-child){ grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px){
.features__grid:has(> li:nth-child(4):last-child){ grid-template-columns: 1fr; }
}
@keyframes hx-dot{ 0% { transform: translate(-50%, -50%) scale(0.4); background: #3A3F45; } 60% { transform: translate(-50%, -50%) scale(1.35); } 100% { transform: translate(-50%, -50%); } }
@keyframes hx-apex{ 0% { transform: translate(-50%, -50%) scale(0.5); background: #3A3F45; } 60% { transform: translate(-50%, -50%) scale(1.3); } 100% { transform: translate(-50%, -50%); } }
@keyframes hx-rise{ from { opacity: 0; transform: translateY(1.2em) scale(0.98); } to { opacity: 1; transform: none; } }
.pz{ font-size: calc(100cqi / 30); height: 100%; overflow: hidden; color: #121418; }
.pz small{ display: block; color: #5C636E; font-size: 0.72em; }
.pz--portal{ display: grid; grid-template-columns: 2.6em minmax(0, 1fr); background: #F4F5F7; }
.pz__rail{ display: grid; align-content: start; justify-items: center; gap: 0.55em; padding: 0.8em 0; background: #1F3A5F; color: #B9C6D8; }
.pz__rail span{ display: grid; place-items: center; width: 1.7em; height: 1.7em; border-radius: 0.45em; }
.pz__rail span.is-on{ background: rgba(255, 255, 255, 0.14); color: #FFFFFF; }
.pz__rail .ico{ width: 0.95em; height: 0.95em; }
.pz__mark{ width: 1.2em; height: 1.2em; margin-bottom: 0.4em; border-radius: 0.35em; background: #FFFFFF; box-shadow: inset 0 0 0 0.3em #34557F; }
.pz__main{ display: grid; align-content: start; gap: 0.7em; padding: 0.9em 1.1em; }
.pz__top{ display: flex; justify-content: space-between; align-items: center; gap: 1em; }
.pz__top b{ font-size: 1.15em; }
.pz__co{ display: inline-flex; align-items: center; gap: 0.45em; font-size: 0.72em; color: #3B414B; }
.pz__co i{ display: grid; place-items: center; width: 2em; height: 2em; border-radius: 50%; background: #1F3A5F; color: #FFFFFF; font-style: normal; font-weight: 700; font-size: 0.85em; }
.pz__rows{ display: grid; gap: 0.4em; }
.pz__row{ display: flex; justify-content: space-between; align-items: center; gap: 1em; padding: 0.55em 0.75em; border-radius: 0.5em; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E6EA; font-size: 0.82em; }
.pz__row small{ font-family: var(--lg-font-mono); }
.pz__foot{ display: flex; justify-content: space-between; align-items: center; gap: 1em; font-size: 0.82em; }
.pz__foot b{ font-size: 1.2em; margin-left: 0.3em; }
.pz__btn{ padding: 0.55em 1em; border-radius: 0.5em; background: #1F3A5F; color: #FFFFFF; font-weight: 700; }
.ui--ph{ font-size: calc(100cqi / 11.5); }
@container (max-width: 520px){
.devs .mb{ flex-basis: 64%; }
.devs .ip{ flex-basis: 28%; }
}
@container (max-width: 430px){
.v4{ font-size: 12px; }
.v4s__prod{ grid-template-columns: 38% minmax(0, 1fr); column-gap: 0.9em; align-items: center; }
.v4s__img{ grid-row: 1 / span 4; }
.v4s__btn{ grid-column: 2; }
.v4w__s:nth-child(3){ display: none; }
.v4w__form{ grid-template-columns: 1fr auto; }
.v4w__form i:nth-child(2){ display: none; }
.v4--erp{ aspect-ratio: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 0.7em; }
.v4e__lines{ display: none; }
.v4e__apex{ position: static; transform: none; grid-column: 1 / -1; grid-template-columns: auto 1fr; justify-items: start; align-items: center; column-gap: 0.7em; padding: 0.7em 0.9em; border-radius: 0.8em; background: #FFFFFF; text-align: left; white-space: normal; }
.v4e__apex i{ grid-row: 1 / span 2; }
.v4e__apex b{ margin: 0; }
.v4e__sys,.v4e__sys--erp{ position: static; width: auto; }
.v4c__opts{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.v4c__opt small,.v4c__score{ display: none; }
.v4f{ padding: 0.8em; gap: 0.3em; }
.v4f__note{ display: none; }
.v4f__cell{ min-height: 3.2em; }
.v4f__role .ico{ display: none; }
.v4f__role{ padding-right: 0.3em; font-size: 0.86em; }
.v4f__cell.is-on small{ font-size: 0.74em; }
}
.site-header .site-header__cta{ background: var(--lg-lime-dim); color: var(--lg-lime); border: 1px solid var(--lg-lime-line); }
.site-header .site-header__cta:hover{ background: var(--lg-lime); border-color: var(--lg-lime); color: var(--lg-on-lime); }
.site-header .site-header__cta:active{ background: var(--lg-lime-press); color: var(--lg-on-lime); }
.fit--v6 .fit__col--imp{ padding: clamp(20px, 3vw, 32px); border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.fit--v6 .fit__not{ display: flex; gap: 10px; align-items: flex-start; }
.fit--v6 .fit__not .ico{ flex: none; margin-top: 3px; color: var(--lg-warn); }
.imp{ display: grid; gap: 12px; margin-top: 18px; }
.imp__row{ display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: stretch; }
.imp__was,.imp__now{ display: grid; gap: 4px; align-content: start; padding: 12px 14px; border-radius: 10px; font-size: 0.9375rem; line-height: 1.45; }
.imp__was{ background: rgba(237, 239, 242, 0.03); border: 1px dashed var(--lg-border-strong); color: var(--lg-text-muted); }
.imp__now{ background: var(--lg-ok-dim); border: 1px solid rgba(95, 211, 154, 0.3); color: var(--lg-text); }
.imp small{ font: 500 0.6875rem/1 var(--lg-font-mono); letter-spacing: 0.04em; text-transform: uppercase; }
.imp__was small{ color: var(--lg-text-faint); }
.imp__now small{ color: var(--lg-ok); }
.imp__arrow{ display: grid; place-items: center; color: var(--lg-lime); }
@media (max-width: 560px){
.imp__row{ grid-template-columns: 1fr; gap: 6px; }
.imp__arrow{ transform: rotate(90deg); justify-self: center; }
}
.vs{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.vs__wrap{ margin-top: 28px; border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-lg); overflow: hidden; }
.vs__table{ width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.vs__table th,.vs__table td{ padding: 14px 18px; text-align: left; vertical-align: top; border-top: 1px solid var(--lg-border); }
.vs__table thead th{ border-top: 0; background: var(--lg-surface-2); font-size: 1rem; }
.vs__table thead th:nth-child(2){ color: var(--lg-info); }
.vs__table thead th:nth-child(3){ color: var(--lg-lime); }
.vs__table tbody th{ width: 24%; color: var(--lg-text-muted); font-weight: 600; }
.vs__table td{ color: var(--lg-text); }
.vs__source{ margin-top: 10px; font-size: 0.75rem; color: var(--lg-text-faint); }
@media (max-width: 760px){
.vs__table thead{ display: none; }
.vs__table,.vs__table tbody,.vs__table tr,.vs__table th,.vs__table td{ display: block; width: auto; }
.vs__table tr{ padding: 14px 16px; border-top: 1px solid var(--lg-border); }
.vs__table tr:first-child{ border-top: 0; }
.vs__table tbody th{ padding: 0 0 8px; border: 0; color: var(--lg-text); }
.vs__table td{ display: grid; grid-template-columns: 7.5em 1fr; gap: 10px; padding: 6px 0; border: 0; }
.vs__table td::before{ content: attr(data-label); font: 500 0.75rem/1.5 var(--lg-font-mono); color: var(--lg-info); }
.vs__table td:nth-of-type(2)::before{ color: var(--lg-lime); }
}
.pc{ padding-block: clamp(36px, 6vh, 64px); }
.vs + .pc{ padding-top: 0; }
.pc__title{ margin-bottom: 18px; font-size: clamp(1.375rem, 2.2vw, 1.75rem); }
.pc__grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pc__col{ padding: 22px 24px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); }
.pc__col--ok{ background: linear-gradient(180deg, var(--lg-ok-dim), transparent 70%); border-color: rgba(95, 211, 154, 0.28); }
.pc__col--warn{ background: linear-gradient(180deg, var(--lg-warn-dim), transparent 70%); border-color: rgba(255, 181, 71, 0.28); }
.pc__h{ display: flex; align-items: center; gap: 10px; font-size: 1.0625rem; }
.pc__col--ok .pc__h .ico{ color: var(--lg-ok); }
.pc__col--warn .pc__h .ico{ color: var(--lg-warn); }
.pc__list{ display: grid; gap: 10px; margin-top: 14px; }
.pc__list li{ position: relative; padding-left: 18px; color: var(--lg-text); line-height: 1.5; }
.pc__list li::before{ content: ""; position: absolute; left: 2px; top: 0.62em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.45; }
@media (max-width: 760px){
.pc__grid{ grid-template-columns: 1fr; }
}
.plat{ padding-block: clamp(36px, 6vh, 64px); border-top: 1px solid var(--lg-border); }
.plat__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 26px; }
.plat__item{ display: grid; gap: 8px; align-content: start; padding: 20px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.plat__icon{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--lg-info-dim); color: var(--lg-info); }
.plat__item h3{ font-size: 1.125rem; }
.plat__item p{ color: var(--lg-text-muted); font-size: 0.9375rem; }
@media (max-width: 860px){
.plat__grid{ grid-template-columns: 1fr; }
}
.scope{ padding-block: clamp(48px, 8vh, 80px); border-top: 1px solid var(--lg-border); }
.scope__grid{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 32px clamp(40px, 6vw, 96px); align-items: start; }
.scope__grid .section-intro{ margin-top: 14px; }
.scope__list{ display: grid; gap: 0; }
.scope__list li{ display: grid; grid-template-columns: 2.6em 1fr; gap: 12px; padding: 14px 0; border-top: 1px solid var(--lg-border); color: var(--lg-text); }
.scope__list li:last-child{ border-bottom: 1px solid var(--lg-border); }
.scope__n{ color: var(--lg-lime); font-size: 0.8125rem; padding-top: 2px; }
@media (max-width: 860px){
.scope__grid{ grid-template-columns: 1fr; }
}
.faq__a{ max-width: 64ch; display: grid; gap: 10px; }
.faq__a p{ margin: 0; }
.faq__lead{ color: var(--lg-text); font-weight: 600; font-size: 1.0625rem; }
.faq__a b{ color: var(--lg-text); font-weight: 600; }
.faq__pts{ display: grid; gap: 6px; }
.faq__pts li{ position: relative; padding-left: 18px; }
.faq__pts li::before{ content: ""; position: absolute; left: 2px; top: 0.65em; width: 6px; height: 6px; border-radius: 50%; background: var(--lg-lime); }
.faq__note{ display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 8px; font-size: 0.9375rem; }
.faq__note .ico{ flex: none; margin-top: 3px; }
.faq__note--warn{ background: var(--lg-warn-dim); color: var(--lg-text); }
.faq__note--warn .ico{ color: var(--lg-warn); }
.faq__note--info{ background: var(--lg-info-dim); color: var(--lg-text); }
.faq__note--info .ico{ color: var(--lg-info); }
.pk{ padding-block: clamp(56px, 9vh, 96px); border-top: 1px solid var(--lg-border); scroll-margin-top: 80px; }
.pk__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; align-items: stretch; }
.pk__card{ position: relative; display: grid; grid-template-rows: auto auto auto auto auto 1fr auto; gap: 12px; padding: 26px 24px 24px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border-strong); }
.pk__card--rec{ border-color: var(--lg-lime-line); box-shadow: 0 0 0 1px var(--lg-lime-line), 0 30px 60px -40px rgba(204, 255, 0, 0.35); background: linear-gradient(180deg, rgba(204, 255, 0, 0.06), var(--lg-surface-1) 40%); }
.pk__badge{ position: absolute; top: -12px; left: 24px; padding: 4px 10px; border-radius: 99px; background: var(--lg-lime); color: var(--lg-on-lime); font-size: 0.75rem; font-weight: 700; }
.pk__name{ font-size: 1.375rem; }
.pk__price{ display: flex; align-items: baseline; gap: 6px; }
.pk__price b{ font-size: 2.5rem; line-height: 1; letter-spacing: -0.02em; }
.pk__price span{ color: var(--lg-text-muted); }
.pk__kv{ display: grid; gap: 0; margin: 0; }
.pk__kv div{ display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--lg-border); font-size: 0.9375rem; }
.pk__kv dt{ display: inline-flex; align-items: center; gap: 8px; color: var(--lg-text-muted); }
.pk__kv dt .ico{ color: var(--lg-info); }
.pk__kv dd{ margin: 0; text-align: right; font-weight: 600; }
.pk__btn{ justify-content: center; margin-top: 6px; }
.pk__compare{ margin-top: 28px; border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-lg); }
.pk__compare summary{ display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; cursor: pointer; list-style: none; font-weight: 600; border-radius: var(--lg-radius-lg); }
.pk__compare summary::-webkit-details-marker{ display: none; }
.pk__compare summary:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.pk__compare[open] summary .ico{ transform: rotate(180deg); }
.pk__tablewrap{ overflow-x: auto; border-top: 1px solid var(--lg-border); }
.pk__table{ width: 100%; min-width: 560px; border-collapse: collapse; font-size: 0.9375rem; }
.pk__table th,.pk__table td{ padding: 12px 16px; border-top: 1px solid var(--lg-border); text-align: left; }
.pk__table thead th{ border-top: 0; color: var(--lg-text-muted); font-weight: 600; }
.pk__table thead th:nth-child(3){ color: var(--lg-lime); }
.pk__table tbody th{ font-weight: 500; color: var(--lg-text); width: 40%; }
.pk__table td{ color: var(--lg-text-muted); }
.pk-yes{ color: var(--lg-ok); }
.pk-no{ color: var(--lg-text-faint); }
.pk__terms{ margin-top: 28px; }
.pk__terms-h{ font-size: 1.125rem; margin-bottom: 12px; }
.pk__terms ul{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 28px; }
.pk__terms li{ display: grid; grid-template-columns: 20px 1fr; gap: 10px; color: var(--lg-text-muted); font-size: 0.9375rem; }
.pk__terms li .ico{ margin-top: 2px; color: var(--lg-info); }
.pk__terms b{ color: var(--lg-text); }
@media (max-width: 980px){
.pk__grid{ grid-template-columns: 1fr; max-width: 560px; }
}
@media (max-width: 760px){
.pk__terms ul{ grid-template-columns: 1fr; }
}
.choices--pkg[hidden]{ display: none; }
.cs-hero__type{ margin-top: 8px; color: var(--lg-text-muted); font-size: 0.8125rem; }
.cs-status{ display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; padding: 12px 16px; border-radius: 10px; background: var(--lg-info-dim); border: 1px solid var(--lg-info-line); color: var(--lg-text); font-size: 0.9375rem; }
.cs-status .ico{ flex: none; margin-top: 2px; color: var(--lg-info); }
.cs-status b{ color: var(--lg-info); }
.cs-shotnote{ margin-top: 10px; font-size: 0.75rem; color: var(--lg-text-faint); }
.cs-intro{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.cs-intro__grid{ display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 32px clamp(40px, 6vw, 96px); align-items: start; }
.cs-intro__ctx p{ max-width: 62ch; margin-top: 14px; color: var(--lg-text-muted); font-size: 1.0625rem; line-height: 1.6; }
.cs-intro__ctx p:first-of-type{ color: var(--lg-text); }
.cs-intro__task{ padding: 24px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.cs-intro__tasktext{ margin-top: 12px; color: var(--lg-text); font-size: 1.0625rem; line-height: 1.55; }
.cs-scope{ display: grid; gap: 8px; margin-top: 16px; }
.cs-scope li{ display: grid; grid-template-columns: 18px 1fr; gap: 8px; color: var(--lg-text-muted); }
.cs-scope .ico{ margin-top: 3px; color: var(--lg-lime); }
.cs-contrib{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.cs-contrib__grid{ display: grid; gap: 16px; margin-top: 28px; }
.cs-contrib__grid--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cs-contrib__grid li{ display: grid; gap: 10px; align-content: start; padding: 22px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.cs-contrib__icon{ display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: var(--lg-lime-dim); color: var(--lg-lime); }
.cs-contrib__grid h3{ font-size: 1.125rem; }
.cs-contrib__grid p{ color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.55; }
@media (max-width: 980px){
.cs-contrib__grid--3{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
.cs-contrib__grid--3{ grid-template-columns: 1fr; }
}
@media (max-width: 860px){
.cs-intro__grid{ grid-template-columns: 1fr; }
}
.cs-result{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.cs-result__grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 24px clamp(28px, 4vw, 56px); align-items: start; }
.cs-result__text{ margin-top: 14px; max-width: 56ch; color: var(--lg-text); font-size: 1.0625rem; line-height: 1.6; }
.cs-limits{ padding: 20px 22px; border-radius: var(--lg-radius-lg); background: var(--lg-warn-dim); border: 1px solid rgba(255, 181, 71, 0.28); }
.cs-limits h3{ display: flex; gap: 10px; align-items: center; font-size: 1rem; }
.cs-limits h3 .ico{ color: var(--lg-warn); }
.cs-limits--info{ background: var(--lg-info-dim); border-color: var(--lg-info-line); }
.cs-limits--info h3 .ico{ color: var(--lg-info); }
.cs-limits ul{ display: grid; gap: 8px; margin-top: 12px; }
.cs-limits li{ position: relative; padding-left: 16px; color: var(--lg-text); font-size: 0.9375rem; }
.cs-limits li::before{ content: ""; position: absolute; left: 0; top: 0.6em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.5; }
.pcards{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 6vh, 64px); }
@media (max-width: 860px){
.pcards{ grid-template-columns: 1fr; }
}
.af{ --af-red: #E3112F; --af-navy: #1E3B8B; --af-ink: #121418; --af-muted: #5C636E; --af-bg: #F5F7FB; color: var(--af-ink); }
.af small{ display: block; color: var(--af-muted); font-size: 0.74em; }
.af--desk{ font-size: calc(100cqi / 30); height: 100%; overflow: hidden; display: grid; grid-template-columns: 2.6em minmax(0, 1fr); background: var(--af-bg); }
.af__rail{ display: grid; align-content: start; justify-items: center; gap: 0.55em; padding: 0.7em 0; background: var(--af-navy); color: #C6D0EA; }
.af__rail span{ display: grid; place-items: center; width: 1.7em; height: 1.7em; border-radius: 0.45em; }
.af__rail span.is-on{ background: rgba(255, 255, 255, 0.16); color: #FFFFFF; }
.af__rail .ico{ width: 0.95em; height: 0.95em; }
.af__main{ display: grid; align-content: start; gap: 0.55em; padding: 0.85em 1.1em; }
.af__top{ display: flex; justify-content: space-between; align-items: center; gap: 1em; }
.af__top b{ font-size: 1.15em; color: var(--af-navy); }
.af__sub{ font-size: 0.74em; color: var(--af-muted); }
.af__rows{ display: grid; gap: 0.35em; }
.af__row{ display: grid; grid-template-columns: minmax(0, 1fr) auto 5.2em; gap: 0.8em; align-items: center; padding: 0.5em 0.75em; border-radius: 0.5em; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E7F0; font-size: 0.8em; }
.af__st{ justify-self: end; padding: 0.15em 0.55em; border-radius: 2em; font-size: 0.8em; font-weight: 700; }
.af__st--ok{ background: #E3F4EA; color: #1E6B45; }
.af__st--part{ background: #FFF1D6; color: #8A5300; }
.af__btn{ padding: 0.5em 0.95em; border-radius: 0.5em; background: var(--af-red); color: #FFFFFF; font-weight: 700; }
.af__ghost{ padding: 0.5em 0.95em; border-radius: 0.5em; box-shadow: inset 0 0 0 1px #C8D0E0; color: var(--af-navy); font-weight: 700; }
.af--ph{ background: var(--af-bg); }
.af__pt{ font-size: 1.05em; color: var(--af-navy); }
.af__pk{ display: flex; justify-content: space-between; align-items: center; gap: 0.5em; padding: 0.5em 0.6em; border-radius: 0.55em; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E7F0; font-size: 0.86em; }
.af__pkv{ font-weight: 800; color: var(--af-navy); }
.af__pkv--part{ color: #8A5300; }
.af__pbtn{ padding: 0.65em; border-radius: 0.55em; background: var(--af-red); color: #FFFFFF; font-weight: 700; text-align: center; font-size: 0.86em; }
.af-v{ --af-red: #E3112F; --af-navy: #1E3B8B; }
.af-card{ display: grid; gap: 0.6em; padding: 1.2em 1.3em; border-radius: 0.9em; background: #FFFFFF; color: #121418; box-shadow: 0 1.6em 3em -2em rgba(0, 0, 0, 0.5); border-top: 0.3em solid var(--af-navy); }
.af-card__h{ display: flex; justify-content: space-between; align-items: baseline; gap: 1em; }
.af-card__h b{ font-size: 1.1em; color: var(--af-navy); }
.af-card__h small,.af-card__sub{ color: #5C636E; font-size: 0.82em; }
.af-line{ display: grid; grid-template-columns: minmax(0, 1fr) auto 5.6em; gap: 0.8em; align-items: center; padding-top: 0.55em; border-top: 1px solid #EDEFF2; }
.af-line small{ display: block; color: #5C636E; font-size: 0.82em; }
.af-line--doc{ grid-template-columns: minmax(0, 1fr) auto; }
.af-unit{ font-weight: 700; }
.af-st{ display: inline-flex; align-items: center; gap: 0.3em; justify-self: end; padding: 0.2em 0.6em; border-radius: 2em; font-size: 0.8em; font-weight: 700; }
.af-st--ok{ background: #E3F4EA; color: #1E6B45; }
.af-st--part{ background: #FFF1D6; color: #8A5300; }
.af-sum{ display: flex; justify-content: space-between; padding-top: 0.6em; border-top: 2px solid var(--af-navy); font-size: 1.05em; }
.af-card__note{ display: flex; gap: 0.45em; align-items: flex-start; padding: 0.55em 0.7em; border-radius: 0.5em; background: #EEF2FA; color: #2A3A5E; font-size: 0.86em; }
.af-card__note .ico{ flex: none; margin-top: 0.15em; color: var(--af-navy); }
.af-tbl{ width: 100%; border-collapse: collapse; font-size: 0.92em; }
.af-tbl th,.af-tbl td{ padding: 0.45em 0.4em; border-top: 1px solid #EDEFF2; text-align: left; }
.af-tbl thead th{ border-top: 0; color: #5C636E; font-weight: 600; font-size: 0.86em; }
.af-tbl td:last-child,.af-tbl th:last-child{ text-align: right; }
.af-tbl b{ color: var(--af-red); }
.af-rule{ display: grid; gap: 0.25em; padding: 0.7em 0.8em; border-radius: 0.6em; background: #EEF2FA; }
.af-rule--warn{ background: #FFF1D6; }
.af-rule__k{ font: 600 0.72em var(--lg-font-mono); color: #5C636E; text-transform: uppercase; letter-spacing: 0.04em; }
.af-card__btns{ display: flex; gap: 0.6em; flex-wrap: wrap; }
@container (max-width: 430px){
.af-line{ grid-template-columns: minmax(0, 1fr) auto; }
.af-line .af-st{ grid-column: 1 / -1; justify-self: start; }
}
.cs-flow{ padding-block: clamp(28px, 5vh, 48px); border-top: 1px solid var(--lg-border); }
.cs-flow__list{ display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.cs-flow__list li{ position: relative; display: grid; gap: 6px; align-content: start; padding: 16px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.cs-flow__icon{ display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: rgba(227, 17, 47, 0.14); color: #FF6B80; }
.cs-flow__list b{ font-size: 1rem; }
.cs-flow__list small{ color: var(--lg-text-muted); font-size: 0.875rem; }
.cs-flow__arrow{ position: absolute; right: -14px; top: 26px; z-index: 1; display: grid; place-items: center; width: 16px; color: var(--lg-lime); }
@media (max-width: 980px){
.cs-flow__list{ grid-template-columns: 1fr; }
.cs-flow__arrow{ right: auto; left: 34px; top: auto; bottom: -15px; transform: rotate(90deg); }
}
.pk-value{ padding-block: clamp(48px, 8vh, 80px); border-top: 1px solid var(--lg-border); }
.pk-value__grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 26px; }
.pk-value__grid li{ display: grid; gap: 8px; align-content: start; padding: 20px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.pk-value__icon{ display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: var(--lg-ok-dim); color: var(--lg-ok); }
.pk-value__grid h3{ font-size: 1.0625rem; }
.pk-value__grid p{ color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.5; }
@media (max-width: 980px){
.pk-value__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
.pk-value__grid{ grid-template-columns: 1fr; }
}
.pk-start{ display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.2fr); gap: 16px 20px; align-items: center; margin-top: 26px; padding: 18px 22px; border-radius: var(--lg-radius-lg); background: linear-gradient(100deg, var(--lg-lime-dim), rgba(204, 255, 0, 0.02) 70%); border: 1px solid var(--lg-lime-line); }
.pk-start__icon{ display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--lg-lime); color: var(--lg-on-lime); }
.pk-start__t{ font-weight: 700; font-size: 1.0625rem; color: var(--lg-text); }
.pk-start__s{ margin-top: 4px; color: var(--lg-text-muted); font-size: 0.9375rem; }
.pk-start__list{ display: grid; gap: 6px; }
.pk-start__list li{ display: flex; gap: 10px; align-items: center; font-size: 0.9375rem; color: var(--lg-text); }
.pk-start__list .mono{ display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--lg-lime-line); color: var(--lg-lime); font-size: 0.75rem; }
.pk-start--compact{ grid-template-columns: auto minmax(0, 1fr); margin-top: 18px; }
@media (max-width: 860px){
.pk-start{ grid-template-columns: auto minmax(0, 1fr); }
.pk-start__list{ grid-column: 1 / -1; }
}
.pk__card{ grid-template-rows: auto auto auto auto 1fr auto auto; }
.pk__situation{ color: var(--lg-text); font-size: 0.9375rem; line-height: 1.5; min-height: 4.5em; }
.pk__price span{ font-size: 0.875rem; }
.pk__compare summary span{ display: inline-flex; gap: 10px; align-items: center; }
.pk__compare summary span .ico{ color: var(--lg-info); }
.pk__more{ margin-top: 12px; }
.pk__more summary{ display: inline-flex; gap: 8px; align-items: center; padding: 6px 0; cursor: pointer; list-style: none; color: var(--lg-text); font-weight: 600; font-size: 0.9375rem; border-radius: 6px; }
.pk__more summary::-webkit-details-marker{ display: none; }
.pk__more summary:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.pk__more[open] summary .ico{ transform: rotate(180deg); }
.pk__more ul{ margin-top: 10px; }
@media (max-width: 980px){
.pk__situation{ min-height: 0; }
}
.pk-home{ padding-block: clamp(56px, 9vh, 96px); border-top: 1px solid var(--lg-border); }
.pk-home__grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.pk-mini{ position: relative; display: grid; grid-template-rows: auto auto auto auto 1fr auto; gap: 10px; padding: 22px 20px 20px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border-strong); }
.pk-mini--rec{ border-color: var(--lg-lime-line); box-shadow: 0 0 0 1px var(--lg-lime-line); background: linear-gradient(180deg, rgba(204, 255, 0, 0.06), var(--lg-surface-1) 45%); }
.pk-mini .pk__badge{ left: 20px; }
.pk-mini__name{ font-size: 1.25rem; }
.pk-mini__fit{ color: var(--lg-text-muted); font-size: 0.9375rem; }
.pk-mini__price b{ font-size: 2rem; }
.pk-mini__list{ display: grid; gap: 6px; align-content: start; }
.pk-mini__list li{ display: grid; grid-template-columns: 16px 1fr; gap: 8px; font-size: 0.9375rem; }
.pk-mini__list .ico{ margin-top: 3px; color: var(--lg-ok); }
.pk-mini__btn{ justify-content: center; }
@media (max-width: 980px){
.pk-home__grid{ grid-template-columns: 1fr; max-width: 560px; }
}
.devs{ position: relative; align-items: flex-end; }
.devs::after{ content: ""; position: absolute; left: 6%; right: 6%; bottom: -4%; height: 9%; border-radius: 50%; background: radial-gradient(closest-side, rgba(10, 14, 20, 0.38), transparent); filter: blur(6px); z-index: 0; pointer-events: none; }
.mb,.ip{ position: relative; z-index: 1; }
.mb__lid{ padding: 1.9% 1.9% 2.4%; border-radius: 3.4% 3.4% 0.9% 0.9% / 5.4% 5.4% 1.4% 1.4%; background: #0A0A0B; box-shadow: inset 0 0 0 1px #3A3B3E, 0 0 0 1.5px #A9ADB3, 0 28px 40px -30px rgba(0, 0, 0, 0.55); }
.mb__lid::before{ top: 0; width: 7.5%; height: 1.6%; aspect-ratio: auto; border-radius: 0 0 0.6em 0.6em; background: #0A0A0B; box-shadow: none; z-index: 2; }
.mb__lid::after{ content: ""; position: absolute; left: 50%; top: 0.5%; width: 0.55%; aspect-ratio: 1; border-radius: 50%; background: #1E2632; box-shadow: inset 0 0 0 1px #2E3A48; transform: translateX(-50%); z-index: 3; }
.mb__screen{ border-radius: 0.5%; }
.mb__base{ width: 112%; margin-left: -6%; padding-bottom: 2.6%; border-radius: 0.4% 0.4% 42% 42% / 10% 10% 100% 100%; background: linear-gradient(180deg, #E8EAED 0%, #CFD2D6 46%, #A6AAB0 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 10px 18px -12px rgba(0, 0, 0, 0.5); }
.mb__base::before{ top: 0; width: 13%; height: 38%; border-radius: 0 0 0.5em 0.5em; background: linear-gradient(180deg, #B4B8BE, #C9CCD1); }
.ip{ padding: 2.2%; border-radius: 15.5% / 7.2%; background: linear-gradient(145deg, #3A3B3F, #1C1D1F 40%, #2A2B2E); box-shadow: inset 0 0 0 1.2px #5A5C61, inset 0 0 0 3px #111214, 0 30px 44px -28px rgba(0, 0, 0, 0.65); }
.ip::before,.ip::after{ content: ""; position: absolute; width: 1.6%; border-radius: 2px; background: #3A3B3F; }
.ip::before{ left: -1.2%; top: 18%; height: 7%; box-shadow: 0 260% 0 #3A3B3F; }
.ip::after{ right: -1.2%; top: 26%; height: 11%; }
.ip__screen{ border-radius: 13.5% / 6.2%; }
.ip__island{ top: 1.6%; width: 30%; height: 3.6%; }
.cs-hero__visual{ margin-top: clamp(24px, 4vh, 40px); }
@keyframes cg-draw{ from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.cs-logo{ margin: 16px 0 6px; }
.cs-logo img{ display: block; width: clamp(180px, 22vw, 280px); height: auto; filter: invert(1); }
.cs-status--role{ background: rgba(237, 239, 242, 0.05); border-color: var(--lg-border-strong); }
.cs-status--role .ico{ color: var(--lg-text-muted); }
.cs-visible{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.cs-visible__list{ display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px; margin-top: 26px; }
.cs-visible__list li{ display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; padding: 18px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.cs-visible__icon{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--lg-info-dim); color: var(--lg-info); }
.cs-visible h3{ font-size: 1.0625rem; }
.cs-visible p{ margin-top: 4px; color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.cs-arch__h{ margin: 10px 0 14px; font-size: 1.125rem; }
.arch2{ position: relative; display: grid; gap: 10px; }
.arch2::before{ content: ""; position: absolute; left: 9px; top: 18px; bottom: 18px; width: 2px; background: linear-gradient(180deg, var(--lg-lime), var(--lg-text-faint)); }
.arch2__node{ position: relative; display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 12px 14px 12px 34px; border-radius: 10px; background: var(--lg-surface-1); border: 1px solid var(--lg-border-strong); }
.arch2__node b{ grid-column: 1; }
.arch2__node > span:not(.arch2__dot){ grid-column: 1; color: var(--lg-text-muted); font-size: 0.875rem; }
.arch2__dot{ position: absolute; left: 4px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--lg-lime); box-shadow: 0 0 0 4px var(--lg-bg); }
.arch2__tag{ grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 3px 8px; border-radius: 99px; font: 500 0.6875rem var(--lg-font-mono); font-style: normal; white-space: nowrap; }
.arch2__tag--done{ background: var(--lg-ok-dim); color: var(--lg-ok); }
.arch2__node--future{ border-style: dashed; background: transparent; }
.arch2__node--future .arch2__dot{ background: var(--lg-surface-3); box-shadow: 0 0 0 4px var(--lg-bg), inset 0 0 0 2px var(--lg-text-faint); }
.arch2__node--future .arch2__tag{ background: rgba(237, 239, 242, 0.06); color: var(--lg-text-muted); }
@media (max-width: 560px){
.arch2__node{ grid-template-columns: 1fr; }
.arch2__tag{ grid-column: 1; grid-row: auto; justify-self: start; margin-top: 6px; }
}
.case--fashion .cs-hero{ background: #EFE8E3; color: #1E1A17; }
.case--fashion .cs-hero .cs-logo img{ filter: none; }
.case--fashion .cs-hero .cs-hero__type{ color: #6B5D53; }
.case--fashion .cs-hero .proj-hero__summary{ color: #3B322C; }
.case--fashion .cs-hero .proj-facts,.case--fashion .cs-hero .proj-facts div{ border-color: rgba(30, 26, 23, 0.14); }
.case--fashion .cs-hero .proj-facts dt{ color: #635449; }
.case--fashion .cs-hero .proj-facts dd,.case--fashion .cs-hero .proj-facts a{ color: #1E1A17; }
.case--fashion .cs-hero .badge{ color: #3B322C; box-shadow: inset 0 0 0 1px rgba(30, 26, 23, 0.2); background: transparent; }
.case--fashion .cs-hero .badge i{ background: #B4563E; }
.case--fashion .cs-hero .cs-status--role{ background: rgba(255, 255, 255, 0.55); border-color: rgba(30, 26, 23, 0.12); color: #3B322C; }
.case--fashion .cs-hero .cs-status--role .ico{ color: #8A5A44; }
.case--fashion .cs-hero .cs-shotnote{ color: #635449; }
.cs-logo--raw img{ filter: none; width: clamp(200px, 24vw, 300px); border-radius: 6px; }
.af__markimg{ display: block; width: 1.6em; height: 1.6em; margin-bottom: 0.35em; border-radius: 0.2em; }
.af--ov .af__main{ grid-template-rows: auto auto 1fr; height: 100%; align-content: stretch; }
.af--ov .af__top{ align-items: baseline; }
.af--ov .af__sub{ font-size: 0.7em; color: var(--af-muted); }
.af__kpis{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.45em; }
.af__kpi{ display: grid; gap: 0.1em; padding: 0.55em 0.6em; border-radius: 0.5em; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E7F0; }
.af__kpi small{ font-size: 0.6em; }
.af__kpi b{ font-size: 1em; color: var(--af-navy); white-space: nowrap; }
.af__kpi em{ font-style: normal; font-size: 0.56em; color: var(--af-muted); }
.af__kpi em.af__warn{ color: #8A5300; }
.af--ov .af__rows{ align-content: start; }
.af--ov .af__row{ grid-template-columns: minmax(0, 1fr) auto; }
.af__st--new{ background: #E8EEFA; color: var(--af-navy); }
@container (max-width: 300px){
.af--ov{ font-size: calc(100cqi / 19); }
.af__kpis{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.af__kpi:nth-child(n + 3),.af--ov .af__row:nth-child(n + 2){ display: none; }
.af--ov .af__rail{ display: none; }
.af--ov.af--desk{ grid-template-columns: 1fr; }
}
.dirs{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.dirs__grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 26px; }
.dirs__grid li{ display: grid; gap: 8px; align-content: start; padding: 20px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.dirs__icon{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(227, 17, 47, 0.14); color: #FF6B80; }
.dirs__grid h3{ font-size: 1.0625rem; }
.dirs__grid p{ color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.dirs__ai{ grid-column: span 2; background: linear-gradient(120deg, var(--lg-violet-dim), var(--lg-surface-1) 60%) !important; border-color: rgba(183, 156, 255, 0.35) !important; }
.dirs__ai .dirs__icon{ background: var(--lg-violet-dim); color: var(--lg-violet); }
@media (max-width: 980px){
.dirs__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
.dirs__grid{ grid-template-columns: 1fr; }
.dirs__ai{ grid-column: auto; }
}
.ovw{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.ovw__grid{ display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 28px clamp(36px, 5vw, 80px); align-items: start; }
.ovw__grid .section-intro{ margin-top: 14px; }
.ovw__demo{ padding: 18px; border-radius: var(--lg-radius-lg); background: #F5F7FB; color: #121418; box-shadow: 0 30px 60px -40px rgba(0, 0, 0, 0.8); border-top: 4px solid #1E3B8B; }
.ovw__kpis{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ovw__kpi{ display: grid; gap: 2px; justify-items: start; padding: 10px 12px; border: 0; border-radius: 10px; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E7F0; font: inherit; text-align: left; color: #121418; cursor: pointer; transition: box-shadow var(--lg-dur-fast) var(--lg-ease), transform var(--lg-dur-fast) var(--lg-ease); }
.ovw__kpi small{ font-size: 0.75rem; color: #5C636E; }
.ovw__kpi b{ font-size: 1.25rem; color: #1E3B8B; white-space: nowrap; }
.ovw__kpi em{ font-style: normal; font-size: 0.75rem; color: #5C636E; }
.ovw__kpi:hover{ box-shadow: 0 0 0 1px #1E3B8B; transform: translateY(-1px); }
.ovw__kpi[aria-pressed="true"]{ box-shadow: 0 0 0 2px #E3112F; }
.ovw__kpi:focus-visible{ outline: none; box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px #1E3B8B; }
.ovw__panel{ display: grid; gap: 0; margin-top: 14px; padding: 14px 16px; border-radius: 10px; background: #FFFFFF; box-shadow: 0 0 0 1px #E3E7F0; }
.js .ovw__panel + .ovw__panel{ margin-top: 14px; }
.ovw__h{ font-weight: 700; color: #1E3B8B; margin-bottom: 6px; }
.ovw__row{ display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid #EDEFF2; font-size: 0.9375rem; }
.ovw__row small{ display: block; color: #5C636E; font-size: 0.8125rem; }
.ovw__row > span:last-child{ text-align: right; font-weight: 600; }
.ovw__row--more{ color: #5C636E; }
.ovw__sum{ display: flex; justify-content: space-between; padding-top: 10px; border-top: 2px solid #1E3B8B; }
.ovw__note{ display: flex; gap: 6px; align-items: flex-start; margin-top: 10px; padding: 8px 10px; border-radius: 8px; background: #EEF2FA; color: #2A3A5E; font-size: 0.875rem; }
.ovw__note .ico{ flex: none; margin-top: 2px; }
.ovw__demo-note{ margin-top: 10px; font-size: 0.6875rem; color: #5C636E; }
@media (prefers-reduced-motion: no-preference){
.js .ovw__panel.is-on{ animation: act-up 0.35s var(--lg-ease) both; }
}
@media (max-width: 980px){
.ovw__grid{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
.ovw__kpis{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ovw__row{ flex-direction: column; align-items: flex-start; gap: 2px; }
.ovw__row > span:last-child{ text-align: left; }
}
.ai{ padding-block: clamp(56px, 9vh, 96px); border-top: 1px solid var(--lg-border); background: radial-gradient(80% 60% at 80% 20%, rgba(183, 156, 255, 0.08), transparent 70%); }
.ai__grid{ display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 20px; margin-top: 28px; align-items: start; }
.ai__card{ padding: 18px 20px; border-radius: var(--lg-radius-lg); background: #FFFFFF; color: #121418; border-top: 4px solid #1E3B8B; }
.ai__h{ display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.ai__h b{ color: #1E3B8B; font-size: 1.0625rem; }
.ai__h .mono{ font-size: 0.75rem; color: #5C636E; }
.ai__tbl{ width: 100%; margin-top: 10px; border-collapse: collapse; font-size: 0.9375rem; }
.ai__tbl th,.ai__tbl td{ padding: 9px 6px; border-top: 1px solid #EDEFF2; text-align: left; }
.ai__tbl thead th{ border-top: 0; font-size: 0.75rem; font-weight: 600; color: #5C636E; }
.ai__tbl td:last-child,.ai__tbl th:last-child{ text-align: right; font-weight: 700; }
.ai__own td{ background: #F5F7FB; }
.ai__own:last-child td:last-child{ color: #E3112F; }
.ai__out{ margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: #FFF1D6; color: #5E3A00; font-size: 0.875rem; }
.ai__out-h{ display: flex; gap: 6px; align-items: center; font-weight: 700; margin-bottom: 4px; }
.ai__insight{ padding: 20px 22px; border-radius: var(--lg-radius-lg); background: linear-gradient(160deg, rgba(183, 156, 255, 0.16), var(--lg-surface-1) 70%); border: 1px solid rgba(183, 156, 255, 0.35); }
.ai__label{ font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--lg-violet); }
.ai__claim{ margin-top: 10px; font-size: 1.1875rem; line-height: 1.45; color: var(--lg-text); }
.ai__claim b{ color: var(--lg-violet); }
.ai__pts{ display: grid; gap: 10px; margin-top: 16px; }
.ai__pts li{ display: grid; grid-template-columns: 18px 1fr; gap: 10px; color: var(--lg-text-muted); font-size: 0.9375rem; }
.ai__pts .ico{ margin-top: 3px; color: var(--lg-violet); }
@media (max-width: 980px){
.ai__grid{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
.ai__tbl thead{ display: none; }
.ai__tbl,.ai__tbl tbody,.ai__tbl tr,.ai__tbl td{ display: block; }
.ai__tbl tr{ display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 8px 0; border-top: 1px solid #EDEFF2; }
.ai__tbl td{ padding: 0; border: 0; }
.ai__tbl td:nth-child(1){ font-weight: 600; }
.ai__tbl td:nth-child(2),.ai__tbl td:nth-child(3){ grid-column: 1; font-size: 0.8125rem; color: #5C636E; }
.ai__tbl td:nth-child(4){ grid-column: 2; grid-row: 1 / span 3; align-self: center; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .ai__grid[data-reveal]:not(.is-in) .ai__insight{ opacity: 0; transform: translateX(18px); }
.js.motion .ai__grid.is-in .ai__insight{ transition: opacity 0.6s var(--lg-ease) 0.3s, transform 0.6s var(--lg-ease) 0.3s; }
.js.motion .ai__grid[data-reveal]:not(.is-in) .ai__tbl tbody tr{ opacity: 0; }
.js.motion .ai__grid.is-in .ai__tbl tbody tr{ transition: opacity 0.4s var(--lg-ease); }
.js.motion .ai__grid.is-in .ai__tbl tbody tr:nth-child(2){ transition-delay: 0.1s; }
.js.motion .ai__grid.is-in .ai__tbl tbody tr:nth-child(3){ transition-delay: 0.2s; }
.js.motion .ai__grid.is-in .ai__tbl tbody tr:nth-child(4){ transition-delay: 0.3s; }
}
.rep{ padding-block: clamp(48px, 8vh, 88px); border-top: 1px solid var(--lg-border); }
.rep__grid{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 28px clamp(36px, 5vw, 80px); align-items: center; }
.rep__grid .section-intro{ margin-top: 14px; }
.rep__card{ padding: 18px 20px; border-radius: var(--lg-radius-lg); background: #FFFFFF; color: #121418; border-top: 4px solid #1E3B8B; }
.rep__h{ display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.rep__h b{ color: #1E3B8B; }
.rep__h .mono{ font-size: 0.75rem; color: #5C636E; }
.rep__kpis{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.rep__kpis span{ display: grid; gap: 2px; padding: 10px; border-radius: 8px; background: #F5F7FB; }
.rep__kpis small{ font-size: 0.75rem; color: #5C636E; }
.rep__kpis b{ font-size: 1.0625rem; color: #121418; }
.rep__sub{ margin: 14px 0 6px; font-size: 0.8125rem; font-weight: 700; color: #5C636E; }
.rep__bar{ display: grid; grid-template-columns: 11em 1fr auto; gap: 10px; align-items: center; padding: 6px 0; font-size: 0.9375rem; }
.rep__bar i{ height: 10px; border-radius: 99px; background: linear-gradient(90deg, #1E3B8B var(--w), #E8EEFA var(--w)); }
.rep__bar b{ min-width: 5.5em; text-align: right; }
@media (prefers-reduced-motion: no-preference){
.js.motion .rep__card[data-reveal]:not(.is-in) .rep__bar i{ background-size: 0 100%; }
.js.motion .rep__card[data-reveal] .rep__bar i{ background: linear-gradient(90deg, #1E3B8B, #1E3B8B) no-repeat 0 0 / var(--w) 100%, #E8EEFA; transition: background-size 0.9s var(--lg-ease) 0.2s; }
}
@media (max-width: 860px){
.rep__grid{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
.rep__kpis{ grid-template-columns: 1fr; }
.rep__bar{ grid-template-columns: 1fr auto; }
.rep__bar i{ grid-column: 1 / -1; grid-row: 2; }
}
.ovw__panel[hidden]{ display: none; }
.faq-topics{ display: grid; gap: 28px; }
.faq-topics__nav{ display: flex; flex-wrap: wrap; gap: 8px; }
.faq-topics__nav a{ display: inline-flex; gap: 6px; align-items: center; padding: 7px 12px; border-radius: 99px; border: 1px solid var(--lg-border-strong); color: var(--lg-text); text-decoration: none; font-size: 0.875rem; transition: border-color var(--lg-dur-fast) var(--lg-ease), color var(--lg-dur-fast) var(--lg-ease); }
.faq-topics__nav a .ico{ color: var(--lg-info); }
.faq-topics__nav a:hover{ border-color: var(--lg-lime); color: var(--lg-lime); }
.faq-topics__nav a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.faq-topics__group{ scroll-margin-top: 90px; }
.faq-topics__h{ display: flex; gap: 10px; align-items: center; padding-bottom: 6px; font-size: 1.0625rem; color: var(--lg-text); border-bottom: 1px solid var(--lg-border-strong); }
.faq-topics__h .ico{ color: var(--lg-info); }
.faq__next{ display: flex; gap: 8px; align-items: flex-start; color: var(--lg-text); }
.faq__next .ico{ flex: none; margin-top: 4px; color: var(--lg-lime); }
.vs__table,.pk__table,.ai__tbl{ overflow-wrap: normal; word-break: normal; hyphens: manual; }
@media (max-width: 760px){
.vs__table td{ display: grid; grid-template-columns: 1fr; gap: 2px; padding: 8px 10px; margin-top: 6px; border-radius: 8px; background: rgba(237, 239, 242, 0.04); }
.vs__table td::before{ font-size: 0.6875rem; letter-spacing: 0.04em; text-transform: uppercase; }
.vs__table tbody th{ font-size: 1rem; }
.pk__tablewrap{ overflow: visible; }
.pk__table{ min-width: 0; }
.pk__table thead{ display: none; }
.pk__table,.pk__table tbody,.pk__table tr,.pk__table th,.pk__table td{ display: block; }
.pk__table tr{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 12px 14px; border-top: 1px solid var(--lg-border); }
.pk__table tbody th{ grid-column: 1 / -1; width: auto; padding: 0 0 4px; border: 0; }
.pk__table td{ display: grid; gap: 2px; align-content: start; padding: 6px 8px; border: 0; border-radius: 8px; background: rgba(237, 239, 242, 0.04); font-size: 0.875rem; }
.pk__table td::before{ content: attr(data-label); font: 500 0.6875rem/1.3 var(--lg-font-mono); color: var(--lg-text-faint); }
.pk__table td:nth-of-type(2)::before{ color: var(--lg-lime); }
}
@media (max-width: 760px){
.cs-intro,.cs-contrib,.cs-visible,.ovw,.rep,.dirs,.pk-value,.scope,.vs,.plat,.cs-result{ padding-block: 40px; }
.ai,.pk,.pk-home{ padding-block: 48px; }
.cs-flow__list{ grid-template-columns: 1fr 1fr; gap: 10px; }
.cs-flow__list li{ padding: 12px; }
.cs-flow__list li:last-child{ grid-column: 1 / -1; }
.cs-flow__arrow{ display: none; }
.cs-flow__icon{ width: 32px; height: 32px; }
}
@media (max-width: 760px){
.vs__table tbody th{ width: auto; }
.faq-topics__nav{ flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; margin-inline: -16px; padding-inline: 16px; scrollbar-width: none; }
.faq-topics__nav::-webkit-scrollbar{ display: none; }
.faq-topics__nav a{ flex: none; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion :is(.cs-contrib__grid, .cs-visible__list, .dirs__grid, .pk-value__grid, .pk-home__grid) > li[data-reveal]:not(.is-in){ opacity: 0; transform: translateY(14px); }
.js.motion :is(.cs-contrib__grid, .cs-visible__list, .dirs__grid, .pk-value__grid, .pk-home__grid) > li.is-in{ transition: opacity 0.45s var(--lg-ease) calc(var(--i, 0) * 70ms), transform 0.5s var(--lg-ease) calc(var(--i, 0) * 70ms); }
.js.motion .imp[data-reveal]:not(.is-in) .imp__now{ opacity: 0; transform: translateX(-12px); background: rgba(237, 239, 242, 0.03); }
.js.motion .imp[data-reveal]:not(.is-in) .imp__arrow{ opacity: 0; }
.js.motion .imp.is-in .imp__now{ transition: opacity 0.4s var(--lg-ease), transform 0.45s var(--lg-ease), background-color 0.6s var(--lg-ease); transition-delay: calc(0.25s + var(--i) * 0.22s); }
.js.motion .imp.is-in .imp__arrow{ transition: opacity 0.3s var(--lg-ease) calc(0.1s + var(--i) * 0.22s); }
.js.motion .imp.is-in .imp__was{ transition: opacity 0.6s var(--lg-ease) calc(0.4s + var(--i) * 0.22s); opacity: 0.75; }
.js.motion .cs-flow__list[data-reveal]:not(.is-in) li{ opacity: 0; transform: translateY(10px); }
.js.motion .cs-flow__list.is-in li{ transition: opacity 0.4s var(--lg-ease) calc(var(--i) * 0.16s), transform 0.45s var(--lg-ease) calc(var(--i) * 0.16s); }
.js.motion .cs-flow__list[data-reveal]:not(.is-in) .cs-flow__arrow{ transform: scaleX(0); }
.js.motion .cs-flow__list.is-in .cs-flow__arrow{ transition: transform 0.3s var(--lg-ease-draw) calc(0.2s + var(--i) * 0.16s); transform-origin: left; }
.js.motion .arch2[data-reveal]:not(.is-in)::before{ transform: scaleY(0); }
.js.motion .arch2.is-in::before{ transition: transform 0.9s var(--lg-ease-draw); transform-origin: top; }
.js.motion .arch2[data-reveal]:not(.is-in) .arch2__node{ opacity: 0; transform: translateX(10px); }
.js.motion .arch2.is-in .arch2__node{ transition: opacity 0.4s var(--lg-ease) calc(var(--i) * 0.14s), transform 0.45s var(--lg-ease) calc(var(--i) * 0.14s); }
.pk__card,.pk-mini{ transition: transform var(--lg-dur-base) var(--lg-ease), border-color var(--lg-dur-base) var(--lg-ease), box-shadow var(--lg-dur-base) var(--lg-ease); }
@media (hover: hover){
.pk__card:hover,.pk-mini:hover{ transform: translateY(-3px); border-color: var(--lg-lime-line); }
.cs-visible__list li:hover .cs-visible__icon,.dirs__grid li:hover .dirs__icon,.cs-contrib__grid li:hover .cs-contrib__icon{ transform: scale(1.06); }
}
.cs-visible__icon,.dirs__icon,.cs-contrib__icon{ transition: transform var(--lg-dur-base) var(--lg-ease-pop); }
}
.case--fashion .cs-hero .crumbs ol,.case--fashion .cs-hero .crumbs a{ color: #5E524A; }
.case--fashion .cs-hero .crumbs li[aria-current]{ color: #1E1A17; }
.case--fashion .cs-hero .crumbs a:hover{ color: #1E1A17; }
.mono{ font-family: var(--lg-font-body); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0; }
.code{ font-family: var(--lg-font-mono); }
span.section-head__label{ display: none; }
.cs-intro__task > span.section-head__label,.fit__col--imp > span.section-head__label{ display: block; font-family: var(--lg-font-body); font-size: 0.875rem; font-weight: 600; color: var(--lg-info); letter-spacing: 0; text-transform: none; margin-bottom: 6px; }
h2.section-head__label{ font-family: var(--lg-font-body); font-size: 1.0625rem; font-weight: 700; color: var(--lg-text); letter-spacing: 0; text-transform: none; }
.proj-facts dt,.cs-hero__type,.svc-hero__num,.cs-shotnote,.related__label,.ai__label{ font-family: var(--lg-font-body); letter-spacing: 0; text-transform: none; }
.cs-hero__type{ font-size: 0.9375rem; font-weight: 500; color: var(--lg-text-muted); }
.proj-facts dt{ font-size: 0.8125rem; font-weight: 500; }
.ip{ aspect-ratio: 71.6 / 147.6; padding: 3.2%; border-radius: 19% / 9.2%; background: linear-gradient(150deg, #4A4B50 0%, #222326 22%, #17181A 60%, #2E2F33 100%); box-shadow: inset 0 0 0 1px #6A6C72, inset 0 0 0 2.4px #0D0E10, 0 1px 0 rgba(255, 255, 255, 0.04), 0 34px 46px -30px rgba(8, 10, 14, 0.7); }
.ip__screen{ border-radius: 15.8% / 7.6%; }
.ip__island{ top: 1.8%; width: 31%; height: 3.4%; }
.ip::before{ left: -0.9%; top: 19%; width: 1.4%; height: 6.5%; box-shadow: 0 230% 0 #3A3B3F, 0 400% 0 #3A3B3F; }
.ip::after{ right: -0.9%; top: 27%; width: 1.4%; height: 10%; }
.mb__lid{ padding: 1.5% 1.5% 2.1%; border-radius: 3% 3% 0.8% 0.8% / 4.8% 4.8% 1.3% 1.3%; background: linear-gradient(180deg, #111214, #08090A); box-shadow: inset 0 0 0 1px #34363A, 0 0 0 1.2px #B8BCC2, 0 26px 40px -30px rgba(8, 10, 14, 0.6); }
.mb__screen{ border-radius: 0.6% 0.6% 0 0; overflow: hidden; }
.mb__base{ width: 114%; margin-left: -7%; padding-bottom: 2.4%; border-radius: 0.5% 0.5% 46% 46% / 12% 12% 100% 100%; background: linear-gradient(180deg, #EEF0F2 0%, #D4D7DB 40%, #A9ADB3 86%, #8E9298 100%); }
.mb__base::before{ width: 14%; height: 34%; border-radius: 0 0 0.6em 0.6em; background: linear-gradient(180deg, #A6AAB0, #C4C7CC); }
.devs::after{ left: 4%; right: 4%; bottom: -3%; height: 7%; background: radial-gradient(closest-side, rgba(8, 10, 14, 0.42), transparent); filter: blur(5px); }
.sym{ position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.sym svg{ position: absolute; inset: 0; width: 100%; height: 100%; }
.sym path{ fill: none; stroke: rgba(18, 20, 24, 0.14); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.sym__n{ position: absolute; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: rgba(18, 20, 24, 0.28); }
.sym__n--end{ width: 13px; height: 13px; margin: -6.5px 0 0 -6.5px; background: var(--lg-lime); box-shadow: 0 0 0 3px rgba(18, 20, 24, 0.75); }
html:not(.js) .cg__open{ display: none; }
.cg__bar{ display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.cg__bar .cs-shotnote{ margin: 0; }
.cg__open{ display: inline-flex; gap: 8px; align-items: center; padding: 8px 14px; border-radius: 99px; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-1); color: var(--lg-text); font: 600 0.875rem var(--lg-font-body); cursor: pointer; transition: border-color var(--lg-dur-fast) var(--lg-ease); }
.cg__open:hover{ border-color: var(--lg-lime); }
.cg__open:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
html.has-dialog{ overflow: hidden; }
dialog.gal,dialog.pkd{ padding: 0; border: 0; color: var(--lg-text); background: var(--lg-surface-1); border-radius: 16px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.8), 0 0 0 1px var(--lg-border-strong); }
dialog.gal::backdrop,dialog.pkd::backdrop{ background: rgba(6, 8, 10, 0.78); backdrop-filter: blur(4px); }
@media (prefers-reduced-motion: no-preference){
dialog.gal[open],dialog.pkd[open]{ animation: dlg-in 0.28s var(--lg-ease) both; }
dialog.gal[open]::backdrop,dialog.pkd[open]::backdrop{ animation: dlg-fade 0.28s var(--lg-ease) both; }
.gal__item:not([hidden]) img{ animation: dlg-fade 0.25s var(--lg-ease) both; }
}
@keyframes dlg-in{ from { opacity: 0; transform: translateY(14px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes dlg-fade{ from { opacity: 0; } to { opacity: 1; } }
.gal{ width: min(1180px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); }
.gal[open]{ display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.gal__top{ display: grid; grid-template-columns: 1fr auto auto; gap: 14px; align-items: center; padding: 12px 14px 12px 20px; border-bottom: 1px solid var(--lg-border); }
.gal__title{ font-weight: 700; }
.gal__count{ color: var(--lg-text-muted); font-size: 0.9375rem; font-variant-numeric: tabular-nums; }
.gal__close,.pkd__close,.gal__btn{ display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-2); color: var(--lg-text); cursor: pointer; }
.gal__close:hover,.pkd__close:hover,.gal__btn:hover{ border-color: var(--lg-lime); color: var(--lg-lime); }
.gal__close:focus-visible,.pkd__close:focus-visible,.gal__btn:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.gal__stage{ min-height: 0; overflow: auto; padding: 18px; background: #0A0C0F; touch-action: pan-y; }
.gal__item{ margin: 0; display: grid; gap: 10px; justify-items: center; }
.gal__item img{ display: block; max-width: 100%; height: auto; max-height: calc(100dvh - 260px); width: auto; border-radius: 8px; background: #FFFFFF; }
.gal__item--m img{ max-height: calc(100dvh - 250px); border-radius: 22px; box-shadow: 0 0 0 6px #1C1D20; }
.gal__item figcaption{ color: var(--lg-text-muted); font-size: 0.9375rem; text-align: center; }
.gal__nav{ display: flex; justify-content: center; align-items: center; gap: 18px; padding: 12px; border-top: 1px solid var(--lg-border); }
.gal__dots{ display: flex; gap: 6px; }
.gal__dots i{ width: 8px; height: 8px; border-radius: 50%; background: var(--lg-border-strong); transition: background var(--lg-dur-fast) var(--lg-ease), transform var(--lg-dur-fast) var(--lg-ease); }
.gal__dots i.is-on{ background: var(--lg-lime); transform: scale(1.25); }
@media (max-width: 560px){
.gal{ width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; }
.gal__stage{ padding: 12px; }
.gal__item img{ max-height: calc(100dvh - 214px); }
}
.pkd{ width: min(620px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); }
.pkd[open]{ display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.pkd__head{ display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 18px 18px 12px 24px; border-bottom: 1px solid var(--lg-border); }
.pkd__kicker{ color: var(--lg-text-muted); font-size: 0.875rem; }
.pkd__title{ font-size: 1.5rem; }
.pkd__body{ overflow: auto; padding: 18px 24px; display: grid; gap: 12px; align-content: start; }
.pkd__price{ color: var(--lg-text-muted); }
.pkd__price b{ color: var(--lg-text); font-size: 1.125rem; }
.pkd__gets{ color: var(--lg-text); line-height: 1.55; }
.pkd__h{ display: flex; gap: 8px; align-items: center; margin-top: 6px; font-size: 1rem; }
.pkd__h .ico{ color: var(--lg-ok); }
.pkd__h span{ margin-left: 4px; padding: 2px 8px; border-radius: 99px; background: var(--lg-info-dim); color: var(--lg-info); font-size: 0.75rem; font-weight: 600; }
.pkd__list{ display: grid; gap: 6px; }
.pkd__list li,.pkd__ex li{ position: relative; padding-left: 18px; color: var(--lg-text-muted); }
.pkd__list li::before{ content: ""; position: absolute; left: 2px; top: 0.62em; width: 6px; height: 6px; border-radius: 50%; background: var(--lg-ok); }
.pkd__ex{ padding: 14px 16px; border-radius: 12px; background: var(--lg-surface-2); border: 1px solid var(--lg-border); }
.pkd__ex .pkd__h{ margin-top: 0; }
.pkd__ex .pkd__h .ico{ color: var(--lg-info); }
.pkd__ex ol{ display: grid; gap: 6px; margin-top: 8px; counter-reset: ex; }
.pkd__ex li{ counter-increment: ex; padding-left: 26px; color: var(--lg-text); }
.pkd__ex li::before{ content: counter(ex); position: absolute; left: 0; top: 0.1em; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--lg-info-dim); color: var(--lg-info); font-size: 0.6875rem; font-weight: 700; }
.pkd__note{ margin-top: 8px; color: var(--lg-text-faint); font-size: 0.875rem; }
.pkd__foot{ display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; padding: 14px 24px 18px; border-top: 1px solid var(--lg-border); }
.pkd__back{ border: 0; background: none; cursor: pointer; font: inherit; }
@media (max-width: 560px){
.pkd{ width: 100vw; max-width: 100vw; max-height: 92dvh; margin: auto 0 0; border-radius: 16px 16px 0 0; }
}
.pk__more-btn{ display: inline-flex; gap: 8px; align-items: center; justify-self: start; padding: 6px 0; border: 0; background: none; color: var(--lg-info); font: 600 0.9375rem var(--lg-font-body); cursor: pointer; text-underline-offset: 3px; }
.pk__more-btn:hover{ text-decoration: underline; }
.pk__more-btn:focus-visible{ outline: none; box-shadow: var(--lg-focus); border-radius: 6px; }
html:not(.js) .pk__more-btn{ display: none; }
.pk__gets{ color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.pk__card{ grid-template-rows: auto auto auto auto 1fr auto auto auto; }
.pk-mini{ grid-template-rows: auto auto auto auto 1fr auto auto; }
.pk__after{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 18px; align-items: stretch; }
.pk__after .pk-start{ margin-top: 0; grid-template-columns: auto minmax(0, 1fr); align-content: start; }
.pk-start__list{ grid-column: 1 / -1; display: grid; gap: 6px; }
.pk-start__list li{ display: flex; gap: 8px; align-items: center; font-size: 0.9375rem; color: var(--lg-text); }
.pk-start__list .ico{ color: var(--lg-lime); flex: none; }
.pk-start--compact .pk-start__list{ grid-column: 2; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.pk-report{ padding: 18px 20px; border-radius: var(--lg-radius-lg); background: #F5F7FA; color: #121418; }
.pk-report__head{ display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.pk-report__t{ display: flex; gap: 8px; align-items: center; font-weight: 700; }
.pk-report__m{ color: #5C636E; font-size: 0.8125rem; }
.pk-report__rows{ display: grid; gap: 0; margin: 10px 0 0; }
.pk-report__rows div{ display: grid; grid-template-columns: 8.5em 1fr; gap: 10px; padding: 8px 0; border-top: 1px solid #E3E6EA; font-size: 0.9375rem; }
.pk-report__rows dt{ font-weight: 700; }
.pk-report__rows dd{ margin: 0; color: #3B414B; }
.pk-report__used{ display: flex; gap: 6px; align-items: center; margin-top: 8px; padding-top: 8px; border-top: 2px solid #121418; font-size: 0.875rem; font-weight: 600; }
@media (max-width: 860px){
.pk__after{ grid-template-columns: 1fr; }
.pk-start--compact .pk-start__list{ grid-column: 1 / -1; }
}
@media (max-width: 480px){
.pk-report__rows div{ grid-template-columns: 1fr; gap: 2px; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .pk-report[data-reveal]:not(.is-in) .pk-report__rows div{ opacity: 0; transform: translateX(-8px); }
.js.motion .pk-report.is-in .pk-report__rows div{ transition: opacity 0.35s var(--lg-ease) calc(var(--i) * 0.12s), transform 0.4s var(--lg-ease) calc(var(--i) * 0.12s); }
}
.gal__item[hidden]{ display: none; }
.pkd__list,.pkd__ex ol{ margin: 0; padding: 0; list-style: none; }
.pkd__h{ margin-bottom: 0; }
.gal__stage{ display: grid; align-content: center; }
.ways{ display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; width: 100%; }
.ways a{ display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 12px; align-items: center; min-height: 48px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--lg-border); color: var(--lg-text); text-decoration: none; transition: border-color var(--lg-dur-fast) var(--lg-ease), background-color var(--lg-dur-fast) var(--lg-ease); }
.ways a:hover{ border-color: var(--lg-lime); }
.ways a:active{ background: var(--lg-surface-3); }
.ways a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.ways .ico{ color: var(--lg-lime); }
.ways span{ display: grid; line-height: 1.25; }
.ways b{ font-weight: 600; font-size: 0.9375rem; font-variant-numeric: tabular-nums; }
.ways small{ color: var(--lg-text-faint); font-size: 0.8125rem; }
.ways--compact{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 420px){
.ways--compact{ grid-template-columns: 1fr; }
}
.site-footer__top{ grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.8fr) minmax(260px, 1.1fr); }
.site-footer__brand p{ color: var(--lg-text-muted); }
.site-footer__contact{ display: grid; gap: 12px; align-content: start; }
.ways--footer a{ background: var(--lg-surface-1); }
@media (max-width: 1023px){
.site-footer__top{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.site-footer__brand,.site-footer__contact{ grid-column: 1 / -1; }
.ways--footer{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px){
.ways--footer{ grid-template-columns: 1fr; }
}
.ways b{ white-space: nowrap; }
.site-footer__label{ font-family: var(--lg-font-body); letter-spacing: 0; text-transform: none; font-size: 0.875rem; font-weight: 700; color: var(--lg-text); }
.cs-dec2{ display: grid; gap: clamp(20px, 3vw, 36px); margin: 28px 0 0; padding: 0; list-style: none; }
.cs-dec2__item{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(20px, 4vw, 56px); align-items: center; }
.cs-dec2__item:nth-child(even) .cs-dec2__text{ order: 2; }
.cs-dec2__item--text{ grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.cs-dec2__text{ display: grid; gap: 10px; align-content: center; }
.cs-dec2__n{ display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--lg-lime); color: #0D0F12; font-weight: 700; font-size: 0.875rem; }
.cs-dec2__text h3{ font-size: clamp(1.25rem, 1rem + 0.6vw, 1.5rem); line-height: 1.2; letter-spacing: -0.02em; }
.cs-dec2__text p{ color: var(--lg-text-muted); line-height: 1.65; max-width: 52ch; }
.cs-dec2__fig{ margin: 0; border-radius: 14px; overflow: hidden; border: 1px solid var(--lg-border); background: #FFFFFF; box-shadow: 0 30px 50px -36px rgba(0, 0, 0, 0.8); aspect-ratio: 16 / 10; }
.cs-dec2__fig img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
@media (max-width: 760px){
.cs-dec2__item{ grid-template-columns: 1fr; }
.cs-dec2__item:nth-child(even) .cs-dec2__text{ order: 0; }
}
.cs-live{ padding-block: clamp(48px, 7vh, 88px); border-top: 1px solid var(--lg-border); }
.cs-live__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 22px; }
.cs-live__card{ display: grid; gap: 14px; align-content: start; padding: clamp(20px, 2.4vw, 28px); border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.cs-live__card h3{ display: flex; gap: 8px; align-items: center; font-size: 1.0625rem; }
.cs-live__card h3 .ico{ color: var(--lg-lime); }
.cs-live__card p{ color: var(--lg-text-muted); line-height: 1.6; }
.cs-live__card .tech__chips{ margin: 0; }
.cs-live__state p{ color: var(--lg-text); font-size: 1.0625rem; }
.cs-live__site{ justify-self: start; display: inline-flex; gap: 6px; align-items: center; }
.cs-live__facts{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.cs-live__facts li{ display: grid; grid-template-columns: 6.5em minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid var(--lg-border); }
.cs-live__facts li:first-child{ border-top: 0; padding-top: 0; }
.cs-live__facts b{ color: var(--lg-lime); font-weight: 700; }
.cs-live__facts li:last-child span{ color: var(--lg-text); font-weight: 600; }
.cs-live__after{ margin-top: 16px; max-width: 70ch; color: var(--lg-text-muted); }
@media (max-width: 760px){
.cs-live__grid{ grid-template-columns: 1fr; }
}
.pk__after .pk-start{ grid-template-rows: auto auto 1fr; }
.pk-start__go{ grid-column: 1 / -1; align-self: end; justify-self: start; display: inline-flex; gap: 6px; align-items: center; margin-top: 8px; }
.ab-mission{ max-width: 28ch; margin-top: 18px; font-size: clamp(1.625rem, 1.1rem + 1.9vw, 2.75rem); line-height: 1.12; font-weight: 600; letter-spacing: -0.03em; color: var(--lg-text); }
.ab-cons{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: clamp(28px, 4vw, 44px) 0 0; padding: 0; list-style: none; }
.ab-cons li{ display: grid; gap: 8px; align-content: start; padding: 20px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.ab-cons__icon{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--lg-surface-2); color: var(--lg-lime); }
.ab-cons h2{ font-size: 1.125rem; letter-spacing: -0.01em; }
.ab-cons p{ color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.6; }
@media (max-width: 860px){
.ab-cons{ grid-template-columns: 1fr; }
}
.ab-eq{ padding-block: clamp(48px, 8vh, 96px); border-top: 1px solid var(--lg-border); }
.ab-eq__stage{ position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(40px, 0.5fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 18px 0; margin-top: 32px; }
.ab-eq__src,.ab-eq__end{ position: relative; z-index: 1; display: grid; gap: 10px; align-content: start; padding: 22px 24px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border-strong); background: var(--lg-surface-1); }
.ab-eq__src--1{ grid-column: 1; grid-row: 1; }
.ab-eq__src--2{ grid-column: 1; grid-row: 2; }
.ab-eq__end{ grid-column: 3; grid-row: 1 / span 2; align-self: center; border-color: var(--lg-lime); background: linear-gradient(160deg, rgba(212, 255, 58, 0.08), var(--lg-surface-1) 60%); }
.ab-eq__src h3,.ab-eq__end h3{ font-size: 1.25rem; letter-spacing: -0.02em; }
.ab-eq__src ul,.ab-eq__end ul{ display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; color: var(--lg-text-muted); }
.ab-eq__src li::before{ content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 10px 2px 0; border-radius: 50%; background: var(--lg-text-faint); }
.ab-eq__end li{ display: flex; gap: 8px; align-items: center; color: var(--lg-text); }
.ab-eq__end li .ico{ color: var(--lg-lime); }
.ab-eq__node{ position: absolute; right: -6px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--lg-text-muted); box-shadow: 0 0 0 4px var(--lg-bg, #0D0F12); }
.ab-eq__node--end{ right: auto; left: -8px; width: 16px; height: 16px; margin-top: -8px; background: var(--lg-lime); }
@media (max-width: 760px){
.ab-eq__stage{ grid-template-columns: 1fr; grid-template-rows: none; gap: 28px; }
.ab-eq__src--1,.ab-eq__src--2,.ab-eq__end{ grid-column: 1; grid-row: auto; }
.ab-eq__node{ right: auto; left: 50%; top: auto; bottom: -6px; margin: 0 0 0 -6px; }
.ab-eq__node--end{ top: -8px; bottom: auto; margin: 0 0 0 -8px; }
.ab-eq__src--2::after{ content: "→"; position: absolute; left: 50%; bottom: -26px; transform: translateX(-50%) rotate(90deg); color: var(--lg-lime); font-weight: 700; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .ab-eq__stage[data-reveal]:not(.is-in) .ab-eq__end{ opacity: 0; transform: translateX(-10px); }
.js.motion .ab-eq__stage.is-in .ab-eq__end{ transition: opacity 0.5s var(--lg-ease) 0.8s, transform 0.5s var(--lg-ease) 0.8s; }
}
.ab-story{ padding-block: clamp(40px, 6vh, 72px); border-top: 1px solid var(--lg-border); }
.ab-story__list{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: ch; }
.ab-story__ch{ display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px 16px; align-content: start; padding: 24px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.ab-story__icon{ grid-row: 1 / span 3; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--lg-surface-2); color: var(--lg-lime); }
.ab-story__ch h3{ font-size: 1.25rem; letter-spacing: -0.02em; align-self: center; }
.ab-story__ch > p{ color: var(--lg-text-muted); line-height: 1.6; }
.ab-story__ch ul{ display: grid; gap: 6px; margin: 4px 0 0; padding: 0; list-style: none; }
.ab-story__ch li{ display: flex; gap: 8px; align-items: flex-start; font-size: 0.9375rem; }
.ab-story__ch li .ico{ flex: none; margin-top: 3px; color: var(--lg-ok); }
@media (max-width: 860px){
.ab-story__list{ grid-template-columns: 1fr; }
}
@media (max-width: 480px){
.ab-story__ch{ grid-template-columns: 1fr; }
.ab-story__icon{ grid-row: auto; }
}
.ab-dir{ padding-block: clamp(48px, 8vh, 96px); border-top: 1px solid var(--lg-border); }
.ab-dir__ui{ margin-top: 28px; }
.ab-dir__tabs{ display: none; }
.ab-dir__ui.is-ready .ab-dir__tabs{ display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.ab-dir__tab{ display: inline-flex; gap: 8px; align-items: center; min-height: 48px; padding: 10px 18px; border-radius: 99px; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-1); color: var(--lg-text); font: 600 1rem var(--lg-font-body); cursor: pointer; transition: border-color var(--lg-dur-fast) var(--lg-ease), background-color var(--lg-dur-fast) var(--lg-ease), transform 0.08s linear; }
.ab-dir__tab:hover{ border-color: var(--lg-lime); }
.ab-dir__tab:active{ transform: scale(0.97); }
.ab-dir__tab[aria-pressed="true"]{ background: var(--lg-lime); border-color: var(--lg-lime); color: #0D0F12; }
.ab-dir__tab:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.ab-dir__panel{ display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(20px, 4vw, 56px); align-items: center; padding: clamp(20px, 3vw, 36px); border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.ab-dir__panel + .ab-dir__panel{ margin-top: 16px; }
.ab-dir__ui.is-ready .ab-dir__panel + .ab-dir__panel{ margin-top: 0; }
.ab-dir__panel[hidden]{ display: none; }
.ab-dir__text{ display: grid; gap: 12px; }
.ab-dir__text h3{ display: flex; gap: 10px; align-items: center; font-size: 1.5rem; letter-spacing: -0.02em; }
.ab-dir__text h3 .ico{ color: var(--lg-lime); }
.ab-dir__text p{ color: var(--lg-text-muted); line-height: 1.65; max-width: 48ch; }
.ab-dir__ui.is-ready .ab-dir__text h3{ display: none; }
.ab-dir__art{ position: relative; min-height: 240px; display: grid; place-items: center; padding: 20px; border-radius: 14px; background: #F5F7FA; color: #121418; }
.ab-dir__art::before{ content: "Пример"; position: absolute; top: 10px; right: 12px; font-size: 0.75rem; font-weight: 600; color: #6B7280; }
@media (max-width: 760px){
.ab-dir__panel{ grid-template-columns: 1fr; }
.ab-dir__tab{ flex: 1 1 calc(50% - 8px); justify-content: center; }
}
@media (prefers-reduced-motion: no-preference){
.ab-dir__panel.is-on .dv > *{ animation: dv-in 0.4s var(--lg-ease) both; }
.ab-dir__panel.is-on .dv li{ animation: dv-in 0.35s var(--lg-ease) both; animation-delay: calc(var(--d, 0) * 1ms); }
.ab-dir__panel.is-on .dv li:nth-child(2){ --d: 90; }
.ab-dir__panel.is-on .dv li:nth-child(3){ --d: 180; }
.ab-dir__panel.is-on .dv li:nth-child(4){ --d: 270; }
}
@keyframes dv-in{ from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.dv{ width: 100%; max-width: 420px; }
.dv__h{ font-weight: 700; margin-bottom: 10px; }
.dv ul{ display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dv--analiz li{ display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; background: #FFFFFF; border: 1px solid #E3E6EA; }
.dv--analiz li::before{ content: ""; flex: none; width: 16px; height: 16px; border-radius: 5px; border: 2px solid #9AA1AC; }
.dv--analiz li.is-ok::before{ border-color: #1F8A4C; background: #1F8A4C; box-shadow: inset 0 0 0 2px #FFFFFF; }
.dv__out{ display: flex; gap: 6px; align-items: center; margin-top: 12px; font-weight: 600; font-size: 0.9375rem; }
.dv--dizain{ display: grid; grid-template-columns: 1fr 88px; gap: 18px; align-items: end; }
.dv__page,.dv__phone{ display: grid; gap: 8px; padding: 10px; border-radius: 10px; background: #FFFFFF; border: 1px solid #D5D9DF; }
.dv__phone{ border-radius: 16px; padding: 8px; border: 3px solid #1C1D20; }
.dv__page > i,.dv__phone > i,.dv__grid i{ display: block; height: 10px; border-radius: 4px; background: #E3E6EA; }
.dv i.dv__bar{ height: 8px; background: #C9CED6; }
.dv i.dv__hero{ height: 64px; background: linear-gradient(135deg, #DCE3EC, #EEF1F5); }
.dv__phone i.dv__hero{ height: 48px; }
.dv__grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.dv__grid i{ height: 40px; }
.dv i.dv__cta{ width: 40%; height: 16px; background: #C5F02C; }
.dv__phone i.dv__cta{ width: 70%; }
.dv--razrabotka .code{ margin: 0; padding: 16px 18px; border-radius: 10px; background: #0F1216; color: #D7DEE8; font: 0.8125rem/1.6 var(--lg-font-mono); white-space: pre; overflow-x: auto; }
.dv--razrabotka .code b{ color: #C5F02C; font-weight: 500; }
.dv--razrabotka .code i{ color: #7FD1FF; font-style: normal; }
.dv--razrabotka .code .c{ color: #7D8794; }
.dv--proverka li{ display: flex; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 10px; background: #FFFFFF; border: 1px solid #E3E6EA; font-size: 0.9375rem; }
.dv__ok,.dv__warn{ display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; background: #E3F4EA; color: #1F8A4C; }
.dv__warn{ background: #FFF1D6; color: #9A5B00; }
.ab-founder__grid{ display: grid; grid-template-columns: 300px minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 24px clamp(28px, 4vw, 56px); align-items: end; padding-top: clamp(40px, 6vh, 72px); }
.ab-founder .founder__figure{ grid-area: auto; width: 300px; margin: 0; }
@media (max-width: 1100px){
.ab-founder__grid{ grid-template-columns: 240px minmax(0, 1fr); }
.ab-founder .founder__figure{ width: 240px; }
}
@media (max-width: 680px){
.ab-founder__grid{ grid-template-columns: 1fr; }
.ab-founder .founder__figure{ width: 200px; order: 3; }
}
.partner-note{ display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-2); font-size: 0.9375rem; line-height: 1.5; color: var(--lg-text-muted); }
.partner-note b{ color: var(--lg-text); }
.partner-note .ico{ flex: none; margin-top: 2px; color: var(--lg-lime); }
.svc-tech .partner-note{ margin-top: 14px; max-width: 56ch; }
.pk-start{ background: var(--lg-surface-1); border: 1px solid var(--lg-border); box-shadow: none; }
.pk-start__icon{ border-radius: 12px; background: var(--lg-surface-2); border: 1px solid var(--lg-border-strong); color: var(--lg-lime); }
.pk-mini--rec{ background: var(--lg-surface-1); }
.dirs__ai{ background: var(--lg-surface-1) !important; }
.ai{ background: none; }
.ai__insight{ background: var(--lg-surface-1); }
.ab-eq__end{ background: var(--lg-surface-1); }
@media (prefers-reduced-motion: no-preference){
.js.motion .rv:not(.is-in){ opacity: 0; translate: 0 14px; }
.js.motion .rv.is-in{ transition: opacity 0.5s var(--lg-ease), translate 0.6s var(--lg-ease); }
.js.motion .rv-kids:not(.is-in) > *{ opacity: 0; translate: 0 16px; }
.js.motion .rv-kids.is-in > *{ transition: opacity 0.45s var(--lg-ease) calc(var(--rv-i, 0) * 60ms), translate 0.55s var(--lg-ease) calc(var(--rv-i, 0) * 60ms); }
.js.motion .page-head__lead.rv.is-in,.js.motion .ab-mission.rv.is-in{ transition-delay: 80ms; }
:is(.lg-btn, .choice > span, .ab-dir__tab, .gal__btn, .gal__close, .pkd__close, .cg__open, .pk__more-btn, .ways a, .faq__q, .faq-topics__nav a, .svc-pager__link, .mnav__link, .nav__link){ transition-property: background-color, border-color, color, box-shadow, transform, scale, translate; }
:is(.lg-btn, .ab-dir__tab, .gal__btn, .gal__close, .pkd__close, .cg__open, .ways a, .choice > span):active{ scale: 0.97; transition-duration: 60ms; }
@media (hover: hover) and (pointer: fine){
:is(.svc-card, .pcard, .related, .next-proj__link, .tg__item, .ab-story__ch, .ab-cons li, .pk__card, .pk-mini, .cs-live__card){ transition: translate 0.25s var(--lg-ease), box-shadow 0.25s var(--lg-ease), border-color 0.2s var(--lg-ease); }
:is(.svc-card, .pcard, .related, .next-proj__link, .pk__card, .pk-mini):hover{ translate: 0 -3px; box-shadow: 0 18px 36px -24px rgba(0, 0, 0, 0.9); }
:is(.tg__item, .ab-story__ch, .ab-cons li, .cs-live__card):hover{ border-color: var(--lg-border-strong); }
:is(.lg-link, .pshow__more, .cs-live__site, .pk-start__go, .svx__more, .svc-card__link, .pcard__link, .related__go) .ico{ transition: translate 0.2s var(--lg-ease); }
:is(.lg-link, .pshow__more, .cs-live__site, .pk-start__go, .svx__more, .svc-card__link, .pcard__link, .related):hover .ico{ translate: 3px 0; }
.cs-live__site:hover .ico,.related:hover .related__go .ico{ translate: 2px -2px; }
}
dialog.gal[data-dir="next"] .gal__item:not([hidden]) img{ animation: gal-next 0.32s var(--lg-ease) both; }
dialog.gal[data-dir="prev"] .gal__item:not([hidden]) img{ animation: gal-prev 0.32s var(--lg-ease) both; }
dialog.gal[open] .gal__item:not([hidden]) figcaption{ animation: dlg-fade 0.4s var(--lg-ease) 0.08s both; }
.gal__dots i{ transition: background 0.2s var(--lg-ease), scale 0.25s var(--lg-ease-pop); }
.ab-dir__panel.is-on{ animation: dv-in 0.35s var(--lg-ease) both; }
@view-transition{ navigation: auto; }
.site-header{ view-transition-name: site-header; }
::view-transition-old(root){ animation: vt-out 0.18s ease both; }
::view-transition-new(root){ animation: vt-in 0.32s var(--lg-ease) both; }
}
@keyframes gal-next{ from { opacity: 0; translate: 24px 0; scale: 0.985; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes gal-prev{ from { opacity: 0; translate: -24px 0; scale: 0.985; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes vt-out{ to { opacity: 0; } }
@keyframes vt-in{ from { opacity: 0; translate: 0 8px; } }
.is-paused .gal__item img{ animation: none !important; }
.wg{ padding-block: clamp(56px, 9vh, 104px); border-top: 1px solid var(--lg-border); }
.wg__ui{ display: grid; grid-template-columns: minmax(200px, 0.55fr) auto minmax(0, 1.45fr); gap: 20px; align-items: center; margin-top: 28px; }
.wg__paper{ margin: 0; padding: 18px 20px 22px; border-radius: 4px; background: #F3EEE2; color: #2B2620; box-shadow: 0 1px 0 #E2DBCB, 0 20px 36px -26px rgba(0, 0, 0, 0.9); rotate: -1.5deg; }
.wg__paper figcaption{ margin-bottom: 10px; font-size: 0.75rem; font-weight: 700; color: #7A6F5E; }
.wg__hand{ font: 500 1.0625rem/1.65 'Segoe Print', 'Bradley Hand', 'Comic Sans MS', cursive; background: repeating-linear-gradient(transparent 0 27px, #D9D0BC 27px 28px); }
.wg__hand b{ font-weight: 700; color: #1F3D8A; }
.wg__arrow{ display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--lg-surface-2); border: 1px solid var(--lg-border-strong); color: var(--lg-lime); }
.wg__app{ display: grid; gap: 14px; padding: clamp(18px, 2.4vw, 26px); border-radius: var(--lg-radius-lg); background: #F5F7FA; color: #121418; box-shadow: 0 30px 60px -40px rgba(0, 0, 0, 0.9); }
.wg__steps{ display: none; }
.wg__ui.is-ready .wg__steps{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.wg__step{ display: flex; gap: 8px; align-items: center; width: 100%; min-height: 44px; padding: 8px 10px; border-radius: 10px; border: 1px solid #DDE1E7; background: #FFFFFF; color: #3B414B; font: 600 0.8125rem/1.25 var(--lg-font-body); text-align: left; cursor: pointer; transition: border-color 0.15s, background-color 0.15s, color 0.15s; }
.wg__step:hover{ border-color: #9AA1AC; }
.wg__step:focus-visible{ outline: none; box-shadow: 0 0 0 3px #1F3D8A; }
.wg__n{ display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; background: #E3E6EA; font-size: 0.75rem; }
.wg__step[aria-current="step"]{ border-color: #121418; color: #121418; }
.wg__step[aria-current="step"] .wg__n{ background: #121418; color: #FFFFFF; }
.wg__step.is-done .wg__n{ background: #1F8A4C; color: #FFFFFF; }
.wg__panel{ display: grid; gap: 12px; min-height: 170px; align-content: start; }
.wg__panel + .wg__panel{ padding-top: 14px; border-top: 1px solid #E3E6EA; }
.wg__ui.is-ready .wg__panel + .wg__panel{ padding-top: 0; border-top: 0; }
.wg__panel[hidden]{ display: none; }
.wg__h{ font-size: 1.0625rem; }
.wg__ui.is-ready .wg__h{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.wg__kv{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.wg__kv div{ display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: #FFFFFF; border: 1px solid #E3E6EA; }
.wg__kv dt{ font-size: 0.75rem; font-weight: 600; color: #5C636E; }
.wg__kv dd{ margin: 0; font-size: 0.9375rem; font-variant-numeric: tabular-nums; }
.wg__kv dd small{ display: block; color: #5C636E; font-size: 0.75rem; }
.wg__kv .wg__total{ border-color: #121418; }
.wg__kv .wg__total dd{ font-size: 1.25rem; font-weight: 700; }
.wg__scale{ display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 8px; align-items: center; }
.wg__scale span{ display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: #FFFFFF; border: 1px solid #E3E6EA; }
.wg__scale small{ font-size: 0.75rem; font-weight: 600; color: #5C636E; }
.wg__scale b{ font-size: 1.125rem; font-variant-numeric: tabular-nums; }
.wg__scale i{ font-style: normal; font-weight: 700; color: #5C636E; }
.wg__scale .wg__net{ border-color: #121418; }
.wg__src{ display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 0.8125rem; font-weight: 600; }
.wg__src li{ display: inline-flex; gap: 6px; align-items: center; padding: 6px 10px; border-radius: 99px; }
.wg__src .is-on{ background: #121418; color: #FFFFFF; }
.wg__src .is-future{ border: 1px dashed #9AA1AC; color: #5C636E; }
.wg__note{ display: flex; gap: 6px; align-items: center; font-size: 0.8125rem; color: #3B414B; }
.wg__confirm{ display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border-radius: 10px; background: #E3F4EA; color: #14532D; line-height: 1.5; }
.wg__confirm .ico{ flex: none; margin-top: 2px; }
.wg__bar{ display: none; }
.wg__ui.is-ready .wg__bar{ display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; padding-top: 4px; }
.wg__play{ --_h: 44px; color: #121418; border-color: #9AA1AC; background: #FFFFFF; }
.wg__next{ border: 0; background: none; font: inherit; font-weight: 600; color: #1F3D8A; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.wg__next[hidden]{ display: none; }
.wg__out{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 18px 0 0; padding: 0; list-style: none; }
.wg__out li{ display: grid; gap: 4px; align-content: start; padding: 16px 18px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); transition: border-color 0.3s var(--lg-ease), opacity 0.3s var(--lg-ease); }
.wg__oi{ color: var(--lg-text-faint); }
.wg__ot{ font-weight: 700; }
.wg__os{ color: var(--lg-text-muted); font-size: 0.875rem; }
.wg__ov{ display: flex; gap: 8px; align-items: center; margin-top: 6px; font-variant-numeric: tabular-nums; }
.wg__ov span{ color: var(--lg-text-faint); }
.wg__ov b{ font-size: 1.125rem; }
.wg__out.is-ready:not(.is-done) li{ opacity: 0.5; }
.wg__out.is-done li{ border-color: var(--lg-lime-line, var(--lg-lime)); }
.wg__out.is-done .wg__oi,.wg__out.is-done .wg__ov .ico{ color: var(--lg-lime); }
@media (max-width: 1023px){
.wg__ui{ grid-template-columns: 1fr; }
.wg__paper{ max-width: 320px; }
.wg__arrow{ rotate: 90deg; justify-self: start; margin-left: 24px; }
.wg__out{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
.wg__ui.is-ready .wg__steps{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wg__scale{ grid-template-columns: 1fr; }
.wg__scale i{ justify-self: center; }
.wg__kv{ grid-template-columns: 1fr 1fr; }
.wg__out{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.wg__out li{ padding: 12px 14px; }
.wg__ov{ flex-wrap: wrap; gap: 2px 6px; }
}
@media (prefers-reduced-motion: no-preference){
.wg__panel:not([hidden]) > *{ animation: dv-in 0.35s var(--lg-ease) both; }
.wg__panel:not([hidden]) > *:nth-child(2){ animation-delay: 0.08s; }
.wg__panel:not([hidden]) > *:nth-child(3){ animation-delay: 0.16s; }
.wg__scale .wg__net{ animation: wg-pop 0.5s var(--lg-ease-pop) 0.35s both; }
.wg__out.is-done li{ animation: wg-lit 0.5s var(--lg-ease) calc(var(--i) * 0.12s) both; }
}
@keyframes wg-pop{ from { scale: 0.92; opacity: 0; } to { scale: 1; opacity: 1; } }
@keyframes wg-lit{ from { translate: 0 8px; opacity: 0.5; } to { translate: 0 0; opacity: 1; } }
.faq-topics__h{ display: flex; gap: 12px; align-items: center; font-size: 1.0625rem; font-weight: 700; }
.faq-topics__h .ico{ width: 36px; height: 36px; padding: 8px; border-radius: 10px; background: var(--lg-surface-2); border: 1px solid var(--lg-border); color: var(--lg-lime); }
.faq-topics__nav a .ico{ color: var(--lg-lime); }
@media (max-width: 760px){
.faq-topics__nav{ -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); }
}
.wg__play .wg__i-pause,.wg__play[aria-pressed="true"] .wg__i-play{ display: none; }
.wg__play[aria-pressed="true"] .wg__i-pause{ display: inline-block; }
.wg__used{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.wg__used li{ display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 8px; background: #FFFFFF; border: 1px solid #E3E6EA; font-size: 0.875rem; }
.wg__used .ico{ color: #1F8A4C; }
.wg__used b{ font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: no-preference){
.wg__panel:not([hidden]) .wg__used li{ animation: dv-in 0.3s var(--lg-ease) both; }
.wg__used li:nth-child(2){ animation-delay: 0.25s !important; }
.wg__used li:nth-child(3){ animation-delay: 0.35s !important; }
.wg__used li:nth-child(4){ animation-delay: 0.45s !important; }
}
@media (max-width: 560px){
.wg__used{ grid-template-columns: 1fr; }
}
.ab-eq__join{ grid-column: 2; grid-row: 1 / span 2; position: relative; z-index: 0; pointer-events: none; }
.ab-eq__join::before{ content: ""; position: absolute; left: 0; right: 50%; top: calc(25% - 4px); bottom: calc(25% - 4px); border: 1.5px solid var(--lg-lime); border-left: 0; border-radius: 0 16px 16px 0; opacity: 0.75; }
.ab-eq__join i{ position: absolute; left: 50%; right: 0; top: 50%; height: 1.5px; margin-top: -0.75px; background: var(--lg-lime); opacity: 0.75; }
.ab-eq__src .ab-eq__node{ right: -7px; }
@media (max-width: 760px){
.ab-eq__join{ display: none; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .ab-eq__stage[data-reveal]:not(.is-in) .ab-eq__join::before{ clip-path: inset(0 100% 0 0); }
.js.motion .ab-eq__stage[data-reveal]:not(.is-in) .ab-eq__join i{ transform: scaleX(0); }
.js.motion .ab-eq__stage.is-in .ab-eq__join::before{ clip-path: inset(0 0 0 0); transition: clip-path 0.5s var(--lg-ease) 0.15s; }
.js.motion .ab-eq__stage.is-in .ab-eq__join i{ transform-origin: left; transition: transform 0.35s var(--lg-ease) 0.6s; }
}
.ip{ container-type: inline-size; position: relative; aspect-ratio: 70.6 / 146.6; padding: 0; border-radius: 16.4% / 7.9%;
  background: linear-gradient(140deg, #6A6D72 0%, #2C2D31 18%, #1B1C1F 55%, #3A3C40 85%, #75787D 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22), 0 1px 2px rgba(0, 0, 0, 0.3), 0 24px 36px -24px rgba(0, 0, 0, 0.55); }
.ip__screen{ position: absolute; inset: 1.2cqi; height: auto; display: flex; flex-direction: column; overflow: hidden;
  border: 2.3cqi solid #050506; border-radius: 15.2cqi; background: #FFFFFF; }
.ip__status{ flex: none; height: 11cqi; padding: 1.4cqi 7.5cqi 0 10cqi; display: flex; justify-content: space-between; align-items: center;
  font: 600 3.9cqi/1 -apple-system, 'Segoe UI', sans-serif; color: #000; background: #FFFFFF; }
.ip__status i{ width: 6.4cqi; height: 3cqi; border-radius: 0.9cqi; border: 0.35cqi solid #000; position: relative; }
.ip__status i::after{ content: ""; position: absolute; inset: 0.4cqi; right: 1.2cqi; border-radius: 0.4cqi; background: #000; }
.ip__island{ position: absolute; top: 2.4cqi; left: 50%; width: 29cqi; height: 8.4cqi; border-radius: 99px; background: #000; transform: translateX(-50%); }
.ip__view{ flex: 1; min-height: 0; position: relative; overflow: hidden; }
.ip__view img,.ip__view .shot{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.ip::before,.ip::after{ content: ""; position: absolute; width: 1.1%; border-radius: 2px; background: #45474B; box-shadow: none; }
.ip::before{ left: -0.75%; top: 17%; height: 23%; background: linear-gradient(180deg, #45474B 0 17%, transparent 17% 35%, #45474B 35% 63%, transparent 63% 72%, #45474B 72%); }
.ip::after{ right: -0.75%; top: 27%; height: 10%; }
.mb__lid{ padding: 1.35% 1.35% 1.9%; border-radius: 2.6% 2.6% 0.7% 0.7% / 4.1% 4.1% 1.1% 1.1%; background: #070708;
  box-shadow: inset 0 0 0 1px #2F3134, 0 0 0 1px #B6BBC1, 0 24px 36px -28px rgba(0, 0, 0, 0.6); }
.mb__base{ width: 112%; margin-left: -6%; padding-bottom: 2.1%; border-radius: 0.4% 0.4% 40% 40% / 10% 10% 100% 100%;
  background: linear-gradient(180deg, #F1F2F4 0%, #D3D6DA 45%, #A5A9AF 90%, #8D9197 100%); box-shadow: 0 16px 22px -16px rgba(0, 0, 0, 0.55); }
.mon{ container-type: inline-size; position: relative; width: 100%; }
.mon__body{ position: relative; z-index: 1; padding: 0.32cqi; border-radius: 1.9cqi; background: linear-gradient(180deg, #E1E4E7, #A9AEB4 60%, #C9CDD2);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.18), 0 30px 50px -30px rgba(0, 0, 0, 0.6); }
.mon__glass{ padding: 1.45cqi; border-radius: 1.6cqi; background: #0A0A0B; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
.mon__screen{ position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 0.3cqi; background: #FFFFFF; }
.mon__screen > .pz{ display: block; width: 100%; height: 100%; }
.mon__screen img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.mon__stand{ position: relative; height: 9.5cqi; margin-top: -0.4cqi; }
.mon__neck{ position: absolute; left: 50%; top: 0; width: 15cqi; height: 8.4cqi; transform: translateX(-50%);
  clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%);
  background: linear-gradient(90deg, #8E9399 0%, #D9DCE0 22%, #EEF0F2 50%, #CDD1D5 78%, #8A8F95 100%); }
.mon__neck::after{ content: ""; position: absolute; inset: 0 0 auto; height: 1.6cqi; background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), transparent); }
.mon__foot{ position: absolute; left: 50%; bottom: 0; width: 29cqi; height: 1.3cqi; transform: translateX(-50%); border-radius: 0.6cqi 0.6cqi 1cqi 1cqi;
  background: linear-gradient(180deg, #F2F3F5, #B6BBC1); box-shadow: 0 1.2cqi 1.6cqi -0.6cqi rgba(0, 0, 0, 0.45); }
.crop{ position: relative; display: block; width: 100%; overflow: hidden; background: #FFFFFF; }
.crop img{ position: absolute; max-width: none; height: auto; display: block; }
.mark{ position: absolute; z-index: 2; pointer-events: none; border: 2px solid var(--lg-lime); border-radius: 0.8cqi; box-shadow: 0 0 0 3px rgba(13, 15, 18, 0.55), 0 0 0 7px rgba(204, 255, 0, 0.18); }
.mark b,.mshow__n{ display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--lg-lime); color: #0D0F12; font: 700 0.75rem/1 var(--lg-font-body); }
.mark b{ position: absolute; left: -11px; top: -11px; box-shadow: 0 0 0 3px rgba(13, 15, 18, 0.6); }
.pz{ position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: inherit; color: inherit; }
.pz__hint{ position: absolute; right: 8px; bottom: 8px; z-index: 3; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(13, 15, 18, 0.78); color: #FFFFFF; opacity: 0; transform: scale(0.85); transition: opacity 0.2s var(--lg-ease), transform 0.2s var(--lg-ease); }
.pz:hover .pz__hint,.pz:focus-visible .pz__hint{ opacity: 1; transform: none; }
@media (hover: none){
.pz__hint{ opacity: 0.9; transform: none; }
}
.pz:focus-visible{ outline: none; box-shadow: 0 0 0 3px var(--lg-lime); }
html:not(.js) .pz{ cursor: default; }
html:not(.js) .pz__hint{ display: none; }
.mshow{ position: relative; isolation: isolate; padding: clamp(24px, 4.5%, 56px) clamp(16px, 6%, 72px) clamp(20px, 3.5%, 44px); border-radius: var(--lg-radius-lg); background: #E5E8EC; color: #121418; }
.case--fashion .mshow{ background: #E8E1DB; }
.mshow > .sym{ border-radius: inherit; overflow: hidden; }
.mshow__main{ position: relative; z-index: 1; width: 82%; }
.mshow--callout .mshow__main,.mshow--trio .mshow__main{ width: 78%; }
.mshow--phone .mshow__main{ width: 80%; }
.mshow__detail{ position: absolute; z-index: 2; right: clamp(12px, 3%, 40px); bottom: 21%; width: 42%; margin: 0; padding: 6px; border-radius: 14px; background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 30px 50px -22px rgba(13, 15, 18, 0.55); }
.mshow__detail .pz,.mshow__detail .crop{ border-radius: 9px; overflow: hidden; }
.mshow__detail figcaption{ display: flex; gap: 8px; align-items: flex-start; padding: 8px 4px 2px; font-size: 0.875rem; line-height: 1.4; color: #2A2F36; }
.mshow__detail figcaption .mshow__n{ flex: none; }
.mshow--trio .mshow__detail{ right: auto; left: clamp(12px, 3%, 40px); bottom: 6%; width: 40%; }
.mshow__phone{ position: absolute; z-index: 2; right: clamp(12px, 4%, 48px); bottom: clamp(16px, 3.5%, 40px); width: 19%; }
.mshow--trio .mshow__phone{ width: 18%; }
.mshow__phones{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 4%, 48px); margin: 0 auto; padding: 0; list-style: none; max-width: 820px; position: relative; z-index: 1; }
.mshow__phones li{ display: grid; gap: 12px; justify-items: center; }
.mshow__phones .ip{ width: 100%; }
.mshow__cap{ display: flex; gap: 8px; align-items: flex-start; font-size: 0.875rem; line-height: 1.35; color: #2A2F36; }
.mshow__cap .mshow__n{ flex: none; }
.mshow .sym path{ stroke: rgba(18, 20, 24, 0.12); }
@media (max-width: 760px){
.mshow{ padding: 18px 14px 16px; }
.mshow__main,.mshow--callout .mshow__main,.mshow--trio .mshow__main,.mshow--phone .mshow__main{ width: 100%; }
.mshow__detail,.mshow--trio .mshow__detail{ position: relative; inset: auto; width: auto; margin: -4% 4% 0; }
.mshow--phone .mshow__main{ width: 88%; }
.mshow__phone,.mshow--trio .mshow__phone{ width: 30%; right: 10px; bottom: 12px; }
.mshow--trio .mshow__phone{ position: relative; right: auto; bottom: auto; width: 44%; margin: 14px auto 0; }
.mshow__phones{ grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 62%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px;
    -webkit-mask-image: linear-gradient(90deg, #000 84%, transparent); mask-image: linear-gradient(90deg, #000 84%, transparent); }
.mshow__phones li{ scroll-snap-align: start; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .mshow[data-reveal]:not(.is-in) .mon{ opacity: 0; translate: 0 18px; }
.js.motion .mshow[data-reveal]:not(.is-in) .mon__screen > .pz{ opacity: 0.15; filter: brightness(0.4); }
.js.motion .mshow[data-reveal]:not(.is-in) .mark{ opacity: 0; scale: 1.08; }
.js.motion .mshow[data-reveal]:not(.is-in) .mshow__detail{ opacity: 0; translate: -24px 14px; scale: 0.94; }
.js.motion .mshow[data-reveal]:not(.is-in) .mshow__phone{ opacity: 0; translate: 0 28px; }
.js.motion .mshow[data-reveal]:not(.is-in) .mshow__phones li{ opacity: 0; translate: 0 22px; }
.js.motion .mshow.is-in .mon{ transition: opacity 0.6s var(--lg-ease), translate 0.7s var(--lg-ease); }
.js.motion .mshow.is-in .mon__screen > .pz{ transition: opacity 0.7s ease 0.25s, filter 0.9s ease 0.25s; }
.js.motion .mshow.is-in .mark{ transition: opacity 0.35s ease 0.75s, scale 0.45s var(--lg-ease-pop) 0.75s; }
.js.motion .mshow.is-in .mshow__detail{ transition: opacity 0.45s var(--lg-ease) 0.95s, translate 0.6s var(--lg-ease) 0.95s, scale 0.6s var(--lg-ease) 0.95s; }
.js.motion .mshow.is-in .mshow__phone{ transition: opacity 0.5s var(--lg-ease) 0.6s, translate 0.7s var(--lg-ease) 0.6s; }
.js.motion .mshow.is-in .mshow__phones li{ transition: opacity 0.5s var(--lg-ease) calc(var(--i) * 0.14s), translate 0.6s var(--lg-ease) calc(var(--i) * 0.14s); }
.js.motion .mshow.is-in .mark{ animation: mark-ping 1.6s var(--lg-ease) 1.3s 1 both; }
@media (hover: hover) and (pointer: fine){
.mshow__detail{ transition: translate 0.3s var(--lg-ease), box-shadow 0.3s var(--lg-ease); }
.mshow__detail:hover{ translate: 0 -4px; }
.mon__screen .pz img{ transition: scale 0.6s var(--lg-ease); }
.mon__screen .pz:hover img{ scale: 1.012; }
}
}
@keyframes mark-ping{ 0% { box-shadow: 0 0 0 3px rgba(13, 15, 18, 0.55), 0 0 0 0 rgba(204, 255, 0, 0.5); } 70% { box-shadow: 0 0 0 3px rgba(13, 15, 18, 0.55), 0 0 0 14px rgba(204, 255, 0, 0); } 100% { box-shadow: 0 0 0 3px rgba(13, 15, 18, 0.55), 0 0 0 7px rgba(204, 255, 0, 0.18); } }
.pschema{ position: relative; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0; min-height: 220px; padding: 28px; border-radius: var(--lg-radius-lg); background: var(--lg-surface-1); border: 1px solid var(--lg-border); }
.pschema__n{ display: grid; gap: 4px; justify-items: center; text-align: center; padding: 14px 18px; border-radius: 12px; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-2); max-width: 200px; }
.pschema__n b{ font-size: 1.0625rem; }
.pschema__n small{ color: var(--lg-text-muted); font-size: 0.8125rem; line-height: 1.4; }
.pschema__n--end{ border-color: var(--lg-lime); }
.pschema__link{ position: relative; flex: 0 1 64px; min-width: 28px; height: 2px; background: var(--lg-lime); opacity: 0.8; }
.pschema__link::after{ content: ""; position: absolute; right: -3px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--lg-lime); }
@media (max-width: 560px){
.pschema{ flex-direction: column; }
.pschema__link{ flex: none; width: 2px; height: 26px; }
.pschema__link::after{ right: -3px; top: auto; bottom: -3px; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .pschema[data-reveal]:not(.is-in) .pschema__n{ opacity: 0; translate: 0 10px; }
.js.motion .pschema[data-reveal]:not(.is-in) .pschema__link{ scale: 0 1; }
.js.motion .pschema.is-in .pschema__n{ transition: opacity 0.4s var(--lg-ease) calc(var(--i) * 0.3s), translate 0.5s var(--lg-ease) calc(var(--i) * 0.3s); }
.js.motion .pschema.is-in .pschema__link{ transform-origin: left; transition: scale 0.35s var(--lg-ease) 0.2s; }
}
.story{ padding-block: clamp(56px, 9vh, 104px); border-top: 1px solid var(--lg-border); }
.story__toc{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.story__toc a{ display: inline-flex; gap: 8px; align-items: center; min-height: 40px; padding: 6px 14px 6px 8px; border-radius: 99px; border: 1px solid var(--lg-border-strong); color: var(--lg-text); text-decoration: none; font-weight: 600; font-size: 0.9375rem; transition: border-color 0.15s var(--lg-ease); }
.story__toc a span{ display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--lg-surface-2); font-size: 0.75rem; }
.story__toc a:hover{ border-color: var(--lg-lime); }
.story__toc a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.story__list{ display: grid; gap: clamp(56px, 9vh, 112px); margin: clamp(36px, 6vh, 64px) 0 0; padding: 0; list-style: none; }
.chap{ display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr); gap: clamp(24px, 4vw, 64px); align-items: center; scroll-margin-top: 96px; }
.chap--flip .chap__text{ order: 2; }
.chap--wide{ grid-template-columns: 1fr; }
.chap--wide .chap__dl{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 32px; }
.chap__text{ display: grid; gap: 14px; align-content: start; }
.chap__k{ display: flex; gap: 10px; align-items: center; color: var(--lg-text-muted); font-weight: 600; font-size: 0.9375rem; }
.chap__n{ display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--lg-lime); color: #0D0F12; font-weight: 700; font-size: 0.8125rem; }
.chap__t{ font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.125rem); line-height: 1.12; letter-spacing: -0.025em; }
.chap__dl{ display: grid; gap: 12px; margin: 0; }
.chap__dl div{ display: grid; gap: 2px; padding-left: 14px; border-left: 2px solid var(--lg-border-strong); }
.chap__dl div:nth-child(2){ border-left-color: var(--lg-lime); }
.chap__dl dt{ font-size: 0.8125rem; font-weight: 700; color: var(--lg-text-muted); }
.chap__dl dd{ margin: 0; color: var(--lg-text); line-height: 1.6; }
.chap__seen{ display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; background: var(--lg-surface-1); border: 1px dashed var(--lg-border-strong); color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.55; }
.chap__seen .ico{ flex: none; margin-top: 3px; color: var(--lg-info); }
.chap__seen b{ color: var(--lg-text); font-weight: 600; }
@media (max-width: 960px){
.chap,.chap--flip{ grid-template-columns: 1fr; }
.chap--flip .chap__text{ order: 0; }
.chap--wide .chap__dl{ grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .chap__text[data-reveal]:not(.is-in) > *{ opacity: 0; translate: 0 12px; }
.js.motion .chap__text.is-in > *{ transition: opacity 0.45s var(--lg-ease), translate 0.55s var(--lg-ease); }
.js.motion .chap__text.is-in > :nth-child(2){ transition-delay: 0.06s; }
.js.motion .chap__text.is-in > :nth-child(3){ transition-delay: 0.12s; }
.js.motion .chap__text.is-in > :nth-child(4){ transition-delay: 0.18s; }
}
.chap__note{ display: flex; gap: 10px; align-items: flex-start; color: var(--lg-text-faint); font-size: 0.875rem; }
.chap__note .ico{ flex: none; margin-top: 2px; }
.badge{ font-family: var(--lg-font-body); letter-spacing: 0; font-weight: 600; }
.troles{ display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.troles li{ display: grid; grid-template-columns: 28px minmax(84px, auto) minmax(0, 1fr); gap: 4px 12px; align-items: center; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--lg-border); background: var(--lg-surface-2); }
.troles .tech__logo{ width: 22px; height: 22px; }
.troles b{ font-weight: 700; }
.troles span:last-child{ color: var(--lg-text-muted); font-size: 0.875rem; line-height: 1.4; }
@media (max-width: 480px){
.troles li{ grid-template-columns: 28px minmax(0, 1fr); }
.troles span:last-child{ grid-column: 2; }
}
.proto-note{ display: inline-flex; gap: 8px; align-items: center; margin-top: 12px; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--lg-border-strong); color: var(--lg-text-muted); font-size: 0.875rem; }
.proto-note .ico{ color: var(--lg-info); }
.approach__more{ display: inline-flex; gap: 6px; align-items: center; margin-top: 22px; }
.pc-chain{ margin-top: 28px; }
.pc-chain ol{ position: relative; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.pc-chain ol::before{ content: ""; position: absolute; left: 18px; right: 18px; top: 17px; height: 2px; background: var(--lg-border-strong); }
.pc-chain li{ position: relative; }
.pc-chain a{ display: grid; gap: 8px; justify-items: start; color: var(--lg-text-muted); text-decoration: none; font-weight: 600; font-size: 0.9375rem; border-radius: 8px; }
.pc-chain__n{ display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--lg-border-strong); background: var(--lg-bg, #0D0F12); color: var(--lg-text); font-weight: 700; transition: background-color 0.25s var(--lg-ease), border-color 0.25s var(--lg-ease), color 0.25s var(--lg-ease); }
.pc-chain a:hover{ color: var(--lg-text); }
.pc-chain a:hover .pc-chain__n{ border-color: var(--lg-lime); }
.pc-chain a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.pc-chain a[aria-current="step"]{ color: var(--lg-text); }
.pc-chain a[aria-current="step"] .pc-chain__n{ background: var(--lg-lime); border-color: var(--lg-lime); color: #0D0F12; }
.pc-chain a.is-passed .pc-chain__n{ border-color: var(--lg-lime); }
@media (max-width: 860px){
.pc-chain ol{ grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: max-content; gap: 22px; overflow-x: auto; padding-bottom: 6px; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.pc-chain ol::before{ right: auto; width: 640px; }
.pc-chain a{ white-space: nowrap; }
}
.proc{ padding-block: clamp(32px, 6vh, 64px) clamp(56px, 9vh, 104px); }
.proc__list{ position: relative; display: grid; gap: clamp(48px, 8vh, 88px); margin: 0; padding: 0 0 0 56px; list-style: none; }
.proc__list::before{ content: ""; position: absolute; left: 17px; top: 10px; bottom: 10px; width: 2px; background: var(--lg-border-strong); }
.proc__list::after{ content: ""; position: absolute; left: 17px; top: 10px; width: 2px; height: var(--pc-fill, 0px); background: var(--lg-lime); transition: height 0.5s var(--lg-ease); }
.pc-stage{ position: relative; display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.5fr); gap: 24px clamp(24px, 4vw, 56px); align-items: center; scroll-margin-top: 100px; }
.pc-stage__node{ position: absolute; left: -47px; top: 6px; z-index: 1; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--lg-border-strong); background: var(--lg-bg, #0D0F12); transition: background-color 0.3s var(--lg-ease), border-color 0.3s var(--lg-ease), scale 0.4s var(--lg-ease-pop); }
.pc-stage.is-passed .pc-stage__node{ border-color: var(--lg-lime); }
.pc-stage.is-current .pc-stage__node{ background: var(--lg-lime); border-color: var(--lg-lime); scale: 1.25; }
.pc-stage__head{ display: grid; gap: 10px; align-content: start; }
.pc-stage__icon{ display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--lg-surface-2); border: 1px solid var(--lg-border); color: var(--lg-lime); }
.pc-stage__k{ color: var(--lg-text-muted); font-weight: 600; font-size: 0.875rem; }
.pc-stage__t{ font-size: clamp(1.5rem, 1.1rem + 1.1vw, 2.125rem); line-height: 1.1; letter-spacing: -0.025em; }
.pc-stage__lead{ color: var(--lg-text-muted); line-height: 1.6; max-width: 40ch; }
.pc-stage--opt .pc-stage__node{ border-style: dashed; }
.pc-flow{ position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 0.9fr); grid-template-rows: auto auto; gap: 14px 0; }
.pc-flow__in,.pc-flow__out{ position: relative; z-index: 1; display: grid; gap: 8px; align-content: start; padding: 16px 18px; border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.pc-flow__in--you{ grid-column: 1; grid-row: 1; }
.pc-flow__in--us{ grid-column: 1; grid-row: 2; }
.pc-flow__out{ grid-column: 3; grid-row: 1 / span 2; align-self: center; border-color: var(--lg-lime); }
.pc-flow h3{ display: flex; gap: 8px; align-items: center; font-size: 0.9375rem; }
.pc-flow__in h3 .ico{ color: var(--lg-text-muted); }
.pc-flow__out h3 .ico{ color: var(--lg-lime); }
.pc-flow ul{ display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.pc-flow li{ position: relative; padding-left: 14px; color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.45; }
.pc-flow li::before{ content: ""; position: absolute; left: 0; top: 0.6em; width: 5px; height: 5px; border-radius: 50%; background: var(--lg-text-faint); }
.pc-flow__out p{ color: var(--lg-text); font-weight: 600; line-height: 1.5; }
.pc-flow__in::after{ content: ""; position: absolute; right: -6px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: var(--lg-text-muted); box-shadow: 0 0 0 3px var(--lg-bg, #0D0F12); }
.pc-flow__apex{ position: absolute; left: -8px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; background: var(--lg-lime); box-shadow: 0 0 0 3px var(--lg-bg, #0D0F12); }
.pc-flow__join{ grid-column: 2; grid-row: 1 / span 2; position: relative; pointer-events: none; }
.pc-flow__join::before{ content: ""; position: absolute; left: 0; right: 50%; top: calc(25% - 3px); bottom: calc(25% - 3px); border: 1.5px solid var(--lg-lime); border-left: 0; border-radius: 0 14px 14px 0; opacity: 0.75; }
.pc-flow__join i{ position: absolute; left: 50%; right: 0; top: 50%; height: 1.5px; background: var(--lg-lime); opacity: 0.75; }
.proc__more{ display: flex; gap: 10px; align-items: flex-start; margin-top: clamp(40px, 6vh, 64px); max-width: 72ch; color: var(--lg-text-muted); }
.proc__more .ico{ flex: none; margin-top: 3px; color: var(--lg-info); }
@media (max-width: 960px){
.pc-stage{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
.proc__list{ padding-left: 36px; }
.proc__list::before,.proc__list::after{ left: 9px; }
.pc-stage__node{ left: -35px; }
.pc-flow{ grid-template-columns: 1fr; grid-template-rows: none; gap: 10px; }
.pc-flow__in--you,.pc-flow__in--us,.pc-flow__out{ grid-column: 1; grid-row: auto; }
.pc-flow__join,.pc-flow__in::after{ display: none; }
.pc-flow__out{ margin-top: 14px; }
.pc-flow__apex{ left: 50%; top: -8px; margin: 0 0 0 -7px; }
.pc-flow__out::before{ content: ""; position: absolute; left: 50%; top: -24px; height: 16px; width: 1.5px; background: var(--lg-lime); }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .pc-chain[data-reveal]:not(.is-in) li{ opacity: 0; translate: 0 8px; }
.js.motion .pc-chain[data-reveal]:not(.is-in) ol::before{ scale: 0 1; }
.js.motion .pc-chain.is-in li{ transition: opacity 0.4s var(--lg-ease) calc(var(--i) * 0.07s + 0.2s), translate 0.45s var(--lg-ease) calc(var(--i) * 0.07s + 0.2s); }
.js.motion .pc-chain.is-in ol::before{ transform-origin: left; transition: scale 0.9s var(--lg-ease-draw, ease); }
.js.motion .pc-flow[data-reveal]:not(.is-in) .pc-flow__in{ opacity: 0; translate: -14px 0; }
.js.motion .pc-flow[data-reveal]:not(.is-in) .pc-flow__join::before{ clip-path: inset(0 100% 0 0); }
.js.motion .pc-flow[data-reveal]:not(.is-in) .pc-flow__join i{ scale: 0 1; }
.js.motion .pc-flow[data-reveal]:not(.is-in) .pc-flow__out{ opacity: 0; translate: 12px 0; }
.js.motion .pc-flow.is-in .pc-flow__in{ transition: opacity 0.4s var(--lg-ease), translate 0.5s var(--lg-ease); }
.js.motion .pc-flow.is-in .pc-flow__in--us{ transition-delay: 0.08s; }
.js.motion .pc-flow.is-in .pc-flow__join::before{ clip-path: inset(0 0 0 0); transition: clip-path 0.45s var(--lg-ease) 0.3s; }
.js.motion .pc-flow.is-in .pc-flow__join i{ transform-origin: left; transition: scale 0.3s var(--lg-ease) 0.7s; }
.js.motion .pc-flow.is-in .pc-flow__out{ transition: opacity 0.45s var(--lg-ease) 0.85s, translate 0.5s var(--lg-ease) 0.85s; }
}
.legal2{ padding-block: clamp(24px, 4vh, 48px) clamp(56px, 9vh, 104px); }
.legal2__grid{ display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.legal2__toc{ position: sticky; top: calc(var(--header-h, 72px) + 16px); }
.legal2__toc ol{ display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; counter-reset: lt; }
.legal2__toc a{ display: block; padding: 6px 10px; border-radius: 8px; color: var(--lg-text-muted); text-decoration: none; font-size: 0.9375rem; }
.legal2__toc a:hover{ color: var(--lg-text); background: var(--lg-surface-1); }
.legal2__toc a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
.legal2__body{ display: grid; gap: clamp(28px, 4vh, 44px); max-width: 76ch; }
.legal2__sec{ scroll-margin-top: calc(var(--header-h, 72px) + 16px); display: grid; gap: 12px; }
.legal2__sec h2{ font-size: clamp(1.25rem, 1.05rem + 0.6vw, 1.5rem); letter-spacing: -0.02em; }
.legal2__sec p,.legal2__sec li{ color: var(--lg-text-muted); line-height: 1.7; }
.legal2__sec b{ color: var(--lg-text); font-weight: 600; }
.legal2__sec ul{ display: grid; gap: 8px; margin: 0; padding-left: 1.1em; }
.legal2__sec a:not(.lg-link){ color: var(--lg-text); text-underline-offset: 3px; }
.legal2__table{ display: grid; border: 1px solid var(--lg-border); border-radius: 12px; overflow: hidden; }
.legal2__table > div{ display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--lg-border); font-size: 0.9375rem; color: var(--lg-text-muted); line-height: 1.5; }
.legal2__table--4 > div{ grid-template-columns: 0.9fr 0.6fr 1.6fr 0.8fr; }
.legal2__table > div:first-child{ border-top: 0; }
.legal2__th{ background: var(--lg-surface-1); color: var(--lg-text) !important; font-weight: 700; font-size: 0.8125rem !important; }
.legal2__table code{ font-family: var(--lg-font-mono); font-size: 0.8125rem; color: var(--lg-text); }
@media (max-width: 760px){
.legal2__grid{ grid-template-columns: 1fr; }
.legal2__toc{ position: static; }
.legal2__toc ol{ display: flex; flex-wrap: wrap; }
.legal2__table > div,.legal2__table--4 > div{ grid-template-columns: 1fr; gap: 4px; }
.legal2__th{ display: none !important; }
}
.legal2__date{ margin-top: 10px; color: var(--lg-text-faint); font-size: 0.875rem; }
.legal2__btn{ padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.site-footer__cookie{ padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: transparent; }
.site-footer__cookie:hover{ text-decoration-color: currentColor; }
.site-footer__cookie:focus-visible{ outline: none; box-shadow: var(--lg-focus); border-radius: 4px; }
.site-footer__legal{ display: flex; flex-wrap: wrap; gap: 6px 18px; }
dialog.cns{ width: min(560px, calc(100vw - 32px)); padding: 0; border: 0; border-radius: 16px; color: var(--lg-text); background: var(--lg-surface-1); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.8), 0 0 0 1px var(--lg-border-strong); }
dialog.cns::backdrop{ background: rgba(6, 8, 10, 0.72); }
.cns__head{ display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 16px 12px 22px; border-bottom: 1px solid var(--lg-border); }
.cns__t{ font-size: 1.25rem; }
.cns__body{ display: grid; gap: 12px; padding: 18px 22px; color: var(--lg-text-muted); line-height: 1.6; }
.cns__store{ display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cns__store li{ display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--lg-surface-2); }
.cns__store code{ font-family: var(--lg-font-mono); font-size: 0.8125rem; color: var(--lg-text); }
.cns__foot{ display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; justify-content: flex-end; padding: 14px 22px 18px; border-top: 1px solid var(--lg-border); }
@media (max-width: 560px){
dialog.cns{ width: 100vw; max-width: 100vw; margin: auto 0 0; border-radius: 16px 16px 0 0; }
.cns__foot .lg-btn{ flex: 1 1 100%; }
}
@media (prefers-reduced-motion: no-preference){
dialog.cns[open]{ animation: dlg-in 0.28s var(--lg-ease) both; }
}
@media (max-width: 760px){
.mshow{ overflow: clip; }
.mshow__phones{ max-width: 100%; }
}
.chap > *,.pc-stage > *,.mshow > *{ min-width: 0; }
.chap--wide{ grid-template-columns: minmax(0, 1fr); }
@media (max-width: 960px){
.chap,.chap--flip{ grid-template-columns: minmax(0, 1fr); }
.pc-stage{ grid-template-columns: minmax(0, 1fr); }
}
.site-footer__legal{ display: flex; flex-wrap: wrap; align-items: center; gap: 0 22px; margin: 0; padding: 0; list-style: none; }
.site-footer__legal li{ display: flex; }
.site-footer__legal a,.site-footer__legal .site-footer__cookie{
  display: inline-flex; align-items: center; min-height: 32px; margin: 0; padding: 0; border: 0; background: none;
  font: inherit; font-size: 0.875rem; line-height: 1.4; color: var(--lg-text-muted); text-decoration: none; cursor: pointer;
}
.site-footer__legal a:hover,.site-footer__legal .site-footer__cookie:hover{ color: var(--lg-text); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px){
.site-footer__legal{ gap: 0 18px; }
.site-footer__legal a,.site-footer__legal .site-footer__cookie{ min-height: 40px; }
}
.tr{ padding-block: 30px 34px; border-top: 1px solid var(--lg-border); border-bottom: 1px solid var(--lg-border); background: #101317; overflow: hidden; }
@keyframes tr-run{ from { transform: translateX(0); } to { transform: translateX(-25%); } }
.tx{ padding-block: clamp(24px, 4vh, 40px) clamp(48px, 8vh, 88px); }
.tx__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.tx__col{ display: grid; gap: 14px; padding: clamp(20px, 2.6vw, 30px); border-radius: var(--lg-radius-lg); border: 1px solid var(--lg-border); background: var(--lg-surface-1); }
.tx__col--plat{ border-color: var(--lg-border-strong); }
.tx__h{ font-size: 1.25rem; }
.tx__list{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.tx__row{ display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 14px; padding: 12px 0; border-top: 1px solid var(--lg-border); }
.tx__row:first-child{ border-top: 0; padding-top: 4px; }
.tx__row b{ font-size: 1rem; }
.tx__row b small{ font-weight: 500; color: var(--lg-text-muted); font-size: 0.875rem; }
.tx__row p{ margin-top: 2px; color: var(--lg-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.tx__row .tx__cases{ font-size: 0.8125rem; color: var(--lg-text-faint); }
.tx__cases a{ color: var(--lg-text-muted); text-underline-offset: 3px; }
.tx__logo{ width: 22px; height: 22px; margin-top: 1px; fill: currentColor; color: var(--lg-text-muted); }
.tx__note{ display: flex; gap: 8px; align-items: center; margin-top: 16px; color: var(--lg-text-muted); font-size: 0.875rem; }
.tx__note .ico{ color: var(--lg-info); flex: none; }
@media (max-width: 860px){
.tx__grid{ grid-template-columns: minmax(0, 1fr); }
}
.scn{ position: relative; padding-block: clamp(56px, 9vh, 104px); border-top: 1px solid var(--lg-border); }
.scn__stage{ position: sticky; top: calc(var(--header-h, 72px) + 3vh); height: calc(100vh - var(--header-h, 72px) - 6vh); min-height: 420px; display: grid; place-items: center; }
.scn__art{ position: relative; width: 100%; max-width: 660px; aspect-ratio: 600 / 520; container-type: inline-size; }
.scn__art--mini{ display: none; }
@keyframes scn-drift{ from { translate: 0 0; } to { translate: 6px -6px; } }
@keyframes scn-ring{ 0% { opacity: 0.5; transform: scale(1); } 100% { opacity: 0; transform: scale(1.5); } }
@media (max-width: 900px){
.scn__stage{ display: none; }
.scn__art--mini{ display: block; max-width: 520px; margin-bottom: 8px; }
}
.scn:not(.is-live) .scn__stage{ position: relative; top: auto; height: auto; min-height: 0; }
.mshow__detail .pz > img{ display: block; width: 100%; height: auto; }
.crop img{ height: auto; }
.mshow__detail.mshow__detail--narrow{ width: 26%; bottom: 8%; }
@media (max-width: 760px){
.mshow__detail.mshow__detail--narrow{ width: 62%; margin: -6% auto 0; }
}
.tx__row{ grid-template-columns: 76px minmax(0, 1fr); }
.tx__mk{ display: flex; align-items: center; height: 24px; }
.tx__logo{ height: 22px; width: auto; fill: currentColor; color: var(--lg-text-muted); }
svg.tx__logo{ width: calc(22px * var(--ar, 1)); max-width: 72px; }
svg.tx__logo.tx__logo--word{ height: 20px; width: calc(20px * var(--ar, 1)); }
img.tx__logo--img{ height: 14px; width: auto; max-width: 72px; filter: brightness(0) invert(0.72); }
img.tx__logo--img{ aspect-ratio: auto; width: auto; }
.tx__row{ grid-template-columns: minmax(0, 1fr); }
.tx__name{ display: flex; align-items: center; gap: 10px; min-height: 26px; margin: 0 !important; }
.tx__name .tx__mk{ height: auto; }
.tx__name b{ font-size: 1.0625rem; color: var(--lg-text); }
svg.tx__logo{ height: 22px; max-width: none; }
img.tx__logo--img{ height: 15px; max-width: none; }
.fp{ display: flex; flex-direction: column; min-width: 0; }
.fp__name{ font-family: var(--lg-font-display); font-size: clamp(2rem, 1.5rem + 1.4vw, 2.75rem); font-weight: 650; line-height: 1.02; letter-spacing: -0.01em; color: var(--lg-lime); }
.fp__role{ margin-top: 8px; font-size: 1.0625rem; font-weight: 600; color: var(--lg-text-muted); }
.fp__intro{ margin-top: 16px; max-width: 54ch; font-size: 1rem; line-height: 1.6; color: var(--lg-text); }
.fp__intro + .fp__intro{ margin-top: 8px; color: var(--lg-text-muted); }
.fp__acc{ display: grid; gap: 16px; margin: 24px 0 0; padding: 0; list-style: none; }
.fp__acc li{ display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 0 16px; align-items: start; }
.fp__ic{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--lg-surface-2); border: 1px solid var(--lg-border); color: var(--lg-lime); }
.fp__tx{ display: grid; gap: 2px; min-width: 0; }
.fp__tx b{ font-size: 1rem; font-weight: 700; line-height: 1.35; color: var(--lg-text); }
.fp__tx > span{ font-size: 0.9375rem; line-height: 1.55; color: var(--lg-text-muted); max-width: 54ch; }
.fp__acc .fp__tx{ padding-top: 9px; }
.fp__link{ display: inline-flex; gap: 6px; align-items: center; justify-self: start; margin-top: 6px; font-size: 0.875rem; font-weight: 700; color: var(--lg-text); text-decoration: underline; text-decoration-color: var(--lg-border-strong); text-underline-offset: 4px; transition: color 0.15s var(--lg-ease), text-decoration-color 0.15s var(--lg-ease); }
.fp__link:hover{ color: var(--lg-lime); text-decoration-color: var(--lg-lime); }
.fp__link .ico{ transition: translate 0.2s var(--lg-ease); }
.fp__link:hover .ico{ translate: 3px 0; }
.fp__cred{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.fp__c{ display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 0 12px; align-items: center; min-height: 64px; padding: 12px 14px 12px 12px; border-radius: 12px; border: 1px solid var(--lg-border-strong); background: var(--lg-surface-1); }
.fp__logo{ display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--lg-surface-2); color: var(--lg-text); }
.fp__logo .tech__logo,.fp__logo svg{ width: 22px; height: 22px; fill: currentColor; }
.fp__c--partner .fp__logo{ color: #95BF47; }
.fp__logo--cert{ color: var(--lg-info); }
.fp__c .fp__tx b{ font-size: 0.9375rem; }
.fp__c .fp__tx > span{ font-size: 0.8125rem; }
@media (max-width: 480px){
.fp__cred{ grid-template-columns: minmax(0, 1fr); }
}
.ab-founder .ab-founder__grid{ grid-template-columns: 300px minmax(0, 1fr); gap: 0 clamp(32px, 5vw, 80px); align-items: end; padding-top: clamp(48px, 7vh, 80px); }
.ab-founder .fp{ padding-bottom: clamp(40px, 6vh, 64px); }
.ab-founder .fp__acc{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 32px; max-width: 880px; }
.ab-founder .fp__cred{ max-width: 880px; }
@media (max-width: 960px){
.ab-founder .fp__acc{ grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px){
.ab-founder .ab-founder__grid{ grid-template-columns: minmax(0, 1fr); }
.ab-founder .founder__figure{ width: 220px; order: 2; }
.ab-founder .fp{ padding-bottom: 0; }
}
.fp__c--partner .fp__logo svg{ color: #95BF47; fill: #95BF47; }
.ab-founder .fp__acc{ grid-template-columns: minmax(0, 1fr); max-width: 640px; }
.ab-founder .fp__cred{ max-width: 640px; }
.ab-head__title{ white-space: nowrap; }
.ab-head__wm{ display: inline-block; height: 0.686em; width: auto; aspect-ratio: 518.98 / 99; vertical-align: -0.0104em; margin-left: 0.04em; fill: currentColor; }
@media (max-width: 760px){
.ab-founder .founder__figure{ width: 168px; order: 0; align-self: start; margin: 0; }
.ab-founder .founder__figure{ margin-bottom: 24px; }
.ab-founder .ab-founder__grid{ row-gap: 0; }
}
.partner-note__mk{ flex: none; width: auto; height: 18px; aspect-ratio: var(--ar, 1); margin-top: 1px; fill: #95BF47; color: #95BF47; }
.screens :is(.mon__screen, .mb__screen, .ip__view):has(img:not(.is-loaded)){ background-color: #E8EBEE; }
.screens :is(.mon__screen, .mb__screen, .ip__view) img:not(.is-loaded){ opacity: 0; }
.screens :is(.mon__screen, .mb__screen, .ip__view) img{ transition: opacity 0.35s var(--lg-ease); }
@media (prefers-reduced-motion: no-preference){
.screens :is(.mon__screen, .mb__screen, .ip__view):has(img:not(.is-loaded)){
    background-image: linear-gradient(100deg, transparent 30%, rgb(255 255 255 / 0.7) 50%, transparent 70%);
    background-size: 220% 100%; animation: screen-load 1.4s linear infinite;
  }
}
@keyframes screen-load{ from { background-position: 120% 0; } to { background-position: -120% 0; } }
.tx__name svg.tx__logo--word{ height: 24px; width: calc(24px * var(--ar, 1)); color: var(--lg-text); }
.tx__name img.tx__logo--img{ height: 21px; filter: brightness(0) invert(0.93); }
@font-face{ font-family: 'Sofia Sans'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/sofiasans-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family: 'Sofia Sans'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/sofiasans-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family: 'Sofia Sans Semi Condensed'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/sofiasans-sc-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family: 'Sofia Sans Semi Condensed'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/sofiasans-sc-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root{ --lg-font-body: 'Sofia Sans', 'Segoe UI', system-ui, sans-serif; --lg-font-display: 'Sofia Sans Semi Condensed', 'Segoe UI', system-ui, sans-serif; }
body{ font-family: var(--lg-font-body); font-size: 1.0625rem; line-height: 1.6; letter-spacing: 0.003em; font-kerning: normal; font-variant-ligatures: common-ligatures; text-rendering: optimizeLegibility; }
p,li,dd{ text-wrap: pretty; }
:is(h1, h2, h3, .section-title, .page-head__title, .proj-hero__title, .cf__title, .chap__t, .pc-stage__t, .ab-mission, .fi__name, .founder__name, .hero__title, .cta-band__title, .about-f__name, .tx__h, .legal2__sec h2){
  font-family: var(--lg-font-display); font-weight: 640; letter-spacing: -0.004em; text-wrap: balance; }
:is(h1, .page-head__title, .hero__title, .proj-hero__title){ letter-spacing: -0.01em; line-height: 1.04; }
:is(.section-title, .cf__title, .chap__t, .pc-stage__t){ line-height: 1.08; }
:is(.section-title, .page-head__title, .cf__title, .chap__t) .lt{ font-weight: inherit; color: inherit; display: inline; }
:is(.steps__out, .compare__table thead th, .vs__table td, .pk__table td, .arch2__tag, .cs-tech__h, .hx__lbl, .tlabel, .clogos__item small){ font-family: var(--lg-font-body); letter-spacing: 0; }
:is(.compare__table td, .vs__table td, .pk__table td)::before{ font-family: var(--lg-font-body); letter-spacing: 0; }
.page-head__lead,.section-intro,.proj-hero__summary{ max-width: 62ch; }
@media (max-width: 900px){
.scn__art--mini{ aspect-ratio: 600 / 300; max-width: 560px; margin-bottom: 4px; }
}
@keyframes scn-badge{ 0% { box-shadow: 0 0 0 0 rgba(204, 255, 0, 0.45); } 100% { box-shadow: 0 0 0 12px rgba(204, 255, 0, 0); } }
@media (max-width: 600px){
.fp__acc{ gap: 20px; }
.fp__acc li{ grid-template-columns: 32px minmax(0, 1fr); gap: 0 12px; align-items: center; }
.fp__acc .fp__ic{ width: 32px; height: 32px; border-radius: 9px; }
.fp__acc .fp__tx{ display: contents; }
.fp__acc .fp__tx b{ grid-column: 2; }
.fp__acc .fp__tx > span,.fp__acc .fp__link{ grid-column: 1 / -1; }
.fp__acc .fp__tx > span{ margin-top: 6px; max-width: none; }
.fp__acc .fp__link{ margin-top: 8px; }
.fp__intro{ max-width: none; }
.ab-founder .ab-founder__grid{ grid-template-columns: 112px minmax(0, 1fr); gap: 0 16px; }
.ab-founder .founder__figure{ grid-column: 1; grid-row: 1 / span 2; width: 112px; margin: 0; align-self: end; }
.ab-founder .fp{ display: contents; }
.ab-founder .fp > *{ grid-column: 1 / -1; }
.ab-founder .fp > .fp__name{ grid-column: 2 / -1; align-self: end; }
.ab-founder .fp > .fp__role{ grid-column: 2 / -1; align-self: start; margin-top: 6px; font-size: 0.9375rem; }
.ab-founder .fp > .fp__name{ grid-row: 1; }
.ab-founder .fp > .fp__role{ grid-row: 2; }
.fp__name{ font-size: clamp(1.625rem, 1.2rem + 2vw, 2rem); }
.fp > .fp__intro:first-of-type{ margin-top: 20px; }
.ab-founder .fp__cred{ margin-top: 24px; padding-top: 0; }
.ab-founder .fp{ padding-bottom: 0; }
}
@media (max-width: 760px){
.lg-logo,.crumbs a,.lg-link,.fp__link,.tx__cases a,.svc-pager__all,.site-footer__col a,.site-footer__legal a{ position: relative; }
.lg-logo::after,.crumbs a::after,.lg-link::after,.fp__link::after,.tx__cases a::after,.svc-pager__all::after,.site-footer__col a::after,.site-footer__legal a::after{ content: ''; position: absolute; inset: 50% -6px auto; height: 44px; transform: translateY(-50%); }
.inquiry__privacy .lg-link::after,p > .lg-link:not(:only-child)::after{ content: none; }
.site-footer .site-footer__cookie,.cg__open,.pk__more-btn,.faq-topics__nav a,.story__toc a,.choose__a{ min-height: 44px; }
}
.mobile-menu__direct{ display: grid; gap: 4px; margin-top: 16px; }
.mobile-menu__direct a{ display: flex; gap: 12px; align-items: center; min-height: 44px; color: var(--lg-text); font-weight: 600; text-decoration: none; }
.mobile-menu__direct .ico{ color: var(--lg-lime); flex: none; }
.scn,.pk-home{ padding-block: clamp(56px, 8vh, 96px); }
.cs-dec2__fig{ border-radius: 16px; }
.tx__logo--word.tx__logo,.tech__logo--word.tech__logo{ color: #FFFFFF; }
img.tx__logo--img,img.tech__logo--img{ filter: none; opacity: 1; }
.tx__name svg.tx__logo--word{ height: 22px; width: calc(22px * var(--ar, 1)); }
.tx__name img.tx__logo--img{ height: 19px; filter: none; }
.tech__logo{ flex: none; }
svg.tech__logo--word{ height: 14px; width: calc(14px * var(--ar, 1)); }
img.tech__logo--img{ height: 13px; width: auto; }
.troles svg.tech__logo--word{ height: 18px; width: calc(18px * var(--ar, 1)); }
.troles img.tech__logo--img{ height: 16px; width: auto; }
.tx__row--sub{ position: relative; padding-left: 20px; }
.tx__row--sub::before{ content: ""; position: absolute; left: 4px; top: -8px; bottom: 50%; width: 10px; border-left: 1px solid var(--lg-border-strong); border-bottom: 1px solid var(--lg-border-strong); border-bottom-left-radius: 6px; }
.cf-sec:has(.cf--v14){ padding-bottom: clamp(56px, 8vh, 96px); }
@media (max-width: 900px){
.scn.is-sticky .scn__stage{ display: block; position: sticky; top: var(--header-h); z-index: 3; height: auto; min-height: 0;
    padding: 12px 0 14px; background: var(--lg-bg); box-shadow: 0 0 0 100vmax var(--lg-bg); clip-path: inset(0 -100vmax); border-bottom: 1px solid var(--lg-border); }
.scn.is-sticky .scn__stage .scn__art{ max-width: 520px; margin: 0; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .rv-seq:not(.is-in) > *{ opacity: 0; translate: 0 14px; }
.js.motion .rv-seq.is-in > *{ transition: opacity 0.55s var(--lg-ease), translate 0.65s var(--lg-ease); transition-delay: calc(var(--si, 0) * 70ms); }
.faq__item[open] > :not(summary){ animation: fold-in 0.35s var(--lg-ease) both; }
:is(.pshow, .svx__btn, .faq__item > summary, .mnav__link, .tr__item, .fp__c, .hs__tab, .choose__a, .pcard, .next-proj a, .fp__pts .fp__link):active{ scale: 0.985; }
:is(.pshow, .svx__btn, .faq__item > summary, .mnav__link, .tr__item, .fp__c, .hs__tab, .choose__a, .pcard, .next-proj a){ transition: scale 0.15s var(--lg-ease); }
}
@keyframes fold-in{ from { opacity: 0; translate: 0 -6px; } to { opacity: 1; translate: 0 0; } }
.tx .tx__logo,.tech__chip .tech__logo,.troles .tech__logo{ color: #FFFFFF; fill: #FFFFFF; }
.tx .tx__name img.tx__logo--tall{ height: 34px; width: auto; aspect-ratio: auto; margin-block: -6px; }
.tech__chip img.tech__logo--tall{ height: 24px; width: auto; aspect-ratio: auto; margin-block: -5px; }
.troles img.tech__logo--tall{ height: 28px; width: auto; aspect-ratio: auto; }
@media (min-width: 761px){
.mshow__detail.mshow__detail--narrow{ width: max(26%, 160px); }
}
@keyframes hx-mk-in{ 0% { opacity: 0; transform: perspective(520px) rotateX(74deg) rotateZ(-12deg) scale(0.82); } 30% { opacity: 1; } 100% { opacity: 1; transform: none; } }
@keyframes hx-mk-turn{ from { transform: perspective(520px) rotateY(-180deg); } to { transform: perspective(520px) rotateY(0deg); } }
@keyframes hx-m-pop{ 0% { transform: scale(0.3); } 60% { transform: scale(1.2); } 100% { transform: none; } }
@keyframes hx-m-draw{ from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes hx-m-sig{ 0% { opacity: 1; stroke-dashoffset: 0.22; } 85% { opacity: 1; } 100% { opacity: 0; stroke-dashoffset: -1; } }
@keyframes hx-m-head{ 0% { transform: scale(0.5); fill: #3A3F45; } 60% { transform: scale(1.22); } 100% { transform: none; } }
@keyframes hx-m-ring{ 0% { opacity: 0; transform: scale(1); } 8% { opacity: 0.9; } 100% { opacity: 0; transform: scale(1.9); } }
.hl-k{ position: relative; white-space: nowrap; }
.hl-k::after{ content: ""; position: absolute; left: 0.02em; right: 0.04em; bottom: 0.02em; height: max(3px, 0.075em); border-radius: 2px; background: var(--lg-lime); transform-origin: left center; }
@media (prefers-reduced-motion: no-preference){
.js.motion:not(.hl-off) .hero:not(.hx-intro) .hl-k::after{ transform: scaleX(0); }
.js.motion:not(.hl-off) .hero.hx-intro .hl-k::after{ animation: hl-k-in 0.6s var(--lg-ease-draw) 1.25s both; }
}
@keyframes hl-k-in{ from { transform: scaleX(0); } to { transform: none; } }
.scn__art::before{ content: ""; position: absolute; inset: -5% -5% -3%; border-radius: clamp(16px, 4cqi, 28px); background: var(--lg-lime); }
@media (max-width: 900px){
.scn.is-sticky .scn__stage{ padding-block: 18px 16px; }
.scn__art--mini::before{ inset: -8px -10px -6px; border-radius: 18px; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .scn__art[data-s]{ transform-origin: 50% 60%; transition: transform 0.9s var(--lg-ease); }
.js.motion .scn__art[data-s="1"]{ transform: perspective(1200px) rotateX(24deg) rotateY(-16deg) rotateZ(1.5deg) scale(0.92); }
.js.motion .scn__art[data-s="2"]{ transform: perspective(1200px) rotateX(10deg) rotateY(13deg) scale(0.96); }
.js.motion .scn__art[data-s="3"]{ transform: perspective(1200px) rotateX(0deg) rotateY(0deg) scale(1); }
}
@keyframes scn-sig{ 0% { opacity: 1; stroke-dashoffset: 0.16; } 85% { opacity: 1; } 100% { opacity: 0; stroke-dashoffset: -1; } }
@media (prefers-reduced-motion: no-preference){
.js.motion [data-depth]{ transform-origin: 50% 100%; transform: perspective(1400px) rotateX(calc((1 - var(--d, 1)) * 16deg)) translateY(calc((1 - var(--d, 1)) * 48px)) scale(calc(0.94 + var(--d, 1) * 0.06)); }
}
.pk-mini--rec{ border-color: var(--lg-lime); box-shadow: 0 0 0 1px var(--lg-lime), 0 24px 48px -32px rgba(204, 255, 0, 0.35); }
.pk-mini__price{ position: relative; }
.pk-mini--rec .pk-mini__price::after{ content: ""; position: absolute; left: 0; bottom: -4px; width: 100%; max-width: 6.5em; height: 3px; border-radius: 2px; background: var(--lg-lime); transform-origin: left center; }
@media (prefers-reduced-motion: no-preference){
.js.motion .pk-home__grid:not(.is-in) .pk-mini--rec .pk-mini__price::after{ transform: scaleX(0); }
.js.motion .pk-home__grid.is-in .pk-mini--rec .pk-mini__price::after{ animation: hl-k-in 0.7s var(--lg-ease-draw) 0.5s both; }
}
.cf-sec{ background: var(--lg-lime); border-top: 0; padding-bottom: clamp(56px, 8vh, 96px); }
.site-footer{ border-top: 0; }
.svx__btn{ align-items: start; }
.svc-hero__prob{ display: grid; gap: 6px; max-width: 46ch; margin: 0 0 14px; padding-left: 14px; border-left: 2px solid var(--lg-lime); color: var(--lg-text); font-size: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem); line-height: 1.5; }
.svc-hero__pk{ font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--lg-lime); }
.lg-btn{ border-radius: var(--lg-radius-pill); padding-inline: 26px; }
.lg-btn .ico{ transition: transform var(--lg-dur-base) var(--lg-ease); }
@media (hover: hover){
.lg-btn:hover .ico{ transform: translateX(3px); }
}
.sheet{ --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); padding-block: clamp(72px, 10vw, 136px) clamp(80px, 11vw, 148px); border-radius: var(--sheet-r) var(--sheet-r) 0 0; border-top: 0; background: var(--lg-bg); isolation: isolate; }
.sheet--dark{ background: var(--lg-bg); box-shadow: 0 -1px 0 rgba(237, 239, 242, 0.08); }
.sheet--paper,.sheet--lime{
  --lg-text: #121418; --lg-text-muted: #4A515B; --lg-text-faint: #6B727C;
  --lg-border: rgba(18, 20, 24, 0.1); --lg-border-strong: rgba(18, 20, 24, 0.22); --rule: rgba(18, 20, 24, 0.14);
  --lg-surface-1: #FFFFFF; --lg-lime-line: #121418; color: var(--lg-text);
}
.sheet--paper{ background: #EEF0F3; }
.sheet--lime{ background: var(--lg-lime); --lg-text-muted: #2B3036; --lg-text-faint: #3A4048; --rule: rgba(18, 20, 24, 0.22); }
.hero.hero--v2{ padding-bottom: calc(clamp(56px, 8vw, 96px) + clamp(24px, 3vw, 40px)); }
.sheet.faq,.sheet.cf-sec{ border-top: 0; }
.sheet.cf-sec{ background: var(--lg-bg); padding-bottom: clamp(72px, 9vw, 120px); }
.sheet--pk .pk-home{ padding-block: 0; border: 0; background: none; }
.sh{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 34ch); gap: 18px clamp(32px, 6vw, 96px); align-items: end; margin-bottom: clamp(40px, 6vw, 72px); }
.sh__label{ grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 10px; margin: 0; font-size: 0.9375rem; font-weight: 600; color: var(--lg-text-muted); }
.sh__m{ width: 22px; height: 20px; overflow: visible; }
.sh__m path{ fill: none; stroke: currentColor; stroke-width: 12; stroke-linecap: round; stroke-linejoin: round; }
.sh__m circle{ fill: currentColor; }
.sh__m .sh__h{ fill: var(--lg-lime); }
.sheet--paper .sh__m .sh__h{ fill: #121418; }
.sheet--lime .sh__m .sh__h{ fill: #FFFFFF; stroke: #121418; stroke-width: 8; }
.sh__title{ margin: 0; font-family: var(--lg-font-display); font-size: clamp(2.6rem, 1.3rem + 5.2vw, 6.25rem); line-height: 0.98; font-weight: 640; letter-spacing: -0.035em; color: var(--lg-text); text-wrap: balance; }
.sh__l{ display: block; }
.sh__l--lt{ font-weight: 300; color: var(--lg-text-muted); }
.sh__side{ display: grid; gap: 16px; justify-items: start; padding-bottom: 0.4em; }
.sh__intro{ margin: 0; color: var(--lg-text-muted); font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem); line-height: 1.55; }
.sh__more{ display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-pill); color: var(--lg-text); font-weight: 600; font-size: 0.9375rem; text-decoration: none; transition: background-color var(--lg-dur-fast) var(--lg-ease), border-color var(--lg-dur-fast) var(--lg-ease), color var(--lg-dur-fast) var(--lg-ease); }
.sh__more:hover{ background: var(--lg-text); border-color: var(--lg-text); color: var(--lg-bg); }
.sheet--paper .sh__more:hover,.sheet--lime .sh__more:hover{ color: #FFFFFF; }
.sh__more:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@media (max-width: 860px){
.sh{ grid-template-columns: 1fr; align-items: start; }
.sh__side{ padding-bottom: 0; }
}
.srows{ margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.srow{ position: relative; display: grid; grid-template-columns: 56px minmax(0, 1.1fr) minmax(0, 1.2fr) minmax(0, 1fr) 48px; gap: 8px clamp(20px, 3vw, 48px); align-items: start; padding: clamp(22px, 3vw, 34px) 0; border-bottom: 1px solid var(--rule); }
.srow__n{ padding-top: 0.55em; color: var(--lg-text-faint); font-size: 0.875rem; }
.srow__t{ margin: 0; font-family: var(--lg-font-display); font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.5rem); line-height: 1.05; font-weight: 600; letter-spacing: -0.025em; }
.srow__a{ color: inherit; text-decoration: none; }
.srow__a::after{ content: ""; position: absolute; inset: 0; z-index: 1; }
.srow__a:focus-visible{ outline: none; }
.srow:has(.srow__a:focus-visible){ box-shadow: var(--lg-focus); border-radius: 8px; }
.srow__p{ margin: 0; padding-top: 0.35em; color: var(--lg-text); font-weight: 600; line-height: 1.45; }
.srow__s{ margin: 0; padding-top: 0.35em; color: var(--lg-text-muted); line-height: 1.5; font-size: 0.9375rem; }
.srow__go{ display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--lg-border-strong); border-radius: 50%; color: var(--lg-text); transition: background-color var(--lg-dur-base) var(--lg-ease), color var(--lg-dur-base) var(--lg-ease), transform var(--lg-dur-base) var(--lg-ease), border-color var(--lg-dur-base) var(--lg-ease); }
@media (hover: hover){
.srow__a{ text-decoration: underline 2px transparent; text-underline-offset: 6px; transition: text-decoration-color var(--lg-dur-base) var(--lg-ease); }
.srow:hover .srow__a{ text-decoration-color: currentColor; }
.srow:hover .srow__go{ background: #121418; border-color: #121418; color: var(--lg-lime); transform: rotate(-45deg); }
}
@media (max-width: 980px){
.srow{ grid-template-columns: 40px minmax(0, 1fr) 44px; }
.srow__n{ grid-row: 1; padding-top: 0.45em; }
.srow__t{ grid-column: 2; }
.srow__go{ grid-column: 3; grid-row: 1; }
.srow__p,.srow__s{ grid-column: 2 / -1; }
}
.pcards{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2vw, 24px); }
.pc{ position: relative; display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--lg-border); border-radius: 24px; background: var(--lg-surface-1); transition: border-color var(--lg-dur-base) var(--lg-ease); }
.pc--wide{ grid-column: 1 / -1; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); grid-template-rows: none; }
.pc__stage.pshow__stage{ border-radius: 0; box-shadow: none; }
.pc__meta{ display: grid; gap: 10px; align-content: start; padding: clamp(20px, 2.4vw, 32px); }
.pc--wide .pc__meta{ align-content: center; padding: clamp(28px, 3.4vw, 52px); }
.pc__t{ margin: 0; font-family: var(--lg-font-display); font-size: clamp(1.6rem, 1.1rem + 1.4vw, 2.4rem); line-height: 1.05; font-weight: 600; letter-spacing: -0.025em; }
.pc__a{ color: var(--lg-text); text-decoration: none; }
.pc__a::after{ content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; }
.pc__a:focus-visible{ outline: none; }
.pc:has(.pc__a:focus-visible){ box-shadow: var(--lg-focus); }
.pc__task{ margin: 0; color: var(--lg-text-muted); line-height: 1.55; max-width: 52ch; }
.pc__task b{ color: var(--lg-text); }
.pc__go{ display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; justify-self: start; padding: 9px 16px; border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-pill); font-weight: 600; font-size: 0.9375rem; transition: background-color var(--lg-dur-base) var(--lg-ease), color var(--lg-dur-base) var(--lg-ease), border-color var(--lg-dur-base) var(--lg-ease); }
@media (hover: hover){
.pc:hover{ border-color: rgba(204, 255, 0, 0.35); }
.pc:hover .pc__go{ background: var(--lg-lime); border-color: var(--lg-lime); color: #0D0F12; }
.pc .devs{ transition: transform 0.7s var(--lg-ease); }
.pc:hover .devs{ transform: translateY(-6px) scale(1.015); }
}
@media (max-width: 860px){
.pcards{ grid-template-columns: 1fr; }
.pc--wide{ grid-template-columns: 1fr; }
}
.pshow__stage--dev{
  background: radial-gradient(70% 55% at 50% -6%, rgba(204, 255, 0, 0.14), transparent 70%), radial-gradient(80% 50% at 50% 108%, rgba(237, 239, 242, 0.08), transparent 70%), linear-gradient(180deg, #1B1F25 0%, #101317 62%, #0B0D10 100%);
  isolation: isolate; }
.pshow__stage--dev::before{ content: ""; position: absolute; left: -30%; right: -30%; bottom: 0; height: 58%; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(237, 239, 242, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(237, 239, 242, 0.1) 1px, transparent 1px);
  background-size: 44px 44px; background-position: 50% 100%; transform: perspective(420px) rotateX(64deg); transform-origin: 50% 100%;
  -webkit-mask-image: linear-gradient(to top, #000 0%, transparent 85%); mask-image: linear-gradient(to top, #000 0%, transparent 85%); }
.pshow__stage--dev .devs{ position: relative; z-index: 1; }
.st4{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1.5px solid #121418; }
.st4__i{ display: grid; gap: 10px; align-content: start; padding: 24px clamp(16px, 2vw, 28px) 8px 0; }
.st4__i + .st4__i{ padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--rule); }
.st4__n{ font-size: 0.875rem; color: #121418; }
.st4__t{ margin: 0; font-family: var(--lg-font-display); font-size: clamp(1.5rem, 1.1rem + 1.1vw, 2.125rem); line-height: 1.05; font-weight: 640; letter-spacing: -0.025em; color: #121418; }
.st4__x{ margin: 0; color: #2B3036; line-height: 1.5; }
.st4__o{ display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 0; justify-self: start; padding: 6px 12px; border-radius: var(--lg-radius-pill); background: #121418; color: var(--lg-lime); font-size: 0.8125rem; font-weight: 700; }
@media (max-width: 980px){
.st4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st4__i:nth-child(3){ padding-left: 0; border-left: 0; }
.st4__i:nth-child(n + 3){ border-top: 1px solid var(--rule); }
}
@media (max-width: 560px){
.st4{ grid-template-columns: 1fr; }
.st4__i + .st4__i{ padding-left: 0; border-left: 0; border-top: 1px solid var(--rule); }
}
.pk-mini--rec{ background: linear-gradient(180deg, rgba(204, 255, 0, 0.07), rgba(204, 255, 0, 0) 42%), var(--lg-surface-1); }
.sheet--paper.faq .faq__grid{ grid-template-columns: 1fr; gap: 0; }
.sheet--paper .faq__list{ counter-reset: q; }
.sheet--paper .faq__item summary{ counter-increment: q; justify-content: flex-start; font-size: clamp(1.125rem, 1rem + 0.6vw, 1.5rem); padding: 24px 0; }
.sheet--paper .faq__item summary::before{ content: "(" counter(q, decimal-leading-zero) ")"; align-self: flex-start; padding-top: 0.35em; margin-right: 4px; font-family: var(--lg-font-mono); font-size: 0.75rem; font-weight: 500; color: var(--lg-text-faint); }
.sheet--paper .faq__icon{ margin-left: auto; background: #121418; border-color: #121418; }
.sheet--paper .faq__icon::before,.sheet--paper .faq__icon::after{ background: #FFFFFF; }
@media (hover: hover){
.sheet--paper .faq__item summary:hover .faq__icon{ background: var(--lg-lime); border-color: var(--lg-lime); }
.sheet--paper .faq__item summary:hover .faq__icon::before,.sheet--paper .faq__item summary:hover .faq__icon::after{ background: #121418; }
}
.sheet--paper .faq__a{ color: var(--lg-text-muted); }
.sheet--paper .faq__a .lg-link,.sheet--paper .faq__a a{ color: #121418; }
@media (prefers-reduced-motion: no-preference){
.js.motion [data-in]:not(.is-in){ opacity: 0; transform: translateY(32px); }
.js.motion [data-in]{ transition: opacity 0.8s var(--lg-ease), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1); transition-delay: calc(var(--i, 0) * 70ms); }
.js.motion .sh[data-in]:not(.is-in){ opacity: 1; transform: none; }
.js.motion .sh__l{ overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.js.motion .sh__l > span{ display: inline-block; transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1); }
.js.motion .sh__l--lt > span{ transition-delay: 0.09s; }
.js.motion .sh:not(.is-in) .sh__l > span{ transform: translateY(105%); }
.js.motion .sh__label,.js.motion .sh__side{ transition: opacity 0.7s var(--lg-ease) 0.2s, transform 0.8s var(--lg-ease) 0.2s; }
.js.motion .sh:not(.is-in) .sh__label,.js.motion .sh:not(.is-in) .sh__side{ opacity: 0; transform: translateY(14px); }
}
.section-title{ font-family: var(--lg-font-display); font-size: clamp(2.1rem, 1.2rem + 3.2vw, 4.25rem); line-height: 1.02; font-weight: 640; letter-spacing: -0.035em; }
:is(.section-title, .page-head__title) .lt{ font-weight: 300; color: var(--lg-text-muted); }
.sheet--paper .section-title .lt,.sheet--lime .section-title .lt{ color: var(--lg-text-muted); }
.srow{ grid-template-columns: 64px minmax(0, 1.05fr) minmax(0, 1.2fr) minmax(0, 1fr) 48px; align-items: center; }
.srow__h{ display: grid; gap: 6px; align-content: start; }
.srow__n{ padding-top: 0; }
.srow__p,.srow__s{ padding-top: 0; align-self: center; }
.srow__ic{ display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: #FFFFFF; border: 1px solid var(--lg-border); transition: background-color var(--lg-dur-base) var(--lg-ease), border-color var(--lg-dur-base) var(--lg-ease); }
@media (max-width: 980px){
.srow{ grid-template-columns: 52px minmax(0, 1fr) 44px; align-items: start; }
.srow__ic{ width: 52px; height: 52px; border-radius: 15px; grid-row: 1; }
.srow__h{ grid-column: 2; }
.srow__go{ grid-column: 3; grid-row: 1; }
.srow__p,.srow__s{ grid-column: 2 / -1; }
}
.si{ width: 40px; height: 40px; overflow: visible; --ink: #121418; }
@media (max-width: 980px){
.si{ width: 34px; height: 34px; }
}
.si .si-l,.si .si-l *{ fill: none; stroke: var(--ink); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.si .si-thin{ stroke-width: 1.6; opacity: 0.55; }
.si .si-dash{ stroke-dasharray: 2 4; stroke-width: 2; opacity: 0.7; }
.si .si-f{ fill: var(--ink); }
.si .si-a{ fill: var(--lg-lime); stroke: var(--ink); stroke-width: 2.2; stroke-linejoin: round; }
.si .si-a-l{ fill: none; stroke: var(--lg-lime); stroke-width: 4; stroke-linecap: round; }
.si .si-d{ fill: var(--ink); }
.si *{ transform-box: fill-box; transform-origin: center; }
.si--software .si-slash{ filter: drop-shadow(0 0 0.6px #121418) drop-shadow(0 0 0.6px #121418); }
@media (hover: hover){
.srow:hover .srow__ic{ background: #121418; border-color: #121418; }
.srow:hover .si{ --ink: #FFFFFF; }
.srow:hover .si .si-a{ stroke: #121418; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .srow.is-in .si *{ animation-duration: 1.8s; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-fill-mode: both; animation-delay: calc(var(--i, 0) * 90ms + 0.35s); animation-iteration-count: 1; }
@media (hover: hover){
.js.motion .srow.is-in:hover .si *{ animation-iteration-count: infinite; animation-delay: 0s; }
}
.js.motion .srow.is-in .si-drop{ animation-name: si-drop; }
.js.motion .srow.is-in .si-bag{ animation-name: si-bag; transform-origin: 50% 100%; }
.js.motion .srow.is-in .si-ln{ animation-name: si-ln; transform-origin: 0 50%; }
.js.motion .srow.is-in .si-ln2{ animation-name: si-ln2; }
.js.motion .srow.is-in .si-ln3{ animation-name: si-ln3; }
.js.motion .srow.is-in .si-btn{ animation-name: si-pop; }
.js.motion .srow.is-in .si-go{ animation-name: si-go; }
.js.motion .srow.is-in .si-back{ animation-name: si-back; }
.js.motion .srow.is-in .si-sync1{ animation-name: si-sync1; }
.js.motion .srow.is-in .si-sync2{ animation-name: si-sync2; }
.js.motion .srow.is-in .si-reply{ animation-name: si-reply; transform-origin: 80% 100%; }
.js.motion .srow.is-in .si-d1{ animation-name: si-dot1; }
.js.motion .srow.is-in .si-d2{ animation-name: si-dot2; }
.js.motion .srow.is-in .si-d3{ animation-name: si-dot3; }
.js.motion .srow.is-in .si-bl{ animation-name: si-bl; }
.js.motion .srow.is-in .si-br{ animation-name: si-br; }
.js.motion .srow.is-in .si-slash{ animation-name: si-slash; }
}
@keyframes si-drop{ 0% { opacity: 0; transform: translateY(-24px) rotate(-20deg); } 30% { opacity: 1; } 42% { transform: translateY(2px) rotate(0); } 50%, 100% { opacity: 1; transform: none; } }
@keyframes si-bag{ 0%, 40% { transform: none; } 47% { transform: scale(1.06, 0.92); } 56%, 100% { transform: none; } }
@keyframes si-ln{ 0% { transform: scaleX(0); } 22%, 100% { transform: none; } }
@keyframes si-ln2{ 0%, 10% { transform: scaleX(0); } 32%, 100% { transform: none; } }
@keyframes si-ln3{ 0%, 20% { transform: scaleX(0); } 40%, 100% { transform: none; } }
@keyframes si-pop{ 0%, 38% { opacity: 0; transform: scale(0.4); } 50% { opacity: 1; transform: scale(1.18); } 58%, 100% { opacity: 1; transform: none; } }
@keyframes si-go{ 0% { opacity: 0; transform: translateX(0); } 8% { opacity: 1; } 36%, 100% { transform: translateX(12px); opacity: 1; } }
@keyframes si-back{ 0%, 34% { opacity: 0; transform: translateX(0); } 40% { opacity: 1; } 66%, 100% { transform: translateX(-12px); opacity: 1; } }
@keyframes si-sync1{ 0% { opacity: 0; transform: translateX(0); } 8% { opacity: 1; } 40%, 100% { opacity: 1; transform: translateX(8px); } }
@keyframes si-sync2{ 0%, 28% { opacity: 0; transform: translateX(0); } 36% { opacity: 1; } 66%, 100% { opacity: 1; transform: translateX(-8px); } }
@keyframes si-reply{ 0%, 12% { opacity: 0; transform: scale(0.55); } 26% { opacity: 1; transform: scale(1.06); } 32%, 100% { opacity: 1; transform: none; } }
@keyframes si-dot1{ 0%, 30% { opacity: 0.2; } 38% { opacity: 1; transform: translateY(-2px); } 46%, 100% { opacity: 1; transform: none; } }
@keyframes si-dot2{ 0%, 38% { opacity: 0.2; } 46% { opacity: 1; transform: translateY(-2px); } 54%, 100% { opacity: 1; transform: none; } }
@keyframes si-dot3{ 0%, 46% { opacity: 0.2; } 54% { opacity: 1; transform: translateY(-2px); } 62%, 100% { opacity: 1; transform: none; } }
@keyframes si-bl{ 0% { transform: translateX(8px); opacity: 0; } 30%, 100% { transform: none; opacity: 1; } }
@keyframes si-br{ 0% { transform: translateX(-8px); opacity: 0; } 30%, 100% { transform: none; opacity: 1; } }
@keyframes si-slash{ 0%, 26% { opacity: 0; transform: rotate(-35deg) scale(0.6); } 42% { opacity: 1; transform: rotate(4deg) scale(1.05); } 50%, 100% { opacity: 1; transform: none; } }
.srow{ grid-template-columns: 72px minmax(0, 1.05fr) minmax(0, 1.2fr) minmax(0, 1fr) 48px; }
.srow__ic{ width: 72px; height: 72px; border-radius: 20px; }
.si{ width: 46px; height: 46px; }
@media (max-width: 980px){
.srow{ grid-template-columns: 56px minmax(0, 1fr) 44px; }
.srow__ic{ width: 56px; height: 56px; border-radius: 16px; }
.si{ width: 38px; height: 38px; }
}
.sheet.geo{ border-top: 0; }
.geo.is-offscreen :is(.me__arc, .me__ring),.is-paused :is(.me__arc, .me__ring){ animation-play-state: paused; }
.sheet--lime.cf-sec{ background: var(--lg-lime); }
.site-footer{ --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); padding-top: calc(56px + var(--sheet-r) * 0.4); border-radius: var(--sheet-r) var(--sheet-r) 0 0; background: #07080A; border-top: 1px solid rgba(237, 239, 242, 0.1); box-shadow: 0 -24px 48px -32px rgba(0, 0, 0, 0.6); }
main{ padding-bottom: clamp(24px, 3vw, 40px); }
.home20 main{ padding-bottom: 0; }
.cf20{ display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(16px, 2vw, 24px); align-items: start; }
.cf20__form{
  --lg-text: #EDEFF2; --lg-text-muted: #9BA3AE; --lg-text-faint: #7A828D; --lg-border: rgba(237, 239, 242, 0.08); --lg-border-strong: rgba(237, 239, 242, 0.16);
  --rule: rgba(237, 239, 242, 0.12); --lg-surface-1: #13161A; --lg-lime-line: rgba(204, 255, 0, 0.45); --pad: clamp(22px, 3vw, 40px);
  color: var(--lg-text); background: #0D0F12; border-radius: 28px; padding: var(--pad); box-shadow: 0 40px 80px -48px rgba(13, 15, 18, 0.7); }
.cf20__form .inquiry{ padding: 0; border: 0; }
.cf20__k{ margin: 0 0 8px; font-size: 0.875rem; font-weight: 600; color: var(--lg-lime); }
.cf20__t{ margin: 0 0 22px; font-family: var(--lg-font-display); font-size: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem); line-height: 1.05; font-weight: 640; letter-spacing: -0.025em; }
.cf20__t .lt{ font-weight: 300; color: var(--lg-text-muted); }
.cf20__side{ display: grid; gap: 22px; padding: var(--pad, clamp(22px, 3vw, 40px)); background: #FFFFFF; border-radius: 28px; color: #121418; }
.cf20__who{ display: flex; align-items: center; gap: 14px; }
.cf20__who img{ width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 18%; background: #121418; }
.cf20__who p{ display: grid; margin: 0; line-height: 1.3; }
.cf20__who b{ font-size: 1.125rem; }
.cf20__who span{ color: #4A515B; font-size: 0.9375rem; }
.cf20__h{ margin: 0; font-family: var(--lg-font-display); font-size: 1.5rem; font-weight: 640; letter-spacing: -0.02em; }
.cf20__steps{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(18, 20, 24, 0.14); }
.cf20__steps li{ display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; padding: 14px 0; border-bottom: 1px solid rgba(18, 20, 24, 0.14); }
.cf20__steps .mono{ padding-top: 2px; font-size: 0.8125rem; color: #6B727C; }
.cf20__steps p{ margin: 0; display: grid; gap: 2px; color: #4A515B; line-height: 1.45; }
.cf20__steps b{ color: #121418; }
.cf20__side .ways .ico{ color: #121418; }
@media (max-width: 980px){
.cf20{ grid-template-columns: 1fr; }
}
.pc{ grid-template-rows: auto auto 1fr; }
.pc--wide{ grid-template-rows: auto 1fr; }
.pc--wide .pc__bar{ grid-column: 1 / -1; }
.pc__bar{ display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px 14px clamp(18px, 2vw, 24px); border-bottom: 1px solid var(--lg-border); }
.pc__type{ color: var(--lg-text-muted); font-size: 0.875rem; font-weight: 600; }
.pc__type i{ font-style: normal; color: var(--lg-lime); padding-inline: 4px; }
.pc__pill{ display: grid; place-items: center; width: 48px; height: 32px; border: 1px solid var(--lg-border-strong); border-radius: var(--lg-radius-pill); color: var(--lg-text); transition: background-color var(--lg-dur-base) var(--lg-ease), color var(--lg-dur-base) var(--lg-ease), border-color var(--lg-dur-base) var(--lg-ease); }
@media (hover: hover){
.pc:hover .pc__pill{ background: var(--lg-lime); border-color: var(--lg-lime); color: #0D0F12; }
}
.hero--v2::before{ content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(237, 239, 242, 0.13) 1px, transparent 1.2px); background-size: 22px 22px; background-position: 50% 0;
  -webkit-mask-image: radial-gradient(75% 70% at 60% 40%, #000 20%, transparent 75%); mask-image: radial-gradient(75% 70% at 60% 40%, #000 20%, transparent 75%); }
@font-face{ font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/onest-cyrillic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/onest-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root{
  --lg-font-display: 'Onest', 'Segoe UI', system-ui, sans-serif;
  --lg-font-body: 'Onest', 'Segoe UI', system-ui, sans-serif;
}
body{ font-family: var(--lg-font-body); font-feature-settings: "ss01" 0; letter-spacing: -0.005em; }
.sh__title,.section-title,.page-head__title,.svc-hero__title,.srow__t,.pc__t,.st4__t,.cf20__t,.cf20__h,.proj-hero__title{ font-weight: 600; letter-spacing: -0.045em; }
.sh__title{ font-size: clamp(2.4rem, 1.2rem + 4.6vw, 5.6rem); line-height: 0.98; }
.sh__l--lt,:is(.section-title, .page-head__title, .svc-hero__title, .hero__title, .cf20__t) .lt{ font-weight: 300; }
.sheet--pk .pk-home__grid{ gap: 0; margin-top: 0; border-top: 1px solid var(--lg-border-strong); border-bottom: 1px solid var(--lg-border-strong); align-items: stretch; }
.sheet--pk .pk-mini{ gap: 14px; padding: clamp(24px, 2.6vw, 36px) clamp(20px, 2.4vw, 32px) clamp(24px, 2.6vw, 32px); border: 0; border-radius: 0; background: none; box-shadow: none; }
.sheet--pk .pk-mini + .pk-mini{ border-left: 1px solid var(--lg-border-strong); }
.sheet--pk .pk-mini__name{ font-family: var(--lg-font-display); font-size: 1.5rem; font-weight: 600; letter-spacing: -0.03em; }
.sheet--pk .pk-mini__fit{ min-height: 2.9em; color: var(--lg-text-muted); }
.sheet--pk .pk__price b{ font-family: var(--lg-font-display); font-size: clamp(3rem, 2rem + 2.6vw, 4.5rem); line-height: 1; font-weight: 600; letter-spacing: -0.05em; }
.sheet--pk .pk__price span{ color: var(--lg-text-muted); }
.sheet--pk .pk-mini__list{ padding-top: 14px; border-top: 1px solid var(--lg-border); }
.sheet--pk .pk-mini__btn{ margin-top: 6px; }
.sheet--pk .pk-mini--rec{
  --lg-text: #121418; --lg-text-muted: #2B3036; --lg-text-faint: #3A4048; --lg-border: rgba(18, 20, 24, 0.18); --lg-border-strong: rgba(18, 20, 24, 0.3); --lg-info: #121418;
  position: relative; z-index: 1; margin-block: -14px; padding-block: calc(clamp(24px, 2.6vw, 36px) + 14px); border-radius: 24px; border: 0 !important; background: var(--lg-lime); color: #121418; box-shadow: none; }
.sheet--pk .pk-mini--rec + .pk-mini{ border-left: 0; }
.sheet--pk .pk-mini--rec .pk__badge{ position: static; justify-self: start; order: -1; margin: 0 0 -4px; background: #121418; color: var(--lg-lime); }
.sheet--pk .pk-mini--rec .ico{ color: #121418; }
.sheet--pk .pk-mini--rec .pk__price::after{ background: #121418; }
.sheet--pk .pk-mini--rec .lg-btn--primary{ background: #121418; border-color: #121418; color: var(--lg-lime); }
.sheet--pk .pk-mini--rec .lg-btn--primary:hover{ background: #000000; }
.sheet--pk .pk-mini--rec .pk__more-btn{ color: #121418; }
@media (max-width: 980px){
.sheet--pk .pk-home__grid{ border-bottom: 0; }
.sheet--pk .pk-mini + .pk-mini{ border-left: 0; border-top: 1px solid var(--lg-border-strong); }
.sheet--pk .pk-mini--rec{ margin-block: 8px; }
.sheet--pk .pk-mini--rec + .pk-mini{ border-top: 0; }
}
.pk-start,.pk-start--compact{ background: none; border: 0; border-top: 1px solid var(--lg-border-strong); border-radius: 0; padding: 22px 0 0; }
.pk-start__icon{ background: none; }
.pk-mini--rec{ background-image: none; }
.pshow__stage--dev{ background: #15181C; }
.hk{ padding-block: clamp(32px, 6vh, 72px) calc(clamp(48px, 7vw, 88px) + clamp(24px, 3vw, 40px)); }
.hk__title{ margin: 0; display: grid; gap: 0.06em; font-family: var(--lg-font-display); font-size: clamp(2.15rem, 0.6rem + 7.2vw, 8.4rem); line-height: 0.92; font-weight: 700; letter-spacing: -0.05em; text-transform: uppercase; color: var(--lg-text); }
.hk__line{ display: flex; align-items: center; gap: 0.18em; white-space: nowrap; }
.hk__line--2{ padding-left: 0.9em; }
.hk__line--3{ padding-left: 0.2em; }
.hk__line--4{ padding-left: 2.1em; }
.hk__tag{ display: inline-block; align-self: center; margin-inline: 0.4em; font-size: clamp(0.8125rem, 0.55rem + 0.45vw, 1.125rem); line-height: 1.2; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--lg-text-muted); white-space: normal; }
.hk__tag--l{ text-align: right; order: -1; }
.hk__tile{ position: relative; display: inline-grid; place-items: center; flex: none; width: 0.9em; height: 0.9em; border-radius: 0.16em; background: #1D2126; overflow: hidden; }
.hk__tile--code{ background: var(--lg-lime); }
.hk__tile--shop{ background: #FFFFFF; }
.hk__tile .si,.hk__tile .hkm{ width: 62%; height: 62%; }
.hk__tile--code .si{ --ink: #121418; }
.hk__tile--shop .si{ --ink: #121418; }
.hk__tile--code .si .si-a-l{ stroke: #FFFFFF; }
.hk__tile--code .si--software .si-slash{ filter: none; }
.hk .hl-k::after{ height: max(4px, 0.06em); bottom: -0.02em; }
.hk__foot{ display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; margin-top: clamp(28px, 4vw, 56px); }
.hk__claim{ margin: 0; font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem); font-weight: 600; line-height: 1.3; }
.hk__claim span{ display: block; font-weight: 300; color: var(--lg-text-muted); }
.hk .hero__actions{ margin: 0; }
.hkm{ overflow: visible; }
.hkm__e{ fill: none; stroke: #EDEFF2; stroke-width: 12; stroke-linecap: round; stroke-dasharray: 1; }
.hkm__n{ fill: #EDEFF2; }
.hkm__h{ fill: var(--lg-lime); }
.hkm *{ transform-box: fill-box; transform-origin: center; }
@media (max-width: 860px){
.hk__tag{ display: none; }
.hk__title{ font-size: clamp(2rem, 10.4vw, 4.5rem); }
.hk__line--2{ padding-left: 0.4em; }
.hk__line--3{ padding-left: 0; }
.hk__line--4{ padding-left: 0.8em; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .hk__tile{ animation: hk-tile-in 0.8s cubic-bezier(0.2, 0.9, 0.2, 1.2) both; }
.js.motion .hk__line--1 .hk__tile{ animation-delay: 0.15s; }
.js.motion .hk__line--2 .hk__tile{ animation-delay: 0.3s; }
.js.motion .hk__line--3 .hk__tile{ animation-delay: 0.45s; }
.js.motion .hk__tag{ animation: hk-tag-in 0.8s var(--lg-ease) 0.5s both; }
.js.motion .hk .si *,.js.motion .hkm *{ animation-duration: 3.8s; animation-iteration-count: infinite; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-fill-mode: both; }
.js.motion .hk .si-drop{ animation-name: si-drop; animation-delay: 0.9s; }
.js.motion .hk .si-bag{ animation-name: si-bag; animation-delay: 0.9s; transform-origin: 50% 100%; }
.js.motion .hk .si-bl{ animation-name: si-bl; animation-delay: 0.7s; }
.js.motion .hk .si-br{ animation-name: si-br; animation-delay: 0.7s; }
.js.motion .hk .si-slash{ animation-name: si-slash; animation-delay: 0.7s; }
.js.motion .hkm__n--a{ animation-name: hkm-node; animation-delay: 0.4s; }
.js.motion .hkm__n--b{ animation-name: hkm-node; animation-delay: 0.5s; }
.js.motion .hkm__e{ animation-name: hkm-edge; animation-delay: 0.55s; }
.js.motion .hkm__h{ animation-name: hkm-head; animation-delay: 0.55s; }
.hk.is-offscreen .hk__tile *,.is-paused .hk__tile *,.is-hidden .hk__tile *{ animation-play-state: paused; }
}
@keyframes hk-tile-in{ from { opacity: 0; transform: scale(0.4) rotate(-12deg); } to { opacity: 1; transform: none; } }
@keyframes hk-tag-in{ from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes hkm-node{ 0% { transform: scale(0); } 10% { transform: scale(1.2); } 16%, 100% { transform: none; } }
@keyframes hkm-edge{ 0%, 10% { stroke-dashoffset: 1; } 28%, 100% { stroke-dashoffset: 0; } }
@keyframes hkm-head{ 0%, 24% { transform: scale(0); } 34% { transform: scale(1.3); } 42%, 70% { transform: none; } 78% { transform: scale(1.12); } 86%, 100% { transform: none; } }
.hk__w{ display: inline-flex; align-items: baseline; }
.srows__note{ margin: 18px 0 0; font-size: 0.875rem; color: var(--lg-text-muted); }
.adv .sh__intro{ color: #2B3036; }
.cf20__side .ways{ display: grid; grid-template-columns: 1fr; gap: 8px; }
.cf20__side .ways > li,.cf20__side .ways a{ width: 100%; min-width: 0; }
.srow__a:focus-visible{ outline: 2px solid #121418; outline-offset: 6px; border-radius: 6px; }
.pc__a:focus-visible{ outline: 2px solid var(--lg-lime); outline-offset: 6px; border-radius: 6px; }
.lg-btn{ position: relative; gap: 12px; padding-inline: 24px; border-radius: var(--lg-radius-pill); font-weight: 600; letter-spacing: -0.01em; box-shadow: none; transition: background-color 0.35s var(--lg-ease), color 0.35s var(--lg-ease), border-color 0.35s var(--lg-ease), transform 0.2s var(--lg-ease); }
.lg-btn:has(> .ico:last-child){ padding-right: 7px; }
.lg-btn > .ico:last-child{ box-sizing: border-box; width: 34px; height: 34px; padding: 8px; border-radius: 50%; flex: none; transition: transform 0.45s cubic-bezier(0.7, 0, 0.2, 1), background-color 0.35s var(--lg-ease), color 0.35s var(--lg-ease); }
.lg-btn:active{ transform: scale(0.97); }
.lg-btn--primary,.lg-btn--primary:hover,.lg-btn--primary:active{ background: #EDEFF2; color: #0D0F12; box-shadow: none; }
.lg-btn--primary > .ico:last-child{ background: #0D0F12; color: var(--lg-lime); }
.lg-btn--primary:hover{ background: #FFFFFF; transform: none; }
.lg-btn--secondary,.lg-btn--secondary:hover{ background: transparent; color: var(--lg-text); border-color: var(--lg-border-strong); }
.lg-btn--secondary:hover{ border-color: var(--lg-text); }
.lg-btn--secondary > .ico:last-child{ background: var(--lg-surface-2, #1A1D20); color: var(--lg-text); }
:is(.sheet--paper, .sheet--lime, .cf20__side) .lg-btn--primary{ background: #121418; color: #FFFFFF; }
:is(.sheet--paper, .sheet--lime, .cf20__side) .lg-btn--primary > .ico:last-child{ background: var(--lg-lime); color: #121418; }
:is(.sheet--paper, .sheet--lime, .cf20__side) .lg-btn--primary:hover{ background: #000000; }
.sheet--pk .pk-mini--rec .lg-btn--primary{ background: #121418; color: #FFFFFF; }
.sheet--lime .cf20__form .lg-btn--primary{ background: #EDEFF2; color: #0D0F12; }
.sheet--lime .cf20__form .lg-btn--primary > .ico:last-child{ background: #0D0F12; color: var(--lg-lime); }
.site-header .site-header__cta,.site-header .site-header__cta:hover{ --_h: 42px; background: #EDEFF2; color: #0D0F12; border-color: #EDEFF2; }
.b-roll{ position: relative; display: inline-block; overflow: hidden; vertical-align: top; line-height: 1.25; }
.b-roll > span{ display: block; }
.b-roll > span + span{ position: absolute; left: 0; right: 0; top: 100%; }
@media (prefers-reduced-motion: no-preference){
.b-roll > span{ transition: transform 0.5s cubic-bezier(0.7, 0, 0.2, 1); }
:is(.lg-btn, .sh__more, .site-header__cta):is(:hover, :focus-visible) .b-roll > span{ transform: translateY(-100%); }
.lg-btn:is(:hover, :focus-visible) > .ico:last-child{ transform: rotate(-45deg); }
}
.hk{ padding-bottom: calc(clamp(48px, 7vw, 88px) + clamp(24px, 3vw, 40px) + 64px); }
.hk__cta{ display: grid; gap: 10px; justify-items: end; }
.hk__micro{ margin: 0; font-size: 0.8125rem; color: var(--lg-text-faint); }
@media (max-width: 860px){
.hk__cta{ justify-items: start; }
}
.dd{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: clamp(40px, 5vw, 64px); border-top: 1.5px solid #121418; }
.dd__col{ padding: 24px clamp(16px, 2vw, 28px) 0 0; }
.dd__col--no{ padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--rule); }
.dd__h{ margin: 0 0 14px; font-family: var(--lg-font-display); font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.875rem); font-weight: 600; letter-spacing: -0.03em; color: #121418; }
.dd__list{ display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.dd__list li{ display: flex; gap: 10px; align-items: flex-start; color: #121418; line-height: 1.45; }
.dd__list .ico{ flex: none; margin-top: 3px; }
.dd__col--no .dd__list li{ color: #2B3036; }
@media (max-width: 760px){
.dd{ grid-template-columns: 1fr; }
.dd__col--no{ padding-left: 0; border-left: 0; border-top: 1px solid var(--rule); margin-top: 24px; }
}
.pc__big{ display: grid; gap: 2px; margin: 4px 0 2px; }
.pc__big b{ font-family: var(--lg-font-display); font-size: clamp(2.6rem, 1.8rem + 2.4vw, 4rem); line-height: 1; font-weight: 600; letter-spacing: -0.05em; color: var(--lg-lime); }
.pc__big span{ color: var(--lg-text-muted); font-size: 0.9375rem; }
.cf20__cap{ margin: 0; padding: 12px 14px; border-radius: 14px; background: #F1F2F4; color: #2B3036; font-size: 0.9375rem; line-height: 1.45; }
.dock{ display: none; }
@media (max-width: 760px){
.dock{ display: block; position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 60; transform: translateY(140%); opacity: 0; pointer-events: none; transition: transform 0.45s cubic-bezier(0.2, 0.9, 0.2, 1), opacity 0.3s var(--lg-ease); }
.dock.is-on{ transform: none; opacity: 1; pointer-events: auto; }
.dock__btn{ width: 100%; justify-content: space-between; --_h: 54px; box-shadow: 0 14px 30px -12px rgba(0, 0, 0, 0.6); }
.menu-open .dock{ display: none; }
}
.pcards .pc{ padding: 0; }
.lg-btn--primary,.lg-btn--primary:hover,.lg-btn--primary:active{ background: var(--lg-lime); color: #0D0F12; border-color: var(--lg-lime); }
.lg-btn--primary > .ico:last-child{ background: #0D0F12; color: var(--lg-lime); }
.lg-btn--primary:hover{ background: #D8FF33; }
.sheet--lime .lg-btn--primary,.sheet--pk .pk-mini--rec .lg-btn--primary{ background: #121418; color: #FFFFFF; border-color: #121418; }
.sheet--lime .lg-btn--primary > .ico:last-child,.sheet--pk .pk-mini--rec .lg-btn--primary > .ico:last-child{ background: var(--lg-lime); color: #121418; }
.sheet--lime .lg-btn--primary:hover{ background: #000000; }
:is(.sheet--paper, .cf20__side) .lg-btn--primary,.sheet--lime .cf20__form .lg-btn--primary{ background: var(--lg-lime); color: #0D0F12; border-color: var(--lg-lime); }
:is(.sheet--paper, .cf20__side) .lg-btn--primary > .ico:last-child,.sheet--lime .cf20__form .lg-btn--primary > .ico:last-child{ background: #0D0F12; color: var(--lg-lime); }
.sheet--paper .lg-btn--primary{ box-shadow: inset 0 0 0 1px rgba(18, 20, 24, 0.12); }
.site-header .site-header__cta,.site-header .site-header__cta:hover{ background: var(--lg-lime); color: #0D0F12; border-color: var(--lg-lime); }
.nav__link::after{ height: 2px; bottom: 4px; }
.nav__link:hover::after,.nav__link[aria-current="page"]::after{ transform: scaleX(1); }
.lmq{ position: relative; overflow: hidden; margin: calc(clamp(72px, 10vw, 136px) * -0.45) 0 clamp(48px, 6vw, 88px); padding-block: 8px; border-bottom: 1px solid var(--rule);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.lmq__track{ display: flex; align-items: center; gap: clamp(48px, 7vw, 112px); width: max-content; margin: 0; padding: 18px 0 26px; list-style: none; }
.lmq__i a{ display: grid; place-items: center; height: 48px; opacity: 0.8; transition: opacity var(--lg-dur-base) var(--lg-ease); }
.lmq__i a:hover{ opacity: 1; }
.lmq__img{ width: auto; height: 34px; max-width: 220px; object-fit: contain; filter: grayscale(1) brightness(0.15); }
.lmq__img--tall{ height: 48px; }
@media (prefers-reduced-motion: no-preference){
.js .lmq__track{ animation: lmq 24s linear infinite; }
.lmq:hover .lmq__track,.lmq:focus-within .lmq__track{ animation-play-state: paused; }
}
@media (prefers-reduced-motion: reduce){
.lmq__track{ flex-wrap: wrap; width: auto; justify-content: center; }
.lmq__i:nth-child(n + 5){ display: none; }
}
@keyframes lmq{ to { transform: translateX(-50%); } }
.srow__k{ display: block; margin-bottom: 6px; font-family: var(--lg-font-body); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #B4232A; }
.srow__k--ok{ color: #2F6B00; }
.srow__k::before{ content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: currentColor; vertical-align: 1px; }
.srow__s{ color: var(--lg-text); }
.st6 .st4{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.st6 .st4__i:nth-child(4){ padding-left: 0; border-left: 0; }
.st6 .st4__i:nth-child(n + 4){ border-top: 1px solid var(--rule); padding-top: 26px; }
@media (max-width: 980px){
.st6 .st4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st6 .st4__i:nth-child(odd){ padding-left: 0; border-left: 0; }
.st6 .st4__i:nth-child(even){ padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--rule); }
.st6 .st4__i:nth-child(n + 3){ border-top: 1px solid var(--rule); }
}
@media (max-width: 560px){
.st6 .st4{ grid-template-columns: 1fr; }
.st6 .st4__i:nth-child(n){ padding-left: 0; border-left: 0; }
.st6 .st4__i + .st4__i{ border-top: 1px solid var(--rule); }
}
.hourx{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px clamp(28px, 5vw, 72px); margin-top: clamp(32px, 4vw, 56px); padding-top: clamp(24px, 3vw, 36px); border-top: 1px solid var(--lg-border-strong); }
.hourx__t{ grid-column: 1; margin: 0; font-family: var(--lg-font-display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.25rem); line-height: 1.1; font-weight: 600; letter-spacing: -0.035em; }
.hourx__lead{ grid-column: 1; margin: 0; color: var(--lg-text-muted); line-height: 1.55; }
.hourx__list{ grid-column: 2; grid-row: 1 / span 3; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--lg-border); }
.hourx__list li{ display: flex; gap: 12px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--lg-border); }
.hourx__list .ico{ flex: none; margin-top: 3px; color: var(--lg-lime); }
.hourx__note{ grid-column: 1; margin: 0; padding: 12px 14px; border-left: 2px solid var(--lg-lime); color: var(--lg-text); font-size: 0.9375rem; line-height: 1.5; }
@media (max-width: 860px){
.hourx{ grid-template-columns: 1fr; }
.hourx__list,.hourx__t,.hourx__lead,.hourx__note{ grid-column: 1; grid-row: auto; }
}
@keyframes fh-sun{ from { transform: scale(0.3); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fh-ring{ from { transform: scale(0.7); opacity: 0; } to { transform: none; opacity: 0.5; } }
.geo24{ padding-block: clamp(64px, 8vw, 104px); }
.geo24__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.geo24__t{ margin: 10px 0 22px; font-family: var(--lg-font-display); font-size: clamp(2rem, 1.2rem + 2.6vw, 3.5rem); line-height: 1; font-weight: 600; letter-spacing: -0.045em; }
.geo24__t .lt{ display: block; font-weight: 300; color: var(--lg-text-muted); }
.geo24__facts{ display: grid; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--lg-border); }
.geo24__facts li{ display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--lg-border); }
.geo24__facts b{ color: var(--lg-text-muted); font-weight: 500; }
.geo24__map .me{ max-width: 560px; margin-inline: auto; }
@media (max-width: 860px){
.geo24__grid{ grid-template-columns: 1fr; }
}
.site-footer__bottom p{ color: var(--lg-text-faint); }
.site-footer__quote{ color: var(--lg-text-muted); }
.site-footer__big{ margin-top: 28px; padding-bottom: 8px; opacity: 0.09; }
.site-footer__big svg{ display: block; width: 100%; height: auto; }
.pc__col--ok,.pc__col--warn{ background: var(--lg-surface-1); }
.pc__col--ok{ border-color: rgba(95, 211, 154, 0.35); box-shadow: inset 0 3px 0 rgba(95, 211, 154, 0.7); }
.pc__col--warn{ border-color: rgba(255, 181, 71, 0.35); box-shadow: inset 0 3px 0 rgba(255, 181, 71, 0.7); }
.pk__card--rec{ background: var(--lg-surface-1); box-shadow: 0 0 0 1px var(--lg-lime); }
.ab-eq__end{ background: var(--lg-surface-1); }
.proj-devs,.related__visual--dev,.next-proj__visual--dev{ background: #15181C; }
.ab-tl{ padding-block: clamp(64px, 9vw, 120px); }
.ab-tl__list{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: clamp(32px, 4vw, 56px) 0 0; padding: 0; list-style: none; border-top: 1.5px solid var(--lg-lime); }
.ab-tl__i{ position: relative; display: grid; gap: 10px; align-content: start; padding: 26px clamp(16px, 2vw, 28px) 0 0; }
.ab-tl__i + .ab-tl__i{ padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--lg-border); }
.ab-tl__i::before{ content: ""; position: absolute; top: -7px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--lg-lime); }
.ab-tl__i + .ab-tl__i::before{ left: clamp(16px, 2vw, 28px); }
.ab-tl__y{ color: var(--lg-lime); font-size: 0.875rem; }
.ab-tl__i h3{ margin: 0; font-family: var(--lg-font-display); font-size: clamp(1.375rem, 1.1rem + 0.9vw, 1.875rem); line-height: 1.1; font-weight: 600; letter-spacing: -0.03em; }
.ab-tl__i p{ margin: 0; color: var(--lg-text-muted); line-height: 1.55; }
@media (max-width: 980px){
.ab-tl__list{ grid-template-columns: 1fr 1fr; }
.ab-tl__i:nth-child(3){ padding-left: 0; border-left: 0; }
.ab-tl__i:nth-child(3)::before{ left: 0; }
.ab-tl__i:nth-child(n + 3){ margin-top: 28px; }
}
@media (max-width: 560px){
.ab-tl__list{ grid-template-columns: 1fr; }
.ab-tl__i + .ab-tl__i{ padding-left: 0; border-left: 0; margin-top: 28px; }
.ab-tl__i + .ab-tl__i::before{ left: 0; }
}
body:not(.home20) :is(.page-head, .svc-hero, .proj-hero, .cs-hero){ position: relative; isolation: isolate; }
body:not(.home20) :is(.page-head, .svc-hero, .proj-hero, .cs-hero)::before{ content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(237, 239, 242, 0.12) 1px, transparent 1.2px); background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(70% 80% at 70% 30%, #000 15%, transparent 75%); mask-image: radial-gradient(70% 80% at 70% 30%, #000 15%, transparent 75%); }
.page-head__title{ font-family: var(--lg-font-display); font-size: clamp(2.6rem, 1.3rem + 5vw, 6rem); line-height: 0.96; font-weight: 600; letter-spacing: -0.05em; }
body:not(.home20) main > section:nth-of-type(even):not(.cta-band):not(.sheet--paper):not(.sheet){ --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); border-radius: var(--sheet-r) var(--sheet-r) 0 0; border-top: 0; background: #121519; box-shadow: 0 -1px 0 rgba(237, 239, 242, 0.08); }
body:not(.home20) main > section:nth-of-type(odd):not(:first-of-type):not(.cta-band):not(.sheet):not(.sheet--paper){ --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); border-radius: var(--sheet-r) var(--sheet-r) 0 0; border-top: 0; background: var(--lg-bg); box-shadow: 0 -1px 0 rgba(237, 239, 242, 0.08); }
body:not(.home20) main > section{ padding-bottom: calc(clamp(56px, 8vh, 96px) + clamp(24px, 3vw, 40px)); }
.cta-band{
  --lg-text: #121418; --lg-text-muted: #2B3036; --lg-text-faint: #3A4048; --lg-border: rgba(18, 20, 24, 0.14); --lg-border-strong: rgba(18, 20, 24, 0.3);
  --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); border-radius: var(--sheet-r) var(--sheet-r) 0 0; border-top: 0;
  background: var(--lg-lime); color: #121418; padding-block: clamp(64px, 9vw, 120px) calc(clamp(64px, 9vw, 120px) + var(--sheet-r)); }
.cta-band__title{ font-family: var(--lg-font-display); font-size: clamp(2rem, 1.2rem + 3vw, 4rem); line-height: 1; font-weight: 600; letter-spacing: -0.045em; color: #121418; }
.cta-band .lg-btn--primary{ background: #121418; color: #FFFFFF; border-color: #121418; }
.cta-band .lg-btn--primary > .ico:last-child{ background: var(--lg-lime); color: #121418; }
.cta-band__note{ color: #2B3036; }
main > :not(section):has(+ .cta-band){ padding-bottom: calc(clamp(24px, 3vw, 40px) + 40px); }
.lang-sw{ display: inline-flex; align-items: center; gap: 4px; margin-left: auto; margin-right: 14px; }
.lang-sw a{ padding: 6px 6px; font-size: 0.875rem; font-weight: 500; color: var(--lg-text-muted); text-decoration: none; border-radius: 6px; }
.lang-sw a[aria-current="true"]{ color: var(--lg-text); font-weight: 700; }
.lang-sw a:hover{ color: var(--lg-lime); }
.lang-sw a:focus-visible{ outline: none; box-shadow: var(--lg-focus); }
@media (max-width: 1080px){
.lang-sw{ margin-right: 8px; }
}
.nav + .lang-sw{ margin-left: 18px; }
.en .me__legend{ display: none; }
.en-cta{ display: flex; flex-wrap: wrap; align-items: center; gap: 14px 16px; }
.en-cta p{ flex-basis: 100%; margin: 6px 0 0; color: #2B3036; }
.en-cta p a{ color: #121418; font-weight: 600; }
.sheet--lime .en-cta .lg-btn--secondary{ color: #121418; border-color: rgba(18, 20, 24, 0.4); }
.site-footer__en{ display: grid; gap: 14px; justify-items: start; padding-block: 8px 28px; }
.site-footer__en p{ margin: 0; max-width: 60ch; color: var(--lg-text-muted); }
.site-footer__en-ways{ display: flex; flex-wrap: wrap; gap: 10px 22px; }
.site-footer__en-ways a{ display: inline-flex; align-items: center; gap: 8px; color: var(--lg-text); text-decoration: none; }
.hk{ padding-bottom: calc(clamp(48px, 7vw, 88px) + clamp(24px, 3vw, 40px)); }
@media (prefers-reduced-motion: no-preference){
.js.motion .hk .si *,.js.motion .hkm *{ animation-iteration-count: 2; }
.js.motion .hk__tile:hover *{ animation-iteration-count: infinite; }
.js.motion .geo .me__arc,.js.motion .geo .me__ring{ animation-iteration-count: 3; }
}
@media (prefers-reduced-motion: no-preference){
.js.motion .hk .si *,.js.motion .hkm *{ animation-iteration-count: infinite; }
.js.motion .srows .srow.is-in .si *{ animation-iteration-count: infinite; animation-duration: 3.6s; }
.srows.is-offscreen .si *,.is-hidden .srows .si *{ animation-play-state: paused; }
}
.geo24__facts a{ color: var(--lg-text); text-decoration: underline; text-decoration-color: var(--lg-border-strong); text-underline-offset: 4px; }
.geo24__facts a:hover{ text-decoration-color: var(--lg-lime); }
.fh2{ padding-block: clamp(64px, 8vw, 104px) calc(clamp(64px, 8vw, 104px) + clamp(24px, 3vw, 40px)); }
.fh2__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.fh2__t{ margin: 10px 0 18px; font-family: var(--lg-font-display); font-size: clamp(2rem, 1.2rem + 2.6vw, 3.5rem); line-height: 1; font-weight: 600; letter-spacing: -0.045em; text-transform: uppercase; }
.fh2__t .lt{ display: block; font-weight: 300; color: var(--lg-text-muted); text-transform: none; letter-spacing: -0.035em; }
.fh2__lead{ margin: 0 0 26px; max-width: 48ch; color: var(--lg-text-muted); line-height: 1.6; }
.fh2__card{ position: relative; padding-top: clamp(24px, 3vw, 40px); }
.fh2__photo{ position: absolute; right: -8px; top: -40px; width: clamp(150px, 15vw, 230px); margin: 0; pointer-events: none; }
.fh2__photo img{ position: relative; width: 100%; height: auto; }
.fh2__shape{ position: absolute; left: -38%; top: 6%; width: 176%; transform: rotate(-9deg); }
.fh2__shape path{ stroke: #1E2227; }
.fh2__shape circle{ fill: #1E2227; }
.fh2__shape .fh2__head{ fill: var(--lg-lime); }
.fh2__name{ margin: 0; padding-right: clamp(150px, 16vw, 240px); font-family: var(--lg-font-display); font-size: clamp(1.75rem, 1.3rem + 1.4vw, 2.6rem); line-height: 1.05; font-weight: 600; letter-spacing: -0.035em; }
.fh2__role{ margin: 6px 0 22px; padding-right: clamp(150px, 16vw, 240px); color: var(--lg-lime); font-weight: 600; }
.fh2__pts{ display: grid; gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; }
.fh2__pts li{ display: flex; gap: 12px; align-items: flex-start; line-height: 1.45; }
.fh2__ok{ display: grid; place-items: center; flex: none; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; background: var(--lg-lime); color: #0D0F12; }
@media (max-width: 860px){
.fh2__grid{ grid-template-columns: 1fr; }
.fh2__card{ padding-top: 0; }
.fh2__photo{ position: relative; right: auto; top: auto; width: 180px; margin: 0 0 20px 24px; }
.fh2__name,.fh2__role{ padding-right: 0; }
}
.fh2__card{ display: grid; grid-template-columns: minmax(0, 1fr) clamp(140px, 13vw, 200px); column-gap: clamp(16px, 2vw, 28px); align-items: end; padding-top: 0; }
.fh2__photo{ position: relative; right: auto; top: auto; grid-column: 2; grid-row: 1 / span 2; width: 100%; margin: 0 0 18px; }
.fh2__shape{ left: -22%; top: 14%; width: 140%; }
.fh2__name{ grid-column: 1; grid-row: 1; padding-right: 0; }
.fh2__role{ grid-column: 1; grid-row: 2; padding-right: 0; margin-bottom: 26px; }
.fh2__pts,.fh2__card > .sh__more{ grid-column: 1 / -1; }
.fh2__card > .sh__more{ justify-self: start; }
.fh2__pts{ padding-top: 20px; border-top: 1px solid var(--lg-border); }
@media (max-width: 860px){
.fh2__card{ grid-template-columns: minmax(0, 1fr) 130px; }
.fh2__photo{ width: 100%; margin: 0 0 14px; }
}
.fh2__card{ grid-template-rows: 1fr auto; }
.fh2__name{ align-self: end; }
.fh2__role{ align-self: start; margin-top: 6px; }
.fh2__shape{ left: -8%; top: 4%; width: 116%; }
.section-head .section-head__k{ grid-column: 1 / -1; margin: 0 0 4px; }
@media (prefers-reduced-motion: no-preference){
.js.motion .section-head[data-in]:not(.is-in){ opacity: 0; transform: translateY(24px); }
}
.asvc-list{ border-top: 1px solid var(--lg-border-strong); }
.asvc{ display: grid; grid-template-columns: 88px minmax(0, 1.2fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 18px clamp(24px, 4vw, 64px); padding-block: clamp(40px, 5vw, 72px); border-bottom: 1px solid var(--lg-border-strong); }
.asvc__top{ grid-row: 1 / span 2; display: grid; gap: 14px; align-content: start; }
.asvc__n{ color: var(--lg-text-faint); font-size: 0.875rem; }
.asvc__top .srow__ic{ width: 64px; height: 64px; border-radius: 18px; background: #FFFFFF; }
.asvc__t{ margin: 0 0 14px; font-family: var(--lg-font-display); font-size: clamp(2.4rem, 1.4rem + 3.4vw, 5rem); line-height: 0.98; font-weight: 600; letter-spacing: -0.05em; }
.asvc__t a{ color: inherit; text-decoration: none; }
.asvc__t a:hover{ color: var(--lg-lime); }
.asvc__sub{ margin: 0 0 18px; max-width: 44ch; color: var(--lg-text-muted); font-size: clamp(1.0625rem, 0.95rem + 0.5vw, 1.375rem); line-height: 1.45; }
.asvc__prob{ margin: 0; max-width: 52ch; color: var(--lg-text); line-height: 1.5; }
.asvc__prob .srow__k{ color: #FF8A80; }
.asvc__list{ grid-column: 3; grid-row: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; align-content: start; margin: 0; padding: 12px 0 0; list-style: none; color: var(--lg-text-muted); }
.asvc__list li{ display: flex; gap: 10px; align-items: baseline; line-height: 1.4; }
.asvc__st{ color: var(--lg-lime); font-size: 0.9375rem; }
.asvc__go{ grid-column: 3; grid-row: 2; align-self: end; justify-self: start; display: inline-flex; align-items: center; gap: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--lg-text); color: var(--lg-text); font-weight: 500; text-decoration: none; transition: color var(--lg-dur-fast) var(--lg-ease), border-color var(--lg-dur-fast) var(--lg-ease); }
.asvc__go:hover{ color: var(--lg-lime); border-color: var(--lg-lime); }
.asvc__go .ico{ transition: transform var(--lg-dur-base) var(--lg-ease); }
.asvc__go:hover .ico{ transform: translate(2px, -2px); }
@media (prefers-reduced-motion: no-preference){
.js.motion .asvc.is-in .si *{ animation-iteration-count: infinite; animation-duration: 3.6s; animation-fill-mode: both; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); }
.js.motion .asvc.is-in .si-drop{ animation-name: si-drop; }
.js.motion .asvc.is-in .si-bag{ animation-name: si-bag; transform-origin: 50% 100%; }
.js.motion .asvc.is-in .si-ln{ animation-name: si-ln; transform-origin: 0 50%; }
.js.motion .asvc.is-in .si-ln2{ animation-name: si-ln2; }
.js.motion .asvc.is-in .si-ln3{ animation-name: si-ln3; }
.js.motion .asvc.is-in .si-btn{ animation-name: si-pop; }
.js.motion .asvc.is-in .si-go{ animation-name: si-go; }
.js.motion .asvc.is-in .si-back{ animation-name: si-back; }
.js.motion .asvc.is-in .si-sync1{ animation-name: si-sync1; }
.js.motion .asvc.is-in .si-sync2{ animation-name: si-sync2; }
.js.motion .asvc.is-in .si-reply{ animation-name: si-reply; transform-origin: 80% 100%; }
.js.motion .asvc.is-in .si-d1{ animation-name: si-dot1; }
.js.motion .asvc.is-in .si-d2{ animation-name: si-dot2; }
.js.motion .asvc.is-in .si-d3{ animation-name: si-dot3; }
.js.motion .asvc.is-in .si-bl{ animation-name: si-bl; }
.js.motion .asvc.is-in .si-br{ animation-name: si-br; }
.js.motion .asvc.is-in .si-slash{ animation-name: si-slash; }
}
@media (max-width: 980px){
.asvc{ grid-template-columns: 1fr; }
.asvc__top{ grid-row: auto; display: flex; align-items: center; justify-content: space-between; }
.asvc__list,.asvc__go{ grid-column: 1; grid-row: auto; }
}
@media (max-width: 560px){
.asvc__list{ grid-template-columns: 1fr; }
}
body:not(.home20) main > section.sheet--paper:not(.sheet){
  --sheet-r: clamp(24px, 3vw, 40px); position: relative; margin-top: calc(var(--sheet-r) * -1); border-radius: var(--sheet-r) var(--sheet-r) 0 0; border-top: 0;
  --lg-bg: #EEF0F3; --lg-surface-1: #FFFFFF; --lg-surface-2: #F6F7F9; --lg-surface-3: #E4E7EB; --lg-lime-dim: rgba(18, 20, 24, 0.06);
  --lg-lime-on-light: #121418; --lg-ok: #1F7A4D; --lg-ok-dim: rgba(31, 122, 77, 0.1); --lg-info: #2F5A86; --lg-info-dim: rgba(47, 90, 134, 0.1); --lg-info-line: rgba(47, 90, 134, 0.3);
  background: #EEF0F3; color: var(--lg-text);
}
body:not(.home20) main > section.sheet--paper:is(.sheet){ background: #EEF0F3; }
body:not(.home20) main > section.sheet--paper :is(.pc-stage__icon, .pc-flow__out .ico, .cs-flow__arrow, .wg__arrow, .imp__arrow, .pk-start__icon, .pk-start__list .ico, .cs-scope .ico, .cs-live__card .ico, .ab-story__icon, .fp__ic, .scope__n, .ab-tl__y, .fp__name, .pc__type i, .cs-live__facts b){ color: #121418; }
body:not(.home20) main > section.sheet--paper :is(.vs__table, .pk__table) thead th{ color: var(--lg-text); }
body:not(.home20) main > section.sheet--paper :is(.fit__not, .pc__h) .ico{ color: #A15C00; }
body:not(.home20) main > section.sheet--paper .asvc__prob .srow__k{ color: #B4232A; }
body:not(.home20) main > section.sheet--paper :is(.tr .tr__logo, .tx .tx__logo, .tech__chip .tech__logo, .troles .tech__logo, .tr__logo--word, .tx__logo--word, .tech__logo--word):not(img){ color: #121418; fill: #121418; }
body:not(.home20) main > section.sheet--paper img:is(.tx__logo--img, .tech__logo--img, .tr__logo--img){ filter: invert(1) hue-rotate(180deg); }
.founder__figure--halo{ aspect-ratio: auto; isolation: isolate; }
.founder__figure--halo .fh2__shape{ position: absolute; left: -6%; top: 6%; width: 112%; height: auto; transform: rotate(-6deg); z-index: -1; }
.founder__figure--halo img{ position: relative !important; inset: auto; height: auto !important; opacity: 1 !important; transform: none !important; }
.sheet--paper .founder__figure--halo .fh2__shape :is(path){ stroke: #D3D8DE; }
.sheet--paper .founder__figure--halo .fh2__shape circle:not(.fh2__head){ fill: #D3D8DE; }
.sheet--paper .founder__figure--halo .fh2__head{ fill: var(--lg-lime); }