/* West Prince PEI Markets. Plain CSS, no build step. Bump ?v= in the HTML on every change. */

@font-face { font-family: "Bricolage Grotesque"; src: url("../fonts/BricolageGrotesque-var.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Mulish"; src: url("../fonts/Mulish-var.woff2") format("woff2"); font-weight: 200 1000; font-style: normal; font-display: swap; }
@font-face { font-family: "Mulish"; src: url("../fonts/Mulish-italic-var.woff2") format("woff2"); font-weight: 200 1000; font-style: italic; font-display: swap; }

:root {
  --ground: #FAF6EE;
  --band: #F2EADA;
  --white: #FFFFFF;
  --ink: #24222A;
  --muted: #5B5664;
  --purple: #6A3D8F;
  --purple-deep: #55307A;
  --teal: #1D6B74;
  --teal-deep: #124F56;
  --navy: #1F2A4A;
  --red: #C62B3A;
  --gold: #E9A93B;
  --leaf: #4F7B3C;
  --lupin-light: #A98BC6;
  --lupin-pink: #B5588A;
  --line: #E0D7C5;
  --field-line: #7E786F;
  --display: "Bricolage Grotesque", "Trebuchet MS", sans-serif;
  --body: "Mulish", "Segoe UI", sans-serif;
  --wrap: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--ground); color: var(--ink); font-family: var(--body); font-size: 1.0625rem; line-height: 1.65; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { font-family: var(--display); line-height: 1.15; margin: 0; text-wrap: balance; }
h1 { font-weight: 800; color: var(--navy); font-size: clamp(2.1rem, 4vw, 3.1rem); }
h2 { font-weight: 700; color: var(--purple); font-size: clamp(1.65rem, 2.6vw, 2.05rem); }
h3 { font-weight: 700; color: var(--ink); font-size: 1.3rem; }
p { margin: 0 0 1em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: var(--teal); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--teal-deep); }
:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
[id] { scroll-margin-top: 150px; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.narrow { max-width: 780px; margin-left: auto; margin-right: auto; }
.narrow-left { max-width: 780px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 12px; top: -80px; z-index: 200; background: var(--navy); color: var(--white); padding: 12px 18px; border-radius: 6px; }
.skip-link:focus { top: 12px; color: var(--white); }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 22px; border: 2px solid var(--purple); border-radius: 6px; background: var(--purple); color: var(--white); font-family: var(--body); font-weight: 700; font-size: 1rem; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; }
.btn:hover { background: var(--purple-deep); border-color: var(--purple-deep); color: var(--white); }
.btn-outline { background: transparent; color: var(--purple); }
.btn-outline:hover { background: var(--purple); border-color: var(--purple); color: var(--white); }
.btn-light { background: var(--ground); border-color: var(--ground); color: var(--teal-deep); }
.btn-light:hover { background: var(--white); border-color: var(--white); color: var(--teal-deep); }
.btn-small { min-height: 36px; padding: 6px 16px; font-size: .95rem; }

/* Header */
.site-header { position: -webkit-sticky; position: sticky; top: 0; z-index: 120; overflow-anchor: none; background: var(--ground); border-bottom: 1px solid var(--line); }
.top-strip { background: var(--band); }
.strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 1320px; margin: 0 auto; padding: 4px 24px; min-height: 44px; }
.tagline { margin: 0; font-style: italic; font-size: .98rem; color: var(--ink); }
.header-inner { position: relative; display: flex; align-items: center; gap: 26px; max-width: 1320px; margin: 0 auto; padding: 8px 24px; transition: padding .18s ease; }
.brand { display: block; flex: none; }
.brand img { height: 92px; width: auto; transition: height .18s ease; }
.site-header.shrunk .header-inner { padding-top: 6px; padding-bottom: 6px; }
.site-header.shrunk .brand img { height: 68px; }
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 24px; }
.desktop-nav a { display: inline-flex; align-items: center; min-height: 44px; border-bottom: 2px solid transparent; border-top: 2px solid transparent; color: var(--ink); font-weight: 700; font-size: .98rem; text-decoration: none; white-space: nowrap; }
.desktop-nav a:hover { color: var(--purple); border-bottom-color: var(--purple); }
.desktop-nav a[aria-current="page"] { color: var(--purple); border-bottom-color: var(--purple); }

.site-search { position: relative; flex: none; }
.site-search input { width: 210px; height: 44px; padding: 0 46px 0 14px; border: 1.5px solid var(--field-line); border-radius: 6px; background: var(--white); color: var(--ink); font: inherit; font-size: 1rem; -webkit-appearance: none; appearance: none; }
.site-search input::placeholder { color: var(--muted); opacity: 1; }
.search-submit { position: absolute; right: 0; top: 0; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; color: var(--navy); cursor: pointer; }
.search-results { position: absolute; right: 0; top: calc(100% + 6px); z-index: 130; width: 340px; max-width: calc(100vw - 32px); background: var(--white); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 20px rgba(31, 42, 74, .12); overflow: hidden; }
.search-results a { display: block; padding: 11px 14px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.search-results a:last-child { border-bottom: 0; }
.search-results a:hover, .search-results a:focus { background: var(--band); color: var(--ink); }
.search-results strong { display: block; font-family: var(--display); font-weight: 700; color: var(--purple); }
.search-results span { display: block; font-size: .93rem; line-height: 1.4; color: var(--muted); }
.search-empty { margin: 0; padding: 12px 14px; font-size: .97rem; }

.search-toggle, .menu-button { display: none; }
.icon-button { align-items: center; justify-content: center; gap: 8px; min-width: 44px; height: 44px; padding: 0 10px; border: 1.5px solid var(--field-line); border-radius: 6px; background: var(--white); color: var(--navy); font: inherit; font-weight: 700; font-size: .98rem; cursor: pointer; }
.menu { display: none; }
.menu summary { list-style: none; }
.menu summary::-webkit-details-marker { display: none; }
.menu-bars { display: block; width: 20px; height: 14px; border-top: 2px solid currentColor; border-bottom: 2px solid currentColor; position: relative; }
.menu-bars::before { content: ""; position: absolute; left: 0; right: 0; top: 4px; border-top: 2px solid currentColor; }
.menu-panel { position: absolute; left: 0; right: 0; top: 100%; z-index: 125; background: var(--ground); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); box-shadow: 0 10px 18px rgba(31, 42, 74, .1); padding: 6px 16px 18px; }
.menu-panel a:not(.btn) { display: flex; align-items: center; min-height: 52px; border-bottom: 1px solid var(--line); color: var(--ink); font-weight: 700; text-decoration: none; }
.menu-panel a[aria-current="page"] { color: var(--purple); }
.menu-panel .btn { width: 100%; margin-top: 16px; }

@media (max-width: 1239px) {
  .desktop-nav { display: none; }
  .header-inner { gap: 10px; }
  .search-toggle { display: inline-flex; margin-left: auto; }
  .menu { display: block; }
  .menu-button { display: inline-flex; }
  .site-search { display: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 124; padding: 12px 16px; background: var(--ground); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .site-search.open { display: block; }
  .site-search input { width: 100%; height: 48px; }
  .search-submit { right: 16px; top: 12px; height: 48px; }
  .search-results { position: static; width: auto; max-width: none; margin-top: 8px; box-shadow: none; }
  .strip-cta { display: none; }
  .strip-inner { justify-content: center; min-height: 32px; padding: 2px 16px; }
  .tagline { font-size: .9rem; }
}
@media (max-width: 759px) {
  .header-inner { padding: 10px 16px; }
  .brand img { height: 64px; }
  .site-header.shrunk .header-inner { padding-top: 6px; padding-bottom: 6px; }
  .site-header.shrunk .brand img { height: 52px; }
  .site-header.shrunk .top-strip { display: none; }
}

/* Sections */
.section { padding: 64px 0; }
.section-band { background: var(--band); }
.section-tight { padding-top: 0; }
.rule-heading { display: flex; align-items: center; justify-content: center; gap: 22px; margin: 0 0 36px; text-align: center; }
.rule-heading::before, .rule-heading::after { content: ""; flex: 0 1 64px; height: 2px; background: var(--gold); }
.center { text-align: center; }
.center p { text-wrap: balance; }
.actions { margin-top: 28px; }
.wrap > .actions:first-child { margin-top: 0; }
.wrap > .actions + .actions { margin-top: 14px; }
.center .actions, .actions.center { display: flex; justify-content: center; }

/* Home hero: words on a plain panel, photo beside it */
.hero { background: var(--band); }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; max-width: 1600px; margin: 0 auto; }
.hero-text { display: flex; flex-direction: column; justify-content: center; padding: 48px 56px 48px max(24px, calc((100vw - var(--wrap)) / 2 + 24px)); }
.hero-text h1 { font-size: clamp(2.1rem, 3.7vw, 3.05rem); }
.hero-sub { margin: 14px 0 0; font-size: 1.2rem; line-height: 1.5; max-width: 30em; }
.facts { margin: 22px 0 0; max-width: 30em; border-top: 1px solid var(--line); }
.facts li { padding: 9px 0; border-bottom: 1px solid var(--line); }
.facts strong { font-family: var(--display); font-weight: 700; }
.hero-photo { position: relative; overflow: hidden; cursor: pointer; touch-action: pan-y; }
.hero-photo img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 30%; }
.hero-slide { opacity: 0; transition: opacity .8s ease; }
.hero-slide + .hero-slide { position: absolute; left: 0; top: 0; }
.hero-slide.is-showing { opacity: 1; }
@media (min-width: 1601px) { .hero-text { padding-left: 80px; } }

.intro { padding: 52px 0 8px; text-align: center; }
.lead { font-family: var(--display); font-weight: 700; font-size: clamp(1.45rem, 2.4vw, 1.9rem); line-height: 1.25; color: var(--navy); margin: 0 0 14px; text-wrap: balance; }

/* Our Markets: three blocks, each led by a photo */
.markets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.markets-two { grid-template-columns: repeat(2, 1fr); max-width: 780px; margin: 0 auto; }
.market img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; margin-bottom: 18px; }
.market h3 { margin-bottom: 8px; }
.market p { margin-bottom: .6em; }
.market .btn { margin-top: 10px; }

/* Lupins [Levi, 2026-11-10]: the site's theme. They stand in rows along the bottom edge of sections,
   on small hills, in empty corners and columns, in the title bands, and in the page margins on wide
   screens. They grow as you scroll down to them and shrink as you scroll back up.
   Drawn by Client Records/draw_lupins.py. */
.section, .intro, .page-head, .vendor-band, .hero-text { position: relative; }
.lupin { display: block; overflow: visible; pointer-events: none; }
.lp-stem { fill: none; stroke: var(--leaf); stroke-width: 2.4; stroke-linecap: round; }
.lp-leaves ellipse { fill: var(--leaf); }
.lp-florets ellipse { transform-box: fill-box; transform-origin: 50% 50%; }
.fp ellipse { fill: var(--purple); }
.fl ellipse, .fp .b { fill: var(--lupin-light); }
.fk ellipse { fill: var(--lupin-pink); }
.fl .b { fill: #CFC0DE; }
.fk .b { fill: #DDA6C4; }
/* on teal the dark colours disappear, so those lupins are lighter */
.lt .lp-stem { stroke: #8DBE6E; }
.lt .lp-leaves ellipse { fill: #8DBE6E; }
.lt .fl ellipse { fill: #C9B6E2; }
.lt .fk ellipse { fill: #E39ABF; }
.lt .fl .b { fill: #E6DCF2; }
.lt .fk .b { fill: #F3CADD; }

/* a row along the bottom edge of a section */
.verge { position: relative; margin-top: 8px; pointer-events: none; }
.verge-s { height: 116px; }
.verge-m { height: 140px; }
.verge-l { height: 156px; }
.verge-hill { height: 172px; }
.wrap > .verge { margin-top: 28px; }
.prose .verge { margin: 36px 0 -8px; }
.v { position: absolute; bottom: 0; height: auto; }
.v-s { width: 70px; }
.v-m { width: 105px; }
.v-l { width: 150px; }
.v-l1 { left: 3%; }
.v-l2 { left: 15%; }
.v-l3 { left: 28%; }
.v-c { left: 50%; margin-left: -40px; }
.v-r3 { right: 28%; }
.v-r2 { right: 15%; }
.v-r1 { right: 3%; }
.hill { position: absolute; left: 50%; bottom: 0; width: 360px; height: 64px; margin-left: -180px; background: var(--band); border-radius: 180px 180px 0 0 / 64px 64px 0 0; }
.hill-teal { background: var(--teal); }
.lupin-mound { position: absolute; left: 50%; bottom: 16px; width: 230px; height: auto; margin-left: -115px; }
.has-mound { padding-bottom: 0; }
/* tucked rows sit in the section's bottom padding, either side of a centred button */
@media (min-width: 760px) {
  .verge-tuck { position: absolute; left: 0; right: 0; bottom: 0; height: 0; margin: 0; }
}

/* single tufts: the hero panel's corner, the end of a side column */
.hero-tuft { position: absolute; right: 20px; bottom: 0; width: 70px; height: auto; }
.col-tuft { width: 105px; height: auto; margin-top: 32px; }

/* title bands: a large cluster in the empty right end, a small one in the corner on narrow screens */
.lupin-head { position: absolute; right: max(24px, calc(50% - 546px)); bottom: 0; width: 150px; height: auto; }
.lupin-head-sm { display: none; position: absolute; right: 16px; bottom: 0; width: 48px; height: auto; }

/* page margins beside a long section */
.lupin-side { position: absolute; bottom: 0; width: 120px; height: auto; }
.lupin-left { left: calc(50% - 710px); }
.lupin-right { right: calc(50% - 710px); }
.lupin-mid1 { bottom: auto; top: 24%; }
.lupin-mid2 { bottom: auto; top: 56%; }
@media (max-width: 1419px) {
  .lupin-side { width: 70px; }
  .lupin-left { left: calc(50% - 632px); }
  .lupin-right { right: calc(50% - 632px); }
}
@media (max-width: 1263px) { .lupin-side { display: none; } }
@media (max-width: 1000px) { .apply-layout .col-tuft { display: none; } }
@media (max-width: 999px) {
  .lupin-head { display: none; }
  .lupin-head-sm { display: block; }
  .page-head p { padding-right: 58px; }
}

/* Growth follows the scroll. site.js sets --p on each lupin: 0 is a shoot, 1 is full bloom. The stem
   rises first, the leaves open, then the florets open from the bottom up (--i is a floret's place on
   its spire, --k spreads the florets of that spire across the scroll). With reduced motion, or with
   JavaScript off (nojs.css), the lupins simply stand in bloom. */
@media (prefers-reduced-motion: no-preference) {
  .lupin { --p: 0; }
  .lupin .lp-stem { stroke-dasharray: 1; stroke-dashoffset: calc(.9 - .9 * clamp(0, var(--p) / .8, 1)); }
  .lupin .lp-leaves { transform-box: fill-box; transform-origin: 50% 100%; transform: scale(calc(.25 + .75 * clamp(0, var(--p) / .5, 1))); }
  .lupin .lp-florets ellipse { --d: calc(.3 + var(--i, 60) * var(--k, .0095)); scale: clamp(0, (var(--p) - var(--d)) / .12, 1); opacity: clamp(0, (var(--p) - var(--d)) * 30, 1); }
  .lp-florets ellipse:nth-child(1) { --i: 1; }
  .lp-florets ellipse:nth-child(2) { --i: 2; }
  .lp-florets ellipse:nth-child(3) { --i: 3; }
  .lp-florets ellipse:nth-child(4) { --i: 4; }
  .lp-florets ellipse:nth-child(5) { --i: 5; }
  .lp-florets ellipse:nth-child(6) { --i: 6; }
  .lp-florets ellipse:nth-child(7) { --i: 7; }
  .lp-florets ellipse:nth-child(8) { --i: 8; }
  .lp-florets ellipse:nth-child(9) { --i: 9; }
  .lp-florets ellipse:nth-child(10) { --i: 10; }
  .lp-florets ellipse:nth-child(11) { --i: 11; }
  .lp-florets ellipse:nth-child(12) { --i: 12; }
  .lp-florets ellipse:nth-child(13) { --i: 13; }
  .lp-florets ellipse:nth-child(14) { --i: 14; }
  .lp-florets ellipse:nth-child(15) { --i: 15; }
  .lp-florets ellipse:nth-child(16) { --i: 16; }
  .lp-florets ellipse:nth-child(17) { --i: 17; }
  .lp-florets ellipse:nth-child(18) { --i: 18; }
  .lp-florets ellipse:nth-child(19) { --i: 19; }
  .lp-florets ellipse:nth-child(20) { --i: 20; }
  .lp-florets ellipse:nth-child(21) { --i: 21; }
  .lp-florets ellipse:nth-child(22) { --i: 22; }
  .lp-florets ellipse:nth-child(23) { --i: 23; }
  .lp-florets ellipse:nth-child(24) { --i: 24; }
  .lp-florets ellipse:nth-child(25) { --i: 25; }
  .lp-florets ellipse:nth-child(26) { --i: 26; }
  .lp-florets ellipse:nth-child(27) { --i: 27; }
  .lp-florets ellipse:nth-child(28) { --i: 28; }
  .lp-florets ellipse:nth-child(29) { --i: 29; }
  .lp-florets ellipse:nth-child(30) { --i: 30; }
  .lp-florets ellipse:nth-child(31) { --i: 31; }
  .lp-florets ellipse:nth-child(32) { --i: 32; }
  .lp-florets ellipse:nth-child(33) { --i: 33; }
  .lp-florets ellipse:nth-child(34) { --i: 34; }
  .lp-florets ellipse:nth-child(35) { --i: 35; }
  .lp-florets ellipse:nth-child(36) { --i: 36; }
  .lp-florets ellipse:nth-child(37) { --i: 37; }
  .lp-florets ellipse:nth-child(38) { --i: 38; }
  .lp-florets ellipse:nth-child(39) { --i: 39; }
  .lp-florets ellipse:nth-child(40) { --i: 40; }
  .lp-florets ellipse:nth-child(41) { --i: 41; }
  .lp-florets ellipse:nth-child(42) { --i: 42; }
  .lp-florets ellipse:nth-child(43) { --i: 43; }
  .lp-florets ellipse:nth-child(44) { --i: 44; }
  .lp-florets ellipse:nth-child(45) { --i: 45; }
  .lp-florets ellipse:nth-child(46) { --i: 46; }
  .lp-florets ellipse:nth-child(47) { --i: 47; }
  .lp-florets ellipse:nth-child(48) { --i: 48; }
  .lp-florets ellipse:nth-child(49) { --i: 49; }
  .lp-florets ellipse:nth-child(50) { --i: 50; }
  .lp-florets ellipse:nth-child(51) { --i: 51; }
  .lp-florets ellipse:nth-child(52) { --i: 52; }
  .lp-florets ellipse:nth-child(53) { --i: 53; }
  .lp-florets ellipse:nth-child(54) { --i: 54; }
  .lp-florets ellipse:nth-child(55) { --i: 55; }
  .lp-florets ellipse:nth-child(56) { --i: 56; }
  .lp-florets ellipse:nth-child(57) { --i: 57; }
  .lp-florets ellipse:nth-child(58) { --i: 58; }
  .lp-florets ellipse:nth-child(59) { --i: 59; }
  .lp-florets ellipse:nth-child(60) { --i: 60; }
}

/* Upcoming markets: a plain dated list */
.dates { border-top: 1px solid var(--line); }
.dates li { display: grid; grid-template-columns: 300px minmax(0, 1fr) 210px 130px; gap: 6px 24px; align-items: baseline; padding: 14px 4px; border-bottom: 1px solid var(--line); }
.dates .d-date { font-family: var(--display); font-weight: 700; font-size: 1.1rem; color: var(--navy); }
.dates .d-time { text-align: right; white-space: nowrap; }
.side-dates { border-top: 1px solid var(--line); }
.side-dates li { padding: 10px 0; border-bottom: 1px solid var(--line); font-family: var(--display); font-weight: 700; color: var(--navy); }

/* Christmas market vendor list */
.who { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 36px; margin-top: 30px; }
.who h3 { margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.names li { padding: 3px 0; break-inside: avoid; }
.names-two { columns: 2; column-gap: 36px; }

/* Vendor band */
.vendor-band { background: var(--teal); color: var(--white); padding: 60px 0; }
.vendor-band h2, .vendor-band h3 { color: var(--white); }
.vendor-band .rule-heading { margin-bottom: 18px; }
.vendor-band :focus-visible { outline-color: var(--white); }
.fees { display: grid; grid-template-columns: 1fr 1fr; gap: 0; max-width: 860px; margin: 30px auto 0; }
.fees > div { padding: 0 32px; }
.fees > div + div { border-left: 1px solid rgba(255, 255, 255, .32); }
.fees h3 { margin-bottom: 6px; }

/* Photo grid */
.photo-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.photo-grid img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 4px; }

/* Two columns: photo beside words */
.split { display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 56px; align-items: center; }
.split-wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.split img { width: 100%; border-radius: 4px; }
.split h2 { margin-bottom: 14px; }
.big-line { font-family: var(--display); font-weight: 700; font-size: 1.35rem; line-height: 1.3; color: var(--navy); }

/* Inner pages */
.page-head { background: var(--band); padding: 40px 0; }
.page-head p { margin: 12px 0 0; max-width: 46em; font-size: 1.12rem; }
.market-layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 60px; align-items: start; }
.market-layout h2 { margin-bottom: 14px; }
.market-layout aside h2:not(:first-child) { margin-top: 36px; }
.market-layout img { width: 100%; border-radius: 4px; margin-bottom: 28px; }
.spaces { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.space img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; margin-bottom: 20px; }
.space h2 { margin-bottom: 10px; }
.dot-list { margin: 0 0 1em; padding-left: 1.2em; list-style: disc; }
.dot-list li { margin-bottom: .3em; }
.dot-list li::marker { color: var(--purple); }

.prose h2 { margin: 44px 0 14px; }
.prose ul { margin: 0 0 1em; padding-left: 1.2em; list-style: disc; }
.prose li { margin-bottom: .45em; }
.prose li::marker { color: var(--purple); }
.story-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 400px); gap: 56px; align-items: start; }
.story-top img, .story-wide img { width: 100%; border-radius: 4px; }
.story-wide { margin: 44px 0 0; }
.signoff { margin-top: 36px; padding-top: 26px; border-top: 1px solid var(--line); }

.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 60px; align-items: start; }
.contact-grid h2 { margin-bottom: 14px; }
.contact-list { margin: 18px 0 24px; }
.contact-list li { margin-bottom: 12px; }
.contact-link { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 18px; border: 2px solid var(--purple); border-radius: 6px; background: transparent; color: var(--purple); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.contact-link:hover { background: var(--purple); color: var(--white); }
.contact-link svg { flex: none; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.contact-link svg .dot { fill: currentColor; stroke: none; }

/* Forms */
.form { max-width: 780px; }
.apply-layout { display: grid; grid-template-columns: minmax(0, 780px) minmax(0, 1fr); gap: 56px; align-items: start; }
.apply-layout aside { position: -webkit-sticky; position: sticky; top: 150px; }
.apply-layout aside h2 { margin-bottom: 12px; font-size: 1.5rem; }
.apply-head h2 { margin-bottom: 8px; }
.apply-head { margin-bottom: 22px; }
.form fieldset { margin: 0 0 22px; padding: 22px 24px 24px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); min-width: 0; }
.form legend { float: left; width: 100%; padding: 0; margin: 0 0 12px; font-family: var(--display); font-weight: 700; font-size: 1.3rem; color: var(--purple); }
.form legend + * { clear: both; }
.form h3 { margin: 22px 0 6px; font-size: 1.12rem; }
.field { margin-bottom: 16px; }
fieldset > :last-child { margin-bottom: 0; }
fieldset > .field-row:last-child .field { margin-bottom: 0; }
.field label, .group-label { display: block; margin-bottom: 6px; font-weight: 700; }
.field .hint, .hint { font-weight: 400; color: var(--muted); }
.field input, .field textarea, .field select { width: 100%; min-height: 48px; padding: 10px 14px; border: 1.5px solid var(--field-line); border-radius: 6px; background: var(--white); color: var(--ink); font: inherit; font-size: 1rem; }
.field textarea { min-height: 96px; resize: vertical; }
.agreement { margin: 0 0 8px; border-bottom: 1px solid var(--line); }
.agreement summary { padding: 10px 0; color: var(--teal); font-weight: 700; cursor: pointer; }
.agreement summary:hover { color: var(--teal-deep); }
.agreement[open] { padding-bottom: 12px; }
.agreement .dot-list li { margin-bottom: .5em; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.tick { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; padding: 9px 0; cursor: pointer; }
.tick input { flex: none; width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--purple); }
.tick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.choice { border-top: 1px solid var(--line); padding: 10px 0 14px; }
.choice:first-of-type { border-top: 0; }
.choice .tick { font-family: var(--display); font-weight: 700; font-size: 1.15rem; }
.choice-detail { margin-left: 34px; }
.choice-detail p { margin-bottom: .5em; }
.inline-ticks { display: flex; gap: 28px; margin-bottom: 12px; }
.tick-grid { margin-bottom: 12px; }
.agree-list .tick { border-bottom: 1px solid var(--line); }
.agree-list .tick:last-child { border-bottom: 0; }
.hp { position: absolute; left: -9999px; }
.form-note { margin: 0 0 18px; }

/* Footer */
.site-footer { background: var(--teal); color: var(--white); padding: 56px 0 0; }
.site-footer a { color: var(--white); }
.site-footer a:hover { color: var(--white); text-decoration-thickness: 2px; }
.site-footer :focus-visible { outline-color: var(--white); }
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 44px; }
.footer-logo { width: 236px; height: auto; margin-bottom: 14px; }
.footer-tag { font-style: italic; margin: 0; }
.site-footer h2 { font-size: 1.2rem; color: var(--white); margin-bottom: 12px; }
.footer-links li { margin-bottom: 2px; }
.footer-links a { display: inline-flex; align-items: center; min-height: 36px; }
.social-icon { display: inline-flex; align-items: center; gap: 10px; }
.social-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.social-icon svg .dot { fill: currentColor; stroke: none; }
.footer-bottom { margin-top: 44px; padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, .28); font-size: .95rem; }
.footer-bottom .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; }
.footer-bottom p { margin: 0; }
.footer-bottom a { display: inline-block; padding: 12px 0; margin: -12px 0; }

/* Phone bottom bar */
.mobile-bar { display: none; }

@media (max-width: 1000px) {
  .markets { gap: 28px; }
  .who { grid-template-columns: 1fr 1fr; }
  .apply-layout { grid-template-columns: 1fr; gap: 32px; }
  .apply-layout aside { position: static; }
  .dates li { grid-template-columns: 250px minmax(0, 1fr) 130px; }
  .dates .d-place { grid-column: 2; grid-row: 2; }
  .who > div:first-child { grid-column: 1 / -1; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .market-layout { grid-template-columns: 280px minmax(0, 1fr); gap: 40px; }
  .split, .split-wide, .story-top, .contact-grid, .spaces { gap: 36px; }
  .hero-text { padding: 40px 32px 40px 24px; }
}

@media (max-width: 759px) {
  body { font-size: 1rem; padding-bottom: 64px; }
  .wrap { padding: 0 16px; }
  .section { padding: 40px 0; }
  .section-tight { padding-top: 0; }
  .rule-heading { display: block; margin-bottom: 24px; }
  .rule-heading::before { display: none; }
  .rule-heading::after { display: block; width: 56px; margin: 12px auto 0; }
  [id] { scroll-margin-top: 80px; }

  .hero-grid { grid-template-columns: 1fr; }
  .hero-text { padding: 30px 16px 28px; }
  .hero-sub { font-size: 1.08rem; }
  .hero-photo img { height: auto; }
  .intro { padding: 36px 0 0; }

  .markets { grid-template-columns: 1fr; gap: 36px; }
  .verge-s { height: 80px; }
  .verge-m { height: 97px; }
  .verge-l { height: 107px; }
  .verge-hill { height: 110px; }
  .wrap > .verge { margin-top: 20px; }
  .v-s, .hero-tuft { width: 48px; }
  .v-m { width: 71px; }
  .col-tuft { display: none; }   /* the columns stack on phones, so a tuft between them would only be a gap */
  .v-l { width: 102px; }
  .v-l1 { left: 4%; }
  .v-r1 { right: 4%; }
  .v-c { margin-left: -28px; }
  .v-wide { display: none; }
  .hero-tuft { right: 16px; }
  .has-tuck { padding-bottom: 0; }
  .hill { width: 230px; height: 48px; margin-left: -115px; border-radius: 115px 115px 0 0 / 48px 48px 0 0; }
  .lupin-mound { width: 150px; margin-left: -75px; bottom: 12px; }

  .dates li { grid-template-columns: 1fr auto; gap: 2px 16px; padding: 12px 0; }
  .dates .d-date { grid-column: 1 / -1; }
  .dates .d-market { grid-column: 1 / -1; }
  .dates .d-place { grid-column: 1; grid-row: auto; }
  .dates .d-time { grid-column: 2; text-align: right; }

  .who { grid-template-columns: 1fr; gap: 24px; margin-top: 22px; }
  .names-two { columns: 1; }
  .names li { display: inline; padding: 0; }
  .names li::after { content: ", "; }
  .names li:last-child::after { content: ""; }

  .vendor-band { padding: 40px 0; }
  .fees { grid-template-columns: 1fr; gap: 22px; margin-top: 24px; }
  .fees > div { padding: 0; }
  .fees > div + div { border-left: 0; }
  .photo-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .split, .split-wide, .story-top, .contact-grid, .spaces, .market-layout { grid-template-columns: 1fr; gap: 28px; }
  .split img { max-width: 440px; }
  .page-head { padding: 26px 0; }
  .page-head p { font-size: 1.05rem; }
  .market-layout img { margin-bottom: 22px; }
  .prose h2 { margin-top: 34px; }
  .story-wide { margin-top: 32px; }

  .form fieldset { padding: 16px 14px 18px; }
  .form legend { font-size: 1.2rem; }
  .field-row, .tick-grid { grid-template-columns: 1fr; }
  .apply-layout { grid-template-columns: 1fr; gap: 28px; }
  .apply-layout aside { position: static; }
  .footer-links a { min-height: 44px; }
  .choice-detail { margin-left: 0; }
  .form .btn { width: 100%; }

  .site-footer { padding-top: 40px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { margin-top: 30px; }

  .mobile-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 110; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: var(--ground); border-top: 1px solid var(--line); }
  .mobile-bar a { display: flex; align-items: center; justify-content: center; min-height: 48px; border: 2px solid var(--purple); border-radius: 6px; font-weight: 700; text-decoration: none; }
  .mobile-bar .bar-primary { background: var(--purple); color: var(--white); }
  .mobile-bar .bar-plain { background: var(--white); color: var(--purple); }
}

@media (prefers-reduced-motion: reduce) {
  .header-inner, .brand img, .hero-slide { transition: none; }
}