.destination-page {
  gap: 34px;
  background: #edf2f0;
}

.destination-hero {
  --destination-hero-trees: url("data:image/svg+xml,%3Csvg width='1600' height='220' viewBox='0 0 1600 220' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 158 C88 88 175 108 255 133 C353 164 446 98 533 76 C622 54 694 121 786 134 C894 149 990 86 1092 102 C1193 118 1244 169 1346 119 C1438 73 1529 84 1600 132 L1600 220 L0 220 Z' fill='%232c5e4e' opacity='.03'/%3E%3Cpath d='M0 184 C126 145 251 156 369 172 C492 189 592 128 725 152 C851 175 949 149 1062 147 C1177 145 1269 190 1379 169 C1470 151 1534 137 1600 143 L1600 220 L0 220 Z' fill='%232c5e4e' opacity='.045'/%3E%3Cpath d='M0 202 C105 181 182 196 274 198 C389 201 462 176 570 193 C682 211 768 174 879 188 C1005 204 1097 175 1201 190 C1321 208 1443 187 1600 176 L1600 220 L0 220 Z' fill='%232c5e4e' opacity='.064'/%3E%3Cpath d='M37 198 l28 -82 l28 82 h-21 l26 22 h-73 l26 -22 h-14Z' fill='%232c5e4e' opacity='.22'/%3E%3Cpath d='M83 199 l19 -56 l19 56 h-14 l17 18 h-49 l18 -18 h-10Z' fill='%232c5e4e' opacity='.15'/%3E%3Cpath d='M119 199 l30 -88 l30 88 h-22 l28 21 h-78 l29 -21 h-17Z' fill='%232c5e4e' opacity='.20'/%3E%3Cpath d='M171 200 l19 -57 l20 57 h-14 l18 18 h-50 l18 -18 h-11Z' fill='%232c5e4e' opacity='.13'/%3E%3Cpath d='M214 201 l23 -68 l23 68 h-17 l21 18 h-59 l22 -18 h-13Z' fill='%232c5e4e' opacity='.11'/%3E%3Cpath d='M258 201 l17 -50 l17 50 h-12 l15 16 h-42 l16 -16 h-11Z' fill='%232c5e4e' opacity='.11'/%3E%3Cpath d='M1382 201 l18 -52 l18 52 h-13 l16 17 h-45 l16 -17 h-10Z' fill='%232c5e4e' opacity='.10'/%3E%3Cpath d='M1425 200 l24 -72 l25 72 h-18 l22 20 h-62 l23 -20 h-14Z' fill='%232c5e4e' opacity='.15'/%3E%3Cpath d='M1471 200 l32 -93 l32 93 h-24 l30 20 h-82 l30 -20 h-18Z' fill='%232c5e4e' opacity='.20'/%3E%3Cpath d='M1532 201 l23 -67 l23 67 h-17 l21 18 h-58 l21 -18 h-13Z' fill='%232c5e4e' opacity='.14'/%3E%3C/svg%3E");
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: end;
  min-height: 320px;
  overflow: hidden;
  margin-bottom: -10px;
  padding: clamp(24px, 3vw, 44px) clamp(18px, 5vw, 70px) clamp(58px, 6vw, 78px);
  background:
    var(--destination-hero-trees) center bottom -28px / 100% 210px no-repeat,
    radial-gradient(circle at 86% 22%, transparent 0 21px, rgba(211, 106, 58, 0.12) 22px 23px, transparent 24px),
    radial-gradient(circle at 72% 67%, transparent 0 26px, rgba(44, 94, 78, 0.13) 27px 28px, transparent 29px),
    radial-gradient(circle at 94% 74%, transparent 0 18px, rgba(53, 95, 156, 0.11) 19px 20px, transparent 21px),
    radial-gradient(circle at 84% 26%, rgba(211, 106, 58, 0.12) 0 4px, transparent 5px),
    radial-gradient(circle at 72% 64%, rgba(44, 94, 78, 0.13) 0 5px, transparent 6px),
    radial-gradient(circle at 92% 72%, rgba(53, 95, 156, 0.11) 0 4px, transparent 5px),
    linear-gradient(120deg, transparent 0 64%, rgba(44, 94, 78, 0.045) 64% 65%, transparent 65% 100%),
    linear-gradient(150deg, transparent 0 75%, rgba(211, 106, 58, 0.045) 75% 76%, transparent 76% 100%),
    linear-gradient(180deg, #fff 0%, #f8faf8 62%, #f0f6f2 100%);
  clip-path: polygon(
    0 0,
    100% 0,
    100% 94%,
    96% 97%,
    91% 95%,
    86% 99%,
    80% 96%,
    74% 100%,
    68% 97%,
    61% 99%,
    54% 96%,
    48% 98%,
    41% 96%,
    34% 100%,
    28% 97%,
    22% 99%,
    15% 96%,
    9% 98%,
    4% 96%,
    0 99%
  );
  filter: drop-shadow(0 12px 14px rgba(30, 68, 58, 0.10));
}

.destination-page .page-section {
  position: relative;
  padding-top: 12px;
}

.destination-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(44, 94, 78, 0.13) 1px, transparent 1.5px);
  background-position: right 40px top 42px;
  background-size: 30px 30px;
  opacity: 0.38;
  mask-image: linear-gradient(90deg, transparent 0%, #000 46%, #000 100%);
  pointer-events: none;
}

.destination-hero::after {
  content: "";
  position: absolute;
  right: clamp(12px, 5vw, 74px);
  top: 34px;
  width: min(420px, 42vw);
  aspect-ratio: 1.35;
  background-image: url("data:image/svg+xml,%3Csvg width='500' height='370' viewBox='0 0 500 370' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M37 286 C112 155 181 295 248 156 S376 80 456 168' stroke='%232c5e4e' stroke-width='3' stroke-linecap='round' stroke-dasharray='7 14' opacity='.28'/%3E%3Cpath d='M74 217 C130 190 155 199 202 224' stroke='%23d36a3a' stroke-width='2' stroke-linecap='round' stroke-dasharray='3 12' opacity='.16'/%3E%3Cpath d='M292 115 C343 88 390 96 426 126' stroke='%23355f9c' stroke-width='2' stroke-linecap='round' stroke-dasharray='4 12' opacity='.14'/%3E%3Ccircle cx='37' cy='286' r='8' fill='%23d36a3a' opacity='.45'/%3E%3Ccircle cx='248' cy='156' r='9' fill='%232c5e4e' opacity='.36'/%3E%3Ccircle cx='456' cy='168' r='8' fill='%23355f9c' opacity='.35'/%3E%3Cpath d='M96 102 L176 77 L146 148 L129 122 L96 102Z' fill='%23d36a3a' opacity='.14'/%3E%3Cpath d='M129 122 L176 77 L120 108' stroke='%23ffffff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' opacity='.46'/%3E%3Cpath d='M394 242 c0 -17 14 -31 31 -31 s31 14 31 31 c0 22 -31 56 -31 56 s-31 -34 -31 -56Z' fill='%232c5e4e' opacity='.13'/%3E%3Ccircle cx='425' cy='242' r='10' fill='%23ffffff' opacity='.55'/%3E%3Cpath d='M259 50 c0 -13 10 -23 23 -23 s23 10 23 23 c0 17 -23 42 -23 42 s-23 -25 -23 -42Z' fill='%23355f9c' opacity='.12'/%3E%3Ccircle cx='282' cy='50' r='7' fill='%23ffffff' opacity='.56'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

.destination-hero > div {
  --destination-route-left: clamp(470px, calc(45vw - 100px), 650px);
  --destination-route-top: -49px;
  --destination-route-width: min(250px, 26vw);
  --destination-route-plane-offset: clamp(170px, 19vw, 216px);
  position: relative;
  z-index: 1;
  max-width: 820px;
}

.destination-hero .intro {
  max-width: 760px;
  margin-bottom: 0;
  font-size: 18px;
}

.destination-hero h1 {
  font-style: italic;
}

.destination-eyebrow-mark {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin: 0 0 12px -36px;
}

.destination-eyebrow-mark .eyebrow {
  margin: 0;
}

.destination-eyebrow-burst {
  flex: 0 0 auto;
  width: 44px;
  height: 36px;
  color: var(--accent);
  transform: translateY(-4px);
}

.destination-eyebrow-burst path {
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
}

@media (min-width: 981px) {
  .destination-hero h1 {
    font-size: 70px;
  }
}

.destination-hero > div::before {
  content: "";
  position: absolute;
  left: var(--destination-route-left);
  top: var(--destination-route-top);
  width: var(--destination-route-width);
  height: 104px;
  background-image: url("data:image/svg+xml,%3Csvg width='360' height='180' viewBox='0 0 360 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 151 C66 104 101 115 119 82 C132 58 101 46 83 60 C64 75 90 116 142 113 C206 109 209 42 260 37 C297 34 318 58 342 29' stroke='%232c5e4e' stroke-width='5' stroke-linecap='round' stroke-dasharray='18 17' opacity='.15'/%3E%3Cpath d='M14 156 C41 128 65 113 90 100' stroke='%23d36a3a' stroke-width='5' stroke-linecap='round' opacity='.08'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

.destination-hero > div::after {
  content: "";
  position: absolute;
  left: calc(var(--destination-route-left) + var(--destination-route-plane-offset));
  top: calc(var(--destination-route-top) - 8px);
  width: 30px;
  height: 30px;
  background-image: url("data:image/svg+xml,%3Csvg width='46' height='46' viewBox='0 0 46 46' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 23 L41 7 L29 39 L21 27 L5 23Z' fill='%23d36a3a' opacity='.30'/%3E%3Cpath d='M21 27 L41 7 L17 22' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' opacity='.62'/%3E%3Cpath d='M21 27 L18 36 L25 31' fill='%23d36a3a' opacity='.20'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transform: rotate(-18deg);
  pointer-events: none;
}

.destination-summary {
  display: none;
  gap: 10px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.destination-summary span {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 360px) minmax(0, 1fr) minmax(220px, auto);
  align-items: end;
  gap: 16px;
  margin-bottom: 22px;
}

.search-control {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.search-control input {
  min-width: 0;
  min-height: 42px;
}

.search-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.search-input-row button {
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--ink);
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  font-weight: 800;
}

.tabs {
  display: flex;
  gap: 10px;
}

.tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  white-space: nowrap;
}

.tab::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  background: currentColor;
  opacity: 0.82;
}

.tab[data-category="all"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2h5v5H2V2Zm9 0h5v5h-5V2ZM2 11h5v5H2v-5Zm9 0h5v5h-5v-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2h5v5H2V2Zm9 0h5v5h-5V2ZM2 11h5v5H2v-5Zm9 0h5v5h-5v-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tab[data-category="do"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.5 2.8a1.8 1.8 0 1 1-3.6 0 1.8 1.8 0 0 1 3.6 0ZM7.7 5.1 5.5 8.5 3 9.7l.7 1.4 2.9-1.4 1-1.5.9 2.2-2.1 5.1 1.6.6 2-4.4 1.8 1.7v3h1.6v-3.7l-2.6-2.5-1-2.7 1.5 1.2 2.9.8.4-1.5-2.5-.7-2.5-2.1H7.7Zm7.6.8h1.2v10.6h-1.2V5.9Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.5 2.8a1.8 1.8 0 1 1-3.6 0 1.8 1.8 0 0 1 3.6 0ZM7.7 5.1 5.5 8.5 3 9.7l.7 1.4 2.9-1.4 1-1.5.9 2.2-2.1 5.1 1.6.6 2-4.4 1.8 1.7v3h1.6v-3.7l-2.6-2.5-1-2.7 1.5 1.2 2.9.8.4-1.5-2.5-.7-2.5-2.1H7.7Zm7.6.8h1.2v10.6h-1.2V5.9Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tab[data-category="feel"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 15.7 7.9 14.7C3.8 11 1.2 8.7 1.2 5.8 1.2 3.5 3 1.7 5.3 1.7c1.3 0 2.6.6 3.4 1.6.8-1 2.1-1.6 3.4-1.6 2.3 0 4.1 1.8 4.1 4.1 0 2.9-2.6 5.2-6.7 8.9L9 15.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 15.7 7.9 14.7C3.8 11 1.2 8.7 1.2 5.8 1.2 3.5 3 1.7 5.3 1.7c1.3 0 2.6.6 3.4 1.6.8-1 2.1-1.6 3.4-1.6 2.3 0 4.1 1.8 4.1 4.1 0 2.9-2.6 5.2-6.7 8.9L9 15.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tab[data-category="stay-food"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 1.5h1v6H3v-6Zm2 0h1v6H5v-6Zm2 0h1v6a2.5 2.5 0 0 1-2 2.45V16H4.5V9.95A2.5 2.5 0 0 1 2.5 7.5v-6h1v6a1 1 0 0 0 1 1H6a1 1 0 0 0 1-1v-6Zm7.2 0c1.2 1.2 1.8 2.8 1.8 4.9v3.1h-2V16h-1.5V1.5h1.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 1.5h1v6H3v-6Zm2 0h1v6H5v-6Zm2 0h1v6a2.5 2.5 0 0 1-2 2.45V16H4.5V9.95A2.5 2.5 0 0 1 2.5 7.5v-6h1v6a1 1 0 0 0 1 1H6a1 1 0 0 0 1-1v-6Zm7.2 0c1.2 1.2 1.8 2.8 1.8 4.9v3.1h-2V16h-1.5V1.5h1.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tab.active {
  border-color: var(--accent);
  background: #e3f0eb;
  color: var(--accent);
}

.sort-select {
  max-width: 220px;
}

.toolbar-filter-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.mobile-category-select,
.mobile-filter-button {
  display: none;
}

.mobile-filter-button {
  position: relative;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
}

.mobile-filter-button svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}

.mobile-filter-button span {
  position: absolute;
  top: -7px;
  right: -7px;
  display: grid;
  min-width: 20px;
  height: 20px;
  place-items: center;
  padding-inline: 5px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.filter-panel {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 22px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.filter-panel-heading,
.destination-filter-backdrop {
  display: none;
}

.filter-panel label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.interest-filter {
  display: grid;
  grid-column: span 2;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.interest-filter legend {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.interest-filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.interest-filter-choice {
  position: relative;
  display: inline-flex !important;
  min-height: 34px;
  align-items: center;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--ink) !important;
  cursor: pointer;
}

.interest-filter-choice input {
  position: absolute;
  width: 1px;
  min-height: 1px;
  opacity: 0;
  pointer-events: none;
}

.interest-filter-choice:has(input:checked) {
  border-color: var(--accent);
  background: #e3f0eb;
  color: var(--accent) !important;
}

.interest-filter-choice:has(input:focus-visible) {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

@media (min-width: 761px) {
  .interest-filter {
    order: 10;
    grid-column: 1 / -1;
    width: 100%;
  }

  .interest-filter-options {
    width: 100%;
  }
}

@media (min-width: 1200px) {
  .toolbar {
    grid-template-columns: minmax(340px, 420px) minmax(0, 1fr) minmax(220px, auto);
  }
}

.filter-panel input,
.filter-panel select {
  min-height: 42px;
}

.choice-filter {
  min-height: 42px;
  grid-template-columns: auto 1fr;
  align-items: center;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink) !important;
}

.choice-filter input {
  width: auto;
  min-height: auto;
}

.clear-filters-button {
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--accent);
  font-weight: 700;
}

.active-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: -8px 0 22px;
}

.active-filter-bar[hidden] {
  display: none;
}

.active-filter-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.active-filter-chip {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid #c8ddd5;
  border-radius: 8px;
  background: #edf7f2;
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.listing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.place-card {
  --place-card-ring: rgba(255, 255, 255, 0.14);
  --place-card-glow: rgba(19, 31, 34, 0.10);
  --place-card-hover-ring: rgba(255, 255, 255, 0.24);
  --place-card-hover-glow: rgba(19, 31, 34, 0.24);
  position: relative;
  display: grid;
  gap: 0;
  overflow: visible;
  border: 1px solid var(--place-card-ring);
  border-radius: 18px;
  background: #11191c;
  box-shadow:
    0 0 0 1px rgba(17, 25, 28, 0.04),
    0 12px 30px var(--place-card-glow);
  text-decoration: none;
  transition: box-shadow 180ms ease, border-color 180ms ease;
}

.place-card.is-featured {
  --place-card-ring: rgba(157, 118, 255, 0.24);
  --place-card-glow: rgba(142, 91, 255, 0.20);
  --place-card-hover-ring: rgba(181, 148, 255, 0.42);
  --place-card-hover-glow: rgba(150, 94, 255, 0.48);
  box-shadow:
    0 0 0 1px rgba(157, 118, 255, 0.14),
    0 0 22px rgba(142, 91, 255, 0.16),
    0 14px 38px var(--place-card-glow);
}

.place-card.is-admin-choice:not(.is-featured) {
  --place-card-ring: rgba(229, 126, 45, 0.34);
  --place-card-glow: rgba(214, 104, 32, 0.28);
  --place-card-hover-ring: rgba(255, 145, 59, 0.66);
  --place-card-hover-glow: rgba(255, 119, 36, 0.52);
  box-shadow:
    0 0 0 1px rgba(229, 126, 45, 0.20),
    0 0 24px rgba(214, 104, 32, 0.22),
    0 14px 38px var(--place-card-glow);
}

@media (hover: hover) and (pointer: fine) {
  .place-card:hover {
    z-index: 4;
    border-color: var(--place-card-hover-ring);
    box-shadow:
      0 0 0 1px var(--place-card-hover-ring),
      0 0 34px var(--place-card-hover-glow),
      0 22px 58px var(--place-card-hover-glow);
  }

  .place-card.is-admin-choice:not(.is-featured):hover {
    box-shadow:
      0 0 0 1px rgba(255, 145, 59, 0.70),
      0 0 30px rgba(255, 119, 36, 0.44),
      0 20px 58px rgba(255, 119, 36, 0.48);
  }
}

.place-card-media {
  position: relative;
  overflow: visible;
  border-radius: inherit;
  background:
    var(--place-card-bg, linear-gradient(135deg, #eef5f2 0%, #24302c 100%)) center / cover no-repeat,
    #11191c;
  isolation: isolate;
}

.place-card-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(8, 13, 14, 0) 0%, rgba(8, 13, 14, 0.12) 30%, rgba(8, 13, 14, 0.66) 58%, rgba(8, 13, 14, 0.96) 100%);
  pointer-events: none;
}

.place-card-media-link,
.place-card-title-link,
.place-card-details-link {
  color: inherit;
  text-decoration: none;
}

.place-card-media-link {
  display: block;
  overflow: hidden;
  border-radius: inherit;
}

.place-card-body {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: grid;
  gap: 5px;
  overflow: visible;
  padding: 0 18px 11px;
  color: #fff;
  border-radius: 0 0 18px 18px;
  background: linear-gradient(180deg, rgba(8, 13, 14, 0.02) 0%, rgb(8, 13, 14) 100%);
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(3.5px);
}

.place-card-body > * {
  position: relative;
  z-index: 1;
}

.place-card-title-row {
  position: relative;
  z-index: 110;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
  align-items: start;
  padding-top: 3px;
}

.place-card-title-link {
  position: relative;
  display: block;
  min-width: 0;
}

.place-card-title-link::after {
  content: attr(data-place-title);
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 2200;
  width: max-content;
  max-width: min(280px, 72vw);
  padding: 7px 9px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 8px;
  background: rgba(8, 13, 14, 0.94);
  color: #fff;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.32);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  opacity: 0;
  overflow-wrap: anywhere;
  pointer-events: none;
  text-shadow: none;
  transform: translateY(-4px);
  transition: opacity 150ms ease, transform 150ms ease;
}

.place-card-title-link:hover::after,
.place-card-title-link:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

.place-card-details-link {
  display: grid;
  gap: 7px;
  color: inherit;
}

.place-card.is-hidden {
  display: none;
}

.card-wishlist-button {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(29, 37, 40, 0.14);
  border-radius: 8px;
  background: rgba(17, 25, 28, 0.42);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  box-shadow: 0 12px 28px rgba(17, 25, 28, 0.18);
  backdrop-filter: blur(8px);
}

.card-map-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #2b75d6;
  text-decoration: none;
}

.card-map-button:hover,
.card-map-button:focus-visible {
  color: #155dbd;
}

.card-map-button svg {
  width: 21px;
  height: 21px;
  fill: currentColor;
  filter:
    drop-shadow(1.5px 0 0 #fff)
    drop-shadow(-1.5px 0 0 #fff)
    drop-shadow(0 1.5px 0 #fff)
    drop-shadow(0 -1.5px 0 #fff)
    drop-shadow(1px 1px 0 #fff)
    drop-shadow(-1px -1px 0 #fff);
}

.card-wishlist-button.is-saved {
  border-color: #d36a3a;
  background: rgba(255, 243, 223, 0.95);
  color: #d36a3a;
}

.place-card-image-frame {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: inherit;
  background:
    linear-gradient(180deg, #fbfcfb 0%, #edf4f1 100%);
}

.place-card .image-placeholder,
.place-card .image-loading {
  display: grid;
  border: 1px solid #d8e5df;
  color: #486761;
}

.place-card .image-placeholder::before,
.place-card .image-loading::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 77% 23%, rgba(213, 119, 78, 0.13) 0 19px, transparent 20px),
    radial-gradient(circle at 81% 25%, rgba(255, 255, 255, 0.64) 0 8px, transparent 9px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(217, 228, 224, 0.42) 46%, rgba(86, 108, 103, 0.32) 100%),
    url("data:image/svg+xml,%3Csvg width='420' height='280' viewBox='0 0 420 280' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-18 177 C41 139 96 146 151 163 C224 185 252 125 319 143 C365 155 390 142 438 117 L438 280 L-18 280 Z' fill='%232c5e4e' opacity='.10'/%3E%3Cpath d='M-18 212 C51 185 106 194 165 200 C231 206 272 171 340 187 C383 197 407 189 438 175 L438 280 L-18 280 Z' fill='%232c5e4e' opacity='.16'/%3E%3Cpath d='M298 64 C328 34 367 42 395 18' stroke='%232c5e4e' stroke-width='4' stroke-linecap='round' stroke-dasharray='9 12' opacity='.15'/%3E%3Cpath d='M72 77 C110 53 150 56 192 73 C228 88 263 85 293 67' stroke='%23d36a3a' stroke-width='3' stroke-linecap='round' stroke-dasharray='6 11' opacity='.12'/%3E%3Cpath d='M52 206 l21 -58 l21 58H79l19 19H48l19-19H52Z' fill='%232c5e4e' opacity='.13'/%3E%3Cpath d='M104 208 l14 -40 l14 40h-10l13 14H101l13-14H104Z' fill='%232c5e4e' opacity='.10'/%3E%3C/svg%3E") center bottom / cover no-repeat;
}

.place-photo {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  object-fit: cover;
  transition: opacity 180ms ease;
}

.place-photo.is-loaded {
  opacity: 1;
}

.place-card h2 {
  margin: 0;
  overflow: hidden;
  color: #fff;
  font-size: 20px;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.place-badges {
  position: relative;
  z-index: 120;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.place-badges .badge {
  min-height: 22px;
  padding: 0 6px;
  border: 1px solid rgba(255, 255, 255, 0.52);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 10px 24px rgba(17, 25, 28, 0.14);
  backdrop-filter: blur(8px);
  font-size: 11px;
}

.badge.featured {
  background: #eee5ff;
  color: #6937c8;
  font-size: 16px;
}

.featured-star {
  position: relative;
  width: 24px;
  min-width: 24px;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  overflow: visible;
  padding: 0;
  font-size: 33px;
  line-height: 1;
}

.featured-guide {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 2200;
  width: max-content;
  max-width: min(190px, 64vw);
  padding: 7px 9px;
  border: 1px solid rgba(105, 55, 200, 0.18);
  border-radius: 8px;
  background: #fff;
  color: #6937c8;
  box-shadow: 0 14px 30px rgba(19, 31, 34, 0.18);
  font-size: 12px;
  line-height: 1.25;
  opacity: 0;
  pointer-events: none;
  text-shadow: none;
  transform: translateY(-4px);
  transition: opacity 150ms ease, transform 150ms ease;
}

.featured-star:hover .featured-guide,
.featured-star:focus-visible .featured-guide {
  opacity: 1;
  transform: translateY(0);
}

.place-badges .badge.choice {
  background: #fff3df;
  color: #a4571f;
}

.place-badges .badge.verdict {
  background: #e7eef8;
  color: var(--accent-3);
}

.verdict-with-guide {
  position: relative;
  gap: 4px;
  overflow: visible;
  z-index: 130;
}

.verdict-guide-icon {
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgba(53, 95, 156, 0.14);
  color: var(--accent-3);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.verdict-guide {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 2200;
  display: grid;
  gap: 6px;
  width: max-content;
  min-width: 190px;
  max-width: min(260px, 72vw);
  padding: 10px 12px;
  border: 1px solid #cad8ef;
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 18px 42px rgba(19, 31, 34, 0.18);
  font-size: 12px;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  text-align: left;
  transform: translateY(-4px);
  transition: opacity 150ms ease, transform 150ms ease;
}

.verdict-guide strong {
  color: var(--accent-3);
  font-size: 12px;
}

.verdict-guide b {
  color: #d36a3a;
  letter-spacing: 0;
}

.verdict-with-guide:hover .verdict-guide,
.verdict-with-guide:focus-visible .verdict-guide {
  opacity: 1;
  transform: translateY(0);
}

.place-location {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.place-location {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 2;
  display: inline-flex;
  max-width: calc(100% - 62px);
  min-height: 26px;
  align-items: center;
  gap: 5px;
  padding: 0 8px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  background: rgba(17, 25, 28, 0.46);
  color: #fff;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 0 12px 28px rgba(17, 25, 28, 0.18);
  backdrop-filter: blur(8px);
}

.place-location::before {
  content: "";
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 1.5a5.5 5.5 0 0 0-5.5 5.5c0 4.1 5.5 9.5 5.5 9.5s5.5-5.4 5.5-9.5A5.5 5.5 0 0 0 9 1.5Zm0 7.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 1.5a5.5 5.5 0 0 0-5.5 5.5c0 4.1 5.5 9.5 5.5 9.5s5.5-5.4 5.5-9.5A5.5 5.5 0 0 0 9 1.5Zm0 7.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.place-card p,
.place-description {
  margin-bottom: 0;
  line-height: 1.5;
}

.place-description {
  display: -webkit-box;
  overflow: hidden;
  max-width: 90%;
  min-height: calc(2 * 1.42em);
  font-size: 13px;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.place-card-body .place-description,
.place-card-body .place-card-category-row,
.place-card-body .posted-by,
.place-card-body .place-meta {
  color: rgba(255, 255, 255, 0.84);
}

.place-card-category-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
  font-size: 13px;
  font-weight: 400;
}

.place-card-category,
.place-card-budget {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 400;
}

.place-card-category span,
.place-card-budget span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.place-card-budget {
  flex-shrink: 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  text-align: right;
}

.place-card-meta-icon {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.place-meta {
  display: flex;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  font-size: 13px;
  font-weight: 400;
}

.posted-by {
  min-width: 0;
  font-weight: 400;
}

.posted-by-name {
  font-weight: 700;
}

.place-engagement-stats {
  display: grid;
  grid-template-columns: minmax(0, 80%) minmax(0, 20%);
  align-items: center;
  gap: 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 11px;
  font-weight: 400;
}

.place-action-stats {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
  align-items: center;
  justify-items: center;
  gap: 0;
  min-width: 0;
}

.place-action-stat,
.comment-stat {
  display: inline-flex;
  min-width: 0;
  white-space: nowrap;
}

.place-action-stat {
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.place-action-stat-want {
  color: #83e6ad;
}

.place-action-stat-been {
  color: #ff8d7a;
}

.comment-stat {
  justify-content: center;
  align-items: center;
  gap: 5px;
  color: rgba(255, 255, 255, 0.9);
}

.place-action-stat span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.place-engagement-stats .engagement-separator {
  color: rgba(255, 255, 255, 0.28);
  font-weight: 400;
}

.place-engagement-stats b {
  color: currentColor;
  font-weight: 400;
}

.place-engagement-stats svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.place-engagement-stats .engagement-icon-heart {
  fill: #ff5f57;
  stroke: #ff5f57;
}

.empty-state {
  grid-column: 1 / -1;
  padding: 24px;
  border: 1px dashed #9fb0b0;
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-weight: 700;
  text-align: center;
}

.empty-state-rich {
  display: grid;
  justify-items: center;
  gap: 12px;
  text-align: center;
}

.empty-state-rich strong {
  color: var(--ink);
  font-size: 18px;
}

.empty-state-rich p {
  max-width: 560px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.empty-state-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
}

.secondary-link {
  border-color: var(--line);
  background: #fff;
  color: var(--accent);
}

@media (max-width: 1350.98px) {
  .listing-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .filter-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1199.98px) {
  .search-control input {
    font-size: 16px;
  }

  .toolbar {
    grid-template-columns: 1fr;
  }

  .tabs {
    display: none;
  }

  .toolbar-filter-row {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr) 44px;
    align-items: center;
    justify-content: stretch;
  }

  .mobile-category-select {
    order: 1;
  }

  .sort-select {
    order: 2;
  }

  .mobile-filter-button {
    order: 3;
  }

  .mobile-category-select,
  .mobile-filter-button {
    display: grid;
  }

  .mobile-category-select,
  .sort-select {
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 44px;
    padding-inline: 9px;
    font-size: 13px;
  }

  .filter-panel {
    position: fixed;
    top: max(126px, env(safe-area-inset-top));
    right: 12px;
    bottom: 12px;
    left: 12px;
    z-index: 31;
    display: none;
    grid-template-columns: 1fr;
    align-content: start;
    margin: 0;
    padding: 16px;
    overflow-y: auto;
    border-radius: 14px;
    box-shadow: 0 26px 70px rgba(12, 24, 28, 0.3);
  }

  .filter-panel.is-open {
    display: grid;
  }

  .filter-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
  }

  .filter-panel-heading div {
    display: grid;
    gap: 3px;
  }

  .filter-panel-heading span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
  }

  .filter-panel-heading strong {
    font-size: 22px;
  }

  .filter-panel-heading button {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #fff;
    color: var(--ink);
    font-size: 24px;
  }

  .interest-filter {
    grid-column: auto;
  }

  .destination-filter-backdrop {
    position: fixed;
    inset: 0;
    z-index: 30;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(9, 16, 18, 0.32);
  }

  .destination-filters-open .destination-filter-backdrop {
    display: block;
  }

  .destination-filters-open {
    overflow: hidden;
  }
}

@media (max-width: 1000px) {
  .listing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .destination-hero {
    align-items: start;
  }

  .destination-eyebrow-mark {
    margin-left: 0;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  .destination-hero > div::before,
  .destination-hero > div::after {
    display: none;
  }
}

@media (max-width: 760px) {
  .destination-hero {
    grid-template-columns: 1fr;
  }

  .destination-hero::after {
    top: auto;
    right: -80px;
    bottom: 8px;
    width: 300px;
    opacity: 0.55;
  }

  .destination-hero > div::before,
  .destination-hero > div::after {
    display: none;
  }

  .toolbar {
    grid-template-columns: 1fr;
  }

  .search-input-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .listing-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .destination-page {
    gap: 14px;
  }

  .destination-hero {
    align-items: start;
    min-height: 0;
    margin-bottom: 0;
    padding: 22px 18px 44px;
    background:
      var(--destination-hero-trees) center bottom -68px / 100% 210px no-repeat,
      linear-gradient(180deg, #fff 0%, #f8faf8 62%, #f0f6f2 100%);
  }

  .destination-hero::before,
  .destination-hero::after {
    display: none;
  }

  .destination-eyebrow-burst {
    width: 36px;
    height: 30px;
  }

  .destination-page .page-section {
    padding-top: 0;
  }

  .destination-hero h1 {
    font-size: 35px;
  }

  .destination-hero .intro {
    font-size: 16px;
  }

}
