/* =========================================================
   Victoria Academy — system projektowy v2
   Typografia: Fraunces (display) + Instrument Sans (tekst)
   Paleta: głęboki granat, mosiądz, porcelana
   ========================================================= */

:root{
  /* granaty */
  --ink:#071427;
  --navy-900:#071427;
  --navy-800:#0b2039;
  --navy-700:#0f2a4a;
  --navy-600:#1b3f6b;
  --navy-500:#26558c;

  /* mosiądz */
  --brass:#b08d4f;
  --brass-600:#8d6f3a;
  --brass-300:#dcc189;
  --brass-100:#f1e7d3;

  /* neutralne */
  --text:#48566e;
  --muted:#66748d;
  --line:#e2e7ef;
  --line-strong:#cfd8e6;
  --bg:#ffffff;
  --bg-soft:#f7f8fa;
  --bg-tint:#eef1f6;

  /* system */
  --radius-sm:10px;
  --radius:16px;
  --radius-lg:24px;
  --shadow-xs:0 1px 2px rgba(7,20,39,.06);
  --shadow-sm:0 4px 16px -6px rgba(7,20,39,.12);
  --shadow:0 20px 44px -24px rgba(7,20,39,.30);
  --shadow-lg:0 44px 90px -40px rgba(7,20,39,.55);
  --wrap:1180px;
  --wrap-narrow:820px;
  --header-h:76px;

  --ff-display:"Fraunces","Georgia",serif;
  --ff-body:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

/* ---------- reset i podstawy ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--ff-body);font-size:17px;line-height:1.68;font-weight:400;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;font-feature-settings:"kern" 1,"liga" 1;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy-600);text-decoration:none;transition:color .2s ease}
a:hover{color:var(--brass-600)}
p{margin:0 0 1.15em}
ul,ol{margin:0 0 1.2em;padding-left:1.25em}
li{margin-bottom:.5em}
strong,b{color:var(--ink);font-weight:600}
/* Na ciemnym tle pogrubienia muszą być jasne — inaczej znikają. */
.hero strong,.hero b,.page-hero strong,.page-hero b,
.section--dark strong,.section--dark b,
.cta-band strong,.cta-band b,
.trustbar strong,.site-footer strong{color:#fff}
hr{border:0;border-top:1px solid var(--line);margin:2.6rem 0}
::selection{background:var(--brass-100);color:var(--navy-800)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:3px}

h1,h2,h3,h4,h5{
  margin:0 0 .5em;color:var(--ink);line-height:1.14;text-wrap:balance;
  font-family:var(--ff-display);font-weight:500;
  font-variation-settings:"SOFT" 0,"WONK" 0;
  letter-spacing:-.018em;
}
h1{font-size:clamp(2.3rem,4.6vw,3.75rem);font-weight:400;font-variation-settings:"SOFT" 0,"WONK" 0,"opsz" 96}
h2{font-size:clamp(1.75rem,3.2vw,2.6rem);font-weight:400;font-variation-settings:"SOFT" 0,"WONK" 0,"opsz" 60}
h3{font-size:clamp(1.15rem,1.7vw,1.35rem);font-weight:600;font-family:var(--ff-body);letter-spacing:-.012em;line-height:1.32}
h4{font-size:1.02rem;font-weight:600;font-family:var(--ff-body);letter-spacing:-.008em}

/* ---------- układ ---------- */
.wrap{width:min(100% - 44px,var(--wrap));margin-inline:auto}
.wrap-narrow{width:min(100% - 44px,var(--wrap-narrow));margin-inline:auto}
.section{padding:clamp(60px,7.5vw,116px) 0;position:relative}
.section--soft{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section--tint{background:var(--bg-tint)}
.section--dark{background:var(--navy-900);color:#a9bad6}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:#fff}
.section--dark a{color:var(--brass-300)}
.section--tight{padding:clamp(44px,5vw,72px) 0}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.text-center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- nagłówki sekcji ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:11px;font-family:var(--ff-body);
  font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--brass-600);margin-bottom:16px;
}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--brass);display:block;flex:none}
.section--dark .eyebrow,.hero .eyebrow,.page-hero .eyebrow{color:var(--brass-300)}
.section--dark .eyebrow::before,.hero .eyebrow::before,.page-hero .eyebrow::before{background:var(--brass-300)}
.section-head{max-width:750px;margin-bottom:clamp(34px,4vw,58px)}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}
.section-head p{font-size:1.06rem;color:var(--text);margin-bottom:0;max-width:66ch}
.section-head.center p{margin-inline:auto}
.section--dark .section-head p{color:#93a7c6}
.lead{font-size:1.14rem;line-height:1.62;color:var(--text)}

/* ---------- przyciski ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;border-radius:6px;font-weight:600;font-size:.95rem;
  letter-spacing:.005em;border:1px solid transparent;cursor:pointer;
  transition:background-color .22s ease,color .22s ease,border-color .22s ease,transform .22s ease,box-shadow .22s ease;
  text-align:center;line-height:1.2;font-family:var(--ff-body);
}
.btn-primary{background:var(--brass);color:var(--navy-900);box-shadow:var(--shadow-xs)}
.btn-primary:hover{background:var(--brass-300);color:var(--navy-900);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn-navy{background:var(--navy-800);color:#fff}
.btn-navy:hover{background:var(--navy-600);color:#fff;transform:translateY(-1px)}
.btn-outline{border-color:rgba(255,255,255,.28);color:#fff;background:transparent}
.btn-outline:hover{background:#fff;color:var(--navy-900);border-color:#fff}
.btn-ghost{border-color:var(--line-strong);color:var(--ink);background:#fff}
.btn-ghost:hover{border-color:var(--navy-700);color:var(--navy-700)}
.btn-lg{padding:17px 36px;font-size:1rem}
.btn-sm{padding:11px 20px;font-size:.86rem}
.btn-block{width:100%}
.btn-group{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn-group.center{justify-content:center}

/* ---------- pasek górny ---------- */
.topbar{
  background:var(--navy-900);color:#8ea3c2;font-size:.82rem;padding:10px 0;
  border-bottom:1px solid rgba(255,255,255,.07);letter-spacing:.005em;
}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.topbar a{color:#c2d0e6}
.topbar a:hover{color:var(--brass-300)}
.topbar-info{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.topbar-info span{display:inline-flex;align-items:center;gap:8px}
.topbar-badge{color:var(--brass-300);font-weight:600;letter-spacing:.05em}

/* ---------- nagłówek (ciemny — pod srebrne logo) ---------- */
.site-header{
  position:sticky;top:0;z-index:900;background:rgba(7,20,39,.92);
  backdrop-filter:saturate(150%) blur(12px);-webkit-backdrop-filter:saturate(150%) blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08);transition:box-shadow .3s ease,background-color .3s ease;
}
.site-header.is-stuck{background:rgba(7,20,39,.98);box-shadow:0 10px 34px -22px rgba(0,0,0,.9)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--header-h)}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand img{max-height:44px;width:auto}
.brand-text{font-family:var(--ff-display);font-size:1.2rem;color:#fff;line-height:1.1}
.brand-text small{display:block;font-family:var(--ff-body);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--brass-300);font-weight:600}

.main-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.main-nav ul{display:flex;list-style:none;margin:0;padding:0;gap:1px;align-items:center}
.main-nav li{margin:0;position:relative}
.main-nav > ul > li > a{
  display:block;padding:9px 14px;font-size:.9rem;font-weight:500;color:#d3ddec;border-radius:5px;
  letter-spacing:.005em;
}
.main-nav > ul > li > a:hover,
.main-nav > ul > li.current-menu-item > a,
.main-nav > ul > li.current-page-ancestor > a{background:rgba(255,255,255,.08);color:#fff}
.main-nav .menu-item-has-children > a::after{
  content:"";display:inline-block;width:5px;height:5px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:8px;opacity:.6;
}
.main-nav .sub-menu{
  /* Uwaga: nadrzędna reguła `.main-nav ul{display:flex}` ustawia wiersz —
     rozwijane menu musi jawnie wracać do kolumny. */
  position:absolute;top:100%;left:0;min-width:264px;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow);padding:8px;margin-top:10px;
  display:flex;flex-direction:column;align-items:stretch;gap:2px;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(6px);transition:opacity .2s ease,transform .22s cubic-bezier(.2,.84,.28,1),visibility .2s;
  z-index:60;
}
/* niewidzialny „mostek" nad listą — kursor przechodzi z pozycji menu
   na listę bez przerwy, więc rozwinięcie nie znika w połowie drogi */
.main-nav .sub-menu::before{
  content:"";position:absolute;left:0;right:0;top:-12px;height:14px;
}
.main-nav li:hover > .sub-menu,
.main-nav li:focus-within > .sub-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.main-nav .sub-menu li{width:100%}
.main-nav .sub-menu a{display:block;width:100%;padding:11px 13px;border-radius:8px;font-size:.9rem;color:var(--text);white-space:normal}
.main-nav .sub-menu a:hover{background:var(--bg-tint);color:var(--navy-700)}
.main-nav .sub-menu .current-menu-item > a{color:var(--navy-700);font-weight:600}
.main-nav > ul > li:nth-last-child(-n+2) .sub-menu{left:auto;right:0}

.header-cta{display:flex;align-items:center;gap:14px;flex-shrink:0}
.header-phone{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#fff;font-size:.92rem}
.header-phone:hover{color:var(--brass-300)}
.header-phone svg{color:var(--brass-300)}
.main-nav-cta{display:none}
.nav-toggle{display:none;background:none;border:0;padding:9px;cursor:pointer;color:#fff}
.nav-toggle span{display:block;width:22px;height:2px;background:currentColor;margin:5px 0;border-radius:2px;transition:.3s}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-open span:nth-child(2){opacity:0}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{
  position:relative;background:var(--navy-900);color:#a9bad6;overflow:hidden;
  padding:clamp(56px,7vw,104px) 0 clamp(60px,7vw,104px);
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(900px 520px at 78% 6%,rgba(176,141,79,.20),transparent 60%),
    radial-gradient(760px 480px at 4% 92%,rgba(38,85,140,.42),transparent 62%);
}
.hero .wrap{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(32px,4.5vw,72px);align-items:center}
.hero h1{color:#fff;margin-bottom:22px;letter-spacing:-.022em}
.hero h1 em{font-style:italic;color:var(--brass-300);font-variation-settings:"SOFT" 0,"WONK" 1,"opsz" 96}
.hero-sub{font-size:clamp(1.02rem,1.35vw,1.15rem);color:#a7bad8;max-width:54ch;margin-bottom:30px;line-height:1.62}
.hero-badges{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:30px}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border-radius:100px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  font-size:.81rem;font-weight:500;color:#dae4f2;letter-spacing:.005em;
}
.hero-badge svg{color:var(--brass-300);flex-shrink:0}
.hero-note{font-size:.85rem;color:#8296b5;margin-top:20px;display:flex;align-items:center;gap:8px}
.hero-note svg{color:var(--brass);flex:none}
.hero-note a{color:var(--brass-300);text-decoration:underline;text-underline-offset:2px}

.hero-visual{position:relative}
.hero-visual::after{
  content:"";position:absolute;inset:0;border-radius:var(--radius-lg);pointer-events:none;
  background:linear-gradient(to top,rgba(7,20,39,.34),transparent 46%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.hero-visual img{
  border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;
  aspect-ratio:4/4.9;object-fit:cover;object-position:center 26%;max-height:min(68vh,640px);
  border:1px solid rgba(255,255,255,.10);
}
.hero-card{
  position:absolute;bottom:20px;left:20px;right:20px;z-index:3;
  background:rgba(255,255,255,.90);border-radius:14px;
  padding:15px 18px;box-shadow:0 18px 40px -20px rgba(7,20,39,.75);
  display:flex;gap:13px;align-items:center;
  border:1px solid rgba(255,255,255,.65);
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
}
.hero-card strong{
  display:block;font-size:1.42rem;font-family:var(--ff-display);color:var(--navy-800);line-height:1;
  font-weight:500;font-variation-settings:"SOFT" 0,"WONK" 0;
}
.hero-card span{font-size:.76rem;color:var(--muted);line-height:1.4}
.hero-card .ico{width:38px;height:38px;border-radius:10px;background:var(--brass-100);display:grid;place-items:center;color:var(--brass-600);flex-shrink:0}

/* hero z formularzem */
.hero--form .hero-grid{grid-template-columns:1.02fr .98fr;align-items:start}
.lead-card{
  background:#fff;border-radius:var(--radius-lg);padding:clamp(26px,3vw,38px);
  box-shadow:var(--shadow-lg);color:var(--text);border:1px solid var(--line);
}
.lead-card h3{font-family:var(--ff-display);font-weight:400;font-size:1.5rem;margin-bottom:6px;color:var(--ink);letter-spacing:-.015em}
.lead-card .lead-card-sub{font-size:.9rem;color:var(--muted);margin-bottom:24px}

/* ---------- pasek zaufania ---------- */
.trustbar{background:var(--navy-800);padding:22px 0;border-top:1px solid rgba(255,255,255,.07)}
.trustbar .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.trust-item{display:flex;align-items:center;gap:11px;color:#9db0cd;font-size:.88rem;line-height:1.35;padding:2px 18px;border-left:1px solid rgba(255,255,255,.10)}
.trust-item:first-child{padding-left:0;border-left:0}
.trust-item svg{color:var(--brass-300);flex-shrink:0}

/* ---------- statystyki ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.stat{text-align:center;padding:32px 20px;background:#fff}
.stat b{
  display:block;font-family:var(--ff-display);font-size:clamp(2.1rem,3.8vw,2.9rem);
  color:var(--navy-700);line-height:1;margin-bottom:10px;font-weight:400;
  font-variant-numeric:tabular-nums;font-variation-settings:"SOFT" 0,"WONK" 0;
}
.stat b .plus{color:var(--brass)}
.stat span{font-size:.87rem;color:var(--muted);display:block;line-height:1.45;max-width:22ch;margin-inline:auto}
.section--dark .stats{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.10)}
.section--dark .stat{background:var(--navy-900)}
.section--dark .stat b{color:#fff}
.section--dark .stat span{color:#93a7c6}

/* ---------- karty ---------- */
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;
  transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease;height:100%;
  display:flex;flex-direction:column;
}
a.card{color:inherit}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--line-strong)}
.card h3{font-size:1.14rem;margin-bottom:11px;color:var(--ink)}
.card p{font-size:.95rem;margin-bottom:0;color:var(--text)}
.card .ico{
  width:48px;height:48px;border-radius:12px;display:grid;place-items:center;margin-bottom:20px;
  background:var(--bg-tint);color:var(--navy-600);flex-shrink:0;
  border:1px solid var(--line);transition:background-color .26s ease,color .26s ease;
}
.card:hover .ico{background:var(--navy-800);color:var(--brass-300);border-color:var(--navy-800)}
.card--gold .ico{background:var(--brass-100);color:var(--brass-600);border-color:var(--brass-300)}
.card--gold:hover .ico{background:var(--brass);color:#fff;border-color:var(--brass)}
.card-link{
  margin-top:auto;padding-top:18px;font-weight:600;font-size:.87rem;color:var(--navy-700);
  display:inline-flex;align-items:center;gap:7px;letter-spacing:.005em;
}
.card-link::after{content:"→";transition:transform .2s ease;color:var(--brass)}
.card:hover .card-link::after,.course-card:hover .card-link::after{transform:translateX(4px)}

/* ---------- karty szkoleń ---------- */
.course-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;height:100%;color:inherit;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.course-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-strong)}
.course-card-media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--navy-800)}
.course-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.course-card-media::after{
  content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,20,39,.42),transparent 52%);
}
.course-card:hover .course-card-media img{transform:scale(1.04)}
.course-card-media .ph{width:100%;height:100%;display:grid;place-items:center;background:var(--navy-800);color:var(--brass-300)}
.course-tag{
  position:absolute;top:14px;left:14px;z-index:2;background:rgba(255,255,255,.94);color:var(--navy-800);
  font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:4px;
}
.course-card-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
.course-card-body h3{font-size:1.14rem;margin-bottom:9px}
.course-card-body p{font-size:.93rem;color:var(--text);margin-bottom:18px}
.course-meta{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.course-meta span{
  font-size:.75rem;background:var(--bg-soft);color:var(--navy-600);padding:5px 10px;
  border-radius:4px;font-weight:500;border:1px solid var(--line);
}

/* ---------- listy z odhaczeniem ---------- */
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:13px}
.checklist li{display:flex;gap:13px;align-items:flex-start;margin:0;font-size:.97rem;line-height:1.55}
.checklist li::before{
  content:"";flex-shrink:0;width:20px;height:20px;border-radius:50%;margin-top:3px;
  background:var(--brass-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238d6f3a' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
  border:1px solid var(--brass-300);
}
.section--dark .checklist li,.hero .checklist li{color:#c2d0e6}
.hero .checklist li::before,.section--dark .checklist li::before{
  background:rgba(220,193,137,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dcc189' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
  border-color:rgba(220,193,137,.42);
}

/* ---------- lista kontaktowa ---------- */
.contact-list{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:13px}
.contact-list li{display:flex;gap:12px;align-items:flex-start;margin:0;font-size:.97rem}
.contact-list svg{color:var(--brass-600);flex:none;margin-top:3px}
.contact-list a{color:var(--ink);font-weight:500}
.contact-list a:hover{color:var(--brass-600)}
.section--dark .contact-list a,.section--dark .contact-list li{color:#dae4f2}

/* ---------- kroki ---------- */
.steps{counter-reset:step;display:grid;gap:20px}
.step{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 26px 26px;counter-increment:step;
}
.step::before{
  content:counter(step,decimal-leading-zero);position:absolute;top:-14px;left:26px;
  font-family:var(--ff-display);font-size:.95rem;font-weight:500;background:var(--navy-900);color:var(--brass-300);
  padding:5px 12px;border-radius:4px;letter-spacing:.04em;font-variation-settings:"SOFT" 0,"WONK" 0;
}
.step h3{font-size:1.06rem;margin:12px 0 9px}
.step p{font-size:.93rem;margin:0}
.section--soft .step{background:#fff}

/* ---------- tekst + obraz ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.split--narrow-img{grid-template-columns:1.12fr .88fr}
.split-media{position:relative}
.split-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow);width:100%;aspect-ratio:4/3.2;object-fit:cover}
.split--narrow-img .split-media img{aspect-ratio:4/5}
.split-media .ph{aspect-ratio:4/5;border-radius:var(--radius-lg);background:var(--navy-800);display:grid;place-items:center;color:var(--brass-300);box-shadow:var(--shadow)}
.media-badge{
  position:absolute;right:-14px;bottom:26px;background:var(--navy-900);color:#fff;
  padding:14px 20px;border-radius:8px;font-weight:500;font-size:.85rem;box-shadow:var(--shadow);
  max-width:214px;line-height:1.4;border-left:3px solid var(--brass);
}

/* ---------- pasek CTA ---------- */
.cta-band{
  background:var(--navy-900);border-radius:var(--radius-lg);
  padding:clamp(36px,5vw,64px);color:#a9bad6;position:relative;overflow:hidden;
}
.cta-band::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(620px 320px at 88% 16%,rgba(176,141,79,.24),transparent 62%);
}
.cta-band > *{position:relative;z-index:2}
.cta-band h2{color:#fff;margin-bottom:14px;letter-spacing:-.02em}
.cta-band .eyebrow{color:var(--brass-300)}
.cta-band .eyebrow::before{background:var(--brass-300)}
.cta-band p{color:#9dafcc;max-width:60ch;margin-bottom:28px}
.cta-split{display:grid;grid-template-columns:1.28fr .72fr;gap:40px;align-items:center}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;max-width:900px;margin-inline:auto}
.faq details{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.faq details[open]{box-shadow:var(--shadow-xs);border-color:var(--line-strong)}
.faq summary{
  padding:20px 56px 20px 24px;cursor:pointer;font-weight:600;color:var(--ink);
  position:relative;list-style:none;font-size:1rem;line-height:1.45;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--navy-700)}
.faq summary::after{
  content:"";position:absolute;right:24px;top:50%;width:10px;height:10px;
  border-right:1.8px solid var(--brass);border-bottom:1.8px solid var(--brass);
  transform:translateY(-70%) rotate(45deg);transition:transform .25s ease;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq-body{padding:0 24px 22px;color:var(--text);font-size:.96rem}
.faq-body p:last-child{margin-bottom:0}

/* ---------- opinie ---------- */
.quote{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;height:100%;
  display:flex;flex-direction:column;gap:16px;
}
.quote p{font-size:1rem;color:var(--ink);margin:0;line-height:1.6}
.quote-author{display:flex;align-items:center;gap:12px;margin-top:auto}
.quote-avatar{
  width:42px;height:42px;border-radius:50%;background:var(--navy-800);color:var(--brass-300);
  display:grid;place-items:center;font-weight:600;flex-shrink:0;font-size:.95rem;
}
.quote-author b{display:block;font-size:.93rem;color:var(--ink)}
.quote-author span{font-size:.81rem;color:var(--muted)}
.stars{color:var(--brass);letter-spacing:3px;font-size:.9rem}

/* ---------- formularze ---------- */
.field{margin-bottom:15px}
.field label{display:block;font-size:.83rem;font-weight:600;color:var(--ink);margin-bottom:7px;letter-spacing:.005em}
.field .req{color:#b3402f}
.field input[type=text],.field input[type=email],.field input[type=tel],.field select,.field textarea{
  width:100%;padding:13px 15px;border:1px solid var(--line-strong);border-radius:8px;font-family:var(--ff-body);
  font-size:.95rem;color:var(--ink);background:#fff;transition:border-color .2s ease,box-shadow .2s ease;
}
.field input::placeholder,.field textarea::placeholder{color:#a6b1c3}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:0;border-color:var(--navy-600);box-shadow:0 0 0 3px rgba(38,85,140,.12)
}
.field input:user-invalid{border-color:#d08b80}
.field textarea{min-height:104px;resize:vertical}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:.78rem;color:var(--muted);line-height:1.5;margin-bottom:13px}
.consent input{margin-top:2px;width:16px;height:16px;flex-shrink:0;accent-color:var(--brass-600)}
.consent a{text-decoration:underline;color:var(--navy-600)}
.form-msg{padding:14px 17px;border-radius:8px;font-size:.9rem;margin-bottom:16px;display:none}
.form-msg.ok{background:#eaf5ee;color:#1c6b46;border:1px solid #c2e0cd;display:block}
.form-msg.err{background:#fbeceb;color:#a3302a;border:1px solid #f0cbc7;display:block}
.form-foot{font-size:.76rem;color:var(--muted);text-align:center;margin:12px 0 0}
.hp-field{position:absolute!important;left:-9999px!important}

/* ---------- okruszki i nagłówek podstrony ---------- */
.breadcrumbs{font-size:.8rem;color:#8296b5;padding:16px 0 0}
.breadcrumbs a{color:#a9bad6}
.breadcrumbs a:hover{color:var(--brass-300)}
.breadcrumbs span[aria-current]{color:#dae4f2}
.page-hero{
  background:var(--navy-900);color:#a9bad6;position:relative;overflow:hidden;
  padding:0 0 clamp(50px,6vw,80px);
}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(780px 420px at 76% 0%,rgba(176,141,79,.18),transparent 62%);
}
.page-hero .wrap{position:relative;z-index:2}
.page-hero > .wrap{padding-top:clamp(30px,4vw,48px)}
.page-hero h1{color:#fff;margin-bottom:16px;max-width:19ch}
.page-hero.wide h1{max-width:25ch}
.page-hero p{color:#a3b6d3;max-width:62ch;font-size:1.05rem;margin-bottom:0;line-height:1.62}
.page-hero .btn-group{margin-top:30px}

/* ---------- treść ---------- */
.prose{font-size:1.02rem;color:var(--text)}
.prose > *:first-child{margin-top:0}
.prose h2{margin-top:2.3em;font-size:clamp(1.5rem,2.4vw,1.95rem)}
.prose h3{margin-top:1.8em;font-size:1.18rem}
.prose ul li::marker{color:var(--brass)}
.prose ol li::marker{color:var(--brass-600);font-weight:600}
.prose a{text-decoration:underline;text-underline-offset:2px;color:var(--navy-600)}
.prose table{width:100%;border-collapse:collapse;margin:1.7em 0;font-size:.94rem}
.prose th,.prose td{border:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top}
.prose th{background:var(--bg-tint);color:var(--ink);font-weight:600;font-size:.85rem;letter-spacing:.02em}
.prose blockquote{
  margin:1.7em 0;padding:20px 26px;border-left:3px solid var(--brass);background:var(--bg-soft);
  border-radius:0 8px 8px 0;color:var(--ink);font-size:1.04rem;
}
.prose img{border-radius:var(--radius);margin:1.7em 0}
.prose code{background:var(--bg-tint);padding:2px 6px;border-radius:4px;font-size:.9em}

/* ---------- blog ---------- */
.post-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;height:100%;transition:transform .3s ease,box-shadow .3s ease;
}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.post-card-media{aspect-ratio:16/9;background:var(--navy-800);overflow:hidden}
.post-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.post-card:hover .post-card-media img{transform:scale(1.03)}
.post-card-body{padding:24px;display:flex;flex-direction:column;flex:1}
.post-card-body h3{font-size:1.08rem;margin-bottom:10px;line-height:1.38}
.post-card-body h3 a{color:var(--ink)}
.post-card-body h3 a:hover{color:var(--navy-600)}
.post-meta{font-size:.78rem;color:var(--muted);margin-bottom:10px;display:flex;gap:12px;flex-wrap:wrap;letter-spacing:.02em}
.post-card-body p{font-size:.92rem;margin-bottom:16px}

/* paginacja */
.pagination{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.page-numbers{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;
  border:1px solid var(--line);border-radius:6px;color:var(--text);font-size:.9rem;background:#fff;
}
.page-numbers:hover{border-color:var(--navy-600);color:var(--navy-700)}
.page-numbers.current{background:var(--navy-800);border-color:var(--navy-800);color:#fff}

/* ---------- stopka ---------- */
.site-footer{background:var(--navy-900);color:#8ba0be;padding:clamp(52px,6vw,80px) 0 0;font-size:.93rem;border-top:3px solid var(--brass)}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.25fr;gap:42px;padding-bottom:46px}
.site-footer h3{color:#fff;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:20px;font-weight:600;font-family:var(--ff-body)}
.site-footer a{color:#a3b6d3}
.site-footer a:hover{color:var(--brass-300)}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:10px}
.footer-brand img{max-height:56px;margin-bottom:20px}
.footer-brand p{font-size:.91rem;color:#8296b5;max-width:36ch;line-height:1.62}
.footer-contact li{display:flex;gap:11px;align-items:flex-start}
.footer-contact svg{color:var(--brass);flex-shrink:0;margin-top:3px}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.09);padding:24px 0;display:flex;justify-content:space-between;
  gap:18px;flex-wrap:wrap;font-size:.82rem;color:#748ba9;
}
.footer-bottom nav{display:flex;gap:22px;flex-wrap:wrap}
.social{display:flex;gap:9px;margin-top:20px}
.social a{
  width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,.06);display:grid;place-items:center;
  color:#c2d0e6;transition:.25s;border:1px solid rgba(255,255,255,.08);
}
.social a:hover{background:var(--brass);color:#fff;border-color:var(--brass);transform:translateY(-2px)}

/* ---------- pływający pasek na telefonie ---------- */
.mobile-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:880;display:none;gap:1px;background:var(--line);
  box-shadow:0 -6px 22px -14px rgba(7,20,39,.5);
}
.mobile-cta a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 8px;
  background:#fff;font-size:.88rem;font-weight:600;color:var(--navy-800);
}
.mobile-cta a.primary{background:var(--brass);color:var(--navy-900)}

/* ---------- baner cookies ---------- */
.va-cookie{
  position:fixed;left:22px;right:22px;bottom:22px;z-index:9500;background:#fff;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);padding:26px 28px;max-width:500px;display:none;border:1px solid var(--line);
}
.va-cookie.show{display:block;animation:vaUp .4s cubic-bezier(.2,.8,.2,1)}
@keyframes vaUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.va-cookie h4{font-size:1rem;margin-bottom:9px;color:var(--ink)}
.va-cookie p{font-size:.86rem;margin-bottom:18px;color:var(--text);line-height:1.6}
.va-cookie .btn-group{gap:9px}
.va-cookie .btn{padding:11px 20px;font-size:.85rem}
.va-cookie-links{font-size:.76rem;margin-top:14px;color:var(--muted)}
.va-cookie-links a{color:var(--navy-600);text-decoration:underline}
.va-cookie-prefs{margin:16px 0;display:none;border-top:1px solid var(--line);padding-top:16px}
.va-cookie-prefs.show{display:block}
.va-cookie-prefs label{display:flex;gap:10px;align-items:flex-start;font-size:.83rem;margin-bottom:11px;color:var(--text);line-height:1.5}

/* ---------- animacje ---------- */
.reveal{opacity:1;transform:none}
.will-reveal{transform:translateY(16px);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.will-reveal.in{transform:none}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal,.will-reveal{transform:none!important}
}

/* ---------- responsywność ---------- */
@media (max-width:1080px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .main-nav > ul > li > a{padding:9px 11px;font-size:.86rem}
}
@media (max-width:940px){
  :root{--header-h:66px}
  /* WAŻNE: backdrop-filter w nagłówku czyni z niego blok zawierający dla
     elementów position:fixed — menu mobilne miałoby wtedy 44 px wysokości
     zamiast pełnego ekranu. Na telefonie rozmycie jest zbędne. */
  .site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(7,20,39,.985)}
  .site-header.is-stuck{background:var(--navy-900)}
  /* Menu mobilne jest dzieckiem nagłówka, więc przykryłoby logo i hamburgera.
     Podnosimy je ponad warstwę menu, żeby dało się je kliknąć (i zamknąć menu). */
  .brand,.header-cta,.nav-toggle{position:relative;z-index:901}
  .header-cta .btn,.header-phone{display:none}
  .nav-toggle{display:block;order:3}
  .main-nav{
    /* pełny ekran; nagłówek (z-index 900) zostaje widoczny nad menu,
       a odstęp od góry ustawia skrypt pod aktualną pozycję nagłówka */
    position:fixed;inset:0;min-height:100dvh;
    background:var(--navy-900);flex-direction:column;align-items:stretch;
    padding:calc(var(--header-h) + 62px) 22px 40px;overflow-y:auto;overscroll-behavior:contain;
    transform:translateX(100%);transition:transform .32s cubic-bezier(.2,.84,.28,1);gap:0;z-index:899;
  }
  .main-nav.is-open{transform:none}
  .main-nav ul{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .main-nav > ul > li > a{padding:15px 10px;font-size:1.02rem;border-bottom:1px solid rgba(255,255,255,.09);border-radius:0;color:#e4ebf5}
  .main-nav .sub-menu{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:transparent;
    border:0;border-bottom:1px solid rgba(255,255,255,.09);border-radius:0;padding:4px 0 12px 14px;
    display:none;margin-top:0;pointer-events:auto;
  }
  .main-nav .sub-menu::before{display:none}
  /* na dotyku nie ma najechania kursorem — podmenu otwiera kliknięcie w pozycję */
  .main-nav li.open > .sub-menu{display:flex;opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .main-nav li:hover > .sub-menu:not(.dummy){pointer-events:auto}
  .main-nav .sub-menu a{color:#b6c6dd}
  .main-nav .sub-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
  .main-nav .menu-item-has-children > a::after{float:right;margin-top:8px}
  .main-nav-cta{margin-top:24px;display:flex;flex-direction:column;gap:11px}
  .hero-grid,.split,.cta-split,.grid-3,.grid-2{grid-template-columns:1fr}
  .hero--form .hero-grid{grid-template-columns:1fr}
  .hero-visual{max-width:440px;margin-inline:auto}
  .media-badge{right:12px}
  .mobile-cta{display:flex}
  body{padding-bottom:54px}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .topbar-info span.hide-sm{display:none}
}
@media (max-width:560px){
  body{font-size:16px}
  .wrap,.wrap-narrow{width:min(100% - 30px,var(--wrap))}
  .card,.step,.quote{padding:24px 20px}
  .course-card-body{padding:22px 20px 24px}
  .field-row{grid-template-columns:1fr}
  .grid-4,.stats{grid-template-columns:1fr}
  .btn{width:100%}
  .btn-group{flex-direction:column;align-items:stretch}
  .va-cookie{left:12px;right:12px;bottom:66px;padding:22px 20px}
  .hero-card{position:static;margin-top:18px;max-width:none}
  .hero h1{font-size:clamp(2rem,8vw,2.5rem)}
  .hero-visual img{aspect-ratio:4/4.2;max-height:440px}
  .hero-badges{gap:7px}
  .hero-badge{font-size:.75rem;padding:7px 12px}
  .topbar .wrap{gap:4px 14px;justify-content:flex-start}
  .hero-sub{font-size:1rem}
  .topbar{font-size:.76rem}
  .lead-card{padding:24px 20px}
}

/* ---------- druk ---------- */
@media print{
  .site-header,.site-footer,.mobile-cta,.va-cookie,.topbar,.btn,.breadcrumbs{display:none!important}
  body{color:#000;font-size:12pt;background:#fff}
  .hero,.page-hero,.section--dark,.cta-band{background:#fff!important;color:#000!important}
  .hero h1,.page-hero h1{color:#000!important}
}


/* =========================================================
   RUCH — animacje sterowane przewijaniem strony.
   Wszystko w @supports: gdy przeglądarka nie obsługuje
   osi czasu przewijania, treść po prostu jest widoczna.
   ========================================================= */
@media (prefers-reduced-motion: no-preference){

  /* Wejściem sekcji steruje skrypt (klasa .js-reveal) — działa w każdej
     przeglądarce, także tam, gdzie oś czasu przewijania jest niedostępna.
     Poniżej zostają wyłącznie efekty dekoracyjne, które nic nie ukrywają. */

  /* pasek postępu czytania */
  @supports (animation-timeline: scroll()){
    .scroll-progress{
      animation:va-progress linear;
      animation-timeline:scroll(root);
    }
    /* subtelna paralaksa zdjęcia w hero */
    .hero-visual img{
      animation:va-parallax linear both;
      animation-timeline:scroll(root);
      animation-range:0 70vh;
    }
    .hero::before{
      animation:va-glow linear both;
      animation-timeline:scroll(root);
      animation-range:0 90vh;
    }
  }
  @keyframes va-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  @keyframes va-parallax{to{transform:translateY(-22px) scale(1.015)}}
  @keyframes va-glow{to{opacity:.55;transform:translateY(26px)}}

  /* oddychające tło hero */
  .hero::after{
    content:"";position:absolute;inset:-20%;pointer-events:none;z-index:0;
    background:
      radial-gradient(520px 420px at 22% 30%,rgba(176,141,79,.10),transparent 62%),
      radial-gradient(620px 520px at 82% 72%,rgba(38,85,140,.16),transparent 64%);
    animation:va-breathe 26s ease-in-out infinite alternate;
  }
  @keyframes va-breathe{
    from{transform:translate3d(0,0,0) scale(1)}
    to{transform:translate3d(2%,-2%,0) scale(1.07)}
  }
}

/* pasek postępu czytania */
.scroll-progress{
  position:fixed;top:0;left:0;right:0;height:2px;z-index:950;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--brass),var(--brass-300));
}

/* ---------- głębia i efekty 3D ---------- */
.grid,.stats,.steps{perspective:1400px}

.card,.course-card,.post-card,.quote,.step{
  transform-style:preserve-3d;
  will-change:transform;
}
.card.is-tilt,.course-card.is-tilt,.post-card.is-tilt{
  transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease;
}

/* połysk przechodzący po kafelku przy najechaniu */
.course-card{position:relative;isolation:isolate}
.course-card::after{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.30) 50%,transparent 62%);
  opacity:0;transform:translateX(-60%);
  transition:opacity .35s ease,transform .75s cubic-bezier(.2,.8,.2,1);
}
.course-card:hover::after{opacity:1;transform:translateX(60%)}

/* przyciski — miękki połysk i reakcja na naciśnięcie */
.btn{position:relative;overflow:hidden}
.btn::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,transparent 38%,rgba(255,255,255,.32) 50%,transparent 62%);
  transform:translateX(-130%);transition:transform .8s cubic-bezier(.2,.84,.28,1);
}
.btn:hover::after{transform:translateX(130%)}
.btn-ghost::after,.btn-outline::after{background:linear-gradient(120deg,transparent 38%,rgba(141,111,58,.16) 50%,transparent 62%)}
.btn:active{transform:translateY(1px) scale(.995)}

/* ikony w kartach — lekkie uniesienie */
.card .ico{transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.card:hover .ico{transform:translateY(-3px) rotate(-3deg)}

/* podkreślenia linków w treści */
.prose a{
  background-image:linear-gradient(var(--brass),var(--brass));
  background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;
  text-decoration:none;padding-bottom:1px;transition:background-size .3s cubic-bezier(.2,.8,.2,1),color .2s ease;
  border-bottom:1px solid rgba(141,111,58,.35);
}
.prose a:hover{background-size:100% 1px;border-bottom-color:transparent}

/* pozycje menu — animowana linia */
.main-nav > ul > li > a{position:relative}
.main-nav > ul > li > a::before{
  content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1px;background:var(--brass-300);
  transform:scaleX(0);transform-origin:0 50%;transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.main-nav > ul > li > a:hover::before,
.main-nav > ul > li.current-menu-item > a::before,
.main-nav > ul > li.current-page-ancestor > a::before{transform:scaleX(1)}

/* powrót na górę */
.to-top{
  position:fixed;right:22px;bottom:26px;z-index:870;width:46px;height:46px;border-radius:50%;
  background:var(--navy-900);color:var(--brass-300);border:1px solid rgba(255,255,255,.14);
  display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;
  transform:translateY(10px);transition:opacity .3s ease,transform .3s ease,visibility .3s,background-color .3s ease;
  box-shadow:var(--shadow);
}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--brass);color:var(--navy-900)}
@media (max-width:940px){.to-top{bottom:70px;right:16px;width:42px;height:42px}}

/* sekcje ciemne — subtelna linia mosiądzu na styku */
.section--dark + .section,.hero + .trustbar,.page-hero + .section{position:relative}
.trustbar{position:relative}
.trustbar::before{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(100%,var(--wrap));
  height:1px;background:linear-gradient(90deg,transparent,rgba(176,141,79,.5),transparent);
}

/* Bezpieczniki: przy bardzo wysokim oknie (tak renderują roboty wyszukiwarek
   i narzędzia do zrzutów) oraz przy druku pokazujemy wszystko od razu. */
@media (min-height:2200px){
  .reveal{animation:none!important;opacity:1!important;transform:none!important}
}
@media print{
  .reveal{animation:none!important;opacity:1!important;transform:none!important}
  .scroll-progress,.to-top{display:none!important}
}


/* =========================================================
   NOWE SEKCJE — etykiety, podział kosztu, oś czasu, porównanie
   ========================================================= */

/* etykiety branż */
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:960px;margin-inline:auto}
.chip{
  display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:100px;
  background:#fff;border:1px solid var(--line);font-size:.92rem;color:var(--ink);font-weight:500;
  transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease;
}
.chip:hover{border-color:var(--brass-300);transform:translateY(-2px);box-shadow:var(--shadow-xs)}
.chip svg{color:var(--brass-600);flex:none}
.section--soft .chip{background:#fff}
.section--dark .chip{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);color:#dae4f2}
.section--dark .chip svg{color:var(--brass-300)}
.chips-note{text-align:center;margin:26px auto 0;max-width:70ch;color:var(--muted);font-size:.94rem}

/* podział kosztu */
.ratio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ratio-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 26px 28px}
.ratio-head{display:flex;flex-direction:column;gap:2px;margin-bottom:18px}
.ratio-head b{font-family:var(--ff-display);font-size:1.2rem;color:var(--ink);font-weight:500;letter-spacing:-.01em}
.ratio-head span{font-size:.82rem;color:var(--muted)}
.ratio-bar{
  display:flex;height:42px;border-radius:8px;overflow:hidden;background:var(--bg-tint);
  border:1px solid var(--line);font-size:.86rem;font-weight:600;
}
.ratio-funded{
  background:linear-gradient(135deg,var(--navy-700),var(--navy-500));color:#fff;
  display:grid;place-items:center;min-width:44px;
}
.ratio-own{flex:1;background:var(--brass-100);color:var(--brass-600);display:grid;place-items:center}
.ratio-legend{display:flex;gap:18px;margin:12px 0 14px;font-size:.78rem;color:var(--muted)}
.ratio-legend span{display:inline-flex;align-items:center;gap:7px}
.ratio-legend i{width:10px;height:10px;border-radius:3px;display:block}
.ratio-legend .dot-funded{background:var(--navy-600)}
.ratio-legend .dot-own{background:var(--brass-300)}
.ratio-card p{font-size:.93rem;margin:0;color:var(--text)}
.ratio-note{text-align:center;margin:26px auto 0;max-width:76ch;color:var(--muted);font-size:.9rem}

/* oś czasu */
.timeline{list-style:none;margin:0 auto;padding:0;max-width:760px;position:relative}
.timeline::before{
  content:"";position:absolute;left:96px;top:12px;bottom:12px;width:1px;
  background:linear-gradient(to bottom,transparent,var(--line) 12%,var(--line) 88%,transparent);
}
.timeline li{display:grid;grid-template-columns:78px 1fr;gap:36px;margin:0;padding:0 0 26px;position:relative}
.timeline li:last-child{padding-bottom:0}
.timeline li::before{
  content:"";position:absolute;left:92px;top:9px;width:9px;height:9px;border-radius:50%;
  background:var(--brass);box-shadow:0 0 0 4px var(--brass-100);
}
.tl-time{
  font-family:var(--ff-body);font-size:.86rem;font-weight:600;color:var(--navy-700);
  text-align:right;padding-top:2px;font-variant-numeric:tabular-nums;
}
.tl-body h3{font-size:1.05rem;margin:0 0 6px}
.tl-body p{font-size:.94rem;margin:0}
.section--soft .timeline::before{background:linear-gradient(to bottom,transparent,var(--line-strong) 12%,var(--line-strong) 88%,transparent)}

/* porównanie */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1000px;margin-inline:auto}
.compare-col{border-radius:var(--radius);padding:30px 30px 32px;border:1px solid var(--line);background:#fff}
.compare-col h3{font-size:1.06rem;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.compare-col ul{list-style:none;padding:0;margin:0;display:grid;gap:13px}
.compare-col li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;margin:0;line-height:1.55}
.compare-col li::before{
  content:"";flex:none;width:19px;height:19px;border-radius:50%;margin-top:3px;background-size:11px;
  background-repeat:no-repeat;background-position:center;
}
.compare-col--them{background:var(--bg-soft)}
.compare-col--them h3{color:var(--muted)}
.compare-col--them li{color:var(--muted)}
.compare-col--them li::before{
  background-color:#e6e9ef;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2366748d' stroke-width='3.4' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E");
}
.compare-col--us{border-color:var(--brass-300);box-shadow:var(--shadow-sm)}
.compare-col--us li::before{
  background-color:var(--brass-100);border:1px solid var(--brass-300);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238d6f3a' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

@media (max-width:940px){
  .ratio-grid{grid-template-columns:1fr}
  .compare{grid-template-columns:1fr}
  .timeline::before{left:66px}
  .timeline li{grid-template-columns:56px 1fr;gap:24px}
  .timeline li::before{left:62px}
}
@media (max-width:560px){
  .timeline::before,.timeline li::before{display:none}
  .timeline li{grid-template-columns:1fr;gap:4px}
  .tl-time{text-align:left;color:var(--brass-600)}
  .compare-col{padding:24px 22px}
  .chip{font-size:.86rem;padding:9px 14px}
}


/* =========================================================
   PŁYNNOŚĆ — przejścia między podstronami, choreografia
   wejścia strony i miękkie mikrointerakcje.
   ========================================================= */

/* --- przejścia między podstronami (Chrome/Edge) --- */
@view-transition{navigation:auto}

@media (prefers-reduced-motion: no-preference){
  ::view-transition-old(root){animation:va-vt-out .18s ease-out both}
  ::view-transition-new(root){animation:va-vt-in .28s ease-out both}
}
@keyframes va-vt-out{to{opacity:0}}
@keyframes va-vt-in{from{opacity:0;transform:translateY(8px)}}

/* nagłówek i stopka nie migają przy zmianie strony — płynnie się „przenoszą" */
.site-header{view-transition-name:va-header}
.site-footer{view-transition-name:va-footer}

/* --- choreografia wejścia pierwszego ekranu --- */
@media (prefers-reduced-motion: no-preference){
  .hero .eyebrow,
  .hero h1,
  .hero-sub,
  .hero-badges,
  .hero .btn-group,
  .hero-note,
  .hero .checklist,
  .hero-visual,
  .hero--form .lead-card,
  .page-hero .eyebrow,
  .page-hero h1,
  .page-hero p,
  .page-hero .btn-group{
    animation:va-enter .9s cubic-bezier(.16,.84,.28,1) both;
    animation-timeline:auto;
  }
  .hero .eyebrow,.page-hero .eyebrow{animation-delay:.05s}
  .hero h1,.page-hero h1{animation-delay:.14s}
  .hero-sub,.page-hero p{animation-delay:.24s}
  .hero .checklist{animation-delay:.30s}
  .hero-badges{animation-delay:.34s}
  .hero .btn-group,.page-hero .btn-group{animation-delay:.42s}
  .hero-note{animation-delay:.44s}
  .hero-visual,.hero--form .lead-card{animation:va-enter-visual 1.1s cubic-bezier(.16,.84,.28,1) both;animation-delay:.18s;animation-timeline:auto}
  .hero-card{animation:va-enter .8s cubic-bezier(.16,.84,.28,1) both;animation-delay:.7s;animation-timeline:auto}
  .trustbar .trust-item{animation:va-enter .7s cubic-bezier(.16,.84,.28,1) both}
  .trustbar .trust-item:nth-child(2){animation-delay:.08s}
  .trustbar .trust-item:nth-child(3){animation-delay:.16s}
  .trustbar .trust-item:nth-child(4){animation-delay:.24s}
}
@keyframes va-enter{
  from{opacity:0;transform:translate3d(0,22px,0)}
  to{opacity:1;transform:none}
}
@keyframes va-enter-visual{
  from{opacity:0;transform:translate3d(0,28px,0) scale(.965)}
  to{opacity:1;transform:none}
}

/* --- nagłówek: miękka reakcja na przewijanie (bez skoków układu) --- */
.site-header{transition:background-color .4s ease,box-shadow .4s ease,border-color .4s ease}
.brand img{transition:transform .45s cubic-bezier(.2,.84,.28,1);transform-origin:left center}
.site-header.is-stuck .brand img{transform:scale(.88)}
.header-cta .btn{transition:transform .35s cubic-bezier(.2,.84,.28,1),background-color .25s ease,color .25s ease}
.site-header.is-stuck .header-cta .btn{transform:scale(.95)}

/* --- płynne rozwijanie pytań (FAQ) --- */
.faq-body{overflow:hidden}
@supports (interpolate-size: allow-keywords){
  :root{interpolate-size:allow-keywords}
  .faq details::details-content{
    block-size:0;overflow:clip;opacity:0;
    transition:block-size .42s cubic-bezier(.2,.84,.28,1),opacity .3s ease,content-visibility .42s allow-discrete;
  }
  .faq details[open]::details-content{block-size:auto;opacity:1}
}
.faq summary{transition:color .25s ease,background-color .25s ease}
.faq details{transition:border-color .3s ease,box-shadow .3s ease,transform .3s cubic-bezier(.2,.84,.28,1)}
.faq details:hover{border-color:var(--line-strong)}
.faq summary::after{transition:transform .38s cubic-bezier(.2,.84,.28,1),border-color .25s ease}

/* --- menu mobilne: pozycje wjeżdżają jedna po drugiej --- */
@media (max-width:940px){
  @media (prefers-reduced-motion: no-preference){
    .main-nav > ul > li,.main-nav-cta{
      opacity:0;transform:translateX(22px);
      transition:opacity .38s ease,transform .45s cubic-bezier(.2,.84,.28,1);
    }
    .main-nav.is-open > ul > li,.main-nav.is-open .main-nav-cta{opacity:1;transform:none}
    .main-nav.is-open > ul > li:nth-child(1){transition-delay:.06s}
    .main-nav.is-open > ul > li:nth-child(2){transition-delay:.11s}
    .main-nav.is-open > ul > li:nth-child(3){transition-delay:.16s}
    .main-nav.is-open > ul > li:nth-child(4){transition-delay:.21s}
    .main-nav.is-open > ul > li:nth-child(5){transition-delay:.26s}
    .main-nav.is-open > ul > li:nth-child(6){transition-delay:.31s}
    .main-nav.is-open .main-nav-cta{transition-delay:.36s}
  }
  .main-nav .sub-menu{transition:none}
}

/* --- mikrointerakcje: wszystko, co klikalne, reaguje miękko --- */
a,button,input,select,textarea,summary,.chip,.hero-badge,.course-meta span,.page-numbers{
  transition:color .25s ease,background-color .25s ease,border-color .25s ease,
             box-shadow .3s ease,opacity .25s ease;
}
.btn,.chip,.hero-badge,.social a,.to-top,.site-footer li a,.page-numbers{
  transition:color .25s ease,background-color .25s ease,border-color .25s ease,
             box-shadow .3s ease,opacity .25s ease,transform .3s cubic-bezier(.2,.84,.28,1);
}
.main-nav a{transition:color .2s ease,background-color .2s ease}
.card,.course-card,.post-card,.quote,.step,.ratio-card,.compare-col,.lead-card{
  transition:transform .35s cubic-bezier(.2,.84,.28,1),box-shadow .35s ease,border-color .35s ease;
}
.hero-badge:hover{background:rgba(255,255,255,.10);border-color:rgba(220,193,137,.45);transform:translateY(-2px)}
.trust-item{transition:color .3s ease}
.trust-item:hover{color:#dae4f2}
.social a,.mobile-cta a,.to-top{transition:background-color .3s ease,color .3s ease,transform .3s cubic-bezier(.2,.84,.28,1),border-color .3s ease}
.footer-contact a,.site-footer li a{display:inline-block}
.site-footer li a:hover{transform:translateX(3px)}
.course-card-media img,.post-card-media img,.split-media img{transition:transform .8s cubic-bezier(.2,.84,.28,1)}
.split-media:hover img{transform:scale(1.02)}
.stat{transition:background-color .35s ease}
.stat:hover{background:var(--bg-soft)}
.section--dark .stat:hover{background:rgba(255,255,255,.04)}
.ratio-funded,.ratio-own{transition:filter .35s ease}
.ratio-card:hover .ratio-funded{filter:brightness(1.08)}
.form-msg{transition:opacity .3s ease,transform .3s ease}
.field input,.field select,.field textarea{transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease}
.va-cookie{transition:opacity .35s ease,transform .4s cubic-bezier(.2,.84,.28,1)}

/* przycisk w trakcie wysyłki */
.btn[disabled]{opacity:.72;cursor:progress}

/* --- pasek postępu: gładkie narastanie także w wariancie skryptowym --- */
.scroll-progress{transition:transform .12s linear}
@supports (animation-timeline: scroll()){
  .scroll-progress{transition:none}
}

/* --- respektujemy ustawienie „ogranicz ruch" --- */
@media (prefers-reduced-motion: reduce){
  .hero .eyebrow,.hero h1,.hero-sub,.hero-badges,.hero .btn-group,.hero-note,
  .hero .checklist,.hero-visual,.hero--form .lead-card,.hero-card,.trustbar .trust-item,
  .page-hero .eyebrow,.page-hero h1,.page-hero p,.page-hero .btn-group{
    animation:none!important;opacity:1!important;transform:none!important;
  }
  .main-nav > ul > li,.main-nav-cta{opacity:1!important;transform:none!important}
}

/* Wariant zapasowy dla przeglądarek bez osi czasu przewijania.
   Klasę nadaje skrypt i ten sam skrypt ją zdejmuje — plus bezpiecznik czasowy. */
.js-reveal{
  opacity:.6;transform:translate3d(0,38px,0);
  transition:opacity .8s ease,transform .85s cubic-bezier(.16,.84,.28,1);
  will-change:transform,opacity;
}
.js-reveal.in{opacity:1;transform:none}
.js-reveal--card{transform:translate3d(0,46px,0) scale(.97)}
.js-reveal--zoom{transform:scale(.93)}
.js-reveal--slide{transform:translate3d(-30px,0,0)}
.js-reveal--card.in,.js-reveal--zoom.in,.js-reveal--slide.in{transform:none}

/* Bezpiecznik wejścia: klasę nadaje skrypt po 2,6 s. Do tego czasu animacje
   zdążą się zakończyć, a gdyby się nie odtworzyły — treść i tak zostanie odsłonięta. */
.va-entered .hero .eyebrow,.va-entered .hero h1,.va-entered .hero-sub,
.va-entered .hero-badges,.va-entered .hero .btn-group,.va-entered .hero-note,
.va-entered .hero .checklist,.va-entered .hero-visual,.va-entered .hero--form .lead-card,
.va-entered .hero-card,.va-entered .trustbar .trust-item,
.va-entered .page-hero .eyebrow,.va-entered .page-hero h1,
.va-entered .page-hero p,.va-entered .page-hero .btn-group{
  animation:none!important;opacity:1!important;transform:none!important;
}


/* =========================================================
   WYKOŃCZENIE — faktura ciemnych sekcji, akcenty i detale
   ========================================================= */

/* subtelne ziarno na ciemnych tłach — daje głębię zamiast płaskiej plamy koloru */
.hero,.page-hero,.section--dark,.cta-band,.site-footer{position:relative}
.hero > .wrap,.page-hero > .wrap,.section--dark > .wrap,.cta-band > *,.site-footer > .wrap{position:relative;z-index:2}
.hero::before,.page-hero::before{z-index:1}
.section--dark::after,.site-footer::after,.cta-band::after,.page-hero::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
.cta-band::after{border-radius:var(--radius-lg)}

/* winieta w sekcji otwarcia — oko trafia w treść, nie w krawędzie */
.hero > .wrap::before{
  content:"";position:absolute;inset:-40% -30%;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 55% at 30% 45%,rgba(7,20,39,.55),transparent 70%);
}

/* FAQ — otwarte pytanie dostaje mosiężny akcent */
.faq details{border-left:2px solid transparent}
.faq details[open]{border-left-color:var(--brass)}
.faq details[open] summary{color:var(--navy-700)}

/* karty szkoleń — tytuł reaguje na najechanie */
.course-card:hover h3,.post-card:hover h3 a{color:var(--navy-600)}
.course-card h3{transition:color .3s ease}

/* kolumna „Victoria Academy" w porównaniu — mosiężna krawędź u góry */
.compare-col--us{position:relative;overflow:hidden}
.compare-col--us::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--brass-300),var(--brass),var(--brass-300));
}

/* stopka — mosiężna linia jako gradient zamiast płaskiej krawędzi */
.site-footer{border-top:0}
.site-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:3;
  background:linear-gradient(90deg,rgba(176,141,79,.25),var(--brass) 30%,var(--brass-300) 50%,var(--brass) 70%,rgba(176,141,79,.25));
}

/* przyciski — odrobina światła w typografii */
.btn{letter-spacing:.012em}

/* nagłówki sekcji na jasnym tle — delikatna linia pod środkowym nagłówkiem */
.section-head.center{position:relative;padding-bottom:6px}

/* pasek zaufania — równe kolumny, na węższych ekranach 2 i 1 kolumna */
@media (max-width:940px){
  .trustbar .wrap{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}
  .trust-item:nth-child(2n+1){padding-left:0;border-left:0}
}
@media (max-width:560px){
  .trustbar{padding:18px 0}
  .trustbar .wrap{grid-template-columns:1fr;row-gap:11px}
  .trust-item{padding-left:0;border-left:0}
}




/* =========================================================
   PAS ZE ZDJĘCIEM — pełna szerokość, tekst na przesłonie
   ========================================================= */
.imageband{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(64px,8vw,120px) 0;color:#e8eefa;
  background:var(--navy-900);
}
.imageband-media{position:absolute;inset:0;z-index:0}
.imageband-media img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.imageband::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(100deg,rgba(4,12,26,.94) 0%,rgba(4,12,26,.82) 42%,rgba(4,12,26,.42) 72%,rgba(4,12,26,.24) 100%),
    linear-gradient(to top,rgba(4,12,26,.55),transparent 55%);
}
.imageband::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
.imageband-inner{position:relative;z-index:2;max-width:min(100% - 44px,var(--wrap))}
.imageband-inner h2{color:#fff;max-width:20ch;margin-bottom:16px}
.imageband-inner > p{color:#c2d1e8;max-width:56ch;font-size:1.06rem;margin-bottom:30px}

.imageband-points{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:32px;max-width:760px}
.imageband-point{
  display:flex;align-items:center;gap:12px;padding:14px 20px;border-radius:12px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background-color .3s ease,border-color .3s ease,transform .3s cubic-bezier(.2,.84,.28,1);
}
.imageband-point:hover{background:rgba(255,255,255,.11);border-color:rgba(220,193,137,.4);transform:translateY(-2px)}
.imageband-point svg{color:var(--brass-300);flex:none}
.imageband-point span{display:flex;flex-direction:column;font-size:.8rem;color:#a9bad6;line-height:1.35}
.imageband-point b{color:#fff;font-size:.98rem;font-weight:600;letter-spacing:.005em}

@media (max-width:940px){
  .imageband-media img{object-position:center 42%}
  .imageband::before{background:linear-gradient(to top,rgba(4,12,26,.96) 30%,rgba(4,12,26,.74) 70%,rgba(4,12,26,.6) 100%)}
  .imageband-points{gap:10px}
  .imageband-point{padding:12px 16px;flex:1 1 44%}
}
@media (max-width:560px){
  .imageband-point{flex:1 1 100%}
}

/* ---------- zdjęcie w sekcji tekst+obraz: mosiężna ramka i przesunięcie ---------- */
.split-media--framed{position:relative}
.split-media--framed::before{
  content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--brass-300);
  border-radius:var(--radius-lg);z-index:0;pointer-events:none;
}
.split-media--framed img{position:relative;z-index:1}
@media (max-width:940px){
  .split-media--framed::before{inset:12px -12px -12px 12px}
}

/* ---------- sekcja efektów ---------- */
.impact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.impact-text{color:#a9bad6;font-size:1.04rem;margin-bottom:28px}
.impact-text p:last-child{margin-bottom:0}
.impact-card{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--radius);padding:32px 32px 34px;backdrop-filter:blur(6px);
}
.impact-card h3{
  color:#fff;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  font-family:var(--ff-body);margin-bottom:22px;padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
@media (max-width:940px){
  .impact-grid{grid-template-columns:1fr}
  .impact-card{padding:26px 24px 28px}
}


/* =========================================================
   WEBINAR
   ========================================================= */
.webinar-hero .hero-grid{align-items:start}
.webinar-meta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px}
.webinar-meta-item{
  display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:100px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);
  font-size:.85rem;color:#dae4f2;
}
.webinar-meta-item svg{color:var(--brass-300);flex:none}

.host-card{
  display:flex;gap:26px;align-items:center;margin-top:clamp(40px,5vw,64px);
  background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:28px 32px;
}
.host-card-avatar{width:104px;height:104px;border-radius:50%;overflow:hidden;flex:none;border:2px solid var(--brass-300)}
.host-card-avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.host-card h3{margin:0 0 6px;font-size:1.25rem;font-family:var(--ff-display);font-weight:500}
.host-card p{margin:0;font-size:.95rem;color:var(--text)}

/* pasek zapowiedzi na wszystkich podstronach */
.va-webinar-bar{
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  background:linear-gradient(90deg,var(--brass-600),var(--brass) 40%,var(--brass-300) 70%,var(--brass));
  color:var(--navy-900);padding:11px 20px;font-size:.88rem;text-align:center;
  text-decoration:none;font-weight:500;position:relative;z-index:940;
}
.va-webinar-bar:hover{filter:brightness(1.05)}
.va-webinar-bar strong{color:var(--navy-900);font-weight:700}
.va-webinar-bar-dot{
  width:9px;height:9px;border-radius:50%;background:#b3402f;flex:none;
  box-shadow:0 0 0 0 rgba(179,64,47,.6);animation:va-pulse 2.4s infinite;
}
@keyframes va-pulse{
  0%{box-shadow:0 0 0 0 rgba(179,64,47,.55)}
  70%{box-shadow:0 0 0 9px rgba(179,64,47,0)}
  100%{box-shadow:0 0 0 0 rgba(179,64,47,0)}
}
.va-webinar-bar-date{opacity:.85}
.va-webinar-bar-cta{font-weight:700;text-decoration:underline;text-underline-offset:3px;color:var(--navy-900)}
.va-webinar-bar:hover .va-webinar-bar-cta,.va-webinar-bar-cta:hover{color:var(--navy-900)}
@media (prefers-reduced-motion:reduce){.va-webinar-bar-dot{animation:none}}

@media (max-width:940px){
  .host-card{flex-direction:column;text-align:center;gap:18px;padding:26px 22px}
  .countdown-item{min-width:70px;padding:13px 10px}
  .countdown-item b{font-size:1.5rem}
  .va-webinar-bar-date{display:none}
}
@media (max-width:560px){
  .countdown{gap:8px}
  .countdown-item{flex:1 1 calc(50% - 4px);min-width:0}
  .va-webinar-bar{font-size:.8rem;gap:8px;padding:10px 14px}
}

/* =========================================================
   ZAPOWIEDŹ WEBINARU — karta „na żywo" na stronie głównej
   ========================================================= */
.webinar-promo{padding-top:clamp(40px,5vw,72px);padding-bottom:0}
.wpromo{
  position:relative;isolation:isolate;overflow:hidden;color:#a9bad6;
  border-radius:var(--radius-lg);border:1px solid rgba(220,193,137,.20);
  padding:clamp(28px,3.2vw,44px) clamp(24px,3.2vw,46px) clamp(30px,3.4vw,46px);
  background:linear-gradient(152deg,#08182c 0%,#0b2039 48%,#11304f 100%);
  box-shadow:0 44px 96px -54px rgba(7,20,39,.9);
}
.wpromo::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(700px 340px at 88% 6%,rgba(176,141,79,.28),transparent 62%),
    radial-gradient(520px 320px at 2% 98%,rgba(38,85,140,.34),transparent 60%);
}
.wpromo::after{
  content:"";position:absolute;top:0;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(220,193,137,.55),transparent);
}
.wpromo-flag{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 15px 7px 13px;border-radius:100px;margin:0 0 clamp(18px,2vw,24px);
  background:rgba(220,193,137,.11);border:1px solid rgba(220,193,137,.32);
  color:var(--brass-300);font-size:.68rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
}
.wpromo-flag svg{flex:none}
.wpromo-grid{
  display:grid;grid-template-columns:minmax(0,1.55fr) minmax(286px,.85fr);
  gap:clamp(26px,3vw,48px);align-items:center;
}
.wpromo-title{
  color:#fff;margin:0 0 12px;
  font-size:clamp(1.55rem,2.55vw,2.25rem);line-height:1.16;
}
.wpromo-lead{color:#b4c4db;margin:0;max-width:50ch;font-size:.98rem;line-height:1.62}

/* fakty w równych kolumnach — jednakowy rytm, bez „pływających" pigułek */
.wpromo-facts{
  list-style:none;margin:clamp(22px,2.4vw,30px) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);
}
.wpromo-facts li{margin:0;padding:16px 16px;border-left:1px solid rgba(255,255,255,.09)}
.wpromo-facts li:first-child{padding-left:0;border-left:0}
.wpromo-fact-k{
  display:block;margin-bottom:7px;color:#8fa3c4;
  font-size:.63rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;
}
.wpromo-fact-v{display:flex;align-items:center;gap:8px;color:#fff;font-weight:500;font-size:.93rem;line-height:1.3}
.wpromo-fact-v svg{color:var(--brass-300);flex:none}

/* panel zapisu — licznik + wezwanie do działania w jednym bloku */
.wpromo-panel{
  display:flex;flex-direction:column;gap:14px;
  padding:clamp(18px,1.8vw,24px);border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 26px 62px -40px rgba(0,0,0,.95);
}
.wpromo-panel .btn{width:100%}
.wpromo-second{
  align-self:center;color:#cbd8ea;font-size:.86rem;font-weight:500;
  border-bottom:1px solid rgba(203,216,234,.34);padding-bottom:2px;
}
.wpromo-second:hover{color:var(--brass-300);border-color:var(--brass-300)}
.wpromo-note{
  display:flex;align-items:flex-start;gap:8px;margin:0;
  font-size:.78rem;line-height:1.5;color:#93a7c7;text-align:left;
}
.wpromo-note svg{color:var(--brass-300);flex:none;margin-top:3px}

@media (max-width:980px){
  .wpromo-grid{grid-template-columns:1fr;gap:28px}
  /* panel pod treścią — nie rozciągamy licznika i przycisku na całą szerokość */
  .wpromo-panel .countdown--panel,.wpromo-panel .btn,.wpromo-note{max-width:480px;margin-inline:auto}
  .wpromo-title{max-width:24ch}
  .wpromo-lead{max-width:none}
  .wpromo-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .wpromo{padding:24px 20px 26px;border-radius:18px}
  .wpromo-facts{grid-template-columns:1fr}
  .wpromo-facts li{padding:13px 0;border-left:0;padding-left:0}
  .wpromo-facts li + li{border-top:1px solid rgba(255,255,255,.09)}
  .wpromo-fact-v{font-size:.9rem}
  .wpromo-panel{padding:16px}
  .countdown--panel .countdown-item{padding:11px 2px 8px}
  .countdown--panel .countdown-item b{font-size:1.38rem}
}


/* =========================================================
   LICZNIK ODLICZAJĄCY — czerwona plakietka „na żywo",
   cyfry w stylu tablicy wyników
   ========================================================= */
.countdown{display:inline-flex;flex-direction:column;gap:12px;margin:0 0 28px;max-width:100%}
.countdown-badge{
  display:inline-flex;align-items:center;gap:9px;align-self:flex-start;
  padding:7px 15px 7px 12px;border-radius:100px;
  background:rgba(198,52,40,.14);border:1px solid rgba(226,90,78,.45);
  font-size:.68rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;color:#ff9a90;
}
.countdown-dot{
  width:9px;height:9px;border-radius:50%;background:#e2564a;flex:none;
  box-shadow:0 0 0 0 rgba(226,86,74,.7);animation:va-live 1.9s cubic-bezier(.4,0,.6,1) infinite;
}
@keyframes va-live{
  0%{box-shadow:0 0 0 0 rgba(226,86,74,.65);opacity:1}
  70%{box-shadow:0 0 0 10px rgba(226,86,74,0);opacity:.75}
  100%{box-shadow:0 0 0 0 rgba(226,86,74,0);opacity:1}
}

.countdown-grid{display:flex;align-items:stretch;gap:6px}
.countdown-item{
  min-width:78px;padding:14px 12px 11px;border-radius:12px;text-align:center;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 24px -18px rgba(0,0,0,.9);
}
.countdown-item b{
  display:block;font-size:2rem;line-height:1;color:#fff;font-weight:600;margin-bottom:7px;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
  font-family:"Instrument Sans",system-ui,sans-serif;
  text-shadow:0 2px 14px rgba(226,86,74,.28);
}
.countdown-item span{
  display:block;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:#8fa3c4;
}
.countdown-sep{
  display:flex;align-items:center;font-size:1.5rem;color:rgba(255,255,255,.28);font-style:normal;
  padding-bottom:16px;animation:va-blink 1s steps(1,end) infinite;
}
@keyframes va-blink{0%,49%{opacity:1}50%,100%{opacity:.22}}

/* stan po starcie webinaru */
.countdown.is-live .countdown-badge{background:rgba(198,52,40,.22);border-color:#e2564a;color:#ffb3ab}
.countdown.is-live .countdown-grid{opacity:.45}

/* wariant pionowy (wąska kolumna w zapowiedzi) */
.countdown--stack .countdown-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.countdown--stack .countdown-sep{display:none}
.countdown--stack .countdown-item{min-width:0}

/* wariant „tablica" — cztery równe pola w jednym rzędzie (panel zapowiedzi) */
.countdown--panel{display:flex;width:100%;gap:13px;margin:0}
.countdown--panel .countdown-badge{align-self:center}
.countdown--panel .countdown-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.countdown--panel .countdown-sep{display:none}
.countdown--panel .countdown-item{min-width:0;padding:13px 4px 10px}
.countdown--panel .countdown-item b{font-size:1.72rem;margin-bottom:5px}
.countdown--panel .countdown-item span{font-size:.57rem;letter-spacing:.11em}

/* na jasnym tle (nie dotyczy licznika osadzonego na ciemnej karcie) */
.section:not(.section--dark) .countdown:not(.countdown--on-dark) .countdown-item{
  background:linear-gradient(180deg,#fff,#f3f6fb);border-color:var(--line);
  box-shadow:var(--shadow-sm);
}
.section:not(.section--dark) .countdown:not(.countdown--on-dark) .countdown-item b{color:var(--ink);text-shadow:none}
.section:not(.section--dark) .countdown:not(.countdown--on-dark) .countdown-item span{color:var(--muted)}
.section:not(.section--dark) .countdown:not(.countdown--on-dark) .countdown-sep{color:var(--line-strong)}
.section:not(.section--dark) .countdown:not(.countdown--on-dark) .countdown-badge{background:rgba(198,52,40,.08);border-color:rgba(198,52,40,.3);color:#a3302a}

@media (prefers-reduced-motion:reduce){
  .countdown-dot,.countdown-sep{animation:none}
}
@media (max-width:560px){
  .countdown-grid{gap:4px}
  .countdown-item{min-width:0;flex:1;padding:12px 6px 9px}
  .countdown-item b{font-size:1.5rem}
  .countdown-sep{font-size:1.1rem;padding-bottom:14px}
}


/* =========================================================
   WARIANTY NAGŁÓWKA PODSTRONY
   Każdy typ strony otwiera się inaczej — inny układ, inny
   materiał wizualny, inny rytm.
   ========================================================= */

/* --- wariant ze zdjęciem w tle (podstrony szkoleń) --- */
.page-hero--image{padding-bottom:clamp(56px,7vw,92px);isolation:isolate}
.page-hero--image .page-hero-media{position:absolute;inset:0;z-index:0}
.page-hero--image .page-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 34%}
.page-hero--image::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(96deg,rgba(4,12,26,.96) 0%,rgba(4,12,26,.88) 40%,rgba(4,12,26,.52) 74%,rgba(4,12,26,.30) 100%),
    linear-gradient(to top,rgba(4,12,26,.72),transparent 58%);
}
.page-hero--image .breadcrumbs,.page-hero--image .wrap{position:relative;z-index:2}
.page-hero--image h1{max-width:22ch}

.hero-points{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 30px;max-width:820px}
.hero-point{
  display:flex;align-items:center;gap:11px;padding:12px 18px;border-radius:10px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background-color .3s ease,border-color .3s ease,transform .3s cubic-bezier(.2,.84,.28,1);
}
.hero-point:hover{background:rgba(255,255,255,.12);border-color:rgba(220,193,137,.4);transform:translateY(-2px)}
.hero-point svg{color:var(--brass-300);flex:none}
.hero-point span{display:flex;flex-direction:column;font-size:.76rem;color:#a9bad6;line-height:1.35}
.hero-point b{color:#fff;font-size:.94rem;font-weight:600}

/* --- wariant z liczbami (strony o dofinansowaniach) --- */
.page-hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(30px,5vw,64px);align-items:center}
.page-hero--stats .hero-stats{display:grid;gap:12px}
.hero-stat{
  display:flex;align-items:baseline;gap:16px;padding:18px 22px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-left:3px solid var(--brass);
}
.hero-stat b{
  font-family:var(--ff-display);font-size:2rem;color:#fff;line-height:1;font-weight:500;
  font-variant-numeric:tabular-nums;min-width:96px;
}
.hero-stat span{font-size:.9rem;color:#a9bad6;line-height:1.45}

/* --- wariant tekst + zdjęcie (o nas, dla firm) --- */
.page-hero--split .page-hero-figure{position:relative}
.page-hero--split .page-hero-figure img{
  width:100%;border-radius:var(--radius-lg);aspect-ratio:4/3.1;object-fit:cover;
  box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.12);
}
.page-hero--split .page-hero-figure::after{
  content:"";position:absolute;inset:16px -16px -16px 16px;border:1px solid rgba(220,193,137,.45);
  border-radius:var(--radius-lg);z-index:-1;
}

/* --- wariant kontaktowy --- */
.hero-contact-tiles{display:grid;gap:12px}
.hero-tile{
  display:flex;align-items:center;gap:14px;padding:18px 22px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#dae4f2;
  transition:background-color .3s ease,border-color .3s ease,transform .3s cubic-bezier(.2,.84,.28,1);
}
.hero-tile:hover{background:rgba(255,255,255,.11);border-color:rgba(220,193,137,.45);color:#fff;transform:translateX(3px)}
.hero-tile--static:hover{transform:none;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.hero-tile svg{color:var(--brass-300);flex:none}
.hero-tile span{display:flex;flex-direction:column;font-size:.8rem;color:#8fa3c4;line-height:1.4}
.hero-tile b{color:#fff;font-size:1rem;font-weight:600;margin-bottom:2px}

/* --- wariant dokumentu: jasny, spokojny --- */
.page-hero--document{
  background:var(--bg-soft);color:var(--text);border-bottom:1px solid var(--line);
  padding:0 0 clamp(34px,4vw,52px);
}
.page-hero--document::before{display:none}
.page-hero--document::after{display:none}
.page-hero--document > .wrap{padding-top:clamp(22px,3vw,34px)}
.page-hero--document .breadcrumbs{color:var(--muted);padding:0 0 18px}
.page-hero--document .breadcrumbs a{color:var(--navy-600)}
.page-hero--document .breadcrumbs a:hover{color:var(--brass-600)}
.page-hero--document .breadcrumbs span[aria-current]{color:var(--ink)}
.page-hero--document .eyebrow{color:var(--brass-600)}
.page-hero--document .eyebrow::before{background:var(--brass)}
.page-hero--document h1{color:var(--ink);font-size:clamp(1.9rem,3.6vw,2.9rem)}
.page-hero--document p{color:var(--text)}
.page-hero-updated{
  display:inline-flex;align-items:center;gap:8px;margin:18px 0 0;font-size:.83rem;color:var(--muted);
  padding:7px 14px;border-radius:100px;background:#fff;border:1px solid var(--line);
}
.page-hero-updated svg{color:var(--brass-600)}

@media (max-width:940px){
  .page-hero-grid{grid-template-columns:1fr;gap:30px}
  .page-hero--split .page-hero-figure{max-width:460px}
  .page-hero--split .page-hero-figure::after{inset:12px -12px -12px 12px}
  .hero-stat b{font-size:1.7rem;min-width:78px}
  .page-hero--image .page-hero-media img{object-position:center 40%}
  .page-hero--image::before{background:linear-gradient(to top,rgba(4,12,26,.96) 34%,rgba(4,12,26,.8) 72%,rgba(4,12,26,.64) 100%)}
}
@media (max-width:560px){
  .hero-point{flex:1 1 100%}
  .hero-stat{padding:15px 18px;gap:12px}
}

/* --- wariant z odnośnikami (FAQ) --- */
.hero-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:30px 0 6px;max-width:900px}
.hero-link{
  display:flex;align-items:center;gap:14px;padding:18px 22px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#dae4f2;
  transition:background-color .3s ease,border-color .3s ease,transform .3s cubic-bezier(.2,.84,.28,1);
}
.hero-link:hover{background:rgba(255,255,255,.11);border-color:rgba(220,193,137,.45);color:#fff;transform:translateY(-2px)}
.hero-link svg{color:var(--brass-300);flex:none}
.hero-link span{display:flex;flex-direction:column;font-size:.8rem;color:#8fa3c4;line-height:1.4}
.hero-link b{color:#fff;font-size:1rem;font-weight:600;margin-bottom:2px}

/* --- wariant potwierdzenia --- */
.page-hero--success{text-align:center;padding-top:clamp(40px,5vw,68px)}
.page-hero--success h1,.page-hero--success p{margin-inline:auto}
.page-hero--success .btn-group{justify-content:center}
.success-mark{
  width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:0 auto 26px;
  background:rgba(110,208,155,.12);border:1px solid rgba(110,208,155,.45);color:#6ed09b;
  animation:va-pop .6s cubic-bezier(.16,.84,.28,1) both;
}
@keyframes va-pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.success-mark{animation:none}}

/* =========================================================
   SKÓRY PODSTRON (v3.6) — każda zakładka ma własny charakter
   Wspólna marka (granat + mosiądz + porcelana), ale inne tło,
   inny układ nagłówka i inny rytm sekcji przemiennych.
   ========================================================= */

/* --- delikatny ton papieru całej zakładki (sekcje bez własnego tła) --- */
body.skin-about{background:#fffdf8}
body.skin-catalog{background:#fffefb}
body.skin-contact{background:#fbfcfe}
body.skin-journal{background:#fffefc}

/* --- tokeny tła per zakładka: sekcje „soft/tint" zmieniają odcień --- */
.skin-about   {--bg-soft:#faf6ee;--bg-tint:#f3ebdb;--line:#e9e1d3;--line-strong:#d9cdb6}
.skin-company {--bg-soft:#eef2f8;--bg-tint:#e3ebf5}
.skin-contact {--bg-soft:#eff3f8;--bg-tint:#e5ecf5}
.skin-catalog {--bg-soft:#f8f6f1;--bg-tint:#f0ece2}
.skin-journal {--bg-soft:#faf9f6;--bg-tint:#f1efe9}
.skin-funding {--bg-soft:#f4f7fb;--bg-tint:#e8eff8}
.skin-help    {--bg-soft:#f5f6f9;--bg-tint:#eaeef5}
.skin-course  {--bg-soft:#f7f8fa;--bg-tint:#edf1f6}

/* --- wspólna baza jasnych nagłówków --- */
.page-hero--light{background:#fff;color:var(--text);overflow:hidden}
.page-hero--light::before,.page-hero--light::after{display:none}
.page-hero--light h1{color:var(--ink)}
.page-hero--light p{color:var(--text)}
.page-hero--light strong,.page-hero--light b{color:var(--ink)}
.page-hero--light .eyebrow{color:var(--brass-600)}
.page-hero--light .eyebrow::before{background:var(--brass)}
.page-hero--light .breadcrumbs{color:var(--muted)}
.page-hero--light .breadcrumbs a{color:var(--navy-600)}
.page-hero--light .breadcrumbs a:hover{color:var(--brass-600)}
.page-hero--light .breadcrumbs span[aria-current]{color:var(--ink)}
.btn-outline-ink{border-color:var(--line-strong);color:var(--ink);background:transparent}
.btn-outline-ink:hover{border-color:var(--ink);background:var(--ink);color:#fff}

/* =====================================================  O NAS — redakcja */
.page-hero--editorial{
  background:
    radial-gradient(760px 440px at 90% -12%,rgba(176,141,79,.16),transparent 62%),
    linear-gradient(180deg,#fbf7f0 0%,#fbf7f0 58%,#fff 100%);
  border-bottom:1px solid #ece3d3;
  padding-bottom:clamp(46px,6vw,86px);
}
.editorial-grid{grid-template-columns:1.08fr .92fr;align-items:center;gap:clamp(34px,5vw,72px)}
.page-hero--editorial h1{
  font-size:clamp(2.25rem,4.6vw,3.65rem);line-height:1.04;letter-spacing:-.02em;max-width:15ch;
}
.page-hero--editorial h1 em{font-style:italic;color:var(--brass-600);font-weight:300}
.editorial-lead{font-size:1.12rem;line-height:1.6;max-width:52ch}
.va-marks{display:flex;margin:30px 0 28px;border-top:1px solid #e6dbc6;border-bottom:1px solid #e6dbc6;max-width:560px}
.va-mark{flex:1;padding:16px 20px 15px 0;border-right:1px solid #e6dbc6}
.va-mark:last-child{border-right:0;padding-right:0}
.va-mark b{display:block;font-family:var(--ff-display);font-size:1.75rem;font-weight:400;color:var(--ink);line-height:1;margin-bottom:5px}
.va-mark span{font-size:.78rem;color:var(--text);line-height:1.35;display:block}
.portrait-frame{position:relative;margin:0;padding:0}
.portrait-frame img{
  width:100%;aspect-ratio:4/4.5;object-fit:cover;object-position:center 12%;
  border-radius:4px;box-shadow:0 46px 92px -50px rgba(7,20,39,.62);
}
.portrait-frame::after{
  content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid rgba(176,141,79,.55);
  border-radius:4px;z-index:-1;
}
.portrait-cap{
  position:absolute;left:-16px;bottom:28px;background:#fff;border:1px solid #ece3d3;
  border-left:3px solid var(--brass);padding:11px 17px;border-radius:3px;
  box-shadow:0 20px 40px -26px rgba(7,20,39,.5);
}
.portrait-cap b{display:block;font-size:.95rem;color:var(--ink);font-weight:600;line-height:1.2}
.portrait-cap span{font-size:.74rem;color:var(--muted)}

/* O nas — nagłówki sekcji na papierze mają mosiężną linijkę */
.skin-about .section-head h2{position:relative}
.skin-about .section--soft{border-color:#ece3d3}

/* ==============================================  DLA FIRM — sala zarządu */
.page-hero--boardroom{
  background:linear-gradient(104deg,#050f1f 0%,#08182c 44%,#0b2039 100%);
  padding-bottom:0;
}
.page-hero--boardroom::before{
  background:
    linear-gradient(90deg,rgba(176,141,79,.12),transparent 46%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 96px);
}
.board-grid{
  display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,36vw,600px);
  gap:clamp(28px,4vw,56px);align-items:center;min-height:clamp(340px,38vw,470px);
}
.page-hero--boardroom h1{max-width:17ch;font-size:clamp(2rem,3.9vw,3.1rem);line-height:1.08}
.page-hero--boardroom h1 em{font-style:italic;color:var(--brass-300);font-weight:300}
.board-list{margin:26px 0 30px;max-width:44ch}
.board-media{
  position:absolute;top:0;bottom:0;right:calc((100% - 100vw) / 2);
  width:calc(clamp(300px,36vw,600px) + (100vw - 100%) / 2);
  overflow:hidden;
}
.board-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.board-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#071427 0%,rgba(7,20,39,.72) 16%,rgba(7,20,39,.18) 52%,rgba(7,20,39,.42) 100%);
}
.board-media::before{
  content:"";position:absolute;left:24px;top:24px;bottom:24px;width:1px;z-index:2;
  background:linear-gradient(180deg,transparent,rgba(220,193,137,.55),transparent);
}
.board-badge{
  position:absolute;left:24px;bottom:28px;z-index:3;padding:13px 18px;border-radius:10px;
  background:rgba(7,20,39,.72);border:1px solid rgba(220,193,137,.42);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.board-badge b{display:block;font-family:var(--ff-display);font-size:1.55rem;color:#fff;line-height:1;font-weight:400}
.board-badge span{font-size:.74rem;color:#b9c8e0;display:block;margin-top:4px}
.board-steps{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.14);margin-top:clamp(26px,3.4vw,44px);
  padding-bottom:clamp(26px,3.2vw,44px);
}
.board-step{padding:22px 26px 26px 0;border-right:1px solid rgba(255,255,255,.10)}
.board-step:last-child{border-right:0}
.board-step i{
  display:block;font-style:normal;font-family:var(--ff-display);font-size:.86rem;
  color:var(--brass-300);letter-spacing:.16em;margin-bottom:9px;
}
.board-step b{display:block;color:#fff;font-size:1rem;font-weight:600;margin-bottom:5px}
.board-step span{font-size:.86rem;color:#93a7c6;line-height:1.5}

/* ==========================================  SZKOLENIA — układ katalogowy */
.page-hero--catalog{
  background:linear-gradient(180deg,#ffffff 0%,#faf8f4 68%,#f6f3ec 100%);
  border-bottom:1px solid #eae5da;padding-bottom:clamp(34px,4vw,54px);
}
.page-hero--catalog::before{display:none}
.catalog-head{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(28px,4vw,60px);align-items:end}
.page-hero--catalog h1{font-size:clamp(2.05rem,4vw,3.2rem);line-height:1.06;max-width:15ch}
.page-hero--catalog h1 em{font-style:italic;color:var(--brass-600);font-weight:300}
.catalog-facts{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line-strong)}
.catalog-facts li{display:flex;align-items:baseline;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);margin:0}
.catalog-facts b{font-family:var(--ff-display);font-size:1.45rem;color:var(--ink);font-weight:400;min-width:88px;line-height:1}
.catalog-facts span{font-size:.85rem;color:var(--text);line-height:1.4}
.catalog-jump{display:flex;align-items:center;gap:18px;margin-top:clamp(28px,3.6vw,44px)}
.catalog-jump-label{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--muted);
  white-space:nowrap;
}
.catalog-jump-rule{flex:1;height:1px;background:var(--line-strong)}
.catalog-tiles{
  display:grid;grid-template-columns:repeat(6,1fr);gap:14px;
  margin-top:16px;
}
.catalog-tile{
  display:block;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow-xs);transition:transform .3s cubic-bezier(.2,.84,.28,1),box-shadow .3s ease,border-color .3s ease;
}
.catalog-tile:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(176,141,79,.55)}
.catalog-thumb{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--bg-tint)}
.catalog-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.catalog-tile:hover .catalog-thumb img{transform:scale(1.05)}
.catalog-name{
  display:block;padding:11px 13px 13px;font-size:.82rem;font-weight:600;color:var(--ink);
  line-height:1.32;
}

/* ==================================================  KONTAKT — biuro */
.page-hero--desk{
  background:linear-gradient(180deg,#e9eef7 0%,#f2f5fa 62%,#f8fafc 100%);
  border-bottom:1px solid var(--line);padding-bottom:clamp(40px,5vw,68px);
}
.desk-grid{grid-template-columns:1.02fr .98fr;align-items:center}
.page-hero--desk h1{font-size:clamp(1.95rem,3.5vw,2.85rem);line-height:1.1;max-width:17ch}
.desk-strip{
  display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:26px;padding-top:18px;
  border-top:1px solid var(--line-strong);font-size:.85rem;color:var(--muted);
}
.desk-strip b{color:var(--ink);font-weight:600}
.desk-cards{display:grid;gap:12px}
.desk-card{
  display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:15px 18px;box-shadow:var(--shadow-xs);
  transition:transform .3s cubic-bezier(.2,.84,.28,1),box-shadow .3s ease,border-color .3s ease;
}
.desk-card:hover{transform:translateX(3px);box-shadow:var(--shadow-sm);border-color:rgba(176,141,79,.5)}
.desk-card--static:hover{transform:none;box-shadow:var(--shadow-xs);border-color:var(--line)}
.desk-ico{
  width:44px;height:44px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(140deg,#f6ecd8,#e8d6ae);color:var(--brass-600);
}
.desk-txt{display:flex;flex-direction:column;min-width:0}
.desk-txt b{color:var(--ink);font-size:1rem;font-weight:600;line-height:1.25;word-break:break-word}
.desk-txt span{font-size:.81rem;color:var(--text);margin-top:2px}

/* =========================  DOFINANSOWANIA — trzy odmiany tego samego układu */
.page-hero--tone-bur{background:linear-gradient(158deg,#061426 0%,#0d2946 100%)}
.page-hero--tone-bur::before{
  background:
    radial-gradient(700px 420px at 10% -6%,rgba(38,85,140,.42),transparent 62%),
    repeating-linear-gradient(132deg,rgba(255,255,255,.045) 0 1px,transparent 1px 15px);
}
.page-hero--tone-kfs{background:linear-gradient(158deg,#0b2039 0%,#061223 72%)}
.page-hero--tone-kfs::before{
  background:
    radial-gradient(620px 400px at 86% 4%,rgba(176,141,79,.26),transparent 62%),
    radial-gradient(circle at 1px 1px,rgba(255,255,255,.09) 1px,transparent 0);
  background-size:auto,24px 24px;
}
.page-hero--tone-help{background:linear-gradient(150deg,#08182c 0%,#071427 60%,#0a1e35 100%)}
.page-hero--tone-help::before{
  background:
    radial-gradient(560px 340px at 50% -10%,rgba(176,141,79,.20),transparent 64%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 46px);
}

/* ==========================================  BLOG — winieta magazynowa */
.blog-masthead{
  background:linear-gradient(180deg,#fdfcf9 0%,#fff 100%);
  border-bottom:1px solid var(--line);padding-bottom:clamp(22px,2.6vw,34px);position:relative;
}
.blog-masthead .breadcrumbs{color:var(--muted);padding-top:16px}
.blog-masthead .breadcrumbs a{color:var(--navy-600)}
.blog-masthead .breadcrumbs a:hover{color:var(--brass-600)}
.blog-masthead .breadcrumbs span[aria-current]{color:var(--ink)}
.masthead-inner{
  text-align:center;padding:clamp(26px,3.6vw,50px) 0 clamp(20px,2.6vw,32px);
  border-bottom:3px double var(--line-strong);
}
.masthead-kicker{
  display:block;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--brass-600);font-weight:600;margin-bottom:14px;
}
.masthead-title{
  font-size:clamp(2.4rem,6vw,4.4rem);line-height:1;letter-spacing:-.025em;color:var(--ink);
  margin:0 0 14px;
}
.masthead-sub{max-width:60ch;margin:0 auto;color:var(--muted);font-size:1.02rem}
.masthead-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;padding-top:16px}
.mh-link{
  font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--muted);
  padding:4px 0;border-bottom:2px solid transparent;
}
.mh-link:hover{color:var(--ink)}
.mh-link.is-active{color:var(--ink);border-bottom-color:var(--brass)}
.section--journal{background:#fff}
.lead-post{
  display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,3.4vw,48px);align-items:center;
  padding-bottom:clamp(34px,4vw,54px);margin-bottom:clamp(34px,4vw,54px);
  border-bottom:1px solid var(--line);
}
.lead-media{display:block;border-radius:18px;overflow:hidden;background:var(--bg-tint);aspect-ratio:16/10}
.lead-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.lead-post:hover .lead-media img{transform:scale(1.03)}
.lead-flag{
  display:inline-block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  color:var(--brass-600);background:var(--brass-100);padding:5px 11px;border-radius:4px;margin-bottom:16px;
}
.lead-body h2{font-size:clamp(1.55rem,2.8vw,2.3rem);line-height:1.16;margin-bottom:14px;letter-spacing:-.015em}
.lead-body h2 a{color:var(--ink)}
.lead-body h2 a:hover{color:var(--navy-600)}
.lead-body p{color:var(--text);margin-bottom:16px;max-width:56ch}
.lead-meta{display:flex;gap:9px;align-items:center;font-size:.8rem;color:var(--muted);margin-bottom:18px}
.journal-head{display:flex;align-items:center;gap:20px;margin-bottom:26px}
.journal-head h2{font-size:1.25rem;margin:0;white-space:nowrap;letter-spacing:-.01em}
.journal-rule{flex:1;height:1px;background:var(--line-strong)}
.journal-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.journal-cta h2{color:#fff;font-size:clamp(1.35rem,2.2vw,1.85rem);margin:6px 0 8px}
.journal-cta p{color:#93a7c6;margin:0;max-width:52ch}

/* ==============================================  WPIS — układ papierowy */
.post-hero{
  background:linear-gradient(180deg,#fbfaf7 0%,#fff 100%);border-bottom:1px solid var(--line);
  padding-bottom:clamp(26px,3vw,40px);
}
.post-hero .breadcrumbs{color:var(--muted);padding-top:16px}
.post-hero .breadcrumbs a{color:var(--navy-600)}
.post-hero .breadcrumbs a:hover{color:var(--brass-600)}
.post-hero .breadcrumbs span[aria-current]{color:var(--ink)}
.post-hero-inner{max-width:760px;margin:0 auto;text-align:center;padding:clamp(24px,3.4vw,46px) 0 0}
.post-hero h1{
  color:var(--ink);font-size:clamp(1.95rem,3.8vw,3.05rem);line-height:1.1;letter-spacing:-.02em;
  margin:0 0 16px;
}
.post-flag{
  display:inline-block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--brass-600);margin-bottom:14px;
}
.post-flag:hover{color:var(--ink)}
.post-lede{font-size:1.1rem;color:var(--text);max-width:58ch;margin:0 auto 18px}
.post-hero-meta{
  display:flex;justify-content:center;flex-wrap:wrap;gap:10px;font-size:.82rem;color:var(--muted);
  padding-top:14px;border-top:1px solid var(--line);max-width:420px;margin:22px auto 0;
}
.post-hero-media{
  margin:clamp(26px,3.4vw,44px) 0 calc(-1 * clamp(40px,5vw,80px));border-radius:20px;overflow:hidden;
  box-shadow:var(--shadow-lg);position:relative;z-index:2;
}
.post-hero-media img{width:100%;display:block}
.section--paper{background:#fff}
.section--paper.has-media{padding-top:clamp(72px,9vw,132px)}
.prose--article{font-size:1.06rem;line-height:1.75}

/* ---------------------------------------------------------- responsywność */
@media (max-width:1100px){
  .catalog-tiles{grid-template-columns:repeat(3,1fr)}
  .catalog-head{grid-template-columns:1fr;gap:26px;align-items:start}
  .catalog-facts{max-width:520px}
}
@media (max-width:940px){
  .editorial-grid{grid-template-columns:1fr}
  .portrait-frame{max-width:400px}
  .portrait-frame img{aspect-ratio:4/4.2}
  .portrait-frame::after{inset:12px -12px -12px 12px}
  .board-grid{grid-template-columns:1fr;min-height:0;gap:28px;padding-bottom:6px}
  .board-media{position:relative;top:auto;bottom:auto;right:auto;width:auto;aspect-ratio:16/10;border-radius:14px}
  .board-media::before{display:none}
  .board-media::after{background:linear-gradient(180deg,rgba(7,20,39,.30),rgba(7,20,39,.05) 46%,rgba(7,20,39,.55))}
  .board-steps{grid-template-columns:1fr}
  .board-step{border-right:0;border-bottom:1px solid rgba(255,255,255,.10);padding:18px 0 20px}
  .board-step:last-child{border-bottom:0}
  .desk-grid{grid-template-columns:1fr}
  .lead-post{grid-template-columns:1fr;gap:22px}
  .lead-media{order:-1}
  .va-marks{max-width:none}
}
@media (max-width:640px){
  .catalog-tiles{grid-template-columns:repeat(2,1fr)}
  .va-marks{flex-wrap:wrap}
  .va-mark{flex:1 1 45%;border-right:0;padding-right:0}
  .va-mark:nth-child(odd):not(:last-child){border-right:1px solid #e6dbc6;padding-right:16px}
  .portrait-cap{left:8px;bottom:12px}
  .masthead-nav{gap:6px 16px}
  .journal-cta{flex-direction:column;align-items:flex-start}
}

/* =========================================================
   SEO / DOSTĘPNOŚĆ (v3.7) — jeden opisowy odnośnik na kafelek
   Kafelek pozostaje w całości klikalny (nakładka .stretch-link),
   ale tekstem kotwicy jest sam tytuł, a nie cała treść karty.
   ========================================================= */
.course-card,.post-card,.lead-post{position:relative}
.stretch-link::after{
  content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;
}
.stretch-link:focus-visible::after{outline:2px solid var(--brass);outline-offset:3px}
.course-card .card-link,.post-card .card-link,.lead-post .card-link{cursor:pointer}
.course-card-body h3 a,.lead-body h2 a{color:inherit}
.course-card-body h3 a:hover{color:var(--navy-600)}

/* pasek zapowiedzi webinaru — kotwicą jest samo wezwanie, nie cały pasek */
.va-webinar-bar{position:relative}
.va-webinar-bar-cta::after{content:"";position:absolute;inset:0;z-index:2}

/* klasy zamiast stylów wpisanych w HTML */
.checklist--mb{margin-bottom:26px}
.checklist--my{margin:22px 0}
.checklist--my-lg{margin:24px 0}
.checklist--my-xl{margin:24px 0 30px}
.checklist--hero{margin:24px 0 6px}
.split-media.is-second{order:2}
.split .is-first{order:1}
.prose--scroll{overflow-x:auto}
.note-sm{color:var(--muted);font-size:.94rem}
.btn-group--mt{margin-top:22px}
.cta-band--mt{margin-top:48px}
.cta-band-title{font-size:1.6rem}
.pagination-wrap{margin-top:40px}

/* źródła urzędowe — pas z odnośnikami do programów */
.sources{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--bg-soft);padding:clamp(22px,2.6vw,32px) 0;
}
.sources-inner{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px}
.sources-label{
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--muted);
  white-space:nowrap;
}
.sources-list{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;margin:0;padding:0}
.sources-list li{margin:0;display:flex}
.sources-list a{
  display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:500;color:var(--navy-700);
  border-bottom:1px solid rgba(27,63,107,.25);padding-bottom:2px;
}
.sources-list a:hover{color:var(--brass-600);border-bottom-color:var(--brass)}
.sources-list svg{color:var(--brass-600);flex:none}
.sources-note{font-size:.82rem;color:var(--muted);margin:12px 0 0;width:100%}
@media (max-width:640px){
  .sources-inner{flex-direction:column;align-items:flex-start;gap:12px}
}

/* --- korekty po zmianie znaczników (SEO v3.7) --- */
.lead-card .lead-card-title{
  font-family:var(--ff-display);font-weight:400;font-size:1.5rem;line-height:1.2;
  margin:0 0 6px;color:var(--ink);letter-spacing:-.015em;
}
.card--link{position:relative}
.card h3 a{color:var(--ink)}
.card--link:hover h3 a{color:var(--navy-600)}
.masthead-title-sub{
  display:block;font-size:.32em;line-height:1.35;letter-spacing:.0;color:var(--muted);
  font-family:var(--ff-body);font-weight:400;margin-top:14px;
}

/* --- wizytówka faktów (cytowalna przez ludzi i przez AI) --- */
.facts{margin:0;display:grid;gap:0;border-top:1px solid var(--line-strong)}
.fact{
  display:grid;grid-template-columns:minmax(180px,258px) 1fr;gap:8px 32px;
  padding:16px 0;border-bottom:1px solid var(--line);
}
.fact dt{
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted);
  padding-top:3px;
}
.fact dd{margin:0;color:var(--ink);font-size:1rem;line-height:1.6}
.facts-note{
  display:flex;align-items:center;gap:9px;margin:20px 0 0;font-size:.83rem;color:var(--muted);
}
.facts-note svg{color:var(--brass-600);flex:none}
@media (max-width:700px){
  .fact{grid-template-columns:1fr;gap:5px;padding:14px 0}
  .fact dd{font-size:.95rem}
}