style: fix style utility class inconsistencies and correct CSS syntax

Clean up style-related code across all components:
- Replace deprecated color-* classes with text-[color]/text-white equivalents
- Remove redundant border-box declarations and fix broken empty box-sizing rule
- Correct invalid rounded corner class syntax
- Standardize line-height to leading-[value] utilities
- Uniform margin and padding notation to [xxpx] format

src/pages/home/components/PoiDetailCard/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="poi-detail-card bg-white rounded-24 border-box overflow-hidden">
+  <div class="poi-detail-card bg-white rounded-24  overflow-hidden">
     <div class="poi-detail-card__hero relative">
       <image class="poi-detail-card__image w-full h-full block rounded-18" :src="data.image" mode="aspectFill" />
       <div class="poi-detail-card__badge flex flex-items-center gap-4 font-size-10 font-900">
@@ -21,7 +21,7 @@
       </div>
 
       <div
-        class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 color-white bg-0F172A font-size-16 font-900"
+        class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 text-white bg-0F172A font-size-16 font-900"
         :class="{ 'is-disabled': disabled }" @click="handleAction">
         <span class="poi-detail-card__button-icon">↗</span>
         <span>{{ data.action?.text }}</span>