/* Ed Keels Media: approved action and video control styles. */
.button {
  --orb-size:56px;
  padding:0;
  min-height:56px;
  gap:14px;
  background:transparent;
  border:0;
  color:var(--paper);
  justify-content:flex-start;
  text-transform:uppercase;
  letter-spacing:.055em;
  transition:color .2s;
}
.button-red,.button-outline { background:transparent;border:0;color:var(--paper); }
.button:hover,.button-red:hover,.button-outline:hover {
  background:transparent;border:0;transform:none;
}
.button .action-orb {
  display:grid;
  place-items:center;
  flex:0 0 var(--orb-size);
  width:var(--orb-size);
  height:var(--orb-size);
  border:1px solid var(--paper);
  border-radius:50%;
  color:var(--paper);
  background:transparent;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.button-red .action-orb { background:var(--red);border-color:var(--red); }
.button .action-label { font-size:inherit;line-height:1.3; }
.button .action-orb .orb-play { width:12px;height:14px;fill:currentColor;margin-left:2px; }
.button .action-orb .orb-arrow { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4; }
.button:hover .action-orb { transform:translateY(-2px);background:var(--paper);border-color:var(--paper);color:var(--ink); }
.button-red:hover .action-orb { background:#d91f15;border-color:#d91f15;color:var(--paper); }
.button:focus-visible { outline:2px solid var(--paper);outline-offset:7px;border-radius:3px; }
.button-small { --orb-size:36px;min-height:38px;padding:0;gap:10px;font-size:10px; }
.button-small .action-orb .orb-arrow { width:16px;height:16px; }
.hero-actions { gap:28px;align-items:center; }
.kitchen-actions { gap:32px;align-items:center; }
.contact-actions .button { min-width:0;padding:0;justify-content:flex-start; }
@media(max-width:800px) {
  .button { --orb-size:50px;min-height:50px; }
  .hero-actions { gap:23px; }
}
@media(max-width:600px) {
  .button { --orb-size:44px;min-height:48px;padding:0;gap:11px;font-size:10px; }
  .button-small { --orb-size:36px;min-height:38px; }
  .hero-actions { gap:22px;flex-wrap:wrap; }
  .kitchen-actions { gap:15px;align-items:flex-start; }
  .kitchen-actions .button { min-width:0;justify-content:flex-start; }
  .contact-actions .button { min-width:0;padding:0;font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .button:hover .action-orb { transform:none;transition:none; }
}

/* Cinema-ticket action buttons. */
.button.button-ticket {
  position:relative;
  isolation:isolate;
  padding:14px 26px;
  min-height:56px;
  gap:18px;
}
.button-ticket .ticket-silhouette {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  fill:transparent;
  stroke:var(--paper);
  stroke-width:1px;
  pointer-events:none;
  transition:fill .2s,stroke .2s;
}
.button-ticket.button-red .ticket-silhouette { fill:var(--red);stroke:var(--red); }
.button.button-ticket .action-orb {
  position:relative;
  order:2;
  flex:0 0 18px;
  width:18px;
  height:18px;
  border:0;
  border-radius:0;
  background:transparent;
  color:inherit;
}
.button.button-ticket .action-orb .orb-arrow { width:18px;height:18px; }
.button-ticket .action-label { position:relative; }
.button.button-ticket:hover { color:var(--ink); }
.button-ticket:hover .ticket-silhouette { fill:var(--paper);stroke:var(--paper); }
.button.button-ticket:hover .action-orb { color:inherit;background:transparent;transform:translate(2px,-2px); }
.button.button-ticket.button-red:hover { color:var(--paper); }
.button-ticket.button-red:hover .ticket-silhouette { fill:#d91f15;stroke:#d91f15; }
.button.button-small.button-ticket { min-height:38px;padding:9px 20px;gap:14px; }
.button.button-small.button-ticket .action-orb { flex-basis:15px;width:15px;height:15px; }
.button.button-small.button-ticket .orb-arrow { width:15px;height:15px; }
.contact-actions .button.button-ticket { padding:14px 26px; }
@media(max-width:600px) {
  .button.button-ticket { min-height:48px;padding:12px 18px;gap:14px; }
  .button.button-small.button-ticket { min-height:38px;padding:9px 20px; }
  .contact-actions .button.button-ticket { min-height:48px;padding:12px 18px; }
}
@media(prefers-reduced-motion:reduce) {
  .button.button-ticket:hover .action-orb { transform:none; }
  .button-ticket .ticket-silhouette { transition:none; }
}

/* All-ticket variation: watch controls keep their play icon on the left. */
.button.button-ticket.button-play .action-orb { order:0; }
.button.button-ticket.button-play:hover .action-orb { transform:none; }
.play-square,.episode-card .play-square {
  position:absolute;
  inset:auto 12px 12px auto;
  display:grid;
  place-items:center;
  width:44px;
  min-width:44px;
  max-width:44px;
  height:32px;
  min-height:32px;
  max-height:32px;
  padding:0;
  border-radius:0;
  background:transparent;
  overflow:hidden;
  isolation:isolate;
}
.play-square::before {
  content:'';
  position:absolute;
  inset:0;
  background:var(--red);
  -webkit-mask:
    radial-gradient(circle at 0 50%,transparent 5px,#000 5.5px) left / 51% 100% no-repeat,
    radial-gradient(circle at 100% 50%,transparent 5px,#000 5.5px) right / 51% 100% no-repeat;
  mask:
    radial-gradient(circle at 0 50%,transparent 5px,#000 5.5px) left / 51% 100% no-repeat,
    radial-gradient(circle at 100% 50%,transparent 5px,#000 5.5px) right / 51% 100% no-repeat;
  transition:background .2s;
}
.play-square svg,.episode-card .play-square svg {
  position:relative;
  display:block;
  width:11px;
  min-width:11px;
  max-width:11px;
  height:12px;
  min-height:12px;
  max-height:12px;
  margin-left:2px;
  fill:currentColor;
}
.video-poster:hover .play-square { background:transparent; }
.video-poster:hover .play-square::before { background:var(--paper); }
.project-card .video-poster:hover .play-square,
.episode-card .video-poster:hover .play-square {
  transform:none;
}
@media(prefers-reduced-motion:reduce) {
  .play-square::before { transition:none; }
}

/* Work shares Da Kitchen's grid class and responsive sizing. */
.project-card .video-title { font-size:clamp(16px,1.35vw,19px); }
.project-card .project-subline { justify-content:flex-start; }
@media(max-width:800px) {
  .project-card .video-title { font-size:17px; }
}