/* ============================================================
   RespekTurtle — Vorstellungsfilm (Über uns, direkt unter dem Titel)
   Nutzt die Tokens aus style.css
   ============================================================ */
.intro-film{background:var(--sand);padding:0 0 1rem;position:relative;z-index:4}
.intro-film + .section{padding-top:3.5rem}

.intro-film__frame{
  position:relative;margin-top:-6.5rem;aspect-ratio:16/9;
  border-radius:var(--radius-lg);overflow:hidden;background:var(--pond-950);
  box-shadow:var(--shadow-deep),0 0 0 6px var(--paper);
}
@media (max-width:700px){.intro-film__frame{margin-top:-3.5rem;box-shadow:var(--shadow-deep),0 0 0 4px var(--paper)}}
.intro-film__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.intro-film__frame.is-playing video{object-fit:contain}

/* Startfläche mit Play-Knopf */
.intro-film__start{
  position:absolute;inset:0;border:0;padding:0;cursor:pointer;color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;
  background:linear-gradient(180deg,rgba(8,32,26,.05) 30%,rgba(8,32,26,.65));
  font-family:var(--font-body);transition:background .4s;
}
.intro-film__start:hover{background:linear-gradient(180deg,rgba(8,32,26,0) 30%,rgba(8,32,26,.55))}
.intro-film__play{
  position:relative;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--sun),var(--sun-deep));
  box-shadow:0 16px 40px rgba(242,169,59,.5);transition:transform .4s var(--ease-spring);
}
.intro-film__play::before{ /* sanfter Puls */
  content:'';position:absolute;inset:-10px;border-radius:50%;
  border:2px solid rgba(242,169,59,.7);animation:introPulse 2.2s ease-out infinite;
}
.intro-film__play svg{width:34px;height:34px;margin-left:6px;fill:var(--pond-950)}
.intro-film__start:hover .intro-film__play{transform:scale(1.08)}
.intro-film__label{
  font-weight:800;font-size:1.05rem;letter-spacing:.04em;text-shadow:0 2px 12px rgba(0,0,0,.45);
}
.intro-film__label small{display:block;font-weight:700;font-size:.85rem;opacity:.85;text-align:center}
@keyframes introPulse{from{transform:scale(.9);opacity:1}to{transform:scale(1.35);opacity:0}}
@media (prefers-reduced-motion:reduce){.intro-film__play::before{animation:none}}
@media (max-width:700px){.intro-film__play{width:70px;height:70px}.intro-film__play svg{width:26px;height:26px}}

.intro-film__frame.is-playing .intro-film__start{display:none}

/* Bildunterschrift */
.intro-film__caption{
  display:flex;align-items:center;justify-content:center;gap:.7rem;flex-wrap:wrap;
  margin:1.4rem 0 0;text-align:center;font-weight:700;color:var(--ink-soft);
}
.intro-film__caption .eyebrow{margin:0}