/* Motyw dopasowany do nowego logo Pogotowie IT4You */
:root {
  --navy: #10131a;
  --navy2: #171b24;
  --orange: #ff5a00;
  --orange2: #ff7a22;
  --blue: #ff5a00;
  --ink: #10131a;
  --muted: #656a73;
  --paper: #f7f7f5;
  --line: #e8e8e5;
  --shadow: 0 22px 60px rgba(16, 19, 26, .1);
}

body { background: #fff; }

.site-header {
  position: absolute;
  color: var(--ink);
  background: rgba(255,255,255,.88);
  border-bottom: 1px solid rgba(16,19,26,.07);
  backdrop-filter: blur(16px);
}

.brand-logo img { display: block; width: 290px; max-width: 38vw; height: auto; }
.main-nav>a:not(.nav-cta) { color: var(--ink); opacity: .76; }
.main-nav>a:hover { color: var(--orange); }
.nav-phones { display: flex; align-items: center; gap: 6px; }
.nav-phones a { color: #fff; background: var(--ink); border: 1px solid var(--ink); border-radius: 10px; padding: 9px 11px; font-size: 12px; white-space: nowrap; }
.nav-phones a:hover { color: #fff; background: var(--orange); border-color: var(--orange); }
.menu-toggle span:not(.sr-only) { background: var(--ink); }

.hero {
  color: var(--ink);
  background:
    radial-gradient(circle at 83% 35%, rgba(255,90,0,.11), transparent 27%),
    radial-gradient(circle at 7% 80%, rgba(255,90,0,.055), transparent 22%),
    linear-gradient(145deg, #fff 0%, #fbfbf9 58%, #f4f3ef 100%);
}
.hero:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .25;
  background-image: linear-gradient(rgba(16,19,26,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(16,19,26,.055) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to right, transparent, #000 60%, transparent);
}
.hero:after { background: #fff; }
.hero .eyebrow { color: var(--ink); }
.hero-lead { color: var(--muted); }
.btn-primary { color: #fff; background: linear-gradient(135deg, var(--orange), var(--orange2)); box-shadow: 0 14px 34px rgba(255,90,0,.25); }
.btn-ghost { color: var(--ink); border-color: rgba(16,19,26,.2); background: rgba(255,255,255,.72); }
.trust-row span { color: #7a7e85; }
.trust-row div { position: relative; padding-left: 14px; }
.trust-row div:before { content: ""; position: absolute; left: 0; top: 5px; width: 3px; height: 34px; border-radius: 2px; background: var(--orange); }

.orbit-one { border-color: rgba(16,19,26,.09); }
.orbit-two { border-color: rgba(255,90,0,.22); }
.device { background: linear-gradient(145deg, #242933, #0f1218); box-shadow: 0 38px 80px rgba(16,19,26,.24); }
.device-screen { background: linear-gradient(145deg,#fff,#f1f1ed); color: var(--ink); }
.pulse-icon { color: var(--orange); background: #fff1e9; box-shadow: 0 0 0 12px rgba(255,90,0,.07); }
.status-lines i:nth-child(2) { background: linear-gradient(90deg,var(--orange),var(--orange2)); }
.float-card b { color: var(--orange); }
.glow-one { background: var(--orange); opacity: .09; }
.glow-two { background: var(--ink); opacity: .04; }

.service-card.featured { background: var(--ink); border-color: var(--ink); }
.service-icon, .price-head>span { color: var(--orange); background: #fff1e9; }
.featured .service-icon { color: #fff; background: var(--orange); }
.service-card a span, .text-link span { color: var(--orange); }
.about-shape { background: linear-gradient(145deg,#10131a,#292e38); }
.check-list li:before { color: var(--orange); background: #fff1e9; }
.text-link { color: var(--ink); }

.contact { background: #10131a; }
.contact .eyebrow { color: #fff; }
.contact-actions { flex-wrap: wrap; }
.contact-tile>b { color: var(--orange); }
.contact-info a { color: var(--orange); }

footer { background: #080a0e; }
.footer-logo { display: inline-flex; }
.footer-logo img { display: block; width: 240px; height: auto; mix-blend-mode: screen; }

@media (max-width: 980px) {
  .main-nav { color: var(--ink); }
  .brand-logo img { max-width: none; width: 240px; }
  .nav-phones { width: 100%; justify-content: center; flex-wrap: wrap; }
}

@media (max-width: 680px) {
  .brand-logo img { width: 196px; }
  .hero { padding-top: 125px; }
  .mobile-call { padding: 0; overflow: hidden; background: linear-gradient(135deg,var(--orange),var(--orange2)); }
  .mobile-call a { flex: 1; padding: 13px 6px; color: #fff; text-align: center; font-size: 12px; }
  .mobile-call a + a { border-left: 1px solid rgba(255,255,255,.35); }
  .footer-logo img { width: 210px; }
}