/* Vectum Cargo Group. Layout: navy hero bands with live visuals (globe, scenes, maps), white content bands, left slide-in mega menu.
   One signature motif: the red dashed route line. Mono type only for real codes (UN/LOCODE, IATA, ISO container, Incoterms). */
:root{
  --bg:#ffffff;--bg-soft:#f1f4f9;--bg-sunk:#e8edf5;--line:#dbe2ec;--line-strong:#c4cedd;
  --fg:#13203b;--muted:#56637d;--faint:#8792a8;
  --navy:#1b2d55;--navy-deep:#0e1830;--navy-2:#243a6b;--on-navy:#eef1f7;--on-navy-muted:#a7b3cb;--on-navy-line:rgba(255,255,255,.14);
  --red:#c42a3e;--red-hover:#a51f31;--red-soft:#fbe8eb;--red-on-navy:#ff7a8b;
  --ok:#1f7a55;--scrim:rgba(8,14,30,.55);
  --c-navy:#2c4680;--c-steel:#6f8bc2;--c-red:#d2364a;--c-light:#e6ebf4;--c-slate:#43598f;
  --f-display:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1200px;--gutter:clamp(16px,4vw,40px);--r:10px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0b1222;--bg-soft:#111a2e;--bg-sunk:#16213a;--line:#223150;--line-strong:#2f4166;
  --fg:#e7ebf3;--muted:#9ba7bf;--faint:#6f7c97;
  --navy:#15244a;--navy-deep:#091228;--navy-2:#1d3060;
  --red:#e2485c;--red-hover:#c93a4e;--red-soft:#361620;--ok:#4cc492;--scrim:rgba(0,0,0,.6);
  --c-light:#c9d2e4;color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0b1222;--bg-soft:#111a2e;--bg-sunk:#16213a;--line:#223150;--line-strong:#2f4166;
  --fg:#e7ebf3;--muted:#9ba7bf;--faint:#6f7c97;
  --navy:#15244a;--navy-deep:#091228;--navy-2:#1d3060;
  --red:#e2485c;--red-hover:#c93a4e;--red-soft:#361620;--ok:#4cc492;--scrim:rgba(0,0,0,.6);
  --c-light:#c9d2e4;color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
html{-webkit-text-size-adjust:100%}
img,svg,canvas{max-width:100%}
body{background:var(--bg);color:var(--fg);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.12;margin:0;text-wrap:balance;letter-spacing:-.015em}
h2{font-size:clamp(1.65rem,3.1vw,2.5rem);font-weight:800}
h3{font-size:1.06rem;font-weight:700;letter-spacing:-.005em}
p{margin:0}
a{color:inherit}
ul,ol,dl{margin:0}
.code{font-family:var(--f-mono);font-weight:500;letter-spacing:.02em}
.lead{color:var(--muted);font-size:1.08rem;max-width:60ch;line-height:1.55}
.on-navy .lead{color:var(--on-navy-muted)}
.muted{color:var(--muted)}
:focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:4px}
.on-navy :focus-visible{outline-color:var(--red-on-navy)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font:600 .95rem/1 var(--f-body);padding:.95em 1.35em;border-radius:7px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-hover)}
.btn-line{border-color:var(--line-strong);color:var(--fg);background:transparent}
.btn-line:hover{border-color:var(--fg)}
.on-navy .btn-line,.side-cta .btn-line,.expert .btn-line{border-color:rgba(255,255,255,.32);color:#fff}
.on-navy .btn-line:hover,.side-cta .btn-line:hover,.expert .btn-line:hover{border-color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.link{display:inline-flex;align-items:center;gap:.4em;font-weight:600;color:var(--red);text-decoration:none}
.link .ico{transition:transform .2s var(--ease)}
.link:hover .ico{transform:translateX(3px)}

/* announce + header */
.announce{background:var(--navy-deep);color:var(--on-navy-muted);font-size:.84rem}
.announce .wrap{display:flex;justify-content:center;align-items:center;gap:6px 12px;flex-wrap:wrap;padding-block:9px;text-align:center}
.announce b{color:#fff;font-weight:600}
.announce a{color:var(--red-on-navy);font-weight:600;text-decoration:none}
.announce a:hover{text-decoration:underline}
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .2s}
header.top.scrolled{box-shadow:0 8px 24px -18px rgba(14,24,48,.45)}
.top .wrap{display:flex;align-items:center;gap:16px;min-height:68px;transition:min-height .2s}
header.top.scrolled .wrap{min-height:58px}
.progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--red);transform-origin:0 50%;transform:scaleX(0)}
.burger{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:42px;height:42px;border:1px solid var(--line);border-radius:8px;background:transparent;cursor:pointer;padding:0 11px;flex:none;color:var(--fg)}
.burger span{display:block;height:2px;background:currentColor;border-radius:2px;transition:width .2s}
.burger span:nth-child(2){width:70%}
.burger:hover span:nth-child(2){width:100%}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg);flex:none}
.brand img{height:30px;width:auto}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brand img{filter:brightness(1.45) saturate(1.1)}}
:root[data-theme="dark"] .brand img{filter:brightness(1.45) saturate(1.1)}
@media (max-width:600px){.announce .more{display:none}}
.brand-name{display:block;font:800 1.05rem/1 var(--f-display);letter-spacing:.14em}
.brand-sub{display:block;font:600 .55rem/1 var(--f-display);letter-spacing:.32em;color:var(--muted);margin-top:4px}
nav.main{display:flex;gap:2px;margin-left:10px}
nav.main button{border:0;background:transparent;font:500 .93rem var(--f-body);color:var(--muted);padding:.6em .75em;border-radius:7px;cursor:pointer;display:flex;align-items:center;gap:7px}
nav.main button::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
nav.main button:hover{color:var(--fg);background:var(--bg-soft)}
.top-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.lang{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;font:500 .75rem/1 var(--f-mono)}
.lang button{border:0;background:transparent;color:var(--muted);padding:.6em .7em;cursor:pointer;font:inherit}
.lang button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.top .btn{padding:.75em 1.1em;font-size:.88rem}
.top .msg{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--muted);border:1px solid var(--line);text-decoration:none}
.top .msg:hover{color:var(--fg);border-color:var(--line-strong)}
@media (max-width:1120px){nav.main{display:none}}
@media (max-width:600px){.top .btn{display:none}.top .wrap{gap:12px}}
@media (max-width:360px){.top .msg{display:none}}

/* drawer */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:40;opacity:0;transition:opacity .22s}
.scrim.on{opacity:1}
.drawer{position:fixed;top:0;bottom:0;left:0;z-index:41;width:min(960px,100%);background:var(--bg);display:flex;flex-direction:column;transform:translateX(-102%);transition:transform .3s var(--ease),visibility 0s .3s;box-shadow:24px 0 64px -24px rgba(0,0,0,.4);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);visibility:hidden}
.drawer.open{transform:none;visibility:visible;transition:transform .3s var(--ease),visibility 0s}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line)}
.x{width:42px;height:42px;border:1px solid var(--line);border-radius:8px;background:transparent;cursor:pointer;color:var(--fg);display:inline-flex;align-items:center;justify-content:center}
.x:hover{border-color:var(--line-strong)}
.drawer-body{flex:1;display:grid;grid-template-columns:260px 1fr;min-height:0}
.d-tabs{background:var(--bg-soft);border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}
.d-tabs button,.d-tabs a{display:flex;gap:12px;align-items:center;width:100%;text-align:left;border:0;background:transparent;font:600 1rem var(--f-display);color:var(--fg);padding:.8em .85em;border-radius:8px;cursor:pointer;text-decoration:none}
.d-tabs button .ico{color:var(--muted)}
.d-tabs button::after{content:"";margin-left:auto;width:7px;height:7px;border-right:1.6px solid var(--faint);border-top:1.6px solid var(--faint);transform:rotate(45deg)}
.d-tabs button[aria-selected="true"]{background:var(--bg);color:var(--red);box-shadow:0 1px 3px rgba(17,29,56,.08)}
.d-tabs button[aria-selected="true"] .ico{color:var(--red)}
.d-tabs .sep{height:1px;background:var(--line);margin:10px 8px}
.d-tabs a{font:500 .93rem var(--f-body);color:var(--muted)}
.d-tabs a:hover{color:var(--fg)}
.d-pane{padding:26px 30px 34px;overflow-y:auto;min-width:0}
.d-pane.swap{animation:paneIn .25s var(--ease)}
@keyframes paneIn{from{opacity:.3;transform:translateX(8px)}to{opacity:1;transform:none}}
.d-back{display:none;border:0;background:transparent;color:var(--muted);font:500 .9rem var(--f-body);padding:0;margin-bottom:14px;cursor:pointer;align-items:center;gap:6px}
.d-pane h2{font-size:1.45rem;margin-bottom:6px}
.d-pane .d-intro{color:var(--muted);font-size:.95rem;margin-bottom:24px;max-width:56ch}
.d-groups{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 34px}
.d-group h4{font:600 .82rem/1.2 var(--f-body);color:var(--muted);margin-bottom:8px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.d-group a{display:flex;gap:12px;align-items:flex-start;text-decoration:none;padding:9px 10px;margin:0 -10px;border-radius:8px}
.d-group a .ico{margin-top:2px;color:var(--faint);transition:color .15s}
.d-group a:hover{background:var(--bg-soft)}
.d-group a:hover .ico,.d-group a:hover b{color:var(--red)}
.d-group a b{display:block;font:600 .95rem/1.3 var(--f-body)}
.d-group a span{display:block;font-size:.83rem;color:var(--muted);line-height:1.4;margin-top:2px}
.drawer-foot{border-top:1px solid var(--line);padding:14px 20px;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;font-size:.9rem;color:var(--muted)}
.drawer-foot a{text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.drawer-foot a:hover{color:var(--fg)}
.drawer-foot .btn{margin-left:auto;color:#fff}
@media (max-width:760px){
  .drawer-body{grid-template-columns:1fr}
  .d-tabs{border-right:0;background:var(--bg)}
  .d-pane{display:none;padding:20px}
  .drawer-body.pane-open .d-tabs{display:none}
  .drawer-body.pane-open .d-pane{display:block}
  .d-back{display:inline-flex}
  .d-groups{grid-template-columns:1fr}
  .drawer-foot .btn{margin-left:0}
}

/* navy bands */
.on-navy{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden;isolation:isolate}
.on-navy::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 55% 75% at 82% 12%,rgba(196,42,62,.20),transparent 62%),radial-gradient(ellipse 50% 60% at 10% 100%,rgba(111,139,194,.16),transparent 60%),repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 1px,transparent 1px 80px);pointer-events:none}
.on-navy>.wrap{position:relative}

/* home hero */
.hero .wrap{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;padding-block:64px 56px;align-items:center}
.hero h1{font-size:clamp(2.3rem,5vw,4rem);font-weight:800;letter-spacing:-.03em;line-height:1.02;max-width:13ch}
.hero .lead{margin-top:22px;font-size:1.12rem}
.hero .btns{margin-top:30px}
.paths{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:34px;max-width:560px}
.path{display:flex;flex-direction:column;gap:6px;text-decoration:none;padding:16px 16px 18px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);transition:background .15s,border-color .15s,transform .2s var(--ease)}
.path:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.32);transform:translateY(-2px)}
.path .ico{width:22px;height:22px;color:var(--red-on-navy)}
.path h3{color:#fff;margin-top:4px}
.path p{color:var(--on-navy-muted);font-size:.88rem;line-height:1.45}
.globe-box{position:relative;aspect-ratio:1/1;width:100%;max-width:620px;justify-self:end;min-width:0}
.globe-box canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}
.globe-box canvas:active{cursor:grabbing}
.globe-hint{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);font-size:.78rem;color:var(--on-navy-muted);display:flex;align-items:center;gap:8px;white-space:nowrap;pointer-events:none}
.globe-hint .ico{width:16px;height:16px}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:8px;padding-block:44px 40px}.globe-box{justify-self:center;max-width:460px}.hero h1{max-width:16ch}}
@media (max-width:520px){.paths{grid-template-columns:1fr}}

/* ticker */
.ticker{background:var(--navy-deep);color:var(--on-navy-muted);border-top:1px solid var(--on-navy-line);overflow:hidden;position:relative}
.ticker::before,.ticker::after{content:"";position:absolute;top:0;bottom:0;width:60px;z-index:1;pointer-events:none}
.ticker::before{left:0;background:linear-gradient(90deg,var(--navy-deep),transparent)}
.ticker::after{right:0;background:linear-gradient(-90deg,var(--navy-deep),transparent)}
.ticker-track{display:flex;width:max-content;animation:tick 60s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{display:inline-flex;align-items:baseline;gap:9px;padding:13px 22px;font-size:.86rem;white-space:nowrap;border-right:1px solid var(--on-navy-line)}
.ticker-track b{font:500 .82rem var(--f-mono);color:#fff;letter-spacing:.04em}
@keyframes tick{to{transform:translateX(-50%)}}

/* page hero with scene */
.phero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding-block:36px 52px}
.phero.noscene .wrap{grid-template-columns:1fr}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.82rem;color:var(--on-navy-muted);margin-bottom:26px}
.crumbs a{text-decoration:none;color:var(--on-navy-muted)}
.crumbs a:hover{color:#fff}
.crumbs .sep{opacity:.5}
.phero .kind{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;color:var(--red-on-navy)}
.phero .kind .ico{width:18px;height:18px}
.phero h1{font-size:clamp(2rem,4.3vw,3.3rem);font-weight:800;letter-spacing:-.025em;margin-top:12px;max-width:20ch}
.phero .lead{margin-top:18px}
.phero .btns{margin-top:28px}
.scene{width:100%;max-width:560px;justify-self:end;min-width:0}
.scene svg{display:block;width:100%;height:auto}
@media (max-width:900px){.phero .wrap{grid-template-columns:1fr;gap:24px}.scene{justify-self:start;max-width:440px}}

/* modes strip */
.modes{border-bottom:1px solid var(--line)}
.modes ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(6,1fr)}
.modes li{border-left:1px solid var(--line)}
.modes li:first-child{border-left:0}
.modes a{display:flex;flex-direction:column;gap:7px;padding:22px 16px;text-decoration:none;height:100%}
.modes li:first-child a{padding-left:0}
.modes .ico{width:26px;height:26px;color:var(--faint);transition:color .2s,transform .3s var(--ease)}
.modes a:hover .ico{color:var(--red);transform:translateX(4px)}
.modes a:hover b{color:var(--red)}
.modes b{font:700 .98rem/1.2 var(--f-display)}
.modes span{color:var(--muted);font-size:.85rem;line-height:1.4}
@media (max-width:900px){.modes ul{grid-template-columns:repeat(3,1fr)}.modes li:nth-child(4){border-left:0}.modes li:nth-child(4) a{padding-left:0}.modes li:nth-child(n+4){border-top:1px solid var(--line)}}
@media (max-width:520px){.modes ul{grid-template-columns:1fr 1fr}.modes li{border-left:0;border-top:1px solid var(--line)}.modes li a{padding-left:0}.modes li:nth-child(-n+2){border-top:0}}

/* bands */
section.band{padding-block:88px}
section.band.soft{background:var(--bg-soft)}
section.band.tight{padding-block:60px}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px}
.sec-head.single{grid-template-columns:1fr}
.sec-head h2{max-width:18ch}
@media (max-width:820px){.sec-head{grid-template-columns:1fr;gap:14px}section.band{padding-block:60px}}

/* service blocks */
.svc-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.svc-block{border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:14px;background:var(--bg);min-width:0}
.svc-block .head{display:flex;align-items:center;gap:12px}
.svc-block .badge{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--bg-soft);color:var(--red);flex:none}
.svc-block .badge .ico{width:22px;height:22px}
.svc-block p{color:var(--muted);font-size:.92rem}
.svc-block ul{list-style:none;padding:0;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.svc-block li a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;font-weight:500;font-size:.93rem}
.svc-block li a .ico{width:16px;height:16px;color:var(--faint);transition:transform .2s var(--ease),color .2s}
.svc-block li a:hover{color:var(--red)}
.svc-block li a:hover .ico{color:var(--red);transform:translateX(3px)}
.svc-block.feature{background:var(--navy);color:var(--on-navy);border-color:var(--navy)}
.svc-block.feature .badge{background:rgba(255,255,255,.08);color:var(--red-on-navy)}
.svc-block.feature h3{color:#fff}
.svc-block.feature p{color:var(--on-navy-muted)}
.svc-block.feature ul{border-top-color:var(--on-navy-line);margin-top:auto}
.svc-block.feature li a{border-bottom-color:var(--on-navy-line)}
.svc-block.feature li a .ico{color:var(--on-navy-muted)}
.svc-block.feature li a:hover,.svc-block.feature li a:hover .ico{color:var(--red-on-navy)}
@media (max-width:960px){.svc-blocks{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.svc-blocks{grid-template-columns:1fr}}

/* tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.tiles.five{grid-template-columns:repeat(5,1fr)}
.tiles.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1000px){.tiles.five,.tiles.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:440px){.tiles.five,.tiles.four{grid-template-columns:1fr}}
.tile{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--line);border-radius:12px;text-decoration:none;background:var(--bg);transition:border-color .15s,transform .2s var(--ease),box-shadow .2s;min-width:0;position:relative}
.tile:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(14,24,48,.5)}
.tile .t-ico{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.tile .t-ico .ico{width:24px;height:24px;color:var(--red)}
.tile .t-ico .go{width:16px;height:16px;color:var(--faint);transition:transform .2s var(--ease),color .2s}
.tile:hover .t-ico .go{transform:translateX(3px);color:var(--fg)}
.tile .idx{font:500 .78rem/1 var(--f-mono);color:var(--red)}
.tile p{color:var(--muted);font-size:.88rem;line-height:1.45}
.soft .tile{background:var(--bg)}

/* offers, steps, split */
.offers{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.offer{border:1px solid var(--line);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:6px;background:var(--bg-soft)}
.offer .code{font-size:.8rem;color:var(--red)}
.offer p{color:var(--muted);font-size:.9rem}
.route{position:relative;margin-bottom:8px}
.route svg{display:block;width:100%;height:56px;overflow:visible}
.route .rl{fill:none;stroke:var(--line-strong);stroke-width:2;stroke-dasharray:2 8;stroke-linecap:round}
.route .rl-on{fill:none;stroke:var(--red);stroke-width:2;stroke-dasharray:2 8;stroke-linecap:round}
.route .node{fill:var(--bg);stroke:var(--red);stroke-width:2}
.soft .route .node{fill:var(--bg-soft)}
.route .box{fill:var(--red)}
.route .box-line{stroke:rgba(255,255,255,.55);stroke-width:1}
@media (max-width:900px){.route{display:none}}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:10px}
.step .num{font:800 1.9rem/1 var(--f-display);color:var(--red);letter-spacing:-.02em}
.step p{color:var(--muted);font-size:.93rem}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.split .steps{grid-template-columns:1fr 1fr}
@media (max-width:520px){.split .steps{grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:1fr 340px;gap:56px;align-items:start}
.split>*{min-width:0}
@media (max-width:960px){.split{grid-template-columns:1fr;gap:36px}}
.inc{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;border-top:1px solid var(--line)}
.inc>div{padding:20px 0 20px 30px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px;position:relative}
.inc>div::before{content:"";position:absolute;left:2px;top:25px;width:12px;height:12px;border-radius:3px;border:2px solid var(--red)}
.inc p{color:var(--muted);font-size:.94rem}
@media (max-width:620px){.inc{grid-template-columns:1fr}}
.side{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px}
@media (max-width:960px){.side{position:static}}
.facts{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.facts h4{font:600 .85rem/1 var(--f-body);color:var(--muted);padding:16px 18px;border-bottom:1px solid var(--line);background:var(--bg-soft)}
.facts dl div{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:3px}
.facts dl div:last-child{border-bottom:0}
.facts dt{font-size:.8rem;color:var(--muted)}
.facts dd{margin:0;font-weight:600;font-size:.95rem}
.side-cta{background:var(--navy);color:var(--on-navy);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:12px;align-items:flex-start;position:relative;overflow:hidden}
.side-cta h3{color:#fff}
.side-cta p{color:var(--on-navy-muted);font-size:.9rem}
.side-cta::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;border:1px dashed rgba(255,122,139,.35)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:500 .86rem/1.2 var(--f-body);padding:8px 12px;border-radius:999px;background:var(--bg-soft);border:1px solid var(--line);color:var(--fg);text-decoration:none;display:inline-flex;align-items:center;gap:7px}
.chip .ico{width:16px;height:16px;color:var(--red)}
a.chip:hover{border-color:var(--fg)}
.soft .chip{background:var(--bg)}
.block-title{margin:48px 0 18px;font-size:1.45rem}
.split>div>.block-title:first-child,.block-title.first{margin-top:0}
.prose{max-width:68ch;display:flex;flex-direction:column;gap:16px}
.prose p{color:var(--muted)}
.prose h3{margin-top:14px;font-size:1.15rem}
.prose ol,.prose ul{color:var(--muted);padding-left:1.2em;display:flex;flex-direction:column;gap:8px}
.prose b{color:var(--fg)}
.prose a{color:var(--red)}
.note{padding:16px 18px;border-radius:10px;background:var(--bg-soft);border-left:3px solid var(--red);font-size:.93rem;color:var(--muted)}
.note a{color:var(--red)}

/* mode chart */
.mchart{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:stretch}
.mchart>*{min-width:0}
.mc-plot{border:1px solid var(--line);border-radius:14px;background:var(--bg);padding:14px 14px 8px;position:relative}
.mc-plot svg{display:block;width:100%;height:auto;overflow:visible}
.mc-grid{stroke:var(--line);stroke-width:1}
.mc-axis{stroke:var(--line-strong);stroke-width:1.5;fill:none}
.mc-axl{font:500 12px var(--f-body);fill:var(--muted)}
.mc-b{cursor:pointer;outline:none}
.mc-b circle.bub{fill:var(--bg-sunk);stroke:var(--line-strong);stroke-width:1.5;transition:fill .2s,stroke .2s}
.mc-b text{font:700 13px var(--f-display);fill:var(--fg);pointer-events:none}
.mc-b .ic{color:var(--muted)}
.mc-b:hover circle.bub,.mc-b:focus-visible circle.bub{stroke:var(--fg)}
.mc-b.hl circle.bub{fill:var(--red-soft);stroke:var(--red)}
.mc-b.hl .ic{color:var(--red)}
.mc-b.sel circle.bub{fill:var(--red);stroke:var(--red)}
.mc-b.sel .ic{color:#fff}
.mc-b.dim{opacity:.38}
.mc-ring{fill:none;stroke:var(--red);stroke-width:1.5;stroke-dasharray:3 4}
.mc-side{display:flex;flex-direction:column;gap:16px}
.seg2{display:inline-flex;background:var(--bg-sunk);border-radius:9px;padding:4px;gap:4px;flex-wrap:wrap}
.seg2 button{border:0;background:transparent;padding:.6em 1em;border-radius:6px;font:600 .9rem var(--f-body);color:var(--muted);cursor:pointer}
.seg2 button[aria-pressed="true"]{background:var(--bg);color:var(--fg);box-shadow:0 1px 3px rgba(17,29,56,.14)}
.mc-card{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--bg);display:flex;flex-direction:column;gap:10px;flex:1}
.mc-card .ttl{display:flex;align-items:center;gap:10px}
.mc-card .ttl .ico{width:28px;height:28px;color:var(--red)}
.mc-card h3{font-size:1.35rem}
.mc-card dt{font-size:.8rem;color:var(--muted);margin-top:6px}
.mc-card dd{margin:2px 0 0;color:var(--fg)}
.mc-card .link{margin-top:auto;padding-top:8px}
.mc-legend{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--muted)}
.mc-legend svg{width:46px;height:24px;flex:none}
.mc-legend circle{fill:var(--bg-sunk);stroke:var(--line-strong)}
@media (max-width:900px){.mchart{grid-template-columns:1fr}}

/* network map */
.netband .wrap{padding-block:84px}
.net{display:grid;grid-template-columns:1.45fr .55fr;gap:32px;align-items:start;margin-top:36px}
.net>*{min-width:0}
.dmap{position:relative;width:100%}
.dmap canvas{display:block;width:100%;height:auto}
.dmap .mk{position:absolute;transform:translate(-50%,-50%);width:9px;height:9px;border-radius:50%;background:var(--red-on-navy);box-shadow:0 0 0 3px rgba(255,122,139,.18);transition:transform .2s,opacity .2s,background .2s;pointer-events:none}
.dmap .mk.a{border-radius:2px}
.dmap .mk.r{border-radius:2px;transform:translate(-50%,-50%) rotate(45deg)}
.dmap.focus .mk{opacity:.18}
.dmap.focus .mk.on{opacity:1;transform:translate(-50%,-50%) scale(1.5)}
.dmap.focus .mk.r.on{transform:translate(-50%,-50%) rotate(45deg) scale(1.5)}
.dmap .lbl{position:absolute;transform:translate(10px,-50%);font:500 11px var(--f-mono);color:#fff;background:rgba(9,18,40,.78);padding:2px 6px;border-radius:4px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s}
.dmap .lbl.left{transform:translate(calc(-100% - 10px),-50%)}
.dmap.focus .lbl.on{opacity:1}
.regions-list{list-style:none;padding:0;display:flex;flex-direction:column;border-top:1px solid var(--on-navy-line)}
.regions-list a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 4px;border-bottom:1px solid var(--on-navy-line);text-decoration:none;color:#fff;font-weight:600;transition:padding .2s var(--ease),color .2s}
.regions-list a span{font:400 .8rem var(--f-body);color:var(--on-navy-muted)}
.regions-list a:hover,.regions-list a:focus-visible,.regions-list a.on{color:var(--red-on-navy);padding-left:10px}
.net-legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.8rem;color:var(--on-navy-muted);margin-top:14px}
.net-legend i{display:inline-block;width:9px;height:9px;background:var(--red-on-navy);margin-right:7px;vertical-align:0}
.net-legend i.p{border-radius:50%}
.net-legend i.a{border-radius:2px}
.net-legend i.r{border-radius:2px;transform:rotate(45deg) scale(.85)}
@media (max-width:900px){.net{grid-template-columns:1fr}}

/* region map in hero */
.rmap{width:100%;max-width:560px;justify-self:end;min-width:0;display:flex;justify-content:flex-end}
.rmap .dmap{flex:none}
.rmap .dmap .mk{width:20px;height:20px;background:var(--red);color:#fff;font:600 11px/20px var(--f-mono);text-align:center;box-shadow:0 0 0 4px rgba(255,122,139,.22);pointer-events:auto;cursor:default}
.rmap .dmap .mk.a,.rmap .dmap .mk.r{border-radius:5px}
.rmap .dmap .mk.r{transform:translate(-50%,-50%)}
.rmap .dmap .mk.on{transform:translate(-50%,-50%) scale(1.25);background:#fff;color:var(--red)}
@media (max-width:900px){.rmap{justify-self:start;justify-content:flex-start}}
.gates{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;border-top:1px solid var(--line)}
.gates li{display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);cursor:default}
.gates .n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;font:600 .78rem/28px var(--f-mono);text-align:center}
.gates .n.a,.gates .n.r{border-radius:7px}
.gates b{display:block;font-weight:600}
.gates small{display:flex;gap:10px;color:var(--muted);font-size:.82rem}
.gates li.on{background:var(--bg-soft)}
@media (max-width:620px){.gates{grid-template-columns:1fr}}

/* tools */
.tool{border:1px solid var(--line);border-radius:14px;padding:24px;display:flex;flex-direction:column;gap:20px;background:var(--bg)}
.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
@media (max-width:760px){.grid5{grid-template-columns:1fr 1fr}}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-size:.83rem;font-weight:500;color:var(--muted)}
.field input,.field select,.field textarea{font:400 .96rem var(--f-body);color:var(--fg);background:var(--bg);border:1px solid var(--line-strong);border-radius:8px;padding:.75em .85em;width:100%;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 18%,transparent)}
.field textarea{min-height:100px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--muted);cursor:pointer}
.check input{margin-top:3px;accent-color:var(--red);width:16px;height:16px;flex:none}
.presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.presets>span{font-size:.83rem;color:var(--muted);margin-right:4px}
.presets button{font:500 .85rem var(--f-body);padding:7px 12px;border-radius:999px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg);cursor:pointer}
.presets button:hover{border-color:var(--fg)}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
table.data{width:100%;border-collapse:collapse;font-size:.92rem}
table.data th{text-align:left;font:600 .8rem/1.25 var(--f-body);color:var(--muted);padding:12px 14px;background:var(--bg-soft);border-bottom:1px solid var(--line);white-space:nowrap}
table.data td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
table.data tr:last-child td{border-bottom:0}
table.data td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
table.data td.code{font:600 .9rem var(--f-mono);white-space:nowrap}
table.data tr.pick{cursor:pointer}
table.data tr.pick:hover td{background:var(--bg-soft)}
table.data tr.sel td{background:var(--red-soft)}
.tag-v{color:var(--red);font-size:.8rem;font-weight:600}
.tag-w{color:var(--muted);font-size:.8rem}
.result{display:flex;flex-wrap:wrap;gap:28px;padding-top:18px;border-top:1px solid var(--line)}
.result div{display:flex;flex-direction:column;gap:2px}
.result span{font-size:.8rem;color:var(--muted)}
.result b{font:700 1.45rem var(--f-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.viz2{display:grid;grid-template-columns:1.3fr .7fr;gap:20px}
.viz2>*{min-width:0}
@media (max-width:860px){.viz2{grid-template-columns:1fr}}
.panel{border:1px solid var(--line);border-radius:12px;padding:18px;background:var(--bg-soft)}
.panel h3{font-size:.98rem;margin-bottom:12px}
.panel svg,.panel canvas{display:block;width:100%;height:auto}
.bars .bl{font:500 13px var(--f-body);fill:var(--fg)}
.bars .bv{font:600 13px var(--f-body);fill:var(--fg);font-variant-numeric:tabular-nums}
.bars .bt{fill:var(--bg-sunk)}
.bars .bw{fill:var(--c-steel)}
.bars .bvol{fill:var(--red)}
.bars .ref{stroke:var(--fg);stroke-width:1.5;stroke-dasharray:4 4}
.bars .refl{font:500 12px var(--f-body);fill:var(--muted)}
.iso-wrap{position:relative;border:1px solid var(--line);border-radius:12px;background:var(--bg-soft);overflow:hidden}
.iso-wrap canvas{display:block;width:100%;height:auto}
.iso-cap{position:absolute;left:14px;top:12px;font-size:.82rem;color:var(--muted)}
.iso-cap b{color:var(--fg)}
.ctabs{display:flex;gap:8px;flex-wrap:wrap}
.ctabs button{font:600 .88rem var(--f-mono);padding:8px 12px;border-radius:8px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg);cursor:pointer}
.ctabs button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.fillbar{display:inline-block;width:70px;height:6px;border-radius:3px;background:var(--bg-sunk);vertical-align:middle;margin-right:8px;overflow:hidden}
.fillbar i{display:block;height:100%;background:var(--red);border-radius:3px}

/* incoterms matrix */
.inco-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
table.inco{border-collapse:separate;border-spacing:0;width:100%;min-width:860px;font-size:.84rem}
table.inco th{font:600 .78rem/1.25 var(--f-body);color:var(--muted);padding:12px 8px;text-align:center;vertical-align:bottom;border-bottom:1px solid var(--line);background:var(--bg-soft)}
table.inco th:first-child{text-align:left;padding-left:16px;width:84px}
table.inco td{padding:6px 4px;border-bottom:1px solid var(--line);text-align:center;position:relative}
table.inco td:first-child{font:600 .9rem var(--f-mono);text-align:left;padding-left:16px}
table.inco tr{cursor:pointer}
table.inco tr:hover td{background:var(--bg-soft)}
table.inco tr.sel td{background:var(--red-soft)}
table.inco tr:last-child td{border-bottom:0}
.cell{display:block;height:26px;border-radius:5px;font:600 .72rem/26px var(--f-body)}
.cell.s{background:var(--red);color:#fff}
.cell.b{background:var(--bg-sunk);color:var(--muted)}
.risk{position:absolute;top:2px;bottom:2px;right:-2px;width:3px;border-radius:2px;background:var(--fg);z-index:1}
.risk.start{right:auto;left:1px}
.inco-legend{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:.85rem;color:var(--muted);margin:16px 0}
.inco-legend span{display:inline-flex;align-items:center;gap:8px}
.inco-legend i{display:inline-block;width:22px;height:14px;border-radius:4px}
.inco-legend i.s{background:var(--red)}
.inco-legend i.b{background:var(--bg-sunk);border:1px solid var(--line-strong)}
.inco-legend i.k{width:3px;height:18px;background:var(--fg)}
.inco-detail{margin-top:16px;padding:18px 20px;border-radius:12px;border:1px solid var(--line);display:flex;gap:18px;align-items:flex-start}
.inco-detail .code{font-size:1.6rem;color:var(--red);line-height:1}
.inco-detail p{color:var(--muted);margin-top:4px}

/* tracker demo */
.trk{position:relative;display:flex;flex-direction:column;gap:0;max-width:640px}
.trk li{list-style:none;display:grid;grid-template-columns:28px 1fr auto;gap:14px;align-items:start;padding-bottom:22px;position:relative}
.trk li::before{content:"";position:absolute;left:13px;top:22px;bottom:-2px;width:2px;background:var(--line-strong)}
.trk li:last-child::before{display:none}
.trk li.done::before{background:var(--red)}
.trk .dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--line-strong);background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:1}
.trk li.done .dot{background:var(--red);border-color:var(--red);color:#fff}
.trk li.now .dot{border-color:var(--red)}
.trk li.now .dot::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--red);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(.6);opacity:.5}}
.trk .dot .ico{width:15px;height:15px}
.trk b{font-weight:600}
.trk small{color:var(--muted)}
.trk .where{font:500 .82rem var(--f-mono);color:var(--muted)}
.ex-badge{display:inline-block;font-size:.78rem;font-weight:600;color:var(--red);background:var(--red-soft);padding:4px 10px;border-radius:999px;margin-bottom:16px}

/* expert */
.expert{border-radius:16px;background:var(--navy);color:var(--on-navy);padding:40px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;position:relative;overflow:hidden;isolation:isolate}
.expert::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 50% 90% at 100% 0%,rgba(196,42,62,.28),transparent 60%)}
.expert svg.deco{position:absolute;left:38%;bottom:-24px;width:260px;height:104px;z-index:-1;opacity:.35}
.expert h2{color:#fff;font-size:clamp(1.4rem,2.4vw,1.95rem)}
.expert p{color:var(--on-navy-muted);margin-top:10px;max-width:56ch}
@media (max-width:760px){.expert{grid-template-columns:1fr;padding:28px}.expert svg.deco{display:none}}

/* quote */
.quote{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.quote>*{min-width:0}
.contact-list{display:flex;flex-direction:column;gap:18px;margin-top:28px}
.contact-list>div{display:flex;flex-direction:column;gap:4px}
.contact-list .k{font-size:.82rem;color:var(--muted)}
.contact-list .v{font:600 1.1rem/1.3 var(--f-body);text-decoration:none;word-break:break-word}
.contact-list a.v:hover{color:var(--red)}
.contact-list .btn{align-self:flex-start;margin-top:2px}
form.card{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:16px;min-width:0;box-shadow:0 24px 50px -40px rgba(14,24,48,.6)}
.seg{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-sunk);border-radius:9px;padding:4px;gap:4px}
.seg button{border:0;background:transparent;padding:.7em;border-radius:6px;font:600 .9rem var(--f-body);color:var(--muted);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--bg);color:var(--fg);box-shadow:0 1px 3px rgba(17,29,56,.14)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-foot{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.form-foot small{color:var(--muted);max-width:42ch;font-size:.82rem}
.form-foot small a,.news .check a{color:var(--red)}
.err{color:var(--red);font-size:.82rem;min-height:0}
.field.bad input{border-color:var(--red)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
button[disabled]{opacity:.65;cursor:progress}
.done{padding:14px 16px;border-radius:8px;background:var(--bg-soft);border-left:3px solid var(--ok);font-size:.93rem}
@media (max-width:900px){.quote{grid-template-columns:1fr;gap:36px}}
@media (max-width:520px){.row{grid-template-columns:1fr}form.card{padding:20px}}

/* faq */
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 44px 20px 0;font:700 1.04rem/1.35 var(--f-display);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:24px;width:10px;height:10px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(45deg);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);top:29px}
.faq details p{color:var(--muted);padding-bottom:22px;max-width:68ch}
.faq details[open] p{animation:paneIn .25s var(--ease)}
.more-link{margin-top:24px}

/* legal */
.legal{display:grid;grid-template-columns:1fr 1fr 2fr;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.legal div{padding:16px 18px;border-left:1px solid var(--line)}
.legal div:first-child{border-left:0}
.legal dt{font-size:.8rem;color:var(--muted)}
.legal dd{margin:4px 0 0;font-weight:600;font-variant-numeric:tabular-nums}
@media (max-width:860px){.legal{grid-template-columns:1fr 1fr}.legal div:nth-child(3){border-left:0;grid-column:1/-1;border-top:1px solid var(--line)}}
@media (max-width:480px){.legal{grid-template-columns:1fr}.legal div{border-left:0;border-top:1px solid var(--line)}.legal div:first-child{border-top:0}}

/* newsletter + footer */
.news{background:var(--bg-soft);border-top:1px solid var(--line)}
.news .wrap{padding-block:48px;display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.news .wrap>*{min-width:0}
.news h3{font-size:1.4rem}
.news p{color:var(--muted);margin-top:8px}
.news form{display:flex;flex-direction:column;gap:12px}
.news .inline{display:flex;gap:10px;align-items:flex-end}
.news .inline .field{flex:1}
.news .check{font-size:.84rem}
@media (max-width:820px){.news .wrap{grid-template-columns:1fr}}
@media (max-width:480px){.news .inline{flex-direction:column;align-items:stretch}}
footer{background:var(--navy-deep);color:var(--on-navy-muted);padding-block:60px 0;font-size:.88rem;overflow:hidden}
.f-top{display:grid;grid-template-columns:1.3fr repeat(5,1fr);gap:28px}
.f-top>*{min-width:0}
footer .brand-name{color:#fff}
footer .brand-sub{color:var(--on-navy-muted)}
footer h4{font:600 .85rem/1.2 var(--f-body);color:#fff;margin:0 0 14px}
footer ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px}
footer a{text-decoration:none}
footer a:hover{color:#fff}
.f-contacts{margin-top:18px;display:flex;flex-direction:column;gap:8px;color:#fff}
.f-contacts a{display:inline-flex;align-items:center;gap:8px}
.f-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:44px;padding-top:20px;display:flex;flex-wrap:wrap;gap:10px 28px;font-size:.8rem}
.f-bottom a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.25)}
.wordmark{font:800 clamp(4rem,17vw,15rem)/.78 var(--f-display);letter-spacing:.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.13);text-align:center;margin-top:28px;user-select:none;white-space:nowrap;transform:translateY(12%)}
@media (max-width:1000px){.f-top{grid-template-columns:repeat(3,1fr)}.f-top>div:first-child{grid-column:1/-1}}
@media (max-width:560px){.f-top{grid-template-columns:1fr 1fr}}
.totop{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:25;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--fg);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 24px -12px rgba(14,24,48,.5);opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s;pointer-events:none}
.totop.on{opacity:1;transform:none;pointer-events:auto}

/* route change */
#app.enter>*{animation:enter .4s var(--ease) both}
#app.enter>*:nth-child(2){animation-delay:.04s}
@keyframes enter{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ===== scenes (SVG illustrations on navy) ===== */
.sc-stroke{fill:none;stroke:rgba(255,255,255,.55);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sc-faint{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1.2;stroke-linecap:round}
.sc-route{fill:none;stroke:var(--red-on-navy);stroke-width:1.8;stroke-dasharray:3 7;stroke-linecap:round;animation:dash 1.6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.sc-bob{animation:bob 5s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-.6deg)}}
.sc-wave{animation:wave 3s linear infinite}
.sc-wave.slow{animation-duration:6s;opacity:.5}
@keyframes wave{to{transform:translateX(-60px)}}
.sc-slide{animation:slide .9s linear infinite}
@keyframes slide{to{transform:translateX(-24px)}}
.sc-spin{animation:spin 1.1s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes spin{to{transform:rotate(-360deg)}}
.sc-jitter{animation:jit .5s ease-in-out infinite alternate}
@keyframes jit{to{transform:translateY(-1.2px)}}
.sc-float{animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(4px,-8px) rotate(-1.2deg)}}
.sc-cloud{animation:cloud 22s linear infinite}
.sc-cloud.b{animation-duration:34s;opacity:.55}
@keyframes cloud{from{transform:translateX(140px)}to{transform:translateX(-620px)}}
.sc-belt{animation:belt 6s linear infinite}
@keyframes belt{from{transform:translateX(-150px)}to{transform:translateX(560px)}}
.sc-swing{animation:swing 4s ease-in-out infinite;transform-box:view-box}
@keyframes swing{0%,100%{transform:rotate(2.2deg)}50%{transform:rotate(-2.2deg)}}
.sc-stamp{animation:stamp 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes stamp{0%,40%{transform:translateY(-26px) scale(1.12);opacity:.0}55%{transform:none;opacity:1}100%{transform:none;opacity:1}}
.sc-scan{animation:scan 6s ease-in-out infinite alternate}
@keyframes scan{from{transform:translateX(0)}to{transform:translateX(300px)}}
.sc-tick{animation:tick2 6s ease-in-out infinite;opacity:0}
@keyframes tick2{0%,100%{opacity:0}30%,80%{opacity:1}}
.sc-ring{animation:ring 3s ease-out infinite;transform-box:fill-box;transform-origin:center;opacity:0}
@keyframes ring{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.6);opacity:0}}
.sc-trolley{animation:trol 7s ease-in-out infinite alternate}
@keyframes trol{0%,30%{transform:translateX(0)}70%,100%{transform:translateX(150px)}}
.sc-cable{animation:cable 7s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 0}
@keyframes cable{0%{transform:scaleY(1)}30%,70%{transform:scaleY(.42)}100%{transform:scaleY(1)}}
.sc-lift{animation:lift 7s ease-in-out infinite alternate}
@keyframes lift{0%{transform:translate(0,0)}30%{transform:translate(0,-81.2px)}70%{transform:translate(150px,-81.2px)}100%{transform:translate(150px,0)}}
.sc-lift2{animation:lift2 7s ease-in-out infinite alternate}
@keyframes lift2{0%{transform:translate(0,0)}30%{transform:translate(0,-56.8px)}70%{transform:translate(150px,-56.8px)}100%{transform:translate(150px,0)}}
.sc-roaddash{animation:rd .7s linear infinite}
@keyframes rd{to{stroke-dashoffset:44}}
.sc-drop{animation:drop .9s var(--ease) both}
@keyframes drop{from{transform:translateY(-30px)}to{transform:none}}
.sc-push{animation:push 5s ease-in-out infinite}
@keyframes push{0%,15%{transform:translateX(-140px)}55%,100%{transform:translateX(0)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ticker-track{animation:none}
  .sc-stamp{opacity:1}.sc-tick{opacity:1}
}

/* reviews */
.rv-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start}
.rv-wrap>*{min-width:0}
.rv-wrap h2{max-width:16ch}
.rv-list{display:flex;flex-direction:column;gap:14px}
.rv-card{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--bg);transition:border-color .15s,box-shadow .2s}
.rv-card:hover{border-color:var(--line-strong);box-shadow:0 14px 30px -24px rgba(14,24,48,.5)}
.rv-badge{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--bg-sunk);color:var(--red)}
.rv-badge .ico{width:24px;height:24px}
.rv-body h3{font-size:1.1rem}
.rv-sub{color:var(--muted);font-size:.9rem;margin-top:2px}
.rv-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:4px}
.rv-score{font:800 1.3rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.rv-stars{display:inline-flex;gap:1px;color:#f2b01e}
.rv-stars .ico{width:16px;height:16px;fill:currentColor;stroke:none}
.rv-count{color:var(--muted);font-size:.9rem}
.rv-act{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.rv-act .btn{padding:.8em 1.1em;font-size:.9rem}
.rv-act .btn .ico{width:15px;height:15px}
@media (max-width:900px){.rv-wrap{grid-template-columns:1fr;gap:28px}}
@media (max-width:560px){.rv-card{grid-template-columns:auto 1fr}.rv-act{grid-column:1/-1;justify-content:flex-start}}
/* articles */
.art-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.art-card{display:flex;flex-direction:column;gap:10px;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--fg);text-decoration:none;transition:border-color .15s,transform .2s var(--ease),box-shadow .2s;min-width:0}
.art-card:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(14,24,48,.5)}
.art-card h3{font-size:1.15rem;line-height:1.3}
.art-card p{color:var(--muted);font-size:.95rem;flex:1}
.art-meta{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.02em;color:var(--muted)}
.art-go{display:inline-flex;align-items:center;gap:6px;color:var(--red);font-weight:600;font-size:.92rem}
.art-go .ico{width:16px;height:16px}
.prose.art h3{margin-top:32px;font-size:1.3rem}
.prose.art>.art-meta{margin-bottom:8px}
#articles-block .more-link{margin-top:24px}
@media (max-width:900px){.art-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.art-grid{grid-template-columns:1fr}}
/* floating contact */
.fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.fab-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 12px 28px -10px rgba(14,24,48,.6);transition:transform .2s var(--ease),background .15s}
.fab-btn:hover{background:var(--red-hover);transform:scale(1.05)}
.fab-btn .ico{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fab-btn .i-x{display:none}
.fab.open .fab-btn .i-x{display:block}.fab.open .fab-btn .i-chat{display:none}
.fab-menu{display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .18s,transform .18s}
.fab.open .fab-menu{opacity:1;transform:none;pointer-events:auto}
.fab-menu a{display:flex;align-items:center;gap:10px;padding:11px 18px 11px 14px;border-radius:999px;color:#fff;text-decoration:none;font-weight:600;font-size:.95rem;box-shadow:0 10px 24px -12px rgba(14,24,48,.6);white-space:nowrap}
.fab-menu a .ico{width:20px;height:20px}
.fab-tg{background:#229ED9}.fab-wa{background:#1DA851}
.fab-menu a:hover{filter:brightness(1.08)}
.totop{bottom:calc(86px + env(safe-area-inset-bottom,0px))}
@media print{.fab{display:none}}
@media (prefers-reduced-motion:reduce){.fab-menu,.fab-btn{transition:none}}
