/* ============================================================================
   ВЕТЕРАН PRO — landing variant B. Dark glass / tactical: warm OLED-ish black,
   coral + olive (the app's own palette scaled up), frosted glass cards, glow.
   Shares HTML + copy with variant A; only the styling differs.
   ============================================================================ */

@font-face { font-family:'e-Ukraine'; src:url('../assets/fonts/e-Ukraine/e-Ukraine-Light.otf') format('opentype'); font-weight:300; font-display:swap; }
@font-face { font-family:'e-Ukraine'; src:url('../assets/fonts/e-Ukraine/e-Ukraine-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'e-Ukraine'; src:url('../assets/fonts/e-Ukraine/e-Ukraine-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }
@font-face { font-family:'e-Ukraine'; src:url('../assets/fonts/e-Ukraine/e-Ukraine-Bold.otf') format('opentype'); font-weight:700; font-display:swap; }

:root{
  --bg:#13110d; --bg2:#1b1813; --glass:rgba(245,241,234,.045); --glass2:rgba(245,241,234,.07);
  --ink:#f4f0e9; --ink-soft:#a79f93; --ink-faint:#6f675b;
  --line:rgba(245,241,234,.1); --line-soft:rgba(245,241,234,.06);
  --olive:#c7c07f; --olive-2:#b0a85f; --olive-soft:rgba(199,192,127,.14);
  --coral:#e8633a; --coral-2:#ff7a4d; --coral-soft:rgba(232,99,58,.16);
  --espresso:#0e0c09;
  --ease:cubic-bezier(.16,1,.3,1); --ease2:cubic-bezier(.32,.72,0,1);
  --maxw:1180px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'e-Ukraine',system-ui,sans-serif;font-weight:400;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
/* ambient warm orbs */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(50% 40% at 80% 0%,rgba(199,192,127,.1),transparent 60%),radial-gradient(40% 35% at 10% 80%,rgba(232,99,58,.08),transparent 60%);}
body::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;position:relative;z-index:1;}
section{position:relative;z-index:1;}

h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.025em;line-height:1.02;}
.display{font-size:clamp(2.6rem,6.4vw,5rem);}
.h2{font-size:clamp(2rem,4.4vw,3.3rem);letter-spacing:-.02em;line-height:1.05;}
.h3{font-size:clamp(1.25rem,2vw,1.6rem);letter-spacing:-.01em;line-height:1.12;}
em{font-style:normal;color:var(--coral);}
.lede{font-size:clamp(1.05rem,1.5vw,1.28rem);color:var(--ink-soft);line-height:1.55;max-width:62ch;}
.muted{color:var(--ink-soft);}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.22em;color:var(--olive);background:var(--olive-soft);padding:7px 13px;border-radius:999px;border:1px solid rgba(199,192,127,.22);}
.eyebrow::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--olive);box-shadow:0 0 8px var(--olive);}

.logo{display:inline-flex;align-items:center;font-weight:700;font-size:20px;letter-spacing:-.02em;line-height:1;}
.logo .vt{color:var(--ink);}
.logo .pro{background:var(--olive);color:#1a1812;font-size:12px;padding:3px 6px 2px;border-radius:4px;margin-left:7px;transform:translateY(-2px);box-shadow:2px 2px 0 rgba(0,0,0,.4);}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;justify-content:center;padding:18px;transition:padding .5s var(--ease);}
.nav-inner{width:100%;max-width:var(--maxw);display:flex;align-items:center;justify-content:space-between;gap:18px;
  background:rgba(27,24,19,.6);backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--line);border-radius:999px;padding:11px 12px 11px 22px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 14px 40px -22px rgba(0,0,0,.8);transition:all .5s var(--ease);}
.nav.scrolled .nav-inner{background:rgba(27,24,19,.85);}
.nav-links{display:flex;gap:4px;}
.nav-links a{font-size:14.5px;color:var(--ink-soft);padding:8px 14px;border-radius:999px;font-weight:500;transition:all .3s var(--ease);}
.nav-links a:hover{color:var(--ink);background:rgba(245,241,234,.06);}
.nav-right{display:flex;align-items:center;gap:10px;}
.langtog{display:flex;background:rgba(245,241,234,.06);border-radius:999px;padding:3px;border:1px solid var(--line);}
.langtog button{border:none;background:transparent;font-family:inherit;font-size:12.5px;font-weight:500;color:var(--ink-soft);padding:6px 11px;border-radius:999px;cursor:pointer;transition:all .3s var(--ease);}
.langtog button.on{background:var(--coral);color:#1a1310;}

.btn{display:inline-flex;align-items:center;gap:12px;font-family:inherit;font-weight:500;font-size:15px;cursor:pointer;border-radius:999px;padding:13px 14px 13px 22px;border:1px solid transparent;transition:transform .4s var(--ease2),background .3s,filter .3s;}
.btn:active{transform:scale(.975);}
.btn .ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;transition:transform .4s var(--ease2);flex:0 0 auto;}
.btn:hover .ic{transform:translate(2px,-1px) scale(1.06);}
.btn.primary{background:var(--coral);color:#1a1310;box-shadow:0 10px 30px -12px rgba(232,99,58,.6);}
.btn.primary:hover{filter:brightness(1.05);}
.btn.primary .ic{background:rgba(0,0,0,.18);}
.btn.dark{background:var(--olive);color:#1a1812;}
.btn.dark .ic{background:rgba(0,0,0,.16);}
.btn.ghost{background:var(--glass);color:var(--ink);border-color:var(--line);}
.btn.ghost .ic{background:rgba(245,241,234,.1);}
.btn.sm{padding:9px 9px 9px 16px;font-size:13.5px;}
.btn.sm .ic{width:26px;height:26px;}

.burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;position:relative;}
.burger span{position:absolute;left:11px;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:all .4s var(--ease2);}
.burger span:nth-child(1){top:15px;}.burger span:nth-child(2){top:21px;}.burger span:nth-child(3){top:27px;}
.burger.x span:nth-child(1){top:21px;transform:rotate(45deg);}.burger.x span:nth-child(2){opacity:0;}.burger.x span:nth-child(3){top:21px;transform:rotate(-45deg);}
.navsheet{position:fixed;inset:0;z-index:75;background:rgba(19,17,13,.96);backdrop-filter:blur(20px);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:40px;opacity:0;pointer-events:none;transition:opacity .4s var(--ease);}
body.nav-open .navsheet{opacity:1;pointer-events:auto;}
.navsheet a{font-size:30px;font-weight:700;letter-spacing:-.02em;padding:12px 0;color:var(--ink);transform:translateY(20px);opacity:0;transition:all .5s var(--ease);}
body.nav-open .navsheet a{transform:none;opacity:1;}
body.nav-open .navsheet a:nth-child(1){transition-delay:.08s;}body.nav-open .navsheet a:nth-child(2){transition-delay:.14s;}body.nav-open .navsheet a:nth-child(3){transition-delay:.2s;}body.nav-open .navsheet a:nth-child(4){transition-delay:.26s;}

.reveal{opacity:0;transform:translateY(28px);filter:blur(6px);transition:opacity .9s var(--ease) var(--d,0ms),transform .9s var(--ease) var(--d,0ms),filter .9s var(--ease) var(--d,0ms);}
.reveal.in{opacity:1;transform:none;filter:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;filter:none;transition:none;}}

/* glass cards */
.panel{background:var(--glass);border:1px solid var(--line-soft);border-radius:30px;padding:7px;}
.panel-in{background:var(--bg2);border-radius:24px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06);}

.hero{padding:140px 0 70px;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;}
.hero-left .display{margin:22px 0 0;}
.hero-left .lede{margin:24px 0 0;}
.hero-cta{display:flex;flex-wrap:wrap;gap:13px;margin-top:32px;}
.hero-hint{display:flex;align-items:center;gap:9px;margin-top:22px;font-size:13.5px;color:var(--ink-faint);}
.hero-hint .dot{width:7px;height:7px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 0 rgba(232,99,58,.5);animation:pulse 2.4s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(232,99,58,.45);}70%{box-shadow:0 0 0 9px rgba(232,99,58,0);}100%{box-shadow:0 0 0 0 rgba(232,99,58,0);}}
.hero-stats{display:flex;gap:30px;margin-top:42px;padding-top:30px;border-top:1px solid var(--line);}
.hero-stats .st .n{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--coral);}
.hero-stats .st .l{font-size:12.5px;color:var(--ink-soft);margin-top:7px;max-width:15ch;line-height:1.35;}

.stage{position:relative;display:flex;justify-content:center;align-items:center;}
.stage::before{content:"";position:absolute;width:120%;height:120%;border-radius:50%;background:radial-gradient(closest-side,rgba(232,99,58,.22),rgba(199,192,127,.1) 50%,transparent 72%);z-index:0;}
.phone{position:relative;z-index:1;width:332px;height:710px;border-radius:46px;background:#000;padding:9px;box-shadow:0 50px 100px -36px rgba(0,0,0,.9),0 0 0 1px rgba(245,241,234,.08),0 0 60px -10px rgba(232,99,58,.25);}
.phone iframe{width:100%;height:100%;border:0;border-radius:38px;background:#15130f;display:block;}
.phone .notch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:110px;height:26px;background:#000;border-radius:0 0 16px 16px;z-index:2;}

.sec{padding:clamp(70px,10vw,128px) 0;}
.sec-head{max-width:760px;}
.sec-head .h2{margin:16px 0 0;}
.sec-head .lede{margin:20px 0 0;}

.shift-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:54px;}
.shift-card{border-radius:26px;padding:32px;border:1px solid var(--line);background:var(--glass);}
.shift-card.new{background:linear-gradient(150deg,rgba(232,99,58,.16),rgba(232,99,58,.04));border-color:rgba(232,99,58,.3);box-shadow:0 30px 60px -34px rgba(232,99,58,.4);}
.shift-card .tag{font-size:11px;text-transform:uppercase;letter-spacing:.18em;font-weight:500;}
.shift-card.old .tag{color:var(--ink-faint);}
.shift-card.new .tag{color:var(--coral-2);}
.shift-card .h3{margin:12px 0 22px;}
.shift-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px;}
.shift-list li{display:flex;gap:13px;font-size:15.5px;line-height:1.4;color:var(--ink-soft);}
.shift-list li .mk{flex:0 0 auto;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;margin-top:1px;}
.shift-card.old .mk{background:rgba(245,241,234,.08);color:var(--ink-faint);}
.shift-card.new .mk{background:rgba(232,99,58,.2);color:var(--coral-2);}
.shift-card.new li{color:var(--ink);}

.tour-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px;}
.shot .frame{background:var(--glass);border:1px solid var(--line-soft);border-radius:30px;padding:8px;transition:transform .6s var(--ease);}
.shot:hover .frame{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(232,99,58,.3);}
.shot .frame img{border-radius:22px;width:100%;}
.shot .cap{padding:20px 6px 0;}
.shot .cap .h3{font-size:1.15rem;}
.shot .cap p{margin:9px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.5;}
.tour-foot{margin-top:46px;display:flex;justify-content:center;}

.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;margin-top:54px;}
.cell{border-radius:26px;padding:30px;border:1px solid var(--line);background:var(--glass);}
.cell .ic{width:46px;height:46px;border-radius:14px;background:var(--olive-soft);color:var(--olive);display:grid;place-items:center;margin-bottom:18px;}
.cell .h3{font-size:1.2rem;}
.cell p{margin:10px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.5;}
.cell.span6{grid-column:span 6;}.cell.span4{grid-column:span 4;}.cell.span8{grid-column:span 8;}.cell.span12{grid-column:span 12;}
.cell.dark{background:linear-gradient(150deg,rgba(199,192,127,.12),rgba(199,192,127,.02));border-color:rgba(199,192,127,.22);}
.cell.dark .ic{background:rgba(199,192,127,.18);color:var(--olive);}
.levels{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.lvchip{display:flex;align-items:center;gap:10px;background:rgba(245,241,234,.05);border:1px solid var(--line);border-radius:999px;padding:8px 16px 8px 8px;font-size:14px;}
.lvchip .n{width:26px;height:26px;border-radius:50%;background:var(--olive);color:#1a1812;display:grid;place-items:center;font-weight:700;font-size:12px;}
.lvchip:nth-child(1) .n{background:var(--coral);color:#1a1310;}

.arch-wrap{margin-top:50px;}
.diagram{background:var(--espresso);border:1px solid var(--line);border-radius:30px;padding:clamp(24px,4vw,46px);position:relative;overflow:hidden;}
.diagram::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 80% 0%,rgba(232,99,58,.14),transparent 55%);}
.dgrid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.node{background:var(--glass2);border:1px solid var(--line);border-radius:16px;padding:16px;color:var(--ink);display:flex;align-items:center;gap:11px;font-size:13.5px;font-weight:500;line-height:1.25;min-height:64px;}
.node .ni{width:34px;height:34px;border-radius:10px;background:rgba(199,192,127,.16);color:var(--olive);display:grid;place-items:center;flex:0 0 auto;}
.node.core{background:linear-gradient(150deg,var(--coral),rgba(232,99,58,.75));border-color:transparent;color:#1a1310;box-shadow:0 14px 34px -14px rgba(232,99,58,.6);}
.node.core .ni{background:rgba(0,0,0,.2);color:#1a1310;}
.node.span2{grid-column:span 2;}
.dlabel{color:var(--olive);font-size:11px;text-transform:uppercase;letter-spacing:.18em;margin:22px 0 12px;font-weight:500;}
.dlabel:first-child{margin-top:0;}
.subsys{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px;}
.sub{border:1px solid var(--line);border-radius:22px;padding:26px;background:var(--glass);}
.sub .h3{font-size:1.1rem;display:flex;align-items:center;gap:10px;}
.sub .h3 .si{width:34px;height:34px;border-radius:10px;background:var(--olive-soft);color:var(--olive);display:grid;place-items:center;flex:0 0 auto;}
.sub p{margin:13px 0 0;font-size:14px;color:var(--ink-soft);line-height:1.55;}
.stackline{margin-top:24px;font-size:14px;color:var(--ink-soft);background:var(--glass);border:1px solid var(--line-soft);border-radius:16px;padding:16px 20px;line-height:1.5;}
.caveat{margin-top:18px;border-radius:22px;padding:26px;background:var(--coral-soft);border:1px solid rgba(232,99,58,.3);}
.caveat .h3{font-size:1.05rem;color:var(--coral-2);display:flex;align-items:center;gap:10px;}
.caveat p{margin:11px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.55;}

.comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:50px;}
.comp{border:1px solid var(--line);border-radius:22px;padding:26px;background:var(--glass);}
.comp .nm{font-size:1.15rem;font-weight:700;letter-spacing:-.01em;}
.comp p{margin:10px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.5;}
.comp-edge{grid-column:span 2;background:linear-gradient(150deg,rgba(199,192,127,.14),rgba(199,192,127,.03));border:1px solid rgba(199,192,127,.25);border-radius:22px;padding:26px 30px;font-size:16px;line-height:1.5;display:flex;gap:16px;align-items:flex-start;}
.comp-edge .si{width:40px;height:40px;border-radius:12px;background:rgba(199,192,127,.2);color:var(--olive);display:grid;place-items:center;flex:0 0 auto;}

.scope-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:50px;}
.scope-card{border-radius:26px;padding:30px;border:1px solid var(--line);background:var(--glass);}
.scope-card .h3{font-size:1.2rem;margin-bottom:20px;}
.scope-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px;}
.scope-list li{display:flex;gap:12px;font-size:15px;line-height:1.4;}
.scope-list li .mk{flex:0 0 auto;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;margin-top:1px;}
.scope-card:not(.out) .mk{background:var(--coral-soft);color:var(--coral-2);}
.scope-card.out .mk{background:rgba(245,241,234,.06);color:var(--ink-faint);}
.scope-card.out li{color:var(--ink-soft);}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px;}
.fact{border:1px solid var(--line);border-radius:20px;padding:24px;text-align:center;background:var(--glass);}
.fact .v{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;letter-spacing:-.02em;color:var(--coral-2);}
.fact .l{font-size:12.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft);margin-top:8px;}
.scope-note{margin-top:20px;font-size:13.5px;color:var(--ink-soft);line-height:1.55;max-width:90ch;}

.risk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:50px;}
.risk{display:flex;gap:16px;border:1px solid var(--line);border-radius:20px;padding:24px;background:var(--glass);}
.risk .ri{width:38px;height:38px;border-radius:11px;background:var(--olive-soft);color:var(--olive);display:grid;place-items:center;flex:0 0 auto;}
.risk .h3{font-size:1.05rem;}
.risk p{margin:8px 0 0;font-size:14px;color:var(--ink-soft);line-height:1.5;}

.foot{padding:clamp(70px,9vw,120px) 0 60px;}
.foot-card{background:linear-gradient(150deg,var(--bg2),var(--espresso));border:1px solid var(--line);border-radius:34px;padding:clamp(40px,6vw,72px);text-align:center;position:relative;overflow:hidden;color:var(--ink);}
.foot-card::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 120% at 50% 0%,rgba(232,99,58,.2),transparent 60%);}
.foot-card .inner{position:relative;}
.foot-card .lede{color:var(--ink-soft);margin:18px auto 0;}
.foot-card .btn{margin-top:32px;}
.foot-meta{margin-top:42px;text-align:center;font-size:13px;color:var(--ink-soft);line-height:1.6;}
.foot-disc{font-size:12px;color:var(--ink-faint);margin-top:10px;}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:38px;padding-top:26px;border-top:1px solid var(--line);flex-wrap:wrap;}
.variant-switch{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;}
.variant-switch .vs-label{color:var(--ink-faint);text-transform:uppercase;letter-spacing:.16em;font-size:11px;margin-right:2px;}
.variant-switch .vs{padding:7px 13px;border-radius:999px;border:1px solid var(--line);color:var(--ink-soft);font-weight:500;transition:all .3s var(--ease);}
.variant-switch .vs:hover{color:var(--ink);border-color:var(--ink);}
.variant-switch .vs.b{background:var(--coral);color:#1a1310;border-color:var(--coral);}

@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:48px;}
  .stage{order:-1;}
  .tour-grid{grid-template-columns:1fr 1fr;}
  .subsys{grid-template-columns:1fr;}
  .cell.span6,.cell.span4,.cell.span8{grid-column:span 12;}
  .dgrid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .nav-links,.langtog{display:none;}
  .burger{display:block;}
  .shift-grid,.scope-grid,.comp-grid,.risk-grid,.tour-grid,.facts{grid-template-columns:1fr;}
  .comp-edge{grid-column:span 1;}
  .hero-stats{flex-wrap:wrap;gap:22px;}.hero-stats .st{min-width:42%;}
  .wrap{padding:0 20px;}.hero{padding:118px 0 50px;}
  .phone{width:300px;height:642px;}
}
@media (max-width:420px){.phone{width:88vw;height:188vw;max-height:660px;}}