.province-product {
  --province-accent: #176789;
  --province-accent-strong: #0f506d;
  --province-soft: #edf7fa;
  --province-pale: #f7fbfc;
  --province-line: #d5e5eb;
  --province-warm: #c97779;
}
.province-product[data-animal-scope="dog"] {
  --province-accent: #176f91;
  --province-accent-strong: #105672;
  --province-soft: #eaf6fa;
  --province-pale: #f6fbfd;
}
.province-product[data-animal-scope="cat"] {
  --province-accent: #9a5056;
  --province-accent-strong: #793d42;
  --province-soft: #fbefef;
  --province-pale: #fff9f9;
  --province-line: #ead7d8;
}
.province-data-eyebrow {
  color: var(--province-accent);
  font: 700 11px/1.2 "Trebuchet MS", Arial, sans-serif;
  letter-spacing: .1em;
  margin: 0 0 7px;
  text-transform: uppercase;
}
.province-snapshot {
  background: linear-gradient(135deg, #fff 38%, var(--province-soft));
  border: 1px solid var(--province-line);
  border-radius: 18px;
  box-shadow: 0 14px 38px #1234470d;
  margin: 0 0 42px;
  overflow: hidden;
}
.province-snapshot-header {
  align-items: center;
  display: flex;
  gap: 30px;
  justify-content: space-between;
  padding: 25px 28px 21px;
}
.province-snapshot-header h2,
.province-section-heading h2 {
  color: #153f53;
  font-size: 27px;
  line-height: 1.15;
  margin: 0;
}
.province-snapshot-meta {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 7px;
}
.province-snapshot-meta span {
  background: var(--province-accent);
  border-radius: 999px;
  color: #fff;
  font: 700 11px/1.2 "Trebuchet MS", Arial, sans-serif;
  letter-spacing: .04em;
  padding: 7px 11px;
  text-transform: uppercase;
}
.province-snapshot-meta time { color: #60727b; font-size: 11px; }
.province-stat-grid {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.province-product-regional .province-stat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.province-product-comparison .province-stat-grid,
.province-product-single .province-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.province-stat {
  align-items: center;
  background: #fff;
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr);
  min-height: 92px;
  padding: 15px 17px;
}
.province-stat .icon { color: var(--province-accent); grid-row: 1 / 3; height: 21px; width: 21px; }
.province-stat strong { color: #173c4d; font: 700 25px/1 "Trebuchet MS", Arial, sans-serif; }
.province-stat span { color: #61727b; font-size: 11px; line-height: 1.35; margin-top: 5px; }
.province-single-note {
  align-items: flex-start;
  background: #fff9eb;
  border-top: 1px solid #f0e2bd;
  color: #634f25;
  display: flex;
  font-size: 13px;
  gap: 9px;
  line-height: 1.55;
  margin: 0;
  padding: 14px 22px;
}
.province-single-note .icon { flex: 0 0 18px; height: 18px; margin-top: 1px; width: 18px; }
.province-section-heading { margin: 0 0 23px; max-width: 900px; }
.province-section-heading > p:last-child { color: #5d707a; font-size: 13px; line-height: 1.65; margin: 10px 0 0; }
.province-insights,
.province-comparison {
  border-top: 1px solid #dce6ea;
  margin: 58px 0 52px;
  padding-top: 40px;
}
.province-insight-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.province-product-regional .province-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.province-product-comparison .province-insight-grid,
.province-product-single .province-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.province-data-panel {
  background: #fff;
  border: 1px solid var(--province-line);
  border-radius: 14px;
  box-shadow: 0 8px 24px #12344709;
  min-width: 0;
  padding: 22px;
}
.province-data-panel > header { align-items: flex-start; display: flex; gap: 11px; margin-bottom: 20px; }
.province-data-panel > header > .icon {
  background: var(--province-soft);
  border-radius: 9px;
  color: var(--province-accent);
  flex: 0 0 34px;
  height: 20px;
  padding: 7px;
  width: 20px;
}
.province-data-panel h3 { color: #153f53; font-size: 19px; line-height: 1.2; margin: 2px 0 5px; }
.province-data-panel header p,
.province-empty-copy { color: #64757d; font-size: 11px; line-height: 1.5; margin: 0; }
.province-localities ol,
.province-services ol,
.province-coverage ul,
.province-animal-mix ul,
.province-travel ul { list-style: none; margin: 0; padding: 0; }
.province-localities li,
.province-services .province-service-row {
  align-items: center;
  color: #314f5d;
  display: grid;
  font-size: 12px;
  gap: 10px;
  grid-template-columns: minmax(90px, 1.25fr) minmax(70px, 1fr) 28px;
  min-height: 33px;
}
.province-services a.province-service-row:hover span { color: var(--province-accent); text-decoration: underline; }
.province-localities li strong,
.province-services li strong { color: #173c4d; text-align: right; }
.province-bar,
.province-coverage-track { background: #e8eef1; border-radius: 999px; height: 7px; overflow: hidden; }
.province-bar i,
.province-coverage-track i { background: var(--province-accent); border-radius: inherit; display: block; height: 100%; width: var(--province-value); }
.province-services .province-bar i { background: var(--province-warm); }
.province-coverage li {
  display: grid;
  font-size: 12px;
  gap: 4px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-bottom: 11px;
}
.province-coverage li strong { color: #173c4d; }
.province-coverage-track { grid-column: 1 / -1; }
.province-animal-mix ul { display: grid; gap: 9px; }
.province-animal-mix li {
  align-items: center;
  background: var(--province-pale);
  border-radius: 9px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto 43px;
  padding: 11px 12px;
}
.province-animal-mix li span { color: #365461; font-size: 12px; }
.province-animal-mix li strong { color: #153f53; font-size: 17px; }
.province-animal-mix li small { color: var(--province-accent); text-align: right; }
.province-travel li { align-items: center; display: flex; gap: 12px; padding: 9px 0; }
.province-travel li + li { border-top: 1px solid #e8eef0; }
.province-travel li > .icon { color: var(--province-accent); flex: 0 0 22px; height: 22px; width: 22px; }
.province-travel li span { display: grid; gap: 3px; }
.province-travel li strong { color: #274957; font-size: 12px; }
.province-travel li small { color: #66777e; font-size: 10px; }
.province-market-rating > p { align-items: center; display: flex; gap: 12px; margin: 0 0 7px; }
.province-market-rating > p strong { color: #173c4d; font-size: 32px; }
.province-market-rating > p span { color: #c38914; letter-spacing: 2px; }
.province-market-rating > small { color: #61727b; }
.province-methodology {
  align-items: flex-start;
  background: #f6f9fa;
  border-radius: 10px;
  color: #61727b;
  display: flex;
  font-size: 11px;
  gap: 8px;
  line-height: 1.55;
  margin: 18px 0 0;
  padding: 12px 14px;
}
.province-methodology .icon { flex: 0 0 16px; height: 16px; margin-top: 1px; width: 16px; }
.province-comparison-scroll {
  border: 1px solid var(--province-line);
  border-radius: 13px;
  overflow-x: auto;
  scrollbar-color: var(--province-accent) #edf2f4;
}
.province-comparison table { border-collapse: collapse; min-width: 680px; width: 100%; }
.province-comparison th,
.province-comparison td { border-bottom: 1px solid #e4ebee; color: #435d69; font-size: 12px; padding: 13px 12px; text-align: left; vertical-align: middle; }
.province-comparison thead th { background: var(--province-soft); color: #234958; font-size: 11px; text-transform: uppercase; }
.province-comparison tbody tr:last-child > * { border-bottom: 0; }
.province-comparison tbody tr:hover { background: var(--province-pale); }
.province-comparison tbody th { min-width: 180px; }
.province-comparison tbody th a { color: var(--province-accent-strong); font-size: 13px; }
.province-comparison tbody th small { color: #728188; display: block; font-weight: 400; margin-top: 4px; }
.comparison-animal-icons { display: flex; gap: 5px; }
.comparison-animal-icons .icon { color: var(--province-accent); height: 20px; width: 20px; }
.comparison-yes { color: #23715e; font-weight: 700; }
.province-single-profile {
  align-items: center;
  background: linear-gradient(135deg, #fff, var(--province-pale));
  border: 1px solid var(--province-line);
  border-radius: 15px;
  display: grid;
  gap: 20px 30px;
  grid-template-columns: minmax(180px, 1.2fr) minmax(320px, 2fr) auto;
  padding: 24px;
}
.province-single-profile h3 { color: #153f53; font-size: 22px; margin: 0 0 9px; }
.province-single-profile > div p { align-items: center; color: #64757d; display: flex; font-size: 12px; gap: 6px; margin: 0; }
.province-single-profile > div .icon { height: 15px; width: 15px; }
.province-single-profile ul { display: grid; gap: 8px 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.province-single-profile li { align-items: center; display: grid; font-size: 11px; gap: 7px; grid-template-columns: 18px minmax(0, 1fr) auto; }
.province-single-profile li .icon { color: var(--province-accent); height: 16px; width: 16px; }
.province-single-profile li strong { color: #244a59; }
.province-single-services { color: #5a6f79; font-size: 11px; line-height: 1.55; margin: 11px 0 0; }
.province-single-services strong { color: #294d5c; }
.province-single-profile .button { white-space: nowrap; }

@media (max-width: 1050px) {
  .province-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .province-product-regional .province-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .province-product-comparison .province-stat-grid,
  .province-product-single .province-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .province-insight-grid,
  .province-product-flagship .province-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .province-single-profile { grid-template-columns: minmax(180px, .9fr) minmax(300px, 1.6fr); }
  .province-single-profile .button { justify-self: start; }
}
@media (max-width: 700px) {
  .province-snapshot { border-radius: 13px; margin-bottom: 30px; }
  .province-snapshot-header { align-items: flex-start; flex-direction: column; gap: 14px; padding: 20px; }
  .province-snapshot-header h2,
  .province-section-heading h2 { font-size: 23px; }
  .province-snapshot-meta { align-items: flex-start; }
  .province-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .province-product-comparison .province-stat-grid,
  .province-product-single .province-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .province-product-comparison .province-stat:last-child:nth-child(odd),
  .province-product-single .province-stat:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .province-stat { min-height: 82px; padding: 13px; }
  .province-stat strong { font-size: 22px; }
  .province-insights,
  .province-comparison { margin: 42px 0 38px; padding-top: 30px; }
  .province-insight-grid,
  .province-product-flagship .province-insight-grid,
  .province-product-regional .province-insight-grid,
  .province-product-comparison .province-insight-grid,
  .province-product-single .province-insight-grid { grid-template-columns: minmax(0, 1fr); }
  .province-data-panel { padding: 18px; }
  .province-single-profile { grid-template-columns: minmax(0, 1fr); padding: 19px; }
  .province-single-profile ul { grid-template-columns: minmax(0, 1fr); }
  .province-single-profile .button { justify-self: stretch; }
  .province-comparison-scroll { border: 0; overflow: visible; }
  .province-comparison table,
  .province-comparison tbody { display: block; min-width: 0; width: 100%; }
  .province-comparison thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .province-comparison tbody { display: grid; gap: 14px; }
  .province-comparison tbody tr { background: #fff; border: 1px solid var(--province-line); border-radius: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; padding: 14px; }
  .province-comparison tbody th { border-bottom: 1px solid #e4ebee; display: block; grid-column: 1 / -1; min-width: 0; padding: 0 0 12px; }
  .province-comparison tbody td { align-items: center; border: 0; display: flex; justify-content: space-between; gap: 8px; min-width: 0; padding: 9px 7px; }
  .province-comparison tbody td::before { color: #63767f; content: attr(data-label); font-size: 10px; font-weight: 700; text-transform: uppercase; }
}
@media (max-width: 430px) {
  .province-comparison tbody tr { grid-template-columns: minmax(0, 1fr); }
  .province-comparison tbody th { grid-column: 1; }
}