/* GENERATED by Mini Sessions\preview\build_astro.py - do not hand-edit.
   Source of truth: preview\build_page.py (which keeps the reasoning behind every
   value). Rebuild with: python build_site_assets.py && python build_page.py &&
   python build_astro.py

   Every rule is scoped to .minis-page so nothing here can reach the site header,
   the footer, or any other page. */

.minis-page picture { display: contents; }

.minis-page { margin: 0; background: #fffdfb; color: #2c2723; font-family: "Lato", -apple-system, sans-serif;
         font-weight: 300; line-height: 1.75; font-size: 16px; -webkit-font-smoothing: antialiased;
}
.minis-page h1, .minis-page h2, .minis-page h3, .minis-page h4 { margin: 0; font-weight: 400; font-family: "Forum", Georgia, serif; line-height: 1.06; letter-spacing: .005em;
}
.minis-page p { margin: 0;
}
.minis-page img { display: block; max-width: 100%;
}
.minis-page em { font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-weight: 500;
}
.minis-page a { color: #2c2723; text-decoration: none;
}
.minis-page a:hover { color: #8a6153;
}
.minis-page .mn-hero { background: #f7f2ec; padding: 92px 72px 76px; text-align: center;
}
.minis-page .mn-eyebrow { font-weight: 700; font-size: 11.5px; letter-spacing: .34em; text-transform: uppercase; color: #8a6153; margin-bottom: 26px;
}
.minis-page .mn-hero h1 { font-size: 76px; max-width: 15ch; margin: 0 auto 28px;
}
.minis-page .mn-hero h1 em { color: #8a6153;
}
.minis-page .mn-lede { color: #5a534c; max-width: 56ch; margin: 0 auto; font-size: 18px;
}
.minis-page .mn-facts { display: flex; justify-content: center; align-items: center; gap: 26px; margin: 48px auto 0;
           padding-top: 30px; border-top: 1px solid #e4d9cf; max-width: 1080px; flex-wrap: wrap;
}
.minis-page .mn-facts span.mn-f { font-weight: 700; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #5a534c;
}
.minis-page .mn-facts span.mn-price { color: #8a6153;
}
.minis-page .mn-dot { width: 5px; height: 5px; border-radius: 100px; background: #b39264;
}
.minis-page .mn-sets { background: #fffdfb; padding: 96px 72px 100px;
}
.minis-page .mn-stack { display: flex; flex-direction: column; gap: 104px; max-width: 1200px; margin: 0 auto;
}
.minis-page .mn-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 80px; align-items: center;
}
.minis-page .mn-row.mn-flip .mn-media { order: 2;
}
.minis-page .mn-frame { width: 100%; aspect-ratio: var(--nat); overflow: hidden; background: #efe7df;
           border-radius: 10px; box-shadow: 0 34px 54px -32px rgba(64, 48, 40, .5);
}
.minis-page .mn-frame img { width: 100%; height: 100%; object-fit: cover;
}
.minis-page .mn-sets { padding-left: 40px; padding-right: 40px;
}
.minis-page .mn-stack { max-width: 1520px;
}
.minis-page .mn-row { gap: 60px;
}
.minis-page .mn-frame { position: relative;
}
.minis-page .mn-frame img { transition: opacity .32s ease;
}
.minis-page .mn-frame.mn-swapping img { opacity: 0;
}
.minis-page .mn-onphoto { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 22px 16px;
             background: linear-gradient(to top, rgba(44,39,35,.78), rgba(44,39,35,0));
             color: #f7f2ec; font-size: 12.5px; line-height: 1.55;
             opacity: 0; transition: opacity .3s ease; pointer-events: none;
}
.minis-page .mn-onphoto b { font-weight: 700;
}
.minis-page .mn-frame.mn-on-idea .mn-onphoto { opacity: 1;
}
.minis-page .mn-strip { margin-top: 14px;
}
.minis-page .mn-track { display: flex; gap: 10px; overflow-x: auto; scroll-behavior: auto;
           padding: 4px 2px 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
           overscroll-behavior-x: contain; cursor: grab;
           user-select: none; -webkit-user-select: none;
}
.minis-page .mn-track::-webkit-scrollbar { display: none;
}
.minis-page .mn-track.mn-grabbing { cursor: grabbing;
}
.minis-page .mn-track img { -webkit-user-drag: none; pointer-events: none;
}
.minis-page .mn-thumb { flex: 0 0 108px; border: 0; padding: 0; background: none; cursor: pointer;
           border-radius: 6px; overflow: hidden; position: relative; line-height: 0;
           outline-offset: 3px; transition: transform .25s ease;
}
.minis-page .mn-thumb img { width: 108px; height: 76px; object-fit: cover; border-radius: 6px;
               opacity: .82; transition: opacity .25s ease;
}
.minis-page .mn-thumb:hover { transform: translateY(-3px);
}
.minis-page .mn-thumb:hover img, .minis-page .mn-thumb[aria-current="true"] img { opacity: 1;
}
.minis-page .mn-thumb[aria-current="true"]::after { content: ""; position: absolute; inset: 0;
           border: 2px solid #8a6153; border-radius: 6px;
}
.minis-page .mn-thumb.mn-is-set::before { content: "THE SET"; position: absolute; left: 5px; top: 5px;
           background: rgba(247,242,236,.92); color: #5a534c; font-weight: 700; font-size: 8px;
           letter-spacing: .14em; padding: 3px 6px; border-radius: 3px; z-index: 2;
}
.minis-page .mn-note { color: #7a7169; line-height: 1.65; margin-top: 10px; text-align: center;
          font-weight: 700; letter-spacing: .16em; text-transform: uppercase; font-size: 10.5px;
}
.minis-page .mn-copy { display: flex; flex-direction: column; align-items: flex-start;
}
.minis-page .mn-rule { display: block; width: 46px; height: 1px; background: #b39264; margin-bottom: 24px;
}
.minis-page .mn-setno { font-weight: 700; font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: #727e79; margin-bottom: 14px;
}
.minis-page .mn-copy h3 { font-size: 54px; margin-bottom: 20px;
}
.minis-page .mn-desc { color: #5a534c; max-width: 44ch; margin-bottom: 20px; font-size: 17px;
}
.minis-page .mn-tag { font-weight: 700; font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: #727e79; margin-bottom: 32px;
}
.minis-page .mn-book { font-weight: 700; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #f7f2ec;
          background: #2c2723; padding: 17px 36px; border-radius: 100px;
}
.minis-page .mn-closing { background: #2c2723; padding: 80px 72px; text-align: center;
}
.minis-page .mn-closing .mn-eyebrow { color: #c5aca3; margin-bottom: 22px;
}
.minis-page .mn-closing h2 { font-size: 46px; color: #f7f2ec; max-width: 24ch; margin: 0 auto 34px;
}
.minis-page .mn-closing h2 em { color: #c5aca3;
}
.minis-page .mn-ask { font-weight: 700; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #f7f2ec;
         border: 1px solid rgba(247,242,236,.6); padding: 16px 36px; border-radius: 100px;
}
.minis-page .chip { display: none; font-family: ui-monospace, "Consolas", monospace; font-size: 11px; line-height: 1.5;
          color: #8a6153; background: #f7f2ec; border: 1px dashed #d9c9bd; border-radius: 6px;
          padding: 5px 10px; margin-bottom: 18px;
}
@media (max-width: 900px) {
.minis-page .mn-hero { padding: 56px 24px 48px;
}
.minis-page .mn-hero h1 { font-size: 44px;
}
.minis-page .mn-facts { gap: 16px;
}
.minis-page .mn-sets { padding: 56px 24px 64px;
}
.minis-page .mn-stack { gap: 64px;
}
.minis-page .mn-row { grid-template-columns: minmax(0, 1fr); gap: 28px;
}
.minis-page .mn-row.mn-flip .mn-media { order: 0;
}
.minis-page .mn-row.mn-flip .mn-copy { order: 1;
}
.minis-page .mn-copy h3 { font-size: 38px;
}
.minis-page .mn-closing { padding: 56px 24px;
}
.minis-page .mn-closing h2 { font-size: 32px;
}
.minis-page .mn-onphoto { font-size: 10.5px; line-height: 1.45; padding: 16px 13px 9px;
}
}

.minis-page .mn-hero { padding-top: 168px; }   /* 76px fixed header + the design's 92px */

@media (max-width: 900px) {
  .minis-page .mn-hero { padding-top: 120px; } /* 64px fixed header + the design's 56px */
}