body{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR","Noto Sans Thai",Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
header>a:first-child{font-size:21px;font-weight:900;letter-spacing:-.035em}
.hero{position:relative;overflow:hidden;padding-top:42px;padding-bottom:30px;background:linear-gradient(128deg,#043e33 0%,#087b61 54%,#11a27d 100%)}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 25%,#76e0bd2b 0 2px,transparent 3px) 0 0/24px 24px;opacity:.7}
.hero-inner,.hero-controls{position:relative;z-index:1;max-width:980px;margin:auto}
.hero-inner{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);align-items:center;gap:32px}
.hero-copy>small{display:inline-flex;align-items:center;min-height:28px;padding:6px 10px;border:1px solid #d9fff252;border-radius:999px;background:#d9fff21a;color:#c9ffed;font-size:12px;font-weight:900;letter-spacing:.16em}
.hero h1{max-width:680px;margin:14px 0 10px;font-size:clamp(34px,5vw,54px);font-weight:900;line-height:1.08;letter-spacing:-.045em}
.hero p{max-width:640px;margin-bottom:14px;font-size:16px;font-weight:600;line-height:1.55}
.hero-trust{display:flex;flex-wrap:wrap;gap:7px}.hero-trust span{padding:6px 9px;border-radius:7px;background:#042d26a8;color:#d7fff2;font-size:10px;font-weight:900;letter-spacing:.1em}
.hero-visual{position:relative;min-height:210px;padding:31px;border:1px solid #ffffff36;border-radius:28px;background:linear-gradient(145deg,#ffffff1f,#062f287a);box-shadow:0 24px 55px #022d244f;isolation:isolate}
.hero-visual strong{display:block;color:#9ef1d4;font-size:12px;letter-spacing:.18em}.hero-visual>b{display:block;margin-top:12px;color:#fff;font-size:31px;line-height:1.05;letter-spacing:-.035em}
.hero-service-icons{position:absolute;left:24px;right:24px;bottom:22px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.hero-service-icons span{display:grid;place-items:center;min-height:34px;border-radius:9px;background:#fff;color:#075c49;font-size:9px;font-weight:900;box-shadow:0 5px 16px #022d2433}
.hero-orbit{position:absolute;z-index:-1;border:1px solid #a5ffe044;border-radius:50%}.orbit-one{width:160px;height:160px;right:-35px;top:-55px}.orbit-two{width:105px;height:105px;right:18px;top:-25px}
.hero-controls{margin-top:25px}.search{max-width:720px}.search input{min-height:52px;font-weight:650;box-shadow:0 10px 30px #022d2438}.search button{border:2px solid transparent;background:#f7c453;color:#17241f;box-shadow:0 8px 20px #4d33082e}
.filters button{min-height:38px;border-width:1.5px;font-size:13px;transition:background .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}.filters button:hover{background:#ffffff2b}.filters button.active{background:#fff;color:#075c49;box-shadow:0 0 0 2px #f7c453,0 7px 18px #022d2430;transform:translateY(-1px)}.filters button.active:before{content:"✓ ";color:#d58b00}
.shop-copy h2{font-weight:900;letter-spacing:-.025em}.shop-copy p{font-size:13.5px;line-height:1.55}.badge.warning{background:#fff7e7;color:#795e26;border:1px solid #efdcae}.commission-badge{background:#dff7ee!important;color:#067158!important;border:1px solid #a8decd}
.price-from a,.book,.list-tools button{font-weight:850;box-shadow:none;transition:transform .15s ease,box-shadow .15s ease}.price-from a:hover,.book:hover,.list-tools button:hover{transform:translateY(-1px);box-shadow:0 8px 18px #075c4924}
@media(max-width:720px){.hero{padding-top:26px}.hero-inner{grid-template-columns:1fr;gap:18px}.hero h1{font-size:35px}.hero p{font-size:14px}.hero-visual{min-height:138px;padding:20px 22px;border-radius:20px}.hero-visual>b{font-size:24px}.hero-service-icons{left:auto;width:190px;bottom:17px}.hero-controls{margin-top:18px}.hero-copy>small{font-size:10px}.filters button{min-height:36px}.shop-card{box-shadow:0 7px 22px #163d3012}}

/* ThailandMate home hero — visual first, search and filters underneath */
.hero{padding:42px max(16px,calc((100% - 980px)/2)) 30px;background-color:#087b61;background-image:radial-gradient(circle at 15% 18%,rgba(117,231,194,.18) 0 2px,transparent 2.5px),radial-gradient(circle at 82% 70%,rgba(117,231,194,.14) 0 2px,transparent 2.5px),linear-gradient(128deg,#043e33 0%,#087b61 54%,#11a27d 100%);background-size:24px 24px,28px 28px,100% 100%}
.hero:before{background:radial-gradient(circle at 78% 25%,rgba(118,224,189,.22) 0 2px,transparent 3px) 0 0/24px 24px;opacity:.52}
.hero-inner{max-width:980px;grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr);gap:34px}
.hero-copy h1{font-size:clamp(38px,5.4vw,58px);text-shadow:0 2px 0 rgba(0,0,0,.08)}
.hero-copy p{font-size:16px;max-width:620px}
.hero-trust span{border-radius:7px;padding:7px 10px;background:rgba(2,45,38,.78)}
.hero-visual{min-height:210px;padding:32px 30px;border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(3,54,44,.52));border-color:rgba(193,255,235,.26)}
.hero-visual>b{font-size:32px}
.hero-controls{max-width:980px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(184,255,231,.24)}
.hero-controls .search{max-width:720px}
.hero-controls .search input{min-height:54px;border-radius:12px;padding-inline:16px}
.hero-controls .search button{min-width:54px;border-radius:12px}
.hero-controls .filters{margin-top:12px}
/* Use the supplied ThailandMate hero artwork on desktop. The semantic HTML remains
   in the document for search engines and is shown again on small screens. */
@media(min-width:721px){
  .hero{background-image:url('/thailandmate-hero-art.png'),linear-gradient(128deg,#043e33 0%,#087b61 54%,#11a27d 100%);background-repeat:no-repeat,repeat;background-position:top center,0 0;background-size:100% 256px,100% 100%}
  .hero-inner{min-height:256px}
  .hero-inner>.hero-copy,.hero-inner>.hero-visual{visibility:hidden}
}
@media(max-width:720px){.hero{padding:28px 16px 24px}.hero-inner{grid-template-columns:1fr;gap:20px}.hero-copy h1{font-size:clamp(34px,10vw,46px)}.hero-copy p{font-size:15px}.hero-visual{min-height:160px;padding:23px 22px}.hero-visual>b{font-size:27px}.hero-controls{margin-top:20px;padding-top:18px}.hero-controls .search{grid-template-columns:minmax(0,1fr) 52px}.hero-controls .filters{margin-right:-16px;padding-right:16px}}

/* Real Thailand destination image supplied by the owner */
.hero{
  background-image:linear-gradient(90deg,rgba(3,58,47,.86) 0%,rgba(3,86,68,.62) 48%,rgba(3,55,46,.38) 100%),url('/thailandmate-thailand-hero.png');
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
.hero:before{display:none}
.hero-inner>.hero-copy,.hero-inner>.hero-visual{visibility:visible}
.hero-copy>small,.hero-trust span{background:rgba(2,45,38,.78)}
@media(max-width:720px){.hero{background-position:58% center;background-size:auto 100%;}.hero-inner>.hero-copy,.hero-inner>.hero-visual{visibility:visible}}

/* Keep the public search landing readable on narrow phones. The shared
   readability layer intentionally enlarges type, so grid items must be
   allowed to shrink and long localized copy must wrap inside the viewport. */
@media(max-width:720px){
  .hero-inner,.hero-copy,.hero-controls{min-width:0;max-width:100%}
  .hero-copy h1{max-width:100%;color:#fff;overflow-wrap:anywhere;word-break:keep-all}
  .hero-copy p{max-width:100%;color:#d6f5eb;overflow-wrap:anywhere}
}