/* story lane: owner review round 3 (2026-10-11). Loads after site.css. */

/* Lo que creemos: two Rancho photos under the circle, the five houses as a list */
.st-strip { display: grid; gap: var(--space-2); margin-top: var(--space-6); }
.st-strip .ph { aspect-ratio: 3 / 2; }
@media (min-width: 900px) { .st-strip { grid-template-columns: 1fr 1fr; } }
.st-houses { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.st-houses li { display: grid; grid-template-columns: 14px 1fr; gap: 12px; align-items: baseline; }
.st-houses li > i { width: 14px; height: 14px; border-radius: 50%; background: var(--casa); display: block; transform: translateY(2px); }

/* Chocolate, five bars (#25): the slot is the photo's own 2:1, wider than the text column, so no bar is cut */
.st-bars .ph.is-wide { aspect-ratio: 2 / 1; }
@media (min-width: 900px) { .st-bars { grid-template-columns: 7fr 5fr; } }

/* Comer, Para llevar (#23): the wrapping photo is 3:2; show it at its shape */
.co-casa-chocolate .ed-products .ph.is-wide { aspect-ratio: 3 / 2; }
.ed-venue dd a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; min-height: 44px; align-items: center; }

/* Phone menu (#28): with three menus open inline it can run past the screen, so it scrolls inside itself */
@media (max-width: 1023px) {
  .site-head.is-menu-open nav { max-height: calc(100dvh - 64px); overflow-y: auto; overscroll-behavior: contain; }
  .is-menu-open .nav-dd .dd a { min-height: 44px; font-size: 16px; }
  .is-menu-open .nav-dd .dd .dd-all { font-weight: 600; }
}
/* Desktop: the Experiencias menu shares the Comer layout (name and one line); the extra links in Casas sit under a rule */
@media (min-width: 1024px) {
  .site-head nav .dd .dd-all + .dd-all { margin-top: 0; border-top: 0; }
}