:root {
  --bg: #071322;
  --bg-soft: #0d1b2d;
  --panel: rgba(7, 19, 34, 0.84);
  --panel-2: rgba(10, 27, 45, 0.92);
  --line: rgba(155, 136, 100, 0.48);
  --line-strong: rgba(217, 195, 154, 0.9);
  --text: #f5f7fb;
  --muted: #a5b0c0;
  --brand: #9b8864;
  --brand-2: #d9c39a;
  --glow: rgba(155, 136, 100, 0.18);
}
* { border-radius: 0 !important; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Montserrat', sans-serif;
  color: var(--text);
  background: linear-gradient(180deg, #05101c 0%, #071322 55%, #060f1c 100%);
  line-height: 1.5;
}
.site-shell { position: relative; overflow-x: clip; }
.network-canvas,
.network-canvas::before,
.network-canvas::after {
  position: absolute; inset: 0; content: ""; pointer-events: none;
}
.network-canvas {
  z-index: 0;
  opacity: .95;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,116,181,.22), transparent 23%),
    radial-gradient(circle at 82% 20%, rgba(155,136,100,.12), transparent 18%),
    radial-gradient(circle at 35% 64%, rgba(57,116,181,.09), transparent 24%),
    linear-gradient(180deg, rgba(5, 16, 28, .28), rgba(5, 16, 28, .78));
}
.network-canvas::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='1200' viewBox='0 0 1200 1200'%3E%3Cg stroke='%239b8864' stroke-opacity='0.22' stroke-width='1' fill='none'%3E%3Cpath d='M54 160L180 94 286 150 426 104 560 164 704 100 820 190 932 122 1080 180'/%3E%3Cpath d='M94 348L228 290 362 340 510 280 660 352 780 282 912 342 1060 270'/%3E%3Cpath d='M42 580L196 510 330 590 492 540 634 612 772 534 926 604 1100 530'/%3E%3Cpath d='M84 834L244 756 390 822 522 748 678 804 838 736 982 808 1110 732'/%3E%3Cpath d='M188 94L228 290M286 150L362 340M426 104L510 280M560 164L660 352M704 100L780 282M820 190L912 342M196 510L244 756M330 590L390 822M492 540L522 748M634 612L678 804M772 534L838 736M926 604L982 808'/%3E%3C/g%3E%3Cg fill='%23d9c39a' fill-opacity='0.78'%3E%3Ccircle cx='54' cy='160' r='2'/%3E%3Ccircle cx='180' cy='94' r='2.4'/%3E%3Ccircle cx='286' cy='150' r='1.8'/%3E%3Ccircle cx='426' cy='104' r='2'/%3E%3Ccircle cx='560' cy='164' r='2.6'/%3E%3Ccircle cx='704' cy='100' r='2'/%3E%3Ccircle cx='820' cy='190' r='2.2'/%3E%3Ccircle cx='932' cy='122' r='2.2'/%3E%3Ccircle cx='1080' cy='180' r='2.6'/%3E%3Ccircle cx='94' cy='348' r='2.4'/%3E%3Ccircle cx='228' cy='290' r='1.8'/%3E%3Ccircle cx='362' cy='340' r='2'/%3E%3Ccircle cx='510' cy='280' r='2.2'/%3E%3Ccircle cx='660' cy='352' r='2.4'/%3E%3Ccircle cx='780' cy='282' r='1.8'/%3E%3Ccircle cx='912' cy='342' r='2.2'/%3E%3Ccircle cx='1060' cy='270' r='2.6'/%3E%3Ccircle cx='42' cy='580' r='2.2'/%3E%3Ccircle cx='196' cy='510' r='2.6'/%3E%3Ccircle cx='330' cy='590' r='2.2'/%3E%3Ccircle cx='492' cy='540' r='1.8'/%3E%3Ccircle cx='634' cy='612' r='2.4'/%3E%3Ccircle cx='772' cy='534' r='2.2'/%3E%3Ccircle cx='926' cy='604' r='2.6'/%3E%3Ccircle cx='1100' cy='530' r='1.8'/%3E%3Ccircle cx='84' cy='834' r='2.6'/%3E%3Ccircle cx='244' cy='756' r='2.2'/%3E%3Ccircle cx='390' cy='822' r='1.8'/%3E%3Ccircle cx='522' cy='748' r='2.2'/%3E%3Ccircle cx='678' cy='804' r='2.6'/%3E%3Ccircle cx='838' cy='736' r='2'/%3E%3Ccircle cx='982' cy='808' r='2.4'/%3E%3Ccircle cx='1110' cy='732' r='2'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 1000px auto;
  opacity: .42;
}
.network-canvas::after {
  background-image:
    radial-gradient(circle, rgba(217,195,154,.72) 0 1.5px, transparent 1.5px),
    radial-gradient(circle, rgba(73,126,186,.6) 0 1px, transparent 1px);
  background-size: 220px 220px, 180px 180px;
  background-position: 50px 90px, 110px 40px;
  opacity: .25;
}
main, header, footer { position: relative; z-index: 1; }
.container-shell { width: min(1280px, calc(100% - 32px)); margin-inline: auto; }
.section-frame { border: 1px solid var(--line); background: linear-gradient(180deg, rgba(8,20,36,.88), rgba(8,20,36,.68)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 0 1px rgba(155,136,100,.06), 0 24px 60px rgba(0,0,0,.18); }
.grid-frame { border: 1px solid var(--line); position: relative; }
.grid-frame::before,
.grid-frame::after { content: ''; position: absolute; width: 22px; height: 22px; border-color: var(--brand); }
.grid-frame::before { top: -1px; left: -1px; border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-strong); }
.grid-frame::after { bottom: -1px; right: -1px; border-bottom: 1px solid var(--line-strong); border-right: 1px solid var(--line-strong); }
.eyebrow { letter-spacing: .18em; text-transform: uppercase; color: var(--brand-2); font-size: .8rem; }
.section-title { font-size: clamp(1.7rem, 2.6vw, 3rem); line-height: 1.5; font-weight: 600; }
.copy-muted { color: var(--muted); }
.brand-text { color: var(--brand-2); }
.btn-brand, .btn-outline {
  display: inline-flex; align-items: center; gap: .75rem; padding: 1rem 1.35rem; font-size: .92rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; transition: .25s ease;
}
.btn-brand { background: linear-gradient(180deg, #d8c297, #a58e66); color: #081322; border: 1px solid #d8c297; }
.btn-brand:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,.15), 0 16px 30px rgba(155,136,100,.26); }
.btn-outline { border: 1px solid var(--line-strong); color: var(--text); background: rgba(255,255,255,.01); }
.btn-outline:hover { background: rgba(155,136,100,.08); }
.tech-card { border: 1px solid var(--line); background: linear-gradient(180deg, rgba(6,16,28,.8), rgba(8,19,35,.92)); padding: 1.5rem; height: 100%; }
.tech-icon { width: 3rem; height: 3rem; color: var(--brand-2); }
.hero-visual,
.product-visual,
.article-visual,
.map-visual {
  min-height: 100%; border: 1px solid var(--line); position: relative; overflow: hidden; background: linear-gradient(145deg, #0d1b2d, #08111e); }
.article-visual { min-height: auto; }
.hero-visual::before,
.product-visual::before,
.article-visual::before,
.map-visual::before {
  content: ''; position: absolute; inset: 0; background:
    linear-gradient(120deg, rgba(217,195,154,.04), transparent 40%),
    radial-gradient(circle at 20% 18%, rgba(65,128,196,.28), transparent 20%),
    radial-gradient(circle at 74% 68%, rgba(65,128,196,.2), transparent 28%),
    linear-gradient(180deg, rgba(7,19,34,.25), rgba(7,19,34,.65));
}
.hero-visual::after { content: ''; position: absolute; inset: 10% 8% auto auto; width: 36%; height: 36%; border: 1px solid rgba(217,195,154,.35); }
.hero-screen, .visual-screen { position: absolute; border: 1px solid rgba(217,195,154,.48); background: linear-gradient(180deg, rgba(10,24,42,.82), rgba(16,57,108,.58)); box-shadow: inset 0 0 50px rgba(108,164,219,.22); }
.hero-screen h4, .visual-screen h4 { font-size: .9rem; letter-spacing: .1em; text-transform: uppercase; color: #dce8f6; }
.dashboard-line { height: 3px; background: linear-gradient(90deg, rgba(217,195,154,.9), rgba(74,132,196,.2)); margin-bottom: .45rem; }
.hero-screen ul li, .visual-screen ul li { color: #c5d3e2; font-size: .84rem; margin: .4rem 0; }
.stat-card { border-left: 1px solid var(--line); padding-left: 1rem; }
.nav-link { font-size: .86rem; text-transform: uppercase; letter-spacing: .1em; color: rgba(245,247,251,.82); }
.nav-link:hover, .nav-link.active { color: var(--brand-2); }
.logo-lockup img { height: 42px; width: auto; }
.mobile-menu { display: none; }
.kpi { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.timeline-step { position: relative; }
.timeline-step:not(:last-child)::after { content: ''; position: absolute; top: 2rem; right: -1rem; width: 2rem; height: 1px; background: var(--line-strong); }
.input-tech, .textarea-tech {
  width: 100%; background: rgba(255,255,255,.01); border: 1px solid var(--line); padding: .9rem 1rem; color: var(--text); outline: none;
}
.input-tech:focus, .textarea-tech:focus { border-color: var(--line-strong); box-shadow: 0 0 0 1px rgba(217,195,154,.18); }
.footer-grid { border-top: 1px solid var(--line); }
.hero-badge { border: 1px solid var(--line); padding: .7rem 1rem; background: rgba(255,255,255,.02); }
.bar-separator { height: 1px; background: linear-gradient(90deg, transparent, rgba(217,195,154,.9), transparent); }
.table-tech th, .table-tech td { border: 1px solid var(--line); padding: .9rem; text-align: left; }
.table-tech th { color: var(--brand-2); font-weight: 600; }
@media (max-width: 1024px) {
  .timeline-step:not(:last-child)::after { display: none; }
}
@media (max-width: 960px) {
  .desktop-nav { display: none; }
  .mobile-menu { display: block; }
}