.tuffins-intro { background: var(--ink); color: white; padding: 30px 0 62px; }
.tuffins-breadcrumb { display: flex; gap: 14px; color: #bcb3c6; font-size: .875rem; margin-bottom: 38px; }
.tuffins-breadcrumb a:hover { color: white; }
.tuffins-title-row { display: flex; justify-content: space-between; align-items: end; gap: 40px; }
.tuffins-title-row .eyebrow { color: #d0b1ff; font-size: .75rem; }
.tuffins-title-row h1 { font-size: clamp(2.5rem, 4.5vw, 4.5rem); margin-top: 20px; }
.tuffins-title-row > p { color: #ccc3d5; font-size: 1rem; padding-bottom: 6px; flex-shrink: 0; }
.store-map-section { padding-block: 54px 46px; }
.map-heading-row { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 25px; }
.map-heading-row .eyebrow { color: #7030cd; }
.map-heading-row h2 { font-size: clamp(1.6rem, 2.5vw, 2.2rem); margin-top: 12px; }
.map-legend { white-space: nowrap; color: var(--muted); font-size: .875rem; }
.map-legend > span { color: var(--purple); margin-right: 5px; }
.map-shell { border: 1px solid #d3cbdc; background: #1d2e50; }
.map-toolbar { display: flex; justify-content: space-between; gap: 14px; align-items: center; padding: 12px 18px; background: white; font-size: .875rem; }
.map-toolbar > div { display: flex; align-items: center; gap: 6px; }
.map-toolbar button { min-width: 40px; min-height: 40px; border: 1px solid var(--line); background: var(--paper); cursor: pointer; font-size: 1.3rem; color: var(--ink); }
.map-toolbar button:last-child { font-size: .875rem; padding-inline: 12px; margin-left: 4px; }
.map-toolbar button:hover:not(:disabled) { background: #eee2ff; border-color: var(--purple); }
.map-toolbar button:disabled { opacity: .35; cursor: default; }
.map-toolbar output { font-size: .8125rem; width: 48px; text-align: center; font-variant-numeric: tabular-nums; }
.map-viewport { width: 100%; aspect-ratio: 968 / 757; overflow: auto; position: relative; overscroll-behavior: contain; }
.map-viewport:focus-visible { outline: 3px solid var(--purple-light); outline-offset: -3px; }
.map-canvas { width: 100%; position: relative; aspect-ratio: 968 / 757; }
.js .map-viewport { touch-action: none; cursor: grab; user-select: none; }
.map-viewport.is-dragging, .map-viewport.is-dragging .store-pin { cursor: grabbing; }
.map-canvas > img { width: 100%; height: auto; user-select: none; }
.map-pins { position: absolute; inset: 0; }
.store-pin { position: absolute; padding: 0; width: 24px; height: 30px; border: 0; background: transparent; cursor: pointer; transform: translate(-50%, -100%); filter: drop-shadow(0 2px 2px #0009); }
.store-pin svg { width: 100%; height: 100%; display: block; fill: #852bff; stroke: #fff; stroke-width: 1.6; transition: transform .18s ease; }
.store-pin svg circle { fill: white; stroke: none; }
.store-pin:hover, .store-pin:focus-visible, .store-pin[aria-pressed="true"] { z-index: 2; }
.store-pin:hover svg, .store-pin:focus-visible svg, .store-pin[aria-pressed="true"] svg { transform: scale(1.3); fill: #17101f; }
.store-pin:focus-visible { outline: 2px solid white; outline-offset: 4px; border-radius: 4px; }
.map-selection { display: flex; align-items: center; gap: 16px; padding: 20px 22px; background: white; border-top: 3px solid var(--purple); }
.moustache-icon.selection-icon { width: 1.8rem; height: 1.8rem; margin: 0; flex-shrink: 0; }
.map-selection strong { font-family: var(--display); font-size: 1rem; }
.map-selection p { color: var(--muted); font-size: .875rem; margin-top: 3px; }
.map-sample { margin-left: auto; white-space: nowrap; color: var(--muted); font-size: .75rem; }
.map-instructions { margin-top: 16px; color: var(--muted); font-size: .8125rem; }
.tuffins-count-section { background: var(--purple); color: white; text-align: center; padding: 65px 0; }
.count-inner > .eyebrow { color: #f0e4ff; }
.count-inner > h2 { font-size: clamp(1.8rem, 3.4vw, 3rem); margin-top: 18px; }
.count-quote-credit { margin-top: 16px; color: #f1e7ff; font-size: 1rem; }
.store-counter { display: flex; justify-content: center; font-family: var(--display); font-weight: 600; font-size: clamp(3.5rem, 11vw, 10rem); line-height: 1.12; letter-spacing: -.045em; margin: 32px auto 12px; font-variant-numeric: tabular-nums; }
.counter-digit { display: inline-block; height: 1.12em; width: .66em; overflow: hidden; border-bottom: 2px solid #ffffff40; background: #ffffff0b; margin: 0 .02em; }
.counter-reel { display: flex; flex-direction: column; transform: translateY(0); transition: transform 1.5s cubic-bezier(.18,.68,.25,1); }
.counter-reel > span { display: block; height: 1.12em; flex-shrink: 0; }
.counter-separator { width: .28em; }
.count-unit { font-size: .8125rem; letter-spacing: .14em; }
.tuffins-count-logo { margin: 30px auto 0; color: #f4e7b9; font-family: 'Trebuchet MS', Arial, sans-serif; font-size: clamp(3.5rem, 7vw, 5rem); font-style: italic; font-weight: 700; letter-spacing: -.065em; line-height: 1.1; }
.count-growth { display: inline-flex; align-items: center; gap: 14px; margin-top: 32px; }
.count-growth > span { border: 1px solid #ffffff80; padding: 4px 13px; font-family: var(--display); font-size: 1.4rem; }
.count-growth p { font-size: 1rem; }
.count-baseline { color: #f1e7ff; font-size: .8125rem; margin-top: 24px; }
@media(max-width:1100px) { .tuffins-title-row { display: block; } .tuffins-title-row > p { margin-top: 26px; } .site-header nav { gap: 16px; } }
@media(max-width:600px) {
  .tuffins-intro { padding-bottom: 40px; }
  .tuffins-title-row h1 { font-size: clamp(2.2rem, 8.8vw, 3.2rem); }
  .tuffins-title-row .eyebrow { max-width: 30ch; }
  .map-heading-row { display: block; }
  .map-legend { display: inline-block; margin-top: 16px; }
  .map-toolbar { padding: 10px; flex-wrap: wrap; }
  .map-viewport { aspect-ratio: 1; }
  .map-canvas { min-width: 540px; }
  .store-pin { width: 20px; height: 25px; }
  .map-selection { padding: 16px; gap: 10px; flex-wrap: wrap; }
  .map-selection > div { flex: 1; }
  .map-sample { width: 100%; margin-left: 39px; }
  .tuffins-count-section { padding-block: 48px; }
  .count-growth { gap: 10px; }
  .count-growth p { font-size: .875rem; }
}
@media(prefers-reduced-motion:reduce) { .counter-reel { transition: none; } }