/* FMTECH 2026 — solid, editorial visual system */
:root { --ink:#dce8f7; --navy:#020a16; --navy-2:#06162d; --navy-3:#0b2344; --surface:#071a33; --surface-2:#0a2344; --cyan:#0b5cff; --cyan-2:#53a1ff; --coral:#ff4d2e; --sand:#061426; --white:#f5f9ff; --muted:#93a9c5; --line:rgba(104,148,205,.24); --shadow:0 22px 55px rgba(0,5,15,.42); }
body { color:var(--ink); background:#020b18; }
.section { padding:88px 0; }
.section-title { letter-spacing:-.04em; }
.section-lead { color:#9bb0ca; }
.eyebrow { color:#69adff; }
.eyebrow::before { width:38px; height:3px; background:#0b5cff; }

.header { background:#020b18; border-bottom:1px solid rgba(83,161,255,.14); }
.header.scrolled { background:#020b18; backdrop-filter:none; border-color:rgba(83,161,255,.3); box-shadow:0 12px 35px rgba(0,0,0,.28); }
.nav { height:70px; }
.logo img { width:208px; }
.nav-links { color:#d5e2f2; }
.nav-links a:not(.btn) { position:relative; }
.nav-links a:not(.btn)::after { content:""; position:absolute; right:0; bottom:-9px; left:0; height:2px; background:#0b5cff; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.nav-links a:not(.btn):hover { color:white; }
.nav-links a:not(.btn):hover::after { transform:scaleX(1); }
.menu-btn { border-radius:2px; border-color:#294a73; background:#081a32; }

.btn { min-height:52px; border-radius:2px; letter-spacing:-.01em; transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease; }
.btn:hover { transform:translateY(-3px); }
.btn-primary { color:#fff; background:#0b5cff; box-shadow:7px 7px 0 #00378d; }
.btn-primary:hover { background:#2372ff; box-shadow:4px 4px 0 #00378d; }
.btn-secondary { color:#fff; border:1px solid #31557f; background:#07182e; }
.btn-secondary:hover { border-color:#53a1ff; background:#0a2344; }
.btn-light { color:#061426; background:#f5f9ff; }

.hero { min-height:600px; padding:86px 0 38px; background:linear-gradient(90deg,#020a16 0%,#06162d 58%,#072b59 100%); border-bottom:1px solid #123963; }
.hero::before { content:""; position:absolute; inset:70px 0 0; opacity:.16; pointer-events:none; background-image:linear-gradient(rgba(83,161,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(83,161,255,.16) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(90deg,transparent 0%,black 62%,black 100%); }
.hero::after { width:32%; height:5px; right:0; bottom:0; border:0; border-radius:0; background:#0b5cff; }
.hero-grid { grid-template-columns:1.02fr .98fr; gap:56px; }
.hero-badge { padding:8px 11px; color:#bcd9ff; border:1px solid #275d99; border-radius:2px; background:#071a33; text-transform:uppercase; letter-spacing:.04em; }
.hero-badge span { width:7px; height:7px; border-radius:0; background:#0b5cff; box-shadow:none; animation:signal-pulse 1.8s ease-in-out infinite; }
.hero h1 { max-width:690px; color:#f5f9ff; }
.hero h1 em { color:#53a1ff; }
.hero-copy>p { color:#b0c2d9; }
.hero-note { color:#9cb0c9; }
.hero-note span::before,.contact-info span::before { border-color:#53a1ff; }
.browser { border:1px solid #315b8a; border-radius:3px; background:#07182b; box-shadow:18px 18px 0 #03101f,19px 19px 0 #1c4778; transform:none; }
.browser:hover { transform:translate(-4px,-4px); box-shadow:22px 22px 0 #03101f,23px 23px 0 #1c4778; }
.browser-top { background:#0b2344; border-bottom:1px solid #315b8a; }
.browser-top i { width:8px; height:8px; border-radius:0; background:#78a5d4; }
.mock-tag { border-radius:1px; color:#fff; background:#0b5cff; }
.mock-card { border-color:#315b8a; border-radius:2px; background:#06162d; box-shadow:none; }
.chat-bubble { right:-18px; border-color:#315b8a; border-radius:2px; background:#071a33; box-shadow:8px 8px 0 rgba(0,0,0,.35); transform:none; animation:chat-shift 4s ease-in-out infinite; }

.trust { background:#041124; border-bottom-color:#193d67; }
.trust-item { border-color:#193d67; }
.trust-item b { color:#f4f8ff; }
.trust-item span { color:#839bb7; }
.local-seo { background:#071a33; border-color:#1e4776; }
.local-seo::before { width:34%; height:100%; right:0; top:0; border:0; border-radius:0; box-shadow:none; background:#0b5cff; opacity:.08; clip-path:polygon(30% 0,100% 0,100% 100%,0 100%); }
.local-pill { border-radius:2px; color:#bcd9ff; border-color:#315b8a; background:#0a2344; }
.local-card { border-radius:3px; border-color:#315b8a; background:#041124; box-shadow:14px 14px 0 #020c19; backdrop-filter:none; }
.local-checklist li::before { border-radius:0; color:#fff; background:#0b5cff; }

.problem { background:#041124; }
.problem-card,.service,.price-card { border-radius:3px; border-color:#1e4776; background:#071a33; box-shadow:none; }
.problem-card { border-left:4px solid #0b5cff; }
.problem-card:hover { transform:translateX(8px); border-color:#53a1ff; }
.problem-card .number { border-radius:0; background:#ff4d2e; }
.service { border-top:3px solid #0b5cff; }
.service::before { background:linear-gradient(115deg,rgba(11,92,255,.12),transparent 58%); }
.service:hover { transform:translateY(-7px); border-color:#53a1ff; box-shadow:9px 9px 0 #020b18; }
.service-icon { border-radius:1px; color:#82baff; border-color:#315b8a; background:#0a2344; }
.service:hover .service-icon { transform:translateX(4px); }

.studio { background:#020b18; }
.studio-card { border-radius:2px; border-color:#294f7b; box-shadow:none; }
.studio-card::after { background:linear-gradient(transparent,rgba(1,8,18,.98)); }
.studio-card-copy span { color:#69adff; }
.studio-card:hover img { transform:scale(1.045); }
.demo { background:#061426; }
.demo-point i { border-radius:0; background:#0b5cff; }
.demo-point i::before { border-color:white; }
.comparison { border-radius:2px; border:1px solid #315b8a; box-shadow:14px 14px 0 #020b18; }
.demo-panel { padding:34px; border:1px solid #315b8a; border-top:5px solid #0b5cff; background:#041124; box-shadow:14px 14px 0 #020b18; }
.demo-panel-kicker { display:block; margin-bottom:24px; color:#69adff; font-size:.76rem; font-weight:800; letter-spacing:.14em; }
.demo-panel-row { display:grid; grid-template-columns:52px 1fr; gap:18px; padding:22px 0; border-top:1px solid #1e4776; }
.demo-panel-row>b { color:#53a1ff; font-family:"Manrope",sans-serif; font-size:1.5rem; }
.demo-panel-row strong,.demo-panel-row span { display:block; }
.demo-panel-row strong { margin-bottom:6px; color:#f5f9ff; font-family:"Manrope",sans-serif; }
.demo-panel-row span { color:#93a9c5; line-height:1.55; }

.pricing { background:#020b18; }
.price-card { border-top:4px solid #294f7b; }
.price-card:hover { border-color:#53a1ff; box-shadow:8px 8px 0 #020812; }
.price-card.featured { background:#0a2344; border-color:#0b5cff; transform:translateY(-8px); box-shadow:10px 10px 0 #001f55; }
.popular { top:-14px; border-radius:0; color:#fff; background:#0b5cff; }
.price-list li::before { width:5px; height:9px; flex-basis:5px; margin-top:3px; border-color:#53a1ff; }
.maintenance { border-radius:2px; border-color:#315b8a; background:#071a33; }
.step { border-color:#1e4776; border-top:4px solid #0b5cff; background:#071a33; }
.step:hover { background:#0a2344; box-shadow:7px 7px 0 #020b18; }
.step span { color:#53a1ff; }

.about { background:#041124; }
.about-visual { border-radius:2px; border-color:#315b8a; box-shadow:14px 14px 0 #020b18; }
.about-caption::before { background:#0b5cff; box-shadow:none; }
details { border-color:#294f7b; }
summary { color:#f1f6fd; }
summary::after { color:#53a1ff; }
.contact { background:#061a35; border-top:5px solid #0b5cff; }
.contact-card { border-radius:3px; border-color:#315b8a; background:#041124; backdrop-filter:none; box-shadow:12px 12px 0 #020b18; }
input,select,textarea { border-radius:1px; color:white; border-color:#315b8a; background:#071a33; }
input:focus,select:focus,textarea:focus { border-color:#53a1ff; box-shadow:inset 4px 0 0 #0b5cff; }
footer { background:#020812; border-color:#1e4776; }
.whatsapp-float { border-radius:3px; border:2px solid #8fffc0; box-shadow:7px 7px 0 rgba(0,0,0,.35); }
.whatsapp-service-icon { border-radius:1px; box-shadow:none; }
.reveal { transform:translateY(24px); transition-duration:.65s; }

@keyframes signal-pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.45; transform:scale(.65); } }
@keyframes chat-shift { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }

@media (max-width:980px) {
  .nav-links { background:#020b18; border-color:#294f7b; }
  .hero-grid { grid-template-columns:1fr; gap:48px; }
  .browser { box-shadow:12px 12px 0 #03101f,13px 13px 0 #1c4778; }
}
@media (max-width:680px) {
  .section { padding:70px 0; }
  .hero { padding-top:82px; }
  .hero::before { background-size:48px 48px; }
  .hero-badge { font-size:.72rem; }
  .btn-primary { box-shadow:5px 5px 0 #00378d; }
  .local-card,.comparison,.demo-panel,.about-visual,.contact-card { box-shadow:7px 7px 0 #020b18; }
  .demo-panel { padding:24px 20px; }
  .demo-panel-row { grid-template-columns:1fr; justify-items:center; }
  .price-card.featured { box-shadow:7px 7px 0 #001f55; }
  .whatsapp-float { border-radius:2px; }
}
@media (min-width:981px) and (max-height:780px) {
  .hero { min-height:calc(100svh - 70px); padding:78px 0 30px; }
  .hero h1 { margin-block:14px; font-size:clamp(2.7rem,4vw,3.8rem); }
  .hero-copy>p { margin-bottom:18px; }
}
@media (prefers-reduced-motion:reduce) { .hero-badge span,.chat-bubble { animation:none!important; } }