/* A shared editorial frame for videos opened from Home, Método, Camino and Memorias. */
.origin-film,
.voice-dialog,
.memory-film-dialog {
  box-sizing: border-box;
  width: min(92vw, 1040px);
  max-width: 1040px;
  max-height: 94dvh;
  overflow: auto;
  padding: clamp(18px, 3vw, 38px);
  border: 1px solid #cbbba2;
  background: #eee9df;
  color: #173c2d;
  box-shadow: 0 30px 90px #071a15a8;
}
.origin-film::backdrop,
.voice-dialog::backdrop,
.memory-film-dialog::backdrop {
  background: #071a15dd;
  backdrop-filter: blur(12px);
}
.origin-film::before,
.voice-dialog::before,
.memory-film-dialog::before {
  content: "EL ARCHIVO DE ADRIANA  /  MEMORIAS EN MOVIMIENTO";
  display: block;
  padding-bottom: 16px;
  border-bottom: 1px solid #173c2d35;
  color: #8b6945;
  font: 500 10px/1.4 Outfit, sans-serif;
  letter-spacing: .18em;
}
.origin-film::before { content: "EL MÉTODO S.A.B.E.  /  CONVERSACIONES"; }
.plato-video-dialog::before { content: "EL CAMINO S.A.B.E.  /  POSTALES DEL RECORRIDO"; }
.gastronomic-video-dialog::before { content: "EL CAMINO S.A.B.E.  /  MEMORIAS GASTRONÓMICAS"; }
.memory-film-dialog::before { content: "EL CUADERNO DE ADRIANA  /  UNA MEMORIA EN MOVIMIENTO"; }
.origin-film .postal-heading,
.voice-dialog .voice-toolbar h2 {
  margin: 20px 0 8px;
  color: #173c2d;
  font: 400 clamp(30px, 4vw, 52px)/1.05 NewYork, Georgia, serif;
  letter-spacing: -.035em;
}
.origin-film .postal-intro {
  margin: 0 0 20px;
  color: #466255;
  font: 400 13px/1.6 Outfit, sans-serif;
}
.origin-film .postal-heading { padding-right: 105px; }
.origin-postal-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.origin-postal-choice {
  display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 12px;
  align-items: center; min-width: 0; padding: 9px;
  border: 1px solid #173c2d42; background: #f7f3eb; color: #173c2d;
  text-align: left; cursor: pointer;
}
.origin-postal-choice[aria-pressed="true"] { border-color: #9c7a51; box-shadow: inset 0 0 0 1px #9c7a51; }
.origin-postal-choice:focus-visible { outline: 2px solid #9c7a51; outline-offset: 3px; }
.origin-postal-choice img { width: 92px; height: 100px; object-fit: cover; }
.origin-postal-choice span { display: flex; flex-direction: column; gap: 7px; }
.origin-postal-choice small { color: #97764e; font: 600 10px/1.3 Outfit, sans-serif; letter-spacing: .15em; }
.origin-postal-choice strong { font: 400 clamp(18px, 2vw, 25px)/1.1 NewYork, Georgia, serif; }
.origin-postal-choice em { color: #466255; font: 400 11px/1.3 Outfit, sans-serif; font-style: normal; }
.origin-postal-playing { margin: 21px 0 -6px; color: #97764e; font: 600 10px/1.4 Outfit, sans-serif; letter-spacing: .16em; }
.origin-film .origin-postal-player video { max-height: 49dvh; }
.origin-film .origin-video-close,
.voice-dialog .voice-toolbar button,
.memory-film-top button {
  min-height: 42px;
  border: 1px solid #173c2d55;
  background: transparent;
  color: #173c2d;
  padding: 9px 14px;
  font: 500 11px/1.3 Outfit, sans-serif;
  letter-spacing: .08em;
  cursor: pointer;
}
.origin-film .origin-video-close { top: 19px; right: clamp(18px, 3vw, 38px); }
.origin-film video,
.voice-dialog video,
.memory-film-dialog video {
  display: block;
  width: 100%;
  height: auto;
  max-height: min(60dvh, 650px);
  margin: 20px auto 0;
  border: 9px solid #fbf8f1;
  background: #11271f;
  box-shadow: 0 12px 35px #173c2d25;
  object-fit: contain;
}
.origin-film::after,
.voice-dialog::after,
.memory-film-dialog::after {
  content: "ADRIANA FATAT  ·  TU BIENESTAR, EN CADA DETALLE";
  display: block;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid #173c2d35;
  color: #8b6945;
  text-align: right;
  font: 500 9px/1.4 Outfit, sans-serif;
  letter-spacing: .16em;
}
.voice-dialog .voice-toolbar { align-items: start; margin: 0; }
.voice-dialog .voice-toolbar h2 { flex: 1; }
.memory-film-dialog .memory-film-top {
  padding: 18px 0 0;
  color: #173c2d;
  font: 500 11px/1.5 Outfit, sans-serif;
  letter-spacing: .12em;
}
.camino-refined #cuidado { text-align: center; }
.camino-refined #cuidado .care-heading {
  display: block;
  width: 100%;
  max-width: 1100px;
  margin-inline: auto !important;
  text-align: center;
}
.camino-refined #cuidado .care-heading h2 {
  width: 100%;
  max-width: none;
  margin: 22px auto 24px;
  font-size: clamp(48px, 6.2vw, 88px);
  line-height: 1.02;
  text-align: center;
}
.camino-refined #cuidado .care-heading > p:last-child {
  max-width: 610px;
  margin: 0 auto;
  text-align: center;
}
.camino-refined #cuidado .care-spread { max-width: 1080px; margin-top: 62px; }
.camino-refined #cuidado .care-bridge-photo {
  padding: clamp(10px, 1.5vw, 18px);
  background: #e4d9c8;
  box-shadow: 0 20px 60px #12382e20;
}
.camino-refined #cuidado .care-bridge-photo video { aspect-ratio: 16/9; }
.camino-refined #cuidado .care-bridge-photo figcaption {
  padding: 16px 6px 2px;
  color: #587063;
  text-align: left;
}
.camino-refined #primer-paso {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.camino-refined #primer-paso h2 {
  width: 100%;
  max-width: 1150px;
  margin-inline: auto;
  text-align: center;
  font-size: clamp(48px, 5.8vw, 92px);
  line-height: 1.05;
}
.camino-refined #primer-paso > p:not(.kicker) { text-align: center; }
@media (max-width: 760px) {
  .origin-film, .voice-dialog, .memory-film-dialog { width: calc(100vw - 20px); padding: 18px; }
  .origin-film::before, .voice-dialog::before, .memory-film-dialog::before { font-size: 8px; padding-right: 80px; }
  .origin-film video, .voice-dialog video, .memory-film-dialog video { border-width: 5px; max-height: 65dvh; }
  .origin-film .postal-heading { padding-right: 0; margin-top: 24px; }
  .origin-postal-list { grid-template-columns: 1fr; }
  .origin-postal-choice { grid-template-columns: 88px minmax(0, 1fr); }
  .origin-postal-choice img { width: 88px; height: 72px; }
  .origin-film .origin-postal-player video { max-height: 47dvh; }
  .camino-refined #cuidado .care-heading h2 { font-size: clamp(42px, 11vw, 62px); }
  .camino-refined #cuidado .care-spread { margin-top: 35px; }
  .camino-refined #cuidado .care-bridge-photo video { aspect-ratio: 4/3; }
  .camino-refined #primer-paso h2 { font-size: clamp(40px, 10vw, 58px); }
}
