/* =============================================================
   Exponential Summit v2 — Design System CSS
   Based on the "Exponential Summit Design System" handoff bundle.
   Dark-mode primary, sharp red accents, marker hand-drawn texture.
   ============================================================= */

@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@400;700;800;900&family=DM+Sans:wght@400;500;700;800&family=Montserrat:wght@500;600;700;800;900&display=swap");

@font-face {
  font-family: "Permanent Marker";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/PermanentMarker-Regular__Czech_fix_.otf") format("opentype");
}

:root {
  /* Red Button brand palette */
  --brand-white:      #fafafa;
  --brand-wine:       #a11834;
  --brand-anthracite: #444444;
  --brand-red:        #fe1a3f;
  --brand-grey:       #b0b2b6;
  --brand-sgrey:      #969696;

  /* Brand reds — 10/30/60 */
  --red-10: #fe1a3f;
  --red-30: #a11834;
  --red-60: rgb(190, 22, 34);
  --red-deep: rgb(217, 11, 64);
  --red-edge: rgb(215, 16, 63);

  /* Neutrals — dark mode primary */
  --ink-0: rgb(13, 13, 13);
  --ink-1: rgb(26, 26, 26);
  --ink-2: rgb(39, 39, 39);
  --ink-3: rgb(57, 57, 57);
  --ink-4: rgb(63, 63, 63);
  --ink-5: rgb(68, 62, 62);
  --ink-6: rgb(83, 83, 83);
  --ink-7: rgb(127, 127, 127);
  --ink-8: rgb(148, 148, 148);
  --ink-9: rgb(186, 187, 189);
  --ink-10: rgb(189, 191, 193);
  --ink-11: rgb(217, 217, 217);
  --paper: rgb(255, 250, 250);
  --white: rgb(255, 255, 255);

  /* Semantic */
  --bg: var(--ink-1);
  --bg-elevated: var(--ink-2);
  --bg-paper: var(--paper);
  --fg: var(--white);
  --fg-muted: var(--ink-8);
  --accent: var(--red-10);
  --accent-deep: var(--red-30);
  --label: var(--red-deep);

  --stroke: rgba(255, 255, 255, 0.1);
  --stroke-strong: var(--ink-7);
  --divider-rule: 1.7px solid var(--ink-1);

  /* Type families */
  --font-display: "Rubik", system-ui, sans-serif;
  --font-marker: "Permanent Marker", "Marker Felt", cursive;
  --font-body: "Rubik", system-ui, sans-serif;
  --font-ui: "Rubik", system-ui, sans-serif;

  /* Type scale */
  --fs-h1: 64px;
  --fs-h1-hero: 128px;
  --fs-h2: 36px;
  --fs-h3: 24px;
  --fs-h2-marker: 36px;
  --fs-h4-marker: 18px;
  --fs-paragraph: 18px;
  --fs-paragraph-sm: 16px;
  --fs-button: 16px;
  --fs-eyebrow: 16px;
  --fs-caption: 14px;

  --tracking-eyebrow: 0.10em;
  --tracking-button: 0.05em;

  /* Spacing scale */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 28px; --sp-7: 32px; --sp-8: 36px;
  --sp-9: 48px; --sp-10: 64px; --sp-11: 112px; --sp-12: 180px;

  /* Radii */
  --r-1: 4px;
  --r-2: 8px;
  --r-pill: 999px;

  /* Shadows */
  --shadow-card: -3.4px 6.9px 41px 0 rgba(0,0,0,0.23);
  --shadow-button-hot: 0 0 23px 0 rgba(0,0,0,1);
  --shadow-text: 0 2.8px 2.8px rgba(0,0,0,0.25);
  --shadow-input-inset: inset 0 2px 7.5px rgba(0,0,0,0.25);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-fast: 140ms;
  --dur-base: 220ms;

  --container: 1280px;
  --container-wide: 1520px;
}

/* Base reset */
* { box-sizing: border-box; }

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  font-size: var(--fs-paragraph-sm);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  max-width: 100vw;
}

html { scroll-behavior: smooth; }

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.link-accent { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
button { font-family: inherit; cursor: pointer; }

/* Subtle film-grain noise overlay */
body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 1000;
  background-image: url('../assets/bg-dark-noise.png');
  background-size: 760px auto;
  background-repeat: repeat;
  mix-blend-mode: overlay;
  opacity: 0.6;
}

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 48px;
}

.container-wide {
  max-width: var(--container-wide);
  margin: 0 auto;
  padding: 0 48px;
}

/* =============================================================
   Type helpers
   ============================================================= */
.eyebrow {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.18em;
  text-transform: lowercase;
  color: var(--label);
  line-height: 1;
  display: inline-block;
}

.h1 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: var(--fs-h1);
  line-height: 1;
  color: var(--fg);
  letter-spacing: -0.02em;
  margin: 0;
}

.h2 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--fs-h2);
  line-height: 1.05;
  color: var(--fg);
  letter-spacing: -0.02em;
  margin: 0;
}

.h2-large {
  font-size: clamp(40px, 5.5vw, 64px);
}

.h2-marker {
  font-family: var(--font-marker);
  font-weight: 400;
  font-size: var(--fs-h2-marker);
  line-height: 1.1;
  color: var(--accent);
  letter-spacing: 0.02em;
  margin: 0;
}

.h3 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-h3);
  line-height: 1.2;
  color: var(--fg);
  margin: 0;
}

.text-marker {
  font-family: var(--font-marker);
  color: var(--accent);
  letter-spacing: 0.02em;
}

.text-marker-deep  { color: var(--red-30); }
.text-marker-white { font-family: var(--font-marker); color: var(--white); letter-spacing: 0.02em; }

.paragraph {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-paragraph);
  line-height: 1.6;
  color: var(--ink-9);
}

.caption {
  font-family: var(--font-ui);
  font-size: var(--fs-caption);
  color: var(--fg-muted);
}

/* =============================================================
   Section header
   ============================================================= */
.section-header {
  margin-bottom: 56px;
}
.section-header.center { text-align: center; }
.section-header .eyebrow { margin-bottom: 16px; }
.section-header h2 { margin-bottom: 20px; }
.section-header .section-desc {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.55;
  color: var(--ink-9);
  max-width: 760px;
  margin: 0;
}
.section-header.center .section-desc { margin: 0 auto; }

/* =============================================================
   Buttons — wobble frame, primary (red) + outline (grey)
   The SVG frame stretches across the whole button so the
   wobble is continuous regardless of label width.
   ============================================================= */
.btn {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  line-height: 1;
  transition: filter var(--dur-base) var(--ease-out), transform 120ms;
}
.btn:active { transform: scale(0.98); }

.btn-frame {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  /* Scale the wobble frame past the button bounds so the visible rect
     (which only covers the central ~92% of the SVG viewBox horizontally
     and ~85% vertically) reaches around the entire label. */
  transform: scale(1.34, 1.25);
  transform-origin: center;
}
/* Hide the legacy multi-piece markup if present */
.btn-frame .edge,
.btn-frame .bridge { display: none; }

.btn-label {
  position: relative; z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  white-space: nowrap;
}

/* Primary (red) */
.btn-primary {
  filter: drop-shadow(0 0 22px rgba(0,0,0,0.85));
}
.btn-primary:hover {
  filter: drop-shadow(0 0 32px rgba(0,0,0,1)) brightness(1.05);
}
.btn-primary .btn-frame {
  /* Clear background — the SVG is rendered by ::before for guaranteed stretch */
  background: none;
  top: 0; bottom: 0; left: 0; right: 0;
  transform: none;
  overflow: visible;
}
/* ::before lives inside .btn-frame (itself a positioned element),
   so 100% = .btn-frame width = button width.
   Extend 24px left/right and 8px top/bottom beyond the button. */
.btn-primary .btn-frame::before {
  content: '';
  position: absolute;
  top: -8px;
  bottom: -8px;
  left: -24px;
  width: calc(100% + 48px);
  background-image: url('../assets/btn-frame.svg?v=2');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 0;
}
.btn-primary .btn-label { color: var(--white); }

/* Outline — hand-drawn wobble frame (btn-frame-secondary.svg).
   Scale is set large enough to cover even wide long-text buttons. */
.btn-outline {
  filter: none;
  background: transparent;
  border: none;
}
.btn-outline:hover { filter: brightness(0.85); }
.btn-outline .btn-frame {
  background-image: url('../assets/btn-frame-secondary.svg');
  transform: scale(2.4, 1.35);
}
.btn-outline .btn-label { color: var(--white); }
/* Extra horizontal padding for outline btn-md so frame has breathing room */
.btn-outline.btn-md .btn-label { padding: 14px 52px; }
/* btn-primary btn-md: wider padding so long labels stay inside the frame */
.btn-primary.btn-md .btn-label { padding: 14px 64px; }
.btn-primary.btn-lg .btn-label { padding: 18px 60px; }
/* Smaller frame scale for outline btn-lg so visual size matches btn-primary btn-lg */
.btn-outline.btn-lg .btn-frame { transform: scale(1.6, 1.35); }

/* Sizes — the wobble frame is scaled past the button bounds, so labels can
   use moderate padding. */
.btn-sm  .btn-label { padding: 10px 22px; font-size: 13px; }
.btn-md  .btn-label { padding: 14px 30px; font-size: 16px; }
.btn-lg  .btn-label { padding: 18px 38px; font-size: 20px; }

/* Ghost — text-only red link */
.btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  color: var(--accent);
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 16px;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  background: transparent;
  border: none;
}
.btn-ghost:hover { color: var(--red-30); }

/* =============================================================
   Header / nav
   ============================================================= */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 48px;
  background: rgba(39,39,39,0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--stroke);
}

.site-header .logo img { height: 83px; display: block; }

.site-header nav {
  display: flex;
  gap: 32px;
}
.site-header nav a {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-9);
  transition: color var(--dur-base);
  background: transparent;
  border: none;
  padding: 4px 0;
}
.site-header nav a:hover,
.site-header nav a.active { color: var(--white); }

.site-header .header-left {
  display: flex;
  align-items: center;
  gap: 20px;
}
.site-header .header-right {
  display: flex;
  align-items: center;
  gap: 20px;
}
.site-header .lang-switch {
  margin-right: 8px;
}

.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0;
  color: var(--ink-9);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: var(--r-2);
  transition: background var(--dur-base);
  user-select: none;
}
.lang-switch:hover { background: rgba(255,255,255,0.06); }
.lang-switch .lang-flag { font-size: 18px; line-height: 1; }
.lang-switch .lang-arrow {
  font-size: 10px;
  color: var(--ink-7);
  transition: transform var(--dur-base);
}
.lang-switch a { color: var(--ink-8); transition: color var(--dur-base); }
.lang-switch a:hover { color: var(--white); }
.lang-switch .active { color: var(--white); }

/* Nové CTA tlačítko v navbaru — jednoduché plné červené, zaoblené */
/* Nav CTA uses the site's standard .btn .btn-primary .btn-sm styling;
   this class only aligns it in the header and marks it for the mobile hide rule. */
.btn-nav-cta { align-self: center; }

.nav-toggle {
  display: none;
  background: transparent;
  border: none;
  width: 32px; height: 32px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}
.nav-toggle span {
  display: block;
  width: 24px; height: 2px;
  background: var(--white);
  transition: transform var(--dur-base), opacity var(--dur-base);
}

/* =============================================================
   Hero
   ============================================================= */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 160px 96px 100px;
  background: var(--ink-2);
  overflow: hidden;
  text-align: center;
}
.hero-bg {
  position: absolute; inset: 0;
  overflow: hidden;
  background: var(--ink-2);
}
.hero-bg-video,
.hero-bg-photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1.0;
  /* Match the hero YouTube background look: video uses saturate(0.9) contrast(1.05)
     plus a 24% black overlay, so the still is desaturated + darkened to match */
  filter: saturate(0.5) contrast(1.05) brightness(0.8);
  pointer-events: none;
}
/* Hero YouTube background */
.hero-bg-yt {
  position: absolute; inset: 0;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.8s ease;
}
.hero-bg-yt::after {
  content: "";
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.24);
  pointer-events: none;
  z-index: 1;
}
body.hero-yt-ready .hero-bg-yt { opacity: 1; }
body.hero-yt-ready .hero-bg-photo { opacity: 0; transition: opacity 0.8s ease; }
.hero-bg-yt iframe {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  height: 56.25vw;     /* 16:9 */
  min-height: 100%;
  min-width: 177.78vh; /* cover: fills hero even on non-16:9 screens */
  pointer-events: none;
  filter: saturate(0.9) contrast(1.05);
}
/* Keep opacity on the photo bg as before */
body.hero-yt-ready .hero-bg-photo { opacity: 0; }
.hero-bg-toggle {
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.hero-bg-toggle:hover { background: rgba(255,255,255,0.16); }
.hero-bg-network {
  position: absolute; inset: 0;
  background: url('../assets/network-bg.png') center/cover;
  opacity: 0.4;
  mix-blend-mode: screen;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .hero-bg-video { display: none; }
}
.hero-vignette {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 50%, var(--ink-0) 100%);
}
.hero-eyebrow {
  position: relative; z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--red-deep);
  margin-bottom: 32px;
}
.hero-eyebrow .icon-pin { width: 18px; height: 18px; }

.hero-wordmark {
  position: relative; z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 0.95;
  letter-spacing: -0.02em;
}
.hero-wordmark .word-1,
.hero-wordmark .word-3 {
  font-family: var(--font-display);
  font-weight: 900;
  /* Sized so EXPONENTIAL (11 chars at weight 900) fits on a 320px+ viewport
     while staying composed at desktop widths. */
  font-size: clamp(36px, 11.5vw, 128px);
  color: var(--white);
}
/* word-1 stays white — LEADERSHIP (word-marker) is already the red accent per brand guide */
.hero-wordmark .word-3 { letter-spacing: 0.08em; }
.hero-wordmark .word-marker {
  font-family: var(--font-marker);
  font-size: clamp(34px, 9vw, 100px);
  color: var(--accent);
  /* Permanent Marker has a tall ascender area, so shift the glyph up a bit
     so it sits optically centered between EXPONENTIAL and SUMMIT. */
  margin: -22px 0 6px;
  line-height: 1;
  transform: rotate(-2deg);
  display: inline-block;
  transition: opacity 0.35s var(--ease-out), transform 0.35s var(--ease-out);
}
.hero-wordmark .word-marker.word-exit {
  opacity: 0;
  transform: rotate(-2deg) translateY(-22px);
}
.hero-wordmark .word-marker.word-enter {
  opacity: 0;
  transform: rotate(-2deg) translateY(22px);
  transition: none;
}

.hero-subtitle {
  position: relative; z-index: 2;
  max-width: 640px;
  margin: 40px 0 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 28px;
  line-height: 1.3;
  color: #ffffff;
}

.hero-desc {
  max-width: none;
  margin: 20px auto 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: #ffffff;
  white-space: nowrap;
}

.hero-urgency {
  position: relative; z-index: 2;
  margin: 14px 0 0;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
}

.hero-meta {
  position: relative; z-index: 2;
  display: flex;
  align-items: flex-start;
  gap: 29px;
  margin-top: 36px;
  width: fit-content;
}
.hero-meta-item {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hero-meta-item:first-of-type { text-align: center; }
.hero-meta-item:last-of-type  { text-align: center; }
.hero-meta-label {
  font-family: var(--font-marker);
  font-size: 26px;
  font-style: normal;
  color: var(--white);
  line-height: 1.15;
  display: inline-block;
}
.hero-meta-value {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 21px;
  color: var(--white);
}
.hero-meta-divider { display: none; }

.hero-cta {
  position: relative; z-index: 2;
  display: flex;
  gap: 13px;
  margin: 36px 0 0;
}

/* Hero buttons — SVG framy z Figmy (Komponent RGB 1 + 2) */
.hero-btn {
  position: relative;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  flex-shrink: 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.hero-btn--primary {
  width: 191px;
  background-image: url('../assets/hero-btn-primary.svg');
}
.hero-btn--secondary {
  width: 214px;
  background-image: url('../assets/hero-btn-secondary.svg');
}
.hero-btn-fill,
.hero-btn-frame { display: none; }

.hero-btn-label {
  position: relative;
  z-index: 1;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;
  color: #fff;
  text-align: center;
  white-space: nowrap;
}


.hero-microclaim {
  font-family: var(--font-marker);
  font-size: 22px;
  color: var(--accent);
  transform: rotate(-2deg);
  display: inline-block;
}

/* Section below hero that carries microclaim + desc */
.hero-sub {
  background: #a11834;
  text-align: center;
  padding: 56px 48px 72px;
  position: relative;
  overflow: hidden;
}
/* noise grain */
.hero-sub::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../assets/bg-dark-noise.png');
  background-size: 760px auto;
  background-repeat: repeat;
  opacity: 0.10;
  pointer-events: none;
  mix-blend-mode: overlay;
  z-index: 0;
}
/* grid overlay */
.hero-sub::after {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../zakladni-sit-presets/zakladni-sit-64px.png') repeat;
  opacity: 0.08;
  pointer-events: none;
  z-index: 0;
}
.hero-sub > * { position: relative; z-index: 1; }
/* Microclaim na wine musí být bílý (červená na wine = zakázaná kombinace) */
.hero-sub .hero-microclaim { color: #ffffff; }

.hero-flourish {
  position: absolute;
  left: 6%;
  bottom: 60px;
  width: 180px;
  opacity: 0.5;
  transform: rotate(8deg);
  pointer-events: none;
}

/* =============================================================
   Stats row
   ============================================================= */
.stats {
  padding: 0;
  background: linear-gradient(to bottom, transparent 0, transparent 3.34vw, #ffffff 3.34vw);
  border-top: none;
  border-bottom: none;
}
.stats-brush {
  display: block;
  width: 100%;
  height: auto;
  line-height: 0;
  font-size: 0;
}
.stats-brush--top {
  transform: rotate(180deg);
  margin-bottom: -2px;
}
.stats-brush--bottom {
  transform: scaleX(-1);
  margin-top: -2px;
}
.stats-bar {
  background: #a11834;
  padding: 4px 90px;
  width: 100%;
  box-sizing: border-box;
}
.stats-grid {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 90px;
  flex-wrap: nowrap;
}
.stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.stat-number {
  font-family: var(--font-marker);
  font-size: 42px;
  font-weight: 400;
  line-height: 1.1;
  color: #ffffff;
}
.stat-label {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.6;
  color: #ffffff;
  text-align: center;
}

/* =============================================================
   Section base
   ============================================================= */
.section {
  padding: 112px 0;
  position: relative;
}
.section--ink-0 { background: var(--ink-0); }
.section--ink-1 { background: var(--ink-1); }
.section--ink-2 { background: var(--ink-2); }
.section--ink-3 { background: var(--ink-3); }
.section--sm    { padding: 64px 0; }

/* ============================================================
   Brand section backgrounds (Red Button brand manual 2026)
   ============================================================ */
.section--white {
  background-color: #f2ede8;
  background-image: url('../assets/bg-texture.jpg');
  background-size: 960px auto;
  background-repeat: repeat;
  background-position: left top;
  background-attachment: fixed;
  color: #444444;
}
/* Headings and text on white sections */
.section--white .h1,
.section--white .h2,
.section--white .h3,
.section--white h1,
.section--white h2,
.section--white h3 {
  color: #444444;
}
.section--white .eyebrow { color: #969696; }
#program .eyebrow { color: #a11834; font-family: var(--font-marker); font-weight: 400; font-size: 26px; letter-spacing: 0; text-transform: none; }
#tickets .eyebrow { font-family: var(--font-marker); font-weight: 400; font-size: 26px; letter-spacing: 0; text-transform: none; font-style: normal; }
#program .marker-em { font-family: var(--font-marker); color: #a11834; font-style: italic; letter-spacing: 0.02em; }
.section--white .section-desc { color: #444444; }
.section--white .section-prose p { color: #444444; }
.section--white p { color: #444444; }
.section--white .text-marker { color: #a11834; }
.section--white .text-marker-deep { color: #a11834; }
/* text-marker-white becomes wine-red on white backgrounds */
.section--white .text-marker-white { color: #a11834; }
.section--white .speaker-name { color: #444444; }
.section--white .speaker-topic { color: #969696; }
.section--white .program-item-title { color: #444444; }
.section--white .program-item-desc { color: #444444; }
.section--white .link-accent { color: #fe1a3f; }
.section--white .btn-outline .btn-label { color: #444444; }
.section--white .btn-ghost { color: #fe1a3f; }
/* About-box on white: visible card + dark text */
.section--white .about-box {
  background: rgba(68,68,68,0.05);
  border: 1px solid rgba(68,68,68,0.15);
}
.section--white .about-box h3 { color: #444444; }
.section--white .about-box p { color: #666666; }
.section--white .about-rule { background: rgba(68,68,68,0.15); }
.section--white .about-closing { color: #444444; }
/* Audience cards on white: light card */
.section--white .audience-card {
  background: #ffffff;
  border: 1px solid rgba(68,68,68,0.12);
}
.section--white .audience-card h3 { color: #444444; }
.section--white .audience-card p { color: #666666; }
.section--white .audience-takeaway-label { color: #a11834; }
.section--white .audience-takeaway-list li { color: #444444; }
.section--white .audience-claim { color: #444444; }
.section--white .audience-red-list li { color: #444444; }

/* ============================================================
   About section
   ============================================================ */
.about-section {
  background-color: #f2ede8;
  background-image: url('../assets/bg-texture.jpg');
  background-size: 960px auto;
  background-repeat: repeat;
  background-position: left top;
  background-attachment: fixed;
  padding-top: 96px;
  overflow: hidden;
}
.about-header {
  text-align: center;
  max-width: 740px;
  margin: 0 auto;
  padding: 0 24px;
}
.about-title {
  font-family: var(--font-body);
  font-size: 42px;
  font-weight: 900;
  line-height: 1.1;
  color: #444444;
  margin: 0 0 24px;
}
.about-title .marker-em {
  font-family: var(--font-marker);
  font-weight: 400;
  font-style: italic;
  color: #a11834;
}
.about-body {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: #444444;
  max-width: 725px;
  margin: 0 auto 24px;
}
.about-body p { margin: 0 0 0; }
.about-body p + p { margin-top: 0.5em; }
.about-cta { margin-bottom: 0; filter: none; }
.about-cta:hover { filter: none; }
.about-carousel {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.about-photos {
  display: flex;
  gap: 16px;
  align-items: flex-end;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 8px;
}
.about-photos::-webkit-scrollbar { display: none; }
.about-col {
  flex: 0 0 calc(20% - 13px);
  min-width: 0;
  display: flex;
  flex-direction: column;
  scroll-snap-align: start;
}
.about-arrow {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(0,0,0,0.55);
  border: none;
  color: #ffffff;
  font-size: 28px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s;
  line-height: 1;
}
.about-arrow:hover { background: #a11834; }
.about-arrow--prev { left: 12px; }
.about-arrow--next { right: 12px; }
.about-col-img {
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}
.about-col-img--tall { height: 391px; }
.about-col-img--short { height: 282px; }
.about-col-img--offset { margin-top: 69px; }
.about-col-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.about-quote {
  font-family: var(--font-marker);
  font-size: 26px;
  line-height: 1.15;
  color: #a11834;
  text-align: center;
  padding: 40px 16px 48px;
  margin: 0;
}

.section--wine {
  background: #a11834;
  color: #ffffff;
}
/* Wine section — all text white, text-marker white */
.section--wine .eyebrow { color: rgba(255,255,255,0.75); }
.section--wine .h1,
.section--wine .h2,
.section--wine .h3,
.section--wine h1,
.section--wine h2,
.section--wine h3 { color: #ffffff; }
.section--wine .text-marker { color: #ffffff; }
.section--wine .text-marker-white { color: #ffffff; }
.section--wine .text-marker-deep { color: rgba(255,255,255,0.85); }
.section--wine .section-desc { color: rgba(255,255,255,0.85); }
.section--wine p { color: rgba(255,255,255,0.85); }
.section--wine li { color: rgba(255,255,255,0.85); }
.section--wine .link-accent { color: #ffffff; text-decoration-color: rgba(255,255,255,0.5); }
.section--wine .btn-outline .btn-label { color: #ffffff; }
.section--wine .btn-ghost { color: #ffffff; }

.section--anthracite {
  background: #444444;
  color: #ffffff;
}
/* Anthracite section — text white, accents Apple Red */
.section--anthracite .eyebrow { color: rgba(255,255,255,0.65); }
.section--anthracite .h1,
.section--anthracite .h2,
.section--anthracite .h3,
.section--anthracite h1,
.section--anthracite h2,
.section--anthracite h3 { color: #ffffff; }
.section--anthracite .text-marker { color: #fe1a3f; }
.section--anthracite .text-marker-white { color: #ffffff; }
.section--anthracite .section-desc { color: rgba(255,255,255,0.85); }
.section--anthracite p { color: rgba(255,255,255,0.85); }
.section--anthracite li { color: rgba(255,255,255,0.85); }
.section--anthracite .link-accent { color: #fe1a3f; }
.section--anthracite .btn-ghost { color: #fe1a3f; }
.section--anthracite .btn-outline .btn-label { color: #ffffff; }

/* H→T section: ht-letter accent + arrow must be white on wine bg */
.section--wine .ht-letter.accent { color: rgba(255,255,255,0.9); }
.section--wine .ht-arrow { color: rgba(255,255,255,0.7); }

/* heading-with-marker h2 on white section: must be dark */
.section--white .heading-with-marker h2 { color: #444444; }

/* audience-card-wide on white section: visible card */
.section--white .audience-card-wide {
  background: #ffffff;
  border: 1px solid rgba(68,68,68,0.12);
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.section--white .audience-card-wide h3 { color: #444444; }
.section--white .audience-card-wide p { color: #666666; }

/* past-speaker on wine section: white initials + white company */
.section--wine .past-speaker-photo {
  color: #ffffff;
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.25);
}
.section--wine .past-speaker-company { color: rgba(255,255,255,0.8); }

/* ticket cards on wine section: all same unified color */
.section--wine .ticket-card {
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.2);
}
.section--wine .ticket-card.featured {
  background: rgba(255,255,255,0.22);
  border-color: rgba(255,255,255,0.35);
  box-shadow: none;
}
.section--wine .ticket-card.disabled {
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.1);
}

/* program-topics-claim: wine accent */
.section--anthracite .program-topics-claim .text-marker { color: #a11834; }

/* Ticket cards on anthracite background */
.section--anthracite .ticket-card {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.15);
}
.section--anthracite .ticket-card.featured {
  background: #a11834;
  border-color: #a11834;
  box-shadow: none;
}
.section--anthracite .ticket-card.disabled {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
}
.section--anthracite .ticket-card.ticket-card-wide {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
}

/* Tickets section: gradient background (last 3 sections — no flat dark red) */
#tickets { background: linear-gradient(160deg, #4a4a4a 0%, #333333 60%, #1e1e1e 100%); }

/* "speakeři" / "speakers" marker-tag: wine (dark red) */
#speakers .marker-tag { color: #a11834; }
#speakers { position: relative; overflow: visible; padding-top: 0; padding-bottom: 0; background-color: #1a1a1a; background-image: url('../assets/speakers-network-bg.png'); background-size: 100% auto; background-position: center top; background-repeat: no-repeat; background-attachment: scroll; }
/* Speakers brush dividers */
#speakers .spk-brush {
  display: block;
  width: 100%;
  height: auto;
  line-height: 0;
  margin-bottom: -2px;
}
#speakers .spk-brush--top {
  display: none;
}
#speakers .spk-brush--bottom {
  transform: scaleX(-1) scaleY(0.5);
  transform-origin: top center;
  margin-top: -1px;
  margin-bottom: -40px;
  position: relative;
  z-index: 2;
}
#speakers .spk-content {
  position: relative;
  z-index: 1;
  padding: 32px 0 52px;
}

/* Ticket section heading accent: user wants wine not Apple Red */
#tickets .text-marker { color: #a11834; }
#tickets .text-marker-deep { color: #a11834; }

/* Pro týmy: wine (dark red) card */
#tickets .ticket-card.ticket-card-wide {
  background: #a11834;
  border-color: #a11834;
}
#tickets .ticket-card.ticket-card-wide .ticket-tier { color: rgba(255,255,255,0.75); }
#tickets .ticket-card.ticket-card-wide .ticket-wide-left .ticket-badge-inline { color: #ffffff; }
#tickets .ticket-card.ticket-card-wide .ticket-wide-left .icon { background-color: #ffffff; }
/* Fajfky bílé — wine bg by jinak skryla wine check */
#tickets .ticket-card.ticket-card-wide ul li .check { background-color: #ffffff; }

/* Ticket badges on anthracite: wine accent not Apple Red */
.section--anthracite .ticket-badge .icon,
.section--anthracite .ticket-badge-inline .icon { background-color: #a11834; }
.section--anthracite .ticket-tier { color: rgba(255,255,255,0.7); }
.section--anthracite .ticket-card ul li .check { background-color: #a11834; }
.section--anthracite .ticket-card.featured ul li .check { background-color: var(--white); }

/* Pro tymy card: centered layout */
.section--anthracite .ticket-card.ticket-card-wide {
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.section--anthracite .ticket-card.ticket-card-wide .ticket-wide-right ul {
  align-items: center;
}
.section--anthracite .ticket-card.ticket-card-wide .ticket-wide-right li {
  justify-content: center;
}

/* ============================================================
   Program pillars on white section — light cards, wine accents
   (brand guide: dark-on-dark and red-on-dark are forbidden)
   ============================================================ */
.section--white .format-item {
  background: #a11834;
  border-color: #a11834;
  color: #ffffff;
  border-radius: 0;
  font-family: var(--font-marker);
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: capitalize;
}
.section--white .format-icon { display: none; }

.section--white .pillar {
  background: #ffffff;
  border: 2px solid #a11834;
}
.section--white .pillar::before { display: none; }
.section--white .pillar h3 {
  color: #444444;
  font-family: var(--font-marker);
  font-weight: normal;
  font-size: 26px;
  text-transform: none;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.section--white .pillar p { color: #444444; }
.section--white .pillar-pill {
  background: transparent;
  color: #a11834;
  font-family: var(--font-marker);
  font-size: 20px;
  letter-spacing: 0.08em;
  padding: 0;
  font-weight: normal;
  text-transform: uppercase;
}
.section--white .pillar-icon-wrap { background: #a11834; }
.section--white .pillar-icon-wrap .icon { background-color: #ffffff; }
.section--white .pillar-takeaway-label { color: #888888; font-style: italic; text-transform: none; letter-spacing: 0; font-size: 13px; }
.section--white .pillar ul li { color: #444444; }
.section--white .pillar ul li::before { background: #a11834; }

.section--white .pillar.pillar-wide {
  background: #a11834;
  border-color: #a11834;
  max-width: 100%;
  justify-content: space-between;
}
.section--white .pillar.pillar-wide .pillar-wide-eyebrow {
  display: block;
  font-family: var(--font-marker);
  font-size: 26px;
  color: #ffffff;
  font-style: normal;
  margin-bottom: 8px;
}
.section--white .pillar.pillar-wide .pillar-wide-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 32px;
  color: #ffffff;
  margin: 0;
  text-transform: uppercase;
}
.section--white .pillar.pillar-wide ul li { color: #ffffff; }
.section--white .pillar.pillar-wide ul li::before { background: #ffffff; }

/* ============================================================
   Brand aesthetic: noise/grain texture on dark sections
   Matches the editorial grain look from the Red Button brand guide
   (bg-dark-noise.png 1520×738 RGBA — tiled at half size for density)
   ============================================================ */

/* Hero — grain over the photo background */
.hero-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../assets/bg-dark-noise.png');
  background-size: 760px auto;
  background-repeat: repeat;
  opacity: 0.15;
  pointer-events: none;
  mix-blend-mode: overlay;
  z-index: 1;
}


/* Intro brand wordmark section */
.intro-brand { padding: 80px 0 40px; text-align: center; background-color: #f2ede8; background-image: url('../assets/program-bg.png'); background-size: cover; background-position: center top; }
.intro-wordmark { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.intro-mark-text {
  font-family: var(--font-marker);
  font-size: clamp(64px, 10vw, 140px);
  line-height: 0.95;
  color: var(--ink-9);
  margin: 0;
  font-weight: 400;
  letter-spacing: -1px;
}
.intro-by {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 8px;
}
.intro-logo-img {
  width: min(520px, 80vw);
  height: auto;
  display: block;
  margin: 0 auto;
}

/* Intro text block */
.intro-text {
  margin-top: 64px;
  text-align: center;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}
.intro-eyebrow {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  color: #A11834 !important;
  line-height: 1.15;
  text-transform: lowercase;
  margin: 0 0 14px;
}
.intro-heading {
  font-family: "Rubik", sans-serif;
  font-size: 42px;
  font-weight: 900;
  color: #444;
  line-height: 1.1;
  margin: 0 0 24px;
}
.intro-heading em {
  font-style: normal;
  color: #A11834;
  font-family: var(--font-marker);
  font-weight: 400;
}
.intro-desc {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.6;
  color: #444;
  margin: 0 0 1em;
}
.intro-desc:last-child { margin-bottom: 0; }

/* ============================================================
   Prokoho audience cards
   ============================================================ */
.prokoho-section { padding-top: 0; padding-bottom: 80px; background-color: #f2ede8; background-image: url('../assets/program-bg.png'); background-size: cover; background-position: center bottom; }

/* Shared background wrapper for prokoho + stage sections (used on mobile) */
.prokoho-stage-wrap { display: contents; }

.prokoho-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 20px;
}

.prokoho-card {
  border-radius: 0;
  padding: 28px 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.prokoho-card--wine {
  background: #a11834;
  color: #fff;
}

.prokoho-card--light {
  background: #fff;
  border: 1.5px solid #a11834;
  color: #444444;
}

.prokoho-icon {
  width: 48px;
  height: 48px;
  object-fit: contain;
}
.prokoho-card--wine .prokoho-icon { filter: brightness(0) invert(1); }
.prokoho-card--light .prokoho-icon { filter: none; }

.prokoho-icon--sm { width: 40px; height: 40px; }

.prokoho-card-title {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.15;
  margin: 0;
}
.prokoho-card--wine .prokoho-card-title { color: #fff; }
.prokoho-card--light .prokoho-card-title { color: #444; }

.prokoho-card p {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.65;
  margin: 0;
}
.prokoho-card--wine p { color: rgba(255,255,255,0.9); }
.prokoho-card--light p { color: #444; }

.prokoho-card-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
}

.prokoho-list {
  list-style: none;
  padding: 0;
  margin: 4px 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.prokoho-list li {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.prokoho-list li::before {
  content: '';
  flex-shrink: 0;
  width: 18px;
  height: 17px;
  margin-top: 2px;
  background-image: url("data:image/svg+xml,%3Csvg width%3D%2262%22 height%3D%2257%22 viewBox%3D%220 0 62 57%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M7.73218 29.0256C7.8027 29.0726 7.81448 29.0961 7.86149 29.2137C8.19058 29.9894 8.15531 31.3292 6.23954 31.4115C6.20428 31.4115 6.06322 31.3998 6.00446 31.3762C5.74588 31.1764 5.4168 31.0002 5.38154 30.9884C5.35803 30.9884 5.40504 30.9649 5.34628 31.0119C5.05245 31.1647 4.28849 31.8581 3.8066 32.3048C3.58329 32.5163 3.35997 32.7514 3.17192 32.9629C3.07789 33.0687 2.98388 33.1745 2.92511 33.2685L2.88985 33.3273C2.88985 33.3155 2.88985 33.3155 2.88985 33.3155C2.90161 33.3155 2.87811 33.3743 2.90162 33.4448C2.92512 33.5271 3.0074 33.6916 3.16019 33.8797C3.45402 34.2558 3.91238 34.6554 4.46478 35.149L6.00446 36.5829L12.0691 42.2363L24.1632 53.4959C24.3395 53.6604 24.5863 53.7192 24.8214 53.6722C24.9389 53.6487 25.0447 53.6016 25.127 53.5194C25.1858 53.4606 25.1857 53.4724 25.2798 53.3548L25.5971 52.9552L28.1711 49.7231C29.8753 47.5605 31.556 45.3744 33.2015 43.1765C36.5041 38.7808 39.7128 34.3028 42.8156 29.7543C45.9185 25.2058 48.9156 20.5985 51.8186 15.909C53.2643 13.5701 54.6864 11.2077 56.0733 8.83353L57.1193 7.04705C57.5307 6.31835 58.0008 5.76594 58.2477 5.31932C58.4122 5.02549 58.3299 5.15476 58.3534 5.1195C58.2712 5.02547 58.0713 4.86094 57.8598 4.73166C57.754 4.66114 57.6247 4.59059 57.5072 4.52007L57.0488 4.27326L55.2506 3.28599L54.8392 3.07444L54.4866 3.47405L53.8637 4.22624C53.4523 4.74338 53.0644 5.27229 52.6766 5.81293C51.1604 7.98729 49.703 10.3967 48.2104 12.7121C45.2368 17.3664 42.2162 22.0207 39.1016 26.6044C36.7627 30.0364 34.3651 33.4331 31.8734 36.7593C30.651 38.4282 29.2994 40.0736 28.1593 41.6956C27.5364 42.5536 26.9017 43.4351 25.985 44.2931C25.5148 44.7162 24.9859 45.1628 24.1397 45.4449C23.7401 45.5859 23.176 45.6447 22.6823 45.5389C22.3885 45.4919 22.271 45.4331 22.1064 45.3744L21.648 45.2098C20.4845 44.7045 19.5677 44.0345 18.6862 43.3528L18.2748 43.012C18.0515 42.8357 17.8635 42.6594 17.6637 42.4713C17.2523 42.1187 16.8762 41.7426 16.4766 41.3783C16.4766 41.3783 15.1367 39.8856 13.7616 38.0991C13.0799 37.2176 12.3512 36.2421 11.7283 35.3723C10.1298 33.2685 9.74201 32.5163 10.1416 32.4928C10.5295 32.4811 11.7048 33.245 12.9624 34.3263C12.8801 34.1853 14.0907 35.3018 15.4071 36.5359C16.1945 37.2529 17.029 38.0168 17.6637 38.6045C18.3101 39.1686 18.7567 39.5448 18.7567 39.5448C19.0976 39.8739 19.4384 40.1794 19.791 40.485C19.9673 40.6378 20.1436 40.7906 20.3199 40.9316L20.696 41.2372C21.0486 41.4958 21.4012 41.7779 21.7656 41.9894C22.4002 42.4361 23.458 42.8004 23.2582 42.6711C23.552 42.6124 24.2455 41.9894 24.7744 41.3312C25.3385 40.6496 25.8674 39.8856 26.4551 39.0629L29.9693 34.4203C32.2612 31.3175 34.4943 28.1676 36.6687 24.9707C39.7598 20.4222 42.7569 15.7915 45.7305 11.1489C47.2349 8.82178 48.6335 6.49463 50.279 4.13223C50.6903 3.54457 51.1134 2.96866 51.5718 2.4045L52.277 1.55826L52.6413 1.14689C52.8176 0.958842 53.088 0.641496 53.3348 0.47695C53.8167 -0.00493273 54.4984 -0.0872012 55.133 0.0773443C55.4504 0.17137 55.7795 0.300653 56.0851 0.441692L56.6022 0.700265L58.4357 1.71106L58.8823 1.95787C59.0586 2.0519 59.2467 2.1577 59.423 2.27523C59.7873 2.5103 60.1399 2.7571 60.5278 3.18022C60.9979 3.69736 61.3153 4.3438 61.3035 5.02549C61.3388 5.68367 60.9626 6.47111 60.7746 6.76494C60.328 7.52891 59.9049 8.02256 59.6463 8.50444L58.6002 10.3027C57.2016 12.7003 55.756 15.0628 54.3103 17.4369C51.3955 22.15 48.3632 26.8042 45.2368 31.388C42.1104 35.9718 38.8783 40.485 35.5521 44.916C33.8832 47.1374 32.2025 49.3352 30.4865 51.5096L27.9008 54.7652L27.5717 55.1766C27.4541 55.3294 27.2073 55.5879 27.0075 55.7642C26.5609 56.1286 26.0202 56.3872 25.4678 56.5047C24.3513 56.7633 23.1172 56.4459 22.2592 55.682L10.0828 44.3518L4.01815 38.6985L2.52551 37.3117C2.04362 36.8768 1.44421 36.3831 0.880058 35.6662C0.59798 35.3018 0.315896 34.867 0.139597 34.2911C-0.0367014 33.7034 -0.0601964 33.0452 0.151362 32.387C0.198375 32.2225 0.268874 32.0579 0.351147 31.9169C0.386407 31.8464 0.433414 31.7641 0.49218 31.6936L0.597955 31.5408C0.738994 31.3528 0.868287 31.1882 1.00933 31.0472C1.2679 30.7533 1.52646 30.483 1.80854 30.2127C2.52549 29.5898 2.91337 29.1196 4.00643 28.4379C4.6411 28.0736 5.55783 27.9325 6.29829 28.2146C7.00348 28.4614 7.34433 28.7435 7.73218 29.0256Z%22 fill%3D%22%23a11834%22%2F%3E%3C%2Fsvg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}
.prokoho-card--wine .prokoho-list li { color: rgba(255,255,255,0.9); }
.prokoho-card--wine .prokoho-list li::before {
  background-image: url("data:image/svg+xml,%3Csvg width%3D%2262%22 height%3D%2257%22 viewBox%3D%220 0 62 57%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M7.73218 29.0256C7.8027 29.0726 7.81448 29.0961 7.86149 29.2137C8.19058 29.9894 8.15531 31.3292 6.23954 31.4115C6.20428 31.4115 6.06322 31.3998 6.00446 31.3762C5.74588 31.1764 5.4168 31.0002 5.38154 30.9884C5.35803 30.9884 5.40504 30.9649 5.34628 31.0119C5.05245 31.1647 4.28849 31.8581 3.8066 32.3048C3.58329 32.5163 3.35997 32.7514 3.17192 32.9629C3.07789 33.0687 2.98388 33.1745 2.92511 33.2685L2.88985 33.3273C2.88985 33.3155 2.88985 33.3155 2.88985 33.3155C2.90161 33.3155 2.87811 33.3743 2.90162 33.4448C2.92512 33.5271 3.0074 33.6916 3.16019 33.8797C3.45402 34.2558 3.91238 34.6554 4.46478 35.149L6.00446 36.5829L12.0691 42.2363L24.1632 53.4959C24.3395 53.6604 24.5863 53.7192 24.8214 53.6722C24.9389 53.6487 25.0447 53.6016 25.127 53.5194C25.1858 53.4606 25.1857 53.4724 25.2798 53.3548L25.5971 52.9552L28.1711 49.7231C29.8753 47.5605 31.556 45.3744 33.2015 43.1765C36.5041 38.7808 39.7128 34.3028 42.8156 29.7543C45.9185 25.2058 48.9156 20.5985 51.8186 15.909C53.2643 13.5701 54.6864 11.2077 56.0733 8.83353L57.1193 7.04705C57.5307 6.31835 58.0008 5.76594 58.2477 5.31932C58.4122 5.02549 58.3299 5.15476 58.3534 5.1195C58.2712 5.02547 58.0713 4.86094 57.8598 4.73166C57.754 4.66114 57.6247 4.59059 57.5072 4.52007L57.0488 4.27326L55.2506 3.28599L54.8392 3.07444L54.4866 3.47405L53.8637 4.22624C53.4523 4.74338 53.0644 5.27229 52.6766 5.81293C51.1604 7.98729 49.703 10.3967 48.2104 12.7121C45.2368 17.3664 42.2162 22.0207 39.1016 26.6044C36.7627 30.0364 34.3651 33.4331 31.8734 36.7593C30.651 38.4282 29.2994 40.0736 28.1593 41.6956C27.5364 42.5536 26.9017 43.4351 25.985 44.2931C25.5148 44.7162 24.9859 45.1628 24.1397 45.4449C23.7401 45.5859 23.176 45.6447 22.6823 45.5389C22.3885 45.4919 22.271 45.4331 22.1064 45.3744L21.648 45.2098C20.4845 44.7045 19.5677 44.0345 18.6862 43.3528L18.2748 43.012C18.0515 42.8357 17.8635 42.6594 17.6637 42.4713C17.2523 42.1187 16.8762 41.7426 16.4766 41.3783C16.4766 41.3783 15.1367 39.8856 13.7616 38.0991C13.0799 37.2176 12.3512 36.2421 11.7283 35.3723C10.1298 33.2685 9.74201 32.5163 10.1416 32.4928C10.5295 32.4811 11.7048 33.245 12.9624 34.3263C12.8801 34.1853 14.0907 35.3018 15.4071 36.5359C16.1945 37.2529 17.029 38.0168 17.6637 38.6045C18.3101 39.1686 18.7567 39.5448 18.7567 39.5448C19.0976 39.8739 19.4384 40.1794 19.791 40.485C19.9673 40.6378 20.1436 40.7906 20.3199 40.9316L20.696 41.2372C21.0486 41.4958 21.4012 41.7779 21.7656 41.9894C22.4002 42.4361 23.458 42.8004 23.2582 42.6711C23.552 42.6124 24.2455 41.9894 24.7744 41.3312C25.3385 40.6496 25.8674 39.8856 26.4551 39.0629L29.9693 34.4203C32.2612 31.3175 34.4943 28.1676 36.6687 24.9707C39.7598 20.4222 42.7569 15.7915 45.7305 11.1489C47.2349 8.82178 48.6335 6.49463 50.279 4.13223C50.6903 3.54457 51.1134 2.96866 51.5718 2.4045L52.277 1.55826L52.6413 1.14689C52.8176 0.958842 53.088 0.641496 53.3348 0.47695C53.8167 -0.00493273 54.4984 -0.0872012 55.133 0.0773443C55.4504 0.17137 55.7795 0.300653 56.0851 0.441692L56.6022 0.700265L58.4357 1.71106L58.8823 1.95787C59.0586 2.0519 59.2467 2.1577 59.423 2.27523C59.7873 2.5103 60.1399 2.7571 60.5278 3.18022C60.9979 3.69736 61.3153 4.3438 61.3035 5.02549C61.3388 5.68367 60.9626 6.47111 60.7746 6.76494C60.328 7.52891 59.9049 8.02256 59.6463 8.50444L58.6002 10.3027C57.2016 12.7003 55.756 15.0628 54.3103 17.4369C51.3955 22.15 48.3632 26.8042 45.2368 31.388C42.1104 35.9718 38.8783 40.485 35.5521 44.916C33.8832 47.1374 32.2025 49.3352 30.4865 51.5096L27.9008 54.7652L27.5717 55.1766C27.4541 55.3294 27.2073 55.5879 27.0075 55.7642C26.5609 56.1286 26.0202 56.3872 25.4678 56.5047C24.3513 56.7633 23.1172 56.4459 22.2592 55.682L10.0828 44.3518L4.01815 38.6985L2.52551 37.3117C2.04362 36.8768 1.44421 36.3831 0.880058 35.6662C0.59798 35.3018 0.315896 34.867 0.139597 34.2911C-0.0367014 33.7034 -0.0601964 33.0452 0.151362 32.387C0.198375 32.2225 0.268874 32.0579 0.351147 31.9169C0.386407 31.8464 0.433414 31.7641 0.49218 31.6936L0.597955 31.5408C0.738994 31.3528 0.868287 31.1882 1.00933 31.0472C1.2679 30.7533 1.52646 30.483 1.80854 30.2127C2.52549 29.5898 2.91337 29.1196 4.00643 28.4379C4.6411 28.0736 5.55783 27.9325 6.29829 28.2146C7.00348 28.4614 7.34433 28.7435 7.73218 29.0256Z%22 fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E");
}
.prokoho-card--light .prokoho-list li { color: #444; }

.prokoho-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 20px;
  border-radius: 6px;
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  margin-top: auto;
  align-self: stretch;
  text-align: center;
}
.prokoho-btn--outline {
  background: transparent;
  border: 2px solid #FE1A3F;
  color: #FE1A3F;
}
.prokoho-btn--filled {
  background: #FE1A3F;
  border: 2px solid #FE1A3F;
  color: #fff;
}

/* Wide Red Button ekosystém card */
.prokoho-wide {
  background: #fff;
  border: 1.5px solid #a11834;
  border-radius: 0;
  padding: 28px 32px;
  display: flex;
  align-items: center;
  gap: 32px;
}
.prokoho-wide-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.prokoho-wide-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.prokoho-wide-title {
  font-family: var(--font-marker);
  font-size: 22px;
  font-weight: 400;
  color: #a11834;
  margin: 0;
  white-space: nowrap;
}
.prokoho-wide-body {
  flex: 1;
}
.prokoho-wide-body p {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.65;
  color: #444;
  margin: 0 0 6px;
}
.prokoho-wide-body p:last-child { margin-bottom: 0; }
.prokoho-wide-btn { flex-shrink: 0; white-space: nowrap; width: auto !important; }
.prokoho-wide .prokoho-icon--sm { filter: none; }
.prokoho-btn-card {
  width: 100% !important;
  margin-top: 18px;
}
.prokoho-wide-btn {
  width: 191px !important;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .prokoho-grid { grid-template-columns: 1fr; }
  .prokoho-wide { flex-direction: column; align-items: flex-start; }
  .prokoho-wide-btn { align-self: stretch; text-align: center; }
}

/* Wine + anthracite sections */
.section--wine,
.section--anthracite { position: relative; }
.section--wine::before,
.section--anthracite::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../assets/bg-dark-noise.png');
  background-size: 760px auto;
  background-repeat: repeat;
  opacity: 0.08;
  pointer-events: none;
  mix-blend-mode: overlay;
  z-index: 0;
}
/* Containers stay above the grain layer */
.section--wine > .container,
.section--anthracite > .container { position: relative; z-index: 1; }

/* White network — below video, in added bottom padding */
.section-video-ref {
  padding-bottom: 80px !important;
}
.section-video-ref::after { display: none; }

/* ============================================================
   Gallery photos on wine section — B&W + wine tint overlay
   Matches brand guide banner: desaturated photo with wine wash
   ============================================================ */
.section--wine .photo-tile { border-color: rgba(255,255,255,0.12); background: rgba(0,0,0,0.3); }
.section--wine .photo-tile img { filter: saturate(0) contrast(1.05) brightness(0.9); }
.section--wine .photo-tile::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(161, 24, 52, 0.30);
  pointer-events: none;
  z-index: 1;
}

/* Net/grid pattern divider at top of section */
.section--net-top::before {
  content: '';
  display: block;
  width: 100%;
  height: 48px;
  background: url('../zakladni-sit-presets/zakladni-sit-32px.png') repeat-x center;
  opacity: 0.18;
  margin-bottom: 0;
}
/* Net overlay on section — brand-guide layout shows the grid prominently */
.section--net {
  position: relative;
}
.section--net::after {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../zakladni-sit-presets/zakladni-sit-64px.png') repeat;
  opacity: 0.07;      /* dark/wine sections: visible but not overwhelming */
  pointer-events: none;
  z-index: 0;
}
/* White sections: network is darker relative to bg, so needs more opacity to match brand example */
.section--white.section--net::after {
  background: url('../zakladni-sit-presets/zakladni-sit-32px.png') repeat;
  opacity: 0.12;
}
.section--net > * { position: relative; z-index: 1; }

/* RB ikona — absolut. prvek uvnitř section--net (přepisuje > * rule) */
.section--net > .section-bg-net-left {
  position: absolute;
  bottom: 24px;
  left: 24px;
  width: min(220px, 18%);
  height: auto;
  aspect-ratio: 1 / 1;
  background-image: url('../assets/rb-mark.webp');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.22;
  pointer-events: none;
  z-index: 0;
}

/* ============================================================
   Red accent bars — brand guide brush-stroke dividers
   Add class .section--accent-top to any section for a top
   wine-red marker/bar accent (inspired by brand torn-paper divider)
   ============================================================ */
.section--accent-top {
  padding-top: 0 !important;
}
.section--accent-top > .container {
  padding-top: inherit;
  position: relative;
}
.section--accent-top > .container::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, transparent 0%, #a11834 8%, #a11834 92%, transparent 100%);
  border-radius: 2px;
}

/* ============================================================
   Dashed marker divider — brand-guide hand-drawn line accent
   Usage: <div class="marker-divider"></div> between sections
   ============================================================ */
.marker-divider {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 0;
}
.marker-divider::before {
  content: '';
  display: block;
  width: min(400px, 60%);
  height: 3px;
  background-image: url('../assets/icons/dashed-divider.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  opacity: 0.6;
}

/* =============================================================
   Section heading + marker label combo
   ============================================================= */
.heading-with-marker {
  display: flex;
  align-items: baseline;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.heading-with-marker h2 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(40px, 5.5vw, 64px);
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--white);
  margin: 0;
}
.marker-tag {
  position: relative;
  display: inline-block;
  font-family: var(--font-marker);
  font-size: 56px;
  color: var(--accent);
  line-height: 1;
  transform: rotate(-3deg);
}
.marker-tag .marker-arrow {
  position: absolute;
  right: -32px; top: -28px;
  width: 44px; height: 44px;
  transform: rotate(12deg);
}

/* =============================================================
   About
   ============================================================= */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
}
.about-content .h2 { margin-bottom: 24px; }
.about-content .paragraph { margin-top: 20px; }

.about-features-title {
  font-family: var(--font-marker);
  font-size: 32px;
  color: var(--accent);
  transform: rotate(-2deg);
  display: inline-block;
  margin: 0 0 28px;
}
.feature-card {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid var(--stroke);
}
.feature-card:last-child { border-bottom: none; }
.feature-icon {
  font-family: var(--font-marker);
  color: var(--accent);
  font-size: 22px;
  line-height: 1.4;
}
.feature-card p {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink-9);
}

/* About – new 3-box layout */
.about-section-heading {
  text-align: center;
  margin-bottom: 56px;
}
.about-boxes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 32px;
}
.about-box {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--stroke);
  border-radius: 8px;
  padding: 32px 28px;
}
.about-box h3 {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.4;
  color: #ffffff;
  margin: 0 0 16px;
}
.about-box p {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.7;
  color: var(--ink-9);
}
.about-rule {
  height: 1px;
  background: rgba(255,255,255,0.1);
  margin: 44px 0 0;
}
.about-closing {
  margin: 28px auto 0;
  max-width: 600px;
  text-align: center;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.22;
  color: #ffffff;
}
@media (max-width: 768px) {
  .about-boxes { grid-template-columns: 1fr; }
}


/* =============================================================
   H→T section
   ============================================================= */
.ht-section {
  padding: 100px 0 100px;
  position: relative;
  overflow: hidden;
}
.ht-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('../zakladni-sit-presets/zakladni-sit-64px.png');
  background-repeat: repeat;
  background-position: center center;
  background-size: auto;
  opacity: 0.18;
  -webkit-mask-image: none;
  mask-image: none;
  pointer-events: none;
}
/* Bílá síť vlevo — spodní polovina sekce, bílá, výrazná */
.ht-section::after {
  content: '';
  position: absolute;
  top: 48%;
  bottom: 0;
  left: -20px;
  width: min(420px, 34%);
  background-image: url('../assets/network-white.webp');
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
  opacity: 0.38;
  pointer-events: none;
  z-index: 0;
}
.ht-section .container { position: relative; z-index: 1; }
.ht-body p:last-child { margin-bottom: 0; padding-bottom: 0; }
.ht-eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 32px;
}
.ht-letter {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 72px;
  line-height: 1;
  color: #ffffff;
  letter-spacing: -0.02em;
}
.ht-letter.accent { color: var(--accent); }
.ht-arrow {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 40px;
  color: var(--accent);
}
.ht-heading {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(28px, 5vw, 48px);
  line-height: 1.15;
  color: #ffffff;
  text-align: center;
  margin: 0 0 32px;
}
.ht-body {
  max-width: 700px;
  margin: 0 auto;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.8;
  color: var(--ink-9);
  text-align: center;
}
.ht-body p { margin: 0 0 16px; }
.ht-body p:last-child { margin: 0; }

/* H→T pillar — white background variant */
.ht-pillar { padding: 80px 0; }
.ht-pillar-inner { text-align: center; max-width: 900px; margin: 0 auto; }
.ht-monogram {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin: 0 0 16px;
}
.ht-pillar .ht-letter {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(56px, 9vw, 96px);
  line-height: 1;
  color: var(--ink, #444444);
  letter-spacing: -0.02em;
}
.ht-arrow-img {
  width: clamp(48px, 7vw, 88px);
  height: auto;
  flex-shrink: 0;
  margin-top: 4px;
}
.ht-pillar .ht-heading {
  color: var(--ink);
  margin: 0 0 24px;
}
.ht-pillar .ht-heading .marker-em {
  font-family: var(--font-marker);
  font-style: normal;
  color: #a11834;
  letter-spacing: 0.02em;
}
.ht-desc {
  font-family: var(--font-body);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.8;
  color: var(--ink-7, #444);
  text-align: center;
  max-width: 1060px;
  margin: 0 auto;
}

/* =============================================================
   Audience cards
   ============================================================= */
.audience-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}
.audience-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.audience-card {
  background: var(--ink-3);
  border: 1px solid var(--stroke);
  border-radius: var(--r-1);
  padding: 40px 36px;
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  overflow: hidden;
}
.audience-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: rgba(255,255,255,0.06);
}
.audience-number {
  font-family: var(--font-marker);
  color: var(--accent);
  font-size: 56px;
  line-height: 1;
  transform: rotate(-3deg);
  display: inline-block;
  margin-bottom: 24px;
}
.audience-card h3 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 28px;
  letter-spacing: -0.01em;
  color: var(--white);
  margin: 0;
}
.audience-card p {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-9);
  margin: 0;
}
.audience-takeaway-label {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--red-deep);
  margin-top: 8px !important;
}
.audience-takeaway-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.audience-takeaway-list li {
  position: relative;
  padding-left: 22px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-9);
}
.audience-takeaway-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 9px;
  width: 14px; height: 2px;
  background: var(--accent);
  transform: rotate(-3deg);
}

/* Audience – new layout */
.audience-cards-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 24px;
  row-gap: 16px;
  margin-bottom: 24px;
}
.audience-cards-3 .audience-card {
  grid-row: span 7;
  display: grid;
  grid-template-rows: subgrid;
}
.audience-card-spacer {
  display: block;
  height: 0;
  margin: 0;
  padding: 0;
}
.audience-card-wide {
  background: var(--ink-3);
  border: 1px solid var(--stroke);
  border-radius: var(--r-1);
  padding: 40px 36px;
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: start;
}
.audience-card-wide::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: rgba(255,255,255,0.06);
}
.audience-red-list {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.audience-red-list li {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.5;
  color: var(--white);
  padding-left: 20px;
  position: relative;
}
.audience-red-list li::before {
  content: "●";
  position: absolute;
  left: 0;
  color: var(--accent);
  font-size: 10px;
  top: 3px;
}
.audience-claim {
  margin-top: 48px;
  text-align: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  line-height: 1.5;
  color: #ffffff;
}
@media (max-width: 900px) {
  .audience-cards-3 { grid-template-columns: 1fr; }
  .audience-cards-3 .audience-card { grid-row: span 1; grid-template-rows: auto; gap: 16px; }
  .audience-card-wide { grid-template-columns: 1fr; }
}

/* =============================================================
   Speakers
   ============================================================= */
.speakers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 32px;
}
.speaker-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: transparent;
  border: none;
  padding: 0;
  text-align: center;
}
.speaker-photo-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
}
.speaker-photo {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  background: var(--ink-3);
}
.speaker-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 350ms var(--ease-out);
}
.speaker-card:hover .speaker-photo img { transform: scale(1.04); }

.speaker-photo--bw img {
  filter: grayscale(1) contrast(1.05);
}
.speaker-photo--duotone::after {
  content: "";
  position: absolute; inset: 0;
  background: rgb(190,4,28);
  mix-blend-mode: soft-light;
}
.speaker-photo--duotone::before {
  content: "";
  position: absolute; inset: 0;
  background: rgb(161,24,52);
  mix-blend-mode: color;
  z-index: 1;
}
.speaker-frame {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  pointer-events: none;
}
.speaker-card:nth-child(1) .speaker-frame { transform: rotate(0deg); }
.speaker-card:nth-child(2) .speaker-frame { transform: rotate(94deg); }
.speaker-card:nth-child(3) .speaker-frame { transform: rotate(188deg); }
.speaker-card:nth-child(4) .speaker-frame { transform: rotate(282deg); }
.speaker-card:nth-child(5) .speaker-frame { transform: rotate(45deg); }
.speaker-card:nth-child(6) .speaker-frame { transform: rotate(135deg); }

.speaker-name {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 18px;
  color: var(--white);
  line-height: 1.2;
}
.speaker-role {
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--ink-8);
  text-transform: uppercase;
  margin-top: 8px;
  display: block;
}
.speaker-topic {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--ink-9);
  margin-top: 8px;
  line-height: 1.4;
}

.speakers-cta {
  margin-top: 56px;
  text-align: center;
  font-family: var(--font-marker);
  color: #ffffff;
  font-size: 28px;
  transform: rotate(-1deg);
  display: block;
}

/* CTA vedle Petra Skondrojanise — grid buňka vedle posledního speakera */
.speaker-cta-cell {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 16px 0 16px 96px;
}
.speaker-cta-cell .speakers-cta {
  white-space: nowrap;
}

/* Past speakers strip */
/* Reference video section */
.video-wrap {
  width: min(840px, 82%);
  margin: 40px auto 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 56px rgba(0,0,0,0.7);
  aspect-ratio: 16 / 9;
}
.video-wrap video,
.video-wrap iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
}
@media (max-width: 768px) {
  .video-wrap { width: 100%; }
}

.past-speakers-track {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
}
.past-speaker {
  width: 130px;
  text-align: center;
}
.past-speaker-photo {
  width: 110px; height: 110px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: var(--ink-3);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-marker);
  color: var(--accent);
  font-size: 32px;
  border: 1.5px solid var(--stroke);
}
.past-speaker-name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 14px;
  color: var(--white);
}
.past-speaker-company {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-8);
  margin-top: 2px;
}

/* =============================================================
   Photo banner — full bleed, red duotone, "MĚNÍME SVĚT BYZNYSU"
   ============================================================= */
.photo-banner {
  position: relative;
  min-height: 540px;
  display: flex;
  align-items: center;
  padding: 0 48px;
  overflow: hidden;
  background: url('../assets/stage-photo.png') center/cover;
}
.photo-banner::before {
  content: "";
  position: absolute; inset: 0;
  background: rgb(190,4,28);
  mix-blend-mode: soft-light;
}
.photo-banner::after {
  content: "";
  position: absolute; inset: 0;
  background: rgb(161,24,52);
  mix-blend-mode: color;
}
.photo-banner-shade {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0.55) 0%, transparent 60%);
}
.photo-banner-content {
  position: relative; z-index: 2;
  max-width: var(--container);
  margin: 0 auto;
  width: 100%;
  padding: 80px 0;
}
.photo-banner-eyebrow {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 28px;
}
.photo-banner-marker {
  font-family: var(--font-marker);
  font-size: 36px;
  color: var(--white);
  line-height: 1.05;
  transform: rotate(-4deg);
  display: inline-block;
}
.photo-banner-rule {
  flex: 1;
  height: 2px;
  background: var(--white);
  max-width: 360px;
  opacity: 0.85;
}
.photo-banner h2 {
  font-family: var(--font-body);
  font-weight: 900;
  font-size: clamp(48px, 6vw, 76px);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: var(--white);
  margin: 0 0 40px;
  text-shadow: var(--shadow-text);
  max-width: 700px;
  text-transform: uppercase;
}

/* =============================================================
   Program — three pillars
   ============================================================= */
.program-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  margin-bottom: 48px;
}
.program-header-text {
  flex: 0 0 65%;
  max-width: 65%;
}
.program-header-illus {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}
.program-puzzle-img {
  width: 442px;
  height: 442px;
  transform: rotate(5.52deg);
  display: block;
}

.program-formats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  width: 100%;
  margin-bottom: 64px;
}
.program-formats .format-item {
  flex: 1;
  justify-content: center;
}
.format-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 43px;
  padding: 6px 12px 9px;
  background: #a11834;
  border: none;
  border-radius: 0;
  font-family: var(--font-marker);
  font-weight: 400;
  font-style: normal;
  font-size: 26px;
  line-height: 1.15;
  color: #ffffff;
  white-space: nowrap;
}
.format-icon { display: none; }

.pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.pillar {
  background: var(--ink-3);
  border: 1px solid var(--stroke);
  border-radius: var(--r-1);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  overflow: hidden;
}
.pillar::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: rgba(255,255,255,0.06);
}
.pillar-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
.pillar-pill {
  padding: 4px 10px;
  background: var(--accent);
  color: var(--white);
  border-radius: 4px;
}
.pillar-time { color: var(--ink-8); }
.pillar h3 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 32px;
  letter-spacing: -0.01em;
  color: var(--white);
  margin: 0;
}
.pillar-heading {
  display: flex;
  align-items: center;
  gap: 16px;
}
.pillar-icon-wrap {
  width: 64px; height: 64px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(227,0,58,0.1);
  border-radius: 50%;
}
.pillar-icon-wrap .icon {
  width: 32px; height: 32px;
  background-color: var(--accent);
}
.pillar p {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-9);
  margin: 0;
}
.pillar-takeaway-label {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--red-deep);
  margin-top: 8px !important;
  white-space: nowrap;
}
.pillar ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pillar ul li {
  position: relative;
  padding-left: 20px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 13px;
  line-height: 1.5;
  color: var(--fg);
}
.pillar ul li::before {
  content: "";
  position: absolute;
  left: 0; top: 8px;
  width: 12px; height: 2px;
  background: var(--accent);
  transform: rotate(-4deg);
}

/* Wide experience zones card below pillars */
.pillars + .pillars {
  margin-top: 24px;
}
.pillar.pillar-wide {
  grid-column: 1 / -1;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 32px 32px 32px 32px;
  gap: 48px;
  max-width: 100%;
  width: 100%;
  border: 4px solid #a11834;
  background-color: #a11834;
  background-image: url('../assets/vip-bg.png');
  background-size: cover;
  background-position: center;
  position: relative;
}
.pillar.pillar-wide .pillar-wide-label {
  flex: 0 0 auto;
}
.pillar.pillar-wide .pillar-wide-eyebrow {
  display: block;
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  line-height: 1.15;
  color: #ffffff;
  margin-bottom: 8px;
}
.pillar.pillar-wide .pillar-wide-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #ffffff;
  margin: 0;
}
.pillar.pillar-wide ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  margin-right: 5%;
  padding: 0;
  list-style: none;
  flex: 0 0 auto;
}
.pillar.pillar-wide ul li {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.2;
  color: #ffffff;
  padding-left: 20px;
  position: relative;
}
.pillar.pillar-wide ul li::before {
  content: "";
  position: absolute;
  left: 0; top: 8px;
  width: 10px; height: 2px;
  background: #ffffff;
  transform: rotate(-3deg);
}

.program-claim {
  margin-top: 56px;
  text-align: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  color: var(--ink-9);
}
.program-claim strong {
  font-weight: 900;
  color: var(--white);
}

.program-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 32px;
  flex-wrap: wrap;
}
.flow-step {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 20px;
  border: 1px solid var(--stroke);
  border-radius: 4px;
  background: var(--ink-2);
}
.flow-number {
  font-family: var(--font-marker);
  color: var(--accent);
  font-size: 24px;
  line-height: 1;
}
.flow-text {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--white);
}
.flow-arrow {
  font-family: var(--font-marker);
  color: var(--accent);
  font-size: 32px;
}

/* =============================================================
   Program topics block
   ============================================================= */
/* Bílá síť vpravo nahoře — zrcadlená (scaleX(-1)), text je nad ní */
.program-topics-wrap {
  position: relative;
  overflow: hidden;
}
.program-topics-wrap > .container {
  position: relative;
  z-index: 1;
}
.program-topics-wrap::after {
  content: '';
  position: absolute;
  right: -20px;
  top: 7%;
  width: min(460px, 38%);
  height: 52%;
  background-image: url('../assets/network-white.webp');
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: right top;
  transform: scaleX(-1);
  opacity: 0.55;
  pointer-events: none;
  z-index: 0;
}

.program-topics {
  margin-top: 64px;
  padding-top: 56px;
  border-top: 1px solid var(--stroke);
}
.program-topics-heading {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(22px, 3.5vw, 36px);
  line-height: 1.2;
  color: var(--white);
  margin-top: 16px;
  letter-spacing: -0.01em;
}
.program-topics-intro {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--white);
  margin-top: 12px;
}
.program-topics-list {
  list-style: none;
  padding: 0;
  margin: 32px 0 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 48px;
}
.program-topics-list li {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink-9);
  padding-left: 22px;
  position: relative;
}
.program-topics-list li::before {
  content: "●";
  position: absolute;
  left: 0;
  color: var(--accent);
  font-size: 10px;
  top: 4px;
}
.program-topics-claim {
  margin-top: 56px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  line-height: 1.5;
  color: var(--white);
  text-align: center;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

/* =============================================================
   Section prose (generic multi-paragraph text block)
   ============================================================= */
.section-prose {
  max-width: 680px;
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.section-prose p {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.7;
  color: var(--white);
}
.section-prose p.prose-highlight {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(18px, 2.3vw, 22px);
  color: var(--white);
  border-left: 3px solid var(--accent);
  padding-left: 16px;
  margin-top: 4px;
}
.section-prose.center {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  align-items: center;
}
.section-prose.center p.prose-highlight {
  border-left: none;
  padding-left: 0;
}

/* =============================================================
   Tickets / pricing
   ============================================================= */
.tickets-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Wide team ticket — spans the 2 middle columns of the 4-column grid */
.ticket-card.ticket-card-wide {
  grid-column: 2 / 4;
  flex-direction: row;
  align-items: stretch;
  text-align: left;
  padding: 36px 48px;
  gap: 48px;
}
.ticket-card.ticket-card-wide .ticket-wide-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  flex-shrink: 0;
  min-width: 200px;
}
.ticket-card.ticket-card-wide .ticket-wide-left .ticket-badge-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
}
.ticket-card.ticket-card-wide .ticket-wide-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.ticket-card.ticket-card-wide .ticket-wide-right ul {
  flex: 1;
  margin: 0;
}
.ticket-card.ticket-card-wide .ticket-wide-right .btn {
  flex-shrink: 0;
}
.ticket-card {
  background: var(--ink-3);
  border: 1px solid var(--stroke);
  border-radius: var(--r-1);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 20px;
  box-shadow: var(--shadow-card);
  position: relative;
}
.ticket-card.featured {
  background: var(--accent);
  border: 2px solid var(--accent);
  box-shadow: 0 0 40px rgba(227,0,58,0.3);
}
.ticket-card.disabled { opacity: 0.6; }
.ticket-badge {
  position: absolute;
  top: -18px; right: 24px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-marker);
  font-size: 22px;
  color: var(--white);
  transform: rotate(-6deg);
  background: var(--ink-2);
  padding: 4px 12px 4px 10px;
  border-radius: 4px;
}
.ticket-badge .icon {
  width: 22px; height: 22px;
  background-color: var(--accent);
}
.ticket-card.featured .ticket-badge {
  color: var(--white);
}
.ticket-tier {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--red-deep);
}
.ticket-card.featured .ticket-tier { color: var(--white); }
.ticket-price {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 48px;
  line-height: 1;
  color: var(--white);
  letter-spacing: -0.01em;
}
.ticket-price .currency {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--ink-9);
  margin-left: 4px;
}
.ticket-card.featured .ticket-price .currency { color: var(--white); opacity: 0.85; }
.ticket-card ul {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.ticket-card ul li {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--ink-9);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  line-height: 1.4;
  text-align: left;
}
.ticket-card.featured ul li { color: var(--white); }
.ticket-card ul li .check {
  width: 16px; height: 16px;
  flex-shrink: 0;
  background-color: var(--accent);
  -webkit-mask: url('../assets/icons/check.svg') no-repeat center / contain;
  mask: url('../assets/icons/check.svg') no-repeat center / contain;
}
.ticket-card.featured ul li .check { background-color: var(--white); }
.ticket-soon {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-7);
  margin: 0;
  letter-spacing: 0.05em;
}
.ticket-card .btn { align-self: center; margin-top: auto; }

/* =============================================================
   Tickets v2 redesign (tix-v2)
   ============================================================= */
#tickets.tix-v2 {
  background-color: #f2ede8;
  background-image: url('../assets/program-bg.png');
  background-size: cover;
  background-position: center;
  position: relative;
  overflow: visible;
}
.tix-bg-photo {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 389px;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.tix-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  display: block;
}
.tix-bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 389px;
  background: rgba(0, 0, 0, 0.55);
  pointer-events: none;
  z-index: 1;
}
#tickets.tix-v2 > .container { position: relative; z-index: 2; }

/* Torn top edge for tickets section */
.tix-tear-top {
  position: absolute;
  top: -98px;
  left: 0;
  width: 100%;
  height: 100px;
  background-image: url("../assets/tix-tear-top.svg");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 2;
}

.tix-header {
  text-align: center;
  margin-bottom: 48px;
}
.tix-header .marker-em {
  font-family: var(--font-marker);
  color: #a11834;
  font-style: italic;
}

.tix-row {
  display: grid;
  gap: 32px;
  margin-bottom: 32px;
}
.tix-row--3 { grid-template-columns: repeat(3, 1fr); }
.tix-row--2 {
  grid-template-columns: repeat(2, 1fr);
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
  gap: 40px;
}

.tix-card {
  display: flex;
  flex-direction: column;
  border-radius: 0;
  text-align: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
.tix-card--white {
  background: #ffffff;
  padding: 32px 36px;
  gap: 24px;
  border: 4px solid #a11834;
}
.tix-card--white .tix-card-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}
.tix-card--sold-out {
  z-index: 2;
}
.tix-card--sold-out .tix-card-body {
  opacity: 0.4;
}
.tix-badge--sold-out {
  background: #888888;
  color: #ffffff;
}
.tix-card--team {
  background: #ffffff;
  padding: 0;
  overflow: visible;
  border: 4px solid #a11834;
}
.tix-card--team .tix-card-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 32px 36px;
  flex: 1;
  align-items: center;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.tix-card--featured {
  background: #a11834;
  padding: 32px 36px;
  gap: 24px;
  border: 4px solid #a11834;
}
.tix-card--featured .tix-card-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex: 1;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

/* Badges */
.tix-badge {
  display: inline-block;
  background: #a11834;
  color: #ffffff;
  font-family: var(--font-marker);
  font-size: 26px;
  padding: 6px 24px 9px;
  line-height: 1.15;
  letter-spacing: 0;
  border-radius: 0;
}
.tix-badge--featured {
  background: #ffffff;
  color: #a11834;
}

/* Price info block inside card */
.tix-card-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  width: 100%;
}

.tix-price {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #444444;
  letter-spacing: 0;
}
.tix-card--featured .tix-price { color: #ffffff; }

.tix-currency {
  font-size: 42px;
  font-weight: 900;
}

.tix-tier {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;
  color: #a11834;
}
.tix-card--featured .tix-tier { color: #ffffff; }

.tix-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  width: 100%;
}
.tix-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #444444;
  line-height: 1.6;
  text-align: left;
}
.tix-card--featured .tix-list li { color: #ffffff; }
.tix-card--featured .tix-list { gap: 8px; }

.tix-list li::before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 27px;
  height: 24px;
  background-image: url('../assets/checkmark-sketch.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
}
.tix-card--featured .tix-list li::before {
  filter: brightness(0) invert(1);
}

.tix-btn {
  display: inline-block;
  padding: 11px 24px;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border-radius: 4px;
  border: 2px solid transparent;
}
.tix-btn--outline {
  border-color: #a11834;
  color: #a11834;
  background: transparent;
}
.tix-btn--red {
  background: #fe1a3f;
  border: 2px solid #fe1a3f;
  color: #ffffff;
  font-weight: 800;
}
.tix-btn--red:hover {
  background: #e0102d;
  border-color: #e0102d;
}
.tix-btn--sketchy {
  position: relative;
  display: inline-block;
  padding: 18px 48px;
  background-image: url('../assets/btn-red.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: #ffffff;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.tix-btn--sketchy:hover {
  opacity: 0.88;
}
.tix-btn--sketchy-white {
  /* same SVG background, no override needed */
}
.tix-btn--solid {
  background: #a11834;
  border-color: #a11834;
  color: #ffffff;
}
.tix-btn--dark {
  background: #1a1a1a;
  border-color: #1a1a1a;
  color: #ffffff;
}

.tix-soon {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #888888;
  font-style: normal;
  text-align: center;
  margin-top: 8px;
  display: block;
  width: 100%;
}

@media (max-width: 900px) {
  .tix-row--3 { grid-template-columns: 1fr; }
  .tix-row--2 { grid-template-columns: 1fr; max-width: 480px; }
}

/* =============================================================
   CTA banner
   ============================================================= */
.cta-banner {
  position: relative;
  padding: 120px 48px;
  background: var(--ink-2);
  border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);
  overflow: hidden;
  text-align: center;
}
.cta-banner-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 20% 30%, rgba(227, 0, 58, 0.22) 0%, transparent 55%),
    radial-gradient(ellipse 50% 70% at 80% 70%, rgba(227, 0, 58, 0.18) 0%, transparent 55%),
    linear-gradient(180deg, var(--ink-2) 0%, var(--ink-1) 100%);
}
.cta-banner-vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(13, 13, 13, 0.85) 100%);
}
.cta-banner-content {
  position: relative; z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}
.cta-banner-marker {
  font-family: var(--font-marker);
  font-size: 32px;
  color: var(--accent);
  margin-bottom: 16px;
  transform: rotate(-2deg);
  display: inline-block;
}
.cta-banner h2 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(40px, 6vw, 80px);
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--white);
  margin: 0 0 32px;
  text-transform: uppercase;
}

/* =============================================================
   Divider — network graphic between dark sections
   ============================================================= */
.divider-network {
  position: relative;
  height: 240px;
  width: 100%;
  background: var(--ink-1);
  overflow: hidden;
}
.divider-network::before {
  content: "";
  position: absolute; inset: 0;
  background-image: url('../assets/divider-network.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: min(1280px, 92%) auto;
  opacity: 0.55;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 18%, black 82%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 18%, black 82%, transparent 100%);
}
.divider-network.flip::before { transform: scaleX(-1); }

/* Network background — full section variant */
.section--network {
  position: relative;
  overflow: hidden;
}
.section--network::before {
  content: "";
  position: absolute; inset: 0;
  z-index: 0;
  background-image: url('../assets/divider-network.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: min(1280px, 92%) auto;
  opacity: 0.55;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 18%, black 82%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 18%, black 82%, transparent 100%);
}
.section--network > .container {
  position: relative;
  z-index: 1;
}

/* =============================================================
   Photo collage
   ============================================================= */
.photos-collage {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 16px;
  margin-top: 56px;
}
.photos-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.photo-tile {
  margin: 0;
  overflow: hidden;
  border-radius: var(--r-1);
  position: relative;
  background: var(--ink-3);
  border: 1px solid var(--stroke);
}
.photo-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.05);
  transition: transform 600ms var(--ease-out);
}
.photo-tile:hover img { transform: scale(1.04); }
.photos-col-left .photo-tile:first-child { aspect-ratio: 16 / 10; }
.photos-row { display: flex; gap: 16px; }
.photos-row .photo-tile { flex: 1; aspect-ratio: 4 / 5; }
.photos-row .photos-row-wide { flex: 1.4; }
.photos-col-right .photo-tile { aspect-ratio: 4 / 5; }
.photos-col-right .photo-tile:first-child { aspect-ratio: 4 / 4; }

/* Photo grid — full 20-photo gallery
   Rows alternate: 4 landscape (4:3) ↔ 2 panorama (16:9, span 2 cols each)
   All photos in the same row share identical height → zero gaps. */
.photo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 48px;
}
.photo-grid .photo-tile {
  aspect-ratio: 4 / 3;
}
.photo-grid .photo-tile.wide {
  grid-column: span 2;
  aspect-ratio: 16 / 9;
}

/* =============================================================
   Newsletter
   ============================================================= */
.newsletter {
  background-color: #f2ede8;
  background-image: url('../assets/program-bg.png');
  background-size: cover;
  background-position: center;
  padding: 96px 0;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  position: relative;
  overflow: hidden;
}
/* RB mark watermark — centred, large, very subtle */
.newsletter::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../assets/rb-mark.webp') center center / 55% auto no-repeat;
  opacity: 0.04;
  pointer-events: none;
  z-index: 0;
}
/* Red network — right side */
.newsletter::after {
  content: '';
  position: absolute;
  right: -20px;
  top: 0;
  bottom: 0;
  width: min(400px, 34%);
  background: url('../assets/network-red.webp') right center / 100% auto no-repeat;
  opacity: 0.35;
  pointer-events: none;
  z-index: 0;
}
.newsletter-content {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}
.newsletter h3 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(14px, 1.75vw, 20px);
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: #444444;
  margin: 0 0 32px;
}
/* Video section — light background with network */
/* Shared white + network background zone (video + newsletter) */
.net-bg-zone {
  position: relative;
  background-color: #ffffff;
  background-image: none;
  padding-bottom: 0;
}
.net-bg-zone::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../assets/network-light-variant-a.png');
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 0;
}
.net-bg-zone > * { position: relative; z-index: 1; }

.section-video-light {
  background: transparent;
  position: relative;
}
.section-video-light .container { position: relative; z-index: 1; }
.video-eyebrow {
  display: block;
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  color: #a11834;
  text-align: center;
  margin-bottom: 8px;
}
.video-heading {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #444444;
  text-align: center;
  margin: 0 0 32px;
}

/* Newsletter 2-column layout */
.newsletter--wine {
  background: #a11834;
  border-top: none;
  border-bottom: none;
  padding: 56px 0;
}
.newsletter--wine::after { display: none; }
.newsletter-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.newsletter-left { max-width: 560px; }
.newsletter-right { display: flex; align-items: center; }
.newsletter-heading {
  font-family: var(--font-body);
  font-size: clamp(32px, 3.5vw, 52px);
  font-weight: 900;
  line-height: 1.05;
  color: #ffffff;
  margin: 0 0 16px;
}
.newsletter-heading .marker-em {
  font-family: var(--font-marker);
  font-weight: 400;
  font-style: normal;
  color: #ffffff;
}
.newsletter-desc {
  font-size: 15px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
  max-width: 520px;
  margin: 0;
  line-height: 1.6;
}
.newsletter-form {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.newsletter-form--inline {
  flex-direction: column;
  width: 100%;
  justify-content: flex-start;
}

/* ===== FAQ — Figma 2101:1028 ===== */
.faq-section { padding: 80px 0; }
.faq-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 48px;
}
.faq-heading {
  flex-shrink: 0;
  width: 379px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.faq-eyebrow {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.15;
  color: #a11834 !important;
  margin: 0;
}
.faq-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #a11834;
  margin: 0;
}
.faq-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 36px;
  max-width: 717px;
}
.faq-item {
  display: flex;
  flex-direction: column;
  gap: 17px;
}
.faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
  gap: 16px;
}
.faq-q span {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.25;
  color: #444444;
}
.faq-chevron { flex-shrink: 0; }
.faq-a {
  padding: 0;
}
.faq-a p {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.6;
  color: #444444;
  margin: 0;
}
.faq-sep {
  display: block;
  width: 100%;
  height: 29px;
  background-image: url('../assets/faq-divider.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-color: transparent;
}

/* ===== Newsletter (nws) — Figma 2101:998 ===== */
/* ===== Komunita section ===== */
.komunita-section {
  background-color: #ffffff;
  padding: 48px 0 100px;
}
.komunita-inner {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 32px;
  text-align: center;
}
.komunita-eyebrow {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: lowercase;
  color: #a11834;
  margin: 0 0 32px;
}
.komunita-heading {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #444444;
  margin: 0 0 48px;
}
.komunita-heading .marker-em {
  font-family: var(--font-marker);
  font-style: normal;
  color: #a11834;
}
.komunita-desc {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #444444;
  margin: 0;
}
.komunita-link {
  color: #a11834;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.komunita-link:hover {
  color: #7a1027;
}

.nws {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  margin: 0 64px 0;
}
.nws::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../assets/newsletter-bg.png');
  background-size: cover;
  background-position: center;
  pointer-events: none;
  z-index: 0;
}
.nws-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  padding: 48px 64px;
}
.nws-left {
  flex: 1;
  max-width: 510px;
}
.nws-heading {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 42px;
  line-height: 1.1;
  color: #ffffff;
  margin: 0 0 16px;
}
.nws-marker {
  font-family: var(--font-marker);
  font-weight: 400;
  font-style: normal;
}
.nws-desc {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: #ffffff;
  margin: 0;
}
.nws-right { flex-shrink: 0; }
.nws-form {
  display: flex;
  align-items: center;
  gap: 16px;
}
.nws-input {
  width: 333px;
  height: 42px;
  background: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 0 24px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #444444;
  outline: none;
}
.nws-input::placeholder { color: #999999; }
.nws-btn {
  width: 191px;
}
.newsletter-form input {
  flex: 1;
  min-width: 280px;
  background: #ffffff;
  border: 1.5px solid #cccccc;
  border-radius: 4px;
  padding: 14px 18px;
  font-family: var(--font-body);
  font-size: 15px;
  color: #444444;
  box-shadow: none;
  outline: none;
}
.newsletter-form input::placeholder { color: #999999; }
.newsletter-form input:focus { border-color: var(--accent); }

/* =============================================================
   Venue
   ============================================================= */
/* ===== Venue banner — Figma 2101:1064 ===== */
.venue-banner {
  position: relative;
  height: 373px;
  overflow: hidden;
  background: #575757;
  display: flex;
  align-items: center;
  justify-content: center;
}
.venue-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.venue-banner-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}
.venue-banner-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.70);
  z-index: 1;
}
.venue-banner-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: min(918px, 80%);
  text-align: center;
}
.venue-banner-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #c8102e;
  padding: 8px 12px;
}
.venue-banner-badge span {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.15;
  color: #ffffff;
  white-space: nowrap;
}
.venue-banner-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(36px, 4.4vw, 64px);
  line-height: 1.05;
  color: #ffffff;
  margin: 0;
  white-space: nowrap;
}
.venue-banner-meta {
  display: flex;
  align-items: center;
  gap: 16px;
}
.venue-banner-meta span {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 21px;
  line-height: 1.6;
  color: #ffffff;
  white-space: nowrap;
}
.venue-banner-sep {
  width: 1px;
  height: 17px;
  background: #ffffff;
  flex-shrink: 0;
}

/* =============================================================
   Footer
   ============================================================= */
/* ===== Footer — Figma 2101:1078 ===== */
.site-footer {
  position: relative;
  overflow: hidden;
  padding: 46px 84px 88px;
}
.footer-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  z-index: 0;
}
.footer-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.footer-top {
  display: flex;
  gap: 201px;
  align-items: flex-start;
}
.footer-brand {
  display: flex;
  flex-direction: column;
  gap: 48px;
  flex-shrink: 0;
  width: 197px;
}
.footer-logo {
  width: 122.813px;
  height: auto;
}
.footer-marker-tagline {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.15;
  color: #fe1a3f;
  margin: 0;
}
.footer-nav {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  flex: 1;
}
.footer-col {
  display: flex;
  flex-direction: column;
  gap: 21px;
  width: 270px;
  flex-shrink: 0;
}
.footer-col-title {
  font-family: var(--font-marker);
  font-style: normal;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.15;
  color: #ffffff;
  margin: 0;
}
.footer-col-links {
  display: flex;
  flex-direction: column;
  gap: 17px;
}
.footer-col-links a {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 14px;
  line-height: 1.6;
  color: #b0b2b6;
  text-decoration: none;
  transition: color 0.2s;
}
.footer-col-links a:hover { color: #ffffff; }
.footer-contact-link {
  display: flex;
  align-items: center;
  gap: 8px;
}
.footer-contact-link img { flex-shrink: 0; }
.footer-bottom-section {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.footer-legal-row {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.footer-legal-links {
  display: flex;
  align-items: center;
  gap: 11px;
}
.footer-legal-links a {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.6;
  color: #969696;
  text-decoration: none;
  transition: color 0.2s;
  white-space: nowrap;
}
.footer-legal-links a:hover { color: #ffffff; }
.footer-legal-dot {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: #969696;
  flex-shrink: 0;
}
.footer-rule {
  height: 1px;
  background: #969696;
  opacity: 0.5;
  width: 100%;
}
.footer-bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.footer-copy {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.6;
  color: #ffffff;
  white-space: nowrap;
}
.footer-socials {
  display: flex;
  gap: 24px;
  align-items: center;
}
.footer-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  opacity: 0.85;
  transition: opacity 0.2s;
}
.footer-social-link svg {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}
.footer-social-link:hover { opacity: 1; }

/* =============================================================
   Icon helper (mask-based)
   ============================================================= */
.icon {
  display: inline-block;
  flex-shrink: 0;
  background-color: var(--accent);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  width: 20px; height: 20px;
}
.icon-pin       { -webkit-mask-image: url('../assets/icons/pin.svg'); mask-image: url('../assets/icons/pin.svg'); }
.icon-mail      { -webkit-mask-image: url('../assets/icons/mail.svg'); mask-image: url('../assets/icons/mail.svg'); }
.icon-phone     { -webkit-mask-image: url('../assets/icons/phone.svg'); mask-image: url('../assets/icons/phone.svg'); }
.icon-check     { -webkit-mask-image: url('../assets/icons/check.svg'); mask-image: url('../assets/icons/check.svg'); }
.icon-crown     { -webkit-mask-image: url('../assets/icons/crown.svg'); mask-image: url('../assets/icons/crown.svg'); }
.icon-arrow-right { -webkit-mask-image: url('../assets/icons/arrow-right.svg'); mask-image: url('../assets/icons/arrow-right.svg'); }
.icon-linkedin  { -webkit-mask-image: url('../assets/icons/linkedin.svg'); mask-image: url('../assets/icons/linkedin.svg'); }
.icon-instagram { -webkit-mask-image: url('../assets/icons/instagram.svg'); mask-image: url('../assets/icons/instagram.svg'); }
.icon-facebook  { -webkit-mask-image: url('../assets/icons/facebook.svg'); mask-image: url('../assets/icons/facebook.svg'); }
.icon-youtube   { -webkit-mask-image: url('../assets/icons/youtube.svg'); mask-image: url('../assets/icons/youtube.svg'); }
.icon-users     { -webkit-mask-image: url('../assets/icons/users.svg'); mask-image: url('../assets/icons/users.svg'); }
.icon-users-pair { -webkit-mask-image: url('../assets/icons/users-pair.svg'); mask-image: url('../assets/icons/users-pair.svg'); }
.icon-chart-up  { -webkit-mask-image: url('../assets/icons/chart-up.svg'); mask-image: url('../assets/icons/chart-up.svg'); }
.icon-puzzle    { -webkit-mask-image: url('../assets/icons/puzzle.svg'); mask-image: url('../assets/icons/puzzle.svg'); }
.icon-compass   { -webkit-mask-image: url('../assets/icons/compass.svg'); mask-image: url('../assets/icons/compass.svg'); }
.icon-lightbulb { -webkit-mask-image: url('../assets/icons/lightbulb.svg'); mask-image: url('../assets/icons/lightbulb.svg'); }
.icon-presentation { -webkit-mask-image: url('../assets/icons/presentation.svg'); mask-image: url('../assets/icons/presentation.svg'); }
.icon-shield    { -webkit-mask-image: url('../assets/icons/shield.svg'); mask-image: url('../assets/icons/shield.svg'); }
.icon-checklist { -webkit-mask-image: url('../assets/icons/checklist.svg'); mask-image: url('../assets/icons/checklist.svg'); }

/* =============================================================
   Responsive
   ============================================================= */
@media (max-width: 1024px) {
  .container, .container-wide { padding: 0 32px; }
  .site-header { padding: 14px 32px; }
  .site-header nav { display: none; }
  .nav-toggle { display: flex; }
  .about-grid,
  .audience-cards,
  .pillars {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .tickets-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .ticket-card.ticket-card-wide { grid-column: 1 / -1; }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
  .photos-collage { grid-template-columns: 1fr; }
  .photo-grid { grid-template-columns: repeat(3, 1fr); }
  .pillar.pillar-wide {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 32px;
    gap: 20px;
    justify-content: flex-start;
  }
  .pillar.pillar-wide .pillar-wide-label {
    flex: none;
    max-width: 100%;
  }
  .pillar.pillar-wide ul { flex-direction: column; gap: 10px; flex: none; }
}

@media (max-width: 640px) {
  #speakers .spk-brush--top { display: block; height: 29px; }
  .stage-brush--bottom { height: 29px; }
  #speakers .spk-brush--bottom { height: 40px; transform: scaleX(-1); margin-top: -1px; margin-bottom: -20px; }
  .container, .container-wide { padding: 0 20px; }
  .site-header { padding: 12px 20px; }
  .hero { padding: 120px 20px 60px; }
  .hero-sub { padding: 32px 20px 48px; }
  .hero-meta { flex-direction: column; gap: 14px; padding: 16px 20px; }
  .hero-meta-divider { display: none; }
  .hero-cta { grid-template-columns: 1fr; width: 100%; }
  .section { padding: 80px 0; }
  .ht-section { padding: 40px 0 0; }
  .stats { padding: 64px 0; }
  .stats-grid { flex-wrap: wrap; justify-content: space-around; row-gap: 32px; }
  .stats-divider { display: none; }
  .stat { min-width: 40%; }
  .stat-number { font-size: 72px; }
  .stat-label { white-space: normal; }
  .footer-grid { grid-template-columns: 1fr; }
  .photos-row { flex-direction: column; }
  .photo-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .program-flow { flex-direction: column; }
  .flow-arrow { transform: rotate(90deg); }
  .program-topics-list { grid-template-columns: 1fr; }
  .tickets-grid { grid-template-columns: 1fr; }
  .ticket-card.ticket-card-wide {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 32px;
    gap: 24px;
  }
  .ticket-card.ticket-card-wide .ticket-wide-left { align-items: center; justify-content: flex-start; }
  .pillar.pillar-wide {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 32px;
    gap: 20px;
  }
  .pillar.pillar-wide ul { flex-direction: column; gap: 10px; }
}

/* ========================
   Jedna stage nestačí — section
   ======================== */
.stage-section {
  padding: 0 !important;
  background-color: #f2ede8;
  background-image: url('../assets/program-bg.png');
  background-size: cover;
  background-position: center bottom;
  position: relative;
  overflow: visible;
}

.stage-brush {
  display: block;
  width: 100%;
  height: auto;
  line-height: 0;
}

.tix-brush--top {
  display: block;
  width: 100%;
  height: auto;
  line-height: 0;
  transform: scaleX(-1);
  margin-bottom: -2px;
}

.stage-brush--top {
  transform: rotate(180deg) scaleX(-1);
  margin-bottom: -1px;
}

.stage-brush--bottom {
  margin-top: -1px;
  margin-bottom: -16px;
}

.stage-layout {
  display: flex;
  align-items: stretch;
  min-height: 520px;
  padding-bottom: 80px;
}

.stage-photo-col {
  flex: 0 0 46%;
  max-width: 46%;
  position: relative;
  overflow: hidden;
}

.stage-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.stage-content-col {
  flex: 1;
  display: flex;
  align-items: flex-start;
  padding: 112px 64px 56px;
}

.stage-content-inner {
  width: 100%;
  max-width: 571px;
  display: flex;
  flex-direction: column;
  gap: 48px;
  position: relative;
}

.stage-header {
  max-width: 438px;
}

.stage-title {
  font-family: var(--font-body);
  font-size: 42px;
  font-weight: 900;
  color: #444;
  line-height: 1.1;
  margin: 0;
}

.stage-title .marker-em {
  font-family: var(--font-marker);
  font-style: normal;
  color: #a11834;
  font-weight: 400;
}

.stage-deco-icon {
  position: absolute;
  left: 515.75px;
  top: -67.5px;
  width: 158px;
  height: auto;
  transform: rotate(22.85deg);
  filter: brightness(0) saturate(100%) invert(15%) sepia(70%) saturate(1600%) hue-rotate(325deg) brightness(82%);
}

.stage-features {
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.stage-feature-block {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.stage-feature {
  display: flex;
  align-items: center;
  gap: 16px;
}

.stage-feature-icon {
  flex-shrink: 0;
  width: 80px;
}
.stage-feature-block:first-child .stage-feature-title { max-width: 393px; }

.stage-feature-icon img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  display: block;
}

.stage-feature-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.stage-feature-title {
  font-family: var(--font-body);
  font-size: 24px;
  font-weight: 700;
  color: #444444;
  margin: 0;
  line-height: 1.25;
}

.stage-feature-desc {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #969696;
  line-height: 1.6;
  margin: 0;
}

.stage-divider {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}

.stage-closing-quote {
  font-family: var(--font-marker);
  font-weight: 400;
  font-size: 22px;
  line-height: 1.4;
  color: #a11834;
  text-align: center;
  margin: 32px 0 0;
}

.stage-feature-desc .text-link {
  color: #a11834;
  text-decoration: underline;
  font-weight: 600;
}

@media (max-width: 900px) {
  .stage-layout { flex-direction: column; }
  .stage-photo-col { flex: 0 0 auto; max-width: 100%; height: 280px; }
  .stage-content-col { padding: 40px 24px; }
}

/* ========================
   Speakers carousel — redesigned
   ======================== */
.spk-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 52px;
}
.spk-header-left { flex: 1; max-width: 504px; }
.spk-title {
  font-family: var(--font-display);
  font-size: 42px;
  font-weight: 900;
  color: #fff;
  line-height: 1.1;
  margin: 0 0 18px;
}
.spk-marker {
  display: block;
  font-family: var(--font-marker);
  font-style: normal;
  color: #fe1a3f;
  font-size: 42px;
  font-weight: 400;
  line-height: 1.1;
}
.spk-desc {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 400;
  color: #ffffff;
  line-height: 1.6;
  margin: 0;
}
.spk-stats {
  display: flex;
  gap: 71px;
  flex-shrink: 0;
  align-items: center;
}
.spk-stat { display: flex; flex-direction: column; gap: 8px; }
.spk-stat-num {
  font-family: var(--font-marker);
  font-size: 42px;
  font-weight: 400;
  color: #fff;
  line-height: 1.1;
}
.spk-stat-label {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.6;
  color: #ffffff;
}


/* Badge */
.speaker-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  min-height: 54px;
  background: #a11834;
  color: #fff;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 800;
  padding: 6px 12px 9px;
  border-radius: 0;
  text-align: center;
  line-height: 1.2;
}

/* Position line below badge */
.speaker-position {
  display: block;
  width: 100%;
  box-sizing: border-box;
  color: #aaa;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 400;
  padding: 6px 12px 0;
  text-align: center;
  line-height: 1.3;
}

.spk-row1-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
}
.spk-viewport {
  flex: 1;
  overflow: hidden;
}
.spk-track {
  display: flex;
  transition: transform 420ms cubic-bezier(0.4, 0, 0.2, 1);
}
.spk-track .speaker-card {
  flex: 0 0 25%;
  box-sizing: border-box;
  padding: 0 14px;
}
.spk-arrow {
  flex-shrink: 0;
  width: 96px;
  height: 96px;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: transform 180ms, filter 180ms;
}
.spk-arrow:hover { transform: scale(1.08); filter: brightness(0.9); }

.spk-all-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 80px 24px;
  margin-top: 40px;
}

#spkAllWrap {
  width: 100%;
}

/* Footer CTA */
.spk-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: 52px;
}
.spk-wip-note {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 16px;
  color: #fe1a3f;
  margin: 0;
}
.spk-lineup-btn {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  border: 2px solid rgba(255,255,255,0.45);
  padding: 13px 40px;
  text-decoration: none;
  letter-spacing: 0.04em;
  transition: border-color 180ms, background 180ms;
}
.spk-lineup-btn:hover {
  border-color: #fff;
  background: rgba(255,255,255,0.08);
}

@media (max-width: 900px) {
  .spk-header { flex-direction: column; gap: 24px; }
  .spk-stats { gap: 32px; }

}
}

/* Program section — Figma texture background (bg/texture-default, node 2002-249) */
#program {
  background-color: #f5f5f5;
  background-image: url('../assets/program-bg.png');
  background-size: cover;
  background-position: center;
}
/* Disable net/grid overlay for program section */
#program::after {
  display: none;
}

/* ===================== VIP Modal ===================== */
.vip-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9000;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.vip-modal--open {
  display: flex;
}
.vip-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.65);
}
.vip-modal__box {
  position: relative;
  background: #fff;
  max-width: 560px;
  width: 100%;
  padding: 48px 40px 40px;
  border: 4px solid #a11834;
  box-shadow: 0 8px 48px rgba(0,0,0,0.25);
  max-height: 90vh;
  overflow-y: auto;
  z-index: 1;
}
.vip-modal__close {
  position: absolute;
  top: 16px;
  right: 20px;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #444;
  padding: 0;
}
.vip-modal__close:hover { color: #a11834; }
.vip-modal__eyebrow {
  display: block;
  font-family: var(--font-marker);
  font-weight: 400;
  font-size: 20px;
  color: #a11834;
  letter-spacing: 0;
  margin: 0 0 8px;
}
.vip-modal__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 28px;
  line-height: 1.15;
  color: #1a1a1a;
  margin: 0 0 20px;
  text-transform: none;
}
.vip-modal__title .marker-em {
  font-family: var(--font-marker);
  color: #a11834;
  font-style: italic;
  letter-spacing: 0.02em;
}
.vip-modal__desc {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.7;
  color: #444;
  margin: 0 0 12px;
}
.vip-modal__form {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.vip-modal__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.vip-modal__field label {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 800;
  color: #1a1a1a;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.vip-modal__field input,
.vip-modal__field select {
  font-family: var(--font-body);
  font-size: 15px;
  padding: 14px 18px;
  border: 2px solid #a11834;
  border-radius: 6px;
  outline: none;
  background: linear-gradient(180deg, #c4c6ca 0%, #a6a8ac 100%);
  box-shadow: inset 0 2px 7.5px rgba(0,0,0,0.25), inset -2.5px -2.5px 0 rgba(255,250,250,0.5);
  transition: border-color 0.15s;
  color: #1a1a1a;
}
.vip-modal__field input::placeholder,
.vip-modal__field select { color: rgba(26,26,26,0.65); }
.vip-modal__field input:focus,
.vip-modal__field select:focus { border-color: #7d1228; }
.vip-modal__submit-wrap {
  margin-top: 8px;
  text-align: center;
}
.vip-modal__submit {
  position: relative;
  display: inline-block;
  padding: 18px 48px;
  background-image: url('../assets/btn-red.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: #ffffff;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
}
.vip-modal__submit:hover { opacity: 0.88; }
.vip-modal__submit:disabled { opacity: 0.6; cursor: default; }
.vip-modal__sign {
  font-family: var(--font-marker);
  font-size: 20px;
  line-height: 1.5;
  color: #444444;
  margin-top: 20px;
  border-top: 1px solid #eee;
  padding-top: 16px;
}
.vip-modal__success {
  text-align: center;
  padding: 40px 20px;
}
.vip-modal__success p:first-child {
  width: 48px;
  height: 44px;
  margin: 0 auto 16px;
  background-image: url('../assets/checkmark-sketch.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 0;
}
.vip-modal__success h3 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 22px;
  color: #a11834;
  text-transform: uppercase;
  margin: 0 0 12px;
}
.vip-required { color: #a11834; font-weight: 700; }
.vip-modal__field-error {
  font-family: var(--font-body);
  font-size: 13px;
  color: #a11834;
  margin: 0;
}
.vip-modal__field-hint {
  font-family: var(--font-body);
  font-size: 13px;
  color: #888888;
  margin: 0;
}
.vip-modal__field-hint.is-ok { color: #2e7d32; }
.vip-modal__field-hint.is-error { color: #a11834; }
.vip-modal__field input.is-invalid { border-color: #fe1a3f; }
.vip-modal__field .vip-email-suggest {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: #a11834;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.vip-modal__ico-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.vip-modal__ico-row input {
  flex: 1 1 auto;
  min-width: 0;
}
.vip-modal__ico-btn {
  flex: 0 0 auto;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  padding: 0 16px;
  border: 2px solid #a11834;
  border-radius: 6px;
  background: #fff;
  color: #a11834;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, opacity 0.15s;
}
.vip-modal__ico-btn:hover { background: #a11834; color: #fff; }
.vip-modal__ico-btn:disabled { opacity: 0.55; cursor: default; }
.vip-modal__ico-btn:disabled:hover { background: #fff; color: #a11834; }
.vip-modal__field input[readonly] {
  background: linear-gradient(180deg, #e6e7e9 0%, #d4d6d9 100%);
  color: #555555;
  cursor: not-allowed;
}
.vip-modal__network-wrap {
  overflow: hidden;
  margin: 20px -40px 0;
}
.vip-modal__network {
  display: block;
  width: calc(100% + 120px);
  max-width: none;
  height: auto;
  margin-left: -80px;
  opacity: 0.7;
}

/* ===================== Payment choice modal ===================== */
.pay-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9000;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.pay-modal--open { display: flex; }
.pay-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.65);
}
.pay-modal__box {
  position: relative;
  background: #fff;
  max-width: 480px;
  width: 100%;
  padding: 48px 40px 40px;
  border: 4px solid #a11834;
  box-shadow: 0 8px 48px rgba(0,0,0,0.25);
  max-height: 90vh;
  overflow-y: auto;
  z-index: 1;
}
.pay-modal__close {
  position: absolute;
  top: 16px;
  right: 20px;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #444;
  padding: 0;
}
.pay-modal__close:hover { color: #a11834; }
.pay-modal__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 28px;
  line-height: 1.15;
  color: #1a1a1a;
  margin: 0 0 24px;
  text-transform: none;
}
.pay-modal__title .marker-em {
  font-family: var(--font-marker);
  color: #a11834;
  font-style: italic;
  letter-spacing: 0.02em;
}
.pay-modal__choices {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pay-modal__choice {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  border: 2px solid #a11834;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  text-align: left;
  text-decoration: none;
  color: #444444;
  transition: background 0.15s, transform 0.15s;
  font-family: var(--font-body);
  font-size: 15px;
  width: 100%;
  box-sizing: border-box;
}
.pay-modal__choice:hover {
  background: #fdf5f6;
  transform: translateY(-1px);
}
.pay-modal__choice-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #a11834;
}
.pay-modal__choice-icon img {
  width: 20px;
  height: 20px;
  display: block;
  filter: brightness(0) invert(1);
}
.pay-modal__choice-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pay-modal__choice-text strong {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 16px;
  color: #1a1a1a;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.pay-modal__choice-text span {
  font-size: 13px;
  color: #666;
}
.pay-modal__back {
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-marker);
  font-size: 16px;
  color: #a11834;
  padding: 0;
  margin-bottom: 20px;
  display: block;
}
.pay-modal__back:hover { text-decoration: underline; }
.pay-modal__tito tito-widget { display: block; margin-top: 8px; }
.pay-modal__box--wide { max-width: 640px; }
.pay-modal__tito-embed { min-height: 220px; position: relative; }
.pay-modal__tito-embed tito-widget { display: block; }
.pay-modal__loader {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 48px 20px;
}
.pay-modal__spinner {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 3px solid rgba(0,0,0,0.12);
  border-top-color: #fe1a3f;
  animation: payModalSpin 0.9s linear infinite;
}
@keyframes payModalSpin { to { transform: rotate(360deg); } }
.pay-modal__loader-text {
  font-size: 14px;
  color: #666;
  font-family: var(--font-body);
  margin: 0;
}

/* ===== Tito inline widget — recolor default blue accent to site brand red =====
   The inline plugin (js.tito.io/v2/with/inline) renders without an iframe,
   so we can override Tito's own classes. Scoped to the embed container; the
   ID selector outranks Tito's class-only rules. Tito accent #0067e1 → brand red. */
#pay-modal-tito-embed .tito-submit {
  background-color: transparent;
  background-image: url('../assets/btn-red.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border: none;
  border-radius: 0;
  box-shadow: none;
  color: #ffffff;
  font-family: var(--font-body);
  font-weight: 800;
  padding: 18px 48px;
  text-transform: none;
  letter-spacing: 0;
  transition: opacity 0.15s;
}
#pay-modal-tito-embed .tito-submit:active,
#pay-modal-tito-embed .tito-submit:focus,
#pay-modal-tito-embed .tito-submit:hover {
  background-color: transparent;
  background-image: url('../assets/btn-red.svg');
  border: none;
  box-shadow: none;
  opacity: 0.88;
}
#pay-modal-tito-embed .tito-submit[disabled],
#pay-modal-tito-embed .tito-submit[disabled]:hover {
  background-color: transparent;
  background-image: url('../assets/btn-red.svg');
  border: none;
  opacity: 0.45;
}
/* ticket name + remaining quantity */
#pay-modal-tito-embed .tito-release--title,
#pay-modal-tito-embed .tito-release-title,
#pay-modal-tito-embed .tito-release--name,
#pay-modal-tito-embed .tito-quantity-selector--release-title,
#pay-modal-tito-embed .tito-release--quantity-remaining,
#pay-modal-tito-embed .tito-release--availability {
  font-weight: 700;
}
/* accent links + quantity steppers */
#pay-modal-tito-embed a,
#pay-modal-tito-embed .tito-release--increment-quantity--link,
#pay-modal-tito-embed .tito-release--decrement-quantity--link {
  color: var(--brand-red);
}
#pay-modal-tito-embed a:hover {
  color: var(--accent-deep);
}
/* disabled stepper stays muted */
#pay-modal-tito-embed .tito-release--decrement-quantity--link--disabled {
  color: #717075;
}
/* secondary / waiting-list outline button */
#pay-modal-tito-embed .tito-choose-waiting-list-button {
  border-color: var(--brand-red);
  color: var(--brand-red);
}
#pay-modal-tito-embed .tito-choose-waiting-list-button:hover {
  background-color: var(--brand-red);
  color: #fff;
}

/* ===== Tito widget ===== */
.tito-widget-wrap {
  max-width: 860px;
  margin: 48px auto 0;
  padding: 0 32px;
}

/* =============================================================
   MOBILE RESPONSIVE — max-width: 768px
   Based on Figma wireframe node 2101-1671
   ============================================================= */
@media (max-width: 768px) {

  /* --- Container --- */
  .container,
  .container-wide { padding: 0 20px; }

  /* --- Header --- */
  .site-header {
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 9500;
    padding: max(12px, env(safe-area-inset-top)) 20px 12px;
    /* backdrop-filter on position:fixed breaks rendering in iOS Safari — use solid bg */
    background: rgb(27, 27, 27);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .site-header .logo img { height: 56px; }
  .site-header nav { display: none; }
  .nav-toggle { display: flex; }
  .btn-nav-cta { display: none; }
  .lang-switch { font-size: 13px; }

  /* Mobile nav panel — separate from header to avoid backdrop-filter containing block */
  .mobile-nav {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 72px; left: 0; right: 0;
    background: rgba(26,26,26,0.97);
    z-index: 49;
    overflow-y: auto;
    max-height: calc(100vh - 72px);
  }
  .mobile-nav.is-open {
    display: flex;
  }
  .mobile-nav a {
    display: block;
    width: 100%;
    padding: 18px 24px;
    font-family: var(--font-ui);
    font-size: 17px;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: 0.01em;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    text-align: left;
    text-decoration: none;
  }
  .mobile-nav a:last-child {
    border-bottom: none;
  }

  /* --- Hero --- */
  .hero { padding: 100px 20px 56px; }
  .hero-subtitle { font-size: 20px; margin-top: 24px; }
  .hero-desc { white-space: normal; font-size: 14px; }
  .hero-cta { flex-direction: column; align-items: center; gap: 12px; }
  .hero-btn--primary,
  .hero-btn--secondary { width: 100%; max-width: 280px; }
  .hero-meta { flex-direction: column; align-items: center; gap: 16px; margin-top: 24px; }
  .hero-sub { padding: 32px 20px 44px; }
  .hero-flourish { display: none; }

  /* --- Stats bar --- */
  .stats { padding: 0; }
  .stats-bar { padding: 8px 20px; }
  .stats-grid {
    flex-wrap: wrap;
    gap: 24px 16px;
    justify-content: space-around;
  }
  .stat { min-width: 42%; }
  .stat-number { font-size: 38px; }
  .stat-label { font-size: 15px; }
  .stats-divider { display: none; }

  /* --- About section (#about) — light bg, dark text, photo carousel --- */
  .about-section {
    background-color: #f2ede8;
    background-image: url('../assets/program-bg.png');
    background-size: cover;
    background-position: center;
    padding-top: 0;
    padding-bottom: 0;
  }
  .about-header {
    padding: 40px 20px 32px;
    text-align: left;
    max-width: 100%;
  }
  /* "11 let tradice." on its own line */
  .about-title .marker-em { display: block; font-size: 28px; margin-bottom: 4px; }
  .about-title {
    font-size: 32px;
    color: #444444;
    line-height: 1.15;
    margin: 0 0 20px;
  }
  .about-body { font-size: 14px; margin: 0 0 24px; }
  .about-body p { color: #444; }
  /* CTA button — centered, auto width, md size */
  .about-cta {
    display: table;
    margin: 0 auto;
  }
  .about-cta .btn-label { padding: 14px 40px; font-size: 15px; }
  /* Photo carousel — 1 photo full width, arrows overlaid */
  .about-carousel { position: relative; overflow: hidden; }
  .about-photos {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 0;
    align-items: stretch;
    padding-bottom: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .about-photos::-webkit-scrollbar { display: none; }
  .about-col { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; }
  .about-col-img--tall,
  .about-col-img--short { height: 300px; }
  .about-col-img--offset { margin-top: 0; }
  .about-col--with-quote .about-quote { display: none; }
  /* Arrows overlaid on photo */
  .about-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: #a11834;
    border: none;
    color: #ffffff;
    font-size: 32px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    line-height: 1;
  }
  .about-arrow--prev { left: 12px; }
  .about-arrow--next { right: 12px; }

  /* Intro brand wordmark */
  .intro-brand { padding: 48px 0 24px; }
  .intro-logo-img { width: min(300px, 85vw); }
  .intro-text { margin-top: 40px; text-align: center; gap: 16px; }
  .intro-eyebrow { display: block; text-align: center; font-size: 18px; }
  .eyebrow, .video-eyebrow, .faq-eyebrow { font-size: 18px; }
  .intro-heading { font-size: 24px; line-height: 1.2; text-align: center !important; }
  .intro-heading br { display: none; }
  .intro-desc { font-size: 16px; line-height: 1.6; display: block; text-align: center !important; }

  /* Prokoho cards */
  .prokoho-grid { grid-template-columns: 1fr; gap: 12px; }
  .prokoho-card { padding: 28px 20px 24px; }
  .prokoho-card-title { font-size: 20px; }
  /* Button: full-width on mobile, original sketchy style */
  .prokoho-btn-card {
    width: 100% !important;
    margin-top: 20px;
    display: flex !important;
    justify-content: center !important;
    align-self: center;
  }
  /* Red Button ekosystém card → light bg on mobile */
  .prokoho-section .prokoho-wide {
    flex-direction: column;
    align-items: stretch;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1.5px solid #a11834 !important;
    padding: 28px 20px 24px;
    gap: 16px;
    margin-top: 0;
  }
  .prokoho-section .prokoho-wide-content { gap: 12px; }
  .prokoho-section .prokoho-wide-left { gap: 12px; }
  .prokoho-section .prokoho-wide-title { color: #444444 !important; white-space: normal; font-size: 20px; }
  .prokoho-section .prokoho-wide-body p { color: #444 !important; }
  .prokoho-section .prokoho-wide .prokoho-icon--sm { filter: none !important; }
  .prokoho-wide-btn {
    width: 100% !important;
    margin-top: 8px;
    display: flex !important;
    justify-content: center !important;
    align-self: center;
  }
  .prokoho-section { padding-bottom: 40px; }

  /* Unified light texture background for light sections on mobile */
  .intro-brand,
  .prokoho-section,
  .stage-section,
  #program,
  #tickets.tix-v2,
  .about-section,
  .net-bg-zone,
  .section-video-light,
  .komunita-section,
  .section--white {
    background-color: #f5f5f5 !important;
    background-image: url('../assets/bg-texture.jpg') !important;
    background-size: 100% auto !important;
    background-position: left top !important;
    background-repeat: repeat-y !important;
  }

  /* --- Stage section --- */
  .stage-layout { flex-direction: column; min-height: auto; padding-bottom: 48px; }
  .stage-photo-col { flex: 0 0 auto; max-width: 100%; height: 220px; }
  .stage-content-col { padding: 32px 20px 24px; }
  .stage-title { font-size: 28px; }
  .stage-feature-title { font-size: 18px; }
  .stage-feature-icon { width: 56px; }
  .stage-feature-icon img { width: 56px; height: 56px; }
  .stage-content-inner { gap: 32px; }
  .stage-features { gap: 32px; }
  .stage-deco-icon { display: none; }
  .stage-closing-quote { font-size: 18px; }

  /* --- Speakers section — mobile carousel (1 speaker at a time) --- */
  .spk-header { flex-direction: column; gap: 20px; }
  .spk-stats { gap: 24px; }
  .spk-title { font-size: 24px; line-height: 1.2; text-align: left; }
  .spk-marker { font-size: 24px; line-height: 1.2; }
  .spk-desc { font-size: 16px; line-height: 1.6; text-align: left; }
  .spk-stat-num { font-size: 24px; line-height: 1.2; }
  .spk-stat-label { font-size: 18px; }
  #speakers .spk-content {
    background-position: left bottom;
    background-size: cover;
  }
  /* Carousel wrapper: arrow | viewport | arrow */
  .spk-row1-wrap {
    display: flex;
    align-items: center;
    gap: 0;
  }
  .spk-arrow {
    display: flex;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
  }
  .spk-arrow img { width: 48px; height: 48px; }
  .spk-viewport { overflow: hidden; flex: 1; }
  /* 1 card per view on mobile */
  .spk-track .speaker-card {
    flex: 0 0 100%;
    box-sizing: border-box;
    padding: 0 8px;
    text-align: center;
  }
  /* Show all cards again (undo the previous nth-child:none) */
  .spk-track .speaker-card:nth-child(n+4) { display: flex; }
  .spk-all-grid { grid-template-columns: repeat(2, 1fr); gap: 40px 16px; }

  /* --- Tickets (tix) --- */
  .tix-brush--top { height: 29px; }
  .tix-row--3 { grid-template-columns: 1fr; }
  .tix-row--2 { grid-template-columns: 1fr; max-width: 100%; }
  #tickets .section-header h2 { font-size: 28px; }
  #tickets { padding-top: 48px; padding-bottom: 48px; }
  .tito-widget-wrap { padding: 0 20px; margin-top: 32px; }

  /* --- Net bg zone (video + newsletter) --- */
  /* Figma: network is 878px wide, left:-165px, top:202px in 403px container */
  .net-bg-zone::before {
    background-size: 220% auto;
    background-position: 35% 202px;
    background-repeat: no-repeat;
  }
  .net-bg-zone .nws,
  .nws { margin: 0 16px 0; }
  .nws-inner {
    flex-direction: column;
    gap: 28px;
    padding: 32px 24px;
  }
  .nws-heading { font-size: 28px; }
  .nws-left { max-width: 100%; }
  .nws-form { flex-direction: column; align-items: stretch; gap: 12px; }
  .nws-input { width: 100%; }
  .nws-btn { width: 100%; justify-content: center; }

  /* --- Komunita section --- */
  .komunita-section { padding: 36px 0 64px; }
  .komunita-inner { padding: 0 20px; }
  .komunita-heading { font-size: 28px; margin-bottom: 28px; }
  .komunita-eyebrow { margin-bottom: 20px; }
  .komunita-desc { font-size: 15px; }

  /* --- FAQ section --- */
  .faq-section { padding: 48px 0; background-color: #ffffff !important; background-image: none !important; }
  .faq-inner { flex-direction: column; gap: 32px; }
  .faq-heading { width: 100%; }
  .faq-title { font-size: 28px; }
  .faq-eyebrow { font-size: 22px; }
  .faq-q span { font-size: 17px; }
  .faq-list { max-width: 100%; }

  /* --- Photo gallery --- */
  .photo-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .photo-grid .photo-tile.wide { grid-column: span 2; }
  .photos-collage { grid-template-columns: 1fr; }
  .photos-row { flex-direction: column; }

  /* --- Partners section --- */
  .section-video-ref::after { display: none; }

  /* --- Footer --- */
  .site-footer { padding: 46px 24px 88px; }
  .footer-inner { padding: 40px 0 32px; }
  .footer-top { flex-direction: column; gap: 32px; align-items: flex-start; }
  .footer-brand { width: 100%; gap: 20px; }
  .footer-nav { flex-direction: column; gap: 24px; align-items: flex-start; width: 100%; }
  .footer-col { width: 100%; }
  .footer-col-title { text-align: left; font-size: 18px; }
  .footer-col-links { text-align: left; }
  .footer-col-links a { text-align: left; }
  .footer-contact-link { text-align: left; }
  /* Figma mobile order: socials → copyright → rule → legal links */
  .footer-bottom-section { align-items: flex-start; flex-direction: column-reverse; }
  .footer-bottom-row { flex-direction: column-reverse; gap: 16px; align-items: flex-start; }
  .footer-socials { gap: 16px; justify-content: flex-start; }
  .footer-copy { text-align: left; }
  .footer-legal-row { flex-direction: column-reverse; align-items: flex-start; gap: 20px; }
  .footer-legal-links { flex-direction: column; gap: 11px; justify-content: flex-start; }
  .footer-legal-dot { display: none; }
  .footer-marker-tagline { font-size: 18px; text-align: left; }

  /* --- Program section --- */
  .program-header { flex-direction: column; gap: 16px; margin-bottom: 24px; }
  .program-header-text { flex: none; max-width: 100%; }
  .program-header-illus { display: none; }
  .program-puzzle-img { display: none; }
  /* Heading: each line fits on mobile, no overflow */
  .program-header-text .h1 {
    font-size: clamp(26px, 7vw, 40px) !important;
    line-height: 1.2 !important;
  }
  .program-header-text .h1 span { white-space: normal !important; }
  .program-header-text .section-desc { font-size: 15px; }
  /* Format tags: 2-column grid */
  .program-formats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 28px;
  }
  .program-formats .format-item {
    flex: none;
    width: 100%;
  }
  .format-item { white-space: normal; font-size: 18px; height: auto; padding: 8px 10px; text-align: center; }
  /* Pillars */
  .pillars { grid-template-columns: 1fr; gap: 16px; }
  .pillar { padding: 24px 20px; }
  .pillar h3 { font-size: 24px; }
  .pillar.pillar-wide { flex-direction: column; align-items: flex-start; padding: 24px 20px; gap: 16px; }
  .pillar.pillar-wide ul { flex-direction: column; gap: 8px; }
  .program-flow { flex-direction: column; gap: 16px; }
  .flow-arrow { transform: rotate(90deg); }
  .program-topics-list { grid-template-columns: 1fr; }
  .program-topics-heading { font-size: 26px; }
  .program-topics-wrap { overflow: hidden; }

  /* --- Venue banner --- */
  .venue-banner { height: auto; min-height: 260px; padding: 40px 20px; }
  .venue-banner-content { width: 100%; gap: 16px; }
  .venue-banner-title { font-size: 28px; white-space: normal; }
  .venue-banner-badge span { font-size: 20px; white-space: normal; }
  .venue-banner-meta { flex-direction: column; gap: 8px; align-items: center; }
  .venue-banner-meta span { font-size: 16px; white-space: normal; text-align: center; }
  .venue-banner-sep { display: none; }

  /* --- General section padding on mobile --- */
  .section { padding: 56px 0; }
  .section--sm { padding: 40px 0; }
  .section-header { margin-bottom: 36px; }
  .section-header .section-desc { font-size: 16px; }

  /* --- Headings scale down --- */
  .h2-large { font-size: clamp(26px, 7vw, 40px); }
  .heading-with-marker h2 { font-size: clamp(28px, 7vw, 48px); }
  .heading-with-marker { gap: 12px; flex-wrap: wrap; }

  /* --- CTA banner --- */
  .cta-banner { padding: 64px 20px; }
  .cta-banner h2 { font-size: clamp(32px, 8vw, 48px); }

  /* --- VIP modal --- */
  .vip-modal { padding: 16px; }
  .vip-modal__box { padding: 32px 24px 28px; }

  /* --- Eyebrow / section-header.center --- */
  .section-header.center .section-desc { text-align: left; }
}


/* =============================================================
   Legal pages (obchodni podminky, privacy policy, …)
   ============================================================= */
.legal-page {
  padding: 120px 0 80px;
  min-height: 60vh;
  background: var(--bg);
}
.legal-page .container {
  max-width: 800px;
}
.legal-page h1 {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 900;
  color: var(--white);
  margin-bottom: 0.5rem;
  text-transform: uppercase;
}
.legal-page .legal-subtitle {
  color: var(--ink-9);
  font-size: 1rem;
  margin-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,0.12);
  padding-bottom: 2rem;
}
.legal-page h2 {
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 800;
  color: #ff8fa3;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}
.legal-page h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--white);
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}
.legal-page p,
.legal-page li {
  color: var(--ink-9);
  line-height: 1.8;
  margin-bottom: 1rem;
  font-size: 0.95rem;
}
.legal-page ul,
.legal-page ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
}
.legal-page a {
  color: #ffb3c0;
  text-decoration: underline;
}
.legal-page a:hover {
  color: var(--white);
}
@media (max-width: 768px) {
  .legal-page { padding: 96px 0 56px; }
}