:root {
  --night: #080c09;
  --forest: #092f25;
  --deep-green: #123b2d;
  --gold: #e3ab4b;
  --gold-bright: #f1c56d;
  --gold-text: #8b5a0a;
  --cream: #fffaf3;
  --paper: #f6f0e8;
  --line: #eae2d7;
  --ink: #171a16;
  --muted: #57645b;
  --editorial: Georgia, 'Times New Roman', serif;
  --ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 95px; }
body { margin: 0; color: var(--ink); background: var(--night); font: 14px/1.5 var(--ui); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration-thickness: 1px; }
button, input { font: inherit; }
button { cursor: pointer; }
img { display: block; width: 100%; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: -80px; left: 12px; padding: 12px 18px; background: white; color: black; }
.skip-link:focus { top: 10px; }
.demo-banner { min-height: 32px; display: flex; justify-content: center; align-items: center; gap: 14px; padding: 8px 16px; background: #f3daa7; color: #35250e; text-align: center; font-size: 11px; line-height: 1.4; }
.demo-banner strong { font-size: 10px; font-weight: 800; letter-spacing: .14em; white-space: nowrap; }
.site-shell { max-width: 1600px; margin: auto; background: var(--cream); overflow: clip; }
.global-header { min-height: 76px; display: flex; align-items: center; gap: clamp(12px, 2vw, 33px); padding: 12px clamp(20px, 3vw, 52px); background: #070b08; color: #fff; position: relative; z-index: 3; border-bottom: 1px solid #84704a40; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; gap: 10px; color: #f4c66d; }
.brand-glyph { font: 58px/.8 var(--editorial); transform: translateY(-1px); }
.brand-name { display: block; font-size: 23px; font-weight: 600; letter-spacing: .19em; line-height: 1.05; }
.brand-name small { display: block; margin-top: 7px; font-size: 10px; font-weight: 400; letter-spacing: .045em; color: #f0dbb2; }
.primary-nav { display: flex; gap: clamp(11px, 1.45vw, 24px); align-items: center; margin-left: auto; white-space: nowrap; font-size: 12px; }
.primary-nav a { padding: 9px 0; color: #e8eee7; }
.primary-nav a:hover, .primary-nav a:focus-visible { color: var(--gold-bright); }
.primary-nav a:nth-child(4) { color: var(--gold-bright); }
.global-search { display: flex; gap: 9px; align-items: center; flex: 0 1 295px; min-width: 170px; max-width: 345px; padding: 0 12px; border: 1px solid #e8decf; border-radius: 7px; color: #334036; background: #fffdfa; }
.global-search > span:first-child { font-size: 23px; line-height: 1; }
.global-search:focus-within { outline: 2px solid var(--gold); }
.global-search input { background: transparent; border: 0; width: 100%; min-width: 0; height: 39px; font-size: 11px; outline: 0; color: #141b15; }
.global-search input::placeholder { color: #656963; }
.header-preview { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.header-preview .desktop-only { font-size: 9px; letter-spacing: .13em; color: #e0cba5; white-space: nowrap; }
.header-cart { font-size: 24px; color: #f0e7d8; }
.header-avatar { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #d7ad5d; background: #164032; border-radius: 50%; color: #f1d8a0; font: 20px var(--editorial); }
.marketplace-grid { display: grid; grid-template-columns: minmax(0, 3.15fr) minmax(280px, 1.05fr); align-items: stretch; }
.primary-column, .editorial-column { min-width: 0; }
.hero { position: relative; display: flex; align-items: center; min-height: clamp(465px, 39vw, 610px); overflow: hidden; background: #13160e; color: white; isolation: isolate; }
.hero-photography { position: absolute; z-index: -2; inset: 0 0 0 37%; overflow: hidden; }
.hero-photography img { width: 100%; height: 100%; object-fit: cover; object-position: 47% 31%; filter: saturate(.85) contrast(1.08); }
.hero-photography::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#11180f33,transparent 28%), linear-gradient(90deg,#0b120d 0%,#0b120d1a 38%,#131a0c00 76%); }
.hero-shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#070d08 0%,#10140cbf 29%,#10201855 54%,transparent 77%),linear-gradient(0deg,#08110b96,transparent 32%); }
.hero-content { width: min(61%, 595px); padding: clamp(25px,3.6vw,60px) 0 clamp(26px,4vw,64px) clamp(24px,4.5vw,66px); }
.hero-kicker { margin: 0 0 24px; color: var(--gold-bright); font-size: 10px; letter-spacing: .25em; font-weight: 800; }
.hero h1 { font: 400 clamp(42px,4.9vw,83px)/.98 var(--editorial); letter-spacing: -.056em; margin: 0; text-wrap: balance; text-shadow: 0 2px 24px #06130977; }
.hero h1 em { color: var(--gold-bright); font-style: normal; }
.hero-subtitle { max-width: 390px; font-size: clamp(14px, 1.4vw, 19px); line-height: 1.48; margin: 23px 0 25px; color: #f1f0e8; }
.hero-actions { display: flex; gap: 11px; flex-wrap: wrap; }
.button { min-height: 46px; padding: 12px 19px; display: inline-flex; align-items: center; gap: 20px; justify-content: center; border-radius: 6px; font-size: 12px; font-weight: 740; }
.button:hover { transform: translateY(-1px); }
.button-gold { background: #efb953; color: #1c180c; }
.button-ghost { border: 1px solid #ede5d8ae; color: #fff; background: #06160c6b; }
.hero-disclosure { display: block; margin-top: 21px; color: #e2ddd2; font-size: 10px; }
.hero-notes { display: grid; gap: 7px; position: absolute; bottom: 31px; right: 24px; padding: 15px 18px; border: 1px solid #e9dfc642; border-radius: 8px; color: #fff6dc; background: #0b1912a8; backdrop-filter: blur(7px); font-size: 12px; }
.hero-notes span { display: flex; align-items: center; gap: 9px; }
.hero-notes i { color: var(--gold-bright); font-style: normal; font-size: 18px; min-width: 20px; }
.content-section { padding: clamp(24px,2.8vw,38px) clamp(22px,3vw,44px) 8px; }
.eyebrow { margin: 0 0 6px; color: var(--gold-text); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.section-header { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin-bottom: 16px; }
.section-header h2 { font: 400 clamp(24px,2.2vw,31px)/1.1 var(--editorial); letter-spacing: -.035em; margin: 0; }
.section-meta { color: var(--gold-text); font-size: 11px; max-width: 210px; text-align: right; }
.category-rail { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 9px; }
.category-tile { background: transparent; padding: 0; min-width: 0; border: 0; color: #272f28; font-size: 11px; font-weight: 680; text-align: center; }
.category-tile img { width: 100%; height: clamp(74px,6.8vw,106px); border-radius: 8px; object-fit: cover; background: #eadccd; border: 1px solid #e9e1d3; transition: transform .18s; }
.category-tile:hover img { transform: translateY(-3px); }
.category-tile span { display: block; padding-top: 7px; line-height: 1.2; }
.featured { padding-bottom: 25px; }
.filter-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 15px; }
.filter-buttons { display: flex; gap: 7px; flex-wrap: wrap; }
.chip { min-height: 32px; padding: 6px 12px; background: #fffdfa; border: 1px solid var(--line); color: #33453a; border-radius: 6px; font-size: 11px; font-weight: 630; }
.chip.active { border-color: #123a2d; color: white; background: #123a2d; }
.chip:hover:not(.active) { background: #f2e9dd; }
.result-count { font-size: 10px; color: var(--muted); }
.business-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 13px; }
.business-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; background: #fffcf7; border: 1px solid #eae5da; border-radius: 10px; transition: box-shadow .2s, transform .2s; }
.business-card:hover { transform: translateY(-2px); box-shadow: 0 8px 26px #12231918; }
.business-card[hidden] { display: none; }
.card-art { position: relative; height: clamp(132px, 13vw, 202px); overflow: hidden; background: #ded5c6; }
.card-art img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.card-art small { position: absolute; top: 9px; left: 9px; padding: 5px 8px; color: #2a2013; background: #ffefd1ee; border-radius: 20px; font-size: 9px; font-weight: 800; letter-spacing: .03em; }
.card-contents { padding: 13px 13px 14px; display: flex; flex-direction: column; flex: 1; }
.card-meta { font-size: 10px; color: var(--gold-text); font-weight: 780; }
.business-card h3 { font-size: 14px; margin: 5px 0 4px; letter-spacing: -.02em; }
.card-location { margin: 0; color: var(--muted); font-size: 11px; }
.card-description { margin: 9px 0 14px; font-size: 11px; line-height: 1.6; color: #4e5b51; flex: 1; }
.card-foot { border-top: 1px solid var(--line); padding-top: 9px; display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; font-size: 9px; color: #42584b; }
.card-foot span:last-child { color: #796b53; }
.disclaimer { font-size: 10px; color: #536156; line-height: 1.6; margin: 16px 0 0; }
.empty-state { padding: 35px 15px; border: 1px dashed #c5b08e; text-align: center; color: #615742; border-radius: 9px; }
.editorial-column { background: #0b160e; display: flex; flex-direction: column; gap: 4px; min-height: 100%; border-left: 1px solid #b4b09c; }
.editorial-feature { position: relative; overflow: hidden; }
.member-feature { min-height: 425px; background: radial-gradient(circle at 90% 15%,#24543a,#071e15 63%); color: #fff0d6; }
.member-feature .feature-visual { position: absolute; inset: 0; opacity: .36; }
.member-feature .feature-visual img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.7) brightness(.55); }
.member-feature .feature-copy { position: relative; z-index: 1; padding: clamp(24px,3vw,48px) clamp(18px,2.7vw,39px); }
.feature-eyebrow { margin: 0 0 16px; color: var(--gold-bright); font-size: 9px; font-weight: 800; letter-spacing: .18em; }
.editorial-feature h2 { font: 400 clamp(26px,2.7vw,39px)/1.04 var(--editorial); letter-spacing: -.043em; margin: 0 0 17px; }
.member-feature h2 em { color: var(--gold-bright); font-style: normal; }
.editorial-feature p:not(.feature-eyebrow) { font-size: 13px; line-height: 1.6; margin: 0; max-width: 315px; }
.feature-status { display: inline-block; margin-top: 25px; color: #1c271b; background: #f1c46c; padding: 10px 13px; border-radius: 5px; font-size: 9px; font-weight: 800; letter-spacing: .07em; }
.impact-band { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: clamp(18px,2.4vw,34px); padding: clamp(28px,3vw,46px); color: #fff9ea; background: radial-gradient(circle at 0 100%,#2350397c,transparent 45%),linear-gradient(125deg,#081710,#0a3024 72%,#09160e); }
.impact-band .eyebrow { color: var(--gold-bright); }
.impact-intro h2 { font: 400 clamp(29px,3vw,46px)/1.05 var(--editorial); letter-spacing: -.05em; margin: 0 0 14px; }
.impact-intro p:not(.eyebrow) { margin: 0 0 17px; color: #d7e3d9; font-size: 12px; }
.impact-intro a { font-size: 11px; font-weight: 800; color: #f1c477; }
.impact-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-self: stretch; }
.impact-metrics article { border: 1px solid #78958655; border-radius: 11px; padding: clamp(14px,2vw,24px); background: #061d14ad; }
.impact-marker { display: grid; place-items: center; width: 37px; height: 37px; margin-bottom: 12px; border: 1px solid #e6bd60; border-radius: 50%; color: var(--gold-bright); font-size: 22px; }
.impact-metrics h3 { font-size: 12px; font-weight: 750; margin: 0 0 13px; }
.impact-metrics strong { font-size: clamp(15px,1.65vw,21px); display: block; margin-bottom: 13px; }
.impact-metrics p { font-size: 11px; line-height: 1.55; margin: 0; color: #cad8ca; }
.site-footer { background: #070d09; color: #c6cec3; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 25px clamp(25px,4vw,60px); font-size: 11px; }
.site-footer strong { color: var(--gold-bright); font-size: 18px; letter-spacing: .16em; }
.site-footer small { margin-left: auto; color: #bec9be; font-size: 10px; }
.site-footer a:hover { color: var(--gold-bright); }
.mobile-nav { display: none; }
@media (max-width:1250px) {
  .global-header { gap: 18px; padding-inline: 26px; }
  .primary-nav { gap: 13px; }
  .brand-name { font-size: 18px; }
  .brand-glyph { font-size: 48px; }
  .global-search { max-width: 265px; }
  .desktop-only { display: none; }
  .hero h1 { font-size: clamp(43px,5vw,70px); }
  .hero-notes { display: none; }
  .category-rail { gap: 7px; }
  .category-tile { font-size: 10px; }
  .business-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width:941px) and (max-width:1150px) {
  .member-feature .feature-copy { padding: 10px 14px; }
  .member-feature h2 { font-size: 22px; margin-bottom: 6px; }
  .member-feature .feature-eyebrow { margin-bottom: 6px; }
  .member-feature .feature-copy p:not(.feature-eyebrow) { font-size: 10px; line-height: 1.36; }
  .member-feature .feature-status { margin-top: 7px; padding: 6px 8px; font-size: 8px; }
  .hero-companion > img { object-position: center 36%; }
}
@media (max-width:940px) {
  .global-header { flex-wrap: wrap; padding: 12px 21px; gap: 11px 20px; }
  .primary-nav { margin-left: auto; }
  .global-search { order: 4; flex: 1 1 100%; max-width: 100%; }
  .header-preview { display: none; }
  .marketplace-grid { grid-template-columns: 1fr; }
  .editorial-column { display: grid; grid-template-columns: 1fr 1fr; }
  .member-feature { min-height: 330px; }
  .hero { min-height: 460px; }
  .hero-content { max-width: 540px; }
  .hero h1 { font-size: clamp(45px,6vw,73px); }
  .hero-photography { left: 45%; }
  .category-tile img { height: 90px; }
  .business-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width:640px) {
  body { padding-bottom: env(safe-area-inset-bottom); }
  .demo-banner { display: block; font-size: 10px; padding: 7px 13px; }
  .demo-banner strong { margin-right: 7px; }
  .global-header { display: grid; grid-template-columns: 1fr auto; padding: 12px 16px 13px; gap: 12px; }
  .brand-name { font-size: 19px; }
  .brand-name small { display: none; }
  .brand-glyph { font-size: 43px; }
  .primary-nav { display: none; }
  .brand { grid-column: 1; grid-row: 1; }
  .global-search { grid-column: 1/-1; grid-row: 2; order: initial; margin: 0; height: 43px; }
  .header-preview { display: flex; grid-column: 2; grid-row: 1; justify-self: end; }
  .hero { min-height: 490px; align-items: flex-end; }
  .hero-photography { inset: 0 0 0 32%; }
  .hero-photography img { object-position: 48% 28%; }
  .hero-shade { background: linear-gradient(0deg,#060d08 0%,#060e0bb3 27%,#050b0740 52%,transparent 87%),linear-gradient(90deg,#07150aad 0%,transparent 65%); }
  .hero-content { width: 100%; padding: 22px 22px 27px; }
  .hero-kicker { font-size: 9px; margin-bottom: 11px; }
  .hero h1 { font-size: clamp(42px,9.1vw,59px); }
  .hero-subtitle { font-size: 14px; margin: 16px 0 18px; max-width: 330px; }
  .hero-actions { gap: 8px; }
  .button { min-height: 42px; padding: 10px 15px; font-size: 11px; }
  .hero-disclosure { margin-top: 13px; font-size: 9px; }
  .content-section { padding: 25px 16px 7px; }
  .section-header h2 { font-size: 26px; }
  .section-meta { font-size: 10px; max-width: 140px; }
  .category-rail { display: flex; overflow-x: auto; gap: 12px; padding: 0 0 12px; scroll-snap-type: x proximity; }
  .category-tile { min-width: 80px; max-width: 80px; scroll-snap-align: start; }
  .category-tile img { height: 80px; }
  .featured { padding-bottom: 26px; }
  .filter-row { align-items: start; }
  .business-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .card-art { height: 133px; }
  .card-contents { padding: 11px; }
  .business-card h3 { font-size: 13px; }
  .card-description { font-size: 10px; }
  .editorial-column { display: block; }
  .member-feature { min-height: 305px; }
  .member-feature .feature-copy { padding: 30px 25px; }
  .impact-band { grid-template-columns: 1fr; padding: 27px 18px; }
  .impact-intro h2 { font-size: 37px; }
  .impact-metrics { gap: 8px; }
  .impact-metrics article { padding: 14px; }
  .impact-metrics h3 { font-size: 11px; }
  .impact-metrics p { font-size: 10px; }
  .site-footer { padding: 24px 16px 96px; }
  .site-footer small { margin: 0; }
  .mobile-nav { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); position: fixed; z-index: 10; bottom: 0; left: 0; right: 0; height: calc(67px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid #e1d9cd; background: #fffcf6; box-shadow: 0 -3px 22px #110e0921; }
  .mobile-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10px; font-weight: 650; }
  .mobile-nav a span { font-size: 24px; line-height: 1.1; color: #233c30; }
}
@media (max-width:365px) {
  .hero { min-height: 505px; }
  .hero h1 { font-size: 39px; }
  .hero-kicker { font-size: 8px; }
  .button { padding: 9px 11px; }
  .card-art { height: 110px; }
  .card-foot { font-size: 8px; }
  .chip { font-size: 10px; padding-inline: 10px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; animation: none !important; } }


/* Layout rhythm V2 — deliberate editorial opening followed by full-width shopping.
   Source photo preserves its native proportions; never scale with object-fit:cover. */
.global-header { min-height: 64px; padding: 8px clamp(18px,2.35vw,36px); gap: clamp(13px,1.8vw,28px); }
.brand { flex-shrink: 0; display: inline-flex; align-items: center; }
.brand img { display: block; width: 143px; height: 46px; object-fit: contain; }
.primary-nav { margin-left: auto; gap: clamp(12px,1.6vw,25px); }
.global-search { flex: 0 1 300px; max-width: 330px; }
.global-search input { height: 36px; }
.shop-main { background: var(--cream); }
.marketplace-grid {
  display: grid; grid-template-columns: minmax(0,2.75fr) minmax(290px,1fr);
  align-items: stretch; width: 100%; background: #0a110a;
}
.primary-column { min-width: 0; }
.hero {
  position: relative; isolation: isolate; display: flex; align-items: center;
  height: clamp(415px,32vw,470px); min-height: 0; overflow: hidden;
  color: white; background: radial-gradient(ellipse at 77% 39%,#3b3420 0%,#17281c 32%,#0b140d 75%);
}
.hero-photography {
  position: absolute; z-index: -2; inset: 0 0 0 42%; min-width: 0;
  display: flex; align-items: flex-end; justify-content: center; pointer-events: none;
}
.hero-photography::before {
  content: ''; position: absolute; inset: -2%;
  background: radial-gradient(ellipse at 63% 41%,#6d5636 0%,#273624 34%,transparent 74%);
  filter: blur(14px); opacity: .58;
}
.hero-photography img {
  z-index: 1; position: relative; flex: 0 0 auto;
  display: block; width: auto; max-width: none; height: 100%;
  object-fit: contain; object-position: center bottom; filter: saturate(.92) contrast(1.01);
  -webkit-mask-image: linear-gradient(to bottom,transparent 0%,#000 5%,#000 82%,transparent 100%);
  mask-image: linear-gradient(to bottom,transparent 0%,#000 5%,#000 82%,transparent 100%);
}
.hero-photography::after { content: none; }
.hero-shade {
  z-index: -1;
  background:
    linear-gradient(90deg,#08120b 0%,#0a170ecf 30%,#0b190f5c 54%,transparent 83%),
    linear-gradient(to top,#0a140ced 0%,transparent 22%);
}
.hero::after {
  content: ''; position: absolute; z-index: -1; inset: auto 0 0; height: 16px;
  background: linear-gradient(to bottom,transparent,#13231d5c);
  border-bottom: 1px solid #a17a3c59; pointer-events: none;
}
.hero-content {
  z-index: 1; position: relative; width: min(63%,650px);
  padding: 28px 10px 27px clamp(26px,3.7vw,60px);
}
.hero-kicker { margin: 0 0 16px; font-size: 9px; letter-spacing: .21em; }
.hero h1 {
  margin: 0; font: 400 clamp(44px,4.1vw,64px)/1.015 Baskerville,Georgia,'Times New Roman',serif;
  letter-spacing: -.047em; text-wrap: nowrap; text-shadow: 0 3px 24px #06110866;
}
.hero-subtitle { max-width: 350px; margin: 18px 0 20px; font-size: clamp(13px,1.16vw,17px); line-height: 1.48; }
.hero-actions { gap: 9px; }
.hero .button { min-height: 41px; padding: 9px 14px; gap: 12px; font-size: 11px; }
.hero-disclosure { display: block; margin-top: 18px; font-size: 9px; color: #e0dfd4; }
.hero-notes { display: none; }
.editorial-column {
  display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: minmax(0,54fr) minmax(0,46fr);
  min-width: 0; min-height: 0; height: 100%; align-self: stretch; gap: 2px; background: #d2c3a4;
}
.hero-companion {
  display: grid; grid-template-rows: 30% minmax(0,1fr); height: 100%; min-height: 0;
  min-width: 0; overflow: hidden; color: #fff5df; background: #0b100b;
}
.hero-companion > img { width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: center 44%; }
.hero-companion-copy { display: flex; flex-direction: column; justify-content: center; min-height: 0; padding: clamp(11px,1.45vw,20px) clamp(15px,1.7vw,25px); }
.hero-companion-copy .eyebrow { color: var(--gold-bright); margin: 0 0 5px; font-size: 8px; }
.hero-companion-copy h2 { margin: 0 0 4px; font: 400 clamp(23px,2vw,31px)/.99 Baskerville,Georgia,serif; text-transform: uppercase; letter-spacing: -.04em; }
.hero-companion-copy p:not(.eyebrow) { font-size: 10px; line-height: 1.35; color: #f2e9db; margin: 0 0 8px; }
.hero-companion-copy a { font-size: 10px; font-weight: 800; border-radius: 5px; background: #f2bd61; color: #231b0b; width: fit-content; padding: 8px 11px; }
.member-feature { height: 100%; min-height: 0; background: radial-gradient(circle at 95% 12%,#20523a,#0b291e 65%); }
.member-feature .feature-visual { opacity: .18; }
.member-feature .feature-copy { padding: clamp(12px,1.3vw,19px) clamp(15px,1.7vw,25px); display: flex; flex-direction: column; justify-content: center; height: 100%; min-height: 0; }
.member-feature .feature-eyebrow { margin: 0 0 8px; font-size: 8px; }
.member-feature h2 { margin: 0 0 7px; font-size: clamp(23px,1.9vw,29px); line-height: 1.04; }
.member-feature .feature-copy p:not(.feature-eyebrow) { max-width: 335px; font-size: 10px; line-height: 1.5; }
.member-feature .feature-status { width: fit-content; margin-top: 9px; padding: 7px 10px; font-size: 8px; line-height: 1.25; flex-shrink: 0; }
.content-section { padding: 33px clamp(23px,4vw,62px) 16px; }
.section-header { margin-bottom: 18px; }
.section-header h2 { font-size: clamp(27px,2.4vw,36px); }
.category-rail { grid-template-columns: repeat(7,minmax(0,1fr)); gap: clamp(9px,1.1vw,18px); }
.category-tile img { height: clamp(90px,8vw,123px); border-radius: 8px; object-fit: cover; }
.category-tile span { margin-top: 2px; font-size: 12px; }
.featured { border-top: 1px solid #ece4d9; padding-top: 33px; padding-bottom: 41px; }
.business-grid {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr));
  gap: clamp(12px,1.65vw,23px); max-width: 1370px; margin-inline: auto;
}
.business-card { border-radius: 11px; }
.card-art { height: clamp(160px,14vw,207px); }
.card-contents { padding: 14px 16px 15px; }
.disclaimer { max-width: 960px; margin-top: 21px; }
.impact-band { margin: 0; padding-block: clamp(32px,3.3vw,53px); }
@media (max-width:1150px) {
  .global-header { gap: 11px; padding-inline: 18px; }
  .hero { height: 430px; }
  .hero h1 { font-size: clamp(40px,4.4vw,53px); }
  .hero-content { width: min(66%,630px); padding-left: 28px; }
  .hero-photography { inset-inline-start: 41%; }
  .member-feature .feature-copy { padding: 15px; }
  .hero-companion-copy { padding: 11px 15px; }
  .hero-companion-copy h2 { font-size: clamp(22px,2.3vw,27px); }
}
@media (max-width:940px) {
  .global-header { padding: 10px 20px; }
  .global-search { max-width: 100%; }
  .marketplace-grid { grid-template-columns: 1fr; }
  .hero { height: 450px; }
  .hero-photography { inset-inline-start: 39%; }
  .hero h1 { font-size: clamp(43px,5.2vw,57px); }
  .hero-content { width: 62%; padding-left: 32px; }
  .editorial-column { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: 235px; height: auto; gap: 2px; }
  .hero-companion { min-height: 0; grid-template-rows: 31% minmax(0,1fr); }
  .hero-companion-copy h2 { font-size: 25px; }
  .member-feature { height: 235px; min-height: 0; }
  .category-tile img { height: 99px; }
  .business-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .card-art { height: 156px; }
}
@media (max-width:640px) {
  .global-header { padding: 10px 16px 12px; }
  .brand img { width: 129px; height: 42px; }
  .shop-main { display: flex; flex-direction: column; }
  .marketplace-grid, .primary-column { display: contents; }
  .hero { order: 1; height: 450px; min-height: 0; align-items: flex-end; width: 100%; }
  .hero-photography { inset: 0 0 0 32%; justify-content: flex-end; }
  .hero-photography img { height: 90%; }
  .hero-shade { background: linear-gradient(to top,#061008 0%,#071009eb 20%,#0915099c 49%,transparent 85%),linear-gradient(90deg,#07110764,transparent 81%); }
  .hero-content { width: 100%; padding: 24px 21px 23px; }
  .hero-kicker { font-size: 8px; margin-bottom: 9px; }
  .hero h1 { font-size: clamp(39px,9.1vw,51px); line-height: 1.04; }
  .hero-subtitle { max-width: 310px; font-size: 13px; margin: 13px 0 15px; }
  .hero .button { min-height: 41px; padding: 9px 13px; }
  .hero-disclosure { margin-top: 13px; font-size: 8px; }
  .categories { order: 2; }
  .featured { order: 3; }
  .editorial-column { order: 4; display: flex; flex-direction: column; gap: 2px; width: 100%; }
  .hero-companion { height: 340px; min-height: 0; grid-template-rows: 50% 50%; }
  .hero-companion-copy { min-height: 0; padding: 18px 24px; }
  .hero-companion-copy h2 { font-size: 27px; }
  .member-feature { height: 250px; min-height: 0; }
  .member-feature .feature-copy { padding: 24px; }
  .impact-band { order: 5; }
  .content-section { padding: 25px 16px 10px; }
  .section-header h2 { font-size: 27px; }
  .category-rail { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x proximity; }
  .category-tile { min-width: 81px; width: 81px; }
  .category-tile img { height: 81px; }
  .business-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
  .card-art { height: 129px; }
  .card-contents { padding: 11px; }
  .featured { padding-bottom: 32px; }
}
@media (max-width:365px) {
  .hero { height: 450px; }
  .hero h1 { font-size: 39px; }
  .hero-content { padding-inline: 16px; }
  .hero-kicker { font-size: 8px; }
  .member-feature { height: 260px; }
  .hero-companion { height: 350px; }
}

/* The two editorial columns must have the SAME fixed stage height.
   Percentage-height side panels previously made the grid grow from its
   content and created a giant dark rectangle below the left hero. */
@media (min-width:941px) {
  .marketplace-grid { height: clamp(415px,32vw,470px); }
  .primary-column, .editorial-column, .hero { height: 100%; min-height: 0; }
  .editorial-column { overflow: hidden; }
}
.hero-photography img {
  -webkit-mask-image: radial-gradient(ellipse 74% 74% at 51% 44%,#000 49%,transparent 88%);
  mask-image: radial-gradient(ellipse 74% 74% at 51% 44%,#000 49%,transparent 88%);
}
/* Editorial labels remain comfortably readable without forcing extra height. */
@media (min-width:941px) {
  .hero-companion-copy .eyebrow { font-size: 9px; }
  .hero-companion-copy p:not(.eyebrow) { font-size: 11px; }
  .member-feature .feature-copy p:not(.feature-eyebrow) { font-size: 11px; }
  .member-feature .feature-status { font-size: 9px; }
}

/* Desktop discovery text is readable at normal browser zoom. */
@media (min-width:641px) {
  .section-meta, .result-count { font-size: 12px; }
  .chip { font-size: 12px; }
  .business-card h3 { font-size: 16px; }
  .card-meta { font-size: 11px; }
  .card-location, .card-description { font-size: 12px; }
  .card-foot { font-size: 10px; }
}

/* Subtle, low-frequency editorial crossfade. The approved female portrait is
   always the base layer and remains visible with JS disabled or reduced motion.
   The man's portrait fades over it without layout shifts, zooms or flashes. */
.hero-photography .hero-portrait {
  position: absolute;
  inset: auto auto 0 50%;
  transform: translateX(-50%);
  display: block;
  height: 100%;
  width: auto;
  max-width: none;
  object-fit: contain;
  object-position: center bottom;
  backface-visibility: hidden;
}
.hero-photography .hero-portrait--woman {
  z-index: 1;
  opacity: 1;
  /* Owner-requested 2026-10-22 candidate: match the male portrait's warmth,
     saturation, contrast and brightness without changing the approved crop. */
  filter: saturate(1.17) contrast(1.08) brightness(1.09);
  transition: opacity 3600ms cubic-bezier(.42,0,.2,1);
}
.hero-photography .hero-portrait--man {
  z-index: 2;
  opacity: 0;
  /* Restore the approved golden warmth without changing the woman's image. */
  filter: saturate(1.17) contrast(1.08) brightness(1.09);
  transition: opacity 3600ms cubic-bezier(.42,0,.2,1);
}
.hero[data-portrait="man"] .hero-portrait--woman { opacity: 0; }
.hero[data-portrait="man"] .hero-portrait--man { opacity: 1; }
@media (max-width:640px) {
  .hero-photography .hero-portrait {
    inset: auto 0 0 auto;
    transform: none;
    height: 90%;
  }
}
@media (prefers-reduced-motion:reduce) {
  .hero-photography .hero-portrait--woman { opacity: 1 !important; transition: none !important; }
  .hero-photography .hero-portrait--man { opacity: 0 !important; transition: none !important; }
}

/* Quiet, keyboard-accessible opt-out from the automatic hero crossfade. */
.hero-rotation-control {
  position: absolute;
  z-index: 5;
  right: 15px;
  bottom: 14px;
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  border: 1px solid #ebdab17d;
  border-radius: 50%;
  color: #fff5dd;
  background: #081d14ad;
  backdrop-filter: blur(6px);
  font: 600 13px/1 sans-serif;
  cursor: pointer;
}
.hero-rotation-control[hidden] { display: none; }
.hero-rotation-control:hover { background: #173b2dd9; border-color: #f5ce79; }
.hero-rotation-control:focus-visible { outline: 3px solid #f5ce79; outline-offset: 3px; }
@media (max-width:640px) {
  .hero-rotation-control { right: 12px; bottom: 15px; width: 31px; height: 31px; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-rotation-control { display: none; }
}

/* Restore a deliberate lower safe area below the two editorial calls to
   action, including the narrower 941–1150px desktop breakpoint. */
@media (min-width:941px) {
  .member-feature .feature-copy { padding-bottom: clamp(26px,2.4vw,35px); }
}

/* Owner-selected 2026-10-20 male hero: the reference art is a landscape
   composite rather than a tall photo. On phones place its face in the right
   third and feather the crop edges, without changing the woman's composition. */
@media (max-width:640px) {
  .hero-photography .hero-portrait--man {
    right: -135px;
    height: 92%;
    -webkit-mask-image: radial-gradient(ellipse 58% 49% at 53% 50%, #000 44%, transparent 100%);
    mask-image: radial-gradient(ellipse 58% 49% at 53% 50%, #000 44%, transparent 100%);
  }
}
@media (max-width:365px) {
  .hero-photography .hero-portrait--man { right: -153px; }
}