/* N1Solutions v2 - nakładka na arkusz wersji klasycznej.
   Zmienia tylko nagłówek strony: kula WebGL z prawdziwymi kontynentami
   na jasnym, niebieskim tle. Reszta strony jest identyczna z wersją klasyczną. */

/* Lenis sam wygładza przewijanie - natywne smooth by z nim kolidowało */
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* ---------- nagłówek strony z kulą (oba motywy) ---------- */
/* podwójna klasa: wygrywa z regułami motywu jasnego wersji klasycznej */
.hero.hero-v2.hero-v2{
  /* motyw ciemny (domyślne wartości): granatowe tło, jasny tekst; jasny motyw nadpisuje niżej */
  --ink:#FFFFFF; --ink-2:#DCE6F8; --muted:#A9BBDA; --muted-2:#8EA3C6;
  --surface:rgba(255,255,255,.12); --line:rgba(255,255,255,.28); --line-2:rgba(255,255,255,.14);
  --accent:#BFDBFE; --accent-strong:#FFFFFF; --accent-2:#A5F3FC;
  --brand-50:rgba(255,255,255,.14); --brand-100:rgba(255,255,255,.3);
  min-height:min(860px,100svh);display:flex;align-items:center;isolation:isolate;
  color:var(--ink-2);
  background:
    radial-gradient(900px 640px at 76% 48%,rgba(37,99,235,.28),transparent 62%),
    radial-gradient(700px 500px at 8% 100%,rgba(99,102,241,.18),transparent 60%),
    linear-gradient(160deg,#0A1630 0%,#0C1D3F 55%,#0B2447 100%);
}
.hero-v2 .hero-bg{opacity:.18}
.hero-v2 .hero-bg::after,.hero-v2 .blob{display:none}
.hero-v2 .hero-inner{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);position:relative;z-index:2;pointer-events:none}
.hero-v2 .hero-copy a,.hero-v2 .hero-copy button{pointer-events:auto}
.hero-v2 .text-grad{background-image:linear-gradient(120deg,#93C5FD,#67E8F9);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-v2 .btn-primary{background:linear-gradient(135deg,#2563EB,#1D4ED8);color:#fff;box-shadow:0 14px 30px -12px rgba(37,99,235,.7)}
.hero-v2 .btn-primary:hover{color:#fff}
.hero-v2 .btn-ghost{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.45)}
.hero-v2 .btn-ghost:hover{background:rgba(255,255,255,.2);color:#fff;border-color:#fff}
.hero-v2 .hero-points svg{color:#A5F3FC}

/* kula na całą szerokość nagłówka; kursor chwytania */
.globe{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:grab;touch-action:pan-y}
.globe.is-drag{cursor:grabbing}

/* etykiety platform - prawdziwe odnośniki do kart kompetencji */
.globe-labels{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.gl{position:absolute;left:0;top:0;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 9px;border-radius:999px;
  font:650 .8rem var(--font);color:#0B2A6B;white-space:nowrap;pointer-events:auto;
  background:rgba(255,255,255,.92);box-shadow:0 8px 20px -10px rgba(3,15,60,.6);
  transition:opacity .3s ease,background .2s ease;will-change:transform}
.gl i{width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.22)}
.gl.warn i{background:#F59E0B;box-shadow:0 0 0 3px rgba(245,158,11,.25)}
.gl:hover,.gl:focus-visible{background:#fff;color:#1D4ED8}
.gl.is-back{pointer-events:none}

/* karta otwarta z kuli - krótkie podświetlenie */
.is-flash{animation:card-flash 2.2s ease-out .4s both}

@media (max-width:1080px){
  .hero-v2 .hero-inner{grid-template-columns:1fr}
  .globe-labels{display:none}
  .globe{opacity:.45}
}

/* ---------- belka w motywie jasnym: biała, żeby odcinała się od niebieskiego nagłówka strony ----------
   Wersja klasyczna ma w motywie jasnym niebieską belkę; tu ją cofamy (klasa .v2 na body). */
:root:not([data-theme="dark"]) .v2 .site-header{background:rgba(255,255,255,.9);border-bottom-color:rgba(15,40,110,.08);box-shadow:none}
:root:not([data-theme="dark"]) .v2 .site-header.is-stuck{box-shadow:0 10px 28px -16px rgba(15,40,110,.35)}
:root:not([data-theme="dark"]) .v2 .brand-text{color:#475569}
:root:not([data-theme="dark"]) .v2 .brand-text strong{color:#0B1220}
:root:not([data-theme="dark"]) .v2 .brand-mark{box-shadow:none}
:root:not([data-theme="dark"]) .v2 .nav-toggle{border-color:#E5EAF2;background:#fff}
:root:not([data-theme="dark"]) .v2 .nav-toggle span{background:#0B1220}
:root:not([data-theme="dark"]) .v2 .scroll-progress{background:linear-gradient(90deg,#2563EB,#0EA5E9,#22D3EE);box-shadow:none}
@media (min-width:1081px){
  :root:not([data-theme="dark"]) .v2 .site-header .nav-list a{color:#334155}
  :root:not([data-theme="dark"]) .v2 .site-header .nav-list a:hover,:root:not([data-theme="dark"]) .v2 .site-header .nav-list a.is-active{color:#1D4ED8}
  :root:not([data-theme="dark"]) .v2 .site-header .nav-list a::after{background:linear-gradient(90deg,#2563EB,#0EA5E9)}
  :root:not([data-theme="dark"]) .v2 .site-header .nav-cta .btn-primary{background:linear-gradient(135deg,#2563EB,#1D4ED8);color:#fff;box-shadow:0 10px 24px -10px rgba(37,99,235,.65)}
  :root:not([data-theme="dark"]) .v2 .site-header .theme-toggle{background:#F1F5FB;border-color:#E5EAF2}
  :root:not([data-theme="dark"]) .v2 .site-header .lang-btn{background:#fff;border-color:#E5EAF2;color:#0B1220}
  :root:not([data-theme="dark"]) .v2 .site-header .cmdk-btn{background:#fff;border-color:#E5EAF2;color:#334155}
}
/* systemowy ciemny motyw bez wyboru użytkownika: zostaw ciemną belkę */
@media (prefers-color-scheme:dark){
  :root:not([data-theme]) .v2 .site-header{background:rgba(var(--bg-rgb),.82)}
  :root:not([data-theme]) .v2 .brand-text{color:var(--muted)}
  :root:not([data-theme]) .v2 .brand-text strong{color:var(--ink)}
  :root:not([data-theme]) .v2 .site-header .nav-list a{color:var(--ink-2)}
  :root:not([data-theme]) .v2 .site-header .lang-btn{background:var(--surface);color:var(--ink);border-color:var(--line)}
  :root:not([data-theme]) .v2 .site-header .theme-toggle{background:var(--bg-alt);border-color:var(--line)}
  :root:not([data-theme]) .v2 .site-header .cmdk-btn{background:var(--surface);color:var(--ink-2);border-color:var(--line)}
}

/* ---------- motyw jasny: jasnoniebieskie tło nagłówka, granatowy tekst; kula bez zmian ---------- */
:root[data-theme="light"] .hero.hero-v2.hero-v2{--ink:#0B1F4D;--ink-2:#1E3A6E;--muted:#3B5585;--muted-2:#5B73A0;--surface:rgba(255,255,255,.7);--line:rgba(37,99,235,.22);--line-2:rgba(37,99,235,.12);--accent:#1D4ED8;--accent-strong:#1E40AF;--accent-2:#0284C7;--brand-50:rgba(255,255,255,.7);--brand-100:rgba(37,99,235,.25);background:radial-gradient(900px 640px at 76% 48%,rgba(147,197,253,.55),transparent 62%),radial-gradient(700px 500px at 8% 100%,rgba(199,210,254,.6),transparent 60%),linear-gradient(160deg,#F4F8FF 0%,#E3EEFF 55%,#D4E6FF 100%)}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero.hero-v2.hero-v2{--ink:#0B1F4D;--ink-2:#1E3A6E;--muted:#3B5585;--muted-2:#5B73A0;--surface:rgba(255,255,255,.7);--line:rgba(37,99,235,.22);--line-2:rgba(37,99,235,.12);--accent:#1D4ED8;--accent-strong:#1E40AF;--accent-2:#0284C7;--brand-50:rgba(255,255,255,.7);--brand-100:rgba(37,99,235,.25);background:radial-gradient(900px 640px at 76% 48%,rgba(147,197,253,.55),transparent 62%),radial-gradient(700px 500px at 8% 100%,rgba(199,210,254,.6),transparent 60%),linear-gradient(160deg,#F4F8FF 0%,#E3EEFF 55%,#D4E6FF 100%)}}
:root[data-theme="light"] .hero-v2 .hero-bg{opacity:.55}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .hero-bg{opacity:.55}}
:root[data-theme="light"] .hero-v2 .text-grad{background-image:linear-gradient(120deg,#1D4ED8,#0284C7)}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .text-grad{background-image:linear-gradient(120deg,#1D4ED8,#0284C7)}}
:root[data-theme="light"] .hero-v2 .btn-primary{background:linear-gradient(135deg,#2563EB,#1D4ED8);color:#fff;box-shadow:0 14px 30px -12px rgba(37,99,235,.6)}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .btn-primary{background:linear-gradient(135deg,#2563EB,#1D4ED8);color:#fff;box-shadow:0 14px 30px -12px rgba(37,99,235,.6)}}
:root[data-theme="light"] .hero-v2 .btn-primary:hover{color:#fff}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .btn-primary:hover{color:#fff}}
:root[data-theme="light"] .hero-v2 .btn-ghost{background:#fff;color:#0B1F4D;border-color:rgba(37,99,235,.25)}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .btn-ghost{background:#fff;color:#0B1F4D;border-color:rgba(37,99,235,.25)}}
:root[data-theme="light"] .hero-v2 .btn-ghost:hover{background:#fff;color:#1D4ED8;border-color:#2563EB}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .btn-ghost:hover{background:#fff;color:#1D4ED8;border-color:#2563EB}}
:root[data-theme="light"] .hero-v2 .hero-points svg{color:#2563EB}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero-v2 .hero-points svg{color:#2563EB}}

/* =====================================================================
   Nagłówek: zdjęcie centrum danych (Pexels) w tle, Ziemia jako drugi plan
   ===================================================================== */
.hero.hero-v2.hero-v2{background-size:cover;background-position:center 30%;}
/* kula pojawia się dopiero po wczytaniu tekstur */
.globe{opacity:0;transition:opacity 1.6s ease}
.globe.is-ready{opacity:1}
/* tekst na pierwszym planie - lekko przyciemnione/rozjaśnione tło pod nim */
.hero-v2 .hero-bg{display:none}
/* etykiety platform: dyskretne, jak podpisy na mapie */
.gl{padding:4px 10px 4px 8px;font-size:.72rem;background:rgba(255,255,255,.78);box-shadow:0 6px 16px -10px rgba(3,15,60,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.gl i{width:6px;height:6px;background:#38BDF8;box-shadow:0 0 0 3px rgba(56,189,248,.25)}
.gl:hover,.gl:focus-visible{background:#fff}
@media (max-width:1080px){.globe.is-ready{opacity:.28}}

/* ---------- Kula jako subtelne drugie tło (bez interakcji) ---------- */
.hero.hero-v2.hero-v2{--globe-dot:#2563EB;--globe-glow:#93C5FD}
:root[data-theme="dark"] .hero.hero-v2.hero-v2{--globe-dot:#7DD3FC;--globe-glow:#2563EB}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.hero-v2.hero-v2{--globe-dot:#7DD3FC;--globe-glow:#2563EB}}
.globe,.globe.is-drag{pointer-events:none;cursor:default}
.globe.is-ready{opacity:.7}
:root[data-theme="dark"] .globe.is-ready{opacity:.6}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .globe.is-ready{opacity:.6}}
@media (max-width:1080px){.globe.is-ready{opacity:.3}}

:root[data-theme="dark"] .globe.is-ready{opacity:.95}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .globe.is-ready{opacity:.95}}
:root[data-theme="dark"] .hero.hero-v2.hero-v2{--globe-dot:#93C5FD;--globe-glow:#3B82F6}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.hero-v2.hero-v2{--globe-dot:#93C5FD;--globe-glow:#3B82F6}}
@media (max-width:1080px){.globe.is-ready,:root[data-theme="dark"] .globe.is-ready{opacity:.3}}

/* ---------- Nagłówek: zdjęcie serwerowni (Pexels) w tle, kula na drugim planie ---------- */
:root[data-theme="light"] .hero.hero-v2.hero-v2{background-image:linear-gradient(90deg,rgba(244,248,255,.97) 0%,rgba(236,244,255,.9) 38%,rgba(222,236,255,.7) 70%,rgba(214,232,255,.62) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"));background-size:cover;background-position:center 30%}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero.hero-v2.hero-v2{background-image:linear-gradient(90deg,rgba(244,248,255,.97) 0%,rgba(236,244,255,.9) 38%,rgba(222,236,255,.7) 70%,rgba(214,232,255,.62) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"));background-size:cover;background-position:center 30%}}
:root[data-theme="dark"] .hero.hero-v2.hero-v2{background-image:linear-gradient(90deg,rgba(7,13,30,.96) 0%,rgba(9,20,46,.9) 40%,rgba(10,24,56,.72) 72%,rgba(9,22,52,.65) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"));background-size:cover;background-position:center 30%}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.hero-v2.hero-v2{background-image:linear-gradient(90deg,rgba(7,13,30,.96) 0%,rgba(9,20,46,.9) 40%,rgba(10,24,56,.72) 72%,rgba(9,22,52,.65) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"));background-size:cover;background-position:center 30%}}

/* ---------- Kula czytelna na zdjęciu: gładka poświata za kulą, mocniej wyciszone zdjęcie ---------- */
:root[data-theme="light"] .hero.hero-v2.hero-v2{--globe-dot:#1D4ED8;--globe-glow:#2563EB;background-image:radial-gradient(440px 440px at 74% 52%,rgba(248,251,255,.97) 0%,rgba(240,246,255,.9) 55%,rgba(232,241,255,0) 100%),linear-gradient(90deg,rgba(244,248,255,.97) 0%,rgba(236,244,255,.92) 40%,rgba(226,238,255,.86) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"))}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero.hero-v2.hero-v2{--globe-dot:#1D4ED8;--globe-glow:#2563EB;background-image:radial-gradient(440px 440px at 74% 52%,rgba(248,251,255,.97) 0%,rgba(240,246,255,.9) 55%,rgba(232,241,255,0) 100%),linear-gradient(90deg,rgba(244,248,255,.97) 0%,rgba(236,244,255,.92) 40%,rgba(226,238,255,.86) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"))}}
:root[data-theme="dark"] .hero.hero-v2.hero-v2{--globe-dot:#93C5FD;--globe-glow:#60A5FA;background-image:radial-gradient(440px 440px at 74% 52%,rgba(10,22,52,.95) 0%,rgba(9,20,46,.88) 55%,rgba(9,20,46,0) 100%),linear-gradient(90deg,rgba(7,13,30,.96) 0%,rgba(9,20,46,.92) 40%,rgba(10,24,56,.85) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"))}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.hero-v2.hero-v2{--globe-dot:#93C5FD;--globe-glow:#60A5FA;background-image:radial-gradient(440px 440px at 74% 52%,rgba(10,22,52,.95) 0%,rgba(9,20,46,.88) 55%,rgba(9,20,46,0) 100%),linear-gradient(90deg,rgba(7,13,30,.96) 0%,rgba(9,20,46,.92) 40%,rgba(10,24,56,.85) 100%),image-set(url("../img/photo/hero-dc.webp") type("image/webp"),url("../img/photo/hero-dc.jpg") type("image/jpeg"))}}
@media (min-width:1081px){.globe.is-ready,:root[data-theme="dark"] .globe.is-ready{opacity:1}}
@media (min-width:1081px) and (prefers-color-scheme:dark){:root:not([data-theme]) .globe.is-ready{opacity:1}}

/* ---------- Tło nagłówka: film z korytarza serwerowni (Mixkit) zamiast zdjęcia ---------- */
:root .hero.hero-v2.hero-v2.hero-v2,:root:not([data-theme]) .hero.hero-v2.hero-v2.hero-v2{background-image:linear-gradient(160deg,#F4F8FF 0%,#E3EEFF 55%,#D4E6FF 100%)}
:root[data-theme="dark"] .hero.hero-v2.hero-v2.hero-v2{background-image:linear-gradient(160deg,#070D1E 0%,#0A1838 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .hero.hero-v2.hero-v2.hero-v2{background-image:linear-gradient(160deg,#070D1E 0%,#0A1838 100%)}}
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;pointer-events:none;
  opacity:0;transition:opacity 1.4s ease;filter:saturate(.85);
  /* wygaszenie w stronę tekstu i do dołu */
  -webkit-mask:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 62%),linear-gradient(180deg,#000 80%,transparent);
  -webkit-mask-composite:source-in;
  mask:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 62%) intersect,linear-gradient(180deg,#000 80%,transparent);
}
.hero-video.is-ready,.hero-video[poster]{opacity:.4}
:root[data-theme="dark"] .hero-video{filter:saturate(.9) brightness(.9)}
:root[data-theme="dark"] .hero-video.is-ready,:root[data-theme="dark"] .hero-video[poster]{opacity:.6}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]) .hero-video{filter:saturate(.9) brightness(.9)}
  :root:not([data-theme]) .hero-video.is-ready,:root:not([data-theme]) .hero-video[poster]{opacity:.6}
}
.globe{display:none}
@media (max-width:1080px){:root .hero .hero-video.hero-video.hero-video{opacity:.3}}