@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;600;700&family=Kanit:wght@400;500;600;700&family=Mitr:wght@400;500;600;700&display=swap');
:root{--blue:#1948d8;--ink:#20302a;--muted:#6a716b;--bg:#f6f5f0;--paper:#fffefa;--line:#dedfd7;--green:#315d45;--lime:#d5e58b;--thai:'Bai Jamjuree',sans-serif;--latin:'Bai Jamjuree',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 var(--thai)}button,input,select{font:inherit}button,a,select,input{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #698b55;outline-offset:4px}.icon{display:inline-block;width:17px;height:17px;flex-shrink:0;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}header{height:82px;max-width:1280px;margin:auto;padding:0 42px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:9px;align-items:center;font:700 27px/1 var(--latin);letter-spacing:0}.mark{width:34px;height:34px;background:var(--blue);color:#fff;display:grid;place-items:center;border-radius:9px;font:italic 700 32px/.9 var(--latin)}.brand-sub{display:block;font:600 8px/1.2 var(--latin);letter-spacing:2px;margin-top:5px}nav{display:flex;gap:32px}nav a{padding:12px 0;color:var(--muted)}nav .active{color:var(--ink);font-weight:600}.owner{border-bottom:1px solid #9da59b;padding:7px 0;font-weight:500}.owner span{margin-left:9px}main{max-width:1280px;padding:0 42px;margin:auto}.hero{display:grid;grid-template-columns:.85fr 1.15fr;min-height:415px;margin:36px 0 27px;background:#efeee7}.hero-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:38px 44px 28px}.eyebrow{font:600 12px/1.5 var(--thai);letter-spacing:.15px}.eyebrow i{display:inline-block;height:7px;width:7px;background:var(--green);border-radius:50%;margin:0 8px 1px 0}h1{font-size:clamp(34px,3.4vw,46px);line-height:1.42;letter-spacing:0;margin:24px 0 13px;font-weight:600}.hero-copy p{font-size:15px;line-height:1.95;color:#59645d;margin:0}.hero-link{display:inline-flex;gap:14px;align-items:center;margin-top:19px;color:var(--green);font-weight:600}.hero-link span{display:flex}.hero-link .icon{width:20px;height:20px}.hero-bottom{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;color:#68746a;margin-top:36px;padding-top:15px;border-top:1px solid #d4d6cc}.hero-bottom span:last-child{display:flex;align-items:center;gap:5px}.hero-bottom .icon{width:13px;height:13px}.hero-art{position:relative;overflow:hidden;min-height:415px;background:#a5ae94}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 46%}.art-top,.art-label{position:absolute;left:22px}.art-top{top:20px;background:var(--paper);padding:5px 10px;font-size:11px;color:var(--ink)}.art-label{bottom:20px;background:var(--paper);padding:9px 14px;color:var(--ink)}.art-label>span{font-size:14px;line-height:1.4;font-weight:500}.search-wrap{position:relative;margin:0 0 68px;padding:15px 18px;background:var(--paper);border:1px solid var(--line)}form{display:grid;grid-template-columns:1.65fr 1fr 1fr auto;gap:17px;align-items:center}form label{border-right:1px solid var(--line);padding-right:17px}form label>span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}form input,form select{border:0;background:transparent;width:100%;color:var(--ink);height:34px;min-width:0}form select{padding:0 6px 0 0}form input{outline:none}.search-field div{display:flex;align-items:center;gap:9px}.search-field b{display:flex;color:var(--muted)}.search-field .icon{width:17px}.primary{border:0;background:var(--green);color:white;padding:13px 20px;border-radius:3px;font-weight:500}.primary span{margin-left:12px}.primary .icon{width:15px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.eyebrow.muted{color:var(--green)}h2{font-size:25px;margin:6px 0;font-weight:600;line-height:1.55;letter-spacing:0}.section-heading p{margin:4px 0;color:var(--muted);font-size:13px}.demo{font-size:11px;color:#6f766f;padding:5px 0;border-bottom:1px solid #c6c9bf}.toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-top:22px;padding-bottom:13px;gap:15px}.sport-tabs{display:flex;gap:7px;flex-wrap:wrap}.sport-tabs button{border:1px solid transparent;background:transparent;color:#58635c;border-radius:3px;padding:8px 12px;min-height:40px}.sport-tabs button .icon{width:15px;height:15px;margin-right:4px}.sport-tabs .selected{background:#e8ebdf;color:#233d2e;border-color:#d9ddcd}.indoor{display:flex;gap:8px;align-items:center;white-space:nowrap;color:#48554c;font-size:13px}.indoor input{accent-color:var(--green);width:17px;height:17px}.result-bar{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px;margin:18px 0 15px}.result-bar select{border:0;background:transparent;color:var(--ink);padding:8px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px}.card{background:transparent;border:0;border-bottom:1px solid var(--line);overflow:hidden;padding-bottom:14px}.card-media{position:relative;aspect-ratio:1.65;background:#e6e8df;overflow:hidden}.card-media img{height:100%;width:100%;object-fit:cover;display:block}.tag{position:absolute;top:11px;left:11px;background:var(--paper);padding:4px 9px;font-size:11px;border-radius:2px;color:#314539}.media-note{position:absolute;bottom:9px;right:9px;color:#fff;background:#26362eb8;font-size:10px;padding:3px 7px}.card-body{padding:14px 1px 0}.location{color:var(--muted);font-size:12px}.location .icon{width:13px;height:13px;margin-right:3px}.card h3{font-size:18px;margin:4px 0 8px;font-weight:600}.features{display:flex;flex-wrap:wrap;gap:0;color:#647067;font-size:12px}.features span{font-size:12px;padding:0;background:none;color:inherit;border-radius:0}.features span+span:before{content:'·';padding:0 7px;color:#a2a99e}.card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px;padding-top:8px}.card-foot small{font-size:11px;color:var(--muted)}.card-foot button{color:var(--green);background:none;border:0;border-bottom:1px solid #8b9a8b;padding:5px 0;font-size:12px;font-weight:500;min-height:35px}.card-foot .icon{width:13px;height:13px;margin-left:5px}.destinations{margin-top:76px}.cities{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.cities button{text-align:left;border:0;border-right:1px solid var(--line);background:transparent;padding:17px 20px;color:var(--ink);min-height:110px}.cities button:first-child{border-left:1px solid var(--line)}.cities button small{font:500 11px var(--latin);color:#667368}.cities strong{display:block;font-size:19px;margin:8px 0;font-weight:500}.cities span{font-size:11px;color:var(--green)}.cities .icon{width:12px;height:12px;margin-left:3px}.owner-banner{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#e9ece3;color:var(--ink);padding:27px 30px;margin:65px 0 40px;border-left:3px solid var(--green)}.owner-banner .eyebrow{color:var(--green)}.owner-banner h2{font-size:21px;margin:3px 0}.owner-banner p{color:#59645d;font-size:13px;margin:0}.owner-banner button{background:var(--green);color:white;border:0;border-radius:3px;padding:12px 18px;white-space:nowrap;font-weight:500}.owner-banner .icon{width:14px;height:14px;margin-left:8px}footer{max-width:1280px;margin:auto;padding:23px 42px 29px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);gap:20px}footer p,footer small{color:var(--muted);font-size:11px}dialog{border:0;border-radius:6px;padding:32px;max-width:520px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 18px 65px #1c302322;background:var(--paper)}dialog::backdrop{background:#18281c75}dialog p{line-height:1.9;color:var(--muted)}.close{position:absolute;right:12px;top:12px;border:0;background:#eff0ea;width:36px;height:36px;border-radius:50%;display:grid;place-items:center}.close .icon{width:18px;height:18px}dialog h2{margin-top:20px}#empty{text-align:center;padding:48px 20px;border:1px dashed var(--line)}#empty p{color:var(--muted)}
@media(min-width:1500px){main,header,footer{max-width:1380px}.hero{min-height:445px}.hero-art{min-height:445px}}
@media(max-width:950px){header,main,footer{padding-left:24px;padding-right:24px}nav{gap:18px}.hero-copy{padding:28px}.hero-art{min-height:360px}.hero{min-height:360px}h1{font-size:36px}form{grid-template-columns:1.5fr 1fr 1fr}.primary{grid-column:1/-1}.cards{grid-template-columns:repeat(2,1fr)}.cities{grid-template-columns:repeat(2,1fr)}.section-heading{align-items:flex-start}.demo{max-width:240px}footer p{display:none}}
@media(max-width:600px){header{height:72px;padding:0 18px}.brand{font-size:25px}.mark{height:32px;width:32px;font-size:30px}nav{display:none}.owner{font-size:12px;padding:7px 0}.owner span{margin-left:4px}main{padding:0 16px}.hero{grid-template-columns:1fr;margin:20px 0 20px}.hero-copy{padding:25px 23px 18px}.hero-art{min-height:245px}.hero-bottom{margin-top:23px;font-size:10px}h1{font-size:35px;margin:13px 0 7px}.hero-copy p{font-size:14px}.art-label{bottom:14px;left:14px;padding:8px 11px}.art-top{top:14px;left:14px}.search-wrap{padding:14px;margin-bottom:48px}form{grid-template-columns:1fr 1fr;gap:12px}form .search-field{grid-column:1/-1;border-bottom:1px solid var(--line);padding-bottom:8px;border-right:0}form label{padding-right:8px}form label:nth-child(3){border-right:0}.primary{width:100%}.section-heading{flex-direction:column;gap:7px}h2{font-size:22px}.demo{max-width:none}.toolbar{align-items:flex-start;flex-direction:column}.sport-tabs{gap:3px}.sport-tabs button{padding:7px 8px;font-size:12px}.cards{grid-template-columns:1fr;gap:20px}.card-media{aspect-ratio:1.8}.card h3{font-size:19px}.cities{gap:0}.cities button{padding:13px 12px;min-height:100px}.cities strong{font-size:16px}.owner-banner{padding:22px;flex-direction:column;align-items:flex-start;margin-top:45px;gap:16px}.owner-banner h2{font-size:20px}.owner-banner button{width:100%}footer{padding:22px 18px;align-items:flex-start}footer small{max-width:160px;text-align:right}footer .brand{font-size:23px}.destinations{margin-top:50px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Nationwide discovery: keep filters compact and results easy to scan. */
form{grid-template-columns:1.55fr .9fr .82fr 1fr auto}.result-bar{min-height:33px}.pagination{display:flex;justify-content:center;align-items:center;gap:6px;margin:28px auto 0}.pagination[hidden]{display:none}.pagination button{min-width:38px;height:38px;padding:0 10px;border:1px solid transparent;background:transparent;color:var(--ink);border-radius:3px}.pagination button[aria-current="page"]{background:var(--green);color:white}.pagination button:disabled{color:#abb0a8;cursor:default}.pagination span{padding:0 3px;color:var(--muted)}@media(max-width:950px){form{grid-template-columns:1.4fr 1fr 1fr}.search-field{grid-column:1/-1;border-right:0!important;border-bottom:1px solid var(--line);padding-bottom:8px}.search-wrap form label:nth-child(3){border-right:1px solid var(--line)}}@media(max-width:600px){form{grid-template-columns:1fr 1fr;gap:12px}.search-field{grid-column:1/-1}.search-wrap form label{border-right:1px solid var(--line);padding-right:8px}.search-wrap form label:nth-child(3){border-right:0}.search-wrap form label:nth-child(4){grid-column:1/-1;border-right:0;border-top:1px solid var(--line);padding-top:8px}.pagination{gap:2px}.pagination button{min-width:34px;height:36px;padding:0 7px;font-size:12px}}
.cities{grid-template-columns:repeat(3,minmax(0,1fr))}.cities button{transition:background-color .15s ease}.cities button:hover{background:#e9ece3}.cities button:nth-child(n){background:transparent}.cities button:hover{background:#e9ece3}@media(max-width:600px){.cities{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Court type stays independent from the air-conditioning amenity. */
@media(max-width:950px){form{grid-template-columns:repeat(2,minmax(0,1fr))}.search-wrap .search-field{grid-column:1/-1}.search-wrap form .primary{grid-column:1/-1}}
@media(max-width:600px){.search-wrap form label:nth-child(n+2){border-right:1px solid var(--line);border-top:0;padding-top:0}.search-wrap form label:nth-child(3),.search-wrap form label:nth-child(5){border-right:0}.search-wrap form label:nth-child(4){grid-column:auto}.search-wrap form label:nth-child(5){grid-column:auto}}

/* Thai-first type with a warmer, less condensed rhythm. */
body,button,input,select{font-family:var(--thai)}h1,h2,h3{font-family:var(--thai);letter-spacing:0;font-weight:600}.brand{font-family:var(--latin)}.hero-link{gap:0}.owner{gap:0}

/* Kanit headlines add pace; Mitr section and venue titles stay warm. */
h1{font-family:'Kanit',var(--thai),sans-serif;font-weight:600;line-height:1.3}h2,h3,.card h3{font-family:'Mitr',var(--thai),sans-serif;font-weight:500;letter-spacing:0}h2{line-height:1.45}.card h3{line-height:1.35}
/* A brighter court-side palette: lime, coral and aqua accents on warm paper. */
:root{--ink:#203129;--muted:#68736c;--bg:#faf8f0;--paper:#fffef9;--line:#e5e1d4;--green:#285e43;--lime:#d8f36b;--sport-coral:#ff8a70;--sport-aqua:#80d8ca;--sport-lilac:#c4b7f1}
.hero-copy{background:#f2f0dc}.hero-link{color:#b64d38}.hero-bottom{border-color:#d6d8bd}.search-wrap{border-color:#dcdcc9}.primary{background:var(--lime);color:#233522}.primary:hover{background:#c8e753}.demo{color:#6e722e;border-color:#c8d984}.eyebrow.muted{color:#347350}.tag{font-weight:600}.card:nth-child(3n+1) .tag{background:var(--lime);color:#263523}.card:nth-child(3n+2) .tag{background:var(--sport-coral);color:#40241d}.card:nth-child(3n) .tag{background:var(--sport-aqua);color:#193831}.media-note{background:#193c2dbd;color:#fff}.sport-tabs button[data-sport="พิคเกิลบอล"].selected{background:var(--lime);border-color:#b4ce53;color:#263523}.sport-tabs button[data-sport="เทนนิส"].selected{background:var(--sport-coral);border-color:#ed775e;color:#40241d}.sport-tabs button[data-sport="แบดมินตัน"].selected{background:var(--sport-aqua);border-color:#64b9aa;color:#193831}.sport-tabs .selected[data-sport="all"]{background:#315d45;border-color:#315d45;color:white}.pagination button[aria-current="page"]{background:var(--sport-coral);color:#39221b}.owner-banner{background:#edf0d7;border-left-color:#8aac32}.owner-banner .eyebrow{color:#47652a}.cities button:nth-child(1){background:#f2f1dd}.cities button:nth-child(2){background:#f4eee0}.cities button:nth-child(3){background:#e5f2ed}.cities button:nth-child(4){background:#f8e8df}.cities button:nth-child(5){background:#e4f1ec}.cities button:nth-child(6){background:#eee8f8}.cities button:first-child{border-left:1px solid var(--line)}.cities button:hover{filter:saturate(1.12)}.cities span,.card-foot button{color:#315d45}.close:focus-visible,.primary:focus-visible{outline-color:#234b35}#empty{border-color:#ddcf83}
/* Cool, light surfaces balance the playful sport accents. */
:root{--bg:#f3f6fa;--paper:#ffffff;--line:#dce4ec;--muted:#677482}
body{background:var(--bg)}.hero-copy{background:#eaf1fa}.search-wrap{background:#fff;border-color:#dce4ec}.owner-banner{background:#e4f1ed;border-left-color:#55a98d}.owner-banner .eyebrow{color:#34745c}.cities button:nth-child(1){background:#edf5dd}.cities button:nth-child(2){background:#e9f4ed}.cities button:nth-child(3){background:#e7eff9}.cities button:nth-child(4){background:#e1f4f1}.cities button:nth-child(5){background:#e9edfa}.cities button:nth-child(6){background:#f0ebfa}.demo{color:#5f6d78;border-color:#cad6df}
/* Nationwide results are browsed as compact regional sections. */
.region-group{grid-column:1/-1}.region-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 15px;padding-bottom:10px;border-bottom:1px solid var(--line)}.region-heading h3,.region-result-heading h3{font:500 21px/1.4 'Mitr',var(--thai),sans-serif;margin:0;color:var(--ink)}.region-heading p,.region-result-heading p{font-size:12px;color:var(--muted);margin:2px 0 0}.region-heading button{border:0;border-bottom:1px solid #59805d;background:transparent;color:#315d45;padding:8px 0;font:500 13px var(--thai)}.region-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:32px}.region-result-heading{grid-column:1/-1;margin:2px 0 4px}.card h4{font:500 19px/1.35 'Mitr',var(--thai),sans-serif;letter-spacing:0;margin:4px 0 8px;color:var(--ink)}@media(max-width:950px){.region-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.region-cards{grid-template-columns:1fr;gap:20px;margin-bottom:25px}.region-heading{margin-top:3px}.region-heading h3,.region-result-heading h3{font-size:19px}}
