/* ═══════════════════════════════════════════════════════════════
   4i-САЙТ Design System — Monochrome Terminal Aesthetic
   PROMArTech | 4i.promartech.ru
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Tektur:wght@400;500;600;700&family=DotGothic16&family=Press+Start+2P&family=Geist+Mono:wght@400;500;600;700&display=swap');

:root {
  --bg: #0A0A0A;
  --bg-secondary: #111111;
  --fg: #FAFAFA;
  --muted: #737373;
  --border: #262626;
  --accent: #DC2626;
  --live: #22C55E;
  --font-pixel: 'Tektur', sans-serif;
  --font-mono: 'Geist Mono', 'JetBrains Mono', monospace;
  --font-label: 'DotGothic16', monospace;
  --font-decor: 'Press Start 2P', monospace;
  --max-w: 1280px;
}
body.gantry { background: var(--bg); color: var(--fg); font-family: var(--font-mono); }

/* NAV */
.g-nav-4i{position:sticky;top:0;z-index:50;transition:all .3s;background:transparent;border-bottom:1px solid transparent}
.g-nav-4i--scrolled{background:rgba(10,10,10,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom-color:var(--border)}
.g-nav-4i__inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px}
.g-nav-4i__brand{display:inline-flex;align-items:center;background:var(--fg);padding:2px 8px;font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.05em;color:var(--bg);border:none;cursor:pointer;transition:opacity .2s;text-decoration:none}
.g-nav-4i__brand:hover{opacity:.8}
.g-nav-4i__links{display:none;align-items:center;gap:4px;margin-left:32px;flex:1}
.g-nav-4i__link{padding:6px 12px;font-family:var(--font-mono);font-size:12px;color:var(--muted);background:none;border:none;cursor:pointer;transition:all .2s;text-decoration:none;white-space:nowrap}
.g-nav-4i__link:hover,.g-nav-4i__link--active{background:var(--fg);color:var(--bg)}
.g-nav-4i__link-num{opacity:.5}
.g-nav-4i__burger{display:flex;padding:8px;font-family:var(--font-mono);color:var(--fg);background:none;border:none;cursor:pointer;transition:all .2s}
.g-nav-4i__burger:hover{background:var(--fg);color:var(--bg)}
.g-nav-4i__mobile{display:none;flex-direction:column;gap:4px;padding:16px;border-bottom:1px solid var(--border);background:rgba(10,10,10,.95);backdrop-filter:blur(12px)}
.g-nav-4i__mobile--open{display:flex}
.g-nav-4i__mobile .g-nav-4i__link{text-align:left;font-size:14px;padding:8px 12px}
@media(min-width:1024px){.g-nav-4i__links{display:flex}.g-nav-4i__burger{display:none}}

/* HERO */
.g-hero-4i{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:100px 16px 80px}
.g-hero-4i__scanline{position:absolute;top:0;left:0;right:0;height:2px;background:rgba(250,250,250,.05);z-index:10;pointer-events:none;animation:scanline 4s linear infinite}
@keyframes scanline{0%{top:0}100%{top:100%}}
.g-hero-4i__content{position:relative;z-index:20;max-width:var(--max-w);width:100%;margin:0 auto;display:flex;flex-direction:column;gap:24px;padding:0 24px}
.g-hero-4i__badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);padding:6px 12px}
.g-hero-4i__badge-dot{display:inline-block;width:6px;height:6px;background:var(--fg)}
.g-hero-4i__badge-text{font-family:var(--font-mono);font-size:12px;letter-spacing:.05em;color:var(--muted)}
.g-hero-4i__title{font-family:var(--font-pixel);font-size:clamp(2.76rem,5vw,4.83rem);font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--fg)}
.g-hero-4i__row{display:flex;flex-direction:column;gap:32px}
@media(min-width:1024px){.g-hero-4i__row{flex-direction:row;gap:24px}}
.g-hero-4i__col{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.g-hero-4i__desc{font-family:var(--font-mono);font-size:16px;line-height:1.6;color:var(--muted)}
.g-hero-4i__desc-sm{font-family:var(--font-mono);font-size:14px;line-height:1.6;color:var(--muted)}
.g-hero-4i__ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.g-hero-4i__cta{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;font-family:var(--font-mono);font-size:14px;text-decoration:none;transition:all .2s;white-space:nowrap}
.g-hero-4i__cta--outline{border:1px solid var(--border);color:var(--muted)}
.g-hero-4i__cta--outline:hover{border-color:var(--fg);color:var(--fg)}
.g-hero-4i__cta--fill{border:1px solid var(--fg);background:var(--fg);color:var(--bg)}
.g-hero-4i__cta--fill:hover{background:transparent;color:var(--fg)}
.g-hero-4i__bottom{position:absolute;bottom:32px;display:flex;flex-direction:column;align-items:center;gap:8px}
.g-hero-4i__bottom-text{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.2em;color:var(--muted)}
.g-hero-4i__bottom-line{width:1px;height:16px;background:var(--muted);animation:bounce-y 1.5s ease-in-out infinite}
@keyframes bounce-y{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* TERMINAL */
.g-terminal{border:1px solid var(--border);background:rgba(17,17,17,.3)}
.g-terminal__header{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border);padding:8px 12px}
.g-terminal__dot{width:8px;height:8px;border-radius:0}
.g-terminal__dot--fg{background:var(--fg)}
.g-terminal__dot--muted{background:rgba(115,115,115,.5)}
.g-terminal__dot--dim{background:rgba(115,115,115,.3)}
.g-terminal__path{margin-left:8px;font-family:var(--font-mono);font-size:12px;color:var(--fg)}
.g-terminal__ver{font-family:var(--font-mono);font-size:12px;color:rgba(115,115,115,.5);margin-left:auto}
.g-terminal__body{padding:16px;overflow-y:auto}
.g-terminal__body--scroll{max-height:400px}
.g-terminal__line{font-family:var(--font-mono);font-size:12px;line-height:1.5;color:var(--muted);white-space:pre-wrap;word-break:break-word}
.g-terminal__line--cmd{color:var(--fg)}
.g-terminal__line--accent{color:var(--accent)}

/* INTERACTIVE TERMINAL */
.g-iterminal{border:1px solid var(--border);background:rgba(17,17,17,.3);min-height:260px}
.g-iterminal__header{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border);padding:8px 12px}
.g-iterminal__body{height:calc(100% - 36px);min-height:224px;overflow-y:auto;padding:12px}
.g-iterminal__line{font-family:var(--font-mono);font-size:12px;line-height:1.5;color:var(--muted)}
.g-iterminal__line--input{color:var(--fg)}
.g-iterminal__prompt{display:flex;align-items:center;font-family:var(--font-mono);font-size:12px;color:var(--fg);position:relative}
.g-iterminal__prompt-cursor{animation:blink 1s step-end infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.g-iterminal__input{position:absolute;inset:0;width:100%;height:100%;border:none;background:transparent;opacity:0;cursor:default;outline:none}

/* TICKER */
.g-ticker{overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:12px 0}
.g-ticker__track{display:flex;gap:32px;white-space:nowrap;animation:ticker-scroll 30s linear infinite}
.g-ticker__item{font-family:var(--font-mono);font-size:14px;color:var(--muted)}
.g-ticker__sep{margin-left:32px;color:var(--border)}
@keyframes ticker-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* SECTION COMMON */
.g-section-4i{position:relative;border-bottom:1px solid var(--border)}
.g-section-4i__inner{max-width:var(--max-w);margin:0 auto;padding:80px 16px}
@media(min-width:1024px){.g-section-4i__inner{padding:128px 32px}}

/* SECTION HEADER (inverted) */
.g-section-header{background:var(--fg);color:var(--bg);padding:32px;margin-bottom:16px}
.g-section-header__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.g-section-header__left{display:flex;align-items:flex-end;gap:24px}
.g-section-header__num{font-family:var(--font-pixel);font-size:clamp(3rem,6vw,6rem);font-weight:700;line-height:1;color:rgba(10,10,10,.15)}
.g-section-header__info{padding-bottom:8px}
.g-section-header__label{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:rgba(10,10,10,.5)}
.g-section-header__title{font-family:var(--font-pixel);font-size:clamp(1.5rem,3vw,3rem);font-weight:700;color:var(--bg);margin-top:8px}
.g-section-header__live{display:flex;align-items:center;gap:8px}
.g-section-header__live-dot{width:10px;height:10px;background:var(--bg);animation:pulse-dot 2s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.5}}
.g-section-header__live-text{font-family:var(--font-mono);font-size:12px;color:rgba(10,10,10,.7)}
.g-section-header__desc{max-width:640px;font-family:var(--font-mono);font-size:16px;line-height:1.6;color:rgba(10,10,10,.6);margin-top:16px}

/* TERM BLOCK */
.g-term-block{border:1px solid var(--border);overflow:hidden}
.g-term-block__grid{display:grid}
@media(min-width:1024px){.g-term-block__grid{grid-template-columns:1fr 1fr}}
.g-term-block__left{border-bottom:1px solid var(--border)}
@media(min-width:1024px){.g-term-block__left{border-bottom:none;border-right:1px solid var(--border)}}
.g-term-block__subheader{border-bottom:1px solid var(--border);padding:8px 16px}
.g-term-block__sublabel{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.g-term-block__content{padding:24px}

/* SPEC CARDS */
.g-specs{display:grid;gap:12px}
.g-specs--2col{grid-template-columns:1fr}
@media(min-width:640px){.g-specs--2col{grid-template-columns:1fr 1fr}}
.g-spec{display:flex;align-items:flex-start;gap:8px}
.g-spec__icon{margin-top:2px;font-family:var(--font-mono);font-size:14px;color:var(--fg)}
.g-spec__label{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--fg)}
.g-spec__value{font-family:var(--font-mono);font-size:12px;color:var(--muted)}

/* CTA STRIP */
.g-cta-strip{border-top:1px solid var(--border);padding:16px}
.g-cta-strip__inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.g-cta-strip__text{font-family:var(--font-mono);font-size:14px;color:var(--muted)}
.g-cta-strip__btn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font-family:var(--font-mono);font-size:12px;color:var(--muted);border:1px solid var(--border);background:none;cursor:pointer;transition:all .2s;text-decoration:none}
.g-cta-strip__btn:hover{border-color:var(--fg);color:var(--fg)}

/* EVOLUTION (4i-concept) */
.g-evolution{display:flex;flex-direction:column;gap:4px}
.g-evolution__item{display:flex;align-items:flex-start;gap:16px;padding:12px 16px;border-radius:4px;transition:background .2s}
.g-evolution__item:hover{background:rgba(250,250,250,.03)}
.g-evolution__item--active{background:var(--fg);color:var(--bg)}
.g-evolution__gen{font-family:var(--font-mono);font-size:14px;font-weight:700;min-width:32px}
.g-evolution__item--active .g-evolution__gen{color:var(--bg)}
.g-evolution__item:not(.g-evolution__item--active) .g-evolution__gen{color:rgba(115,115,115,.5)}
.g-evolution__name{font-family:var(--font-pixel);font-size:14px;font-weight:700}
.g-evolution__desc{font-family:var(--font-mono);font-size:12px;line-height:1.5;margin-top:2px}
.g-evolution__item--active .g-evolution__desc{color:rgba(10,10,10,.7)}
.g-evolution__item:not(.g-evolution__item--active) .g-evolution__desc{color:var(--muted)}
.g-evolution__dot{width:8px;height:8px;margin-top:6px}
.g-evolution__item--active .g-evolution__dot{background:var(--bg);animation:pulse-dot 2s ease-in-out infinite}
.g-evolution__item:not(.g-evolution__item--active) .g-evolution__dot{background:rgba(115,115,115,.2)}

/* PIPELINE TABS */
.g-pipeline-tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid var(--border)}
.g-pipeline-tab{flex:1;min-width:80px;padding:10px 16px;font-family:var(--font-mono);font-size:12px;color:var(--muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .2s;text-align:center}
.g-pipeline-tab:hover{color:var(--fg)}
.g-pipeline-tab--active{color:var(--fg);border-bottom-color:var(--fg);background:rgba(250,250,250,.03)}
.g-pipeline-panel{display:none;padding:24px}
.g-pipeline-panel--active{display:block}

/* BRIDGE TOGGLES */
.g-bridge-layer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border:1px solid var(--border);margin-bottom:8px}
.g-bridge-layer__info{flex:1}
.g-bridge-layer__title{font-family:var(--font-pixel);font-size:14px;font-weight:700;color:var(--fg)}
.g-bridge-layer__desc{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-top:4px}
.g-bridge-toggle{padding:6px 16px;font-family:var(--font-mono);font-size:12px;font-weight:600;border:1px solid var(--fg);cursor:pointer;transition:all .2s}
.g-bridge-toggle--on{background:var(--fg);color:var(--bg)}
.g-bridge-toggle--off{background:transparent;color:var(--fg)}

/* ACCORDION */
.g-accordion{border:1px solid var(--border)}
.g-accordion__item{border-bottom:1px solid var(--border)}
.g-accordion__item:last-child{border-bottom:none}
.g-accordion__header{display:flex;align-items:center;justify-content:space-between;padding:16px;cursor:pointer;transition:background .2s}
.g-accordion__header:hover{background:rgba(250,250,250,.03)}
.g-accordion__title{font-family:var(--font-pixel);font-size:14px;font-weight:700;color:var(--fg)}
.g-accordion__arrow{transition:transform .2s;color:var(--muted);font-size:12px}
.g-accordion__item--open .g-accordion__arrow{transform:rotate(180deg)}
.g-accordion__body{display:none;padding:0 16px 16px}
.g-accordion__item--open .g-accordion__body{display:block}

/* PRICING */
.g-pricing{display:grid;gap:16px;margin-top:48px}
@media(min-width:768px){.g-pricing{grid-template-columns:repeat(3,1fr)}}
.g-pricing__card{border:1px solid var(--border);padding:24px}
.g-pricing__card--popular{border-color:var(--fg);background:var(--fg);color:var(--bg)}
.g-pricing__name{font-family:var(--font-pixel);font-size:18px;font-weight:700}
.g-pricing__price{font-family:var(--font-mono);font-size:14px;margin-top:8px}
.g-pricing__price-value{font-family:var(--font-pixel);font-size:28px;font-weight:700}
.g-pricing__for{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-top:8px}
.g-pricing__card--popular .g-pricing__for{color:rgba(10,10,10,.6)}
.g-pricing__badge{display:inline-block;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;background:var(--accent);color:var(--fg);padding:2px 8px;margin-bottom:8px}
.g-pricing__features{list-style:none;padding:0;margin-top:16px}
.g-pricing__features li{font-family:var(--font-mono);font-size:12px;padding:4px 0}
.g-pricing__features li::before{content:"\2713 ";color:var(--live)}
.g-pricing__card--popular .g-pricing__features li::before{color:var(--bg)}

/* OPTIM */
.g-optim-grid{display:grid;gap:16px}
@media(min-width:768px){.g-optim-grid{grid-template-columns:1fr 1fr}}
.g-optim-status{display:flex;align-items:center;gap:8px;padding:8px 0}
.g-optim-status__label{font-family:var(--font-mono);font-size:12px;color:var(--muted)}
.g-optim-status__value{font-family:var(--font-mono);font-size:12px;font-weight:600}
.g-optim-status__value--active{color:var(--live)}
.g-optim-status__value--standby{color:var(--muted)}

/* FOOTER */
.g-footer-4i{border-top:1px solid var(--border)}
.g-footer-4i__inner{max-width:var(--max-w);margin:0 auto;padding:48px 16px 24px}
.g-footer-4i__top{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;margin-bottom:32px}
.g-footer-4i__brand{font-family:var(--font-label);font-size:14px;color:var(--fg)}
.g-footer-4i__link{font-family:var(--font-mono);font-size:12px;color:var(--muted);text-decoration:none;transition:color .2s}
.g-footer-4i__link:hover{color:var(--fg)}
.g-footer-4i__bottom{border-top:1px solid var(--border);padding-top:16px;display:flex;justify-content:space-between;align-items:center}
.g-footer-4i__copy{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.g-footer-4i__top-btn{font-family:var(--font-mono);font-size:12px;color:var(--muted);background:none;border:1px solid var(--border);padding:6px 12px;cursor:pointer;transition:all .2s}
.g-footer-4i__top-btn:hover{border-color:var(--fg);color:var(--fg)}

/* UTILS */
.g-mono{font-family:var(--font-mono)}.g-pixel{font-family:var(--font-pixel)}.g-label{font-family:var(--font-label)}.g-decor{font-family:var(--font-decor)}
.g-fg{color:var(--fg)}.g-muted{color:var(--muted)}.g-border{border-color:var(--border)}
.g-grid-2{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:640px){.g-grid-2{grid-template-columns:1fr 1fr}}
.g-mt-4{margin-top:16px}.g-mt-8{margin-top:32px}
.g-pt{padding-top:12px;border-top:1px solid var(--border)}
.g-ascii{font-family:var(--font-mono);font-size:12px;line-height:1.4;color:var(--muted);white-space:pre;overflow-x:auto}
.g-ascii--invert{color:rgba(10,10,10,.6)}
.g-reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.g-reveal.is-visible{opacity:1;transform:translateY(0)}