/* One framed story strip for promotions and events. */
body.v4 section.content-stories {
  position: relative;
  padding: 32px 24px 48px !important;
  color: #2b1b12 !important;
  background: #f5efe5 !important;
  overflow: clip;
}
.content-stories .v7-marble { display: none; }
.content-stories__shell { position: relative; z-index: 1; width: 100%; max-width: 980px; margin-inline: auto; padding: 28px 20px 16px; border: 1px solid #b48a3c; border-radius: 12px; background: linear-gradient(rgb(249 243 233 / .32), rgb(249 243 233 / .32)), url('/assets/site/v6-marble.jpg') repeat center / 1100px; }
body.v4 .content-stories__heading {
  max-width: 900px;
  margin: 0 auto 12px;
  color: #6e1f27 !important;
  font: 400 clamp(36px, 4.2vw, 54px)/1.08 "Viaoda Libre", Georgia, serif !important;
  letter-spacing: -.02em !important;
  text-align: center;
  text-transform: none !important;
  text-wrap: balance;
}
.content-stories__carousel {
  --cs-card-width: min(354px, 37svh);
  --cs-gap: 16px;
  max-width: none;
  margin-inline: auto;
}
.content-stories__rail {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--cs-gap);
  width: 100%;
  min-width: 0;
  padding-block: 16px 12px;
  cursor: grab;
  touch-action: pan-x pan-y;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.content-stories__rail::-webkit-scrollbar { display: none; }
.content-stories__rail.is-dragging, .content-stories__rail.is-dragging a { cursor: grabbing; }
.content-stories__rail::before, .content-stories__rail::after {
  content: "";
  flex: 0 0 max(0px, calc((100% - var(--cs-card-width)) / 2 - var(--cs-gap)));
}
.content-stories__card {
  position: relative;
  display: block;
  flex: 0 0 var(--cs-card-width);
  width: var(--cs-card-width);
  aspect-ratio: 9 / 16;
  border-radius: 10px;
  overflow: hidden;
  background: #241716;
  border: 1px solid rgb(180 138 60 / .7);
  scroll-snap-align: center;
  scroll-snap-stop: always;
  transform: scale(.88);
  opacity: .72;
  filter: saturate(.85);
  transition: transform 220ms ease, opacity 220ms ease, filter 220ms ease;
  -webkit-user-select: none;
  user-select: none;
}
.content-stories__card.is-active { transform: scale(1); opacity: 1; filter: none; }
.content-stories__card img { display: block; width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; }
.content-stories__intro { margin: 0; padding-inline: 8px; text-align: center; color: #6a5144; font: 400 15px/1.5 Commissioner, system-ui, sans-serif; }
.content-stories__card::after { content: ""; position: absolute; inset: 6px; border: 1px solid rgb(225 199 131 / .55); border-radius: 7px; pointer-events: none; }
.content-stories__empty { text-align: center; padding: 30px 12px; color: #5c463d; }
.content-stories__sr { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.content-stories [hidden], .content-story-viewer [hidden] { display: none !important; }
.content-stories__rail:focus-visible, .content-stories__card:focus-visible,
.content-story-viewer button:focus-visible, .content-story-viewer a:focus-visible { outline: 3px solid #9f772c; outline-offset: 4px; }
body.cs-story-open { overflow: hidden; }
.content-story-viewer {
  --cs-poster-height: min(67dvh, 650px);
  width: min(850px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 18px 22px;
  border: 1px solid #b48a3c;
  border-radius: 12px;
  overflow: auto;
  color: #fff5e5;
  background: #261617;
  box-shadow: 0 24px 80px rgb(0 0 0 / .4);
  font-family: Commissioner, system-ui, sans-serif;
}
.content-story-viewer::backdrop { background: rgb(18 10 7 / .9); }
.content-story-viewer__header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.content-story-viewer__position { flex: 1; margin: 0; color: #e1c783; font-size: 13px; line-height: 1.3; }
.content-story-viewer__tool { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid rgb(225 199 131 / .45); border-radius: 4px; background: transparent; color: #fff5e5; font: 400 25px/1 system-ui, sans-serif; cursor: pointer; }
.content-story-viewer__progress { display: flex; gap: 5px; margin-bottom: 14px; }
.content-story-viewer__progress span { flex: 1; height: 3px; overflow: hidden; border-radius: 2px; background: rgb(255 245 229 / .25); }
.content-story-viewer__progress i { display: block; height: 100%; background: #e1c783; transform: scaleX(0); transform-origin: left; }
.content-story-viewer__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, .85fr); gap: 28px; align-items: center; }
.content-story-viewer__poster { display: flex; justify-content: center; height: var(--cs-poster-height); min-width: 0; touch-action: pan-y; }
.content-story-viewer__image { display: block; width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; }
.content-story-viewer__details { min-width: 0; }
.content-story-viewer__details h3 { margin: 0 0 10px; color: #f0d68f; font: 400 clamp(28px, 3vw, 40px)/1.1 "Viaoda Libre", Georgia, serif; overflow-wrap: anywhere; }
.content-story-viewer__caption { margin: 0 0 16px; color: #e1c783; font-size: 14px; line-height: 1.45; }
.content-story-viewer__copy { margin: 0; color: #fff5e5; font-size: 16px; line-height: 1.55; white-space: pre-line; overflow-wrap: anywhere; }
.content-story-viewer__phone { display: inline-flex; align-items: center; min-height: 44px; margin-top: 20px; color: #f0d68f !important; font-size: 14px; text-underline-offset: 4px; }
.content-story-viewer__navigation { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; }
.content-story-viewer__navigation button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-width: 104px; min-height: 44px; padding: 8px 16px; border: 1px solid rgb(225 199 131 / .55); border-radius: 4px; background: transparent; color: #fff5e5; font: 500 14px/1.2 Commissioner, system-ui, sans-serif; cursor: pointer; }
.content-story-viewer__navigation button:disabled { opacity: .3; cursor: default; }
@media (hover: hover) {
  .content-story-viewer button:hover:not(:disabled) { background: rgb(225 199 131 / .12); }
}
@media (max-width: 640px) {
  body.v4 section.content-stories { padding: 20px 12px 32px !important; }
  .content-stories__shell { width: 100% !important; padding: 24px 0 12px !important; }
  body.v4 .content-stories__heading { padding-inline: 20px; font-size: 36px !important; }
  .content-stories__intro { padding-inline: 22px; font-size: 14px; }
  .content-stories__carousel { --cs-card-width: min(76vw, 300px, 37svh); --cs-gap: 12px; }
  .content-stories__rail { padding-block: 16px 12px; }
  .content-story-viewer { --cs-poster-height: min(54dvh, 510px); width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 12px 16px; }
  .content-story-viewer__body { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .content-story-viewer__details h3 { font-size: 30px; }
  .content-story-viewer__copy { font-size: 15px; line-height: 1.45; }
  .content-story-viewer__caption { margin-bottom: 10px; }
  .content-story-viewer__phone { margin-top: 10px; }
}
@media (orientation: landscape) and (max-height: 560px) {
  .content-stories__carousel { --cs-card-width: min(240px, 36svh); }
  .content-story-viewer { --cs-poster-height: calc(100dvh - 140px); width: min(760px, calc(100vw - 24px)); max-height: calc(100dvh - 16px); padding: 8px 16px; }
  .content-story-viewer__header { margin-bottom: 6px; }
  .content-story-viewer__progress { margin-bottom: 8px; }
  .content-story-viewer__body { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 20px; }
  .content-story-viewer__details { max-height: var(--cs-poster-height); overflow-y: auto; }
  .content-story-viewer__details h3 { font-size: 26px; }
  .content-story-viewer__copy { font-size: 14px; line-height: 1.4; }
  .content-story-viewer__navigation { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .content-stories__card { transition: none; }
  .content-stories__rail { scroll-behavior: auto; }
}