:root {
  color-scheme: light;
  --ink: #193b32;
  --forest: #163f33;
  --forest-dark: #103229;
  --green: #477b62;
  --mint: #d8e7db;
  --sun: #efb967;
  --paper: #f7f6f0;
  --line: #dfe4da;
  --muted: #667b70;
  font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  background: var(--paper);
  color: var(--ink);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; }
button, input, select { font: inherit; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #e9a947; outline-offset: 3px; }
.container { width: min(1200px, calc(100% - 56px)); margin-inline: auto; }
.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: fixed; z-index: 100; top: -60px; left: 20px; padding: 10px 16px; background: var(--sun); color: var(--forest-dark); }
.skip-link:focus { top: 10px; }
.eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 800; letter-spacing: .13em; }
.eyebrow-light { color: #f7ddaa; }
.eyebrow-green { color: var(--green); }
.eyebrow-line { width: 24px; height: 1px; background: currentColor; }
.button { min-height: 47px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 13px 20px; border-radius: 7px; font-size: 14px; font-weight: 800; text-decoration: none; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-sun { background: var(--sun); color: var(--forest-dark); }
.button-sun:hover { background: #f6c983; }
.button-dark { background: var(--forest-dark); color: white; }
.button-dark:hover { background: #24624a; }

/* Global navigation */
.site-header { position: relative; z-index: 10; background: #fff; border-bottom: 1px solid var(--line); }
.header-inner { min-height: 78px; display: flex; align-items: center; gap: 30px; }
.brand { display: inline-flex; align-items: center; gap: 9px; flex: none; font-size: 23px; font-weight: 900; letter-spacing: -.08em; text-decoration: none; }
.brand-mark { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: var(--sun); color: var(--forest-dark); font-size: 21px; line-height: 1; }
.brand-number { color: #c27737; }
.main-nav { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.main-nav a { color: #52695e; font-size: 14px; font-weight: 700; text-decoration: none; }
.main-nav a:hover, .footer-links a:hover { color: #bb713e; }
.header-link { display: inline-flex; gap: 22px; align-items: center; padding: 11px 15px; border: 1px solid #cbd7cb; border-radius: 6px; font-size: 13px; font-weight: 800; text-decoration: none; }
.header-link:hover { border-color: var(--green); background: #f2f7ef; }

/* Home hero */
.home-hero { display: grid; grid-template-columns: 54% 46%; min-height: 565px; margin-top: 28px; overflow: hidden; border-radius: 10px; background: var(--forest-dark); color: white; }
.hero-copy { align-self: center; padding: 70px 30px 60px 7.5%; position: relative; z-index: 2; }
.hero-copy h1 { margin: 24px 0 22px; font-size: clamp(47px, 5.5vw, 78px); letter-spacing: -.075em; line-height: 1.2; font-weight: 850; }
.hero-copy h1 em { color: var(--sun); font-style: normal; }
.hero-copy > p { max-width: 490px; margin: 0; color: #d1e3d6; font-size: 16px; line-height: 1.9; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 38px; }
.text-link { display: inline-flex; align-items: center; gap: 10px; color: #f8f9ee; font-size: 14px; font-weight: 750; text-decoration: none; }
.text-link:hover { color: var(--sun); }
.hero-meta { display: flex; align-items: center; gap: 11px; margin-top: 55px; color: #d3dfd4; font-size: 13px; }
.hero-meta strong { color: #fff; font-size: 35px; line-height: 1; }
.hero-meta i { width: 1px; height: 16px; margin: 0 8px; background: #638475; }
.hero-art { position: relative; min-height: 565px; overflow: hidden; background: radial-gradient(circle at 52% 48%, #3d765e 0, #2d604d 42%, #245342 76%, #1e4b3d 100%); }
.hero-art::before { content: ""; position: absolute; inset: 22px; border: 1px solid #ffffff20; }
.hero-art::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(#ffffff0b 1px, transparent 1px), linear-gradient(90deg, #ffffff0b 1px, transparent 1px); background-size: 56px 56px; }
.art-circle { position: absolute; left: 50%; top: 51%; z-index: 1; border: 1px solid #b5d4bd55; border-radius: 50%; transform: translate(-50%, -50%); }
.art-circle-outer { width: 470px; height: 470px; }
.art-circle-inner { width: 330px; height: 330px; }
.art-arc { position: absolute; z-index: 2; width: 370px; height: 370px; border: 2px solid transparent; border-top-color: var(--sun); border-right-color: var(--sun); border-radius: 50%; left: 50%; top: 51%; transform: translate(-50%, -50%) rotate(-25deg); }
.art-title { position: absolute; z-index: 3; left: 50%; top: 47%; transform: translate(-50%, -50%); font-size: clamp(29px, 3vw, 46px); font-weight: 850; letter-spacing: .08em; text-align: center; line-height: .97; color: #f5f2dc; }
.art-title b { display: block; margin-top: 15px; font-size: clamp(110px, 14vw, 185px); letter-spacing: -.1em; color: var(--sun); }
.art-coord { position: absolute; z-index: 3; color: #c2daca; font-size: 10px; font-weight: 750; letter-spacing: .17em; }
.art-coord-top { top: 57px; left: 48px; }
.art-coord-bottom { right: 38px; bottom: 44px; }
.art-destination { position: absolute; z-index: 4; display: flex; flex-direction: column; gap: 3px; padding: 9px 13px; border: 1px solid #ffffff88; border-radius: 3px; background: #ebf3e6; color: var(--forest-dark); font-weight: 850; font-size: 14px; box-shadow: 0 7px 24px #0c2a2540; }
.art-destination small { font-size: 8px; letter-spacing: .14em; color: #637b69; }
.art-destination-one { top: 120px; right: 47px; transform: rotate(5deg); }
.art-destination-two { left: 46px; top: 300px; transform: rotate(-7deg); }
.art-destination-three { bottom: 96px; right: 68px; transform: rotate(-5deg); }
.quick-start { display: flex; align-items: center; flex-wrap: wrap; gap: 0; margin-top: 26px; margin-bottom: 94px; padding: 16px 24px; background: white; border: 1px solid var(--line); border-radius: 8px; }
.quick-start > span { margin-right: 24px; color: var(--muted); font-size: 12px; font-weight: 800; }
.quick-start a { display: inline-flex; align-items: center; gap: 16px; padding: 9px 22px; border-left: 1px solid var(--line); font-size: 14px; font-weight: 800; text-decoration: none; }
.quick-start a:hover { color: #b7723a; }
.quick-start a span { color: #8da99a; }

/* Map */
.map-section { padding: 100px 0 74px; background: #edf0e8; scroll-margin-top: 25px; }
.section-intro { display: flex; justify-content: space-between; align-items: end; gap: 34px; margin-bottom: 34px; }
.section-intro h2, .areas-heading h2 { margin: 13px 0 0; font-size: clamp(30px, 3.2vw, 45px); letter-spacing: -.055em; line-height: 1.26; }
.section-intro > p, .areas-heading > p { max-width: 320px; margin: 0 0 6px; color: var(--muted); font-size: 14px; line-height: 1.9; }
.map-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(265px, .85fr); gap: 18px; align-items: stretch; }
.map-stage { min-width: 0; position: relative; border: 1px solid #dce5da; border-radius: 10px; overflow: hidden; background: #fbfcf7; }
.map-toolbar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 17px 22px; border-bottom: 1px solid #e2e9df; color: #526f5d; font-size: 12px; font-weight: 800; letter-spacing: .04em; }
.live-dot { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #e5ae62; }
.zoom-controls { display: flex; gap: 5px; }
.zoom-controls button { width: 30px; height: 30px; border: 1px solid #d5e2d4; border-radius: 4px; background: white; color: var(--forest); cursor: pointer; font-size: 19px; line-height: 1; }
.zoom-controls button:hover { background: #e8f0e4; }
.map-scroll { height: 760px; overflow: auto; padding: 7px 0; background-image: linear-gradient(#e2e9de6b 1px, transparent 1px), linear-gradient(90deg, #e2e9de6b 1px, transparent 1px); background-size: 58px 58px; }
.map-scroll .thailand-map { display: block; width: 460px; min-width: 460px; height: auto; margin: auto; }
.map-province path { fill: #9ebba8; stroke: #f9fbf5; stroke-width: 1.2; vector-effect: non-scaling-stroke; transition: fill .16s, filter .16s; }
.map-province.region-north path { fill: #86af97; }
.map-province.region-central path { fill: #b3c9a7; }
.map-province.region-northeast path { fill: #6fa68f; }
.map-province.region-east path { fill: #73b2aa; }
.map-province.region-west path { fill: #a9bb85; }
.map-province.region-south path { fill: #9cc7bb; }
.map-province:hover path, .map-province:focus-visible path, .map-province.is-selected path { fill: var(--sun); stroke: #fff2d6; stroke-width: 2.4; filter: drop-shadow(0 1px 4px #4b422855); }
.map-province:focus-visible { outline: none; }
.map-province-disabled { pointer-events: none; opacity: .35; }
.map-stage-hint { display: flex; justify-content: space-between; gap: 10px; padding: 16px 22px; border-top: 1px solid #e2e9df; color: var(--muted); font-size: 12px; }
.map-side { display: flex; flex-direction: column; gap: 18px; }
.map-selection { position: relative; display: flex; flex-direction: column; align-items: start; min-height: 392px; padding: 34px; border-radius: 10px; background: var(--forest); color: white; }
.map-selection-label { padding-right: 38px; color: #b4d5bd; font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.map-selection-icon { position: absolute; top: 32px; right: 32px; display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #96bba5; border-radius: 50%; font-size: 15px; }
.map-selection h3 { margin: auto 0 0; font-size: clamp(38px, 4vw, 56px); line-height: 1.1; letter-spacing: -.06em; }
.map-selection [data-selected-english] { margin: 9px 0 0; color: var(--sun); font-size: 17px; }
.map-selection-copy { margin: 22px 0 25px; color: #cadfd1; font-size: 13px; line-height: 1.8; }
.map-selection .button { width: 100%; background: #f2f4e8; color: var(--forest-dark); }
.map-side-note { flex: 1; display: flex; flex-direction: column; align-items: start; padding: 34px; border: 1px solid #d4ddd1; border-radius: 10px; background: #e2e9dc; }
.note-index { color: #73917a; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.map-side-note strong { display: block; max-width: 250px; margin-top: auto; font-size: 26px; letter-spacing: -.04em; line-height: 1.4; }
.map-side-note p { margin: 17px 0 0; color: #60766a; font-size: 13px; line-height: 1.8; }
.map-attribution { margin: 14px 0 0; color: #768b7d; font-size: 11px; }

/* Directory */
.directory-section { padding-top: 100px; padding-bottom: 130px; scroll-margin-top: 25px; }
.directory-intro { margin-bottom: 32px; }
.directory-search { display: flex; align-items: center; gap: 14px; min-height: 66px; padding: 6px 7px 6px 22px; border: 1px solid #d7dfd4; border-radius: 7px; background: white; }
.directory-search:focus-within { border-color: #83a88c; box-shadow: 0 0 0 3px #b5d8bb66; }
.search-icon { color: #759585; font-size: 28px; line-height: 1; }
.directory-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 15px; }
.directory-search input::placeholder { color: #9aab9e; }
.directory-search button { align-self: stretch; display: inline-flex; align-items: center; gap: 24px; border: 0; border-radius: 5px; padding: 0 22px; background: var(--forest); color: white; font-weight: 800; cursor: pointer; }
.directory-search button:hover { background: #28624a; }
.region-filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 21px 0 44px; }
.region-filters a { display: inline-flex; align-items: center; gap: 12px; padding: 10px 15px; border: 1px solid #d6e0d4; border-radius: 5px; background: white; color: #556d5e; font-size: 13px; font-weight: 750; text-decoration: none; }
.region-filters a span { color: #8fa397; font-size: 11px; }
.region-filters a:hover, .region-filters a.is-active { border-color: var(--forest); background: var(--forest); color: white; }
.region-filters a:hover span, .region-filters a.is-active span { color: #c6ddc5; }
.result-note { margin: -18px 0 32px; color: var(--muted); font-size: 13px; }
.region-group { margin-top: 44px; }
.region-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 17px; }
.region-heading > div { display: flex; align-items: center; gap: 12px; }
.region-line { width: 4px; height: 23px; background: var(--sun); }
.region-heading h3 { margin: 0; font-size: 22px; letter-spacing: -.035em; }
.region-heading > span { color: var(--muted); font-size: 12px; }
.province-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.province-card { position: relative; display: flex; flex-direction: column; min-height: 132px; padding: 18px 20px; border: 1px solid #dfe6da; border-radius: 7px; background: white; text-decoration: none; transition: background .2s, border-color .2s, transform .2s; }
.province-card:hover { transform: translateY(-3px); border-color: #9ab99e; background: #f7fbf4; }
.card-index { color: #9cb09e; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.card-arrow { position: absolute; right: 19px; top: 16px; color: #528268; }
.province-card strong { margin-top: auto; font-size: 19px; letter-spacing: -.04em; }
.card-english { margin-top: 2px; color: #81968a; font-size: 11px; }
.empty-results { margin: 40px 0 100px; padding: 40px; border: 1px solid var(--line); background: white; }
.empty-results strong { font-size: 20px; }
.empty-results p { color: var(--muted); }
.empty-results a { color: var(--green); font-weight: 800; }

/* Province page */
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; padding: 26px 0; color: #73867a; font-size: 12px; }
.breadcrumbs a { text-decoration: none; }
.breadcrumbs a:hover { color: var(--forest); text-decoration: underline; }
.province-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 22px; padding: 0; border-radius: 9px; overflow: hidden; background: var(--forest-dark); color: white; }
.province-hero-copy { align-self: center; padding: 58px 35px 70px 7%; }
.province-hero h1 { margin: 32px 0 0; font-size: clamp(60px, 7vw, 104px); letter-spacing: -.07em; line-height: 1.16; }
.province-english { margin: 8px 0 0; color: var(--sun); font-size: clamp(21px, 2.4vw, 30px); letter-spacing: .01em; }
.province-intro { max-width: 520px; margin: 36px 0 0; color: #c8ddcf; font-size: 15px; line-height: 1.9; }
.province-map-card { display: flex; flex-direction: column; min-width: 0; margin: 23px 23px 23px 0; border-radius: 6px; overflow: hidden; background: #edf1e7; color: var(--ink); }
.province-map-top { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px 0; color: #6c8d77; font-size: 10px; font-weight: 850; letter-spacing: .13em; }
.map-pin { color: #c27c38; font-size: 25px; }
.province-mini-map { flex: 1; display: grid; place-items: center; min-height: 315px; padding: 8px; }
.province-mini-map svg { width: auto; height: 305px; max-width: 100%; }
.province-mini-map .map-province path { stroke: #f2f7ef; stroke-width: 1.7; }
.province-map-caption { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 18px 24px; border-top: 1px solid #d5e0d4; font-size: 11px; }
.province-map-caption span { color: #71907c; }
.province-map-caption strong { font-size: 13px; }
.province-summary { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-top: 19px; border: 1px solid #dce3d8; border-radius: 7px; background: white; }
.province-summary > div { display: flex; flex-direction: column; gap: 9px; padding: 23px 28px; }
.province-summary > div + div { border-left: 1px solid #e4e9df; }
.province-summary span { color: #80998a; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.province-summary strong { font-size: 16px; }
.province-content { padding-top: 108px; }
.province-content .section-intro { margin-bottom: 28px; }
.topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.topic-card { position: relative; display: flex; flex-direction: column; min-height: 230px; padding: 25px 27px; border: 1px solid #dce5da; border-radius: 7px; background: white; }
.topic-card-link { text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.topic-card-link:hover { transform: translateY(-3px); border-color: #9ab79d; box-shadow: 0 13px 25px #193b3210; }
.topic-number { color: #91a596; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.topic-symbol { position: absolute; right: 25px; top: 23px; color: #7b9b83; font-size: 18px; }
.topic-card h3 { margin: auto 0 5px; font-size: 24px; letter-spacing: -.05em; }
.topic-card p { margin: 0 0 20px; color: var(--muted); font-size: 13px; }
.topic-status { align-self: start; padding: 6px 9px; border-radius: 3px; background: #e9f1e6; color: #55735c; font-size: 10px; font-weight: 800; }
.areas-section { padding-top: 108px; padding-bottom: 112px; }
.areas-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 26px; }
.areas-empty { display: flex; align-items: center; gap: 25px; padding: 34px; border: 1px dashed #bfcfc0; border-radius: 7px; background: #f0f3ea; }
.areas-empty-icon { display: grid; place-items: center; flex: none; width: 58px; height: 58px; border-radius: 50%; background: #dcebdd; color: var(--green); font-size: 28px; }
.areas-empty strong { font-size: 17px; }
.areas-empty p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.area-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.area-list article { min-height: 100px; padding: 22px; border: 1px solid var(--line); background: white; }
.area-list strong { font-size: 17px; }
.area-list p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.area-list a { display: inline-block; margin-top: 17px; color: var(--green); font-size: 12px; font-weight: 800; text-decoration: none; }
.area-list a:hover { text-decoration: underline; }
.region-peers { padding: 82px 0 105px; background: #e9eee5; }
.region-peers .section-intro { margin-bottom: 27px; }
.section-link { margin-bottom: 7px; color: var(--green); font-size: 13px; font-weight: 800; text-decoration: none; }
.section-link:hover { text-decoration: underline; }
.peer-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.peer-list a { position: relative; display: flex; flex-direction: column; min-height: 84px; padding: 14px 16px; border: 1px solid #d5e0d4; border-radius: 4px; background: #fff; text-decoration: none; }
.peer-list a:hover { border-color: var(--green); }
.peer-list strong { font-size: 14px; }
.peer-list span { margin-top: auto; color: #899e8e; font-size: 10px; }
.peer-list i { position: absolute; right: 15px; top: 14px; color: #7b9b83; font-style: normal; }
.state-page { min-height: 58vh; padding-top: 90px; padding-bottom: 100px; }
.state-page h1 { margin: 18px 0 12px; font-size: clamp(32px, 5vw, 56px); }
.state-page p { margin-bottom: 28px; color: var(--muted); }

/* Place listing */
.catalog-hero { background: var(--forest-dark); color: white; }
.catalog-hero-inner { display: flex; justify-content: space-between; align-items: end; gap: 30px; min-height: 280px; padding-top: 50px; padding-bottom: 51px; }
.catalog-hero h1 { margin: 22px 0 11px; font-size: clamp(46px, 6vw, 78px); letter-spacing: -.07em; line-height: 1.15; }
.catalog-hero h1 em { color: var(--sun); font-style: normal; }
.catalog-hero p { max-width: 680px; margin: 0; color: #cde0d1; font-size: 15px; line-height: 1.8; }
.catalog-hero-aside { display: flex; flex-direction: column; gap: 8px; min-width: 180px; padding: 0 0 4px 24px; border-left: 1px solid #638272; }
.catalog-hero-aside span { color: #a8c9b2; font-size: 11px; }
.catalog-hero-aside strong { font-size: 23px; }
.catalog-hero-aside a { color: var(--sun); font-size: 12px; font-weight: 800; text-decoration: none; }
.catalog-section { padding-top: 65px; padding-bottom: 110px; }
.catalog-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; }
.catalog-heading h2 { margin: 13px 0 0; font-size: clamp(30px, 3.3vw, 43px); letter-spacing: -.06em; }
.catalog-heading p { color: var(--muted); font-size: 13px; }
.catalog-tabs { display: flex; gap: 8px; overflow-x: auto; margin-top: 31px; padding-bottom: 10px; border-bottom: 1px solid #cfdbd0; }
.catalog-tabs a { flex: none; padding: 12px 18px; border-radius: 5px; color: #5e7666; font-size: 14px; font-weight: 800; text-decoration: none; }
.catalog-tabs a:hover { background: #e8efe5; }
.catalog-tabs a.is-active { background: var(--forest); color: white; }
.catalog-tabs span { margin-left: 3px; opacity: .65; font-size: 11px; }
.catalog-filters { display: grid; grid-template-columns: minmax(190px, 1.5fr) minmax(160px, 1fr) minmax(160px, 1fr) auto; align-items: end; gap: 12px; margin-top: 22px; padding: 20px; border: 1px solid var(--line); border-radius: 7px; background: white; }
.filter-field { display: flex; flex-direction: column; min-width: 0; gap: 8px; }
.filter-field > span { color: #60806a; font-size: 11px; font-weight: 800; }
.filter-field input, .filter-field select { width: 100%; height: 47px; padding: 0 13px; border: 1px solid #cbd9cb; border-radius: 5px; background: #fff; color: var(--ink); font-size: 13px; }
.catalog-filters .button { border: 0; cursor: pointer; white-space: nowrap; }
.filter-summary { display: flex; justify-content: space-between; gap: 15px; margin: 19px 0 0; color: var(--muted); font-size: 12px; }
.filter-summary a { color: var(--green); font-weight: 800; text-decoration: none; }
.place-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; margin-top: 30px; }
.place-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #dce5d9; border-radius: 7px; background: #fff; text-decoration: none; transition: transform .2s, box-shadow .2s, border-color .2s; }
.place-card:hover { transform: translateY(-3px); border-color: #9ab79d; box-shadow: 0 16px 30px #193b3214; }
.place-card-media { position: relative; display: block; aspect-ratio: 1.56; overflow: hidden; background: #d9e7d8; }
.place-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.place-card:hover .place-card-media img { transform: scale(1.035); }
.place-media-placeholder { display: grid; place-items: center; height: 100%; color: #77a18c; font-size: 90px; }
.demo-label { position: absolute; left: 13px; top: 13px; padding: 7px 9px; border-radius: 3px; background: #fffdf1; color: #936839; font-size: 10px; font-weight: 800; }
.place-card-body { display: flex; flex: 1; flex-direction: column; padding: 21px 21px 18px; }
.place-card-meta { color: #62836b; font-size: 11px; font-weight: 800; }
.place-card-body strong { margin-top: 9px; font-size: 22px; letter-spacing: -.045em; }
.place-card-body small { margin-top: 2px; color: #8ba092; font-size: 11px; }
.place-card-summary { min-height: 49px; margin-top: 16px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.place-card-arrow { display: flex; justify-content: space-between; margin-top: auto; padding-top: 18px; border-top: 1px solid #e7eee5; color: var(--green); font-size: 12px; font-weight: 800; }
.catalog-empty { display: flex; align-items: flex-start; flex-direction: column; min-height: 290px; margin-top: 30px; padding: 39px; border: 1px dashed #b5cbb9; border-radius: 7px; background: #eef3e9; }
.catalog-empty > span { color: var(--green); font-size: 32px; }
.catalog-empty h3 { margin: 14px 0 4px; font-size: 24px; }
.catalog-empty p { margin: 0 0 24px; color: var(--muted); font-size: 13px; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 40px; font-size: 13px; }
.pagination span { color: var(--muted); }
.pagination a { padding: 10px 14px; border: 1px solid #cedccd; border-radius: 4px; text-decoration: none; }
.pagination a:hover { background: #e4eee3; }

/* Place detail */
.detail-page { padding-top: 24px; padding-bottom: 110px; }
.detail-header { display: flex; align-items: end; justify-content: space-between; gap: 25px; padding-bottom: 30px; }
.detail-header h1 { margin: 16px 0 4px; font-size: clamp(48px, 6vw, 78px); line-height: 1.15; letter-spacing: -.07em; }
.detail-english { margin: 0; color: #819789; font-size: 19px; }
.detail-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px; }
.detail-tags span { padding: 7px 11px; border-radius: 3px; background: #e6efe3; color: #487456; font-size: 11px; font-weight: 800; }
.detail-tags .detail-demo { background: #fff1db; color: #9d6c38; }
.detail-back { margin-bottom: 5px; color: var(--green); font-size: 13px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.detail-back:hover { text-decoration: underline; }
.place-gallery { margin-top: 10px; }
.gallery-stage { position: relative; height: clamp(320px, 52vw, 590px); overflow: hidden; border-radius: 7px; background: #d9e7d8; }
.gallery-stage img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gallery-stage img[src*="/shop-logo/"] { box-sizing:border-box; padding:clamp(24px,6vw,80px); object-fit:contain; background:#f7f8f5; }
.gallery-counter { position: absolute; right: 18px; bottom: 16px; padding: 7px 11px; border-radius: 3px; background: #123e34cf; color: white; font-size: 12px; font-weight: 800; }
.gallery-thumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.gallery-thumbs button { width: 115px; height: 75px; overflow: hidden; padding: 0; border: 3px solid transparent; border-radius: 5px; background: #d9e7d8; cursor: pointer; }
.gallery-thumbs button.is-active { border-color: #c17b40; }
.gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.gallery-thumbs img[src*="/shop-logo/"] { object-fit:contain; background:#f7f8f5; }
.gallery-note { margin: 10px 0 0; color: #8a735d; font-size: 11px; }
.gallery-empty { display: grid; place-content: center; height: 340px; border: 1px dashed #b8cab8; border-radius: 7px; background: #e9efe5; color: var(--muted); text-align: center; }
.gallery-empty span { font-size: 40px; }
.detail-columns { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr); gap: 55px; margin-top: 60px; }
.detail-story { min-width: 0; }
.detail-lead { margin: 18px 0 22px; font-size: clamp(21px, 2.5vw, 29px); line-height: 1.6; letter-spacing: -.03em; }
.detail-description { color: #51695d; font-size: 15px; line-height: 2; }
.detail-disclaimer { margin-top: 35px; padding: 14px 17px; border-left: 3px solid #d29e62; background: #faf2e4; color: #806a50; font-size: 12px; line-height: 1.7; }
.detail-info { align-self: start; padding: 28px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.detail-info h2 { margin: 12px 0 21px; font-size: 24px; }
.detail-info dl { margin: 0; }
.detail-info dl > div { display: grid; grid-template-columns: 82px 1fr; gap: 10px; padding: 14px 0; border-top: 1px solid #ebf0e9; font-size: 13px; line-height: 1.6; }
.detail-info dt { color: #83998a; }
.detail-info dd { margin: 0; overflow-wrap: anywhere; }
.detail-info dd a { color: var(--green); font-weight: 800; text-decoration: none; }
.detail-external { display: grid; gap: 9px; margin-top: 23px; }
.detail-external a { display: block; padding: 13px; border-radius: 5px; background: #e7efe5; color: var(--forest); font-size: 12px; font-weight: 800; text-align: center; text-decoration: none; }
.detail-external a:hover { background: #d4e5d3; }
.detail-next { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 78px; padding-top: 27px; border-top: 1px solid #d9e5d7; font-size: 15px; font-weight: 800; }

/* Footer */
.site-footer { padding-top: 54px; background: var(--forest-dark); color: #d5e4d7; }
.footer-inner { display: flex; justify-content: space-between; gap: 30px; padding-bottom: 58px; }
.footer-brand { color: white; font-size: 26px; font-weight: 900; letter-spacing: -.08em; text-decoration: none; }
.footer-inner p { margin: 10px 0 0; color: #a9c4af; font-size: 13px; }
.footer-links { display: flex; align-items: start; gap: 25px; flex-wrap: wrap; padding-top: 8px; }
.footer-links a { color: #c7decd; font-size: 12px; text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding: 18px 0 25px; border-top: 1px solid #47705a; color: #9fbea8; font-size: 10px; }

@media (max-width: 1000px) {
  .container { width: min(100% - 40px, 1200px); }
  .home-hero { grid-template-columns: 58% 42%; }
  .hero-copy h1 { font-size: clamp(44px, 6vw, 64px); }
  .art-circle-outer { width: 370px; height: 370px; }
  .art-circle-inner { width: 270px; height: 270px; }
  .art-arc { width: 300px; height: 300px; }
  .province-grid, .peer-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .map-layout { grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr); }
  .map-selection, .map-side-note { padding: 25px; }
  .province-hero { grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); }
  .catalog-filters { grid-template-columns: 1fr 1fr; }
  .place-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 750px) {
  .header-inner { min-height: 67px; }
  .main-nav { display: none; }
  .header-link { margin-left: auto; }
  .home-hero { grid-template-columns: 1fr; }
  .hero-copy { padding: 60px 7%; }
  .hero-art { min-height: 300px; }
  .hero-art .art-circle-outer { width: 320px; height: 320px; }
  .hero-art .art-circle-inner { width: 220px; height: 220px; }
  .hero-art .art-arc { width: 255px; height: 255px; }
  .art-title { font-size: 30px; }
  .art-title b { font-size: 100px; margin-top: 3px; }
  .art-coord-top { top: 22px; left: 25px; }
  .art-coord-bottom { bottom: 22px; right: 24px; }
  .art-destination-one { top: 54px; right: 15%; }
  .art-destination-two { top: 155px; left: 11%; }
  .art-destination-three { bottom: 45px; right: 13%; }
  .quick-start { margin-bottom: 70px; }
  .quick-start > span { width: 100%; margin-bottom: 6px; }
  .quick-start a:first-of-type { border-left: 0; padding-left: 0; }
  .section-intro, .areas-heading { display: block; }
  .section-intro > p, .areas-heading > p { margin-top: 14px; max-width: 500px; }
  .map-layout { grid-template-columns: 1fr; }
  .map-side { display: grid; grid-template-columns: 1fr 1fr; }
  .map-selection { min-height: 330px; }
  .map-side-note { min-height: 330px; }
  .province-hero { grid-template-columns: 1fr; }
  .province-hero-copy { padding: 52px 7% 10px; }
  .province-map-card { margin: 20px 7% 28px; }
  .province-mini-map { min-height: 250px; }
  .province-mini-map svg { height: 245px; }
  .topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .area-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-hero-inner { min-height: 240px; }
  .catalog-hero-aside { display: none; }
  .detail-columns { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 520px) {
  .container { width: min(100% - 28px, 1200px); }
  .brand { font-size: 20px; }
  .brand-mark { width: 28px; height: 28px; }
  .header-link { gap: 6px; padding: 9px 10px; font-size: 11px; }
  .home-hero { margin-top: 14px; }
  .hero-copy { padding: 45px 24px 48px; }
  .hero-copy h1 { font-size: clamp(41px, 11vw, 56px); }
  .hero-copy > p { font-size: 14px; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 19px; }
  .hero-actions .button { width: 100%; }
  .hero-meta { margin-top: 40px; }
  .hero-art { min-height: 250px; }
  .art-coord-bottom { display: none; }
  .quick-start { padding: 17px; margin-top: 14px; gap: 3px; }
  .quick-start a { padding: 8px 11px; font-size: 12px; }
  .map-section, .directory-section { padding-top: 70px; }
  .map-section { padding-bottom: 55px; }
  .section-intro h2, .areas-heading h2 { font-size: 32px; }
  .map-scroll { height: 615px; }
  .map-scroll .thailand-map { width: 420px; min-width: 420px; }
  .map-side { grid-template-columns: 1fr; }
  .map-selection { min-height: 290px; }
  .map-side-note { min-height: 205px; }
  .map-side-note strong { margin-top: 28px; }
  .directory-search { gap: 7px; min-height: 58px; padding-left: 13px; }
  .directory-search input { font-size: 12px; }
  .directory-search button { gap: 5px; padding: 0 12px; font-size: 12px; }
  .region-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 5px; }
  .region-filters a { white-space: nowrap; }
  .province-grid, .peer-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .province-card { min-height: 118px; padding: 15px; }
  .province-card strong { font-size: 17px; }
  .card-arrow { right: 14px; top: 13px; }
  .province-hero h1 { font-size: 62px; }
  .province-hero-copy { padding-top: 42px; }
  .province-map-card { margin-top: 9px; }
  .province-summary { grid-template-columns: 1fr; }
  .province-summary > div { padding: 17px 22px; }
  .province-summary > div + div { border-left: 0; border-top: 1px solid #e4e9df; }
  .province-content, .areas-section { padding-top: 74px; }
  .areas-section { padding-bottom: 80px; }
  .topic-grid, .area-list { grid-template-columns: 1fr; }
  .topic-card { min-height: 165px; }
  .areas-empty { align-items: start; padding: 22px; }
  .areas-empty-icon { width: 38px; height: 38px; font-size: 21px; }
  .region-peers { padding: 65px 0 80px; }
  .footer-inner { display: block; padding-bottom: 38px; }
  .footer-links { margin-top: 28px; }
  .catalog-hero-inner { min-height: 220px; padding-top: 35px; padding-bottom: 35px; }
  .catalog-hero h1 { font-size: 50px; }
  .catalog-hero p { font-size: 13px; }
  .catalog-section { padding-top: 53px; padding-bottom: 78px; }
  .catalog-heading { display: block; }
  .catalog-heading p { margin-top: 9px; }
  .catalog-tabs a { padding: 10px 12px; font-size: 12px; }
  .catalog-filters { grid-template-columns: 1fr; padding: 16px; }
  .catalog-filters .button { justify-content: center; }
  .place-grid { grid-template-columns: 1fr; }
  .place-card-media { aspect-ratio: 1.7; }
  .catalog-empty { padding: 25px; }
  .detail-page { padding-top: 9px; padding-bottom: 80px; }
  .detail-header { display: block; }
  .detail-header h1 { font-size: 52px; }
  .detail-back { display: inline-block; margin-top: 24px; }
  .gallery-stage { height: 270px; }
  .gallery-thumbs button { width: 89px; height: 64px; }
  .detail-columns { margin-top: 46px; }
  .detail-info { padding: 22px; }
  .detail-next { align-items: stretch; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .button, .province-card, .map-province path { transition: none; } }

/* Activity calendar and day-by-day journeys */
.itinerary-hero { margin-top:28px; padding:66px clamp(28px,6vw,80px); border-radius:9px; background:linear-gradient(120deg,#163f33,#34745b); color:white; }
.itinerary-hero .eyebrow { color:#f5c67d; }
.itinerary-hero h1 { max-width:740px; margin:19px 0 14px; font-size:clamp(38px,5vw,66px); line-height:1.2; letter-spacing:-.06em; }
.itinerary-hero p { max-width:660px; margin:0; color:#d7eadb; line-height:1.9; }
.itinerary-switch,.route-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:31px; }
.itinerary-switch a,.route-tags span { padding:10px 15px; border:1px solid #9bbdaa78; border-radius:4px; color:#e5f1e8; font-size:13px; font-weight:800; text-decoration:none; }
.itinerary-switch a.active { background:var(--sun); border-color:var(--sun); color:var(--forest-dark); }
.itinerary-layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:38px; padding-top:50px; padding-bottom:95px; }
.itinerary-filters form { display:grid; gap:18px; position:sticky; top:20px; padding:24px; background:#fff; border:1px solid var(--line); border-radius:7px; }
.itinerary-filters label { display:grid; gap:8px; font-size:12px; font-weight:800; color:var(--green); }
.itinerary-filters select,.itinerary-filters input { width:100%; min-height:44px; padding:10px; border:1px solid #ccd9cd; border-radius:5px; background:#fff; color:var(--ink); }
.itinerary-filters button { border:0; cursor:pointer; }
.calendar-heading,.results-heading { display:flex; align-items:end; justify-content:space-between; gap:15px; }
.calendar-heading h2,.results-heading h2,.route-detail-layout h2 { margin:8px 0 0; font-size:clamp(25px,3vw,34px); letter-spacing:-.05em; }
.year-step { display:flex; gap:7px; }
.year-step a { display:grid; place-items:center; width:39px; height:39px; border:1px solid var(--line); border-radius:5px; background:white; text-decoration:none; }
.month-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin:25px 0 40px; }
.month-tile { display:flex; flex-direction:column; min-height:112px; padding:15px; border:1px solid var(--line); border-radius:5px; background:#fff; text-decoration:none; }
.month-tile:hover,.month-tile.selected { border-color:var(--green); background:#e8f1e7; }
.month-tile span { color:var(--green); font-size:10px; font-weight:800; letter-spacing:.08em; }
.month-tile strong { margin:8px 0 2px; font-size:23px; }
.month-tile small { margin-top:auto; color:var(--muted); font-size:11px; }
.results-heading { padding-bottom:18px; border-bottom:1px solid var(--line); }
.results-heading span { color:var(--muted); font-size:12px; }
.event-list { display:grid; }
.event-card { display:grid; grid-template-columns:82px 1fr auto; gap:20px; align-items:start; padding:25px 3px; border-bottom:1px solid var(--line); text-decoration:none; }
.event-card:hover h3,.stop-list a:hover { color:#ad6a35; }
.event-card time { display:grid; place-items:center; padding:11px 0; border-radius:5px; background:#e7ede2; }
.event-card time strong { font-size:31px; line-height:1; }
.event-card time span { color:var(--green); font-size:11px; }
.event-meta { color:var(--green); font-size:12px; font-weight:800; }
.event-card h3 { margin:8px 0 7px; font-size:22px; }
.event-card p,.route-card p { margin:0 0 10px; color:var(--muted); font-size:13px; line-height:1.7; }
.event-arrow { font-size:22px; }
.demo-label { display:inline-block; padding:5px 8px; border-radius:3px; background:#fff1d6; color:#945c27; font-size:11px; font-weight:800; }
.itinerary-empty { margin-top:18px; padding:45px; border:1px dashed #b5cbb8; background:#eef4ec; border-radius:6px; }
.itinerary-empty strong { font-size:19px; }.itinerary-empty p { color:var(--muted); }.itinerary-empty a { color:var(--green); font-weight:800; }
.route-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; margin-top:22px; }
.route-card { position:relative; display:flex; flex-direction:column; min-height:260px; padding:25px; border-radius:7px; background:white; border:1px solid var(--line); text-decoration:none; }
.route-card:hover { border-color:var(--green); box-shadow:0 12px 28px #123d3011; }
.route-card-top,.route-card-bottom { display:flex; justify-content:space-between; color:var(--green); font-size:12px; font-weight:800; }
.route-card-mark { margin-top:25px; font-size:26px; }.route-card h3 { margin:8px 0 10px; font-size:23px; line-height:1.35; }.route-card-bottom { margin-top:auto; padding-top:22px; }
.itinerary-detail,.route-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:55px; padding-top:60px; padding-bottom:100px; }
.itinerary-detail h1 { margin:16px 0 20px; font-size:clamp(37px,5vw,60px); letter-spacing:-.06em; }.detail-lead { margin:26px 0; font-size:20px; line-height:1.7; }.detail-copy { margin:35px 0; line-height:2; }.itinerary-detail .text-link { color:var(--green); }
.itinerary-fact-card { align-self:start; padding:26px; border:1px solid var(--line); border-radius:7px; background:white; }.itinerary-fact-card h2 { margin:0 0 18px; font-size:20px; }.itinerary-fact-card dl { margin:0; }.itinerary-fact-card dl div { padding:14px 0; border-top:1px solid var(--line); }.itinerary-fact-card dt { color:var(--muted); font-size:11px; font-weight:800; }.itinerary-fact-card dd { margin:7px 0 0; font-size:14px; font-weight:700; line-height:1.6; }.itinerary-fact-card .button { margin-top:20px; }.itinerary-fact-card small { display:block; margin-top:16px; color:var(--muted); line-height:1.7; }.itinerary-fact-card p { color:var(--muted); line-height:1.9; }
.route-hero { margin-bottom:0; }.route-detail-layout h2 { margin-top:0; }.route-day { margin-top:28px; padding:26px; border:1px solid var(--line); border-radius:7px; background:#fff; }.route-day-heading { display:flex; align-items:center; gap:17px; border-bottom:1px solid var(--line); padding-bottom:17px; }.route-day-heading span { color:var(--green); font-size:11px; font-weight:900; }.route-day-heading h3 { margin:0; font-size:24px; }.stop-list { list-style:none; margin:0; padding:0; }.stop-list li { display:flex; gap:19px; padding:22px 0; border-bottom:1px solid var(--line); }.stop-list li:last-child { border-bottom:0; padding-bottom:0; }.stop-number { display:grid; place-items:center; flex:none; width:35px; height:35px; border-radius:50%; background:#e8f1e7; color:var(--green); font-size:12px; font-weight:800; }.stop-list h4 { margin:5px 0 8px; font-size:20px; }.stop-list h4 a { text-decoration:none; }.stop-list p,.day-empty { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }.day-empty { padding-top:18px; }
.discovery-links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin-top:-67px; margin-bottom:75px; }.discovery-links a { display:flex; flex-direction:column; min-height:160px; padding:25px 23px; border:1px solid var(--line); border-radius:7px; background:#fff; text-decoration:none; }.discovery-links a:hover { border-color:var(--green); }.discovery-links span { color:var(--green); font-size:11px; font-weight:800; }.discovery-links strong { margin-top:8px; font-size:23px; }.discovery-links small { margin-top:auto; color:var(--muted); font-size:12px; }
@media (max-width:1000px) { .discovery-links { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:850px) { .itinerary-layout { grid-template-columns:1fr; }.itinerary-filters form { position:static; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; }.itinerary-detail,.route-detail-layout { grid-template-columns:1fr; gap:25px; } }
@media (max-width:600px) { .discovery-links { grid-template-columns:1fr; margin-top:-58px; margin-bottom:55px; }.discovery-links a { min-height:130px; }.itinerary-hero { padding:40px 25px; }.itinerary-layout { gap:25px; padding-top:28px; }.itinerary-filters form { grid-template-columns:1fr; }.month-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.month-tile { min-height:92px; padding:10px; }.month-tile strong { font-size:20px; }.event-card { grid-template-columns:62px 1fr; gap:13px; }.event-arrow { display:none; }.event-card h3 { font-size:18px; }.event-card time strong { font-size:24px; }.route-grid { grid-template-columns:1fr; }.route-card { min-height:215px; }.itinerary-empty { padding:28px; }.route-day { padding:18px; } }

/* Travel tools and evergreen articles */
.content-hero { background:linear-gradient(120deg,#173d39,#436d62); }
.service-tabs { display:flex; flex-wrap:wrap; gap:9px; margin:22px 0 25px; }
.service-tabs a { padding:9px 14px; border:1px solid var(--line); border-radius:4px; background:#fff; color:var(--green); font-size:12px; font-weight:800; text-decoration:none; }
.service-tabs a:hover,.service-tabs a.active { border-color:var(--green); background:#e7f0e7; color:var(--forest-dark); }
.service-tabs small { margin-left:4px; color:var(--muted); }
.service-list { display:grid; gap:12px; }
.service-card { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:25px; border:1px solid var(--line); border-radius:6px; background:#fff; }
.service-category { color:var(--green); font-size:11px; font-weight:850; letter-spacing:.08em; }
.service-card h3 { margin:8px 0 9px; font-size:20px; }.service-card p { max-width:600px; margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.service-meta { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-top:14px; color:var(--green); font-size:11px; font-weight:800; }
.service-action { display:inline-flex; justify-content:center; flex:none; min-width:145px; padding:11px 13px; border:1px solid #aac8ae; border-radius:4px; color:var(--forest-dark); font-size:12px; font-weight:850; text-decoration:none; }.service-action:hover { background:#e8f1e7; }
.content-footnote { margin:20px 0 0; color:var(--muted); font-size:12px; line-height:1.8; }
.article-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }
.article-card { display:flex; flex-direction:column; min-height:235px; padding:25px; border:1px solid var(--line); border-radius:6px; background:#fff; text-decoration:none; }.article-card:hover { border-color:var(--green); box-shadow:0 12px 28px #123d3011; }
.article-card-top,.article-card-bottom { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--green); font-size:11px; font-weight:800; }.article-card-top time { color:var(--muted); }
.article-card h3 { margin:22px 0 10px; font-size:23px; line-height:1.4; }.article-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }.article-card-bottom { margin-top:auto; padding-top:20px; }
.content-pagination { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:27px; color:var(--muted); font-size:12px; }.content-pagination a { padding:8px 12px; border:1px solid var(--line); border-radius:4px; background:#fff; text-decoration:none; }
.article-detail { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:65px; padding-top:65px; padding-bottom:110px; }.article-detail-main { max-width:780px; }.article-detail h1 { margin:17px 0 20px; font-size:clamp(37px,5vw,58px); line-height:1.25; letter-spacing:-.05em; }.article-byline { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:12px; }.article-lead { margin:32px 0; padding-left:19px; border-left:3px solid var(--sun); color:var(--forest); font-size:20px; line-height:1.8; }.article-body { margin:35px 0 45px; font-size:16px; line-height:2.1; }.article-body p { margin:0 0 24px; }.article-back,.article-aside-link { display:inline-block; color:var(--green); font-size:13px; font-weight:800; text-decoration:none; }.article-back:hover,.article-aside-link:hover { text-decoration:underline; }.article-aside-link { margin-top:19px; }
.province-resources { padding-top:45px; padding-bottom:75px; }.province-resource-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.province-resource-grid a { display:flex; flex-direction:column; min-height:150px; padding:24px; border:1px solid var(--line); border-radius:6px; background:white; text-decoration:none; }.province-resource-grid a:hover { border-color:var(--green); }.province-resource-grid span { color:var(--green); font-size:11px; font-weight:800; }.province-resource-grid strong { margin-top:9px; font-size:23px; }.province-resource-grid small { margin-top:auto; color:var(--muted); font-size:12px; }
@media (min-width:751px) and (max-width:1100px) { .header-inner { flex-wrap:wrap; padding-top:12px; padding-bottom:12px; }.header-link { margin-left:auto; }.main-nav { order:3; width:100%; justify-content:space-between; margin-left:0; gap:8px; } }
@media (max-width:850px) { .article-detail { grid-template-columns:1fr; gap:24px; }.service-card { align-items:start; flex-direction:column; }.service-action { min-width:0; } }
@media (max-width:600px) { .article-grid,.province-resource-grid { grid-template-columns:1fr; }.article-card { min-height:210px; }.article-detail { padding-top:38px; }.article-body { font-size:15px; }.province-resources { padding-top:28px; padding-bottom:50px; } }

/* Anonymous place voting and site search */
.place-vote { display:flex; justify-content:space-between; align-items:center; gap:30px; margin:35px 0 25px; padding:30px; border:1px solid var(--line); border-radius:7px; background:#fff; scroll-margin-top:30px; }
.place-vote h2 { margin:10px 0 9px; font-size:27px; }.place-vote p { margin:0; color:var(--muted); font-size:13px; line-height:1.75; }
.vote-controls { min-width:295px; }.vote-totals { display:flex; gap:20px; margin-bottom:15px; color:var(--muted); font-size:12px; }.vote-totals strong { color:var(--forest); font-size:22px; }
.vote-controls form { display:flex; gap:9px; }.vote-controls button { padding:11px 15px; border:1px solid var(--forest); border-radius:4px; background:var(--forest); color:white; font-weight:800; cursor:pointer; }.vote-controls button + button { background:white; color:var(--forest); }.vote-controls button:hover { opacity:.86; }
.place-vote .vote-feedback { margin-top:12px; color:#31754b; font-weight:800; }.vote-controls .vote-complete { color:#31754b; font-weight:800; }.detail-external small { display:block; margin-top:8px; color:var(--muted); font-size:11px; line-height:1.6; }
.search-hero { background:linear-gradient(120deg,#143b37,#376e66); }.search-content { padding-top:38px; padding-bottom:100px; }.search-form { display:grid; grid-template-columns:minmax(180px,2fr) minmax(150px,1fr) minmax(170px,1fr) auto; gap:12px; align-items:end; margin-bottom:32px; padding:21px; border:1px solid var(--line); border-radius:7px; background:#fff; }.search-form label { display:grid; gap:7px; color:var(--green); font-size:12px; font-weight:800; }.search-form input,.search-form select { width:100%; height:47px; padding:10px; border:1px solid #ccd9cd; border-radius:4px; background:#fff; color:var(--ink); }.search-form button { height:47px; border:0; cursor:pointer; }
.search-results { display:grid; margin-top:12px; }.search-result { display:grid; grid-template-columns:100px 1fr auto; gap:18px; padding:22px 4px; border-bottom:1px solid var(--line); text-decoration:none; }.search-result:hover h3 { color:#ad6a35; }.search-result-type { align-self:start; padding:7px 9px; border-radius:3px; background:#e5eee2; color:var(--green); font-size:11px; font-weight:850; text-align:center; }.search-result h3 { margin:6px 0 8px; font-size:20px; }.search-result p { margin:0; color:var(--muted); font-size:13px; line-height:1.7; }.search-result > span:last-child { font-size:22px; }
@media (max-width:850px) { .place-vote { align-items:start; flex-direction:column; }.search-form { grid-template-columns:1fr 1fr; }.search-query { grid-column:1 / -1; } }
@media (max-width:600px) { .place-vote { padding:21px; }.vote-controls { min-width:0; }.search-form { grid-template-columns:1fr; }.search-query { grid-column:auto; }.search-result { grid-template-columns:64px 1fr; gap:11px; }.search-result > span:last-child { display:none; } }