html.toolbox-document { scroll-behavior:auto; }
.page-toolbox { background:#fbfaf7; }
.toolbox-hero { position:relative; display:flex; align-items:center; min-height:315px; overflow:hidden; background:#163d43 url('/assets/destinations/surat-thani.jpg') center 48%/cover no-repeat; color:#fff; }
.toolbox-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,27,32,.85) 0%,rgba(11,36,42,.62) 39%,rgba(6,33,38,.08) 78%),linear-gradient(0deg,rgba(8,29,32,.2),transparent 65%); }
.toolbox-hero-inner { position:relative; padding-top:45px; padding-bottom:63px; }
.toolbox-kicker,.toolbox-eyebrow { font-size:11px; font-weight:800; letter-spacing:.17em; }
.toolbox-kicker { color:#f6d398; }
.toolbox-hero h1 { margin:11px 0 12px; font-family:"Noto Serif SC","Songti SC","SimSun",serif; font-size:clamp(39px,4.4vw,60px); line-height:1.2; }
.toolbox-hero p { margin:0; color:#f2f7f5; font-size:15px; line-height:1.8; }
.toolbox-hero-note { display:block; margin-top:16px; color:#ffdf9d; font-size:15px; font-weight:700; }
.toolbox-category-tile:focus-visible,.toolbox-service-card a:focus-visible { outline:3px solid #2f7add; outline-offset:2px; }
.toolbox-main { padding-top:58px; padding-bottom:90px; }
.toolbox-section-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:22px; }
.toolbox-eyebrow { color:#997b4f; }
.toolbox-section-head h2 { margin:5px 0 0; color:#18383d; font-family:"Noto Serif SC","Songti SC","SimSun",serif; font-size:clamp(23px,2.5vw,30px); }
.toolbox-section-head p { margin:0 0 3px; color:#7a8b8b; font-size:13px; }
.toolbox-category-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:9px; }
.toolbox-category-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; min-height:101px; padding:12px 5px; border:1px solid #ecf0ee; border-radius:10px; background:linear-gradient(150deg,#fff,#f3f8fa); color:#2b474c; text-align:center; text-decoration:none; transition:transform .15s,border-color .15s,box-shadow .15s; }
.toolbox-category-tile:hover { transform:translateY(-3px); border-color:#adccdf; box-shadow:0 6px 17px #244f5020; }
.toolbox-category-tile.is-active { border-color:#337bd5; box-shadow:inset 0 0 0 1px #337bd5; }
.toolbox-category-all .toolbox-category-icon { background:#eaf2ff; color:#2f74d2; }
.toolbox-category-icon { display:grid; place-items:center; width:37px; height:37px; border-radius:9px; background:#eaf4ff; color:#3981df; font-size:25px; font-weight:800; line-height:1; }
.toolbox-category-name { font-size:12px; font-weight:800; line-height:1.3; }
.toolbox-category-hotels .toolbox-category-icon,.toolbox-category-visa_entry .toolbox-category-icon,.toolbox-category-luggage .toolbox-category-icon { background:#fff0ef; color:#e87473; }
.toolbox-category-attractions .toolbox-category-icon,.toolbox-category-car_rental .toolbox-category-icon,.toolbox-category-currency_payment .toolbox-category-icon { background:#fff4e7; color:#e49a3f; }
.toolbox-category-ride_hailing .toolbox-category-icon,.toolbox-category-maps_navigation .toolbox-category-icon,.toolbox-category-insurance .toolbox-category-icon { background:#e7f7f0; color:#36a889; }
.toolbox-category-translation .toolbox-category-icon,.toolbox-category-shopping_tax .toolbox-category-icon { background:#f1eefe; color:#8975d8; }
.toolbox-ad-slot { margin-top:25px; }
.toolbox-results { scroll-margin-top:90px; }
.toolbox-results[aria-busy="true"] { opacity:.65; }
.toolbox-results-summary { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-top:40px; padding-bottom:15px; border-bottom:1px solid #e0e7e5; }
.toolbox-results-summary h2 { margin:4px 0; color:#18383d; font-family:"Noto Serif SC","Songti SC","SimSun",serif; font-size:28px; }
.toolbox-results-summary p { margin:0; color:#7d8e90; font-size:13px; }
.toolbox-results-summary > a { color:#2c70bd; font-size:13px; font-weight:700; text-decoration:none; }
.toolbox-group { margin-top:37px; }
.toolbox-group-filtered { margin-top:18px; }
.toolbox-group-filtered .toolbox-service-grid { margin-top:0; }
.toolbox-group-head { display:flex; justify-content:space-between; align-items:end; gap:16px; padding-bottom:14px; border-bottom:1px solid #e4e9e6; }
.toolbox-group-title { display:flex; align-items:center; gap:13px; min-width:0; }
.toolbox-group-icon { display:grid; place-items:center; flex:none; width:39px; height:39px; border-radius:10px; background:#eaf4ff; color:#3981df; font-size:24px; }
.toolbox-group-name { display:flex; align-items:baseline; flex-wrap:wrap; gap:11px; }
.toolbox-group-name h3 { margin:0; color:#1a3a3f; font-family:"Noto Serif SC","Songti SC","SimSun",serif; font-size:23px; }
.toolbox-group-name span { color:#81959a; font-size:11px; font-weight:800; letter-spacing:.04em; }
.toolbox-group-head p { margin:4px 0 0; color:#83918e; font-size:12px; }
.toolbox-group-count { flex:none; color:#6f8787; font-size:12px; }
.toolbox-service-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-top:15px; }
.toolbox-service-card { display:flex; flex-direction:column; align-items:center; min-width:0; min-height:230px; padding:20px 15px 18px; border:1px solid #e9eeeb; border-radius:10px; background:#fff; text-align:center; }
.toolbox-service-top { position:relative; display:flex; justify-content:center; width:100%; }
.toolbox-service-logo { display:grid; place-items:center; width:58px; height:58px; border-radius:11px; background:#f3f7f8; }
.toolbox-service-logo img { display:block; width:46px; height:46px; object-fit:contain; }
.toolbox-service-monogram { display:grid; place-items:center; width:45px; height:45px; border-radius:9px; background:#eaf2fc; color:#2a6ecc; font-size:20px; font-weight:900; }
.toolbox-service-place { position:absolute; right:0; top:0; color:#849492; font-size:11px; }
.toolbox-service-card h4 { margin:13px 0 6px; color:#213d42; font-size:16px; }
.toolbox-service-card p { margin:0 0 11px; color:#708380; font-size:12px; line-height:1.6; }
.toolbox-demo { margin-bottom:8px; padding:3px 6px; border-radius:4px; background:#fff3e8; color:#a97042; font-size:10px; }
.toolbox-service-card a { display:inline-flex; align-items:center; justify-content:center; min-height:34px; margin-top:auto; padding:0 17px; border:1px solid #d7e5ef; border-radius:20px; background:#fbfdff; color:#2872c5; font-size:12px; font-weight:800; text-decoration:none; }
.toolbox-service-card a:hover { border-color:#8dbbdf; background:#edf6ff; }
.toolbox-empty { margin-top:35px; padding:40px 20px; border:1px solid #e5ece9; border-radius:10px; background:#fff; text-align:center; }
.toolbox-empty > span { color:#6b9acf; font-size:38px; }.toolbox-empty h3 { margin:4px 0 7px; color:#203e42; }.toolbox-empty p { margin:0 auto 17px; color:#788b8a; font-size:13px; }.toolbox-empty a { color:#286dc4; font-size:13px; font-weight:800; text-decoration:none; }
.toolbox-footnote { margin:34px 0 0; color:#8a9894; font-size:11px; line-height:1.7; }
@media(max-width:1100px) { .toolbox-category-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }.toolbox-service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:750px) { .toolbox-hero { min-height:270px; background-position:62% center; }.toolbox-hero-inner { padding-top:35px; padding-bottom:48px; }.toolbox-hero h1 { font-size:41px; }.toolbox-hero p { font-size:13px; }.toolbox-hero-note { font-size:13px; }.toolbox-main { padding-top:43px; }.toolbox-section-head { display:block; }.toolbox-section-head p { margin-top:5px; }.toolbox-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }.toolbox-category-tile { min-height:86px; }.toolbox-category-name { font-size:11px; }.toolbox-service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }.toolbox-service-card { min-height:190px; padding:13px; }.toolbox-group-name h3 { font-size:20px; } }
@media(max-width:440px) { .toolbox-hero { min-height:250px; }.toolbox-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.toolbox-category-tile { min-height:82px; }.toolbox-category-icon { width:33px; height:33px; font-size:22px; }.toolbox-service-grid { grid-template-columns:1fr 1fr; }.toolbox-service-card h4 { font-size:14px; }.toolbox-group-name span { display:none; } }
