/* The AVENDOX film in a liquid-glass frame: simple view (eenvoudig.html, simple.html) and About us. */
.s-film{margin:0}
.glass-edge{position:relative; padding:8px; border-radius:24px; background:linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.03) 42%, rgba(216,182,128,.08)); border:1px solid rgba(235,212,160,.32); -webkit-backdrop-filter:blur(18px) saturate(1.35); backdrop-filter:blur(18px) saturate(1.35); box-shadow:inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(216,182,128,.12), 0 40px 90px -40px rgba(0,0,0,.9)}
.s-film video{display:block; width:100%; height:auto; aspect-ratio:16/9; border-radius:17px; background:var(--navy); object-fit:cover}
.s-film video::cue{font-family:var(--f-sans); font-size:clamp(14px,1.6vw,20px); background:rgba(5,13,25,.78); color:var(--ivory)}
.s-play{position:absolute; inset:8px; display:flex; align-items:flex-end; justify-content:flex-start; padding:clamp(14px,2.4vw,26px); border:0; border-radius:17px; background:linear-gradient(to top, rgba(5,13,25,.72), rgba(5,13,25,0) 55%); color:var(--ivory); cursor:pointer; text-align:left}
.s-play-ico{flex:none; display:grid; place-items:center; width:clamp(52px,5vw,64px); height:clamp(52px,5vw,64px); margin-right:16px; border-radius:50%; background:rgba(247,244,237,.16); border:1px solid rgba(247,244,237,.5); -webkit-backdrop-filter:blur(12px) saturate(1.4); backdrop-filter:blur(12px) saturate(1.4); box-shadow:inset 0 1px 0 rgba(255,255,255,.35); transition:transform var(--dur) var(--ease-out), background var(--dur) ease}
.s-play-ico .ico{width:22px; height:22px; margin-left:3px; fill:var(--ivory); stroke:var(--ivory)}
.s-play-txt{display:flex; flex-direction:column; gap:4px}
.s-play-txt strong{font:600 var(--t-sm)/1.2 var(--f-sans); letter-spacing:.16em; text-transform:uppercase}
.s-play-txt span{font-size:var(--t-sm); color:rgba(247,244,237,.82)}
.s-play:hover .s-play-ico{transform:scale(1.06); background:rgba(216,182,128,.38)}
.s-play:focus-visible{outline:2px solid var(--champ-hi); outline-offset:3px}
.s-film.playing .s-play{display:none}
.s-tr{margin-top:14px; color:rgba(247,244,237,.82); font-size:var(--t-sm)}
.s-tr summary{display:inline-flex; align-items:center; min-height:32px; cursor:pointer; color:var(--champ-hi); text-decoration:underline; text-underline-offset:3px}
.s-tr summary:focus-visible{outline:2px solid var(--champ-hi); outline-offset:3px; border-radius:4px}
.s-tr p{margin:8px 0 0; max-width:62ch; line-height:1.6}

@media (max-width: 640px){
  .s-play-txt span{display:none}
  .glass-edge{padding:6px; border-radius:20px}
  .s-play{inset:6px}
}
@media (prefers-reduced-motion: reduce){ .s-play-ico{transition:none} }