main.csapat-page { overflow: hidden; }

.csapat-page .csapat-hero__grid,
.csapat-page .csapat-frontline__grid,
.csapat-page .csapat-objective__grid,
.csapat-page .csapat-check__grid { display: grid; min-width: 0; }

.csapat-page .csapat-hero__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; align-items: center; }
.csapat-page .csapat-hero__copy { min-width: 0; max-width: 510px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.csapat-page .csapat-hero__copy > * { margin: 0; }
.csapat-page .csapat-hero__lead { max-width: 510px; font-size: var(--text-md); line-height: 1.5; }
.csapat-page .csapat-hero__note { max-width: 460px; color: rgba(61,64,91,.8); font-size: var(--text-sm); }
.csapat-page .csapat-hero__media { width: 100%; min-width: 0; aspect-ratio: 4 / 3; margin: 0; overflow: hidden; border: var(--border-soft); border-radius: var(--radius-xl); box-shadow: var(--highlight-inset), var(--shadow-tactile); }
.csapat-page .csapat-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 58% 50%; }
.csapat-page .csapat-map-mark { display: inline-flex; align-items: center; gap: 8px; }
.csapat-page .csapat-map-mark::before { width: 9px; height: 9px; border: 2px solid var(--color-action); border-radius: 50% 50% 50% 0; content: ""; transform: rotate(-45deg); }

.csapat-page .csapat-section-head { min-width: 0; }
.csapat-page .csapat-section-head--wide { max-width: 720px; }
.csapat-page .csapat-section-head--damage { max-width: 680px; }
.csapat-page .csapat-section-head--center { max-width: 680px; margin-inline: auto; text-align: center; }
.csapat-page .csapat-section-head--timeline { max-width: 420px; }
.csapat-page .csapat-section-head--faq { max-width: 680px; }
.csapat-page .csapat-section-head > :last-child { margin-bottom: 0; }

.csapat-page .csapat-role-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.csapat-page .csapat-role-card { min-width: 0; height: 100%; display: flex; flex-direction: column; gap: 12px; }
.csapat-page .csapat-role-card > * { margin: 0; }
.csapat-page .csapat-role-card .label { align-self: flex-start; }
.csapat-page .csapat-role-card h3 { font-size: 1.5rem; }
.csapat-page .csapat-role-card p { flex: 1 1 auto; }
.csapat-page .csapat-role-card--pressure::after { width: 56px; border-bottom: 3px dotted var(--color-ink); content: ""; opacity: .45; }
.csapat-page .csapat-role-card--opening { position: relative; }
.csapat-page .csapat-role-card--opening::before { position: absolute; top: 14px; right: 14px; width: 10px; height: 10px; background: var(--color-action); content: ""; }

.csapat-page .csapat-damage-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 32px; }
.csapat-page .csapat-damage-panel { min-width: 0; display: flex; flex-direction: column; gap: 16px; padding: 24px; }
.csapat-page .csapat-damage-panel > * { margin: 0; }
.csapat-page .csapat-damage-panel--risk { border-color: var(--color-ink); }
.csapat-page .csapat-mini-points { display: grid; gap: 12px; margin: 0; }
.csapat-page .csapat-mini-points li { position: relative; min-width: 0; padding-left: 18px; }
.csapat-page .csapat-mini-points li::before { position: absolute; top: .65em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--color-ink); content: ""; }
.csapat-page .csapat-damage-callout { display: flex; min-width: 0; align-items: flex-start; gap: 16px; margin-top: 28px; border: 1px solid var(--color-ink); border-radius: var(--radius-lg); background: var(--color-ink); color: var(--color-inverse); padding: 20px 24px; }
.csapat-page .csapat-damage-callout > * { min-width: 0; margin: 0; }
.csapat-page .csapat-damage-callout strong { color: var(--color-action); }
.csapat-page .csapat-damage-callout p { max-width: 760px; }

.csapat-page .csapat-frontline__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; align-items: center; }
.csapat-page .csapat-frontline__media { width: 100%; min-width: 0; aspect-ratio: 3 / 2; margin: 0; overflow: hidden; border-radius: var(--radius-xl); }
.csapat-page .csapat-frontline__media img { width: 100%; height: 100%; object-fit: cover; object-position: 35% 50%; }
.csapat-page .csapat-frontline__copy { min-width: 0; max-width: 500px; display: flex; flex-direction: column; gap: 16px; }
.csapat-page .csapat-frontline__copy > * { margin: 0; }
.csapat-page .csapat-frontline__lead { font-size: var(--text-md); line-height: 1.5; }
.csapat-page .csapat-steps { display: grid; gap: 12px; margin: 0; padding: 20px; }
.csapat-page .csapat-step { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; min-width: 0; align-items: start; }
.csapat-page .csapat-step__number { display: grid; width: 32px; min-width: 32px; height: 32px; place-items: center; border-radius: 4px; background: var(--color-ink); color: var(--color-inverse); font-weight: 700; }
.csapat-page .csapat-step p { margin: 0; }
.csapat-page .csapat-takeaway { border-left: 4px solid var(--color-action); background: var(--color-canvas); padding: 16px; }
.csapat-page .csapat-takeaway p { margin: 0; }

.csapat-page .csapat-rhythm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.csapat-page .csapat-rhythm-card { min-width: 0; height: 100%; display: flex; flex-direction: column; gap: 14px; }
.csapat-page .csapat-rhythm-card > * { margin: 0; }
.csapat-page .csapat-rhythm-card .label { align-self: flex-start; border-color: rgba(185,139,104,.55); color: var(--color-wood); }
.csapat-page .csapat-rhythm-card h3 { font-size: 1.5rem; }
.csapat-page .csapat-rhythm-card__sub { font-weight: 700; }
.csapat-page .csapat-rhythm-card .content-list { margin-bottom: 0; }

.csapat-page .csapat-timeline-layout { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 32px; align-items: start; }
.csapat-page .csapat-timeline { display: grid; gap: 16px; min-width: 0; }
.csapat-page .csapat-timeline__item { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; min-width: 0; align-items: stretch; }
.csapat-page .csapat-timeline__marker { position: relative; display: grid; width: 56px; min-width: 56px; place-items: start center; padding-top: 16px; }
.csapat-page .csapat-timeline__marker::after { position: absolute; top: 56px; bottom: -16px; left: 27px; width: 1px; background: var(--color-border); content: ""; }
.csapat-page .csapat-timeline__item:last-child .csapat-timeline__marker::after { display: none; }
.csapat-page .csapat-timeline__number { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 4px; background: var(--color-ink); color: var(--color-inverse); font-weight: 700; }
.csapat-page .csapat-timeline__item:last-child .csapat-timeline__number { background: var(--color-action); }
.csapat-page .csapat-timeline__content { min-width: 0; padding: 20px 24px; }
.csapat-page .csapat-timeline__content > :last-child { margin-bottom: 0; }

.csapat-page .csapat-objective__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; align-items: center; }
.csapat-page .csapat-objective__copy { min-width: 0; max-width: 500px; display: flex; flex-direction: column; gap: 16px; }
.csapat-page .csapat-objective__copy > * { margin: 0; }
.csapat-page .csapat-objective__lead { font-size: var(--text-md); line-height: 1.5; }
.csapat-page .csapat-question-card { display: grid; gap: 12px; padding: 20px; }
.csapat-page .csapat-question-card > * { margin: 0; }
.csapat-page .csapat-question-card span { padding-bottom: 8px; border-bottom: 1px solid var(--color-border); font-weight: 700; }
.csapat-page .csapat-question-card span:last-child { padding-bottom: 0; border-bottom: 0; }
.csapat-page .csapat-caution { border-left: 4px solid var(--color-action); padding: 12px 16px; }
.csapat-page .csapat-caution p { margin: 0; }
.csapat-page .csapat-objective__media { width: 100%; min-width: 0; aspect-ratio: 16 / 10; margin: 0; overflow: hidden; border-radius: var(--radius-xl); }
.csapat-page .csapat-objective__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }

.csapat-page .csapat-mistake-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.csapat-page .csapat-mistake-card { min-width: 0; height: 100%; display: flex; flex-direction: column; gap: 14px; }
.csapat-page .csapat-mistake-card > * { margin: 0; }
.csapat-page .csapat-mistake-card__question { min-height: 52px; border-top: 1px solid var(--color-border); padding-top: 12px; color: var(--color-action); font-weight: 700; }

.csapat-page .csapat-check__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px; align-items: center; }
.csapat-page .csapat-check__copy { min-width: 0; max-width: 500px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.csapat-page .csapat-check__copy > * { margin: 0; }
.csapat-page .csapat-check__note { color: rgba(61,64,91,.8); }
.csapat-page .csapat-check__list { display: grid; gap: 12px; min-width: 0; }
.csapat-page .csapat-check-button { display: grid; grid-template-columns: minmax(0, 1fr) auto; width: 100%; min-width: 0; min-height: 64px; gap: 16px; border: var(--border-soft); border-radius: var(--radius-lg); background: var(--color-surface); color: var(--color-ink); padding: 16px 20px; text-align: left; box-shadow: var(--highlight-inset); }
.csapat-page .csapat-check-button:hover { border-color: var(--color-ink); background: #d4dece; }
.csapat-page .csapat-check-button__question { min-width: 0; font-weight: 700; }
.csapat-page .csapat-check-button__state { min-width: 84px; color: rgba(61,64,91,.75); font-size: var(--text-xs); text-align: right; }
.csapat-page .csapat-check-button[aria-pressed="true"] { border-color: var(--color-action); background: var(--color-canvas); }
.csapat-page .csapat-check-button[aria-pressed="true"] .csapat-check-button__state { color: var(--color-action); }

.csapat-page .csapat-faq-list { display: grid; gap: 12px; margin-top: 32px; }
.csapat-page .csapat-faq { min-width: 0; margin: 0; overflow: hidden; border: var(--border-soft); border-radius: var(--radius-lg); background: var(--color-canvas); box-shadow: var(--highlight-inset); }
.csapat-page .csapat-faq__button { display: grid; grid-template-columns: minmax(0, 1fr) 44px; width: 100%; min-width: 0; min-height: 56px; gap: 12px; border: 0; border-radius: 0; background: transparent; color: var(--color-ink); padding: 14px 16px; text-align: left; }
.csapat-page .csapat-faq__button:hover { background: rgba(224,231,218,.45); color: var(--color-ink); }
.csapat-page .csapat-faq__icon { display: grid; width: 44px; height: 28px; place-items: center; color: var(--color-ink); font-size: 1.5rem; font-weight: 400; line-height: 1; }
.csapat-page .csapat-faq__button[aria-expanded="true"] { border-left: 4px solid var(--color-action); padding-left: 12px; }
.csapat-page .csapat-faq__button[aria-expanded="true"] .csapat-faq__icon { color: var(--color-action); }
.csapat-page .csapat-faq__panel { max-width: 100%; background: var(--color-surface); padding: 0 16px 16px; }
.csapat-page .csapat-faq__answer { max-width: 720px; margin: 0; }

@media (max-width: 68.75rem) {
  .csapat-page .csapat-role-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .csapat-page .csapat-role-grid > * { min-width: 0; }
}

@media (max-width: 61.25rem) {
  .csapat-page .csapat-hero__grid { grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); }
  .csapat-page .csapat-rhythm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .csapat-page .csapat-rhythm-grid > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 56.25rem) {
  .csapat-page .csapat-frontline__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .csapat-page .csapat-timeline-layout,
  .csapat-page .csapat-check__grid { grid-template-columns: minmax(0, 1fr); }
  .csapat-page .csapat-timeline-layout > *,
  .csapat-page .csapat-check__grid > * { min-width: 0; width: 100%; }
  .csapat-page .csapat-section-head--timeline { max-width: 680px; }
}

@media (max-width: 50rem) {
  .csapat-page .csapat-hero__grid,
  .csapat-page .csapat-frontline__grid,
  .csapat-page .csapat-objective__grid { grid-template-columns: minmax(0, 1fr); }
  .csapat-page .csapat-hero__grid > *,
  .csapat-page .csapat-frontline__grid > *,
  .csapat-page .csapat-objective__grid > * { min-width: 0; width: 100%; }
  .csapat-page .csapat-hero__copy,
  .csapat-page .csapat-frontline__copy,
  .csapat-page .csapat-objective__copy { max-width: none; }
  .csapat-page .csapat-hero__media { aspect-ratio: 16 / 10; }
  .csapat-page .csapat-hero__media img { object-position: 50% 50%; }
  .csapat-page .csapat-frontline__media { order: -1; aspect-ratio: 16 / 10; }
  .csapat-page .csapat-frontline__media img { object-position: 50% 50%; }
  .csapat-page .csapat-objective__media { order: -1; }
  .csapat-page .csapat-damage-grid { grid-template-columns: minmax(0, 1fr); }
  .csapat-page .csapat-damage-grid > * { min-width: 0; }
  .csapat-page .csapat-mistake-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .csapat-page .csapat-mistake-grid > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 35rem) {
  .csapat-page .csapat-hero__copy,
  .csapat-page .csapat-frontline__copy,
  .csapat-page .csapat-objective__copy,
  .csapat-page .csapat-check__copy { gap: 12px; }
  .csapat-page .csapat-hero__lead,
  .csapat-page .csapat-frontline__lead,
  .csapat-page .csapat-objective__lead { max-width: 36em; font-size: var(--text-md); }
  .csapat-page .csapat-role-grid,
  .csapat-page .csapat-rhythm-grid,
  .csapat-page .csapat-mistake-grid { grid-template-columns: minmax(0, 1fr); }
  .csapat-page .csapat-role-grid > *,
  .csapat-page .csapat-rhythm-grid > *,
  .csapat-page .csapat-mistake-grid > * { grid-column: auto; min-width: 0; }
  .csapat-page .csapat-damage-panel,
  .csapat-page .csapat-timeline__content { padding: 20px; }
  .csapat-page .csapat-damage-callout { padding: 16px; }
  .csapat-page .csapat-timeline__item { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; }
  .csapat-page .csapat-timeline__marker { width: 40px; min-width: 40px; }
  .csapat-page .csapat-timeline__marker::after { left: 19px; }
  .csapat-page .csapat-check-button { grid-template-columns: minmax(0, 1fr); gap: 6px; min-height: 56px; }
  .csapat-page .csapat-check-button__state { min-width: 0; text-align: left; }
  .csapat-page .csapat-faq__button { padding-inline: 16px; }
}
