/* Small Town Mahj — homepage tabletop chapters
   This file intentionally overrides the older section language only on Home. */

body {
  background-color: #fff9ee;
  background-image: url('/decor/tabletop-border-pattern.svg');
  background-size: 96px 96px;
  background-position: center top;
}

.tabletop-shell {
  border-color: #124d98;
  background-color: #062b67;
  background-image:
    radial-gradient(circle at 18% 7%, rgba(95, 146, 207, 0.18), transparent 28rem),
    radial-gradient(circle at 86% 34%, rgba(0, 10, 38, 0.24), transparent 34rem),
    repeating-linear-gradient(76deg, rgba(255,255,255,0.018) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(2deg, rgba(0,0,0,0.018) 0 1px, transparent 1px 5px);
  box-shadow:
    0 0 0 4px #f4ebdb,
    0 0 0 8px #124d98,
    0 16px 44px rgba(2, 25, 64, 0.32),
    inset 0 0 78px rgba(0, 13, 45, 0.38);
}

.tabletop-shell::before {
  inset: 9px;
  border: 0;
  border-radius: 2px;
  background:
    linear-gradient(90deg, transparent 0 18px, rgba(255,250,240,.34) 18px 20px, transparent 20px calc(100% - 20px), rgba(255,250,240,.34) calc(100% - 20px) calc(100% - 18px), transparent calc(100% - 18px)),
    linear-gradient(0deg, transparent 0 18px, rgba(255,250,240,.34) 18px 20px, transparent 20px calc(100% - 20px), rgba(255,250,240,.34) calc(100% - 20px) calc(100% - 18px), transparent calc(100% - 18px));
  opacity: .72;
}

/* Refine the existing rack so it reads as an object, not a dark widget. */
.site-nav {
  border-color: rgba(255,250,240,.2);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 35%),
    linear-gradient(90deg, #051b44, #0b376f 48%, #041a43);
  box-shadow: 0 9px 20px rgba(0,12,38,.26), inset 0 1px rgba(255,255,255,.08);
}

.site-nav .rack-tile {
  min-height: 41px;
  background:
    radial-gradient(circle at 20% 12%, rgba(255,255,255,.85), transparent 28%),
    linear-gradient(180deg, #fffaf0, #eadfcd);
  box-shadow: 0 3px 0 #c7b69b, 0 5px 7px rgba(0,12,40,.2), inset 0 0 0 2px rgba(255,255,255,.42);
}

.site-nav .rack-tile[aria-current='page'] {
  box-shadow: 0 1px 0 #c7b69b, 0 3px 5px rgba(0,12,40,.18), inset 0 0 0 2px rgba(232,143,37,.42);
}

.table-chapter {
  position: relative;
  isolation: isolate;
  overflow: clip;
  color: rgba(255,250,240,.88);
  padding: clamp(5.5rem, 10vw, 9rem) 0;
}

.table-chapter::before {
  position: absolute;
  z-index: -2;
  inset: 0;
  content: '';
  pointer-events: none;
}

.table-chapter .eyebrow { color: #efb441; }
.table-chapter h2,
.table-chapter h3 { color: #fffaf0; }
.table-chapter p { color: rgba(255,250,240,.78); }

.table-link {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  border-bottom: 1px solid rgba(255,250,240,.55);
  color: #fffaf0;
  padding-bottom: .25rem;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-decoration: none;
  text-transform: uppercase;
}

.table-link span {
  color: #efb441;
  font-size: 1.05rem;
  transition: transform 180ms ease;
}
.table-link:hover span { transform: translateX(.28rem); }

/* ---------------------------------------------------------
   The table travels
   --------------------------------------------------------- */
.travel-chapter {
  min-height: min(900px, 92svh);
  display: grid;
  align-items: center;
}

.travel-chapter::before {
  background:
    radial-gradient(circle at 68% 48%, rgba(79,131,185,.18), transparent 28rem),
    linear-gradient(180deg, rgba(1,20,57,.25), rgba(2,30,73,.02));
}

.travel-stage {
  display: grid;
  grid-template-columns: minmax(280px,.7fr) minmax(520px,1.3fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);
}

.travel-copy { position: relative; z-index: 4; }
.travel-copy h2 { max-width: 7.2em; margin-bottom: 1.4rem; font-size: clamp(3.6rem,6vw,6.7rem); }
.travel-copy > p:not(.eyebrow) { max-width: 31rem; margin-bottom: 1.8rem; font-size: 1.08rem; }

.travel-table {
  position: relative;
  width: min(720px, 57vw);
  aspect-ratio: 1.25;
  justify-self: end;
  border: 3px solid rgba(255,250,240,.65);
  border-radius: 14px 18px 12px 20px;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.045), transparent 58%),
    repeating-linear-gradient(74deg, rgba(255,255,255,.018) 0 1px, transparent 1px 5px),
    #0b376f;
  box-shadow: 0 24px 46px rgba(0,8,30,.33), inset 0 0 0 9px rgba(255,250,240,.08);
  transform: rotate(3deg);
}

.travel-table::before,
.travel-table::after {
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(255,250,240,.18);
  content: '';
}

.travel-table::after {
  inset: 50% auto auto 50%;
  width: 52%;
  height: 64%;
  border: 1px solid rgba(239,180,65,.48);
  transform: translate(-50%,-50%);
}

.travel-table__center {
  position: absolute;
  top: 50%; left: 50%;
  display: grid;
  width: 116px; aspect-ratio: 1;
  place-items: center;
  border: 2px solid #124d98;
  border-radius: 10px;
  background: #fffaf0;
  box-shadow: 0 6px 0 #c6b79f, 0 14px 22px rgba(0,12,40,.28);
  color: #124d98;
  font-family: var(--serif);
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: .18em;
  transform: translate(-50%,-50%) rotate(-3deg);
}

.travel-label {
  position: absolute;
  color: rgba(255,250,240,.9);
  font-family: var(--serif);
  font-size: clamp(1rem,1.5vw,1.35rem);
  font-style: italic;
  white-space: nowrap;
}
.travel-label--one { top: -10%; left: 18%; transform: rotate(-4deg); }
.travel-label--two { top: 7%; right: -8%; transform: rotate(5deg); }
.travel-label--three { top: 44%; right: -12%; transform: rotate(3deg); }
.travel-label--four { right: 3%; bottom: -9%; transform: rotate(-3deg); }
.travel-label--five { left: 30%; bottom: -11%; transform: rotate(2deg); }
.travel-label--six { bottom: 2%; left: -11%; transform: rotate(-5deg); }
.travel-label--seven { top: 40%; left: -15%; transform: rotate(-3deg); }
.travel-label--eight { top: 6%; left: -8%; transform: rotate(4deg); }

.travel-mini-tile {
  position: absolute;
  width: 48px;
  aspect-ratio: .74;
  border: 1px solid #124d98;
  border-radius: 5px;
  background: #fffaf0;
  box-shadow: 0 4px 0 #c7b69b, 0 9px 14px rgba(0,10,35,.28);
}
.travel-mini-tile::before { position:absolute; inset:11px; border:2px solid #ef7869; border-radius:50%; content:''; }
.travel-mini-tile--one { top: 16%; left: 34%; transform: rotate(-13deg); }
.travel-mini-tile--two { right: 24%; bottom: 18%; transform: rotate(8deg); }
.travel-mini-tile--three { left: 16%; bottom: 24%; transform: rotate(-5deg); }

.has-js .travel-table[data-place] { opacity:0; transform: translateY(34px) rotate(5deg); }
.has-js .travel-table[data-place][data-visible='true'] { opacity:1; transform: translateY(0) rotate(3deg); }

/* ---------------------------------------------------------
   Beginner chapter
   --------------------------------------------------------- */
.beginner-chapter {
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.55), transparent 24rem),
    linear-gradient(145deg, #f8dfdc, #f3cfcb 55%, #f6ddd8);
  color: #17385f;
}

.beginner-chapter::after {
  position:absolute;
  right:-7rem;
  bottom:-5rem;
  width:24rem;
  height:18rem;
  background:url('/decor/porcelain-sprig.svg') center/contain no-repeat;
  content:'';
  opacity:.14;
  transform:rotate(-10deg);
}

.beginner-chapter .eyebrow { color:#124d98; }
.beginner-chapter h2 { color:#082f67; }
.beginner-chapter p { color:#36506f; }

.beginner-stage {
  display:grid;
  grid-template-columns:minmax(300px,.76fr) minmax(520px,1.24fr);
  align-items:center;
  gap:clamp(3rem,8vw,8rem);
}

.beginner-heading h2 { margin-bottom:1.5rem; font-size:clamp(4rem,7.2vw,7.4rem); line-height:.84; }
.beginner-heading h2 span,.beginner-heading h2 em { display:block; }
.beginner-heading h2 em { margin-top:.1em; color:#e26358; font-style:italic; transform:translateX(.48em); }
.beginner-heading > p:last-child { font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.65rem); }

.reassurance-rack {
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-items:end;
  gap:clamp(.7rem,1.5vw,1.15rem);
  padding:0 1rem 1.35rem;
}
.reassurance-rack::after {
  position:absolute;
  z-index:0;
  right:0; bottom:0; left:0;
  height:22px;
  border-radius:3px 3px 8px 8px;
  background:linear-gradient(180deg,#2b5d94,#0a326a 72%);
  box-shadow:0 8px 12px rgba(35,57,91,.24);
  content:'';
}

.reassurance-tile {
  position:relative;
  z-index:1;
  display:grid;
  min-height:270px;
  align-content:center;
  justify-items:center;
  border:2px solid rgba(18,77,152,.68);
  border-radius:9px 8px 10px 7px;
  background:
    radial-gradient(circle at 20% 12%, rgba(255,255,255,.9), transparent 30%),
    linear-gradient(180deg,#fffaf0,#efe4d3);
  box-shadow:0 7px 0 #c8b89e, 0 18px 25px rgba(48,57,80,.18), inset 0 0 0 5px rgba(255,255,255,.4);
  color:#0b376f;
  padding:1.4rem;
  text-align:center;
}
.reassurance-tile__mark { color:#e26358; font-family:var(--serif); font-size:3.7rem; line-height:1; margin-bottom:1.5rem; }
.reassurance-tile strong { font-family:var(--serif); font-size:clamp(1.45rem,2vw,1.9rem); font-weight:600; line-height:1.02; }
.reassurance-tile small { margin-top:.7rem; color:#56708d; font-size:.66rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }

/* ---------------------------------------------------------
   Photo shuffle / memories
   --------------------------------------------------------- */
.memories-chapter::before {
  background:
    radial-gradient(circle at 18% 76%, rgba(239,120,105,.08), transparent 25rem),
    radial-gradient(circle at 76% 28%, rgba(79,131,185,.16), transparent 30rem);
}
.memories-stage {
  display:grid;
  grid-template-columns:minmax(300px,.75fr) minmax(480px,1.25fr);
  align-items:center;
  gap:clamp(3rem,9vw,9rem);
}
.memories-copy h2 { max-width:8em; margin-bottom:1.5rem; font-size:clamp(3.8rem,6.2vw,6.7rem); }
.memories-lede { max-width:31rem; font-family:var(--serif); font-size:clamp(1.3rem,2vw,1.7rem); line-height:1.42; }
.memories-copy > p:not(.eyebrow) { max-width:32rem; }

.photo-shuffle { position:relative; min-height:590px; display:grid; align-content:center; justify-items:center; }
.photo-shuffle__stack { position:relative; width:min(460px,38vw); aspect-ratio:.86; }
.photo-card {
  position:absolute;
  inset:0;
  margin:0;
  overflow:hidden;
  border:10px solid #fffaf0;
  border-bottom-width:42px;
  background:#efe4d3;
  box-shadow:0 18px 34px rgba(0,10,35,.34), 0 3px 0 rgba(255,255,255,.25) inset;
  transform-origin:50% 110%;
  transition:transform 720ms cubic-bezier(.2,.72,.25,1), opacity 460ms ease;
}
.photo-card:nth-child(1) { transform:rotate(-5deg) translate(-16px,10px); z-index:4; }
.photo-card:nth-child(2) { transform:rotate(5deg) translate(19px,-5px); z-index:3; }
.photo-card:nth-child(3) { transform:rotate(-1deg) translate(-5px,-17px); z-index:2; }
.photo-card:nth-child(4) { transform:rotate(8deg) translate(8px,6px); z-index:1; }
.photo-card.is-shuffling { transform:translate(78%,8%) rotate(16deg); opacity:0; }

.photo-card__art,
.photo-card > img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.photo-card > img { object-fit:cover; }
.photo-card__art {
  overflow:hidden;
  background:
    linear-gradient(145deg, rgba(255,255,255,.34), transparent 38%),
    #d9e8f4;
}
.photo-card__art::before,.photo-card__art::after { position:absolute; content:''; }
.photo-card__art::before { width:70%; aspect-ratio:1; border:2px solid rgba(18,77,152,.36); border-radius:50%; top:-16%; right:-23%; }
.photo-card__art::after { width:40%; height:52%; border:2px solid rgba(18,77,152,.3); left:-8%; bottom:-10%; transform:rotate(28deg); }
.photo-card__art span {
  position:absolute;
  z-index:3;
  right:1.2rem;
  bottom:1rem;
  color:#0b376f;
  font-family:var(--serif);
  font-size:clamp(2rem,4vw,4rem);
  font-style:italic;
  letter-spacing:-.04em;
}
.photo-card__art i { position:absolute; width:58px; aspect-ratio:.74; border:1px solid rgba(18,77,152,.6); border-radius:5px; background:#fffaf0; box-shadow:0 4px 0 #c7b69b; }
.photo-card__art i:nth-of-type(1){ top:18%; left:18%; transform:rotate(-8deg); }
.photo-card__art i:nth-of-type(2){ top:32%; left:39%; transform:rotate(5deg); }
.photo-card__art i:nth-of-type(3){ top:15%; left:57%; transform:rotate(-2deg); }
.photo-card--learn .photo-card__art { background:linear-gradient(145deg,rgba(255,255,255,.3),transparent 40%),#f4d5d0; }
.photo-card--play .photo-card__art { background:linear-gradient(145deg,rgba(255,255,255,.3),transparent 40%),#dfe9d8; }
.photo-card--linger .photo-card__art { background:linear-gradient(145deg,rgba(255,255,255,.3),transparent 40%),#f2dfbb; }

.shuffle-control {
  position:relative;
  z-index:7;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  border:0;
  border-bottom:1px solid rgba(255,250,240,.52);
  background:transparent;
  color:#fffaf0;
  cursor:pointer;
  padding:.55rem .2rem .3rem;
  font-family:var(--serif);
  font-size:1.05rem;
  font-style:italic;
}
.shuffle-control i { color:#efb441; font-style:normal; font-size:1.3rem; transition:transform 180ms ease; }
.shuffle-control:hover i { transform:rotate(45deg); }

/* ---------------------------------------------------------
   Process hand
   --------------------------------------------------------- */
.hand-chapter {
  background:
    linear-gradient(180deg,rgba(255,255,255,.65),rgba(247,241,230,.94)),
    #fffaf0;
  color:#24374d;
}
.hand-chapter .eyebrow { color:#124d98; }
.hand-chapter h2,.hand-chapter h3 { color:#082f67; }
.hand-chapter p { color:#536982; }
.hand-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; margin-bottom:clamp(3rem,6vw,5rem); }
.hand-heading h2 { grid-column:1 / -1; max-width:10em; margin:0; font-size:clamp(3.6rem,5.8vw,6.2rem); }

.mahj-hand {
  position:relative;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:end;
  gap:clamp(.55rem,1vw,.9rem);
  padding:0 .8rem 1.45rem;
}
.mahj-hand__rack {
  position:absolute;
  z-index:0;
  right:0; bottom:0; left:0;
  height:26px;
  border-radius:4px 4px 9px 9px;
  background:linear-gradient(180deg,#3d70a5,#082f67 72%);
  box-shadow:0 9px 15px rgba(20,45,77,.25), inset 0 1px rgba(255,255,255,.2);
}
.hand-tile {
  position:relative;
  z-index:1;
  min-height:315px;
  border:2px solid rgba(18,77,152,.62);
  border-radius:8px 7px 10px 6px;
  background:
    radial-gradient(circle at 17% 11%, rgba(255,255,255,.96), transparent 29%),
    linear-gradient(180deg,#fffdf6,#eee4d2);
  box-shadow:0 8px 0 #c8b89f,0 15px 22px rgba(29,49,73,.16),inset 0 0 0 4px rgba(255,255,255,.48);
  padding:clamp(1.3rem,2vw,1.8rem);
  transform:rotate(var(--rest-r,0deg));
}
.hand-tile__number { display:block; margin-bottom:2.5rem; color:#e26358; font-family:var(--serif); font-size:1rem; font-style:italic; }
.hand-tile h3 { margin-bottom:1rem; font-size:clamp(1.45rem,2vw,2rem); line-height:1.02; }
.hand-tile p { margin:0; font-size:.9rem; line-height:1.55; }

.hand-tile:nth-child(1), .reassurance-tile:nth-child(1) { --deal-x:-44px; --deal-delay:0ms; }
.hand-tile:nth-child(2), .reassurance-tile:nth-child(2) { --deal-x:-22px; --deal-delay:90ms; }
.hand-tile:nth-child(3), .reassurance-tile:nth-child(3) { --deal-x:0px; --deal-delay:180ms; }
.hand-tile:nth-child(4) { --deal-x:22px; --deal-delay:270ms; }
.hand-tile:nth-child(5) { --deal-x:44px; --deal-delay:360ms; }

.has-js .hand-tile[data-deal],
.has-js .reassurance-tile[data-deal] {
  opacity:0;
  transform:translate(var(--deal-x,0), -60px) rotate(var(--rest-r,0deg));
  transition:opacity 430ms ease var(--deal-delay,0ms),transform 760ms cubic-bezier(.2,.72,.25,1) var(--deal-delay,0ms);
}
.has-js .hand-tile[data-deal][data-visible='true'],
.has-js .reassurance-tile[data-deal][data-visible='true'] {
  opacity:1;
  transform:translate(0,0) rotate(var(--rest-r,0deg));
}

/* ---------------------------------------------------------
   Dates
   --------------------------------------------------------- */
.dates-chapter::before {
  background:radial-gradient(circle at 70% 50%,rgba(79,131,185,.16),transparent 31rem);
}
.dates-stage { display:grid; grid-template-columns:minmax(300px,.7fr) minmax(520px,1.3fr); align-items:center; gap:clamp(3rem,8vw,8rem); }
.dates-copy h2 { max-width:7em; margin-bottom:1.4rem; font-size:clamp(3.8rem,6.2vw,6.7rem); }
.dates-copy > p:not(.eyebrow) { max-width:30rem; margin-bottom:2rem; font-size:1.05rem; }
.ceramic-action { display:inline-flex; min-width:190px; min-height:60px; align-items:center; justify-content:space-between; gap:1rem; border:2px solid #fffaf0; border-radius:7px; background:#124d98; box-shadow:0 5px 0 #031d4d,0 10px 18px rgba(0,9,31,.24); color:#fffaf0; padding:.9rem 1rem; font-size:.74rem; font-weight:800; letter-spacing:.13em; text-decoration:none; text-transform:uppercase; }
.ceramic-action i { color:#efb441; font-size:1.3rem; font-style:normal; }

.table-calendar {
  position:relative;
  border:2px solid rgba(18,77,152,.72);
  border-radius:14px 11px 16px 10px;
  background:
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.9),transparent 26%),
    #fffaf0;
  box-shadow:0 9px 0 #c9baa3,0 28px 46px rgba(0,10,35,.34),inset 0 0 0 7px rgba(79,131,185,.11);
  color:#0a326a;
  padding:clamp(1.5rem,3vw,2.4rem);
  transform:rotate(1.5deg);
}
.table-calendar__head { display:flex; align-items:end; justify-content:space-between; gap:1rem; border-bottom:1px solid rgba(18,77,152,.2); padding-bottom:1rem; }
.table-calendar__head strong { font-family:var(--serif); font-size:clamp(2rem,3vw,2.8rem); font-weight:500; }
.table-calendar__head span { color:#6a7890; font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.table-calendar__weekdays,.table-calendar__grid { display:grid; grid-template-columns:repeat(7,1fr); gap:clamp(.35rem,.7vw,.6rem); }
.table-calendar__weekdays { padding:1rem 0 .65rem; color:#708098; font-size:.6rem; font-weight:800; text-align:center; }
.table-calendar__day { position:relative; display:grid; aspect-ratio:1; place-items:center; border:1px solid rgba(18,77,152,.15); border-radius:5px; background:#f0e7d8; box-shadow:0 2px 0 #d4c5ae; color:#788397; font-size:.76rem; }
.table-calendar__day.is-open { border-color:#124d98; background:#fffdf7; box-shadow:0 3px 0 #c7b69b; color:#124d98; font-weight:800; }
.table-calendar__day.is-open::after { position:absolute; width:5px; height:5px; border-radius:50%; background:#e26358; content:''; transform:translate(12px,-12px); }
.table-calendar__day.is-picked { background:#124d98; color:#fffaf0; transform:translateY(-4px); box-shadow:0 6px 0 #082f67,0 10px 14px rgba(0,18,49,.2); }
.table-calendar__day.is-empty { visibility:hidden; }
.has-js .table-calendar[data-place] { opacity:0; transform:translateY(34px) rotate(3deg); }
.has-js .table-calendar[data-place][data-visible='true'] { opacity:1; transform:translateY(0) rotate(1.5deg); }

/* ---------------------------------------------------------
   Final seat
   --------------------------------------------------------- */
.seat-chapter { min-height:88svh; display:grid; align-items:center; background:linear-gradient(180deg,rgba(4,30,72,.18),rgba(2,21,57,.46)); }
.seat-stage { position:relative; min-height:620px; display:grid; place-items:center; }
.seat-tile {
  position:relative;
  z-index:3;
  width:min(760px,78vw);
  min-height:430px;
  display:grid;
  align-content:center;
  justify-items:start;
  border:2px solid rgba(18,77,152,.7);
  border-radius:14px 12px 16px 10px;
  background:
    radial-gradient(circle at 17% 12%,rgba(255,255,255,.92),transparent 28%),
    #fffaf0;
  box-shadow:0 9px 0 #c8b89f,0 30px 50px rgba(0,10,35,.34),inset 0 0 0 7px rgba(79,131,185,.1);
  padding:clamp(2.4rem,6vw,5rem);
  transform:rotate(-1.2deg);
}
.seat-tile h2 { max-width:7em; margin-bottom:1.4rem; color:#082f67; font-size:clamp(4rem,7vw,7rem); }
.seat-tile > p:not(.eyebrow) { color:#4f637b; font-family:var(--serif); font-size:1.25rem; }
.seat-tile .eyebrow { color:#124d98; }
.seat-chair { position:absolute; z-index:1; right:-3%; bottom:4%; width:190px; height:230px; border:8px solid rgba(239,180,65,.55); border-bottom:0; border-radius:90px 90px 0 0; transform:rotate(5deg); }
.seat-chair::after { position:absolute; right:-23px; bottom:-4px; left:-23px; height:16px; border-radius:50%; background:rgba(239,180,65,.52); content:''; }
.seat-piece { position:absolute; z-index:4; left:6%; bottom:8%; display:grid; width:82px; aspect-ratio:.74; place-items:center; border:1px solid #124d98; border-radius:7px; background:#fffaf0; box-shadow:0 5px 0 #c7b69b,0 12px 18px rgba(0,10,35,.28); color:#e26358; font-size:3rem; transform:rotate(-10deg); }
.has-js .seat-tile[data-place] { opacity:0; transform:translateY(32px) rotate(-2.5deg); }
.has-js .seat-tile[data-place][data-visible='true'] { opacity:1; transform:translateY(0) rotate(-1.2deg); }

/* Footer remains on the table instead of dropping back into the old white website. */
.site-footer {
  border-top:1px solid rgba(255,250,240,.2);
  background:rgba(1,20,53,.72);
  color:rgba(255,250,240,.72);
}
.site-footer__brand p,.site-footer__invitation h2,.site-footer__nav a,.site-footer .text-link { color:#fffaf0; }
.site-footer .eyebrow { color:#efb441; }
.site-footer__bottom { border-top-color:rgba(255,250,240,.16); color:rgba(255,250,240,.52); }
.site-footer__brand img { border:6px solid #fffaf0; box-shadow:0 6px 0 #c7b69b,0 14px 22px rgba(0,10,35,.28); transform:rotate(-2deg); }

@media (max-width: 980px) {
  .travel-stage,.beginner-stage,.memories-stage,.dates-stage { grid-template-columns:1fr; }
  .travel-table { width:min(720px,80vw); justify-self:center; margin-top:3rem; }
  .beginner-stage { gap:3.5rem; }
  .memories-stage { gap:2rem; }
  .photo-shuffle__stack { width:min(460px,56vw); }
  .hand-heading { display:block; }
  .mahj-hand { grid-template-columns:repeat(5,minmax(150px,1fr)); overflow-x:auto; padding-bottom:2rem; scroll-snap-type:x proximity; }
  .hand-tile { min-width:160px; scroll-snap-align:start; }
  .mahj-hand__rack { min-width:850px; }
}

@media (max-width: 680px) {
  body { background-size:72px 72px; }
  .tabletop-shell::before { inset:5px; opacity:.52; }
  .table-chapter { padding:5rem 0; }

  .travel-chapter { min-height:auto; }
  .travel-copy h2,.memories-copy h2,.dates-copy h2 { font-size:clamp(3.15rem,13vw,4.4rem); }
  .travel-table { width:calc(100vw - 78px); margin-top:2.8rem; }
  .travel-label { font-size:.9rem; }
  .travel-label--two,.travel-label--three,.travel-label--six,.travel-label--seven { display:none; }
  .travel-table__center { width:84px; font-size:1rem; }
  .travel-mini-tile { width:39px; }

  .beginner-heading h2 { font-size:clamp(3.5rem,15vw,4.8rem); }
  .reassurance-rack { grid-template-columns:1fr; gap:1rem; padding-bottom:1rem; }
  .reassurance-rack::after { height:18px; }
  .reassurance-tile { min-height:210px; }

  .photo-shuffle { min-height:500px; }
  .photo-shuffle__stack { width:min(360px,76vw); }
  .photo-card { border-width:8px; border-bottom-width:36px; }
  .photo-card__art span { font-size:2.6rem; }

  .hand-heading h2 { font-size:clamp(3.1rem,13vw,4.25rem); }
  .mahj-hand { width:calc(100vw - 42px); margin-left:calc((var(--shell) - (100vw - 42px))/2); grid-template-columns:repeat(5,72vw); gap:.8rem; padding-right:12vw; }
  .mahj-hand__rack { display:none; }
  .hand-tile { min-height:300px; }

  .table-calendar { transform:none; padding:1rem; }
  .table-calendar__head { align-items:start; flex-direction:column; }
  .table-calendar__weekdays,.table-calendar__grid { gap:.25rem; }
  .table-calendar__day { font-size:.68rem; }
  .table-calendar__day.is-open::after { transform:translate(8px,-9px); }
  .has-js .table-calendar[data-place],.has-js .table-calendar[data-place][data-visible='true'] { transform:none; }

  .seat-chapter { min-height:760px; }
  .seat-stage { min-height:650px; }
  .seat-tile { width:calc(100% - 6px); min-height:490px; padding:2.2rem 1.4rem; }
  .seat-tile h2 { font-size:clamp(3.3rem,14.5vw,4.6rem); }
  .seat-chair { right:-44px; bottom:2%; width:150px; height:190px; }
  .seat-piece { left:3%; bottom:3%; width:62px; font-size:2.3rem; }
}

@media (prefers-reduced-motion: reduce) {
  .photo-card,.shuffle-control i { transition:none; }
  .photo-card.is-shuffling { opacity:1; }
}
