/* ==========================================================================
   DR HAB. KONRAD MALINOWSKI — SHARED STYLESHEET
   Merged from homepage + subpage inline styles
   ========================================================================== */


/* ============ DESIGN TOKENS ============ */
:root {
  --navy-deep: #0F1923;
  --navy: #1A2A3A;
  --navy-soft: #243545;
  --celadon: #4ABFAD;
  --celadon-light: #5DD4C2;
  --celadon-dim: rgba(74,191,173,0.08);
  --celadon-mid: rgba(74,191,173,0.15);
  --celadon-border: rgba(74,191,173,0.25);
  --gold: #B8956A;
  --gold-light: rgba(184,149,106,0.10);
  --bg: #F6F4F0;
  --bg-white: #FFFFFF;
  --bg-cream: #FAF8F5;
  --white: #FDFCFA;
  --cream: #F5F0EB;
  --cream-light: #FAF7F3;
  --text: #2C2C2C;
  --text-sec: #636E72;
  --text-mid: #6B6B6B;
  --text-muted: #95A5A6;
  --border: #E8E4DF;
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Inter', system-ui, sans-serif;
  --mono: 'JetBrains Mono', monospace;
}


/* ============ RESET & BASE ============ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body {
  font-family: var(--sans);
  color: var(--text);
  background: var(--bg);
  line-height: 1.7;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
body.subpage { font-size: 16.8px; }
a { color: var(--celadon); text-decoration: none; transition: color .2s; }
a:hover { color: var(--celadon-light); }
img { display: block; max-width: 100%; }


/* ============ NAV ============ */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: 60px; padding: 0 44px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(15,25,35,0.96);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background .3s, box-shadow .3s;
}
nav.scrolled {
  background: rgba(15,25,35,0.98);
  box-shadow: 0 2px 20px rgba(0,0,0,0.2);
}
.n-brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.n-logo {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1.5px solid var(--celadon-border);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: 14px; font-weight: 600;
  color: var(--celadon); letter-spacing: 1px; transition: border-color .2s;
}
.n-brand:hover .n-logo { border-color: var(--celadon); }
.n-name {
  font-family: var(--sans); font-size: 10.5px; font-weight: 600;
  color: rgba(255,255,255,0.8); letter-spacing: 1.8px;
}
.n-name span { font-weight: 400; color: rgba(255,255,255,0.25); letter-spacing: 1.5px; }
.n-links { display: flex; gap: 18px; align-items: stretch; flex-wrap: nowrap; }
.n-links > a, .n-links > .n-dropdown {
  display: flex; align-items: center; height: 60px;
}
.n-links > a.n-cta {
  height: auto; align-self: center;
}
.n-links a {
  font-size: 9.5px; font-weight: 600; color: rgba(255,255,255,0.38);
  text-decoration: none; letter-spacing: 0.8px; text-transform: uppercase; transition: color .2s;
  white-space: nowrap;
}
.n-links a:hover { color: var(--celadon); }
.n-cta {
  background: var(--celadon) !important; color: var(--navy-deep) !important;
  padding: 9px 22px; border-radius: 4px;
  font-size: 9.5px !important; font-weight: 700 !important; letter-spacing: 1.5px !important;
  transition: all .2s;
}
.n-cta:hover { background: var(--celadon-light) !important; }


/* ============ NAV DROPDOWNS ============ */
.n-dropdown { position: relative; }
.n-dropdown > a::after { content: ' \25BE'; font-size: 8px; opacity: 0.5; }
.n-dropdown-menu {
  display: none; position: absolute; top: calc(100% + 14px); left: -12px;
  background: rgba(15,25,35,0.98); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; padding: 10px 0; min-width: 250px;
  box-shadow: 0 12px 36px rgba(0,0,0,0.3); z-index: 200;
}
.n-dropdown::before {
  content: ''; position: absolute; top: 100%; left: -8px; right: -8px;
  height: 20px; background: transparent;
}
.n-dropdown:hover .n-dropdown-menu { display: block; }
.n-dropdown-menu a {
  display: block; padding: 12px 24px; font-size: 11px; font-weight: 500;
  color: rgba(255,255,255,0.5) !important; letter-spacing: 0.5px !important;
  text-transform: none !important; transition: all 0.2s;
}
.n-dropdown-menu a:hover {
  color: var(--celadon) !important; background: rgba(74,191,173,0.06);
}


/* ============ MOBILE HAMBURGER ============ */
.n-burger { display: none; cursor: pointer; padding: 8px; width: 36px; height: 36px; position: relative; }
.n-burger span {
  display: block; width: 20px; height: 2px;
  background: rgba(255,255,255,0.6); transition: all 0.3s;
  position: absolute; left: 8px;
}
.n-burger span:nth-child(1) { top: 10px; }
.n-burger span:nth-child(2) { top: 17px; }
.n-burger span:nth-child(3) { top: 24px; }


/* ============ HERO (homepage) ============ */
.hero {
  padding-top: 60px;
  min-height: 80vh;
  display: grid; grid-template-columns: 1fr 1fr;
  background: var(--navy-deep);
  color: #fff;
  position: relative; overflow: hidden;
}
.hero::after {
  content: ''; position: absolute; top: -150px; right: -80px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(74,191,173,0.05), transparent 70%);
}
.h-content {
  padding: 40px 64px 36px;
  display: flex; flex-direction: column; justify-content: center;
  z-index: 2;
}
.h-tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 16px; display: flex; align-items: center; gap: 10px;
}
.h-tag::before { content: ''; width: 30px; height: 1px; background: var(--celadon); }

.hero h1 {
  font-family: var(--serif); font-size: 38px; font-weight: 300;
  line-height: 1.15; margin-bottom: 16px; color: #fff;
}
.hero h1 strong { font-weight: 600; display: block; }

.hero-sub {
  font-size: 14px; font-weight: 300; color: rgba(255,255,255,0.45);
  max-width: 440px; line-height: 1.85; margin-bottom: 28px;
}

/* Dual path CTAs */
.dual-paths { display: flex; gap: 16px; margin-bottom: 28px; }
.dual-path {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 24px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  text-decoration: none; color: #fff;
  transition: all .3s; flex: 1;
}
.dual-path:hover {
  border-color: var(--celadon-border);
  background: rgba(74,191,173,0.06);
  color: #fff;
}
.dp-icon {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(74,191,173,0.1); display: flex;
  align-items: center; justify-content: center;
  font-size: 14px; flex-shrink: 0;
}
.dp-label {
  font-size: 9px; font-weight: 600; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--celadon); margin-bottom: 2px;
}
.dp-text { font-size: 13px; font-weight: 400; color: rgba(255,255,255,0.6); }

.hero-creds { display: flex; gap: 28px; }
.hero-cred { font-size: 10px; color: rgba(255,255,255,0.25); line-height: 1.5; }
.hero-cred strong {
  display: block; color: rgba(255,255,255,0.55);
  font-weight: 600; font-size: 11px; margin-bottom: 1px;
}

/* Photo side */
.h-photo {
  position: relative; overflow: hidden; background: var(--navy-deep);
  padding: 48px 32px 48px 0;
  display: flex; align-items: center; justify-content: center;
}
.h-photo img {
  max-height: 480px; width: auto; max-width: 100%;
  object-fit: contain; object-position: center bottom;
  border-radius: 12px; margin: auto;
}
.h-photo .placeholder-photo {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; font-size: 11px; color: rgba(255,255,255,0.2); text-align: center; padding: 20px;
}
.h-photo .ptag {
  background: var(--celadon); color: var(--navy-deep);
  font-size: 9px; font-weight: 700; padding: 2px 8px;
  border-radius: 3px; letter-spacing: 1.2px; text-transform: uppercase;
}
.h-fade-l {
  display: none;
}
.h-fade-b {
  display: none;
}


/* ============ STATS BAR (homepage) ============ */
.stats {
  background: var(--bg-white);
  padding: 48px 64px;
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 40px; text-align: center;
  border-bottom: 1px solid var(--border);
}
.stat-number {
  font-family: var(--mono); font-size: 30px; font-weight: 500;
  color: var(--navy); line-height: 1; margin-bottom: 6px; letter-spacing: -1px;
}
.stat-number a { color: var(--navy); text-decoration: none; }
.stat-number a:hover { color: var(--celadon); }
.stat-label {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--text-muted);
}


/* ============ PHILOSOPHY / AWE (homepage) ============ */
.s-philosophy {
  padding: 96px 64px;
  background: var(--bg-cream);
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 64px; align-items: center;
}
.s-philosophy .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.s-philosophy .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-philosophy h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); line-height: 1.25; margin-bottom: 20px;
}
.s-philosophy p {
  font-size: 14px; color: var(--text-sec); line-height: 1.85; margin-bottom: 16px;
}
.s-philosophy blockquote {
  font-family: var(--serif); font-size: 22px; font-style: italic;
  color: var(--navy); line-height: 1.4; margin-top: 24px;
  padding-left: 20px; border-left: 2px solid var(--gold);
}
.s-philosophy blockquote cite {
  display: block; font-family: var(--sans); font-style: normal;
  font-size: 11px; color: var(--text-muted); margin-top: 8px;
  letter-spacing: 1px; text-transform: uppercase;
}
.s-philosophy .photo-slot {
  position: relative; border-radius: 8px; overflow: hidden;
  background: #e8e4df; min-height: 420px;
}
.s-philosophy .photo-slot img {
  width: 100%; height: 100%; object-fit: cover;
}
.s-philosophy .photo-slot .placeholder-photo {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; font-size: 11px; color: var(--text-muted); text-align: center; padding: 20px;
}


/* ============ SAFETY CARDS (homepage) ============ */
.s-safety {
  padding: 96px 64px;
  background: var(--bg-white);
}
.s-safety .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
  justify-content: center;
}
.s-safety .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-safety h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); text-align: center; margin-bottom: 48px;
}
.cards-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; max-width: 1000px; margin: 0 auto;
}
.s-card {
  background: var(--bg-white); border: 1px solid var(--border);
  border-radius: 10px; padding: 32px 28px;
  position: relative; overflow: hidden; transition: all .3s;
}
.s-card::after {
  content: ''; position: absolute; left: 0; top: 0;
  width: 3px; height: 100%; background: var(--celadon);
  opacity: 0; transition: opacity .3s;
}
.s-card:hover { border-color: var(--celadon-border); box-shadow: 0 8px 24px rgba(0,0,0,0.04); }
.s-card:hover::after { opacity: 1; }
.s-card .num {
  font-family: var(--mono); font-size: 10px; color: var(--celadon);
  letter-spacing: 2px; margin-bottom: 16px;
}
.s-card h3 {
  font-family: var(--serif); font-size: 20px; font-weight: 500;
  color: var(--navy); margin-bottom: 12px; line-height: 1.25;
}
.s-card p {
  font-size: 13px; color: var(--text-sec); line-height: 1.75;
}


/* ============ RESEARCH / TECHNIQUES (homepage) ============ */
.s-research {
  padding: 96px 64px;
  background: var(--navy-deep); color: #fff;
  position: relative; overflow: hidden;
}
.s-research::before {
  content: ''; position: absolute; top: -200px; left: 50%;
  transform: translateX(-50%);
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.04), transparent 70%);
}
.s-research .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
  justify-content: center; position: relative; z-index: 2;
}
.s-research .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-research h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 300;
  text-align: center; margin-bottom: 16px; position: relative; z-index: 2;
}
.s-research .section-sub {
  text-align: center; font-size: 14px; color: rgba(255,255,255,0.4);
  max-width: 520px; margin: 0 auto 56px; line-height: 1.8;
  position: relative; z-index: 2;
}
.tech-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px; max-width: 1000px; margin: 0 auto;
  position: relative; z-index: 2;
}
.tech-card {
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; padding: 28px 24px;
  text-decoration: none; color: #fff; transition: all .3s;
  display: flex; flex-direction: column;
}
.tech-card:hover {
  border-color: var(--celadon-border);
  background: rgba(74,191,173,0.06);
  color: #fff; transform: translateY(-2px);
}
.tech-card .tc-tag {
  font-family: var(--mono); font-size: 9px; font-weight: 500;
  color: var(--celadon); letter-spacing: 1.5px;
  text-transform: uppercase; margin-bottom: 14px;
}
.tech-card h3 {
  font-family: var(--serif); font-size: 18px; font-weight: 500;
  line-height: 1.25; margin-bottom: 10px;
}
.tech-card p {
  font-size: 12px; color: rgba(255,255,255,0.35); line-height: 1.65;
  flex: 1;
}
.tech-card .tc-arrow {
  margin-top: 16px; font-size: 11px; color: var(--celadon);
  font-weight: 600; letter-spacing: 1px; text-transform: uppercase;
}


/* ============ REVIEWS (homepage) ============ */
.s-reviews {
  padding: 96px 64px;
  background: var(--bg-cream);
}
.s-reviews .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
  justify-content: center;
}
.s-reviews .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-reviews h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); text-align: center; margin-bottom: 48px;
}
.reviews-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 20px; max-width: 900px; margin: 0 auto;
}
.review-card {
  background: var(--bg-white); border: 1px solid var(--border);
  border-radius: 10px; padding: 32px 28px; position: relative;
}
.review-card.full { grid-column: 1 / -1; }
.review-quote {
  font-family: var(--serif); font-size: 56px; font-weight: 300;
  color: var(--celadon); line-height: 1; position: absolute; top: 16px; left: 24px;
  opacity: 0.3;
}
.review-stars {
  color: var(--gold); font-size: 12px; margin-bottom: 12px; letter-spacing: 2px;
}
.review-text {
  font-family: var(--serif); font-size: 16px; font-style: italic;
  color: var(--navy); line-height: 1.6; margin-bottom: 16px;
}
.review-author {
  font-size: 11px; color: var(--text-muted); letter-spacing: 0.5px;
}
.review-author a { color: var(--celadon); }
.reviews-source {
  text-align: center; margin-top: 32px;
  font-size: 11px; color: var(--text-muted); letter-spacing: 1px;
}
.reviews-source a { color: var(--celadon); font-weight: 600; }


/* ============ CREDENTIALS (homepage) ============ */
.s-creds {
  padding: 96px 64px;
  background: var(--bg-white);
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 64px; align-items: center;
}
.s-creds .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.s-creds .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-creds h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); line-height: 1.25; margin-bottom: 20px;
}
.s-creds p {
  font-size: 14px; color: var(--text-sec); line-height: 1.85; margin-bottom: 16px;
}
.creds-list {
  display: flex; flex-direction: column; gap: 12px; margin-top: 24px;
}
.cred-item {
  display: flex; align-items: center; gap: 12px;
  font-size: 13px; color: var(--text-sec);
}
.cred-icon {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--celadon-dim); display: flex;
  align-items: center; justify-content: center;
  font-size: 12px; color: var(--celadon); flex-shrink: 0;
}
.cred-link {
  margin-top: 32px; display: inline-flex; align-items: center; gap: 8px;
  font-size: 11px; font-weight: 600; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--celadon);
}
.cred-link:hover { color: var(--celadon-light); }

.creds-orgs {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
}
.org-badge {
  background: var(--bg-cream); border: 1px solid var(--border);
  border-radius: 8px; padding: 24px 20px; text-align: center;
  transition: all .3s;
}
.org-badge:hover { border-color: var(--celadon-border); }
.org-badge .ob-name {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--navy); letter-spacing: 1px; margin-bottom: 4px;
}
.org-badge .ob-desc {
  font-size: 10px; color: var(--text-muted); line-height: 1.5;
}


/* ============ JOINT HUBS (homepage) ============ */
.s-joints {
  padding: 80px 64px;
  background: var(--bg);
}
.s-joints .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
  justify-content: center;
}
.s-joints .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-joints h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); text-align: center; margin-bottom: 48px;
}
.joints-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 20px; max-width: 1000px; margin: 0 auto;
}
.joint-card {
  background: var(--bg-white); border: 1px solid var(--border);
  border-radius: 10px; padding: 32px 24px; text-align: center;
  text-decoration: none; color: var(--navy); transition: all .3s;
}
.joint-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  transform: translateY(-3px); color: var(--navy);
}
.joint-icon {
  font-size: 28px; margin-bottom: 16px; display: block;
  color: var(--celadon); opacity: 0.7;
}
.joint-card h3 {
  font-family: var(--serif); font-size: 22px; font-weight: 500;
  margin-bottom: 8px;
}
.joint-card .joint-count {
  font-family: var(--mono); font-size: 10px; color: var(--text-muted);
  letter-spacing: 1px; margin-bottom: 10px;
}
.joint-card p {
  font-size: 12px; color: var(--text-sec); line-height: 1.6;
}


/* ============ ATHLETES / SPORT (homepage) ============ */
.s-athletes {
  padding: 80px 64px;
  background: var(--bg-cream);
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 64px; align-items: center;
}
.s-athletes .tag {
  font-size: 9px; font-weight: 600; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--celadon);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.s-athletes .tag::before { content: ''; width: 24px; height: 1px; background: var(--celadon); }
.s-athletes h2 {
  font-family: var(--serif); font-size: 28px; font-weight: 400;
  color: var(--navy); line-height: 1.25; margin-bottom: 20px;
}
.s-athletes p {
  font-size: 14px; color: var(--text-sec); line-height: 1.85; margin-bottom: 16px;
}
.athlete-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px;
}
.athlete-stat {
  text-align: center; padding: 16px 12px;
  background: var(--bg-white); border: 1px solid var(--border); border-radius: 8px;
}
.athlete-stat .as-num {
  font-family: var(--mono); font-size: 20px; font-weight: 500;
  color: var(--navy); margin-bottom: 4px;
}
.athlete-stat .as-label {
  font-size: 9px; color: var(--text-muted); text-transform: uppercase;
  letter-spacing: 1px;
}
.s-athletes .photo-slot {
  position: relative; border-radius: 8px; overflow: hidden;
  background: #e8e4df; min-height: 360px;
}
.s-athletes .photo-slot .placeholder-photo {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; font-size: 11px; color: var(--text-muted); text-align: center; padding: 20px;
}


/* ============ CTA STRIP ============ */
/* Homepage variant (full decorative treatment) */
.cta-strip {
  background: var(--navy-deep);
  padding: 96px 64px;
  text-align: center;
  position: relative; overflow: hidden;
}
.cta-strip::before {
  content: ''; position: absolute; bottom: -100px; left: 50%;
  transform: translateX(-50%); width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.06), transparent 70%);
}
.cta-strip h2 {
  font-family: var(--serif); font-size: 32px; font-weight: 300;
  color: #fff; margin-bottom: 16px; position: relative; z-index: 2;
}
.cta-strip p {
  color: rgba(255,255,255,0.4); margin-bottom: 32px;
  font-size: 15px; max-width: 560px; margin-left: auto; margin-right: auto;
  line-height: 1.75; position: relative; z-index: 2;
}
.cta-strip .cta-btn {
  display: inline-block; background: var(--celadon); color: var(--navy-deep);
  padding: 16px 42px; border-radius: 5px;
  font-weight: 700; font-size: 11px; letter-spacing: 1.5px;
  text-transform: uppercase; text-decoration: none;
  transition: all .3s; position: relative; z-index: 2;
}
.cta-strip .cta-btn:hover {
  background: var(--celadon-light); color: var(--navy-deep);
  box-shadow: 0 8px 28px rgba(74,191,173,0.25);
  transform: translateY(-2px);
}
.cta-locs {
  margin-top: 24px; font-size: 11px; letter-spacing: 2px;
  text-transform: uppercase; color: rgba(255,255,255,0.2);
  position: relative; z-index: 2;
  font-family: var(--sans); font-weight: 500;
}
.cta-locs em { font-style: normal; color: var(--celadon); margin: 0 6px; }

/* Subpage CTA strip overrides */
body.subpage .cta-strip { padding: 48px 24px; margin-top: 48px; }
body:has(.hero-label) .cta-strip { background: #162230; border-top: 1px solid rgba(255,255,255,0.06); }
body.subpage .cta-strip::before { display: none; }
body.subpage .cta-strip h2 { font-size: 1.8rem; position: static; }
body.subpage .cta-strip p {
  color: rgba(255,255,255,0.5); margin-bottom: 24px;
  position: static; max-width: none;
}
body.subpage .cta-strip a {
  display: inline-block; background: var(--celadon); color: var(--navy-deep);
  padding: 14px 32px; border-radius: 4px;
  font-weight: 700; font-size: 10.5px; letter-spacing: 1.4px;
  text-transform: uppercase; text-decoration: none; transition: all .25s;
}
body.subpage .cta-strip a:hover {
  background: var(--celadon-light);
  box-shadow: 0 8px 32px rgba(74,191,173,0.22);
}
body.subpage .cta-locs {
  margin-top: 18px; color: rgba(255,255,255,0.25);
  position: static;
}
body.subpage .cta-locs em { font-style: normal; margin: 0 6px; opacity: 0.4; color: inherit; }


/* ============ BREADCRUMB (subpage) ============ */
.breadcrumb {
  font-size: 13px; color: var(--text-mid);
  padding: 16px 0; max-width: 800px; margin: 0 auto; padding-top: 76px;
}
.breadcrumb a { color: var(--celadon); text-decoration: none; }
.breadcrumb a:hover { color: var(--celadon-light); }
.breadcrumb .sep { margin: 0 6px; color: var(--text-mid); }


/* ============ PAGE HERO (subpage) ============ */
.page-hero { max-width: 800px; margin: 0 auto; padding: 40px 24px 0; }
.page-hero h1 {
  font-family: var(--serif); font-size: 2.6rem; color: var(--navy);
  line-height: 1.15; margin-bottom: 16px; font-weight: 700;
}
.page-hero .subtitle {
  font-size: 15px; color: var(--text-mid); letter-spacing: 1px;
  text-transform: uppercase; margin-bottom: 8px; font-weight: 600;
}
.page-hero .lead {
  font-size: 1.05rem; color: var(--text-mid);
  margin-bottom: 0; line-height: 1.65;
}


/* ============ ANSWER-FIRST BOX (subpage) ============ */
.answer-first {
  max-width: 800px; margin: 24px auto; padding: 24px 28px;
  background: var(--cream-light); border-left: 4px solid var(--gold);
  border-radius: 0 8px 8px 0; font-size: 16px; line-height: 1.7; color: var(--text);
}
.answer-first p { margin-bottom: 8px; }
.answer-first p:last-child { margin-bottom: 0; }


/* ============ CONTENT (subpage) ============ */
.content { max-width: 800px; margin: 0 auto; padding: 24px 24px 48px; }
.content h2 {
  font-family: var(--serif); font-size: 1.8rem; color: var(--navy);
  margin: 40px 0 16px; line-height: 1.2; font-weight: 600;
}
.content h3 {
  font-family: var(--serif); font-size: 1.3rem; color: var(--navy);
  margin: 28px 0 12px; font-weight: 600;
}
.content p { margin-bottom: 16px; font-size: 16.8px; }
.content ul, .content ol { margin: 12px 0 16px 24px; }
.content li { margin-bottom: 8px; font-size: 16.8px; }
.content strong { color: var(--navy); font-weight: 600; }


/* ============ SECTION SEPARATOR (subpage) ============ */
.section-sep { width: 48px; height: 2px; background: var(--celadon); margin: 40px auto; opacity: 0.2; }


/* ============ QUIET NOTE (subpage) ============ */
.quiet-note {
  max-width: 800px; margin: 24px auto; padding: 20px 24px;
  background: var(--cream); border-radius: 6px;
  font-size: 15px; color: var(--text-mid); line-height: 1.65;
}
.quiet-note p { margin-bottom: 8px; color: var(--text-mid); font-size: 15px; }
.quiet-note p:last-child { margin-bottom: 0; }


/* ============ QUOTE BLOCK (subpage) ============ */
.quote-block {
  max-width: 800px; margin: 32px auto; padding: 20px 28px;
  border-left: 3px solid var(--gold); background: var(--gold-light);
  border-radius: 0 6px 6px 0;
}
.quote-block p {
  font-family: var(--serif); font-size: 1.2rem; font-style: italic;
  color: var(--navy); margin-bottom: 0; line-height: 1.5;
}
.quote-block .src {
  font-family: var(--sans); font-style: normal; font-size: 0.82rem;
  color: var(--text-mid); margin-top: 8px; display: block;
}


/* ============ FAQ (subpage) ============ */
.faq { max-width: 800px; margin: 32px auto; padding: 0 24px; }
.faq h2 { font-family: var(--serif); font-size: 1.8rem; color: var(--navy); margin-bottom: 20px; }
.faq-item {
  border: 1px solid rgba(0,0,0,0.08); border-radius: 8px;
  margin-bottom: 8px; overflow: hidden;
}
.faq-q {
  padding: 16px 20px; cursor: pointer; font-weight: 600; font-size: 15px;
  display: flex; justify-content: space-between; align-items: center;
  background: var(--cream-light); transition: background .2s;
}
.faq-q:hover { background: var(--cream); }
.faq-q::after { content: '+'; font-size: 20px; color: var(--celadon); transition: transform .2s; }
.faq-item.open .faq-q::after { content: '\2212'; }
.faq-a {
  display: none; padding: 0 20px 16px;
  font-size: 15px; line-height: 1.7; color: var(--text-mid);
}
.faq-item.open .faq-a { display: block; }


/* ============ RELATED CARDS (subpage) ============ */
.related { max-width: 800px; margin: 40px auto; padding: 0 24px; }
.related h2 { font-family: var(--serif); font-size: 1.8rem; color: var(--navy); margin-bottom: 20px; }
.related-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px;
}
.related-card {
  background: var(--cream-light); border: 1px solid rgba(0,0,0,0.06);
  border-radius: 8px; padding: 20px; text-decoration: none; transition: all .2s;
}
.related-card:hover { border-color: var(--celadon); box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.related-card h4 {
  font-family: var(--sans); font-size: 11px; color: var(--celadon);
  margin-bottom: 6px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
}
.related-card p {
  font-size: 14px; color: var(--navy); margin: 0; line-height: 1.4; font-weight: 500;
}


/* ============ CROSSLINK (subpage) ============ */
.crosslink { font-size: 14px; color: var(--celadon); font-weight: 500; padding: 8px 0; }
.crosslink a { color: var(--celadon); border-bottom: 1px solid var(--celadon); text-decoration: none; }


/* ============ CONTENT TABLE (subpage) ============ */
.content-table { margin: 20px 0; overflow-x: auto; }
.content-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.content-table th {
  background: var(--navy); color: var(--white); padding: 10px 16px;
  text-align: left; font-family: var(--sans); font-size: 12px;
  letter-spacing: 1px; text-transform: uppercase; font-weight: 600;
}
.content-table td {
  padding: 10px 16px; border-bottom: 1px solid rgba(0,0,0,0.06);
  color: var(--text-mid); font-size: 14px;
}
.content-table tr:hover td { background: var(--cream-light); }


/* ============ COMPARISON TABLE (subpage) ============ */
.comparison { max-width: 800px; margin: 24px auto; padding: 0 24px; }
.comparison table { width: 100%; border-collapse: collapse; font-size: 14px; }
.comparison th {
  background: var(--navy); color: var(--white); padding: 12px 16px;
  text-align: left; font-size: 12px; letter-spacing: 0.5px;
  text-transform: uppercase; font-weight: 600;
}
.comparison td {
  padding: 12px 16px; border-bottom: 1px solid rgba(0,0,0,0.06);
  font-size: 14px; vertical-align: top;
}
.comparison tr:hover td { background: var(--cream-light); }
.comparison .highlight-row td { background: rgba(74,191,173,0.06); font-weight: 500; }
.comparison .tag { display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
.comparison .tag-yes { background: rgba(74,191,173,0.12); color: var(--celadon); }
.comparison .tag-no { background: rgba(0,0,0,0.06); color: var(--text-mid); }


/* ============ KEY STATS BAR (subpage) ============ */
.key-stats {
  max-width: 800px; margin: 24px auto;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: rgba(0,0,0,0.06); border-radius: 8px; overflow: hidden;
}
.key-stat { background: var(--cream-light); padding: 20px 16px; text-align: center; }
.key-stat .num {
  font-family: var(--serif); font-size: 2rem; color: var(--navy);
  font-weight: 700; line-height: 1;
}
.key-stat .label {
  font-size: 12px; color: var(--text-mid); margin-top: 4px;
  text-transform: uppercase; letter-spacing: 0.5px;
}


/* ============ INFO BOX (subpage) ============ */
.info-box {
  max-width: 800px; margin: 24px auto; padding: 20px 24px;
  background: var(--cream-light); border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.06);
}
.info-box.warning { border-left: 4px solid var(--gold); border-radius: 0 8px 8px 0; }
.info-box.clinical { border-left: 4px solid var(--celadon); border-radius: 0 8px 8px 0; }
.info-box h3 {
  font-family: var(--serif); font-size: 1.1rem; color: var(--navy);
  margin-bottom: 8px; font-weight: 600;
}
.info-box p { font-size: 15px; margin-bottom: 8px; color: var(--text); }
.info-box p:last-child { margin-bottom: 0; }


/* ============ TIMELINE (subpage) ============ */
.timeline { max-width: 800px; margin: 24px auto; padding: 0 24px; }
.timeline-item {
  display: flex; gap: 16px; padding: 16px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.timeline-item:last-child { border-bottom: none; }
.timeline-period { min-width: 100px; font-weight: 600; font-size: 14px; color: var(--celadon); }
.timeline-desc { font-size: 15px; color: var(--text); }


/* ============ BIBLIOGRAPHY (subpage) ============ */
.bibliography { max-width: 800px; margin: 32px auto; padding: 0 24px; }
.bibliography h2 { font-family: var(--serif); font-size: 1.8rem; color: var(--navy); margin-bottom: 16px; }
.bibliography ol { list-style: decimal; margin: 0 0 0 24px; padding: 0; }
.bibliography li {
  font-size: 13.5px; color: var(--text-mid); margin-bottom: 10px;
  line-height: 1.6; padding-left: 4px;
}
.bibliography li strong { color: var(--text); font-weight: 600; }
.bibliography .journal { font-style: italic; }


/* ============ FOOTER ============ */
footer {
  background: var(--navy-deep);
  border-top: 1px solid rgba(255,255,255,0.05);
  padding: 28px 56px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 10px; color: rgba(255,255,255,0.16);
  flex-wrap: wrap; gap: 12px;
}
footer div { display: flex; gap: 12px; align-items: center; }
footer a {
  color: var(--celadon); text-decoration: none;
  font-size: 10px; opacity: 0.7; transition: opacity .2s;
}
footer a:hover { opacity: 1; }


/* ============ SCROLL ANIMATIONS ============ */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.anim { opacity: 0; transform: translateY(24px); transition: all .6s cubic-bezier(.22,1,.36,1); }
.anim.visible { opacity: 1; transform: translateY(0); }


/* ==========================================================================
   MISSING STYLES — APPENDED BY BUILD FIX
   Extracted from spec/LAYOUTY_AKTUALNE inline styles + hub page conventions
   ========================================================================== */


/* ============ FILOZOFIA: QUOTE STRIP ============ */
.quote-strip {
  background: var(--navy-deep);
  padding: 72px 48px;
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(74,191,173,0.08);
}
.quote-strip::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.04), transparent 70%);
}
.quote-strip::after {
  content: '\201C';
  font-family: var(--serif);
  font-size: 180px;
  color: rgba(74,191,173,0.04);
  position: absolute;
  top: -30px; left: 50%;
  transform: translateX(-50%);
  line-height: 1;
}
.quote-inner {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 2;
}
.quote-inner blockquote {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 300;
  font-style: italic;
  color: var(--celadon-light);
  line-height: 1.35;
  margin-bottom: 20px;
}
.quote-inner .quote-src {
  font-size: 13px;
  color: rgba(255,255,255,0.3);
  letter-spacing: 0.5px;
  line-height: 1.6;
}
.quote-inner .quote-src strong {
  color: rgba(255,255,255,0.5);
  font-weight: 600;
}
.quote-divider {
  width: 40px;
  height: 1px;
  background: var(--celadon-border);
  margin: 12px auto 16px;
}


/* ============ FILOZOFIA / STAZE / HABILITACJA: SECTION SYSTEM ============ */
.sec { padding: 80px 48px; }
.sec-dark { background: var(--navy-deep); color: #fff; }
.sec-cream { background: var(--bg-cream); }
.sec-white { background: var(--bg-white); }
.sec-inner { max-width: 820px; margin: 0 auto; }
.sec h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 10px;
  line-height: 1.2;
}
.sec-dark h2 { color: #fff; }
.sec .intro {
  font-size: 15px;
  color: var(--text-sec);
  max-width: 560px;
  line-height: 1.8;
  margin-bottom: 40px;
}
.sec-dark .intro { color: rgba(255,255,255,0.4); }
.sec a { color: var(--celadon); text-decoration: none; transition: color 0.2s; }
.sec a:hover { color: var(--celadon-light); }
.sec strong { color: var(--navy); font-weight: 600; }
.sec-dark strong { color: rgba(255,255,255,0.85); }


/* ============ FILOZOFIA: ORIGIN TIMELINE ============ */
.origin-timeline {
  position: relative;
  padding-left: 52px;
  margin-top: 12px;
}
.origin-timeline::before {
  content: '';
  position: absolute;
  left: 16px; top: 8px; bottom: 40px;
  width: 1px;
  background: var(--celadon-border);
}
.origin-step {
  position: relative;
  margin-bottom: 56px;
}
.origin-step:last-child { margin-bottom: 0; }
.origin-step::before {
  content: '';
  position: absolute;
  left: -44px; top: 6px;
  width: 13px; height: 13px;
  border-radius: 50%;
  border: 2px solid var(--celadon);
  background: var(--bg-cream);
  transition: all 0.3s;
}
.origin-step.active::before {
  background: var(--celadon);
  box-shadow: 0 0 16px rgba(74,191,173,0.35);
}
.origin-year {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--celadon);
  letter-spacing: 2.5px;
  margin-bottom: 8px;
  font-weight: 500;
}
.origin-step h3 {
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.25;
}
.origin-step p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 12px;
}
.origin-step p:last-child { margin-bottom: 0; }
.origin-step p strong { color: var(--text); font-weight: 600; }
.origin-detail {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 22px 26px;
  margin-top: 16px;
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.75;
  position: relative;
}
.origin-detail::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  border-radius: 3px 0 0 3px;
}
.origin-detail strong { color: var(--navy); font-weight: 600; }
.origin-pullquote {
  font-family: var(--serif);
  font-size: 21px;
  font-style: italic;
  color: var(--navy);
  border-left: 3px solid var(--celadon);
  padding-left: 20px;
  margin: 18px 0 14px;
  line-height: 1.4;
}


/* ============ FILOZOFIA: PRACTICE CARDS ============ */
.practice-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.p-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.p-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.p-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 32px rgba(74,191,173,0.08);
  transform: translateY(-2px);
}
.p-card:hover::after { opacity: 1; }
.p-card .p-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 10px;
}
.p-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 10px;
  line-height: 1.3;
}
.p-card p {
  font-size: 13.5px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 0;
}
.p-card a {
  color: var(--celadon);
  text-decoration: none;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.5px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: gap 0.2s;
}
.p-card a:hover { gap: 8px; }


/* ============ FILOZOFIA: QUALIFICATION GRID ============ */
.qual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.qual-text p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 14px;
}
.qual-text p strong { color: var(--text); font-weight: 600; }
.qual-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}
.qual-list li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 10px;
}
.qual-list li::before {
  content: '';
  position: absolute;
  left: 0; top: 11px;
  width: 10px; height: 10px;
  border-radius: 50%;
  border: 2px solid var(--celadon);
  background: transparent;
}
.qual-sidebar {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 32px;
  position: relative;
  overflow: hidden;
}
.qual-sidebar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--celadon), transparent);
}
.qual-sidebar h4 {
  font-family: var(--serif);
  font-size: 20px;
  color: var(--navy);
  margin-bottom: 12px;
  font-weight: 500;
}
.qual-sidebar p {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 12px;
}
.qual-sidebar p:last-child { margin-bottom: 0; }
.qual-sidebar strong { color: var(--text); font-weight: 600; }


/* ============ FILOZOFIA: VALUES GRID (dark) ============ */
.values-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}
.v-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 32px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.v-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.v-card:hover {
  border-color: var(--celadon-border);
  background: rgba(255,255,255,0.04);
  transform: translateY(-2px);
}
.v-card:hover::after { opacity: 1; }
.v-card .num {
  font-family: var(--mono);
  font-size: 28px;
  font-weight: 500;
  color: rgba(74,191,173,0.2);
  margin-bottom: 14px;
  line-height: 1;
}
.v-card h3 {
  font-family: var(--serif);
  font-size: 21px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.3;
}
.v-card p {
  font-size: 14px;
  color: rgba(255,255,255,0.4);
  line-height: 1.75;
  margin-bottom: 0;
}
.v-card a { color: var(--celadon); text-decoration: none; }
.v-featured {
  grid-column: 1 / 3;
  background: rgba(74,191,173,0.04);
  border-color: var(--celadon-border);
}
.v-featured .num { color: var(--gold); font-size: 32px; }
.v-featured h3 { font-size: 24px; }
.v-featured p { font-size: 15px; color: rgba(255,255,255,0.5); }


/* ============ O-MNIE: BIO SECTION ============ */
.bio-section {
  padding: 80px 56px;
  background: var(--bg-cream);
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 60px;
  align-items: start;
}
.bio-main { max-width: 680px; }
.bio-main h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 24px;
  line-height: 1.2;
}
.bio-main > p {
  font-size: 16px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 20px;
}
.bio-main p:first-of-type {
  font-size: 17px;
  color: var(--text-mid);
  font-weight: 300;
}
.bio-main strong { color: var(--text); font-weight: 600; }
.bio-main a { color: var(--celadon); text-decoration: none; transition: color 0.2s; }
.bio-main a:hover { color: var(--celadon-light); }
.bio-sidebar {
  background: var(--bg-white);
  border-radius: 10px;
  padding: 32px;
  box-shadow: 0 2px 12px rgba(74,191,173,0.08);
  position: sticky;
  top: 80px;
  height: fit-content;
  border-top: 3px solid var(--celadon);
}
.bio-sidebar h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 24px;
}
.credential-card {
  display: flex;
  flex-direction: column;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--border);
}
.credential-card:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.credential-card .label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 6px;
}
.credential-card .title {
  font-size: 15px;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 4px;
}
.credential-card .desc {
  font-size: 13px;
  color: var(--text-sec);
  line-height: 1.6;
}


/* ============ O-MNIE: VALUES SECTION ============ */
.values-section {
  padding: 80px 56px;
  background: var(--navy-deep);
  color: #fff;
}
.values-section h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: #fff;
  margin-bottom: 16px;
  max-width: 680px;
}
.values-intro {
  font-size: 15px;
  color: rgba(255,255,255,0.4);
  max-width: 680px;
  margin-bottom: 48px;
  line-height: 1.8;
}
.value-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 32px;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
  border-left: 3px solid var(--celadon);
}
.value-card:hover {
  border-color: var(--celadon-border);
  background: rgba(255,255,255,0.04);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(74,191,173,0.12);
}
.value-card.gold-accent {
  border-left-color: var(--gold);
  background: rgba(184,149,106,0.03);
}
.value-card.gold-accent:hover {
  border-color: rgba(184,149,106,0.3);
  background: rgba(184,149,106,0.05);
}
.value-card h3 {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.3;
}
.value-card p {
  font-size: 14px;
  color: rgba(255,255,255,0.4);
  line-height: 1.75;
  margin-bottom: 0;
}


/* ============ O-MNIE: GALLERY SECTION ============ */
.gallery-section {
  padding: 80px 56px;
  background: var(--navy-deep);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.gallery-section::before {
  content: '';
  position: absolute;
  top: 50%; right: 0;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(74,191,173,0.05), transparent 70%);
  transform: translateY(-50%);
}
.gallery-section h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: #fff;
  margin-bottom: 48px;
  max-width: 920px;
}
.gallery-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 260px 260px;
  gap: 16px;
  max-width: 920px;
  position: relative;
  z-index: 1;
}
.gallery-item {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  background: rgba(255,255,255,0.05);
  border: 1px dashed rgba(255,255,255,0.15);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.3);
  font-size: 13px;
  text-align: center;
  padding: 16px;
  transition: all 0.3s;
}
.gallery-item:hover {
  border-color: var(--celadon-border);
  background: rgba(74,191,173,0.06);
}
.gallery-item.large { grid-row: 1 / 3; }
.gallery-item .ptag {
  background: var(--celadon);
  color: var(--navy-deep);
  font-size: 9px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  margin-bottom: 8px;
}


/* ============ O-MNIE: COLLABORATION SECTION ============ */
.collab-section {
  padding: 80px 56px;
  background: var(--bg-cream);
  max-width: 920px;
  margin: 0 auto;
}
.collab-section h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 12px;
}
.collab-intro {
  font-size: 15px;
  color: var(--text-sec);
  margin-bottom: 40px;
  line-height: 1.8;
}
.collab-card {
  background: var(--bg-white);
  border-radius: 10px;
  padding: 40px;
  box-shadow: 0 2px 12px rgba(74,191,173,0.08);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: center;
  transition: all 0.3s;
  border: 1px solid var(--border);
}
.collab-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 32px rgba(74,191,173,0.12);
  transform: translateY(-2px);
}
.collab-photo {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: var(--celadon-dim);
  border: 3px solid var(--celadon);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--text-sec);
  text-align: center;
  padding: 12px;
  flex-shrink: 0;
}
.collab-text h3 {
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 4px;
  line-height: 1.25;
}
.collab-text .role {
  color: var(--celadon);
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}
.collab-text p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
}


/* ============ O-MNIE: MEMBERSHIPS SECTION ============ */
.memberships-section {
  padding: 80px 56px;
  background: var(--bg-white);
  text-align: center;
  max-width: 920px;
  margin: 0 auto;
}
.memberships-section h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 48px;
}
.memberships-grid {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}
.membership-badge {
  background: var(--bg-cream);
  border: 1px solid var(--border);
  padding: 16px 28px;
  border-radius: 6px;
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 500;
  color: var(--navy);
  letter-spacing: 0.5px;
  transition: all 0.3s;
}
.membership-badge:hover {
  border-color: var(--celadon);
  background: var(--celadon-dim);
  color: var(--celadon);
}
.membership-badge.former {
  font-size: 13px;
  color: var(--text-sec);
}


/* ============ O-MNIE: SUBPAGES SECTION ============ */
.subpages-section {
  padding: 80px 56px;
  background: var(--bg-cream);
}
.subpages-section h2 {
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 48px;
  text-align: center;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}
.subpages-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  max-width: 920px;
  margin: 0 auto;
}
.subpage-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 28px;
  text-decoration: none;
  transition: all 0.3s;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.subpage-card:hover {
  border-color: var(--celadon);
  box-shadow: 0 8px 28px rgba(74,191,173,0.12);
  transform: translateY(-2px);
}
.subpage-card h3 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 4px;
}
.subpage-card p {
  font-size: 13px;
  color: var(--text-sec);
  margin: 0;
  line-height: 1.6;
}
.subpage-card::after {
  content: '\2192';
  color: var(--celadon);
  font-size: 16px;
  margin-top: 8px;
  opacity: 0;
  transition: opacity 0.3s;
}
.subpage-card:hover::after { opacity: 1; }


/* ============ HABILITACJA: STATS BAR ============ */
.stats-bar {
  background: var(--bg-cream);
  padding: 56px 48px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.stat-num {
  font-family: var(--mono);
  font-size: 30px;
  font-weight: 500;
  color: var(--navy-deep);
  letter-spacing: -2px;
  line-height: 1;
  margin-bottom: 8px;
}
.stat-lbl {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-sec);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  line-height: 1.4;
}


/* ============ HABILITACJA: PUB GRID + PUB CARD ============ */
.pub-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  margin-bottom: 32px;
}
.pub-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 32px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.pub-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.pub-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 32px rgba(74,191,173,0.08);
  transform: translateY(-2px);
}
.pub-card:hover::after { opacity: 1; }
.pub-card .p-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 8px;
}
.pub-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.3;
}
.pub-card .pub-finding {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 12px;
}
.pub-card .pub-year {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--celadon);
  letter-spacing: 2px;
  margin-top: 16px;
  font-weight: 500;
}


/* ============ HABILITACJA: METRICS GRID ============ */
.metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 40px 0;
}
.metric-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px;
  text-align: center;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.metric-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.metric-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 24px rgba(74,191,173,0.08);
  transform: translateY(-2px);
}
.metric-card:hover::after { opacity: 1; }
.metric-num {
  font-family: var(--mono);
  font-size: 28px;
  font-weight: 500;
  color: var(--navy-deep);
  letter-spacing: -1.5px;
  line-height: 1;
  margin-bottom: 10px;
}
.metric-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-sec);
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.5;
}
.metrics-grid-2col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin: 40px 0;
}


/* ============ HABILITACJA: MATTERS + MONOGRAPH ============ */
.matters-section { background: var(--bg-white); }
.matters-section h2 { color: var(--navy); margin-bottom: 24px; }
.matters-item {
  background: var(--bg-cream);
  border-left: 3px solid var(--celadon);
  border-radius: 0 8px 8px 0;
  padding: 24px 28px;
  margin-bottom: 20px;
}
.matters-item h4 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
}
.matters-item p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin: 0;
}
.monograph-sec { background: var(--bg-cream); }
.monograph-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 32px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.monograph-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--gold);
  opacity: 0;
  transition: opacity 0.35s;
}
.monograph-card:hover {
  border-color: var(--gold-light);
  box-shadow: 0 8px 24px rgba(184,149,106,0.08);
  transform: translateY(-2px);
}
.monograph-card:hover::after { opacity: 1; }
.monograph-card .mono-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 8px;
}
.monograph-card h3 {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.3;
}
.monograph-card p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin: 0;
}


/* ============ STAZE: TIMELINE SECTION ============ */
.timeline-section {
  background: var(--bg-cream);
  padding: 80px 48px;
}
.timeline-inner {
  max-width: 820px;
  margin: 0 auto;
}
.timeline-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.timeline-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.timeline-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 10px;
  line-height: 1.2;
}
.timeline-intro {
  font-size: 15px;
  color: var(--text-sec);
  max-width: 560px;
  line-height: 1.8;
  margin-bottom: 40px;
}
.timeline-vertical {
  position: relative;
  padding-left: 52px;
  margin-top: 12px;
}
.timeline-vertical::before {
  content: '';
  position: absolute;
  left: 16px; top: 8px; bottom: 40px;
  width: 1px;
  background: var(--celadon-border);
}
.timeline-step {
  position: relative;
  margin-bottom: 56px;
}
.timeline-step:last-child { margin-bottom: 0; }
.timeline-step::before {
  content: '';
  position: absolute;
  left: -44px; top: 6px;
  width: 13px; height: 13px;
  border-radius: 50%;
  border: 2px solid var(--celadon);
  background: var(--bg-cream);
  transition: all 0.3s;
}
.timeline-step:hover::before {
  background: var(--celadon);
  box-shadow: 0 0 16px rgba(74,191,173,0.35);
}
.timeline-year {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--celadon);
  letter-spacing: 2.5px;
  margin-bottom: 8px;
  font-weight: 500;
}
.timeline-step h3 {
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.25;
}
.timeline-step p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.8;
  margin-bottom: 12px;
}
.timeline-step p:last-child { margin-bottom: 0; }
.timeline-step p strong { color: var(--text); font-weight: 600; }
.timeline-detail {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 22px 26px;
  margin-top: 16px;
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.75;
  position: relative;
}
.timeline-detail::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  border-radius: 3px 0 0 3px;
}
.timeline-detail strong { color: var(--navy); font-weight: 600; }


/* ============ STAZE: COMPETENCIES SECTION ============ */
.competencies-section {
  background: var(--navy-deep);
  color: #fff;
  padding: 80px 48px;
  position: relative;
  overflow: hidden;
}
.competencies-section::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.04), transparent 70%);
}
.competencies-inner {
  max-width: 820px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.comp-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.comp-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.competencies-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.2;
}
.comp-intro {
  font-size: 15px;
  color: rgba(255,255,255,0.4);
  max-width: 560px;
  line-height: 1.8;
  margin-bottom: 40px;
}
.competency-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 32px;
}
.comp-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--celadon-border);
  border-radius: 12px;
  padding: 28px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.comp-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.comp-card:hover {
  border-color: var(--celadon-mid);
  background: rgba(74,191,173,0.04);
  transform: translateY(-2px);
}
.comp-card:hover::before { opacity: 1; }
.comp-label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 10px;
}
.comp-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.3;
}
.comp-card p {
  font-size: 14px;
  color: rgba(255,255,255,0.5);
  line-height: 1.75;
  margin-bottom: 0;
}


/* ============ STAZE: RELATED SECTION (full-width variant) ============ */
.related-section {
  background: var(--bg-white);
  padding: 80px 48px;
}
.related-inner {
  max-width: 820px;
  margin: 0 auto;
}
.related-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.related-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.related-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 28px;
  line-height: 1.2;
}


/* ============ PUBLIKACJE: DARK PAGE STYLES ============ */
body:has(.hero-label) {
  --text-secondary: #7A8DA0;
  --navy-card: #131E2A;
  --gold: #C9A96E;
  --gold-dim: rgba(201,169,110,0.1);
  background: #0F1923;
  color: #F5F1EB;
}
header.hero {
  padding: 120px 24px 60px;
  max-width: 1000px;
  margin: 0 auto;
  display: block;
  min-height: auto;
  grid-template-columns: none;
  background: none;
  overflow: visible;
}
header.hero::after { display: none; }
header.hero h1 {
  font-family: var(--serif);
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 16px;
  color: #F5F1EB;
}
.hero-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 16px;
}
.hero-desc {
  font-size: 16px;
  color: #7A8DA0;
  max-width: 680px;
  margin-bottom: 40px;
  line-height: 1.7;
}
.hero-stats {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}
.stat { text-align: left; }
.hero-stats .stat-num {
  font-family: var(--mono);
  font-size: 36px;
  font-weight: 500;
  color: var(--celadon);
  display: block;
  line-height: 1;
  letter-spacing: normal;
  margin-bottom: 0;
}
.hero-stats .stat-lbl {
  font-size: 13px;
  color: #7A8DA0;
  margin-top: 4px;
  font-weight: normal;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.6;
}
.section {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 24px 64px;
}
.section-title {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.section-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 12px;
}
.section-desc {
  font-size: 15px;
  color: var(--text-sec);
  max-width: 600px;
  line-height: 1.7;
  margin-bottom: 32px;
}
.section-heading {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 24px 0;
}
.section-heading h2 {
  font-family: var(--serif);
  font-size: 1.8rem;
  color: var(--navy);
  margin-bottom: 12px;
}
.section-heading p {
  font-size: 15px;
  color: var(--text-mid);
  line-height: 1.65;
}


/* ============ PUBLIKACJE: RESEARCH AREAS ============ */
.areas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 48px;
}
.area-card {
  background: rgba(19,30,42,1);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 24px;
  transition: border-color 0.2s;
}
.area-card:hover { border-color: rgba(74,191,173,0.25); }
.area-tag {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--celadon);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.area-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 8px;
}
.area-card p {
  font-size: 13px;
  color: #7A8DA0;
  line-height: 1.6;
}


/* ============ PUBLIKACJE: COLLABORATORS ============ */
.collabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 48px;
}
.collab {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(19,30,42,1);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 16px 20px;
}
.collab-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 500;
  flex-shrink: 0;
}
.collab-avatar.primary {
  background: rgba(201,169,110,0.1);
  color: #C9A96E;
  border: 1px solid rgba(201,169,110,0.2);
}
.collab-avatar.secondary {
  background: rgba(74,191,173,0.12);
  color: var(--celadon);
  border: 1px solid rgba(74,191,173,0.15);
}
.collab-name {
  font-size: 14px;
  font-weight: 500;
}
.collab-meta {
  font-size: 12px;
  color: #7A8DA0;
  margin-top: 2px;
}


/* ============ PUBLIKACJE: FILTERS ============ */
.filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 32px;
  position: sticky;
  top: 0;
  z-index: 10;
  background: #0F1923;
  padding: 12px 0;
}
.filter-btn {
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.06);
  background: transparent;
  color: #7A8DA0;
  cursor: pointer;
  transition: all 0.15s;
}
.filter-btn:hover {
  color: #F5F1EB;
  border-color: rgba(255,255,255,0.12);
}
.filter-btn.active {
  background: rgba(74,191,173,0.12);
  color: var(--celadon);
  border-color: rgba(74,191,173,0.25);
}


/* ============ PUBLIKACJE: PUBLICATION LIST ============ */
.year-group { margin-bottom: 40px; }
.year-label {
  font-family: var(--mono);
  font-size: 24px;
  font-weight: 500;
  color: #4E6175;
  margin-bottom: 16px;
  padding-left: 4px;
}
.pub {
  border-left: 2px solid rgba(255,255,255,0.06);
  padding: 16px 0 16px 20px;
  margin-bottom: 4px;
  transition: border-color 0.15s;
}
.pub:hover { border-left-color: var(--celadon); }
.pub-first-author {
  border-left-color: rgba(74,191,173,0.3);
}
.pub-first-author:hover { border-left-color: var(--celadon); }
.pub-journal {
  font-family: var(--mono);
  font-size: 11px;
  color: #4E6175;
  letter-spacing: 0.03em;
  margin-bottom: 6px;
}
.pub-type {
  display: inline-block;
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 8px;
  vertical-align: middle;
}
.pub-type-article { background: rgba(74,191,173,0.12); color: var(--celadon); }
.pub-type-technique { background: rgba(201,169,110,0.1); color: #C9A96E; }
.pub-type-review { background: rgba(156,39,176,0.15); color: #CE93D8; }
.pub-type-letter { background: rgba(255,255,255,0.05); color: #7A8DA0; }
.pub-type-chapter { background: rgba(255,152,0,0.12); color: #FFB74D; }
.pub-type-abstract { background: rgba(255,255,255,0.04); color: #4E6175; }
.pub-title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 6px;
}
.pub-title a {
  color: #F5F1EB;
  text-decoration: none;
  transition: color 0.15s;
}
.pub-title a:hover { color: var(--celadon); }
.pub-authors {
  font-size: 13px;
  color: #7A8DA0;
  line-height: 1.5;
  margin-bottom: 6px;
}
.pub-authors strong {
  color: var(--celadon);
  font-weight: 600;
}
.pub-authors .laprade {
  color: #C9A96E;
  font-weight: 500;
}
.pub-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.pub-tag {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 3px;
  text-decoration: none;
  transition: all 0.15s;
}
.pub-tag-joint {
  background: rgba(74,191,173,0.08);
  color: rgba(74,191,173,0.7);
  border: 1px solid rgba(74,191,173,0.1);
}
.pub-tag-joint:hover {
  background: rgba(74,191,173,0.12);
  color: var(--celadon);
}
.pub-crosslink {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--celadon);
  text-decoration: none;
  margin-top: 6px;
  opacity: 0.7;
  transition: opacity 0.15s;
}
.pub-crosslink:hover { opacity: 1; }
.rg-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 32px;
  margin-top: 40px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.rg-link a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  padding: 12px 24px;
  border-radius: 6px;
  text-decoration: none;
  background: transparent;
  color: var(--celadon);
  border: 1px solid rgba(74,191,173,0.25);
  transition: all 0.15s;
}
.rg-link a:hover { background: rgba(74,191,173,0.12); }


/* ============ CENNIK: LOCATION CARDS ============ */
.loc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin: 20px 0;
}
.loc-card {
  background: var(--cream-light);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 24px;
  transition: border-color 0.2s;
}
.loc-card:hover { border-color: var(--celadon); }
.loc-card h3 {
  font-family: var(--serif);
  font-size: 1.15rem;
  color: var(--navy);
  margin-bottom: 8px;
  font-weight: 600;
}
.loc-card p {
  font-size: 14px;
  color: var(--text-mid);
  margin-bottom: 4px;
  line-height: 1.5;
}
.loc-tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--celadon);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
  padding: 2px 8px;
  background: rgba(74,191,173,0.08);
  border-radius: 3px;
}
.tl-period {
  font-family: var(--mono);
  font-size: 13px;
  color: var(--celadon);
  font-weight: 500;
  min-width: 80px;
  flex-shrink: 0;
}
.tl-desc {
  font-size: 15px;
  color: var(--text-mid);
  line-height: 1.6;
}


/* ============ DLA-LEKARZY: STATS VARIANT ============ */
.st {
  padding: 36px 16px;
  text-align: center;
  border-right: 1px solid var(--border);
  transition: all 0.3s;
}
.st:last-child { border-right: none; }
.st:hover { background: var(--celadon-dim); }
.st-n {
  font-family: var(--mono);
  font-size: 38px;
  font-weight: 500;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 6px;
  letter-spacing: -2px;
}
.st-l {
  font-size: 9.5px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1.6px;
  font-weight: 600;
}


/* ============ DLA-LEKARZY: COLLAB HERO ============ */
.collab-hero {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 40px;
  align-items: start;
  margin-bottom: 0;
}
.collab-hero-text p {
  font-size: 15px;
  color: rgba(255,255,255,0.45);
  line-height: 1.8;
  margin-bottom: 14px;
}
.collab-hero-text p strong {
  color: rgba(255,255,255,0.7);
  font-weight: 600;
}
.collab-hero-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ch-stat {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 12px;
  padding: 24px 20px;
  text-align: center;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.ch-stat::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), transparent);
  opacity: 0;
  transition: opacity 0.35s;
}
.ch-stat:hover {
  border-color: rgba(184,149,106,0.25);
  background: rgba(184,149,106,0.04);
  transform: translateY(-2px);
}
.ch-stat:hover::after { opacity: 1; }
.ch-stat-n {
  font-family: var(--mono);
  font-size: 32px;
  font-weight: 500;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 6px;
  letter-spacing: -1px;
}
.ch-stat-l {
  font-size: 9.5px;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 1.4px;
  font-weight: 600;
}


/* ============ DLA-LEKARZY: COLLAB SECTIONS ============ */
.collab-section-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 14px;
  font-weight: 500;
}
.collab-section-label.intl { color: var(--gold); }
.collab-section-label.team { color: var(--celadon); }
.collab-ava {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 1px;
}
.collab-ava.primary {
  background: rgba(184,149,106,0.12);
  color: var(--gold);
  border: 1.5px solid rgba(184,149,106,0.25);
}
.collab-ava.secondary {
  background: rgba(74,191,173,0.08);
  color: var(--celadon);
  border: 1.5px solid var(--celadon-border);
}
.collab-pub-link {
  display: block;
  margin-top: 28px;
  text-align: center;
}
.collab-pub-link a {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--celadon);
  text-decoration: none;
  padding: 10px 24px;
  border: 1px solid var(--celadon-border);
  border-radius: 5px;
  transition: all 0.3s;
  display: inline-block;
}
.collab-pub-link a:hover {
  background: rgba(74,191,173,0.08);
  border-color: var(--celadon);
}


/* ============ DLA-LEKARZY: CASES GRID ============ */
.cases-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.case-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.case-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.case-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 32px rgba(74,191,173,0.08);
  transform: translateY(-2px);
}
.case-card:hover::after { opacity: 1; }
.case-card .joint {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 10px;
}
.case-card h3 {
  font-family: var(--serif);
  font-size: 19px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}
.case-card ul { list-style: none; padding: 0; margin: 0; }
.case-card ul li {
  font-size: 13px;
  color: var(--text-sec);
  line-height: 1.6;
  padding-left: 14px;
  position: relative;
  margin-bottom: 4px;
}
.case-card ul li::before {
  content: '';
  position: absolute;
  left: 0; top: 8px;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--celadon-border);
}


/* ============ DLA-LEKARZY: REFERRAL STEPS ============ */
.ref-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  counter-reset: step;
}
.ref-step {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px 24px;
  text-align: center;
  transition: all 0.35s;
  position: relative;
  counter-increment: step;
}
.ref-step::before {
  content: counter(step);
  font-family: var(--mono);
  font-size: 36px;
  font-weight: 500;
  color: rgba(74,191,173,0.12);
  line-height: 1;
  margin-bottom: 14px;
  display: block;
}
.ref-step:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 4px 20px rgba(74,191,173,0.06);
  transform: translateY(-2px);
}
.ref-step h3 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}
.ref-step p {
  font-size: 13px;
  color: var(--text-sec);
  line-height: 1.7;
}
.ref-step .ref-time {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--celadon);
  letter-spacing: 1.5px;
  margin-top: 12px;
  display: block;
}


/* ============ DLA-LEKARZY: OFFER GRID ============ */
.offer-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.offer-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 36px;
  transition: all 0.4s;
  position: relative;
  overflow: hidden;
}
.offer-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), transparent);
  opacity: 0;
  transition: opacity 0.4s;
}
.offer-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--gold);
  opacity: 0;
  transition: opacity 0.4s;
}
.offer-card:hover {
  border-color: rgba(184,149,106,0.25);
  background: rgba(184,149,106,0.03);
  transform: translateY(-3px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.2);
}
.offer-card:hover::before { opacity: 1; }
.offer-card:hover::after { opacity: 1; }
.offer-card .o-icon {
  font-family: var(--mono);
  font-size: 32px;
  color: rgba(184,149,106,0.18);
  margin-bottom: 16px;
  line-height: 1;
}
.offer-card h3 {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.3;
}
.offer-card p {
  font-size: 14px;
  color: rgba(255,255,255,0.4);
  line-height: 1.75;
  margin-bottom: 12px;
}
.offer-card p:last-child { margin-bottom: 0; }
.offer-card strong { color: rgba(255,255,255,0.7); font-weight: 600; }
.offer-card a {
  color: var(--gold);
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.3px;
  transition: color 0.2s;
}
.offer-card a:hover { color: #D4AD7A; }


/* ============ KONTAKT: HERO CENTER ============ */
/* Override homepage grid hero when centered hero is used */
.hero:has(.h-hero-center) {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
  grid-template-columns: none;
}
.hero:has(.h-hero-center)::after {
  top: 50%; left: 50%;
  right: auto;
  transform: translate(-50%,-50%);
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.06), transparent 70%);
}
.h-hero-center {
  max-width: 680px;
  text-align: center;
  position: relative;
  z-index: 2;
}
.h-hero-center .h-tag {
  display: inline-flex;
  justify-content: center;
}
.h-hero-center .h-tag::after {
  content: '';
  width: 30px;
  height: 1px;
  background: var(--celadon);
}
.hero:has(.h-hero-center) h1 {
  font-family: var(--serif);
  font-size: 44px;
  font-weight: 300;
  line-height: 1.15;
  margin-bottom: 24px;
  color: #fff;
}
.hero:has(.h-hero-center) .hero-sub {
  font-size: 15px;
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  line-height: 1.8;
  margin-bottom: 0;
  max-width: none;
}


/* ============ KONTAKT: LOCATIONS SECTION ============ */
.locs-section {
  padding: 80px 48px;
  background: var(--bg-cream);
}
.locs-section .sec-inner { max-width: 1200px; margin: 0 auto; }
.locs-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.locs-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.locs-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 40px;
  line-height: 1.2;
}
.locs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.locs-grid .loc-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.35s;
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0;
}
.locs-grid .loc-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 12px 36px rgba(74,191,173,0.12);
  transform: translateY(-4px);
}
.locs-grid .loc-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}
.loc-map {
  height: 140px;
  background: #f0ede8;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  font-size: 11px;
  border: 2px dashed var(--text-muted);
  margin: 20px;
  border-radius: 8px;
}
.loc-content {
  padding: 0 28px 28px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.loc-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 8px;
}
.loc-address {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 16px;
  flex: 1;
}
.loc-phone {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--celadon);
  letter-spacing: 0.5px;
}


/* ============ KONTAKT: FORM SECTION ============ */
.form-section {
  padding: 80px 48px;
  background: var(--bg-white);
}
.form-section .sec-inner { max-width: 1200px; margin: 0 auto; }
.form-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.form-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.form-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 40px;
  line-height: 1.2;
}
.form-wrapper {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 48px;
}
.form-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.form-field {
  display: flex;
  flex-direction: column;
}
.form-field label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 8px;
}
.form-field input,
.form-field select,
.form-field textarea {
  font-family: var(--sans);
  font-size: 14px;
  color: var(--text);
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
  transition: all 0.25s;
  background: var(--bg-white);
  outline: none;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--celadon);
  box-shadow: 0 0 0 2px rgba(74,191,173,0.1);
  background: rgba(74,191,173,0.01);
}
.form-field textarea {
  resize: vertical;
  min-height: 100px;
  font-family: var(--sans);
}
.form-submit {
  background: var(--celadon);
  color: var(--navy-deep);
  border: none;
  padding: 14px 28px;
  border-radius: 6px;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s;
  align-self: flex-start;
}
.form-submit:hover {
  background: var(--celadon-light);
  box-shadow: 0 8px 28px rgba(74,191,173,0.25);
  transform: translateY(-2px);
}
.form-sidebar {
  background: var(--bg-cream);
  border-radius: 12px;
  padding: 32px;
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.form-sidebar::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
}
.form-sidebar h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 20px;
  line-height: 1.3;
}
.consult-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: step;
}
.consult-steps li {
  font-size: 13.5px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 14px;
  position: relative;
  padding-left: 28px;
}
.consult-steps li::before {
  content: counter(step);
  counter-increment: step;
  position: absolute;
  left: 0; top: 2px;
  width: 18px; height: 18px;
  background: var(--celadon);
  color: var(--navy-deep);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 10px;
  border-radius: 50%;
}
.consult-steps li strong {
  color: var(--navy);
  font-weight: 600;
  display: block;
  margin-bottom: 2px;
}
.consult-duration {
  font-size: 13px;
  color: var(--text);
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}
.consult-duration strong { font-weight: 600; }
.consult-time {
  font-family: var(--mono);
  font-weight: 500;
  color: var(--celadon);
}


/* ============ KONTAKT: BEFORE VISIT ============ */
.before-section {
  padding: 80px 48px;
  background: var(--bg-cream);
}
.before-section .sec-inner { max-width: 1200px; margin: 0 auto; }
.before-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.before-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--celadon);
}
.before-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 40px;
  line-height: 1.2;
}
.before-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.before-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 32px;
  transition: all 0.35s;
  position: relative;
  overflow: hidden;
}
.before-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.35s;
}
.before-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 32px rgba(74,191,173,0.08);
  transform: translateY(-2px);
}
.before-card:hover::after { opacity: 1; }
.before-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 14px;
  line-height: 1.3;
}
.before-card p {
  font-size: 13.5px;
  color: var(--text-sec);
  line-height: 1.75;
  margin: 0;
}
.before-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.before-list li {
  font-size: 13.5px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 8px;
  padding-left: 20px;
  position: relative;
}
.before-list li::before {
  content: '\203A';
  position: absolute;
  left: 4px;
  color: var(--celadon);
  font-weight: 700;
  font-size: 14px;
}
.before-list li:last-child { margin-bottom: 0; }


/* ============ KONTAKT: B2B SECTION ============ */
.b2b-section {
  padding: 80px 48px;
  background: var(--navy-deep);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.b2b-section::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(184,149,106,0.04), transparent 70%);
  pointer-events: none;
}
.b2b-section .sec-inner {
  max-width: 820px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  text-align: center;
}
.b2b-tag {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.b2b-tag::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--gold);
}
.b2b-tag::after {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--gold);
}
.b2b-section h2 {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.2;
}
.b2b-section p {
  font-size: 15px;
  color: rgba(255,255,255,0.5);
  line-height: 1.8;
  margin-bottom: 24px;
}
.b2b-email {
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 500;
  color: var(--gold);
  letter-spacing: 0.5px;
  margin-bottom: 16px;
}
.b2b-link {
  display: inline-block;
  color: var(--celadon);
  text-decoration: none;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  padding: 9px 18px;
  border: 1px solid var(--celadon-border);
  border-radius: 4px;
  transition: all 0.25s;
}
.b2b-link:hover {
  background: rgba(74,191,173,0.08);
  border-color: var(--celadon);
}


/* ============ DLA-LEKARZY: HERO ANCHORS ============ */
.hero-anchors {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.hero-anchors a {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  text-decoration: none;
  padding: 9px 18px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 5px;
  transition: all 0.25s;
  backdrop-filter: blur(4px);
  background: rgba(255,255,255,0.02);
}
.hero-anchors a:hover {
  border-color: rgba(184,149,106,0.25);
  color: var(--gold);
  background: rgba(184,149,106,0.06);
  transform: translateY(-1px);
}


/* ============ HUB PAGES: HUB HERO ============ */
.hub-hero {
  padding-top: 60px;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--navy-deep);
  color: #fff;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.hub-hero::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(74,191,173,0.06), transparent 70%);
  pointer-events: none;
}
.hub-hero-inner {
  max-width: 700px;
  position: relative;
  z-index: 2;
  padding: 60px 24px 48px;
}
.hub-hero-inner .tag {
  justify-content: center;
}
.hub-hero-inner .subtitle {
  font-size: 12px;
  color: var(--celadon);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 8px;
  font-weight: 600;
}
.hub-hero-inner h1 {
  font-family: var(--serif);
  font-size: 3rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 16px;
  line-height: 1.15;
}
.hub-hero-inner .lead {
  font-size: 16px;
  color: rgba(255,255,255,0.5);
  line-height: 1.7;
  max-width: 600px;
  margin: 0 auto;
}


/* ============ HUB PAGES: CONDITIONS GRID ============ */
.conditions {
  max-width: 900px;
  margin: 0 auto;
  padding: 48px 24px;
}
.conditions h2 {
  font-family: var(--serif);
  font-size: 1.8rem;
  color: var(--navy);
  margin-bottom: 12px;
}
.conditions .subtitle {
  font-size: 15px;
  color: var(--text-mid);
  margin-bottom: 32px;
  line-height: 1.65;
}
.conditions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  max-width: 900px;
  margin: 32px auto 0;
  padding: 0 24px;
}
.condition-card,
.cond-card {
  background: var(--bg-white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 28px;
  text-decoration: none;
  color: var(--text);
  transition: all 0.3s;
  display: flex;
  flex-direction: column;
}
.condition-card:hover,
.cond-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  transform: translateY(-3px);
  color: var(--text);
}
.cond-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}
.card-tag {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 8px;
}
.card-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.card-tags .card-tag {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.5px;
  padding: 2px 8px;
  background: var(--celadon-dim);
  border-radius: 3px;
  margin-bottom: 0;
}
.card-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-icon svg {
  width: 24px;
  height: 24px;
}
.card-desc {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.65;
  margin-bottom: 12px;
  flex: 1;
}
.card-arrow,
.card-link {
  font-size: 12px;
  font-weight: 600;
  color: var(--celadon);
  letter-spacing: 0.5px;
  margin-top: auto;
  padding-top: 8px;
}
.card-link .arrow { transition: margin-left 0.2s; }
.condition-card h3,
.cond-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}
.condition-card p,
.cond-card p {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.65;
  margin-bottom: 0;
}


/* ============ HUB PAGES: CROSS-SELL ============ */
.cross-sell {
  background: var(--bg-cream);
  padding: 56px 24px;
}
.cross-sell-inner {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 40px;
  align-items: center;
}
.cross-sell-text h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--navy);
  margin-bottom: 16px;
  line-height: 1.25;
}
.cross-sell-text p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 16px;
}
.cross-sell-text .link,
.cross-sell-text .cs-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.cross-sell-icon,
.cross-sell-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}
.cross-sell-icon svg {
  width: 80px;
  height: 80px;
  fill: none;
  stroke: var(--celadon);
  stroke-width: 1;
  opacity: 0.3;
}
.icon-text {
  font-family: var(--mono);
  font-size: 48px;
  font-weight: 500;
  color: var(--celadon);
  opacity: 0.2;
}
.cs-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.cs-features {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.cs-feature {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.cs-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--celadon);
  margin-top: 6px;
  flex-shrink: 0;
}
.cs-text {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.6;
}
.cs-text strong {
  color: var(--navy);
  font-weight: 600;
}


/* ============ HUB PAGES: WHY SURGEON / WHY DOC ============ */
.why-surgeon {
  max-width: 900px;
  margin: 0 auto;
  padding: 48px 24px;
}
.why-surgeon h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--navy);
  margin-bottom: 16px;
  line-height: 1.25;
}
.why-surgeon p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 16px;
}
.why-surgeon .link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.why-surgeon-inner {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: start;
}
.why-surgeon-stats,
.why-doc-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 24px 0;
}
.why-stat,
.why-doc-stat {
  text-align: center;
  padding: 16px 12px;
  background: var(--cream-light);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.why-stat .num,
.why-doc-stat .num {
  font-family: var(--mono);
  font-size: 24px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 4px;
}
.why-stat .label,
.why-doc-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.why-icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.why-icon svg {
  width: 32px;
  height: 32px;
  fill: none;
  stroke: var(--celadon);
  stroke-width: 1.5;
}
.why-text h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--navy);
  margin-bottom: 12px;
}
.why-text p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 16px;
}
.why-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.why-doc {
  max-width: 900px;
  margin: 0 auto;
  padding: 48px 24px;
}
.why-doc h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--navy);
  margin-bottom: 16px;
  line-height: 1.25;
}
.why-doc p {
  font-size: 15px;
  color: var(--text-sec);
  line-height: 1.75;
  margin-bottom: 16px;
}
.why-doc .link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 32px 0;
}
.why-item {
  padding: 24px;
  background: var(--cream-light);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.why-num {
  font-family: var(--mono);
  font-size: 20px;
  font-weight: 500;
  color: var(--celadon);
  margin-bottom: 8px;
  opacity: 0.3;
}
.why-item h4 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy);
  margin-bottom: 8px;
}
.why-item p {
  font-size: 14px;
  color: var(--text-sec);
  line-height: 1.65;
  margin: 0;
}
.ws-link {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
  margin-top: 16px;
}


/* ============ HUB PAGES: CTA BUTTONS ============ */
.cta-btns,
.cta-buttons {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 16px;
  position: relative;
  z-index: 2;
}
.cta-primary,
.cta-btn.primary {
  display: inline-block;
  background: var(--celadon);
  color: var(--navy-deep);
  padding: 14px 32px;
  border-radius: 5px;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.3s;
}
.cta-primary:hover,
.cta-btn.primary:hover {
  background: var(--celadon-light);
  color: var(--navy-deep);
  box-shadow: 0 8px 28px rgba(74,191,173,0.25);
  transform: translateY(-2px);
}
.cta-secondary,
.cta-btn.secondary {
  display: inline-block;
  color: rgba(255,255,255,0.5);
  padding: 14px 32px;
  border-radius: 5px;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.1);
  transition: all 0.3s;
}
.cta-secondary:hover,
.cta-btn.secondary:hover {
  color: rgba(255,255,255,0.8);
  border-color: rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.03);
}


/* ============ MISC: .slot, .btn, .link, etc. ============ */
.slot {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 11px;
  color: rgba(255,255,255,0.2);
  text-align: center;
  padding: 20px;
}
.btn {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 5px;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.3s;
}
.link {
  font-size: 13px;
  font-weight: 600;
  color: var(--celadon);
  text-decoration: none;
}
.link:hover { color: var(--celadon-light); }
.bib-item {
  font-size: 13.5px;
  color: var(--text-mid);
  margin-bottom: 10px;
  line-height: 1.6;
}


/* ============ RESPONSIVE -- DESKTOP/TABLET (max-width: 1024px) ============ */
@media (max-width: 1024px) {
  /* Homepage */
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .h-content { padding: 96px 36px 56px; }
  .h-photo { min-height: 360px; }
  .dual-paths { flex-direction: column; }
  .stats { grid-template-columns: repeat(2, 1fr); padding: 36px; }
  .s-philosophy,
  .s-creds,
  .s-athletes { grid-template-columns: 1fr; padding: 64px 36px; }
  .joints-grid { grid-template-columns: repeat(2, 1fr); }
  .s-joints { padding: 64px 36px; }
  .cards-grid { grid-template-columns: 1fr; }
  .tech-grid { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid { grid-template-columns: 1fr; }
  .creds-orgs { grid-template-columns: 1fr; }
  .s-safety,
  .s-research,
  .s-reviews { padding: 64px 36px; }
  .cta-strip { padding: 64px 36px; }

  /* Appended sections */
  .bio-section { grid-template-columns: 1fr; padding: 64px 36px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .gallery-item.large { grid-row: auto; }
  .subpages-grid { grid-template-columns: repeat(2, 1fr); }
  .collab-hero { grid-template-columns: 1fr; gap: 24px; }
  .cases-grid { grid-template-columns: 1fr; }
  .ref-steps { grid-template-columns: 1fr 1fr; }
  .offer-grid { grid-template-columns: 1fr; }
  .locs-grid { grid-template-columns: 1fr; }
  .form-wrapper { grid-template-columns: 1fr; gap: 32px; }
  .before-grid { grid-template-columns: 1fr; }
  .cross-sell-inner { grid-template-columns: 1fr; }
  .why-surgeon-inner { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .competency-grid { grid-template-columns: 1fr; }
  .collabs { grid-template-columns: 1fr; }
  .conditions-grid { padding: 0; }
}

.bib-item strong { color: var(--text); font-weight: 600; }
.timezone-desc {
  font-size: 14px;
  color: var(--text-mid);
  line-height: 1.65;
}


/* ============ RESPONSIVE -- MOBILE (max-width: 768px) ============ */
@media (max-width: 768px) {
  /* Nav */
  nav { padding: 0 20px; height: 54px; }

  /* Mobile hamburger */
  .n-burger { display: block; z-index: 101; }
  .n-burger.open span:nth-child(1) { top: 17px; transform: rotate(45deg); }
  .n-burger.open span:nth-child(2) { opacity: 0; }
  .n-burger.open span:nth-child(3) { top: 17px; transform: rotate(-45deg); }
  .n-links {
    display: none;
    position: fixed;
    top: 54px; left: 0; width: 100vw; height: calc(100vh - 54px); height: calc(100dvh - 54px);
    background-color: #0F1923;
    flex-direction: column;
    padding: 20px; gap: 0;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    z-index: 99999;
  }
  .n-links.open { display: flex; }
  .n-links > a,
  .n-links > .n-dropdown {
    height: auto; display: block;
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }
  .n-links > a {
    padding: 14px 0; font-size: 12px; color: rgba(255,255,255,0.6);
  }
  .n-links > a.n-cta {
    display: block; text-align: center; margin-top: 12px; padding: 16px;
    border-bottom: none; border-radius: 6px; width: 100%;
  }
  .n-dropdown > a {
    padding: 14px 0; display: block; font-size: 12px;
    color: rgba(255,255,255,0.6);
  }
  .n-dropdown > a::after { float: right; font-size: 10px; }
  .n-dropdown::before { display: none; }
  .n-dropdown:hover .n-dropdown-menu { display: none; }
  .n-dropdown-menu {
    position: static; background: transparent; border: none;
    box-shadow: none; margin: 0; padding: 0 0 8px 16px;
    min-width: auto; z-index: auto; display: none;
  }
  .n-dropdown.open .n-dropdown-menu { display: block; }
  .n-dropdown-menu a {
    padding: 12px 16px; font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    min-height: 44px; display: flex; align-items: center;
    justify-content: center; text-align: center;
  }
  .n-dropdown-menu a:last-child { border-bottom: none; }

  /* Homepage hero */
  .hero {
    grid-template-columns: 1fr;
    min-height: auto;
    max-height: none;
  }
  .h-content { padding: 80px 20px 32px; order: 1; }
  .h-photo {
    order: 2; min-height: 300px; padding: 16px;
  }
  .h-photo img { border-radius: 8px; max-height: 350px; }
  .hero h1 { font-size: 28px; }
  .hero-sub { font-size: 13px; }
  .dual-paths { flex-direction: column; gap: 10px; }
  .hero-creds { flex-wrap: wrap; gap: 16px; }

  /* Homepage stats */
  .stats { grid-template-columns: repeat(2, 1fr); padding: 24px 20px; gap: 16px; }
  .stat-number { font-size: 24px; }

  /* Homepage tech grid */
  .tech-grid { grid-template-columns: 1fr; }

  /* Homepage footer */
  footer {
    padding: 20px 24px; flex-direction: column; text-align: center;
    align-items: center; gap: 8px;
  }
  footer div {
    flex-wrap: wrap; justify-content: center;
  }

  /* Subpage layouts */
  .page-hero h1 { font-size: 1.8rem; }
  .page-hero { padding: 24px 16px 0; }
  .content,
  .faq,
  .related,
  .bibliography { padding-left: 16px; padding-right: 16px; }
  .answer-first,
  .info-box,
  .quiet-note,
  .quote-block,
  .comparison,
  .timeline { margin-left: 16px; margin-right: 16px; }
  .related-grid { grid-template-columns: 1fr; }
  .breadcrumb { padding: 12px 16px; }
  .key-stats {
    margin-left: 16px; margin-right: 16px;
    grid-template-columns: 1fr;
  }


  /* --- Joint hubs grid --- */
  .joints-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  /* --- Homepage sections: single column on mobile --- */
  .s-philosophy, .s-creds, .s-athletes {
    grid-template-columns: 1fr;
    padding: 48px 20px;
    gap: 32px;
  }
  .athlete-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .s-philosophy .photo-slot {
    min-height: 280px;
  }
  .s-safety, .s-research, .s-reviews {
    padding: 48px 20px;
  }
  .s-joints { padding: 48px 20px; }
  .cards-grid, .tech-grid, .joints-grid, .reviews-grid, .creds-orgs {
    grid-template-columns: 1fr;
  }
  .cta-strip { padding: 48px 20px; }

  /* --- Reviews --- */
  .reviews-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .review-card.full {
    grid-column: auto;
  }

  /* --- CTA strip --- */
  .cta-strip h2 {
    font-size: 26px;
  }
  .cta-locs {
    font-size: 10px;
    letter-spacing: 1.5px;
  }

  /* --- Tables: horizontal scroll --- */
  .content-table,
  .comparison {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .content-table table,
  .comparison table {
    min-width: 480px;
  }

  /* --- FAQ: proper touch targets --- */
  .faq-q {
    min-height: 44px;
    padding: 14px 16px;
    font-size: 14px;
  }
  .faq-a {
    padding: 0 16px 14px;
    font-size: 14px;
  }

  /* --- Subpage hero: smaller on mobile --- */
  .page-hero .subtitle {
    font-size: 13px;
  }
  .page-hero .lead {
    font-size: 0.95rem;
  }

  /* --- Kontakt: form sidebar full-width --- */
  .form-submit {
    align-self: stretch;
    text-align: center;
  }

  /* --- Bio section --- */
  .bio-section {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 48px 24px;
  }
  .bio-sidebar {
    position: static;
  }
  .bio-main h2 {
    font-size: 28px;
  }

  /* --- Values section --- */
  .values-section {
    padding: 48px 24px;
  }
  .values-section h2 {
    font-size: 28px;
  }

  /* --- Gallery section --- */
  .gallery-section h2 {
    font-size: 28px;
  }

  /* --- Memberships --- */
  .memberships-section h2 {
    font-size: 28px;
  }
  .memberships-grid {
    gap: 10px;
  }
  .membership-badge {
    padding: 12px 16px;
    font-size: 12px;
  }

  /* --- Subpages grid --- */
  .subpages-section h2 {
    font-size: 28px;
  }

  /* --- Stats bar (habilitacja) --- */
  .stat-num {
    font-size: 24px;
  }

  /* --- Collab section --- */
  .collab-card {
    padding: 28px;
    gap: 20px;
    grid-template-columns: 1fr;
    text-align: center;
  }
  .collab-photo {
    width: 80px;
    height: 80px;
  }

  /* --- Dla-lekarzy stats --- */
  .st-n {
    font-size: 28px;
  }

  /* --- Kontakt hero center --- */
  .h-hero-center {
    padding: 0 16px;
  }

  /* --- CTA buttons: full-width on mobile --- */
  .cta-btns,
  .cta-buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .cta-primary,
  .cta-btn.primary,
  .cta-secondary,
  .cta-btn.secondary {
    text-align: center;
    width: 100%;
  }

  /* --- DLA-LEKARZY: collab hero stats --- */
  .collab-hero-stats {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .ch-stat-n {
    font-size: 24px;
  }

  /* --- Pub card / Monograph / Matters --- */
  .pub-card {
    padding: 24px;
  }
  .monograph-card {
    padding: 24px;
  }
  .matters-item {
    padding: 20px 22px;
  }

  /* --- Hero anchors --- */
  .hero-anchors a {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  /* --- Filozofia --- */
  .quote-strip { padding: 48px 24px; }
  .quote-inner blockquote { font-size: 22px; }
  .sec { padding: 56px 24px; }
  .sec h2 { font-size: 26px; }
  .origin-timeline { padding-left: 36px; }
  .origin-step::before { left: -28px; }
  .qual-grid { grid-template-columns: 1fr; gap: 28px; }
  .practice-cards { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: 1fr; }
  .v-featured { grid-column: auto; }

  /* --- O-mnie --- */
  .gallery-section { padding: 48px 24px; }
  .gallery-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .gallery-item.large { grid-row: auto; }
  .collab-section { padding: 48px 24px; }
  .memberships-section { padding: 48px 24px; }
  .subpages-section { padding: 48px 24px; }
  .subpages-grid { grid-template-columns: 1fr; }

  /* --- Habilitacja / Staze --- */
  .stats-bar { grid-template-columns: repeat(2, 1fr); gap: 24px; padding: 40px 24px; }
  .metrics-grid, .metrics-grid-2col { grid-template-columns: 1fr; }
  .timeline-section { padding: 56px 24px; }
  .timeline-section h2 { font-size: 26px; }
  .timeline-vertical { padding-left: 36px; }
  .timeline-step::before { left: -28px; }
  .competencies-section { padding: 56px 24px; }
  .competencies-section h2 { font-size: 26px; }
  .related-section { padding: 56px 24px; }

  /* --- Dla-lekarzy --- */
  .collab-hero { grid-template-columns: 1fr; gap: 24px; }
  .cases-grid { grid-template-columns: 1fr; }
  .ref-steps { grid-template-columns: 1fr; }
  .offer-grid { grid-template-columns: 1fr; }
  .hero-anchors { flex-direction: column; gap: 8px; }

  /* --- Kontakt --- */
  .hero:has(.h-hero-center) { min-height: 340px; padding: 40px 24px; }
  .hero:has(.h-hero-center) h1 { font-size: 30px; }
  .hero:has(.h-hero-center) .hero-sub { font-size: 14px; }
  .locs-section, .form-section, .before-section { padding: 56px 24px; }
  .locs-section h2, .form-section h2, .before-section h2 { font-size: 26px; margin-bottom: 32px; }
  .locs-grid { grid-template-columns: 1fr; }
  .form-wrapper { grid-template-columns: 1fr; gap: 32px; }
  .before-grid { grid-template-columns: 1fr; }
  .b2b-section { padding: 56px 24px; }
  .b2b-section h2 { font-size: 26px; }

  /* --- Hub pages --- */
  .hub-hero { min-height: 260px; }
  .hub-hero-inner { padding: 48px 20px 36px; }
  .hub-hero-inner h1 { font-size: 2rem; }
  .conditions { padding: 32px 16px; }
  .conditions-grid { grid-template-columns: 1fr; padding: 0 16px; }
  .cond-grid { grid-template-columns: 1fr; }
  .cross-sell { padding: 40px 16px; }
  .cross-sell-inner { grid-template-columns: 1fr; gap: 24px; }
  .why-surgeon { padding: 32px 16px; }
  .why-surgeon-inner { grid-template-columns: 1fr; }
  .why-surgeon-stats, .why-doc-stats { grid-template-columns: 1fr; }
  .why-doc { padding: 32px 16px; }
  .why-grid { grid-template-columns: 1fr; }
  .section-heading { padding: 32px 16px 0; }

  /* --- Publikacje --- */
  header.hero { padding: 80px 20px 40px; }
  .hero-stats { gap: 24px; }
  .hero-stats .stat-num { font-size: 28px; }
  .section { padding: 0 20px 48px; }
  .areas-grid { grid-template-columns: 1fr; }
  .collabs { grid-template-columns: 1fr; }
  .filters { gap: 6px; }
  .filter-btn { font-size: 12px; padding: 6px 12px; }
}


/* ============ RESPONSIVE -- EXTRA SMALL (max-width: 480px) ============ */
@media (max-width: 480px) {
  .hero:has(.h-hero-center) h1 { font-size: 24px; }
  .hero:has(.h-hero-center) .hero-sub { font-size: 13px; }
}


/* ============ RESPONSIVE: EXTRA-SMALL SCREENS (max-width: 360px) ============ */
@media (max-width: 360px) {

  /* --- Nav at 290px --- */
  nav {
    padding: 0 12px;
    height: 50px;
  }
  .n-brand {
    gap: 8px;
    max-width: calc(100% - 50px);
    overflow: hidden;
  }
  .n-logo {
    width: 30px;
    height: 30px;
    font-size: 11px;
    flex-shrink: 0;
  }
  .n-name {
    font-size: 9px;
    letter-spacing: 1.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .n-name span {
    display: none;
  }
  .n-burger {
    padding: 6px;
  }
  .n-burger span {
    width: 18px;
    height: 1.5px;
    margin: 3px 0;
  }
  .n-links {
    top: 50px;
    padding: 16px 12px;
    gap: 12px;
  }
  .n-links a {
    font-size: 11px;
    padding: 8px 0;
  }
  .n-links > a.n-cta {
    padding: 12px 16px;
    font-size: 10px !important;
  }
  .n-dropdown-menu {
    padding-left: 8px;
  }
  .n-dropdown-menu a {
    padding: 10px 12px;
    font-size: 10px;
  }

  /* --- Homepage hero at 290px: single column, photo below --- */
  html {
    scroll-padding-top: 50px;
  }
  .hero {
    padding-top: 50px;
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .h-content {
    padding: 24px 12px 20px;
    order: 1;
  }
  .h-tag {
    font-size: 8px;
    letter-spacing: 2px;
    margin-bottom: 10px;
    gap: 6px;
  }
  .h-tag::before {
    width: 20px;
  }
  .hero h1 {
    font-size: 22px;
    margin-bottom: 10px;
    line-height: 1.2;
  }
  .hero-sub {
    font-size: 12px;
    line-height: 1.7;
    margin-bottom: 16px;
  }

  /* --- Dual-path CTAs stack vertically --- */
  .dual-paths {
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
  }
  .dual-path {
    padding: 10px 12px;
    gap: 10px;
  }
  .dp-icon {
    width: 30px;
    height: 30px;
    font-size: 12px;
  }
  .dp-label {
    font-size: 8px;
    letter-spacing: 1px;
  }
  .dp-text {
    font-size: 11px;
  }

  /* --- Hero credentials --- */
  .hero-creds {
    flex-direction: column;
    gap: 8px;
  }
  .hero-cred {
    font-size: 9px;
  }
  .hero-cred strong {
    font-size: 10px;
  }

  /* --- Hero photo below content --- */
  .h-photo {
    order: 2;
    min-height: 220px;
    padding: 16px 12px;
  }
  .h-photo img {
    max-height: 300px;
    border-radius: 8px;
  }

  /* --- Stats bar at 290px: 2x2 grid --- */
  .stats {
    grid-template-columns: repeat(2, 1fr);
    padding: 20px 12px;
    gap: 16px;
  }
  .stat-number {
    font-size: 20px;
    letter-spacing: -0.5px;
  }
  .stat-label {
    font-size: 8px;
    letter-spacing: 1.5px;
  }

  /* --- Philosophy / AWE section --- */
  .s-philosophy {
    padding: 40px 12px;
    gap: 24px;
  }
  .s-philosophy h2 {
    font-size: 22px;
  }
  .s-philosophy p {
    font-size: 12px;
  }
  .s-philosophy blockquote {
    font-size: 17px;
    padding-left: 14px;
  }
  .s-philosophy .photo-slot {
    min-height: 220px;
  }

  /* --- Safety cards at 290px: single column --- */
  .s-safety {
    padding: 40px 12px;
  }
  .s-safety h2 {
    font-size: 22px;
    margin-bottom: 28px;
  }
  .cards-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .s-card {
    padding: 20px 16px;
  }
  .s-card h3 {
    font-size: 17px;
  }
  .s-card p {
    font-size: 12px;
  }

  /* --- Tech cards at 290px: single column --- */
  .s-research {
    padding: 40px 12px;
  }
  .s-research h2 {
    font-size: 22px;
  }
  .s-research .section-sub {
    font-size: 12px;
    margin-bottom: 32px;
  }
  .tech-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .tech-card {
    padding: 20px 16px;
  }
  .tech-card h3 {
    font-size: 16px;
  }
  .tech-card p {
    font-size: 11px;
  }

  /* --- Reviews at 290px: single column --- */
  .s-reviews {
    padding: 40px 12px;
  }
  .s-reviews h2 {
    font-size: 22px;
    margin-bottom: 28px;
  }
  .reviews-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .review-card {
    padding: 20px 16px;
  }
  .review-text {
    font-size: 14px;
  }
  .review-stars {
    font-size: 10px;
  }
  .review-author {
    font-size: 10px;
  }

  /* --- Credentials at 290px: single column --- */
  .s-creds {
    padding: 40px 12px;
    gap: 24px;
  }
  .s-creds h2 {
    font-size: 22px;
  }
  .s-creds p {
    font-size: 12px;
  }
  .creds-orgs {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .org-badge {
    padding: 16px 14px;
  }
  .org-badge .ob-name {
    font-size: 10px;
  }
  .org-badge .ob-desc {
    font-size: 9px;
  }
  .cred-item {
    font-size: 12px;
    gap: 8px;
  }
  .cred-icon {
    width: 24px;
    height: 24px;
    font-size: 10px;
  }

  /* --- Joint hubs grid at 290px: single column --- */
  .s-joints {
    padding: 40px 12px;
  }
  .s-joints h2 {
    font-size: 22px;
    margin-bottom: 28px;
  }
  .joints-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .joint-card {
    padding: 20px 16px;
  }
  .joint-icon {
    font-size: 22px;
    margin-bottom: 10px;
  }
  .joint-card h3 {
    font-size: 18px;
  }
  .joint-card p {
    font-size: 11px;
  }

  /* --- Athletes at 290px: single column --- */
  .s-athletes {
    padding: 40px 12px;
    gap: 24px;
  }
  .s-athletes h2 {
    font-size: 22px;
  }
  .s-athletes p {
    font-size: 12px;
  }
  .athlete-stats {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .athlete-stat .as-num {
    font-size: 16px;
  }
  .athlete-stat .as-label {
    font-size: 8px;
  }
  .s-athletes .photo-slot {
    min-height: 220px;
  }

  /* --- CTA strip at 290px --- */
  .cta-strip {
    padding: 40px 12px;
  }
  .cta-strip h2 {
    font-size: 22px;
  }
  .cta-strip p {
    font-size: 13px;
  }
  .cta-strip .cta-btn {
    padding: 14px 24px;
    font-size: 10px;
    display: block;
    text-align: center;
  }
  .cta-locs {
    font-size: 9px;
    letter-spacing: 1px;
  }
  body.subpage .cta-strip {
    padding: 32px 12px;
    margin-top: 32px;
  }
  body.subpage .cta-strip h2 {
    font-size: 1.4rem;
  }

  /* --- Footer at 290px: stack, center --- */
  footer {
    padding: 16px 12px;
    flex-direction: column;
    text-align: center;
    gap: 6px;
  }
  footer div {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }
  footer a {
    font-size: 9px;
  }

  /* --- Breadcrumb --- */
  .breadcrumb {
    font-size: 11px;
    padding: 10px 12px;
    padding-top: 60px;
  }

  /* --- Page hero (subpage) --- */
  .page-hero {
    padding: 20px 12px 0;
  }
  .page-hero h1 {
    font-size: 1.5rem;
  }
  .page-hero .subtitle {
    font-size: 11px;
    letter-spacing: 0.8px;
  }
  .page-hero .lead {
    font-size: 0.9rem;
  }

  /* --- Answer-first box --- */
  .answer-first {
    margin: 16px 12px;
    padding: 16px 14px;
    font-size: 14px;
  }

  /* --- Content (subpage) at 290px --- */
  .content {
    padding: 16px 12px 32px;
  }
  .content h2 {
    font-size: 1.4rem;
    margin: 28px 0 12px;
  }
  .content h3 {
    font-size: 1.1rem;
    margin: 20px 0 10px;
  }
  .content p {
    font-size: 14px;
  }
  .content li {
    font-size: 14px;
  }
  .content ul,
  .content ol {
    margin-left: 16px;
  }

  /* --- Tables: horizontal scroll at 290px --- */
  .content-table {
    margin: 16px -12px;
    padding: 0 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .content-table table {
    min-width: 420px;
  }
  .content-table th,
  .content-table td {
    padding: 8px 10px;
    font-size: 12px;
  }
  .comparison {
    margin-left: 12px;
    margin-right: 12px;
    padding: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .comparison table {
    min-width: 420px;
  }
  .comparison th,
  .comparison td {
    padding: 8px 10px;
    font-size: 12px;
  }

  /* --- Key stats (subpage) --- */
  .key-stats {
    margin-left: 12px;
    margin-right: 12px;
    grid-template-columns: 1fr;
  }
  .key-stat .num {
    font-size: 1.5rem;
  }
  .key-stat .label {
    font-size: 11px;
  }

  /* --- Info box / quiet note / quote block --- */
  .info-box {
    margin: 16px 12px;
    padding: 16px;
  }
  .info-box h3 {
    font-size: 1rem;
  }
  .info-box p {
    font-size: 13px;
  }
  .quiet-note {
    margin: 16px 12px;
    padding: 14px 12px;
    font-size: 13px;
  }
  .quiet-note p {
    font-size: 13px;
  }
  .quote-block {
    margin: 20px 12px;
    padding: 14px 16px;
  }
  .quote-block p {
    font-size: 1rem;
  }

  /* --- FAQ at 290px: proper touch targets --- */
  .faq {
    padding: 0 12px;
    margin: 24px auto;
  }
  .faq h2 {
    font-size: 1.4rem;
  }
  .faq-q {
    padding: 12px 12px;
    font-size: 13px;
    min-height: 48px;
    gap: 8px;
  }
  .faq-q::after {
    font-size: 18px;
    flex-shrink: 0;
    min-width: 24px;
    text-align: center;
  }
  .faq-a {
    padding: 0 12px 12px;
    font-size: 13px;
  }

  /* --- Related cards --- */
  .related {
    padding: 0 12px;
    margin: 24px auto;
  }
  .related h2 {
    font-size: 1.4rem;
  }
  .related-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .related-card {
    padding: 16px;
  }
  .related-card p {
    font-size: 13px;
  }

  /* --- Timeline (subpage) --- */
  .timeline {
    margin: 16px auto;
    padding: 0 12px;
  }
  .timeline-item {
    flex-direction: column;
    gap: 4px;
    padding: 12px 0;
  }
  .timeline-period {
    min-width: auto;
    font-size: 12px;
  }
  .timeline-desc {
    font-size: 13px;
  }

  /* --- Bibliography --- */
  .bibliography {
    padding: 0 12px;
  }
  .bibliography h2 {
    font-size: 1.4rem;
  }
  .bibliography li {
    font-size: 12px;
  }

  /* --- Section separator --- */
  .section-sep {
    margin: 28px auto;
  }

  /* ============================================================
     FILOZOFIA SECTIONS AT 290px
     ============================================================ */

  /* --- Quote strip --- */
  .quote-strip {
    padding: 32px 12px;
  }
  .quote-inner blockquote {
    font-size: 18px;
  }
  .quote-inner .quote-src {
    font-size: 11px;
  }

  /* --- General sections --- */
  .sec {
    padding: 40px 12px;
  }
  .sec h2 {
    font-size: 22px;
  }
  .sec .intro {
    font-size: 13px;
  }

  /* --- Origin timeline --- */
  .origin-timeline {
    padding-left: 28px;
  }
  .origin-timeline::before {
    left: 10px;
  }
  .origin-step::before {
    left: -22px;
    width: 10px;
    height: 10px;
  }
  .origin-step {
    margin-bottom: 36px;
  }
  .origin-step h3 {
    font-size: 19px;
  }
  .origin-step p {
    font-size: 13px;
  }
  .origin-detail {
    padding: 16px 14px;
    font-size: 12px;
  }
  .origin-pullquote {
    font-size: 17px;
    padding-left: 14px;
  }

  /* --- Practice cards --- */
  .practice-cards {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .p-card {
    padding: 20px;
  }
  .p-card h3 {
    font-size: 17px;
  }
  .p-card p {
    font-size: 12px;
  }

  /* --- Qualification grid --- */
  .qual-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .qual-text p {
    font-size: 13px;
  }
  .qual-list li {
    font-size: 13px;
    padding-left: 18px;
  }
  .qual-sidebar {
    padding: 24px 20px;
  }
  .qual-sidebar h4 {
    font-size: 17px;
  }
  .qual-sidebar p {
    font-size: 13px;
  }

  /* --- Values grid (dark) --- */
  .values-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .v-card {
    padding: 22px;
  }
  .v-card .num {
    font-size: 22px;
  }
  .v-card h3 {
    font-size: 17px;
  }
  .v-card p {
    font-size: 12px;
  }
  .v-featured .num {
    font-size: 26px;
  }
  .v-featured h3 {
    font-size: 19px;
  }
  .v-featured p {
    font-size: 13px;
  }

  /* ============================================================
     O-MNIE SECTIONS AT 290px
     ============================================================ */

  /* --- Bio section --- */
  .bio-section {
    padding: 40px 12px;
    gap: 24px;
  }
  .bio-main h2 {
    font-size: 24px;
  }
  .bio-main > p {
    font-size: 14px;
  }
  .bio-main p:first-of-type {
    font-size: 14px;
  }
  .bio-sidebar {
    padding: 24px 18px;
  }
  .bio-sidebar h3 {
    font-size: 17px;
    margin-bottom: 18px;
  }
  .credential-card .label {
    font-size: 9px;
  }
  .credential-card .title {
    font-size: 13px;
  }
  .credential-card .desc {
    font-size: 12px;
  }

  /* --- Values section --- */
  .values-section {
    padding: 40px 12px;
  }
  .values-section h2 {
    font-size: 24px;
  }
  .values-intro {
    font-size: 13px;
    margin-bottom: 28px;
  }
  .value-card {
    padding: 22px;
  }
  .value-card h3 {
    font-size: 18px;
  }
  .value-card p {
    font-size: 13px;
  }

  /* --- Gallery section --- */
  .gallery-section {
    padding: 40px 12px;
  }
  .gallery-section h2 {
    font-size: 24px;
    margin-bottom: 28px;
  }
  .gallery-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 10px;
  }
  .gallery-item {
    min-height: 140px;
  }

  /* --- Collaboration section --- */
  .collab-section {
    padding: 40px 12px;
  }
  .collab-section h2 {
    font-size: 24px;
  }
  .collab-intro {
    font-size: 13px;
  }
  .collab-card {
    grid-template-columns: 1fr;
    text-align: center;
    padding: 22px;
    gap: 16px;
  }
  .collab-photo {
    width: 70px;
    height: 70px;
    margin: 0 auto;
    font-size: 10px;
  }
  .collab-text h3 {
    font-size: 20px;
  }
  .collab-text p {
    font-size: 13px;
  }

  /* --- Memberships section --- */
  .memberships-section {
    padding: 40px 12px;
  }
  .memberships-section h2 {
    font-size: 24px;
    margin-bottom: 28px;
  }
  .memberships-grid {
    gap: 8px;
  }
  .membership-badge {
    padding: 10px 14px;
    font-size: 11px;
  }

  /* --- Subpages section --- */
  .subpages-section {
    padding: 40px 12px;
  }
  .subpages-section h2 {
    font-size: 24px;
    margin-bottom: 28px;
  }
  .subpages-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .subpage-card {
    padding: 20px;
  }
  .subpage-card h3 {
    font-size: 16px;
  }
  .subpage-card p {
    font-size: 12px;
  }

  /* ============================================================
     HABILITACJA / STAZE SECTIONS AT 290px
     ============================================================ */

  /* --- Stats bar (habilitacja) --- */
  .stats-bar {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 28px 12px;
  }
  .stat-num {
    font-size: 22px;
    letter-spacing: -1px;
  }
  .stat-lbl {
    font-size: 10px;
    letter-spacing: 0.8px;
  }

  /* --- Pub grid + pub card --- */
  .pub-card {
    padding: 20px 16px;
  }
  .pub-card h3 {
    font-size: 17px;
  }
  .pub-card .pub-finding {
    font-size: 13px;
  }

  /* --- Metrics grid --- */
  .metrics-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 24px 0;
  }
  .metric-card {
    padding: 20px;
  }
  .metric-num {
    font-size: 22px;
  }
  .metric-label {
    font-size: 10px;
  }
  .metrics-grid-2col {
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 24px 0;
  }

  /* --- Matters + monograph --- */
  .matters-item {
    padding: 16px 14px;
    margin-bottom: 14px;
  }
  .matters-item h4 {
    font-size: 16px;
  }
  .matters-item p {
    font-size: 13px;
  }
  .monograph-card {
    padding: 20px 16px;
  }
  .monograph-card h3 {
    font-size: 18px;
  }
  .monograph-card p {
    font-size: 13px;
  }

  /* --- Timeline section (staze) --- */
  .timeline-section {
    padding: 40px 12px;
  }
  .timeline-section h2 {
    font-size: 22px;
  }
  .timeline-intro {
    font-size: 13px;
  }
  .timeline-vertical {
    padding-left: 28px;
  }
  .timeline-vertical::before {
    left: 10px;
  }
  .timeline-step::before {
    left: -22px;
    width: 10px;
    height: 10px;
  }
  .timeline-step {
    margin-bottom: 36px;
  }
  .timeline-step h3 {
    font-size: 19px;
  }
  .timeline-step p {
    font-size: 13px;
  }
  .timeline-detail {
    padding: 16px 14px;
    font-size: 12px;
  }

  /* --- Competencies section --- */
  .competencies-section {
    padding: 40px 12px;
  }
  .competencies-section h2 {
    font-size: 22px;
  }
  .comp-intro {
    font-size: 13px;
  }
  .competency-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .comp-card {
    padding: 20px;
  }
  .comp-card h3 {
    font-size: 17px;
  }
  .comp-card p {
    font-size: 12px;
  }

  /* --- Related section (staze full-width) --- */
  .related-section {
    padding: 40px 12px;
  }
  .related-section h2 {
    font-size: 22px;
  }

  /* ============================================================
     PUBLIKACJE (DARK PAGE) AT 290px
     ============================================================ */

  header.hero {
    padding: 60px 12px 28px;
  }
  header.hero h1 {
    font-size: 22px;
  }
  .hero-label {
    font-size: 9px;
    letter-spacing: 0.08em;
  }
  .hero-desc {
    font-size: 13px;
    margin-bottom: 24px;
  }
  .hero-stats {
    gap: 16px;
    flex-direction: column;
  }
  .hero-stats .stat-num {
    font-size: 24px;
  }
  .hero-stats .stat-lbl {
    font-size: 11px;
  }

  /* --- Section wrapper --- */
  .section {
    padding: 0 12px 36px;
  }
  .section-title {
    font-size: 10px;
  }
  .section-label {
    font-size: 10px;
  }
  .section-desc {
    font-size: 13px;
  }
  .section-heading {
    padding: 24px 12px 0;
  }
  .section-heading h2 {
    font-size: 1.4rem;
  }
  .section-heading p {
    font-size: 13px;
  }

  /* --- Research areas grid --- */
  .areas-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .area-card {
    padding: 18px;
  }
  .area-card h3 {
    font-size: 17px;
  }
  .area-card p {
    font-size: 12px;
  }

  /* --- Collaborators --- */
  .collabs {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .collab {
    padding: 12px 14px;
    gap: 10px;
  }
  .collab-avatar {
    width: 34px;
    height: 34px;
    font-size: 12px;
  }
  .collab-name {
    font-size: 13px;
  }
  .collab-meta {
    font-size: 11px;
  }

  /* --- Filters: wrap buttons --- */
  .filters {
    gap: 5px;
    padding: 8px 0;
  }
  .filter-btn {
    font-size: 11px;
    padding: 5px 10px;
  }

  /* --- Publication list --- */
  .year-label {
    font-size: 20px;
  }
  .pub {
    padding: 12px 0 12px 14px;
  }
  .pub-journal {
    font-size: 10px;
  }
  .pub-title {
    font-size: 13px;
  }
  .pub-authors {
    font-size: 12px;
  }
  .pub-tags {
    gap: 4px;
  }
  .pub-tag {
    font-size: 10px;
    padding: 1px 6px;
  }

  /* --- RG link --- */
  .rg-link {
    padding: 20px 12px;
  }
  .rg-link a {
    font-size: 12px;
    padding: 10px 18px;
  }

  /* ============================================================
     DLA-LEKARZY AT 290px
     ============================================================ */

  /* --- Stats variant --- */
  .st {
    padding: 24px 10px;
  }
  .st-n {
    font-size: 22px;
    letter-spacing: -1px;
  }
  .st-l {
    font-size: 8px;
    letter-spacing: 1px;
  }

  /* --- Collab hero --- */
  .collab-hero {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .collab-hero-text p {
    font-size: 13px;
  }
  .collab-hero-stats {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .ch-stat {
    padding: 18px 14px;
  }
  .ch-stat-n {
    font-size: 22px;
  }
  .ch-stat-l {
    font-size: 8px;
    letter-spacing: 1px;
  }

  /* --- Collab section labels --- */
  .collab-section-label {
    font-size: 9px;
    letter-spacing: 1.5px;
  }
  .collab-ava {
    width: 38px;
    height: 38px;
    font-size: 11px;
  }

  /* --- Cases grid --- */
  .cases-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .case-card {
    padding: 20px;
  }
  .case-card h3 {
    font-size: 16px;
  }
  .case-card ul li {
    font-size: 12px;
  }

  /* --- Referral steps --- */
  .ref-steps {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .ref-step {
    padding: 22px 18px;
  }
  .ref-step::before {
    font-size: 28px;
  }
  .ref-step h3 {
    font-size: 16px;
  }
  .ref-step p {
    font-size: 12px;
  }

  /* --- Offer grid --- */
  .offer-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .offer-card {
    padding: 24px 18px;
  }
  .offer-card .o-icon {
    font-size: 24px;
  }
  .offer-card h3 {
    font-size: 18px;
  }
  .offer-card p {
    font-size: 12px;
  }

  /* --- Hero anchors --- */
  .hero-anchors {
    flex-direction: column;
    gap: 6px;
  }
  .hero-anchors a {
    font-size: 9px;
    padding: 10px 14px;
    text-align: center;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* ============================================================
     CENNIK AT 290px
     ============================================================ */

  .loc-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .loc-card {
    padding: 18px;
  }
  .loc-card h3 {
    font-size: 1rem;
  }
  .loc-card p {
    font-size: 13px;
  }

  /* ============================================================
     KONTAKT AT 290px
     ============================================================ */

  /* --- Hero center --- */
  .hero:has(.h-hero-center) {
    min-height: 280px;
    padding: 24px 12px;
  }
  .h-hero-center {
    padding: 0;
  }
  .hero:has(.h-hero-center) h1 {
    font-size: 22px;
  }
  .hero:has(.h-hero-center) .hero-sub {
    font-size: 12px;
  }

  /* --- Locations section --- */
  .locs-section {
    padding: 40px 12px;
  }
  .locs-section h2 {
    font-size: 22px;
    margin-bottom: 24px;
  }
  .locs-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .loc-content {
    padding: 0 18px 18px;
  }
  .loc-map {
    height: 100px;
    margin: 14px;
  }
  .loc-address {
    font-size: 13px;
  }
  .loc-phone {
    font-size: 11px;
  }

  /* --- Form section --- */
  .form-section {
    padding: 40px 12px;
  }
  .form-section h2 {
    font-size: 22px;
    margin-bottom: 24px;
  }
  .form-wrapper {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .form-field label {
    font-size: 11px;
  }
  .form-field input,
  .form-field select,
  .form-field textarea {
    font-size: 14px;
    padding: 10px 12px;
  }
  .form-submit {
    padding: 12px 20px;
    font-size: 10px;
    align-self: stretch;
    text-align: center;
  }
  .form-sidebar {
    padding: 22px 18px;
  }
  .form-sidebar h3 {
    font-size: 17px;
  }
  .consult-steps li {
    font-size: 12px;
    padding-left: 24px;
  }

  /* --- Before visit section --- */
  .before-section {
    padding: 40px 12px;
  }
  .before-section h2 {
    font-size: 22px;
    margin-bottom: 24px;
  }
  .before-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .before-card {
    padding: 22px;
  }
  .before-card h3 {
    font-size: 17px;
  }
  .before-card p {
    font-size: 12px;
  }
  .before-list li {
    font-size: 12px;
  }

  /* --- B2B section --- */
  .b2b-section {
    padding: 40px 12px;
  }
  .b2b-section h2 {
    font-size: 22px;
  }
  .b2b-section p {
    font-size: 13px;
  }
  .b2b-email {
    font-size: 12px;
    word-break: break-all;
  }
  .b2b-link {
    font-size: 10px;
    padding: 8px 14px;
  }

  /* ============================================================
     HUB PAGES (kolano, biodro, etc.) AT 290px
     ============================================================ */

  /* --- Hub hero --- */
  .hub-hero {
    min-height: 220px;
  }
  .hub-hero-inner {
    padding: 36px 12px 28px;
  }
  .hub-hero-inner .subtitle {
    font-size: 10px;
    letter-spacing: 1.5px;
  }
  .hub-hero-inner h1 {
    font-size: 1.6rem;
  }
  .hub-hero-inner .lead {
    font-size: 13px;
  }

  /* --- Conditions grid --- */
  .conditions {
    padding: 24px 12px;
  }
  .conditions h2 {
    font-size: 1.4rem;
  }
  .conditions .subtitle {
    font-size: 13px;
  }
  .conditions-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 0;
  }
  .cond-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .condition-card,
  .cond-card {
    padding: 20px;
  }
  .condition-card h3,
  .cond-card h3 {
    font-size: 17px;
  }
  .condition-card p,
  .cond-card p {
    font-size: 12px;
  }
  .card-desc {
    font-size: 12px;
  }

  /* --- Cross-sell --- */
  .cross-sell {
    padding: 32px 12px;
  }
  .cross-sell-inner {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .cross-sell-text h2 {
    font-size: 1.3rem;
  }
  .cross-sell-text p {
    font-size: 13px;
  }
  .cs-text {
    font-size: 12px;
  }

  /* --- Why surgeon / why doc --- */
  .why-surgeon {
    padding: 24px 12px;
  }
  .why-surgeon h2,
  .why-text h2 {
    font-size: 1.3rem;
  }
  .why-surgeon p,
  .why-text p {
    font-size: 13px;
  }
  .why-surgeon-inner {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .why-surgeon-stats,
  .why-doc-stats {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .why-stat .num,
  .why-doc-stat .num {
    font-size: 18px;
  }
  .why-stat .label,
  .why-doc-stat .label {
    font-size: 9px;
  }
  .why-doc {
    padding: 24px 12px;
  }
  .why-doc h2 {
    font-size: 1.3rem;
  }
  .why-doc p {
    font-size: 13px;
  }
  .why-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 20px 0;
  }
  .why-item {
    padding: 18px;
  }
  .why-item h4 {
    font-size: 16px;
  }
  .why-item p {
    font-size: 12px;
  }

  /* --- CTA buttons (hub pages) --- */
  .cta-btns,
  .cta-buttons {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  .cta-primary,
  .cta-btn.primary {
    padding: 12px 20px;
    font-size: 10px;
    text-align: center;
    width: 100%;
  }
  .cta-secondary,
  .cta-btn.secondary {
    padding: 12px 20px;
    font-size: 10px;
    text-align: center;
    width: 100%;
  }

  /* --- Icon text (hub decorative) --- */
  .icon-text {
    font-size: 32px;
  }

  /* --- Crosslink --- */
  .crosslink {
    font-size: 12px;
    padding: 6px 0;
  }
}


/* ============ STAZE: DARK STATS-BAR VARIANT (div.stats-bar) ============ */
div.stats-bar {
  background: var(--navy);
  padding: 48px 44px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  text-align: center;
}
.stat-item {
  padding: 16px 0;
}
div.stats-bar .stat-num {
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 600;
  color: var(--celadon);
  margin-bottom: 6px;
  line-height: 1;
}
div.stats-bar .stat-label {
  font-size: 11px;
  color: rgba(255,255,255,0.45);
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.4;
}

/* ============ STAZE: RELATED-SECTION GRID (4-col) ============ */
.related-section .related-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.related-section .related-card {
  background: var(--bg-cream);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 24px;
  text-decoration: none;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}
.related-section .related-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--celadon);
  opacity: 0;
  transition: opacity 0.3s;
}
.related-section .related-card:hover {
  border-color: var(--celadon-border);
  box-shadow: 0 4px 20px rgba(74,191,173,0.06);
  transform: translateY(-2px);
}
.related-section .related-card:hover::before { opacity: 1; }
.related-section .related-card h4 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--celadon);
  margin-bottom: 8px;
}
.related-section .related-card p {
  font-size: 14px;
  color: var(--navy);
  margin: 0;
  line-height: 1.4;
  font-weight: 500;
}

/* ============ STAZE: RESPONSIVE — dark stats-bar + related-section ============ */
@media (max-width: 768px) {
  div.stats-bar {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    padding: 40px 24px;
  }
  .related-section .related-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 480px) {
  div.stats-bar {
    grid-template-columns: 1fr;
  }
  .related-section .related-grid {
    grid-template-columns: 1fr;
  }
}


/* ============ SUBPAGE HERO — SHORTER (not homepage) ============ */
body.subpage .hero {
  min-height: 420px;
  max-height: 520px;
}
body.subpage .hero h1 { font-size: 36px; }
body.subpage .h-content { padding: 40px 56px 36px; }
body.subpage .h-photo { padding: 24px 24px 24px 0; }
body.subpage .h-photo img { max-height: 400px; border-radius: 10px; }

/* O mnie hub pages — keep tall hero like homepage */
body.hero-tall .hero { min-height: 80vh; max-height: none; }
body.hero-tall .hero h1 { font-size: 38px; }
body.hero-tall .h-content { padding: 56px 64px 48px; }
body.hero-tall .h-photo { padding: 48px 32px 48px 0; }
body.hero-tall .h-photo img { max-height: 480px; border-radius: 12px; }

/* ============ SUBPAGE MOBILE HERO ============ */
@media (max-width: 768px) {
  body.subpage .hero { min-height: auto; max-height: none; grid-template-columns: 1fr; }
  body.subpage .hero h1 { font-size: 24px; }
  body.subpage .h-content { padding: 72px 16px 24px; }
  body.subpage .h-photo { padding: 12px; order: 2; }
  body.subpage .h-photo img { max-height: 280px; }
  body.subpage .hero-sub { font-size: 13px; }
  body.hero-tall .hero { min-height: auto; max-height: none; grid-template-columns: 1fr; }
  body.hero-tall .hero h1 { font-size: 26px; }
  body.hero-tall .h-content { padding: 72px 16px 24px; }
  body.hero-tall .h-photo { padding: 12px; order: 2; }

  /* Stats bar mobile */
  .stats-bar { grid-template-columns: repeat(2, 1fr); }
  .stats-bar .stat-num { font-size: 1.6rem; }
}
@media (max-width: 360px) {
  body.subpage .hero h1 { font-size: 20px; }
  body.hero-tall .hero h1 { font-size: 22px; }
  body.subpage .h-content, body.hero-tall .h-content { padding: 64px 12px 20px; }
}

/* ============ GLOBAL OVERFLOW FIX ============ */
html, body { overflow-x: hidden; }