/* odjeljak s reklamnim videom: tamna podloga, 16:9 okvir, bez zvuka, pušta se kad je u ekranu */
.reel-section { background: #202224; color: #f4f5f6; padding: 72px 24px; border-bottom: 1px solid #494b43; }
.reel-head { max-width: 1360px; margin: 0 auto 32px; }
.reel-head .section-label { color: #c9ccce; margin-bottom: 24px; }
.reel-head h2 { margin-bottom: 18px; }
.reel-muted { color: #ff9fb0; } /* kontrast na tamnoj podlozi, 29.9. */
.reel-head p { max-width: 560px; color: #c9ccce; margin: 0; }
.reel-frame { position: relative; max-width: 1360px; margin: 0 auto; background: #0f0f0f; box-shadow: 0 50px 90px -40px rgba(0, 0, 0, 0.8); }
.reel-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; }
.reel-toggle, .reel-sound { position: absolute; right: 16px; bottom: 16px; min-height: 44px; padding: 10px 16px; border: 1px solid rgba(244, 245, 246, 0.5); background: rgba(15, 15, 15, 0.7); color: #f4f5f6; font: 600 13px/1 Arial, Helvetica, sans-serif; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
.reel-sound { right: 16px; bottom: 70px; }
.reel-toggle:hover, .reel-sound:hover { border-color: #f4f5f6; }
@media (min-width: 900px) { .reel-head { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; } .reel-head .section-label { grid-column: 1 / -1; } .reel-head p { justify-self: end; } }
/* mobitel: gumbi Zvuk i Pauza ispod videa, ne preko njega (video je na malom ekranu tek ~300 px širok) */
@media (max-width: 899px) {
  .reel-toggle, .reel-sound { position: static; right: auto; bottom: auto; display: inline-block; margin: 12px 10px 0 0; }
  .reel-frame { background: transparent; box-shadow: none; }
  .reel-video { background: #0f0f0f; }
}