/* =====================================================================
   POLISH PASS — loads after style.css, so these rules win.
   Grouped by the review item they answer.
   ===================================================================== */

/* ---------- 10 · gold text that passes contrast on the light ground ----------
   --gold-ink for small gold text; --gold stays for lines and ornaments;
   gold on dark grounds stays --gold-soft. */
:root { --gold-ink: #86692f; }
.eyebrow, .sec.deep .eyebrow, .cta-band .eyebrow { color: var(--gold-ink); }
.eyebrow .heb { color: var(--gold-ink); }
.ph .eyebrow, .ph .eyebrow .heb { color: var(--gold-soft); }
.cx-label, .person .role, .bill .role, .sec.deep .person .role, .room .view, .foot h4, .menu-item .tag,
.util .count b, .stories-lbl small, .kid-n, .ladder .kc .prog { color: var(--gold-ink); }
.steps li::before { color: var(--gold-ink); }
.cta-band .mono { color: var(--gold-ink) !important; }
.stack-lg > h3.mono { color: var(--gold-ink) !important; }   /* "Scholars in residence", "Royal cantors" (inline brass) */
h1 em, h2 em, h3 em, .big-quote em, .sec.deep h2 em, .cta-band h2 em { color: var(--gold-ink); }
.util a:hover, .foot a:hover { color: var(--gold-ink); }

/* ---------- 9 · no one-word last lines ---------- */
p, .lede, li, dd, figcaption, .cardx p, .kc-day, .tile .muted { text-wrap: pretty; }

/* ---------- 1 · slow-settle photo reveal everywhere (same as the home rows) ----------
   Fade in, then ease from a slight zoom to rest. The clip is the exact inverse of the zoom
   (1/1.1 → 4.55% each side), so photos without a cropping frame (strips, tiles) never spill
   into the gap; the transition lives on the revealed state only. */
.motion [data-img] { clip-path: inset(4.55%); opacity: 0; transform: scale(1.1); transition: none; }
.motion [data-img].in { clip-path: inset(0); opacity: 1; transform: none;
  transition: opacity .8s ease-out, transform 2.6s cubic-bezier(.25,.1,.25,1), clip-path 2.6s cubic-bezier(.25,.1,.25,1);
  transition-delay: calc(var(--i, 0) * 60ms); }
.motion img[data-img].fade-ready.ld { animation: none; }
.motion .mrow-pic [data-img] { clip-path: none; }
@media (hover: hover) and (pointer: fine) {
  .motion .media:hover [data-img].in, .motion .tile:hover [data-img].in, .motion .person:hover .pic [data-img].in,
  .motion .strip > [data-img].in:hover, .motion .nights figure:hover [data-img].in, .motion .room:hover .pic [data-img].in {
    transform: scale(1.035); clip-path: inset(1.7%);
    transition: opacity .8s ease-out, transform 1.2s var(--out), clip-path 1.2s var(--out); transition-delay: 0s;
  }
  .strip > img:hover, .nights figure:hover img { transform: scale(1.035); clip-path: inset(1.7%); }
}

/* ---------- 2 · grids with full rows ---------- */
/* Resort rooms: 8 → 4 × 2 on desktop, 2 × 4 on tablets (phones: swipe strip, item 21) */
@media (min-width: 1180px) { .rooms { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.75rem 1.5rem; } }
@media (min-width: 701px) and (max-width: 1179px) { .rooms { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* five-photo strips (Isla Mujeres, kids' resort activities, water sports) */
@media (min-width: 1100px) { .strip:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; } }
@media (min-width: 701px) and (max-width: 1099px) {
  .strip:has(> :nth-child(5):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; }
  .strip:has(> :nth-child(5):last-child) > * { grid-column: span 2; }
  .strip:has(> :nth-child(5):last-child) > :nth-child(-n + 2) { grid-column: span 3; }
}
@media (max-width: 700px) { .strip:has(> :nth-child(5):last-child) > :first-child { grid-column: 1 / -1; } }

/* Dining bars: 10 → 5 × 2 on desktop, 2 × 5 on tablets */
@media (min-width: 1000px) { .tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2rem 1.25rem; } }
@media (min-width: 701px) and (max-width: 999px) { .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Royal Nights: 11 photos, the first one double width → 3 × 4 full rows */
@media (min-width: 701px) {
  .nights .w2 { grid-column: span 2; }
  .nights .w2 img { aspect-ratio: auto; height: 0; min-height: 0; flex: 1 1 auto; }
}

/* Program cantors: three names in one row */
.bill.bill-names { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bill.bill-names h3 { font-size: 1.6rem; }
@media (max-width: 560px) { .bill.bill-names { grid-template-columns: 1fr; } }

/* Program music: four performers in one row */
@media (min-width: 1000px) { .cards.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem 1.5rem; } }
@media (min-width: 701px) and (max-width: 999px) { .cards.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* three-list columns (Dining "What's on the table"): three across or one, never 2 + 1 */
@media (min-width: 900px) { .cols:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 899px) { .cols:has(> :nth-child(3):last-child) { grid-template-columns: 1fr; gap: .6rem; } }

/* Plan packing list: 4 groups → 4 across on desktop, 2 × 2 on tablets */
@media (min-width: 1100px) { .check-groups { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; } }
@media (min-width: 701px) and (max-width: 1099px) { .check-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Excursions · Royal Sport Club: 4 cards, consistent 4:3 photos */
#sport .cols img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; height: auto; }
#sport .cols .stack { overflow: hidden; }
@media (min-width: 1100px) { #sport .cols { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem 1.5rem; } }
@media (min-width: 701px) and (max-width: 1099px) { #sport .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { #sport .cols { grid-template-columns: 1fr; } }

/* ---------- 6 · room cards: titles get two lines, the size row lines up ---------- */
.room { grid-template-rows: auto auto auto 1fr auto; }
.room-top { flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: .4rem; }
.room-top .view { order: -1; padding-top: 0; white-space: normal; }
.room h3 { font-size: 1.6rem; line-height: 1.15; min-height: 2.3em; }
.area { height: 64px; align-items: flex-end; }     /* 64px = the largest to-scale square */
.room dl { align-self: start; }

/* ---------- 7 · Kashrus portrait in the standard split ---------- */
.media.portrait img { object-position: 50% 12%; }

/* ---------- 8 · gallery: divider before the sign-up band (the lightbox sits between them) ---------- */
main > .sec + .lightbox + .cta-band {
  background-image: linear-gradient(rgba(168,138,80,.3), rgba(168,138,80,.3));
  background-size: min(calc(var(--max) - var(--gutter) * 2), calc(100% - var(--gutter) * 2)) 1px;
  background-position: top center; background-repeat: no-repeat;
}

/* ---------- 22 · kids finder result sentence ---------- */
.finder-sum { font-size: 1.4rem; }

/* ---------- 23 · story viewer: landscape photos shown whole over a blurred copy ---------- */
.sv-media .sv-fr { position: absolute; inset: 0; margin: 0; opacity: 0; overflow: hidden; transition: opacity .35s ease; background: #0b2229; }
.sv-media .sv-fr.on { opacity: 1; }
.sv-media .sv-fr img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 1; transition: none; animation: none; }
.sv-media .sv-fr-bg { display: none; }
.sv-media .sv-fr.fit .sv-fr-bg { display: block; object-position: 50% 50%; filter: blur(28px) brightness(.5) saturate(1.15); transform: scale(1.2); }
.sv-media .sv-fr.fit .sv-fr-ph { object-fit: contain; object-position: 50% 50% !important; }
.sv-media .sv-fr.on .sv-fr-ph { animation: svzoom 6s linear both; }
.sv.paused .sv-media .sv-fr.on .sv-fr-ph { animation-play-state: paused; }
.sv-icon { width: 44px; height: 44px; }

/* ---------- 20 · header inquiry button: not alongside the phone bar, never on the inquiry page ---------- */
@media (max-width: 860px) { .site-head > .wrap > .btn { display: none !important; } }
body:has(#inq) .site-head > .wrap > .btn { display: none !important; }
/* plan: the summary card sits above the form whenever the layout is one column */
@media (max-width: 980px) {
  .plan-grid { display: flex; flex-direction: column; align-items: stretch; }
  .plan-grid .summary { order: -1; position: static; }
}

/* ---------- 19 · footer ---------- */
@media (max-width: 860px) {
  body:has(.mbar) .foot .wrap { padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px)); }   /* the bar hides at the page end */
}
@media (max-width: 700px) {
  .foot .orn { display: none; }      /* the monogram already sits above "Nobody does Pesach…" */
  .foot .wrap { padding-top: 3rem; gap: 2.2rem; }
}
@media (max-width: 520px) {
  .foot-top { grid-template-columns: 1fr; gap: 1.6rem; }
  .foot ul { gap: 0; }
  .foot-top a { display: flex; align-items: center; min-height: 44px; }
  .foot-top > div:nth-child(2) ul, .foot-top > div:nth-child(4) ul { grid-template-columns: 1fr 1fr; column-gap: 1rem; }
  .foot h4 { margin-bottom: .2rem; }
}

/* ---------- 16 · phones: the top bar is one line, just the countdown ---------- */
@media (max-width: 700px) {
  .util .wrap { justify-content: center; flex-wrap: nowrap; padding-block: .5rem; }
  .util .wrap > span:not(.count) { display: none; }
  .util .count { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; font-size: .64rem; letter-spacing: .14em; line-height: 1.6; }
  .util .u-long { display: none; }
}

/* ---------- 21 · resort rooms on phones: a swipe strip like the other rails ---------- */
@media (max-width: 700px) {
  .rooms.rail { grid-auto-columns: 80%; margin-top: 1.5rem; }
  .rooms.rail .room h3 { font-size: 1.5rem; }
}

/* ---------- 17 · tap targets of at least 44px on phones ---------- */
@media (max-width: 700px) {
  .stepper { grid-template-columns: 48px 3rem 48px; }
  .stepper button { min-height: 48px; }
  .seg button { min-height: 44px; min-width: 68px; }
  .kid-x { width: 44px; height: 44px; }
  .add-kid { min-height: 48px; }
  .room-pick { display: inline-flex; align-items: center; min-height: 44px; }
  [data-gallery] + .note a { display: inline-flex; align-items: center; min-height: 44px; }
  .linkbtn { min-height: 44px; padding-inline: .5rem; margin-right: -.5rem; }
  .subnav a { display: flex; align-items: center; min-height: 46px; padding-block: 0; }
}

/* ---------- 18 · tiny uppercase labels: at least 11px on phones ---------- */
@media (max-width: 700px) {
  .foot h4, .foot-bot, .hero-strip dt, .day .dow, .day .mon, .kc-who, .kid-n, .cx-label, .cx-more,
  .story-btn .lbl, .room .view, .room dt, .person .role, .bill .role, .nights figcaption, .menu-item .c,
  .contents.trips li span.mono, .ladder small, .kc-day span, .legend, .rail-meta, .summary dt, .mono, .subnav a, .cap {
    font-size: .6875rem; letter-spacing: .14em;
  }
  .gallery button::after { font-size: .6875rem; letter-spacing: .12em; }
  .foot-bot { line-height: 1.6; }
}

/* the hidden phone bar's shadow no longer peeks up at the very end of the page */
.mbar:not(.show) { box-shadow: none; }
/* tablets: the top bar stays one line (the email lives in the footer and the phone bar) */
@media (min-width: 701px) and (max-width: 1000px) { .util .u-mail, .util .u-sep2, .util .u-long { display: none; } }

/* Program › Tefillah & Torah: long text beside one photo.
   Desktop: the photo travels with the reading instead of floating mid-column.
   Stacked: the photo leads the section as a wide banner, not a detached block after the names. */
.split-tall { align-items: start; }
@media (min-width: 901px) {
  .split-tall > .media { position: sticky; top: calc(var(--head-h, 72px) + 4.5rem); }
}
@media (max-width: 900px) {
  .split-tall > .media { order: -1; }
  .split-tall > .media .duo .a { aspect-ratio: 16 / 9; width: 100%; height: auto; object-fit: cover; }
}

/* Kids finder results: one row per child, so 1, 3 or 7 children always line up.
   Wide: who/program | staff | what the day holds. Phones: the same row stacks. */
.kid-cards { grid-template-columns: 1fr; gap: .8rem; }
@media (min-width: 700px) {
  .kid-card { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) minmax(0, 1.35fr);
    grid-template-areas: "head staff day" "head staff night"; column-gap: 2rem; row-gap: .6rem;
    border-top-width: 1px; border-top-color: var(--line); border-left: 3px solid currentColor; padding: 1.3rem 1.6rem; align-items: start; }
  .kid-card header { grid-area: head; }
  .kid-card .kc-staff { grid-area: staff; border-top: 0; padding: 0 0 0 2rem; border-left: 1px solid var(--line); }
  .kid-card .kc-day { grid-area: day; }
  .kid-card .kc-night { grid-area: night; }
}

/* Kids finder inputs: every child gets the same row (age + boy/girl on one line), whatever the age */
.kid-row { grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-areas: "n sel seg x"; }
.kid-row .seg { justify-self: end; }
@media (max-width: 520px) {
  .kid-row { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "n sel x" "seg seg seg"; }
  .kid-row .seg { justify-self: start; }
}

/* four-up facts (Kids › babysitting): 4 across on wide screens, an even 2×2 below — never 3 + 1 */
@media (min-width: 1000px) {
  .facts.facts-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .facts.facts-4 > div { padding: 1.1rem 1.5rem; border-right: 1px solid var(--line); }
  .facts.facts-4 > div:first-child { padding-left: 0; }
  .facts.facts-4 > div:last-child { border-right: 0; padding-right: 0; }
}

/* Home: the header inquiry button waits for the solid off-white header bar
   (once the film and welcome have scrolled away), then fades in with it. */
body.home .site-head > .wrap > .btn { transition: opacity .4s ease, visibility 0s; }
body.home .site-head:not(.solid) > .wrap > .btn { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s ease, visibility 0s .25s; }
