/* Vybraná spolupráce 2+3. Veškeré styly jsou omezené na tuto sekci. */
.collaboration {
  --co-text: #edf3ff; --co-muted: #b4c8e1; --co-mint: #88e3ce;
  --co-line: #344860; --co-ink: #143145;
  position: relative; margin-top: 48px; color: var(--co-text);
}
.collaboration [hidden] { display: none !important; }
.collaboration button { touch-action: manipulation; cursor: pointer; }
.collaboration :is(button, [tabindex]):focus-visible { outline: 3px solid var(--co-mint); outline-offset: 5px; }
.collab-panel { position: relative; padding: 30px 0 52px 90px; display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: center; min-height: 350px; }
.collab-copy { min-width: 0; }
.collab-kicker { display: block; font-size: 12px; color: var(--co-mint); letter-spacing: .08em; margin-bottom: 13px; }
.collaboration .collab-copy h3 { font-size: 28px; line-height: 1.25; font-weight: 600; letter-spacing: -.035em; margin: 0 0 18px; color: var(--co-text); }
.collaboration .collab-copy p { font-size: 17px; line-height: 1.85; color: var(--co-muted); margin: 0; }
.collab-outcome { display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 5px; background: #1c3540; color: #baf4e5; font-size: 14px; margin-top: 21px; line-height: 1.6; }
.collab-outcome:before { content: '✓'; font-size: 16px; }
.collab-marker { position: absolute; left: 7px; top: 45px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #0b1121; border: 1px solid #516783; color: #a7caff; font-size: 14px; z-index: 1; }
.collab-panel.is-current .collab-marker { border-color: var(--co-mint); background: #1b3c42; color: #baffed; box-shadow: 0 0 0 7px #88e3ce0a; }
.collab-stage { min-width: 0; background: linear-gradient(135deg,#15283b,#0d1929); border: 1px solid var(--co-line); border-radius: 14px; padding: 8px; transform: rotate(1.5deg); }
.collab-panel:nth-child(even) .collab-stage { transform: rotate(-1.5deg); }
.collab-mobile-axis { position: absolute; left: 29px; width: 2px; background: var(--co-line); }
.collab-mobile-fill { position: absolute; inset: 0; background: var(--co-mint); transform-origin: top; }
.collab-end { margin: 15px 0 0 90px; color: var(--co-mint); font-size: 14px; line-height: 1.7; }
.collab-end:before { content: '↳'; font-size: 24px; margin-right: 10px; }
.collab-scene { position: relative; width: 100%; aspect-ratio: 500 / 290; max-width: 500px; margin-inline: auto; isolation: isolate; }
.collab-scene svg { display: block; width: 100%; height: 100%; overflow: visible; }
.collab-scene .paper { fill: #e9f0f8; stroke: #b7cadb; stroke-width: 1; }
.collab-scene .paper-dark { fill: #203d51; stroke: #517084; stroke-width: 1; }
.collab-scene .pale { fill: #cbdbe7; }.collab-scene .mint { fill: #98d5c4; }.collab-scene .blue { fill: #8db7ee; }.collab-scene .ink { fill: var(--co-ink); }
.collab-scene text { font-family: Inter,Arial,sans-serif; font-size: 14px; fill: var(--co-ink); }
.collab-scene .light-text { fill: #deebfa; }.collab-scene .label { font-size: 12px; letter-spacing: 1px; }
.collab-scene .stroke { stroke: #34586c; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.collab-scene .trace { stroke: #79d5bf; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.collab-scene .check { stroke: #27745f; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.collab-scene .faint { stroke: #2d435a; fill: none; stroke-width: 1; }
.collab-halo { position: absolute; inset: 15% 12%; border-radius: 50%; background: #83cbbd0b; filter: blur(20px); z-index: -1; }
@media (min-width: 901px) {
  .collaboration.is-enhanced .collab-columns { display: grid; grid-template-columns: 320px minmax(0,1fr); gap: 34px; align-items: start; }
  .collaboration.is-enhanced .collab-panels { display: grid; }
  .collaboration.is-enhanced .collab-panel { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 0; padding: 0; min-height: 0; background: linear-gradient(120deg,#17273b,#101d2e); border: 1px solid var(--co-line); border-radius: 16px; overflow: hidden; align-self: stretch; }
  .collaboration.is-enhanced .collab-panel:not(.is-active) { visibility: hidden; pointer-events: none; }
  .collaboration.is-enhanced .collab-copy { padding: 24px 32px 32px; min-height: 315px; width: 100%; }
  .collaboration.is-enhanced .collab-stage { position: relative; order: -1; transform: none; border: 0; border-bottom: 1px solid var(--co-line); border-radius: 0; width: 100%; padding: 16px 24px 12px; background: radial-gradient(ellipse,#334b6235,transparent 70%); }
  .collaboration.is-enhanced .collab-stage:before { content: ''; position: absolute; inset: 0; opacity: .25; background-image: radial-gradient(#91b3c8 1px,transparent 1px); background-size: 22px 22px; pointer-events: none; }
  .collaboration.is-enhanced .collab-scene { max-width: 480px; }
  .collaboration.is-enhanced .collab-copy h3 { font-size: 26px; }
  .collaboration.is-enhanced .collab-marker, .collaboration.is-enhanced .collab-mobile-axis, .collaboration.is-enhanced .collab-end { display: none; }
  .collab-nav { position: relative; display: grid; margin-left: 20px; }
  .collab-tab { position: relative; background: transparent; color: var(--co-muted); text-align: left; border: 0; border-radius: 0 10px 10px 0; min-height: 108px; padding: 23px 18px 23px 34px; font: inherit; }
  .collab-tab strong { display: block; font-size: 17px; font-weight: 550; color: var(--co-text); line-height: 1.5; }
  .collab-tab small { display: block; margin-top: 5px; font-size: 13px; line-height: 1.6; }
  .collab-number { position: absolute; top: 25px; left: -15px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; border: 1px solid #4b6580; background: #0b1121; color: var(--co-mint); font-size: 12px; z-index: 1; }
  .collab-tab[aria-selected=true] { background: linear-gradient(90deg,#193e42,transparent); }
  .collab-tab[aria-selected=true] .collab-number { background: var(--co-mint); color: var(--co-ink); border-color: var(--co-mint); box-shadow: 0 0 0 6px #88e3ce0b; }
  .collab-tab:hover { background-color: #18293b; }
  .collab-axis { position: absolute; left: -1px; width: 2px; background: #344e66; overflow: hidden; }
  .collab-axis-fill { position: absolute; inset: 0; background: var(--co-mint); transform-origin: top; }
  .collab-axis-scan { position: absolute; top: 0; left: 0; width: 100%; height: 54px; background: linear-gradient(transparent,#ccfff1,transparent); }
  .collab-next { display: block; margin: 16px 0 0 auto; padding: 8px 0 8px 16px; background: transparent; border: 0; min-height: 44px; color: #a7caff; font: inherit; font-size: 14px; }
  .collab-next:hover { text-decoration: underline; text-underline-offset: 5px; }
}
.collaboration[data-collab-motion=off] .collab-axis-scan { display: none; }
@media (min-width: 901px) and (max-width: 1100px) {
  .collaboration.is-enhanced .collab-columns { grid-template-columns: 270px minmax(0,1fr); gap: 24px; }
  .collab-tab { padding-right: 8px; }.collab-tab strong { font-size: 16px; }
  .collaboration.is-enhanced .collab-copy { padding-inline: 26px; min-height: 350px; }
}
@media (max-width: 900px) {
  .collaboration { max-width: 680px; margin-inline: auto; }
  .collab-panel { grid-template-columns: 1fr; gap: 24px; min-height: 0; }
  .collab-stage { width: min(100%,480px); }
}
@media (max-width: 760px) {
  .collaboration { margin-top: 30px; }
  .collab-panel { gap: 20px; padding: 20px 0 35px 50px; }
  .collab-mobile-axis { left: 13px; }
  .collab-marker { left: 0; top: 24px; width: 28px; height: 28px; font-size: 11px; }
  .collaboration .collab-copy h3 { font-size: 25px; margin-bottom: 14px; }
  .collaboration .collab-copy p { font-size: 17px; line-height: 1.8; }
  .collab-kicker { font-size: 11px; }
  .collab-outcome { font-size: 13px; margin-top: 16px; }
  .collab-stage { padding: 0; }
  .collab-end { margin-left: 50px; font-size: 13px; }
  .collab-panel.is-current .collab-marker { box-shadow: 0 0 0 4px #88e3ce0a; }
}