/* Generated by render/render.mjs from render/styles/guide.css. Edit the source, then re-run. */
/* ===== guide page ===== */
.readbar { position: fixed; left: 0; top: 0; z-index: 45; height: 3px; width: 100%; background: var(--brick); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; color: var(--mut); margin-bottom: clamp(14px, 2vw, 26px); }
.crumbs a { text-decoration: none; } .crumbs a:hover { color: var(--brick); } .crumbs i { font-style: normal; color: var(--brick); }
.ghero { padding-block: clamp(18px, 2.4vw, 32px) clamp(30px, 4vw, 56px); }
.ghero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: clamp(26px, 4.4vw, 72px); align-items: center; }
.ghero .eye { color: var(--brick); }
.ghero h1 { font-size: calc(var(--d-k) * clamp(2.6rem, 1.2rem + 5vw, 5.6rem)); margin-top: 12px; text-wrap: balance; }
.ghero .pen { font-family: var(--accent); color: var(--brick); font-size: clamp(1.5rem, 0.9rem + 2vw, 2.7rem); line-height: 1.1; margin-top: 0.25em; }
.ghero .lede { margin-top: clamp(18px, 2.2vw, 28px); }
.gphoto { position: relative; } .gphoto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r); }
.gphoto .hand { position: absolute; right: 16px; bottom: 14px; color: var(--paper); text-shadow: 0 1px 12px rgba(14, 23, 48, 0.8); transform: rotate(-3deg); font-size: 1.6rem; }
.gfacts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0 18px; border-top: 1px solid var(--ink); margin-top: clamp(30px, 4vw, 52px); }
.gfacts div { padding-top: 16px; min-width: 0; } .gfacts dt { color: var(--mut); }
.gfacts dd { margin-top: 6px; font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; font-size: calc(var(--d-k) * clamp(1.15rem, 0.9rem + 0.8vw, 1.5rem)); line-height: 1.15; }
.gfacts dd small { display: block; margin-top: 4px; font-family: var(--body); font-weight: 400; letter-spacing: 0; font-size: 0.88rem; color: var(--mut); }
@media (max-width: 960px) { .gfacts { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 10px; } }
@media (max-width: 860px) { .ghero-grid { grid-template-columns: minmax(0, 1fr); } .gphoto { order: -1; } }
@media (max-width: 560px) { .gfacts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* article + route map */
.walk { background: var(--paper); }
.walk-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: clamp(26px, 4vw, 64px); align-items: start; }
.art { min-width: 0; max-width: 40rem; }
.art > p, .stop > p { font-size: 1.1rem; line-height: 1.7; color: var(--ink); opacity: 0.9; }
.art > p + p, .stop > p + p { margin-top: 16px; }
.art > h2 { font-size: calc(var(--d-k) * clamp(2rem, 1.1rem + 3vw, 3.4rem)); margin-bottom: 22px; text-wrap: balance; }
.art h2 em, .pq em, .picks-h em { font-family: var(--accent); font-style: normal; font-weight: 400; letter-spacing: 0; color: var(--brick); font-size: 0.9em; }
.inl { margin: 30px 0; } .inl img { width: 100%; border-radius: var(--r); aspect-ratio: 3 / 2; object-fit: cover; }
.inl figcaption { margin-top: 10px; font-family: var(--serif); font-style: italic; color: var(--mut); font-size: 1rem; }
.tipcard { margin: 30px 0; background: var(--stone); border-radius: var(--r); padding: 22px 24px 24px; }
.tipcard .hand { display: block; font-size: 1.7rem; transform: rotate(-3deg); transform-origin: left; margin-bottom: 8px; }
.tipcard p { line-height: 1.6; }
.pq { margin: 34px 0; padding-left: 22px; border-left: 3px solid var(--brick); }
.pq p { font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.03em; font-size: calc(var(--d-k) * clamp(1.5rem, 1rem + 1.6vw, 2.2rem)); line-height: 1.15; text-wrap: balance; }
.stop { padding-top: clamp(30px, 4vw, 52px); scroll-margin-top: 90px; }
.stop header { display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 4px 16px; align-items: center; margin-bottom: 18px; padding-top: 18px; border-top: 1px solid var(--ink); }
.stop .num { font-size: calc(var(--d-k) * 4.4rem); line-height: 0.8; color: var(--brick); min-width: 0.6em; transition: color 0.3s; }
.stop .sticker { width: 58px; height: 58px; }
.stop h3 { font-size: calc(var(--d-k) * clamp(1.5rem, 1rem + 1.4vw, 2.2rem)); margin-top: 4px; }
.stop .where { font-family: var(--serif); font-style: italic; color: var(--mut); margin-top: 4px; }
.stop:not(.cur) .num { color: color-mix(in srgb, var(--ink) 22%, transparent); }
.shoplinks { margin-top: 20px; border-top: 1px solid var(--line); }
.shoplinks a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 14px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.shoplinks b { font-weight: 600; } .shoplinks small { grid-column: 1; color: var(--mut); font-size: 0.9rem; } .shoplinks .arrow { grid-row: 1 / span 2; grid-column: 2; }
.shoplinks a:hover b { color: var(--brick); }
.partner { margin: 34px 0 0; border: 1px dashed color-mix(in srgb, var(--ink) 34%, transparent); border-radius: var(--r); padding: 18px 20px; display: grid; gap: 6px; }
.partner .lab { color: var(--mut); } .partner b { font-weight: 700; } .partner p { color: var(--mut); font-size: 0.95rem; }
.rmap-col { position: sticky; top: calc(84px + env(safe-area-inset-top, 0px)); min-width: 0; }
.rmap-col .sheet { background: var(--stone); }
.rmap { position: relative; aspect-ratio: 780 / 476; container-type: inline-size; }
.rmap > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.rmap text { font-family: var(--serif); font-style: italic; font-size: 15px; fill: var(--mut); }
.rmap text.wal { fill: var(--ink); font-weight: 600; } .rmap text.sq { font-size: 13.5px; fill: var(--ink); }
.rmap text.big { font-family: var(--hand); font-style: normal; font-size: 22px; fill: var(--brick); }
.rmap .route { stroke: var(--brick); }
.rpin { position: absolute; translate: -50% -50%; width: clamp(24px, 4.6cqi, 34px); aspect-ratio: 1; border-radius: 50%; border: 1.5px solid var(--ink); background: var(--paper); color: var(--ink); font-family: var(--display); font-weight: 700; font-size: clamp(0.78rem, 2.4cqi, 1.05rem); line-height: 1; display: grid; place-items: center; padding: 0; cursor: pointer; transition: transform 0.3s var(--ease), background-color 0.3s, color 0.3s; }
.rpin:hover { transform: scale(1.12); }
.rpin.done { background: var(--ink); color: var(--paper); }
.rpin.cur { background: var(--brick); border-color: var(--brick); color: var(--paper); transform: scale(1.28); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brick) 28%, transparent); z-index: 2; }
.rcard { margin-top: 12px; display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; background: var(--paper); border-radius: var(--r); box-shadow: 0 0 0 1px var(--line); padding: 12px 16px 12px 12px; }
.rcard .sticker { width: 64px; height: 64px; background: var(--mist); box-shadow: none; }
.rcard .lab { color: var(--brick); } .rcard b { display: block; margin-top: 3px; font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; font-size: calc(var(--d-k) * 1.3rem); }
.rcard small { display: block; color: var(--mut); font-size: 0.88rem; margin-top: 2px; }
.rnav { display: flex; gap: 6px; } .rnav button { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--ink); background: var(--paper); cursor: pointer; font-size: 1rem; }
.rnav button:hover:not(:disabled) { background: var(--ink); color: var(--paper); } .rnav button:disabled { opacity: 0.3; cursor: default; }
@media (max-width: 940px) { .walk-grid { grid-template-columns: minmax(0, 1fr); } .rmap-col { position: sticky; top: calc(68px + env(safe-area-inset-top, 0px)); z-index: 5; order: -1; } .rmap-col .hand { display: none; } .rmap-col .sheet { padding: 6px; } .rcard { display: none; } .walk-grid .art { max-width: none; } }
@media (max-width: 940px) and (max-height: 900px) { .rmap-col .sheet { max-width: 520px; margin-inline: auto; } }

/* curator's picks */
.picks { background: var(--ink); color: var(--paper); }
.picks .kick { color: var(--sky-2); }
.picks-h { font-size: calc(var(--d-k) * clamp(2.2rem, 1.1rem + 4vw, 4.4rem)); text-wrap: balance; }
.picks-h em { color: var(--sky-2) !important; }
.picks ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 26px); margin-top: clamp(26px, 3.4vw, 44px); }
.picks li { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 24px 22px 26px; background: color-mix(in srgb, var(--paper) 7%, transparent); border-radius: var(--r); }
.picks li .sticker { width: 74px; height: 74px; margin-bottom: 8px; transform: rotate(-6deg); }
.picks .lab { color: var(--brass); } .picks h3 { font-size: calc(var(--d-k) * 1.6rem); letter-spacing: -0.02em; }
.picks small { font-family: var(--serif); font-style: italic; opacity: 0.8; font-size: 0.98rem; } .picks p { font-size: 0.95rem; line-height: 1.55; opacity: 0.86; }
@media (max-width: 1040px) { .picks ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 560px) { .picks ul { grid-template-columns: minmax(0, 1fr); } }

/* the close, more time, parking */
.close-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(26px, 4vw, 64px); align-items: start; }
.close-grid .lead-p { font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.025em; font-size: calc(var(--d-k) * clamp(1.4rem, 1rem + 1.3vw, 2rem)); line-height: 1.3; }
.close-grid h3 { font-size: calc(var(--d-k) * 1.7rem); margin: 30px 0 10px; }
.close-grid p.body { font-size: 1.05rem; line-height: 1.7; opacity: 0.9; } .close-grid p.body + p.body { margin-top: 14px; }
.gcards.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .close-grid { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 760px) { .gcards.three { grid-template-columns: minmax(0, 1fr); } }
.mail { border-top: 3px solid var(--paper); }
/* ===== every other guide: the article, its contents list, the questions ===== */
.guide-grid { grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); }
.art.prose { max-width: 42rem; }
.prose .guide-prose + h2, .prose .guide-prose + .guide-prose { margin-top: clamp(34px, 4vw, 52px); }
.prose h2.d { font-size: calc(var(--d-k) * clamp(1.9rem, 1.1rem + 2.6vw, 3rem)); margin-bottom: 22px; text-wrap: balance; scroll-margin-top: 96px; }
.prose h3 { font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; line-height: 1.12; font-size: calc(var(--d-k) * clamp(1.45rem, 1rem + 1.2vw, 1.95rem)); margin: clamp(34px, 4vw, 48px) 0 14px; padding-top: 18px; border-top: 1px solid var(--line); scroll-margin-top: 96px; text-wrap: balance; }
.prose h4 { font-weight: 700; margin: 24px 0 8px; }
.prose p { font-size: 1.1rem; line-height: 1.7; color: var(--ink); }
.prose p + p, .prose p + ul, .prose p + ol, .prose ul + p, .prose ol + p { margin-top: 16px; }
.prose ul { list-style: disc; } .prose ol { list-style: decimal; }
.prose ul, .prose ol { padding-left: 1.3em; font-size: 1.08rem; line-height: 1.65; } .prose li + li { margin-top: 6px; }
.prose strong { font-weight: 700; }
.prose a { color: var(--brick); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.prose > .guide-prose > p:first-child { font-size: 1.22rem; }
.prose .tip-box { margin: 30px 0; background: var(--stone); border-radius: var(--r); padding: 22px 24px 24px; }
.prose .tip-box-label { display: block; font-family: var(--hand); color: var(--brick); font-size: 1.7rem; line-height: 1.1; transform: rotate(-3deg); transform-origin: left; margin-bottom: 8px; text-transform: lowercase; }
.prose .tip-box p { font-size: 1rem; line-height: 1.6; }
.prose .inline-image, .prose figure, .prose .guide-figure { margin: 32px 0; }
.prose .inline-image img, .prose figure img { display: block; width: 100%; border-radius: var(--r); aspect-ratio: 3 / 2; object-fit: cover; }
.prose .guide-figure-img { border-radius: var(--r); min-height: 340px; background-size: cover !important; background-position: center !important; }
.prose .inline-image-caption, .prose figcaption, .prose .photo-credit { margin-top: 10px; font-family: var(--serif); font-style: italic; color: var(--mut); font-size: 0.98rem; line-height: 1.45; }
.prose .pull-quote, .prose blockquote:not(.instagram-media) { margin: 36px 0; padding-left: 22px; border-left: 3px solid var(--brick); font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.03em; font-size: calc(var(--d-k) * clamp(1.45rem, 1rem + 1.4vw, 2.1rem)); line-height: 1.14; text-wrap: balance; }
.prose blockquote p { font: inherit; }
.prose .editor-mention { margin: 22px 0; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); }
.prose .editor-mention-label { font-weight: 700; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brick); }
.prose .editor-mention-name { margin: 6px 0 8px; font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; font-size: 1.3rem; }
.prose .editor-mention-name strong { font-weight: inherit; }
.prose .editor-mention p { font-size: 1rem; }
.prose .affiliate-strip { margin: 32px 0; border: 1px dashed color-mix(in srgb, var(--ink) 34%, transparent); border-radius: var(--r); padding: 18px 20px; display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.prose .affiliate-strip-label { font-weight: 700; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mut); }
.prose .affiliate-strip-headline { font-weight: 700; margin-top: 4px; } .prose .affiliate-strip-sub { color: var(--mut); font-size: 0.95rem; }
.prose .affiliate-strip-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 999px; background: var(--ink); color: var(--paper); font-weight: 700; text-decoration: none; }
.prose .featured-shop { margin: 26px 0; padding: 22px 24px; border-radius: var(--r); background: var(--mist); }
.prose .featured-shop-badge { display: inline-block; font-weight: 700; font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper); background: var(--brick); border-radius: 999px; padding: 4px 10px; }
.prose .featured-shop-name { margin-top: 10px; font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; font-size: 1.6rem; }
.prose .featured-shop-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 10px; color: var(--mut); font-size: 0.92rem; }
.prose .featured-shop-desc p { font-size: 1rem; }
.prose .featured-shop-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.prose .featured-shop-btn { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--ink); color: var(--ink); text-decoration: none; font-weight: 600; font-size: 0.92rem; }
.prose .featured-shop-btn.primary { background: var(--ink); color: var(--paper); }
.prose .featured-shop-embed { margin-top: 14px; }
.prose .jump-to { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; align-items: center; }
.prose .jump-to-label { font-weight: 700; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mut); margin-right: 4px; }
.prose .jump-to a { border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px; font-size: 0.9rem; text-decoration: none; color: var(--ink); }
.prose .event-calendar { margin: 30px 0; padding: 22px; border-radius: var(--r); background: var(--ink); color: var(--paper); }
.prose .event-calendar-eyebrow { font-weight: 700; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sky-2); }
.prose .event-calendar-title { border: 0; padding: 0; margin: 6px 0 16px; color: var(--paper); }
.prose .event-calendar-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.prose .event-calendar-card { margin: 0 !important; padding: 14px; border-radius: 6px; background: color-mix(in srgb, var(--paper) 8%, transparent); }
.prose .event-calendar-card--anchor { background: var(--brick); }
.prose .event-date { font-weight: 700; color: var(--brass); font-size: 0.9rem; } .prose .event-name { font-family: var(--display); font-weight: var(--d-w); font-size: 1.15rem; margin-top: 4px; } .prose .event-venue { font-size: 0.85rem; opacity: 0.8; margin-top: 4px; }
.prose .parking-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 20px 0; }
.prose .parking-card { border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.prose .parking-name { font-weight: 700; } .prose .parking-detail { color: var(--mut); font-size: 0.92rem; margin-top: 4px; } .prose .parking-price { display: inline-block; margin-top: 6px; font-weight: 700; font-size: 0.85rem; color: var(--brick); }

.toc-col { position: sticky; top: calc(88px + env(safe-area-inset-top, 0px)); display: grid; gap: 16px; }
.toc { border-top: 1px solid var(--ink); padding-top: 14px; }
.toc .lab { color: var(--brick); margin-bottom: 10px; }
.toc ol { list-style: none; padding: 0; counter-reset: t; max-height: calc(100vh - 300px); overflow: auto; }
.toc li a { display: block; padding: 7px 0 7px 14px; border-left: 2px solid var(--line); text-decoration: none; color: var(--mut); font-size: 0.93rem; line-height: 1.35; transition: color 0.2s, border-color 0.2s; }
.toc li.top a { color: var(--ink); font-weight: 600; }
.toc li a:hover { color: var(--ink); }
.toc li a.cur { color: var(--brick); border-left-color: var(--brick); }
.toc-shops { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px 16px; border-radius: var(--r); background: var(--mist); text-decoration: none; color: var(--ink); }
.toc-shops .sticker { width: 52px; height: 52px; }
.toc-shops b { display: block; font-size: 1.15rem; } .toc-shops small { display: block; color: var(--mut); font-size: 0.85rem; margin-top: 2px; }
@media (max-width: 940px) { .guide-grid { grid-template-columns: minmax(0, 1fr); } .toc-col { position: static; order: -1; } .toc { display: none; } }

.gfaq { background: var(--mist); }
.faq-list { max-width: 52rem; border-top: 1px solid var(--ink); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 18px 0; cursor: pointer; list-style: none; font-family: var(--display); font-weight: var(--d-w); letter-spacing: -0.02em; font-size: calc(var(--d-k) * clamp(1.15rem, 1rem + 0.5vw, 1.4rem)); line-height: 1.2; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary .chev { width: 14px; height: 14px; flex: none; transition: transform 0.25s; }
.faq-list details[open] summary .chev { transform: rotate(180deg); }
.faq-list details p { padding: 0 0 20px; max-width: 46rem; line-height: 1.65; opacity: 0.9; }

.gphoto.block { aspect-ratio: 4 / 3; border-radius: var(--r); background: var(--sky); display: grid; place-items: center; }
.gphoto.block .art { width: 40%; display: block; } .gphoto.block .ico { width: 100%; height: auto; }
.ghero .tagline { margin-top: 14px; font-family: var(--serif); font-style: italic; color: var(--ink); }
.gfacts.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 560px) { .gfacts.four { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.prose > .guide-prose:first-child > h3:first-child, .prose > .guide-prose:first-child > *:first-child { margin-top: 0; }
.prose > .guide-prose:first-child > h3:first-child { padding-top: 0; border-top: 0; }
.gphoto.drawn { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; }
.gphoto.drawn .gart { padding: 14% 12%; }

.gcredit { margin-top: 8px; font-size: 0.74rem; color: var(--mut); text-align: right; } .gcredit a { color: inherit; }

/* photos inside the article: licensed photos picked for the guide (.gfig) and live Google Maps photos of named places (.gplace) */
.prose figure.gfig, .prose figure.gplace { margin: 30px 0 34px; }
.prose figure.gfig img, .prose figure.gplace img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--r); background: var(--sky); }
.prose figure.gfig figcaption, .prose figure.gplace figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 14px; margin-top: 9px; font-size: 0.86rem; line-height: 1.4; }
.prose figure.gfig figcaption span, .prose figure.gplace figcaption span { color: var(--ink); font-weight: 600; }
.prose figure.gfig figcaption small, .prose figure.gplace figcaption small { color: var(--mut); font-size: 0.74rem; }
.prose figure.gfig figcaption a, .prose figure.gplace figcaption a { color: inherit; }
.gphoto.live .gcredit b { font-weight: 600; }

/* curated gift products */
.gprod { background: var(--paper); }
.pfilter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.pfilter button { font: inherit; font-size: .86rem; padding: 7px 14px; border: 1.5px solid var(--ink); border-radius: 999px; background: #fff; color: var(--ink); cursor: pointer; }
.pfilter button.on { background: var(--ink); color: var(--paper); }
.ptier { display: flex; align-items: center; gap: 10px; margin: 28px 0 12px; font-size: 1.35rem; }
.ptier .pt-ic { display: block; width: 46px; height: 46px; flex: none; transform: rotate(-5deg); }
.ptier .pt-ic .ico { width: 100%; height: 100%; }
.ptier .pt-n { font-family: var(--body); font-size: .78rem; font-weight: 600; color: var(--mut); letter-spacing: .02em; margin-left: 2px; }
.gprod .sec-head { align-items: center; }
.gp-deco { display: flex; align-items: flex-end; gap: 4px; }
.gp-deco .ico { width: 58px; height: 58px; filter: drop-shadow(0 3px 2px rgba(0,0,0,.1)); }
.gp-deco .ico:nth-child(2) { width: 72px; height: 72px; transform: rotate(-6deg); }
.gp-deco .ico:nth-child(3) { width: 84px; height: 84px; }
.gp-deco .ico:nth-child(4) { width: 44px; height: 44px; transform: rotate(10deg); }
@media (max-width: 760px) { .gp-deco { display: none; } }
/* tighter spacing around the picks: the facts strip, the picks and the article read as one page */
section:has(+ .gprod) { margin-bottom: 0; padding-bottom: clamp(14px, 2vw, 24px); }
.sec.gprod { margin-bottom: 0; padding-top: clamp(18px, 2.4vw, 30px); padding-bottom: clamp(18px, 2.4vw, 30px); }
section + .gprod::before { display: none; }
.gprod + section { padding-top: clamp(20px, 2.6vw, 34px); }
.gprod + section::before { margin-bottom: clamp(20px, 2.6vw, 30px); }
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.pcard[hidden], .ptier[hidden] { display: none !important; }
.pcard { background: #fff; border: 1.5px solid var(--ink); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.pc-art { height: 118px; display: grid; place-items: center; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72' fill='none' stroke='%2314213F' stroke-opacity='.18' stroke-width='1.4' stroke-linejoin='round'%3E%3Crect x='8' y='14' width='14' height='11' rx='1'/%3E%3Cpath d='M15 14v11M8 18h14M15 14c-2-4-6-4-5-1M15 14c2-4 6-4 5-1'/%3E%3Ccircle cx='52' cy='50' r='5'/%3E%3Cpath d='M52 45v-3'/%3E%3Cpath d='M44 22l2 2 2-2-2-2z M26 56l1.5 1.5 1.5-1.5-1.5-1.5z'/%3E%3C/svg%3E") 0 0/72px repeat, var(--stone); border-bottom: 1.5px solid var(--ink); }
.pc-art .sticker { width: 78px; height: 78px; }
.pc-art .sticker svg { width: 100%; height: 100%; }
.pc-media { border-bottom: 1.5px solid var(--ink); max-height: 520px; overflow: hidden; }
.pc-media .instagram-media { margin: 0 !important; min-width: 0 !important; width: 100% !important; border: 0 !important; }
.pc-b { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.pc-b h3 { font-size: 1.05rem; line-height: 1.25; margin: 0; }
.pc-for { margin: 0; color: var(--mut); }
.pc-shop { margin: 0; font-size: .9rem; color: var(--mut); }
.pc-why { margin: 0; font-size: .92rem; flex: 1; }
.pc-buy { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; margin-top: 8px; }
.pc-price { font-size: 1.2rem; }
.pc-buy small { color: var(--mut); font-size: .76rem; }
.pc-acts { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; flex-wrap: wrap; margin-top: 10px; }
.pc-acts .btn { font-size: .88rem; padding: 9px 16px; }
.pc-store { font-size: .84rem; color: var(--mut); text-decoration: underline; text-underline-offset: 3px; }
.pc-store:hover { color: var(--ink); }
.pdisc { margin-top: 20px; font-size: .82rem; color: var(--mut); }
@media (max-width: 560px) { .pc-art { height: 84px; } .pc-art .sticker { width: 60px; height: 60px; } .pc-b { padding: 12px 14px 14px; gap: 4px; } .ptier { margin-top: 22px; } }

/* local shops vs picks that ship anywhere */
.pscope { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin: 0 0 12px; border: 1.5px solid var(--ink); border-radius: 999px; background: #fff; }
.pscope button { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .88rem; font-weight: 600; padding: 7px 14px; border: 0; border-radius: 999px; background: transparent; color: var(--ink); cursor: pointer; }
.pscope button .ico { width: 20px; height: 20px; }
.pscope button b { font-weight: 600; font-size: .76rem; color: var(--mut); }
.pscope button.on { background: var(--ink); color: var(--paper); }
.pscope button.on b { color: inherit; opacity: .75; }
.pbrand[hidden] { display: none !important; }
.pbrand { margin-top: 34px; padding-top: 6px; border-top: 1.5px dashed color-mix(in srgb, var(--ink) 30%, transparent); }
.pb-sub { margin: -4px 0 14px; color: var(--mut); font-size: .95rem; max-width: 46em; }
.pc-ship { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); background: color-mix(in srgb, var(--brass, #E9C46A) 28%, #fff); border-radius: 999px; padding: 2px 8px; }
/* holiday-hours tables (guides/*-holiday-hours-*): readable on a phone, the mall column stays put while the days scroll */
.hh-wrap,.sec table.hh{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
table.hh{border-collapse:collapse;width:100%;margin:1.2rem 0;font-size:.95rem;font-variant-numeric:tabular-nums}
table.hh th,table.hh td{padding:.6rem .75rem;border-bottom:1px solid var(--line,#e6e1d8);text-align:left;white-space:nowrap;vertical-align:top}
table.hh thead th{font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft,#5b5b66);border-bottom:2px solid var(--ink,#1c2033)}
table.hh thead small{display:block;text-transform:none;letter-spacing:0;font-weight:400}
table.hh tbody th{position:sticky;left:0;background:var(--paper,#fff);font-weight:600;white-space:normal;min-width:9rem}
table.hh td:empty::after{content:'—'}
/* the Store page: picks gathered from the guides */
.pc-from{margin-top:.55rem;font-size:.8rem}
.pc-from a{color:var(--ink-soft,#5b5b66);text-decoration:underline;text-underline-offset:2px}
.sp-picks .pblock+.pblock{margin-top:clamp(28px,4vw,48px)}
.sp-picks .pfilter{margin-top:.6rem}
.sp-picks [hidden]{display:none!important}
.sp-empty{margin-top:1.5rem;color:var(--ink-soft,#5b5b66)}
@media (max-width:760px){.sp-hero-art:has(.sp-ico){display:none}}
/* Store hub: a street of small shops. Each tile is a storefront: striped awning in the shop's colour, a hanging sign,
   and three things in the window. */
.sp-street{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.2vw,26px)}
.sp-front{grid-column:span 4;display:flex;flex-direction:column;border:1.5px solid var(--ink);border-radius:16px 16px 10px 10px;background:#fff;color:var(--ink);text-decoration:none;box-shadow:5px 6px 0 var(--ink);overflow:hidden;transition:transform .18s,box-shadow .18s;--c:#B4553C}
.sp-front.big{grid-column:span 8}
.sp-front:hover{transform:translate(-2px,-3px);box-shadow:7px 9px 0 var(--ink)}
.sp-awning{height:42px;background:repeating-linear-gradient(90deg,var(--c) 0 26px,#FFF8EC 26px 52px);border-bottom:1.5px solid var(--ink);position:relative}
.sp-awning::after{content:'';position:absolute;left:0;right:0;bottom:-11px;height:11px;background:radial-gradient(circle at 13px 0,var(--c) 12px,transparent 12.5px) 0 0/52px 11px repeat-x,radial-gradient(circle at 39px 0,#FFF8EC 12px,transparent 12.5px) 0 0/52px 11px repeat-x;filter:drop-shadow(0 1.5px 0 var(--ink))}
.sp-sign{display:flex;align-items:center;gap:12px;padding:24px 20px 6px}
.sp-sign-ic{flex:none;width:58px;height:58px;border-radius:50%;border:1.5px solid var(--ink);background:#FFF8EC;display:grid;place-items:center;box-shadow:2px 3px 0 var(--ink)}
.sp-sign-ic svg{width:72%;height:72%}
.sp-sign b{display:block;font-size:clamp(1.2rem,1rem + .7vw,1.6rem);line-height:1.05}
.sp-sign small{display:block;margin-top:4px;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--c)}
.sp-front-dek{padding:4px 20px 0;font-size:.93rem;line-height:1.45;color:var(--ink-soft,#5b5b66)}
.sp-window{margin:14px 16px 0;padding:12px 14px;border:1.5px dashed color-mix(in srgb,var(--c) 55%,#fff);border-radius:10px;background:color-mix(in srgb,var(--c) 7%,#fff);display:grid;gap:7px;font-size:.88rem}
.sp-front.big .sp-window{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
.sp-window span{display:flex;justify-content:space-between;gap:10px;min-width:0}
.sp-window i{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-window em{font-style:normal;font-weight:700;flex:none}
.sp-front .go{margin:auto 20px 18px;padding-top:14px;font-weight:700;font-size:.92rem;color:var(--ink)}
@media (max-width:980px){.sp-front,.sp-front.big{grid-column:span 6}}
@media (max-width:640px){.sp-front,.sp-front.big{grid-column:span 12}.sp-front.big .sp-window{grid-template-columns:1fr}}
/* "In the window": a few picks up front */
.sp-feature .pgrid{margin-top:18px}
.sp-feature .sec-head{align-items:end}
/* sub-shop pages: the row of the other shops */
.sp-hero-sub .sticker{display:inline-grid;width:1.6em;height:1.6em;vertical-align:-.45em;margin-right:.35em}
.sp-subnav{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.sp-subnav a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);text-decoration:none;font-size:.88rem;font-weight:600}
.sp-subnav a span{display:inline-grid;width:1.3em;height:1.3em}
.sp-subnav a span svg{width:100%;height:100%}
.sp-subnav a[aria-current="page"]{background:var(--ink);color:var(--paper,#fff)}
.sp-hero-sub{padding-top:0}
.sp-hero-sub .sp-awning{display:block;margin-bottom:clamp(20px,3vw,34px)}
.sp-hero-sub .eye .sticker{width:1.9em;height:1.9em;vertical-align:-.6em}
/* storefront drawings */
.sp-scene{display:block;width:100%;height:auto}
.sp-front-art{display:block;padding:14px 14px 0}
.sp-front > .sp-awning{display:none}
.sp-sign .sp-tag,.sp-sub-grid .sp-tag{display:block;position:static!important;background:none!important;text-transform:none!important;letter-spacing:0!important;padding:0!important;box-shadow:none!important;font-weight:400;font-family:var(--hand),Georgia,serif;font-style:italic;font-size:1.15rem;color:var(--c,#B4553C);line-height:1;margin-bottom:4px;transform:rotate(-1.5deg);transform-origin:left}
.sp-sign{padding-top:14px}
.sp-front.big .sp-front-art{max-height:none}
/* sub-shop hero */
.sp-sub-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,4vw,56px);align-items:center;margin-top:12px}
.sp-sub-grid .sp-tag{font-size:1.5rem}
.sp-sub-grid h1{font-size:clamp(2.4rem,1.2rem + 4.2vw,4.8rem);line-height:.98}
.sp-sub-grid .eye{margin-top:14px}
.sp-sub-art{filter:drop-shadow(6px 7px 0 #14213F)}
@media (max-width:760px){.sp-sub-grid{grid-template-columns:1fr}.sp-sub-art{max-width:360px}}
/* the featured slot */
.sp-feat-sec{padding-bottom:0}
.sp-feat{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);border:2px solid var(--ink);border-radius:18px;overflow:hidden;background:#fff;box-shadow:7px 8px 0 var(--ink)}
.sp-feat-art{position:relative;display:grid;place-items:center;min-height:280px;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--c) 18%,#fff) 0 18px,color-mix(in srgb,var(--c) 9%,#fff) 18px 36px);border-right:2px solid var(--ink)}
.sp-feat-ic{width:min(62%,220px);aspect-ratio:1;border-radius:50%;background:#fff;border:2px solid var(--ink);display:grid;place-items:center;box-shadow:5px 6px 0 var(--ink)}
.sp-feat-ic svg{width:66%;height:66%}
.sp-feat-burst{position:absolute;top:18px;left:18px;padding:.45em .9em;background:var(--c);color:#fff;border:2px solid var(--ink);border-radius:999px;font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;transform:rotate(-4deg);box-shadow:3px 3px 0 var(--ink)}
.sp-feat-b{padding:clamp(20px,3vw,38px);display:flex;flex-direction:column;gap:10px}
.sp-feat-k{color:var(--c)}
.sp-feat-b h2{font-size:clamp(1.6rem,1.1rem + 1.8vw,2.6rem);line-height:1.05}
.sp-feat-why{font-size:1.05rem;line-height:1.55;color:var(--ink-soft,#5b5b66);max-width:52ch}
.sp-feat-buy{display:flex;align-items:baseline;gap:10px}
.sp-feat-buy .pc-price{font-size:1.6rem}
.sp-feat-buy small{color:var(--ink-soft,#5b5b66)}
.sp-feat .pc-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:6px}
.sp-feat-note{margin-top:12px;font-size:.85rem;color:var(--ink-soft,#5b5b66)}
.sp-feat-note a{color:var(--ink);font-weight:700}
@media (max-width:760px){.sp-feat{grid-template-columns:1fr}.sp-feat-art{min-height:200px;border-right:0;border-bottom:2px solid var(--ink)}}
@media (max-width:760px){.sp-feat-ic{width:min(44%,160px)}.sp-feat-art{min-height:170px}}
.sp-sub-grid .sp-tag{color:var(--c)!important;font-size:1.6rem}
/* the street of buildings (Store hub) */
.sp-hub{padding-top:clamp(26px,4vw,48px)}
.sp-street-h{font-size:clamp(2rem,1.2rem + 3vw,3.4rem);margin-bottom:clamp(14px,2vw,22px)}
.sp-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));align-items:end;padding:clamp(8px,2vw,20px) 0 0;position:relative}
.sp-bldg{position:relative;display:flex;flex-direction:column;color:#14213F;text-decoration:none;outline-offset:-6px}
.sp-bldg-svg{display:block;width:100%;height:auto;overflow:visible}
.sp-bsign{font-family:var(--display);font-weight:800;letter-spacing:.02em}
.sp-bnum{font-family:var(--body);font-weight:800}
.sp-bldg-cap{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 8px 6px;text-align:center}
.sp-bldg-cap b{font-family:var(--body);font-weight:800;font-size:1rem;letter-spacing:.01em}
.sp-bldg-cap i{font-family:var(--hand);font-style:normal;font-size:1.35rem;color:var(--c);line-height:1;filter:brightness(.8)}
.sp-door{transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.sp-btag{transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.sp-bldg:hover .sp-door,.sp-bldg:focus-visible .sp-door{transform:perspective(400px) rotateY(-62deg)}
.sp-bldg:hover .sp-btag,.sp-bldg:focus-visible .sp-btag{transform:rotate(-8deg)}
.sp-bldg:hover .sp-bldg-cap b,.sp-bldg:focus-visible .sp-bldg-cap b{text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){.sp-door,.sp-btag{transition:none}}
@media (max-width:760px){.sp-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-left:0;padding-right:0}.sp-bldg{flex:0 0 68%;scroll-snap-align:center}}
.sp-hero-street{padding:clamp(18px,2.4vw,30px) 0 clamp(26px,3.4vw,44px)}
.sp-hs-top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,3vw,48px);align-items:end;margin:14px 0 clamp(18px,2.6vw,30px)}
.sp-hs-top h1{font-size:clamp(3rem,1.6rem + 6vw,6.4rem);line-height:.9;margin:0}
.sp-hs-top .lede{margin:0;max-width:52ch}
.sp-hero-street .sp-disclose{margin-top:18px;padding:0}
@media (max-width:760px){.sp-hs-top{grid-template-columns:1fr}}
/* store mosaic: photo tiles, colour blocks and price tags in one dense grid (like the districts page) */
.pmosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;gap:16px}
.sk{position:relative;border-radius:var(--r,14px);overflow:hidden;display:flex;flex-direction:column;min-width:0}
.sk[hidden]{display:none!important}
.sk h3{margin:0;line-height:1.15}
.sk .pc-badge{margin:0}
.sk-acts{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:auto}
.sk-acts .btn{font-size:.88rem;padding:9px 16px}
.sk .btn.sk-light{background:#FFF8EC;color:#14213F;border-color:#FFF8EC}
.sk .btn.sk-light:hover{background:#fff}
/* photo: the shop's neighbourhood, two columns by two rows */
.sk-photo{grid-column:span 2;grid-row:span 2;min-height:460px;border:0;background:#14213F;color:#fff;justify-content:flex-end}
.sk-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.sk-photo:hover>img{transform:scale(1.03)}
.sk-dim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,23,48,.05) 25%,rgba(14,23,48,.82) 78%)}
.sk-photo .sk-in{position:relative;display:flex;flex-direction:column;gap:8px;padding:clamp(18px,2.4vw,28px)}
.sk-photo .pc-badge{background:#FFF8EC;color:#14213F;border-color:#FFF8EC}
.sk-at{margin:4px 0 0;color:#F3D9A4}
.sk-photo h3{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.3rem);color:#fff;text-wrap:balance}
.sk-photo .sk-why{margin:0;max-width:46ch;color:rgba(255,255,255,.88);font-size:.95rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sk-store{font-size:.86rem;color:#fff;text-decoration:underline;text-underline-offset:3px}
.sk-tagp{position:absolute;top:18px;right:18px;display:grid;place-items:center;min-width:78px;height:78px;padding:0 10px;border-radius:50%;background:#E9C46A;color:#14213F;font-weight:800;font-size:1.15rem;rotate:8deg;box-shadow:0 6px 18px -8px rgba(0,0,0,.5)}
/* colour block: two columns wide, the sub-shop palette */
.sk-color{grid-column:span 2;background:var(--k);color:#FFF8EC;border:0;flex-direction:row;align-items:stretch;gap:0;min-height:230px}
.sk-color .sk-ic{flex:0 0 32%;display:grid;place-items:center;background:color-mix(in srgb,var(--k) 78%,#000)}
.sk-color .sk-ic .ico{width:62%;height:auto;rotate:-6deg}
.sk-color .sk-in{display:flex;flex-direction:column;gap:8px;padding:20px 22px;min-width:0;flex:1}
.sk-color h3{font-size:clamp(1.2rem,1rem + .7vw,1.6rem);color:#FFF8EC}
.sk-color .sk-shop{color:rgba(255,248,236,.82)}
.sk-color .sk-shop a{color:inherit}
.sk-color .sk-why{margin:0;font-family:var(--serif,Georgia,serif);font-style:italic;font-size:1rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sk-color .sk-price{font-size:1.5rem;color:#FFF8EC}
.sk-color .pc-badge{background:transparent;color:#FFF8EC;border-color:rgba(255,248,236,.7)}
/* price tag: one cell, price first */
.sk-tag{background:#fff;border:1.5px solid var(--ink);padding:16px;gap:6px;min-height:230px}
.sk-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:6px}
.sk-tag .sk-ic{width:54px;height:54px;flex:none}
.sk-tag .sk-ic .ico{width:100%;height:100%}
.sk-tag .sk-price{font-family:var(--display,inherit);font-size:1.9rem;line-height:1}
.sk-tag h3{font-size:1.02rem}
.sk-shop{margin:0;font-size:.86rem;color:var(--mut)}
.sk-shop a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.sk-go{font-weight:700;font-size:.92rem;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--brick);padding-bottom:2px}
.sk-go:hover{color:var(--brick)}
.sk-tag:nth-child(3n+2){rotate:-.6deg}.sk-tag:nth-child(3n){rotate:.5deg}
@media (max-width:980px){.pmosaic{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pmosaic{grid-template-columns:minmax(0,1fr);gap:12px}.sk-photo,.sk-color{grid-column:auto}.sk-photo{grid-row:auto;min-height:420px}.sk-color{flex-direction:column}.sk-color .sk-ic{flex-basis:auto;padding:14px 0}.sk-color .sk-ic .ico{width:64px}.sk-tag{min-height:0}.sk-tag:nth-child(n){rotate:0deg}}
@media (prefers-reduced-motion:reduce){.sk-photo>img{transition:none}}

/* cleaner tiles: the product name leads */
.sk-tag h3{font-size:1.22rem;font-weight:800;line-height:1.2;letter-spacing:-.005em}
.sk-tag .sk-shop{font-size:.84rem}
.sk-color h3{font-size:clamp(1.45rem,1.1rem + 1vw,2rem)}
.sk-color .sk-in{justify-content:center;gap:10px}
.sk-color .sk-acts{margin-top:12px}
.sk-at{margin:0;color:rgba(255,255,255,.85);font-size:.95rem}
.sk-photo h3{font-size:clamp(1.7rem,1.2rem + 1.6vw,2.6rem)}
